/* Job tracker styles */
@font-face{font-family:Geist;src:url("./fonts/Geist-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("./fonts/GeistMono-Variable.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  color-scheme:dark;
  --font:Geist,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --bg:#09090b;--bg-side:#0c0c0e;--surface:#111113;--surface-2:#16161a;--surface-3:#1d1d22;--overlay:#141417;
  --border:rgba(255,255,255,.065);--border-2:rgba(255,255,255,.1);--border-3:rgba(255,255,255,.16);
  --text:#ededef;--text-2:#a3a3ab;--text-3:#6f6f78;--text-4:#48484f;
  --accent:#5b8def;--accent-2:#7ea6f4;--accent-soft:rgba(91,141,239,.14);--ring:rgba(91,141,239,.55);
  --primary-bg:#ededef;--primary-fg:#0b0b0d;--primary-hover:#ffffff;
  --danger:#e5646a;--danger-soft:rgba(229,100,106,.12);--good:#3ecf8e;--good-text:#4fd69a;
  --st-applications:#4d94ff;--st-ready:#e6a23c;--st-leads:#8b8b95;--st-interviews:#a594f9;--st-offers:#3ecf8e;--st-unsuccessful:#e5646a;--st-attention:#f0843c;
  --chart:#5b8def;--chart-soft:rgba(91,141,239,.1);--grid:rgba(255,255,255,.06);
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow-md:0 0 0 1px var(--border),0 8px 24px -6px rgba(0,0,0,.55);
  --shadow-lg:0 0 0 1px var(--border-2),0 24px 64px -12px rgba(0,0,0,.7),0 8px 20px -8px rgba(0,0,0,.5);
  --highlight:inset 0 1px 0 rgba(255,255,255,.04);
  --r-sm:6px;--r:8px;--r-md:10px;--r-lg:14px;--r-xl:18px;
  --ease:cubic-bezier(.16,1,.3,1);--ease-in:cubic-bezier(.4,0,1,1);--spring:cubic-bezier(.34,1.4,.64,1);
  --fast:120ms;--mid:220ms;--slow:420ms;
  --side:236px;
  font-family:var(--font);font-size:14px;line-height:1.5;color:var(--text);background:var(--bg);
  font-synthesis:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;
  font-feature-settings:"ss01","cv11";letter-spacing:-.006em
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#fafaf9;--bg-side:#f4f4f3;--surface:#ffffff;--surface-2:#f4f4f3;--surface-3:#ebebea;--overlay:#ffffff;
  --border:rgba(15,15,20,.075);--border-2:rgba(15,15,20,.11);--border-3:rgba(15,15,20,.18);
  --text:#17171a;--text-2:#5b5b63;--text-3:#8a8a92;--text-4:#b8b8be;
  --accent:#2a6fdb;--accent-2:#1f5fc4;--accent-soft:rgba(42,111,219,.1);--ring:rgba(42,111,219,.45);
  --primary-bg:#17171a;--primary-fg:#ffffff;--primary-hover:#2c2c31;
  --danger:#d64545;--danger-soft:rgba(214,69,69,.09);--good:#16a06a;--good-text:#0f8a59;
  --st-applications:#2a78d6;--st-ready:#c98500;--st-leads:#8a8a92;--st-interviews:#6d5ae0;--st-offers:#16a06a;--st-unsuccessful:#d64545;--st-attention:#e0632a;
  --chart:#2a6fdb;--chart-soft:rgba(42,111,219,.08);--grid:rgba(15,15,20,.07);
  --shadow-sm:0 1px 2px rgba(15,15,20,.06);
  --shadow-md:0 0 0 1px var(--border),0 6px 20px -8px rgba(15,15,20,.12);
  --shadow-lg:0 0 0 1px var(--border),0 24px 60px -16px rgba(15,15,20,.25),0 8px 20px -10px rgba(15,15,20,.12);
  --highlight:inset 0 1px 0 rgba(255,255,255,.6)
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;min-height:100%}
html{scrollbar-gutter:stable}
body{background:var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
button:disabled{opacity:.45;cursor:not-allowed}
a{color:var(--accent-2);text-decoration:none;text-underline-offset:3px}
a:hover{text-decoration:underline}
h1,h2,h3,p{margin:0}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:var(--r-sm)}
::selection{background:var(--accent-soft);color:var(--text)}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.muted{color:var(--text-3)}
.error{color:var(--danger);font-size:.86rem;min-height:1.3em}
.hint{color:var(--text-3);font-size:.8rem}
kbd{font-family:var(--mono);font-size:.68rem;font-weight:500;line-height:1;display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:4px;color:var(--text-3);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border-2)}
.ico{width:16px;height:16px;flex:none;display:block}
[data-icon]{display:inline-grid;place-items:center;flex:none}
.eyebrow{font-family:var(--mono);font-size:.68rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;height:32px;padding:0 .8rem;border-radius:var(--r);font-weight:520;font-size:.86rem;white-space:nowrap;transition:background var(--fast),color var(--fast),box-shadow var(--fast),transform var(--fast) var(--ease)}
.btn:active:not(:disabled){transform:scale(.97)}
.btn .ico{width:15px;height:15px}
.btn-primary{background:var(--primary-bg);color:var(--primary-fg);box-shadow:var(--shadow-sm),inset 0 0 0 1px rgba(255,255,255,.08)}
.btn-primary:hover:not(:disabled){background:var(--primary-hover)}
.btn-primary kbd{background:transparent;color:inherit;opacity:.5;box-shadow:inset 0 0 0 1px currentColor}
.btn-ghost{color:var(--text-2);box-shadow:inset 0 0 0 1px var(--border-2);background:var(--surface)}
.btn-ghost:hover:not(:disabled){color:var(--text);background:var(--surface-2)}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:hover{filter:brightness(1.08)}
.btn-sm{height:28px;padding:0 .6rem;font-size:.8rem;border-radius:7px}
.btn-lg{height:44px;font-size:.95rem;border-radius:10px;padding:0 1rem}
.btn.is-busy .btn-label::after{content:"";display:inline-block;width:12px;height:12px;margin-left:.5rem;vertical-align:-1px;border-radius:50%;border:1.6px solid currentColor;border-right-color:transparent;animation:spin .7s linear infinite}
.icon-btn{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:var(--r);color:var(--text-3);position:relative;transition:background var(--fast),color var(--fast)}
.icon-btn:hover{color:var(--text);background:var(--surface-2)}
.icon-btn.spin .ico{animation:spin .8s var(--ease)}
[data-tip]{position:relative}
[data-tip]:hover::after{content:attr(data-tip);position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);background:var(--surface-3);color:var(--text);font-size:.72rem;font-weight:500;padding:.25rem .45rem;border-radius:5px;white-space:nowrap;box-shadow:var(--shadow-md);pointer-events:none;z-index:30;animation:tip .18s var(--ease) .35s both}
.sidebar [data-tip]:hover::after{top:auto;bottom:calc(100% + 6px)}

/* Mark */
.mark{display:grid;place-items:center;width:26px;height:26px;border-radius:7px;font-weight:700;font-size:.82rem;letter-spacing:-.04em;color:#fff;background:linear-gradient(145deg,#6d8ef5 0%,#4a62d8 55%,#3a3fae 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),inset 0 -1px 0 rgba(0,0,0,.2),0 2px 8px -2px rgba(74,98,216,.6)}
.mark-lg{width:48px;height:48px;border-radius:13px;font-size:1.35rem}

/* Gate */
.gate{min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:2rem 1rem;position:relative;overflow:hidden;background:var(--bg);isolation:isolate}
.gate-bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;will-change:transform}
.orb-a{width:520px;height:520px;left:50%;top:-18%;margin-left:-420px;background:radial-gradient(circle,rgba(91,141,239,.55),transparent 65%);animation:drift-a 22s ease-in-out infinite alternate}
.orb-b{width:460px;height:460px;left:50%;top:-8%;margin-left:-20px;background:radial-gradient(circle,rgba(140,110,245,.4),transparent 65%);animation:drift-b 26s ease-in-out infinite alternate}
.orb-c{width:600px;height:600px;left:50%;bottom:-45%;margin-left:-300px;background:radial-gradient(circle,rgba(62,207,142,.16),transparent 65%);animation:drift-a 30s ease-in-out infinite alternate-reverse}
:root[data-theme="light"] .orb{opacity:.35}
.gate-grid{position:absolute;inset:0;background-image:radial-gradient(var(--border-3) 1px,transparent 1px);background-size:24px 24px;mask-image:radial-gradient(ellipse 60% 55% at 50% 40%,#000 20%,transparent 75%);opacity:.5}
.gate-inner{width:min(100%,380px);display:flex;flex-direction:column;align-items:center;text-align:center;animation:rise .9s var(--ease) both}
.gate-mark{margin-bottom:1.8rem;position:relative}
.gate-mark::after{content:"";position:absolute;inset:-14px;border-radius:22px;border:1px solid var(--border-2);mask-image:linear-gradient(#000,transparent)}
.gate-kicker{font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);margin-bottom:.8rem}
.gate h1{font-size:clamp(2rem,6vw,2.6rem);font-weight:620;letter-spacing:-.045em;line-height:1.05;margin-bottom:.8rem;background:linear-gradient(180deg,var(--text) 30%,color-mix(in srgb,var(--text) 55%,transparent));-webkit-background-clip:text;background-clip:text;color:transparent}
.gate h1 span{display:block}
.gate-lede{color:var(--text-2);margin-bottom:2rem;max-width:30ch}
.gate form{width:100%;display:grid;gap:.85rem}
.otp{position:relative;height:56px}
.otp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:2;cursor:text;font-size:16px}
.otp-slots{display:grid;grid-template-columns:repeat(6,1fr);gap:.5rem;height:100%}
.otp-slots span{display:grid;place-items:center;border-radius:11px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--border-2),var(--highlight);font-size:1.4rem;font-weight:600;color:var(--text);transition:box-shadow var(--mid) var(--ease),background var(--mid),transform var(--mid) var(--spring)}
.otp-slots span.filled{animation:pop .28s var(--spring)}
.otp-slots span.filled::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--text)}
.otp:focus-within .otp-slots span.active{box-shadow:inset 0 0 0 1.5px var(--accent),0 0 0 4px var(--accent-soft)}
.otp:focus-within .otp-slots span.active:not(.filled)::after{content:"";width:1.5px;height:22px;background:var(--text);animation:caret 1s steps(1) infinite}
.otp.invalid .otp-slots{animation:shake .42s cubic-bezier(.36,.07,.19,.97)}
.otp.invalid .otp-slots span{box-shadow:inset 0 0 0 1.5px var(--danger)}
.otp.ok .otp-slots span{box-shadow:inset 0 0 0 1.5px var(--good);transition-delay:calc(var(--i,0)*40ms)}
.gate .btn-lg{width:100%;justify-content:space-between}
.gate .error{margin:0;min-height:1.3em}
.gate-note{color:var(--text-3);font-size:.76rem;margin-top:1.4rem;max-width:34ch;line-height:1.5}
.gate.leaving .gate-inner{animation:gate-out .5s var(--ease-in) forwards}
.gate.leaving .gate-bg{transition:opacity .5s;opacity:0}

/* App shell */
.app{display:flex;min-height:100vh;min-height:100dvh}
.app.entering .sidebar{animation:slide-in .6s var(--ease) both}
.app.entering .main{animation:fade .7s var(--ease) .08s both}
.sidebar{width:var(--side);flex:none;display:flex;flex-direction:column;gap:.15rem;padding:.75rem .6rem .6rem;background:var(--bg-side);border-right:1px solid var(--border);position:sticky;top:0;height:100vh;height:100dvh;z-index:40}
.brand{display:flex;align-items:center;gap:.6rem;padding:.35rem .5rem .8rem}
.brand-type{display:grid;line-height:1.2;min-width:0}
.brand-type strong{font-size:.86rem;font-weight:600}
.brand-type small{font-size:.72rem;color:var(--text-3)}
.sb-search{display:flex;align-items:center;gap:.5rem;height:32px;margin:0 .1rem .7rem;padding:0 .4rem 0 .6rem;border-radius:var(--r);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border-2),var(--highlight);color:var(--text-3);font-size:.82rem;transition:box-shadow var(--fast),color var(--fast)}
.sb-search:hover{color:var(--text-2);box-shadow:inset 0 0 0 1px var(--border-3)}
.sb-search span:nth-child(2){flex:1;text-align:left}
.sb-nav{display:grid;gap:1px}
.nav-item{display:flex;align-items:center;gap:.6rem;height:30px;padding:0 .55rem;border-radius:7px;color:var(--text-2);font-size:.86rem;font-weight:480;text-align:left;position:relative;transition:background var(--fast),color var(--fast)}
.nav-item:hover{background:var(--surface-2);color:var(--text)}
.nav-item.active{background:var(--surface-3);color:var(--text);font-weight:540}
.nav-item.active::before{content:"";position:absolute;left:-.6rem;top:7px;bottom:7px;width:2px;border-radius:2px;background:var(--text);animation:grow-y .3s var(--ease)}
.nav-item span:nth-child(2){flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-item .ico{color:var(--text-3)}
.nav-item.active .ico,.nav-item:hover .ico{color:var(--text)}
.nav-count{font-family:var(--mono);font-size:.7rem;color:var(--text-3);font-variant-numeric:tabular-nums}
.sb-section{font-size:.72rem;font-weight:520;color:var(--text-3);padding:1.1rem .55rem .35rem}
.sb-foot{margin-top:auto;display:grid;gap:.4rem;padding-top:.6rem;border-top:1px solid var(--border)}
.sync-card{display:flex;align-items:center;gap:.6rem;padding:.5rem .55rem;border-radius:var(--r)}
.sync-card div{display:grid;line-height:1.25;min-width:0}
.sync-card strong{font-size:.78rem;font-weight:540}
.sync-card small{font-size:.7rem;color:var(--text-3)}
.sb-foot-actions{display:flex;gap:.2rem;padding:0 .2rem}
.signal{position:relative;width:7px;height:7px;flex:none;border-radius:50%;background:var(--st-ready)}
.signal::after{content:"";position:absolute;inset:-3px;border-radius:50%;background:inherit;opacity:.35;animation:ping 2.4s var(--ease) infinite}
.is-cloud .signal{background:var(--good)}
.sb-scrim{position:fixed;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(2px);z-index:35;animation:fade .2s}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:.75rem;height:52px;padding:0 1.25rem;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--border)}
.menu-btn{display:none}
.breadcrumb{display:flex;align-items:center;gap:.35rem;font-size:.86rem;color:var(--text-3);min-width:0}
.breadcrumb b{font-weight:540;color:var(--text);white-space:nowrap}
.crumb-sep .ico{width:14px;height:14px;opacity:.6}
.top-actions{margin-left:auto;display:flex;align-items:center;gap:.3rem}
.sync-pill{display:inline-flex;align-items:center;gap:.45rem;height:26px;padding:0 .6rem;margin-right:.35rem;border-radius:99px;font-family:var(--mono);font-size:.66rem;letter-spacing:.05em;color:var(--text-2);box-shadow:inset 0 0 0 1px var(--border-2)}
.menu-wrap{position:relative}
.menu{position:absolute;right:0;top:calc(100% + 6px);min-width:220px;padding:.3rem;border-radius:var(--r-md);background:var(--overlay);box-shadow:var(--shadow-lg);z-index:50;transform-origin:top right;animation:menu-in .18s var(--ease)}
.menu button{display:flex;align-items:center;gap:.6rem;width:100%;height:32px;padding:0 .6rem;border-radius:6px;font-size:.84rem;color:var(--text-2);text-align:left}
.menu button:hover,.menu button:focus-visible{background:var(--surface-2);color:var(--text);outline:none}
.top-actions .btn-primary{margin-left:.35rem}

.content{width:100%;max-width:1320px;margin:0 auto;padding:1.75rem 1.5rem 3rem;view-transition-name:content}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.page-head h1{font-size:1.6rem;font-weight:620;letter-spacing:-.035em;line-height:1.2}
.page-sub{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem;font-size:.82rem;color:var(--text-3);margin-top:.3rem}
.dot-sep{width:3px;height:3px;border-radius:50%;background:var(--text-4)}
.range,.segmented{display:inline-flex;padding:2px;border-radius:var(--r);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border-2)}
.range button,.segmented button{height:26px;min-width:36px;padding:0 .55rem;border-radius:6px;font-family:var(--mono);font-size:.7rem;color:var(--text-3);display:inline-grid;place-items:center;transition:background var(--fast),color var(--fast)}
.range button:hover,.segmented button:hover{color:var(--text)}
.range button[aria-pressed="true"],.segmented button[aria-pressed="true"]{background:var(--surface-3);color:var(--text);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--border-2)}
.segmented button{min-width:30px;padding:0 .4rem}

.sync-strip{display:flex;align-items:center;gap:.7rem;padding:.6rem .8rem;margin-bottom:1.25rem;border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border),var(--highlight);font-size:.82rem;color:var(--text-2)}
.sync-strip p{flex:1;min-width:0}
.sync-strip strong{color:var(--text);font-weight:560;margin-right:.25rem}
.sync-icon{width:26px;height:26px;border-radius:7px;background:var(--surface-2);color:var(--st-ready);box-shadow:inset 0 0 0 1px var(--border)}
.is-cloud .sync-icon{color:var(--good)}
.sync-icon .ico{width:15px;height:15px}

/* Entrance animation */
.reveal{animation:rise .6s var(--ease) both;animation-delay:calc(var(--i,0)*55ms)}

/* KPIs */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin-bottom:.75rem}
.kpi{position:relative;display:flex;flex-direction:column;gap:.35rem;padding:1rem 1.1rem 1.05rem;border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border),var(--highlight);cursor:pointer;overflow:hidden;transition:box-shadow var(--mid),transform var(--mid) var(--ease)}
.kpi:hover{box-shadow:inset 0 0 0 1px var(--border-2),var(--highlight);transform:translateY(-1px)}
.kpi-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem}
.kpi-label{display:inline-flex;align-items:center;gap:.45rem;font-size:.82rem;font-weight:520;color:var(--text-2)}
.kpi-hint{font-size:.72rem;color:var(--text-3)}
.kpi-value{font-size:2.15rem;font-weight:600;letter-spacing:-.045em;line-height:1.1;margin-top:.35rem}
.kpi-foot{font-size:.76rem;color:var(--text-3);min-height:1.2em;display:flex;flex-wrap:wrap;align-items:center;column-gap:.3rem}
.kpi-foot span{white-space:nowrap}
.kpi-foot b{color:var(--text-2);font-weight:520}
.spot::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity var(--slow);background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),color-mix(in srgb,var(--accent) 9%,transparent),transparent 45%)}
.spot:hover::before{opacity:1}

/* Panels */
.dash-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:.75rem}
.panel{position:relative;display:flex;flex-direction:column;min-width:0;padding:1.1rem 1.15rem 1.1rem;border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border),var(--highlight)}
.panel-activity{grid-column:span 8}.panel-pipeline{grid-column:span 4}
.panel-next{grid-column:span 5}.panel-recent{grid-column:span 4}.panel-fit{grid-column:span 3}
.panel-fit .chart{flex:1;min-height:170px}
.sub-panel{margin-top:auto;padding-top:1rem;border-top:1px solid var(--border)}
.pipeline-legend{margin-bottom:1rem}
.sub-panel h3{font-size:.8rem;font-weight:560}
.sub-panel p{font-size:.72rem;color:var(--text-3);margin:.1rem 0 .75rem}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.panel-head h2{font-size:.92rem;font-weight:580;letter-spacing:-.015em}
.panel-head p{font-size:.76rem;color:var(--text-3);margin-top:.15rem}
.panel-note{font-size:.72rem;color:var(--text-3);margin-top:.75rem}
.hero{display:grid;justify-items:end;line-height:1.1;text-align:right}
.hero strong{font-size:2.3rem;font-weight:600;letter-spacing:-.05em}
.hero span{font-size:.74rem;color:var(--text-3)}
.hero .delta{margin-top:.2rem;font-family:var(--mono);font-size:.68rem}
.delta.up{color:var(--good-text)}
.delta.down{color:var(--text-2)}

/* Charts */
.chart{position:relative;height:210px;margin:0 -.2rem}
.chart-sm{height:170px}
.chart svg{display:block;width:100%;height:100%;overflow:visible}
.chart .gridline{stroke:var(--grid);stroke-width:1;shape-rendering:crispEdges}
.chart .baseline{stroke:var(--border-3);stroke-width:1;shape-rendering:crispEdges}
.chart .tick{fill:var(--text-3);font-family:var(--mono);font-size:10px}
.chart .cap{fill:var(--text-2);font-family:var(--mono);font-size:10.5px;font-weight:500}
.chart .col{fill:var(--chart);transition:opacity var(--fast)}
.chart .col.zero{fill:var(--border-3)}
.chart .band{fill:transparent;cursor:crosshair}
.chart .band:hover{fill:var(--chart-soft)}
.chart .band-line{stroke:var(--border-3);stroke-width:1;opacity:0;shape-rendering:crispEdges}
.chart.hovering .col{opacity:.45}
.chart.hovering .col.hot{opacity:1}
.chart.animate .col{transform-box:fill-box;transform-origin:50% 100%;animation:grow-col .7s var(--ease) both;animation-delay:calc(var(--i,0)*18ms)}
.chart.animate .cap{animation:fade .5s var(--ease) both;animation-delay:calc(200ms + var(--i,0)*18ms)}
.chart-foot{display:flex;justify-content:space-between;margin-top:.5rem;font-family:var(--mono);font-size:.66rem;color:var(--text-3);letter-spacing:.02em}
.tooltip{position:absolute;top:0;left:0;z-index:5;min-width:150px;max-width:240px;padding:.55rem .65rem;border-radius:9px;background:var(--overlay);box-shadow:var(--shadow-lg);font-size:.76rem;pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity var(--fast),transform var(--mid) var(--ease)}
.tooltip.show{opacity:1;transform:none}
.tooltip b{display:block;font-weight:560;margin-bottom:.15rem}
.tooltip .tt-value{display:flex;align-items:center;gap:.4rem;color:var(--text-2)}
.tooltip .tt-value i{width:8px;height:8px;border-radius:2px;background:var(--chart)}
.tooltip ul{margin:.35rem 0 0;padding:.35rem 0 0;border-top:1px solid var(--border);list-style:none;color:var(--text-3)}
.tooltip li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.pipeline-bar{display:flex;gap:2px;height:10px;border-radius:99px;overflow:hidden;background:var(--surface-2);margin-bottom:1.1rem}
.pipeline-bar span{height:100%;flex-grow:0;flex-basis:0;min-width:0;transition:flex-grow .9s var(--ease)}
.seg-applications{background:var(--st-applications)}.seg-ready{background:var(--st-ready)}.seg-leads{background:var(--st-leads)}.seg-interviews{background:var(--st-interviews)}.seg-offers{background:var(--st-offers)}.seg-unsuccessful{background:var(--st-unsuccessful)}.seg-attention{background:var(--st-attention)}
.pipeline-bar .pipeline-empty{flex:1;font-size:.7rem;color:var(--text-3);display:grid;place-items:center}
.pipeline-legend{display:grid;gap:1px}
.legend-row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.6rem;padding:.4rem .5rem;margin:0 -.5rem;border-radius:7px;font-size:.84rem;color:var(--text-2);text-align:left;transition:background var(--fast),color var(--fast)}
.legend-row:hover{background:var(--surface-2);color:var(--text)}
.legend-row strong{font-weight:560;color:var(--text);font-variant-numeric:tabular-nums}
.legend-row small{font-family:var(--mono);font-size:.68rem;color:var(--text-3);min-width:3.2em;text-align:right;font-variant-numeric:tabular-nums}

.bar-list{display:grid;gap:.7rem}
.bar-row{display:grid;grid-template-columns:minmax(90px,.9fr) 2fr auto;align-items:center;gap:.75rem;font-size:.82rem;color:var(--text-2)}
.bar-track{height:8px;border-radius:0 4px 4px 0;background:transparent;position:relative}
.bar-fill{position:absolute;inset:0 auto 0 0;border-radius:0 4px 4px 0;background:var(--chart);width:0;transition:width .9s var(--ease)}
.bar-row strong{font-family:var(--mono);font-size:.76rem;font-weight:500;color:var(--text);min-width:1.5em;text-align:right}
.empty-mini{font-size:.82rem;color:var(--text-3);padding:1.2rem 0;text-align:center}

/* Status icon + pill */
.si{width:14px;height:14px;flex:none;display:block}
.si-slot{display:inline-grid}
.st-applications{color:var(--st-applications)}.st-ready{color:var(--st-ready)}.st-leads{color:var(--st-leads)}.st-interviews{color:var(--st-interviews)}.st-offers{color:var(--st-offers)}.st-unsuccessful{color:var(--st-unsuccessful)}.st-attention{color:var(--st-attention)}
.pill{display:inline-flex;align-items:center;gap:.4rem;height:22px;padding:0 .5rem 0 .4rem;border-radius:99px;font-size:.74rem;font-weight:500;color:var(--text-2);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.pill .si{width:12px;height:12px}
.pill span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.card-foot .pill{min-width:0}
.card-foot .when{flex:none}

/* Mini lists (overview) */
.mini-list{display:grid;gap:1px;margin:0 -.5rem}
.mini-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:.7rem;padding:.5rem;border-radius:8px;text-align:left;transition:background var(--fast)}
.mini-row:hover{background:var(--surface-2)}
.mini-row .t{min-width:0;display:grid;line-height:1.3}
.mini-row .t b{font-weight:540;font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-row .t small{color:var(--text-3);font-size:.76rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.timeline{list-style:none;margin:0 -.5rem;padding:0;display:grid;gap:1px}
.timeline li{position:relative}
.timeline li:not(:last-child)::after{content:"";position:absolute;left:calc(.5rem + 6.5px);top:30px;bottom:-8px;width:1px;background:var(--border-2)}
.when{font-family:var(--mono);font-size:.7rem;color:var(--text-3);white-space:nowrap}

/* Fit meter */
.fit{display:inline-flex;align-items:center;gap:.45rem;font-family:var(--mono);font-size:.7rem;color:var(--text-2);font-variant-numeric:tabular-nums}
.fit-track{width:36px;height:4px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.fit-fill{display:block;height:100%;border-radius:4px;background:var(--chart)}
.fit.medium .fit-fill{background:color-mix(in srgb,var(--chart) 55%,var(--text-3))}

/* Records toolbar */
.toolbar{position:sticky;top:52px;z-index:10;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.6rem;padding:.6rem 0;margin:-.25rem 0 .5rem;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.chips{display:flex;flex-wrap:wrap;gap:.3rem}
.chip{display:inline-flex;align-items:center;gap:.4rem;height:28px;padding:0 .65rem;border-radius:99px;font-size:.8rem;color:var(--text-2);box-shadow:inset 0 0 0 1px var(--border-2);transition:background var(--fast),color var(--fast),box-shadow var(--fast)}
.chip:hover{color:var(--text);background:var(--surface-2)}
.chip[aria-pressed="true"]{background:var(--text);color:var(--bg);box-shadow:none}
.chip[aria-pressed="true"] .si{color:inherit}
.chip span.n{font-family:var(--mono);font-size:.68rem;opacity:.65}
.toolbar-right{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.search{display:flex;align-items:center;gap:.45rem;height:32px;width:280px;padding:0 .4rem 0 .6rem;border-radius:var(--r);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border-2);color:var(--text-3);transition:box-shadow var(--fast)}
.search:focus-within{box-shadow:inset 0 0 0 1px var(--accent),0 0 0 3px var(--accent-soft)}
.search input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:.84rem;color:var(--text)}
.search input::placeholder{color:var(--text-3)}
.search input::-webkit-search-cancel-button{filter:grayscale(1);opacity:.5}
.select-wrap{position:relative;display:inline-flex}
.select-wrap select{appearance:none;-webkit-appearance:none;height:32px;padding:0 1.9rem 0 .7rem;border:0;border-radius:var(--r);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border-2);font-size:.82rem;color:var(--text-2);cursor:pointer;width:100%}
.select-wrap::after{content:"";position:absolute;right:.7rem;top:50%;width:6px;height:6px;margin-top:-5px;border-right:1.5px solid var(--text-3);border-bottom:1.5px solid var(--text-3);transform:rotate(45deg);pointer-events:none}
.select-wrap select:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--accent),0 0 0 3px var(--accent-soft)}
select option{background:var(--overlay);color:var(--text)}

/* Records list */
.group{margin-bottom:1rem}
.group-head{display:flex;align-items:center;gap:.55rem;width:100%;height:36px;padding:0 .75rem;border-radius:var(--r);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);font-size:.84rem;font-weight:560;text-align:left;transition:background var(--fast)}
.group-head:hover{background:var(--surface-3)}
.group-head .chev{color:var(--text-3);transition:transform var(--mid) var(--ease)}
.group.collapsed .group-head .chev{transform:rotate(-90deg)}
.group-head .n{font-family:var(--mono);font-size:.72rem;font-weight:400;color:var(--text-3)}
.group-body{display:grid;grid-template-rows:1fr;transition:grid-template-rows var(--slow) var(--ease)}
.group.collapsed .group-body{grid-template-rows:0fr}
.group-inner{overflow:hidden;min-height:0}
.rows{padding-top:2px}
.row{display:grid;grid-template-columns:18px minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,1.2fr) 84px 72px 150px;align-items:center;gap:.9rem;min-height:52px;padding:.45rem .75rem;border-bottom:1px solid var(--border);cursor:pointer;position:relative;transition:background var(--fast)}
.row:hover,.row:focus-visible{background:var(--surface);outline:none}
.row:focus-visible{box-shadow:inset 2px 0 0 var(--accent)}
.row .main-cell{min-width:0;display:grid;line-height:1.3}
.row .main-cell b{font-weight:540;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .main-cell small{font-size:.78rem;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cell{font-size:.8rem;color:var(--text-2);min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cell.dim{color:var(--text-3)}
.row .when{text-align:right}
.row-actions{display:flex;justify-content:flex-end;gap:.15rem;opacity:0;transform:translateX(4px);transition:opacity var(--fast),transform var(--mid) var(--ease)}
.row:hover .row-actions,.row:focus-within .row-actions,.mini-row:hover .row-actions,.mini-row:focus-within .row-actions,.card:hover .row-actions,.card:focus-within .row-actions{opacity:1;transform:none}
.row-actions .icon-btn{width:28px;height:28px}
.row-actions .apply-btn{display:inline-flex;align-items:center;gap:.3rem;height:26px;padding:0 .5rem;border-radius:6px;font-size:.74rem;font-weight:540;color:var(--text);background:var(--surface-3);box-shadow:inset 0 0 0 1px var(--border-2)}
.row-actions .apply-btn:hover{background:var(--primary-bg);color:var(--primary-fg)}
.row-actions .apply-btn .ico{width:13px;height:13px}
.row.enter{animation:row-in .45s var(--ease) both;animation-delay:calc(var(--i,0)*22ms)}
.more-row{display:flex;align-items:center;justify-content:center;gap:.4rem;width:100%;height:38px;font-size:.8rem;color:var(--text-3);border-bottom:1px solid var(--border);transition:color var(--fast),background var(--fast)}
.more-row:hover{color:var(--text);background:var(--surface)}
.empty{display:grid;justify-items:center;gap:.4rem;padding:3.5rem 1rem;text-align:center;color:var(--text-3);font-size:.86rem;border-radius:var(--r-lg);box-shadow:inset 0 0 0 1px var(--border)}
.empty b{color:var(--text-2);font-weight:540;font-size:.92rem}
.empty .ico{width:22px;height:22px;margin-bottom:.3rem}
.row.bin-row{grid-template-columns:18px minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,1.2fr) 150px}
.status-cell{overflow:visible}

/* Board */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(220px,1fr);gap:.75rem;overflow-x:auto;padding-bottom:.75rem;scroll-snap-type:x proximity}
.column{display:flex;flex-direction:column;min-width:0;border-radius:var(--r-lg);background:color-mix(in srgb,var(--surface) 55%,transparent);box-shadow:inset 0 0 0 1px var(--border);scroll-snap-align:start}
.column-head{display:flex;align-items:center;gap:.5rem;padding:.75rem .85rem .6rem;font-size:.84rem;font-weight:560}
.column-head .n{font-family:var(--mono);font-size:.72rem;font-weight:400;color:var(--text-3);margin-left:auto}
.column-body{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:.45rem;scrollbar-width:thin;scrollbar-color:var(--border-3) transparent;padding:0 .5rem .6rem;max-height:calc(100vh - 230px);overflow-y:auto}
.card{position:relative;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:.45rem;padding:.75rem .8rem;border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 0 0 1px var(--border),var(--shadow-sm);cursor:pointer;text-align:left;transition:box-shadow var(--mid),transform var(--mid) var(--ease)}
.card:hover{box-shadow:inset 0 0 0 1px var(--border-2),0 8px 20px -10px rgba(0,0,0,.45);transform:translateY(-1px)}
.card:focus-visible{outline:2px solid var(--ring)}
.card b{font-weight:560;font-size:.86rem;line-height:1.3}
.card p{font-size:.78rem;color:var(--text-3);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-foot{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:26px}
.card .row-actions{position:absolute;top:.45rem;right:.45rem;background:var(--surface);border-radius:8px;padding:2px}
.card.enter{animation:rise .5s var(--ease) both;animation-delay:calc(var(--i,0)*30ms)}
.column-empty{font-size:.78rem;color:var(--text-4);text-align:center;padding:1.2rem 0;border:1px dashed var(--border-2);border-radius:var(--r-md)}

.footer-note{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--border);font-size:.74rem;color:var(--text-3);max-width:80ch}

/* Dialogs */
dialog{padding:0;border:0;color:var(--text);background:var(--overlay);max-width:none;max-height:none}
dialog::backdrop{background:rgba(5,5,8,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);animation:fade .25s var(--ease)}
:root[data-theme="light"] dialog::backdrop{background:rgba(20,20,30,.22)}
dialog.closing::backdrop{animation:fade .2s var(--ease-in) reverse forwards}
.sheet{position:fixed;inset:.5rem .5rem .5rem auto;margin:0;width:min(560px,calc(100vw - 1rem));height:auto;border-radius:var(--r-xl);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;overflow:hidden}
.sheet:not([open]){display:none}
.sheet[open]{animation:sheet-in .45s var(--ease)}
.sheet.closing{animation:sheet-out .22s var(--ease-in) forwards}
.sheet-head{display:flex;align-items:center;gap:.5rem;height:52px;padding:0 .75rem 0 1.25rem;border-bottom:1px solid var(--border);flex:none}
.sheet-head-actions{margin-left:auto;display:flex;gap:.35rem}
.sheet-body{flex:1;overflow-y:auto;padding:1.4rem 1.25rem 2rem}
.detail-top{display:grid;gap:.6rem;margin-bottom:1.4rem}
.detail-top h2{font-size:1.45rem;font-weight:620;letter-spacing:-.035em;line-height:1.2}
.detail-role{color:var(--text-2);font-size:.95rem;line-height:1.4}
.detail-top .pills{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.2rem}
.props{display:grid;grid-template-columns:120px minmax(0,1fr);gap:0;margin:0 0 1.25rem;border-radius:var(--r-md);box-shadow:inset 0 0 0 1px var(--border);overflow:hidden}
.props dt,.props dd{margin:0;padding:.55rem .75rem;font-size:.82rem;border-bottom:1px solid var(--border)}
.props dt{color:var(--text-3);display:flex;align-items:center;gap:.45rem;background:color-mix(in srgb,var(--surface-2) 50%,transparent)}
.props dt .ico{width:14px;height:14px}
.props dd{color:var(--text);min-width:0;overflow-wrap:anywhere}
.props dt:nth-last-of-type(1),.props dd:last-of-type{border-bottom:0}
.props a{display:inline-flex;align-items:center;gap:.3rem}
.props a .ico{width:13px;height:13px}
.detail-section{margin-top:1.1rem}
.detail-section h3{font-size:.72rem;font-weight:560;color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;font-family:var(--mono);margin-bottom:.45rem}
.detail-section p{white-space:pre-wrap;font-size:.86rem;line-height:1.6;color:var(--text-2)}
.detail-section.code p{font-family:var(--mono);font-size:.76rem;line-height:1.65;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);border-radius:var(--r-md);padding:.8rem .9rem;max-height:320px;overflow:auto}
.docs{display:grid;gap:.35rem}
.doc{display:flex;align-items:center;gap:.65rem;width:100%;padding:.55rem .65rem;border-radius:var(--r);box-shadow:inset 0 0 0 1px var(--border);text-align:left;font-size:.82rem;color:var(--text-2);transition:background var(--fast),color var(--fast)}
.doc:hover{background:var(--surface-2);color:var(--text)}
.doc .doc-ico{width:30px;height:30px;border-radius:7px;display:grid;place-items:center;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border);color:var(--text-3)}
.doc span:nth-child(2){flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.doc .ico{width:15px;height:15px}
.doc.unavailable{opacity:.6}
.fit-big{display:flex;align-items:center;gap:.6rem;font-size:.82rem;color:var(--text-2)}
.fit-big .fit-track{width:120px;height:6px}

.modal{margin:auto;border-radius:var(--r-xl);box-shadow:var(--shadow-lg);width:min(520px,calc(100vw - 1.5rem));max-height:calc(100dvh - 2rem);overflow-y:auto;padding:1.4rem}
.modal[open]{animation:modal-in .35s var(--ease)}
.modal.closing{animation:modal-out .18s var(--ease-in) forwards}
.modal-wide{width:min(680px,calc(100vw - 1.5rem))}
.modal-sm{width:min(400px,calc(100vw - 1.5rem));text-align:center}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.modal-head h2{font-size:1.2rem;font-weight:600;letter-spacing:-.03em;margin-top:.2rem}
.modal-foot{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1.25rem}
.modal-sm .modal-foot{justify-content:center}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
.field{display:grid;gap:.35rem;font-size:.78rem;font-weight:520;color:var(--text-2);min-width:0}
.span-2{grid-column:span 2}
.field input,.field textarea,.field select{width:100%;height:36px;padding:0 .7rem;border:0;border-radius:var(--r);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--border-2);font-size:.86rem;font-weight:400;color:var(--text);transition:box-shadow var(--fast),background var(--fast)}
.field textarea{height:auto;padding:.55rem .7rem;resize:vertical;line-height:1.5}
.field .select-wrap select{height:36px;background:var(--surface-2);color:var(--text);font-size:.86rem}
.field input:hover,.field textarea:hover{box-shadow:inset 0 0 0 1px var(--border-3)}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;background:var(--surface);box-shadow:inset 0 0 0 1px var(--accent),0 0 0 3px var(--accent-soft)}
.field input::placeholder,.field textarea::placeholder{color:var(--text-4)}
.field input[type="date"]{color-scheme:inherit}
.upload{border:0;padding:0;margin:1.2rem 0 0}
.upload legend{font-size:.78rem;font-weight:520;color:var(--text-2);margin-bottom:.5rem;padding:0}
.drops{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-bottom:.5rem}
.drop{position:relative;display:grid;justify-items:center;gap:.2rem;padding:.9rem .6rem;border-radius:var(--r-md);border:1px dashed var(--border-3);text-align:center;color:var(--text-3);transition:border-color var(--fast),background var(--fast),color var(--fast)}
.drop:hover,.drop.over{border-color:var(--accent);background:var(--accent-soft);color:var(--text-2)}
.drop.has-file{border-style:solid;border-color:color-mix(in srgb,var(--good) 55%,transparent);color:var(--text-2)}
.drop.has-file .ico{color:var(--good)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.drop b{font-size:.8rem;font-weight:540;color:var(--text)}
.drop small{font-size:.7rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.drop:focus-within{outline:2px solid var(--ring);outline-offset:2px}
#editor .error{margin-top:.75rem}
.confirm-icon{width:44px;height:44px;margin:.2rem auto 1rem;border-radius:12px;display:grid;place-items:center;color:var(--danger);background:var(--danger-soft)}
.confirm-icon .ico{width:20px;height:20px}
.modal-sm h2{font-size:1.1rem;font-weight:600;letter-spacing:-.02em;margin-bottom:.4rem}
.confirm-name{font-weight:520;margin-bottom:.35rem}
.modal-sm .muted{font-size:.84rem}

/* Command palette */
.palette{margin:12vh auto auto;width:min(620px,calc(100vw - 1.5rem));border-radius:var(--r-xl);box-shadow:var(--shadow-lg);overflow:hidden}
.palette[open]{animation:palette-in .28s var(--ease)}
.palette.closing{animation:modal-out .15s var(--ease-in) forwards}
.palette-search{display:flex;align-items:center;gap:.6rem;height:54px;padding:0 1rem;border-bottom:1px solid var(--border);color:var(--text-3)}
.palette-search input{flex:1;border:0;background:none;outline:none;font-size:1rem;color:var(--text)}
.palette-search input::placeholder{color:var(--text-3)}
.palette-list{max-height:min(420px,55vh);overflow-y:auto;padding:.4rem}
.palette-group{font-size:.7rem;font-weight:520;color:var(--text-3);padding:.55rem .6rem .3rem}
.palette-item{display:flex;align-items:center;gap:.7rem;width:100%;min-height:38px;padding:.35rem .6rem;border-radius:8px;text-align:left;font-size:.86rem;color:var(--text-2)}
.palette-item .ico{color:var(--text-3)}
.palette-item .pi-text{flex:1;min-width:0;display:flex;align-items:baseline;gap:.5rem;overflow:hidden}
.palette-item .pi-text b{font-weight:500;color:var(--text);white-space:nowrap}
.palette-item .pi-text small{color:var(--text-3);font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.palette-item[aria-selected="true"]{background:var(--surface-3);color:var(--text)}
.palette-item[aria-selected="true"] .ico{color:var(--text)}
.palette-empty{padding:2rem;text-align:center;color:var(--text-3);font-size:.86rem}
.palette-foot{display:flex;gap:1rem;padding:.55rem 1rem;border-top:1px solid var(--border);font-size:.72rem;color:var(--text-3)}
.palette-foot span{display:inline-flex;align-items:center;gap:.25rem}

/* Toasts */
.toasts{position:fixed;right:1rem;bottom:1rem;z-index:100;display:grid;gap:.5rem;justify-items:end;pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:.6rem;max-width:min(420px,calc(100vw - 2rem));padding:.7rem .75rem .7rem .85rem;border-radius:var(--r-md);background:var(--overlay);box-shadow:var(--shadow-lg);font-size:.84rem;color:var(--text);animation:toast-in .4s var(--ease)}
.toast.out{animation:toast-out .25s var(--ease-in) forwards}
.toast .t-ico{margin-top:1px;color:var(--good)}
.toast.warn .t-ico{color:var(--st-attention)}
.toast p{flex:1;line-height:1.45}
.toast .icon-btn{width:22px;height:22px;margin:-1px -2px 0 0}
.toast .icon-btn .ico{width:13px;height:13px}

/* Keyframes */
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes row-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes grow-col{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes grow-y{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes ping{0%{transform:scale(1);opacity:.45}70%,100%{transform:scale(2.4);opacity:0}}
@keyframes pop{0%{transform:scale(.9)}100%{transform:scale(1)}}
@keyframes caret{50%{opacity:0}}
@keyframes shake{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(3px)}30%,50%,70%{transform:translateX(-6px)}40%,60%{transform:translateX(6px)}}
@keyframes drift-a{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(90px,60px,0) scale(1.15)}}
@keyframes drift-b{from{transform:translate3d(0,0,0) scale(1.1)}to{transform:translate3d(-110px,80px,0) scale(.95)}}
@keyframes gate-out{to{opacity:0;transform:scale(.97) translateY(-8px);filter:blur(4px)}}
@keyframes slide-in{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
@keyframes menu-in{from{opacity:0;transform:scale(.96) translateY(-4px)}to{opacity:1;transform:none}}
@keyframes tip{from{opacity:0;transform:translate(-50%,-2px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes sheet-in{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:none}}
@keyframes sheet-out{to{opacity:0;transform:translateX(30px)}}
@keyframes modal-in{from{opacity:0;transform:scale(.96) translateY(8px)}to{opacity:1;transform:none}}
@keyframes modal-out{to{opacity:0;transform:scale(.97)}}
@keyframes palette-in{from{opacity:0;transform:scale(.97) translateY(-8px)}to{opacity:1;transform:none}}
@keyframes toast-in{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@keyframes toast-out{to{opacity:0;transform:translateX(16px)}}
::view-transition-old(content){animation:vt-out .16s var(--ease-in) both}
::view-transition-new(content){animation:vt-in .34s var(--ease) both}
html.theme-vt::view-transition-old(root),html.theme-vt::view-transition-old(content){animation:vt-fade-out .32s var(--ease) both}
html.theme-vt::view-transition-new(root),html.theme-vt::view-transition-new(content){animation:fade .32s var(--ease) both}
@keyframes vt-fade-out{to{opacity:0}}
@keyframes vt-out{to{opacity:0;transform:translateY(-4px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(6px)}}

/* Responsive */
@media (max-width:1100px){
  .panel-activity,.panel-pipeline{grid-column:span 12}
  .panel-next,.panel-recent{grid-column:span 6}.panel-fit{grid-column:span 12}
  .row{grid-template-columns:18px minmax(0,2fr) minmax(0,1.3fr) 84px 72px 150px}
  .row .loc-cell{display:none}
  .row.bin-row{grid-template-columns:18px minmax(0,2fr) minmax(0,1.3fr) 150px}
}
@media (max-width:900px){
  .sidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);transition:transform var(--slow) var(--ease);box-shadow:var(--shadow-lg)}
  .app.nav-open .sidebar{transform:none}
  .app.entering .sidebar{animation:none}
  .menu-btn{display:inline-grid}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .panel-next,.panel-recent,.panel-fit{grid-column:span 12}
  .sync-pill{display:none}
  .toolbar{flex-direction:column;align-items:stretch}
  .toolbar-right{justify-content:space-between}
  .search{flex:1;width:auto}
  .group-head{top:auto;position:relative}
  .row{grid-template-columns:18px minmax(0,1fr) auto;grid-template-areas:"i m w" "i s a";row-gap:.35rem;padding:.65rem .5rem}
  .row .si-cell{grid-area:i;align-self:start;margin-top:3px}
  .row .main-cell{grid-area:m}
  .row .status-cell{grid-area:s}
  .row .when{grid-area:w}
  .row .row-actions{grid-area:a}
  .row .fit-cell,.row .loc-cell{display:none}
  .row.bin-row{grid-template-columns:18px minmax(0,1fr) auto;grid-template-areas:"i m a" "i s a"}
  .toolbar{position:relative;top:auto}
}
@media (max-width:600px){
  .content{padding:1.1rem 1rem 2.5rem}
  .topbar{padding:0 .75rem}
  .top-actions .btn-primary .btn-label,.top-actions .btn-primary kbd{display:none}
  .top-actions .btn-primary{width:32px;padding:0}
  .breadcrumb > span:first-child,.crumb-sep{display:none}
  .page-head{flex-direction:column;align-items:flex-start}
  .kpi{padding:.85rem .9rem}
  .kpi-value{font-size:1.75rem}
  .kpi-hint{display:none}
  .form-grid{grid-template-columns:1fr}
  .span-2{grid-column:auto}
  .drops{grid-template-columns:1fr}
  .sheet{inset:auto 0 0 0;width:100%;height:92dvh;border-radius:var(--r-xl) var(--r-xl) 0 0}
  .sheet[open]{animation:sheet-up .45s var(--ease)}
  .sheet.closing{animation:sheet-down .22s var(--ease-in) forwards}
  .props{grid-template-columns:100px minmax(0,1fr)}
  .palette{margin-top:1rem}
  .palette-foot{display:none}
  .hero strong{font-size:1.9rem}
  .panel-activity .panel-head{flex-direction:column;gap:.6rem}
  .panel-activity .hero{justify-items:start;text-align:left;grid-template-columns:auto auto;align-items:baseline;column-gap:.5rem}
  .panel-activity .hero .delta{grid-column:span 2}
  .sync-strip{align-items:flex-start;flex-wrap:wrap}
}
@keyframes sheet-up{from{transform:translateY(40px);opacity:0}to{transform:none;opacity:1}}
@keyframes sheet-down{to{transform:translateY(40px);opacity:0}}
@media (hover:none){.row-actions{opacity:1;transform:none}.card .row-actions{position:static;justify-content:flex-start;background:none;padding:0}.spot::before{display:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;animation-delay:0ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .orb{animation:none}
  .signal::after{display:none}
}
@media (forced-colors:active){.col,.bar-fill,.pipeline-bar span,.fit-fill{forced-color-adjust:none}}
