/* Ravello OS — dual theme, RTL-safe (logical properties only) */
:root, [data-theme="dark"] {
  --bg:#0d100d; --surface:#141814; --raised:#1c211c;
  --border:rgba(255,255,255,0.09); --border-soft:rgba(255,255,255,0.05);
  --text:#f2f4ef; --muted:#8b928a; --dim:#5a615a;
  --accent-wash:rgba(201,242,78,0.10); --amber-wash:rgba(240,200,90,0.10);
  --globe-dot:#c9f24e; --globe-hi:#e6ff9a; --shadow:none;
}
[data-theme="light"] {
  --bg:#f5f3ec; --surface:#fffdf8; --raised:#ffffff;
  --border:rgba(29,33,29,0.13); --border-soft:rgba(29,33,29,0.07);
  --text:#1d211d; --muted:#5a615a; --dim:#8b928a;
  --accent-wash:rgba(201,242,78,0.28); --amber-wash:rgba(240,200,90,0.25);
  --globe-dot:#87a832; --globe-hi:#5c7a1a;
  --shadow:0 1px 3px rgba(29,33,29,0.06);
}
:root { --lime:#c9f24e; --lime-ink:#2a3c14; --lavender:#c9c4f0; --error:#d08770; }

* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body { background:var(--bg); color:var(--text); font-family:'Heebo',sans-serif;
       font-size:13px; line-height:1.5; overflow-x:hidden;
       transition:background 200ms, color 200ms; }
.mono { font-family:'JetBrains Mono',monospace; font-variant-numeric:tabular-nums;
        direction:ltr; unicode-bidi:embed; }
.hidden { display:none !important; }

.mosaic { position:fixed; inset:0; pointer-events:none; z-index:0; }
.mosaic div { position:absolute; border-radius:48px; filter:blur(90px); }
.mosaic .a { width:480px; height:480px; background:rgba(201,242,78,0.05); top:-140px; inset-inline-start:-100px; }
.mosaic .b { width:560px; height:560px; background:rgba(58,110,88,0.12); bottom:-160px; inset-inline-end:-140px; }
[data-theme="light"] .mosaic .a { background:rgba(201,242,78,0.18); }
[data-theme="light"] .mosaic .b { background:rgba(240,200,90,0.14); }

/* ---------- shell ---------- */
.shell { position:relative; z-index:1; display:grid;
         grid-template-columns:210px 1fr; min-height:100dvh; }
@media (max-width:900px) { .shell { grid-template-columns:1fr; } aside.nav { display:none; } }

aside.nav { border-inline-end:1px solid var(--border); padding:18px 14px;
            display:flex; flex-direction:column; gap:2px; background:var(--surface); }
.nav .brand { font-weight:900; letter-spacing:0.13em; font-size:15px; padding:6px 10px 20px; }
.nav .brand b { color:var(--lime); }
[data-theme="light"] .nav .brand b { color:#5c7a1a; }
.nav a { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:8px;
         color:var(--muted); text-decoration:none; font-size:13px; font-weight:500;
         transition:background 150ms, color 150ms; cursor:pointer; }
.nav a i { font-size:16px; }
.nav a:hover { background:var(--accent-wash); color:var(--text); }
.nav a.on { background:var(--accent-wash); color:var(--text); font-weight:700; }
.nav a.soon { opacity:0.38; cursor:default; }
.nav .foot { margin-top:auto; padding:10px; color:var(--dim); font-size:10.5px;
             font-family:'JetBrains Mono',monospace; letter-spacing:0.08em; }

.main { min-width:0; display:flex; flex-direction:column; }
header.top { display:flex; align-items:center; justify-content:space-between; gap:14px;
             padding:12px 22px; border-bottom:1px solid var(--border); }
.top .title { font-weight:700; font-size:15px; }
.top .right { display:flex; align-items:center; gap:14px; }
.lights { display:flex; gap:14px; font-family:'JetBrains Mono',monospace; font-size:9.5px;
          letter-spacing:0.16em; color:var(--dim); text-transform:uppercase; }
.lights span::before { content:''; display:inline-block; width:7px; height:7px; border-radius:50%;
          background:var(--dim); margin-inline-end:5px; vertical-align:1px; }
.lights span.on { color:var(--muted); }
.lights span.on::before { background:var(--lime); box-shadow:0 0 8px rgba(201,242,78,0.7); }
.tgl { border:1px solid var(--border); background:var(--surface); color:var(--muted);
       border-radius:8px; padding:5px 10px; font-size:11px; font-weight:700; cursor:pointer;
       font-family:'JetBrains Mono',monospace; letter-spacing:0.06em; }
.tgl:hover { color:var(--text); background:var(--accent-wash); }
.clock { font-size:16px; font-weight:700; }

.view { padding:20px 24px; flex:1; }

h2 { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:500; letter-spacing:0.2em;
     text-transform:uppercase; color:var(--lime); margin:24px 0 12px; }
[data-theme="light"] h2 { color:#5c7a1a; }
h2:first-child { margin-top:0; }

/* ---------- overview grid ---------- */
.ov { display:grid; grid-template-columns:270px 1fr 320px; gap:0; }
.ov > div { padding:4px 20px; min-width:0; }
.ov .mid { border-inline-start:1px solid var(--border); border-inline-end:1px solid var(--border);
           display:flex; flex-direction:column; align-items:center; }
@media (max-width:1100px) { .ov { grid-template-columns:1fr; } .ov .mid { border:0; } }

.vital { display:flex; align-items:baseline; justify-content:space-between;
         padding:10px 0; border-top:1px solid var(--border-soft); }
.vital:last-of-type { border-bottom:1px solid var(--border-soft); }
.vital .lbl { color:var(--muted); font-size:12px; }
.vital .num { font-size:22px; font-weight:700; }
.vital.alert .num { color:var(--lime); }
[data-theme="light"] .vital.alert .num { color:#5c7a1a; }

.hist { display:flex; align-items:flex-end; gap:3px; height:44px; margin-top:8px; }
.hist div { flex:1; background:var(--lime); opacity:0.85; min-height:2px; border-radius:1px 1px 0 0; }
[data-theme="light"] .hist div { background:#87a832; }
.hist div.zero { background:var(--dim); opacity:0.3; }
.hist-lbl { display:flex; justify-content:space-between; color:var(--dim); font-size:9px; margin-top:4px; }

.directive { display:flex; gap:10px; padding:8px 0; border-top:1px solid var(--border-soft); font-size:12.5px; }
.directive .n { color:var(--lime); font-family:'JetBrains Mono',monospace; font-size:11px; padding-top:1px; }
[data-theme="light"] .directive .n { color:#5c7a1a; }

#globe { width:min(440px,88%); aspect-ratio:1; display:block; }
.primary { text-align:center; margin-top:-24px; }
.primary .big { font-size:72px; font-weight:800; letter-spacing:-0.02em; line-height:1; color:var(--lime);
                text-shadow:0 0 40px rgba(201,242,78,0.25); }
[data-theme="light"] .primary .big { color:#5c7a1a; text-shadow:none; }
.primary .big-lbl { font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:0.28em;
                text-transform:uppercase; color:var(--muted); margin-top:8px; }
.primary .sub { color:var(--dim); font-size:12px; margin-top:10px; max-width:46ch; }
.substats { display:flex; gap:24px; justify-content:center; margin-top:14px;
            font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--muted); }
.substats b { color:var(--text); font-weight:700; }

.reportbox { width:100%; max-width:620px; margin-top:28px; border-top:1px solid var(--border); }
.rb-head { display:flex; justify-content:space-between; align-items:baseline; cursor:pointer; padding:10px 0; }
.rb-head:hover h2 { color:var(--text); }
article { max-width:70ch; margin:0 auto; padding-bottom:28px; }
article > * { unicode-bidi:plaintext; }
article h1 { font-size:18px; font-weight:700; margin:6px 0 12px; }
article h3 { font-size:13px; font-weight:700; color:var(--lime); margin:18px 0 6px; }
[data-theme="light"] article h3 { color:#5c7a1a; }
article h4 { font-size:12.5px; font-weight:700; margin:12px 0 4px; }
article p, article li { font-size:12.5px; margin-bottom:5px; }
article ul { padding-inline-start:16px; }
article em { color:var(--muted); font-style:normal; }
article hr { border:0; border-top:1px solid var(--border-soft); margin:12px 0; }
article code { font-family:'JetBrains Mono',monospace; font-size:11.5px; color:var(--lavender); }
[data-theme="light"] article code { color:#6b5bd2; }

/* ---------- pills / badges ---------- */
.pill { display:inline-block; border-radius:9999px; font-size:10.5px; font-weight:700;
        padding:3px 11px; letter-spacing:0.04em; border:1px solid transparent; }
.pill.new         { background:var(--amber-wash); color:var(--text); border-color:var(--border); }
.pill.qualified   { background:rgba(201,196,240,0.22); color:var(--text); border-color:var(--border); }
.pill.proposal    { background:var(--accent-wash); color:var(--text); border-color:var(--border); }
.pill.negotiating { background:var(--accent-wash); color:var(--text); border-color:var(--border); }
.pill.won         { background:var(--lime); color:var(--lime-ink); }
.pill.lost        { background:transparent; color:var(--dim); border-color:var(--border); }

/* ---------- pipeline ---------- */
.toolbar { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.fpill { border:1px solid var(--border); background:var(--surface); color:var(--muted); border-radius:9999px;
         font-size:11.5px; font-weight:700; padding:5px 14px; cursor:pointer; font-family:inherit; }
.fpill:hover { color:var(--text); }
.fpill.on { background:var(--lime); color:var(--lime-ink); border-color:transparent; }
.toolbar .grow { flex:1; }

button.go { background:var(--lime); color:var(--lime-ink); border:0; border-radius:8px;
            font-weight:800; font-size:12.5px; padding:9px 18px; cursor:pointer; font-family:inherit;
            transition:transform 120ms; }
button.go:active { transform:scale(0.97); }
button.go:disabled { opacity:0.4; cursor:default; }
button.ghost { background:transparent; color:var(--text); border:1px solid var(--border);
               border-radius:8px; font-weight:700; font-size:12.5px; padding:8px 16px;
               cursor:pointer; font-family:inherit; }
button.ghost:hover { background:var(--accent-wash); }

.lead { display:grid; grid-template-columns:minmax(180px,1.4fr) 110px 90px minmax(140px,1fr) 90px;
        gap:12px; align-items:center; padding:13px 14px; border-top:1px solid var(--border-soft);
        cursor:pointer; transition:background 150ms; border-radius:0; }
.lead:last-child { border-bottom:1px solid var(--border-soft); }
.lead:hover { background:var(--accent-wash); }
.lead .who .nm { font-weight:700; font-size:13px; }
.lead .who .biz { color:var(--muted); font-size:11.5px; }
.lead .val { font-weight:700; }
.lead .nxt { color:var(--muted); font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lead .upd { color:var(--dim); font-size:10.5px; text-align:end; }
.lead-head { display:grid; grid-template-columns:minmax(180px,1.4fr) 110px 90px minmax(140px,1fr) 90px;
        gap:12px; padding:0 14px 8px; color:var(--dim); font-family:'JetBrains Mono',monospace;
        font-size:9.5px; letter-spacing:0.14em; text-transform:uppercase; }
@media (max-width:900px) { .lead, .lead-head { grid-template-columns:1fr 100px; }
        .lead > :nth-child(n+3), .lead-head > :nth-child(n+3) { display:none; } }

/* ---------- record panel (slide-in) ---------- */
.panel-wrap { position:fixed; inset:0; z-index:20; background:rgba(0,0,0,0.35); }
[data-theme="light"] .panel-wrap { background:rgba(29,33,29,0.18); }
.panel { position:absolute; top:0; bottom:0; inset-inline-end:0; width:min(460px,94vw);
         background:var(--surface); border-inline-start:1px solid var(--border);
         padding:24px; overflow-y:auto; box-shadow:var(--shadow); }
.panel .p-head { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:4px; }
.panel .p-name { font-size:20px; font-weight:800; }
.panel .p-biz { color:var(--muted); font-size:12.5px; margin-bottom:16px; }
.panel .x { background:none; border:0; color:var(--muted); font-size:18px; cursor:pointer; padding:4px; }
.panel .x:hover { color:var(--text); }
.stage-row { display:flex; gap:6px; flex-wrap:wrap; margin:8px 0 4px; }
.field { margin-top:14px; }
.field label { display:block; font-size:11px; color:var(--muted); font-weight:700; margin-bottom:5px; }
.field input, .field textarea, .field select {
  width:100%; background:var(--raised); border:1px solid var(--border); border-radius:8px;
  color:var(--text); padding:9px 12px; font-size:12.5px; font-family:inherit; outline:none; }
.field input:focus, .field textarea:focus { border-color:rgba(201,242,78,0.5); }
.field textarea { min-height:74px; resize:vertical; }
.frow { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.p-meta { color:var(--dim); font-size:10.5px; margin-top:14px; }
.p-actions { display:flex; gap:8px; margin-top:18px; }
.msg { font-size:11.5px; color:var(--muted); min-height:15px; margin-top:10px; }
.msg.err { color:var(--error); }

/* ---------- misc right column ---------- */
.deck { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.cmd { border:1px solid var(--border); border-radius:8px; padding:10px 12px; cursor:pointer;
       background:var(--surface); transition:background 150ms; }
.cmd:hover { background:var(--accent-wash); }
.cmd.sel { background:var(--accent-wash); border-color:rgba(201,242,78,0.45); }
.cmd .nm { font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; direction:ltr; unicode-bidi:embed; text-align:start; }
.cmd .nm::before { content:'/'; color:var(--lime); }
[data-theme="light"] .cmd .nm::before { color:#5c7a1a; }
.cmd .hint { color:var(--dim); font-size:10px; margin-top:2px; }
.runner { margin-top:10px; display:flex; gap:8px; }
.runner input { flex:1; background:var(--surface); border:1px solid var(--border); border-radius:8px;
                color:var(--text); padding:8px 12px; font-size:12px; font-family:inherit; outline:none; }
.run { display:flex; justify-content:space-between; gap:8px; padding:7px 0;
       border-top:1px solid var(--border-soft); font-size:11.5px; }
.run .st-queued { color:var(--muted); } .run .st-running { color:var(--lavender); }
[data-theme="light"] .run .st-running { color:#6b5bd2; }
.run .st-done { color:var(--lime); } [data-theme="light"] .run .st-done { color:#5c7a1a; }
.run .st-error { color:var(--error); }
.wire { padding:8px 0; border-top:1px solid var(--border-soft); font-size:12px; }
.wire b { display:block; font-weight:700; margin-bottom:2px; }
.wire span { color:var(--muted); font-size:11.5px; }
.act { display:flex; gap:10px; padding:7px 0; border-top:1px solid var(--border-soft); font-size:11.5px; }
.act .k { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:0.1em;
          text-transform:uppercase; color:var(--lime); min-width:50px; padding-top:2px; }
[data-theme="light"] .act .k { color:#5c7a1a; }
.act .b { flex:1; color:var(--muted); }
.act .t { color:var(--dim); font-size:10px; white-space:nowrap; }

/* ---------- clients ---------- */
.sumline { color:var(--muted); font-size:11.5px; letter-spacing:0.04em; }
.sumline b { color:var(--text); }
.proj { border:1px solid var(--border-soft); border-radius:10px; padding:12px 14px; margin-top:12px; background:var(--raised); }
.proj .p-row { display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.proj .p-nm { font-weight:700; font-size:13px; }
.pay { display:flex; justify-content:space-between; gap:8px; padding:6px 0;
       border-top:1px solid var(--border-soft); font-size:11.5px; align-items:center; }
.pill.discovery, .pill.building, .pill.review { background:var(--amber-wash); color:var(--text); border-color:var(--border); }
.pill.delivered, .pill.paid { background:var(--lime); color:var(--lime-ink); }
.pill.on-hold, .pill.cancelled { background:transparent; color:var(--dim); border-color:var(--border); }
.pill.invoiced { background:var(--amber-wash); color:var(--text); border-color:var(--border); }
.pill.overdue { background:transparent; color:var(--error); border-color:var(--error); }
.miniform { display:grid; grid-template-columns:1fr 110px 110px auto; gap:8px; margin-top:10px; align-items:center; }
.miniform input, .miniform select { background:var(--surface); border:1px solid var(--border); border-radius:8px;
  color:var(--text); padding:7px 10px; font-size:12px; font-family:inherit; outline:none; min-width:0; }

/* ---------- auth gate: geometric halftone sky + fluid-glass card + particle brand ---------- */
#gate { position:fixed; inset:0; z-index:30; display:flex; align-items:center; justify-content:center;
        background:
          radial-gradient(70% 60% at 80% 12%, rgba(64,110,255,0.14), transparent 62%),
          radial-gradient(55% 50% at 8% 92%, rgba(64,110,255,0.10), transparent 60%),
          linear-gradient(172deg, #070b16 0%, #0a1122 55%, #0d1730 100%); }
[data-theme="light"] #gate { background:
          radial-gradient(70% 60% at 80% 12%, rgba(120,165,255,0.20), transparent 62%),
          radial-gradient(55% 50% at 8% 92%, rgba(120,165,255,0.16), transparent 60%),
          linear-gradient(172deg, #eef4fd 0%, #e9f1fc 55%, #e3edfb 100%); }
#gatefx { position:absolute; inset:0; width:100%; height:100%; }
.gatebox { width:min(384px,90vw); text-align:center; position:relative; z-index:1; }
.gatebox .brand { display:block; margin-bottom:20px; }
.gatebox .brand canvas { max-width:100%; } /* native size; dots stay crisp */

/* fluid glass: layered refraction — blur + inner 1px light edge + specular sweep + tinted depth shadow */
.gatecard { position:relative; overflow:hidden; text-align:start; padding:28px 26px 24px; border-radius:24px;
            background:linear-gradient(165deg, rgba(255,255,255,0.13), rgba(255,255,255,0.04) 55%, rgba(255,255,255,0.09));
            border:1px solid rgba(255,255,255,0.22);
            backdrop-filter:blur(30px) saturate(1.7); -webkit-backdrop-filter:blur(30px) saturate(1.7);
            box-shadow:0 28px 80px rgba(4,10,30,0.55), 0 2px 8px rgba(4,10,30,0.25),
                       inset 0 1px 0 rgba(255,255,255,0.28), inset 0 -1px 0 rgba(255,255,255,0.06),
                       inset 0 0 32px rgba(255,255,255,0.03); }
.gatecard::before { content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
            background:linear-gradient(115deg, rgba(255,255,255,0.30), rgba(255,255,255,0.05) 34%, transparent 55%);
            opacity:0.5; }
[data-theme="light"] .gatecard { background:linear-gradient(165deg, rgba(255,255,255,0.78), rgba(255,255,255,0.5) 55%, rgba(255,255,255,0.68));
            border-color:rgba(255,255,255,0.9);
            box-shadow:0 28px 80px rgba(40,80,180,0.16), 0 2px 8px rgba(40,80,180,0.08),
                       inset 0 1px 0 rgba(255,255,255,0.95), inset 0 -1px 0 rgba(255,255,255,0.4); }
.blob { position:absolute; border-radius:50%; filter:blur(46px); pointer-events:none; }
.blob.b1 { width:200px; height:200px; inset-block-start:-80px; inset-inline-start:-70px;
           background:radial-gradient(circle, rgba(72,124,255,0.5), transparent 70%); }
.blob.b2 { width:230px; height:230px; inset-block-end:-100px; inset-inline-end:-80px;
           background:radial-gradient(circle, rgba(64,190,255,0.38), transparent 70%); }
.blob.b3 { width:140px; height:140px; inset-block-start:28%; inset-inline-end:-40px;
           background:radial-gradient(circle, rgba(255,110,190,0.30), transparent 70%); }
[data-theme="light"] .blob { opacity:0.55; }
.gatecard > :not(.blob) { position:relative; } /* content above the glow blobs; blobs stay absolute */
.gatecard h1 { font-size:24px; font-weight:900; letter-spacing:-0.02em; margin:0 0 6px; color:#f4f7ff; }
.gatecard p  { color:rgba(226,234,255,0.62); font-size:12.5px; margin:0 0 22px; line-height:1.55; }
[data-theme="light"] .gatecard h1 { color:#101a30; }
[data-theme="light"] .gatecard p  { color:rgba(24,40,80,0.62); }
.gatecard label { display:block; font-size:12px; font-weight:700; margin-bottom:7px; color:#e8eeff; }
[data-theme="light"] .gatecard label { color:#1a2848; }
.gatebox input { width:100%; background:rgba(6,12,28,0.45); border:1px solid rgba(150,180,255,0.22); border-radius:11px;
                 color:#fff; padding:11px 13px; font-size:14px; font-family:inherit; outline:none;
                 margin-bottom:14px; transition:border-color .18s, box-shadow .18s; }
.gatebox input::placeholder { color:rgba(200,215,255,0.35); }
.gatebox input:focus { border-color:rgba(120,160,255,0.7); box-shadow:0 0 0 3px rgba(90,140,255,0.20); }
[data-theme="light"] .gatebox input { background:rgba(255,255,255,0.75); color:#101a30; border-color:rgba(70,110,220,0.25); }
[data-theme="light"] .gatebox input::placeholder { color:rgba(40,70,140,0.4); }
.gatebox button { width:100%; }
/* fluid-glass CTA: lime glass with specular top edge */
.gatecard .go { border-radius:12px; border:1px solid rgba(255,255,255,0.35);
            background:linear-gradient(170deg, rgba(213,247,110,0.95), rgba(178,224,58,0.88));
            box-shadow:0 10px 28px rgba(201,242,78,0.22), inset 0 1px 0 rgba(255,255,255,0.55);
            transition:transform .2s cubic-bezier(0.16,1,0.3,1), box-shadow .2s, filter .2s; cursor:pointer; }
.gatecard .go:hover { transform:translateY(-1px); filter:brightness(1.04);
            box-shadow:0 14px 34px rgba(201,242,78,0.30), inset 0 1px 0 rgba(255,255,255,0.55); }
.gatecard .go:active { transform:scale(0.98); }
.gatecard .go:focus-visible { outline:2px solid rgba(120,160,255,0.9); outline-offset:2px; }
.gatemsg { color:rgba(226,234,255,0.6); font-size:11.5px; min-height:16px; margin-top:12px; text-align:center; }
[data-theme="light"] .gatemsg { color:rgba(24,40,80,0.6); }
.gatefoot { color:rgba(200,215,255,0.38); font-family:'JetBrains Mono',monospace; font-size:10px;
            letter-spacing:0.09em; text-transform:uppercase; margin-top:16px; }
[data-theme="light"] .gatefoot { color:rgba(24,40,80,0.42); }
#captcha { display:flex; justify-content:center; margin:0 0 14px; min-height:0; }

/* ---------- motion: sidebar entrance (slide + blur, always expanded - no collapse) ---------- */
@keyframes navIn  { from { transform:translateX(-18px); opacity:0; filter:blur(8px); }
                    to   { transform:none; opacity:1; filter:none; } }
@keyframes navInR { from { transform:translateX(18px);  opacity:0; filter:blur(8px); }
                    to   { transform:none; opacity:1; filter:none; } }
aside.nav { animation:navIn 480ms cubic-bezier(0.16,1,0.3,1) both; }
[dir="rtl"] aside.nav { animation-name:navInR; }
.nav .brand, .nav a, .nav .foot { animation:navIn 420ms cubic-bezier(0.16,1,0.3,1) both; }
[dir="rtl"] .nav .brand, [dir="rtl"] .nav a, [dir="rtl"] .nav .foot { animation-name:navInR; }
.nav .brand { animation-delay:60ms; }
.nav a:nth-of-type(1) { animation-delay:110ms; } .nav a:nth-of-type(2) { animation-delay:150ms; }
.nav a:nth-of-type(3) { animation-delay:190ms; } .nav a:nth-of-type(4) { animation-delay:230ms; }
.nav a:nth-of-type(5) { animation-delay:270ms; } .nav a:nth-of-type(6) { animation-delay:310ms; }

/* ---------- motion: page switch (fade + rise + de-blur) ---------- */
@keyframes viewIn { from { opacity:0; transform:translateY(14px); filter:blur(9px); }
                    to   { opacity:1; transform:none; filter:none; } }
.view.enter { animation:viewIn 340ms cubic-bezier(0.16,1,0.3,1) both; }

/* ---------- tasks ---------- */
.donutwrap { display:flex; align-items:center; gap:26px; flex-wrap:wrap; margin-bottom:8px; }
.donut-legend { display:flex; flex-direction:column; gap:6px; font-size:12px; }
.donut-legend span::before { content:''; display:inline-block; width:9px; height:9px; border-radius:3px;
  margin-inline-end:8px; vertical-align:0; background:var(--c); }
.task { display:flex; align-items:center; gap:12px; padding:10px 4px;
        border-top:1px solid var(--border-soft); font-size:12.5px; }
.task:last-child { border-bottom:1px solid var(--border-soft); }
.task .n { color:var(--lime); font-family:'JetBrains Mono',monospace; font-size:11px; }
[data-theme="light"] .task .n { color:#5c7a1a; }

/* ---------- skills ---------- */
.packs { display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:14px; }
.pack { border:1px solid var(--border); border-radius:12px; background:var(--surface);
        padding:16px; box-shadow:var(--shadow); }
.pack .p-top { display:flex; align-items:center; gap:10px; margin-bottom:4px; }
.pack .p-top i { font-size:19px; color:var(--lime); }
[data-theme="light"] .pack .p-top i { color:#5c7a1a; }
.pack .p-branch { font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:0.18em;
        text-transform:uppercase; color:var(--dim); }
.pack .nm { font-family:'JetBrains Mono',monospace; font-weight:700; font-size:13px; direction:ltr; unicode-bidi:embed; text-align:start; }
.pack .nm::before { content:'/'; color:var(--lime); } [data-theme="light"] .pack .nm::before { color:#5c7a1a; }
.pack .desc { color:var(--muted); font-size:11.5px; margin:6px 0 12px; min-height:32px; }
.pack .p-run { display:flex; gap:8px; }
.pack .p-run input { flex:1; background:var(--raised); border:1px solid var(--border); border-radius:8px;
        color:var(--text); padding:7px 10px; font-size:11.5px; font-family:inherit; outline:none; min-width:0; }

/* ---------- docs ---------- */
.doc { display:flex; justify-content:space-between; gap:12px; padding:11px 6px;
       border-top:1px solid var(--border-soft); cursor:pointer; font-size:12.5px; transition:background 150ms; }
.doc:last-child { border-bottom:1px solid var(--border-soft); }
.doc:hover { background:var(--accent-wash); }
.doc .d-nm { font-weight:700; }
.doc .d-dt { color:var(--dim); font-size:11px; }

@media (prefers-reduced-motion: reduce) { * { transition:none !important; animation:none !important; } }