/* Graphite design system — shared base for the asset manager frontend.
   Rebuilt pixel-for-pixel from the "Asset Manager Graphite" design. */
:root {
  --bg:#eeecea; --card:#fff; --ink:#111; --ink2:#1a1714;
  --line:#e8e8e8; --line2:#f0f0f0; --line3:#f6f6f6;
  --mut:#8e8e8e; --mut2:#a8a8a8; --dim:#b5b5b5; --faint:#c4c4c4;
  --red:#a33; --red-line:#e5c9c9;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --sans:Archivo,Helvetica,Arial,sans-serif;
  --shadow:0 22px 54px -34px rgba(0,0,0,.45);
}
* { box-sizing:border-box; }
html, body { margin:0; }
body {
  background:var(--bg); color:var(--ink); font-family:var(--sans);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility;
}
a { color:var(--ink2); text-decoration:none; }
a:hover { color:#b5533a; }
::-webkit-scrollbar { width:8px; height:8px; }
::-webkit-scrollbar-thumb { background:rgba(0,0,0,.18); border-radius:8px; }
button, input, textarea, select { font-family:inherit; color:inherit; }
input, textarea { outline:none; }

/* helpers */
.mono { font-family:var(--mono); }
.click { cursor:pointer; }
.u { border-bottom:1px solid #e0e0e0; }
.hovrow:hover { background:#fafafa; }
@keyframes gspin { to { transform:rotate(360deg); } }
.hs::-webkit-scrollbar { display:none; }
.hs { scrollbar-width:none; -ms-overflow-style:none; }
.hovsb:hover { background:#f0f0f0; color:#111 !important; }
.hovsb:hover > span:last-child { color:#a8a8a8; }
.lnk { cursor:pointer; color:#111; border-bottom:1px solid #e0e0e0; }
.lnk:hover { color:#b5533a; }
.del { cursor:pointer; color:var(--red); }
/* toggle pill */
.tg { width:32px; height:18px; border-radius:999px; padding:2px; transition:background .15s ease; flex:none; }
.tg > div { width:14px; height:14px; border-radius:999px; background:#fff; transition:margin-left .15s ease; }
/* text inputs styled as the design's "filled field" boxes */
.field { border:1px solid #d8d8d8; border-radius:6px; background:#fff; padding:12px 13px; font:500 13px/1 var(--sans); width:100%; }
.field::placeholder { color:#b5b5b5; font-weight:400; }
.field:focus { border-color:#111; }