/* mixProject User Panel — shared styles.
   Extracted verbatim from project-panel.html so project-panel.html and
   myProjects.html share one stylesheet instead of each carrying a copy. */
:root{
  /* mix3D palette — aligned to phase-files-v5 (phase-4-logic.html / dashboard.html) */
  --bg:#e7ecf3;--bg-2:#eef2f8;
  --surface:#ffffff;--surface-2:#f2f6fb;--surface-3:#e9eff6;
  --ink:#17222f;--ink-2:#54606f;--ink-3:#7c8898;--ink-4:#a6b1bf;
  --line:rgba(22,42,66,.085);--line-2:rgba(22,42,66,.15);
  --primary:#0a7eb4;--primary-2:#1aafe0;--primary-3:#066099;--primary-ink:#ffffff;
  --primary-soft:#e7f4fb;--primary-soft-2:#d6ecf8;--primary-line:rgba(10,126,180,.30);--primary-glow:rgba(10,126,180,.28);
  --green:#0d9488;--green-d:#0f766e;--green-soft:#e2f6f2;--green-line:rgba(13,148,136,.32);
  --amber:#b45309;--amber-2:#d97706;--amber-soft:#fdf0dd;--amber-line:rgba(180,83,9,.28);
  --red:#c2410c;--red-2:#b91c1c;--red-soft:#fdece6;--red-line:rgba(185,28,28,.26);
  --violet:#6d5ae0;--violet-soft:#eee9fc;--violet-line:rgba(109,90,224,.28);
  --r1:10px;--r2:14px;--r3:20px;
  --sh-sm:0 1px 2px rgba(22,42,66,.05),0 1px 3px rgba(22,42,66,.06);
  --sh:0 4px 16px -8px rgba(22,42,66,.10),0 2px 6px -3px rgba(22,42,66,.07);
  --sh-lg:0 12px 40px -14px rgba(22,42,66,.16),0 4px 12px -6px rgba(22,42,66,.10);
  --sh-card:0 18px 44px -26px rgba(22,42,66,.24),0 6px 16px -12px rgba(22,42,66,.12);
  --nm-raise-sm:none;
  --ff:"Manrope",system-ui,sans-serif;--fh:"Manrope",system-ui,sans-serif;
}
[data-theme="dark"]{
  --bg:#0b0e14;--bg-2:#0d111a;--surface:#141b25;--surface-2:#0f151e;--surface-3:#1c2531;
  --ink:#e8eef7;--ink-2:#a6b2c0;--ink-3:#7d8b9e;--ink-4:#5a6678;
  --line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.15);
  --primary:#3fc6f0;--primary-2:#5dd5fa;--primary-3:#2a9fc8;--primary-ink:#04141c;
  --primary-soft:rgba(63,198,240,.13);--primary-soft-2:rgba(63,198,240,.2);--primary-line:rgba(63,198,240,.32);--primary-glow:rgba(63,198,240,.45);
  --green:#2dd4bf;--green-d:#14b8a6;--green-soft:rgba(45,212,191,.14);--green-line:rgba(45,212,191,.34);
  --amber:#fbbf45;--amber-soft:rgba(251,191,69,.15);--amber-line:rgba(251,191,69,.34);
  --red:#f87171;--red-2:#f87171;--red-soft:rgba(248,113,113,.15);--red-line:rgba(248,113,113,.34);
  --violet:#a99bf5;--violet-soft:rgba(169,155,245,.16);--violet-line:rgba(169,155,245,.34);
  --sh-sm:0 1px 2px rgba(0,0,0,.45);--sh:0 18px 40px -20px rgba(0,0,0,.75);--sh-lg:0 30px 66px -24px rgba(0,0,0,.85);
  --sh-card:0 24px 50px -30px rgba(0,0,0,.7),0 8px 20px -14px rgba(0,0,0,.5);
  --nm-raise-sm:none;
}
*{box-sizing:border-box}html,body{height:100%;margin:0}
:root{color-scheme:light}[data-theme="dark"]{color-scheme:dark}
*{scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
::-webkit-scrollbar{width:7px}::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:99px}
body{font-family:var(--ff);color:var(--ink);display:flex;flex-direction:column;overflow:hidden;-webkit-font-smoothing:antialiased;background:var(--bg)}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
input,textarea,select{font-family:inherit;color:inherit}
svg{width:18px;height:18px;flex:0 0 auto}

/* HEADER */
.hdr{flex:0 0 auto;display:flex;align-items:center;gap:14px;height:64px;padding:0 20px;background:color-mix(in srgb,var(--surface) 72%,transparent);backdrop-filter:blur(20px) saturate(1.6);-webkit-backdrop-filter:blur(20px) saturate(1.6);border-bottom:1px solid var(--line);position:relative;z-index:30}
.hdr-brand{display:flex;align-items:center;gap:12px;padding-right:16px;border-right:1px solid var(--line);flex:0 0 auto}
.brandlogo{height:28px;width:auto;display:block;flex:0 0 auto}
.brandlogo.dk{display:none}
[data-theme="dark"] .brandlogo.lt{display:none}
[data-theme="dark"] .brandlogo.dk{display:block}
.hdr-bc{flex:1;min-width:0;display:flex;align-items:center;gap:6px;font:600 12.5px/1 var(--ff);color:var(--ink-3)}
.hdr-bc-link{color:var(--primary);cursor:pointer;white-space:nowrap}
.hdr-bc-link:hover{text-decoration:underline}
.hdr-bc-sep{color:var(--ink-4)}
.hdr-bc-cur{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.hdr-user{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.hdr-uav{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:700 12px/1 var(--ff);color:var(--primary-ink);background:linear-gradient(140deg,var(--primary-2),var(--primary));flex:0 0 32px;box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.hdr-uname{display:flex;flex-direction:column;gap:2px}
.hdr-uname b{font:700 12.5px/1 var(--ff);color:var(--ink)}
.hdr-uname span{font:500 10.5px/1 var(--ff);color:var(--ink-3)}
.hdr-btn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 12px;border-radius:11px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2);font:600 12px/1 var(--ff);transition:.18s}
.hdr-btn:hover{color:var(--primary);border-color:var(--primary-line);background:var(--surface)}
.hdr-btn svg{width:14px;height:14px}

/* SHELL */
.page-wrap{display:flex;flex:1;min-height:0}
.side{width:216px;flex:0 0 216px;min-height:0;overflow-y:auto;padding:12px 10px;display:flex;flex-direction:column;gap:3px;background:var(--surface);border-right:1px solid var(--line)}
.main{flex:1;min-width:0;min-height:0;overflow-y:auto;padding:22px}
.ai-col{width:300px;flex:0 0 300px;min-height:0;overflow-y:auto;padding:16px;background:var(--surface);border-left:1px solid var(--line)}
@media(max-width:1200px){.ai-col{width:260px;flex:0 0 260px}}
@media(max-width:1000px){.ai-col{display:none}}
@media(max-width:760px){
  .hdr{padding:0 12px;gap:8px}
  .hdr-uname{display:none}
  .side{width:56px;flex:0 0 56px;padding:12px 6px;align-items:center}
  .side-lbl{display:none}
  .snav{justify-content:center;padding:9px 0;gap:0}
  .snav-tx,.snav-badge{display:none}
  .main{padding:16px 12px}
  .proj-cards{grid-template-columns:1fr}
  .otg{grid-template-columns:1fr}
  .fld-row{grid-template-columns:1fr}
}

/* SIDEBAR */
.side-lbl{font:700 10px/1 var(--ff);letter-spacing:.13em;text-transform:uppercase;color:var(--ink-4);padding:6px 10px 8px}
.snav{display:flex;align-items:center;gap:9px;width:100%;text-align:left;padding:8px 10px;border-radius:11px;color:var(--ink-2);transition:.14s;cursor:pointer}
.snav-ic{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:grid;place-items:center;background:var(--surface-2);color:var(--ink-3);box-shadow:var(--nm-raise-sm);transition:.14s}
.snav-ic svg{width:16px;height:16px}
.snav-tx{flex:1;font:650 13px/1 var(--ff);color:var(--ink);white-space:nowrap}
.snav-sub{font:500 10.5px/1 var(--ff);color:var(--ink-4);margin-left:4px}
.snav-badge{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--red-soft);color:var(--red);border:1px solid var(--red-line);font:700 10px/18px var(--ff);text-align:center}
.snav:hover:not(.lock){background:var(--surface-2)}
.snav:hover:not(.lock) .snav-ic{color:var(--primary)}
.snav.on{background:linear-gradient(180deg,var(--primary-soft),var(--primary-soft-2))}
.snav.on .snav-ic{background:linear-gradient(180deg,var(--primary-2),var(--primary));color:var(--primary-ink);box-shadow:0 6px 14px -4px var(--primary-glow)}
.snav.on .snav-tx{color:var(--primary);font-weight:700}
.snav.lock{opacity:.5;cursor:not-allowed}
.side-sep{height:1px;background:var(--line);margin:6px 0}
.side-sp{flex:1}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 15px;height:36px;border-radius:var(--r1);font:700 13px/1 var(--ff);transition:.16s;white-space:nowrap;cursor:pointer;border:0}
.btn svg{width:14px;height:14px}
.btn.primary{background:linear-gradient(180deg,var(--primary-2),var(--primary));color:var(--primary-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 6px 18px -6px var(--primary-glow)}
.btn.primary:hover{filter:brightness(1.07)}
.btn.green{background:linear-gradient(180deg,#2dd4bf,#0d9488);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 6px 14px -6px rgba(13,148,136,.55)}
.btn.green:hover{filter:brightness(1.07)}
.btn.ghost{background:var(--surface);border:1px solid var(--line-2);color:var(--ink-2)}
.btn.ghost:hover{background:var(--surface-2);color:var(--ink)}
.btn.danger{background:var(--red-soft);border:1px solid var(--red-line);color:var(--red)}
.btn.danger:hover{background:var(--red);color:#fff}
.btn.sm{height:30px;padding:0 11px;font-size:12px;border-radius:8px}
.btn:disabled{opacity:.4;cursor:not-allowed;filter:none}

/* DASHBOARD LAYOUT */
.dash-main{display:flex;flex-direction:column;gap:14px}
/* Workload metric cards */
.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:14px}
.metric-card{display:flex;align-items:center;gap:13px;padding:15px 16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm)}
.metric-ic{width:42px;height:42px;flex:0 0 42px;border-radius:11px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary)}
.metric-ic.amber{background:var(--amber-soft);color:var(--amber)}
.metric-ic svg{width:20px;height:20px}
.metric-tx{min-width:0;flex:1}
.metric-lbl{font:700 10px/1.2 var(--ff);color:var(--ink-3);text-transform:uppercase;letter-spacing:.05em}
.metric-val{font:800 22px/1.1 var(--fh);color:var(--ink);margin-top:4px}
.metric-val.amber{color:var(--amber)}
.metric-sub{font:500 10.5px/1.35 var(--ff);color:var(--ink-3);margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.metric-bar{height:5px;border-radius:3px;background:var(--surface-2);overflow:hidden;margin-top:8px}
.metric-bar i{display:block;height:100%;border-radius:3px;background:var(--amber)}

/* ARTIST PROFILE CARD */
.ap-card{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);box-shadow:var(--sh-sm);padding:18px 20px}
.ap-top{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.ap-av{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font:800 20px/1 var(--fh);color:#fff;background:#475569;flex:0 0 52px;box-shadow:0 4px 12px -4px rgba(71,85,105,.45)}
.ap-info{flex:1}
.ap-name{font:800 16px/1 var(--fh);color:var(--ink)}
.ap-role{font:600 11.5px/1 var(--ff);color:var(--primary);margin-top:3px}
.ap-stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border-top:1px solid var(--line);padding-top:14px}
.ap-stat{display:flex;flex-direction:column;gap:3px}
.ap-stat-lbl{font:500 10.5px/1 var(--ff);color:var(--ink-3)}
.ap-stat-val{font:800 15px/1 var(--fh);color:var(--ink)}
.ap-stat-val.amber{color:var(--amber)}
.cap-bar{height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden;margin-top:5px}
.cap-fill{height:100%;border-radius:3px;transition:.3s}
.cap-fill.amber{background:linear-gradient(90deg,#fbbf24,#b45309)}
.cap-fill.green{background:linear-gradient(90deg,#2dd4bf,#0d9488)}

/* PROJECT CARDS */
.proj-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pc{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);box-shadow:var(--sh-sm);overflow:hidden;display:flex;flex-direction:column}
.pc-body{padding:16px;flex:1}
.pc-hdr{display:flex;gap:12px;align-items:flex-start;margin-bottom:12px}
.pc-thumb{width:68px;height:50px;flex:0 0 68px;border-radius:8px;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-4)}
.pc-thumb svg{width:22px;height:22px}
.pc-title-wrap{flex:1;min-width:0}
.pc-title{font:700 13.5px/1.3 var(--ff);color:var(--ink)}
.pc-client{font:500 11px/1 var(--ff);color:var(--ink-3);margin-top:3px}
.pc-tags{display:flex;gap:5px;margin-top:5px;flex-wrap:wrap}
.pc-tag{display:inline-flex;align-items:center;padding:2px 7px;border-radius:5px;font:700 10px/1 var(--ff)}
.pc-tag.new{background:var(--primary-soft);color:var(--primary);border:1px solid var(--primary-line)}
.pc-tag.urgent{background:var(--red-soft);color:var(--red);border:1px solid var(--red-line)}
.pc-meta{display:flex;flex-direction:column;gap:5px;margin-bottom:12px}
.pc-row{display:flex;justify-content:space-between;align-items:center;font:500 11.5px/1 var(--ff);color:var(--ink-3)}
.pc-row b{font-weight:600;color:var(--ink-2)}
.pc-row .urg{color:var(--red);font-weight:700}
.pc-prog-wrap{background:var(--surface-2);border-top:1px solid var(--line);padding:10px 16px}
.pc-prog-row{display:flex;align-items:center;gap:10px}
.pc-bar{flex:1;height:5px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.pc-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,#2dd4bf,#0d9488);transition:.3s}
.pc-fill.amber{background:linear-gradient(90deg,#fbbf24,#b45309)}
.pc-pct{font:700 11px/1 var(--ff);color:var(--green)}
.pc-count{font:500 10.5px/1 var(--ff);color:var(--ink-4);margin-top:4px}
.pc-actions{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
/* enhanced project cards */
.pc{position:relative;transition:box-shadow .16s,transform .16s,border-color .16s}
.pc::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;z-index:1;background:var(--primary)}
.pc.urgent::before{background:var(--red)}
.pc.new::before{background:var(--primary)}
.pc.std::before{background:var(--ink-4)}
.pc:hover{box-shadow:var(--sh);border-color:var(--line-2);transform:translateY(-2px)}
.pc-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}
.pc-head .pc-thumb{width:44px;height:44px;flex:0 0 44px;border-radius:10px;border:0;color:var(--primary-ink);background:linear-gradient(135deg,var(--primary-2),var(--primary));box-shadow:0 5px 13px -6px var(--primary-glow)}
.pc-head .pc-thumb svg{width:21px;height:21px}
.pc-head .pc-title-wrap{flex:1;min-width:0}
.pc-head .pc-tag{flex:0 0 auto;margin-top:2px}
.pc-prog2{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r1);padding:11px 13px;margin-bottom:12px}
.pc-prog2-top{display:flex;align-items:baseline;gap:9px;margin-bottom:8px}
.pc-prog2-pct{font:800 22px/1 var(--fh)}
.pc-prog2-lbl{font:600 11.5px/1 var(--ff);color:var(--ink-3)}
.pc-prog2 .pc-bar{flex:none;width:100%;height:7px;background:var(--surface-3)}
.pc-prog2-sub{font:500 10.5px/1 var(--ff);color:var(--ink-4);margin-top:7px}
.pc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:12px}
.pc-stat{display:flex;align-items:flex-start;gap:8px;min-width:0}
.pc-stat-ic{width:28px;height:28px;flex:0 0 28px;border-radius:8px;display:grid;place-items:center;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-3)}
.pc-stat-ic svg{width:14px;height:14px}
.pc-stat-tx{min-width:0}
.pc-stat-tx>span{display:block;font:600 9.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-4);margin-bottom:4px}
.pc-stat-tx b{font:700 11.5px/1.25 var(--ff);color:var(--ink);display:block;word-break:break-word}
.pc-pri{font-weight:700}.pc-pri.high{color:var(--red)}.pc-pri.medium{color:var(--amber)}.pc-pri.low{color:var(--ink-2)}
.pc-task{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--r1);background:var(--primary-soft);border:1px solid var(--primary-line)}
.pc-task>svg{width:16px;height:16px;color:var(--primary);flex:0 0 16px}
.pc-task-tx{min-width:0}
.pc-task-tx span{display:block;font:600 9.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--primary);margin-bottom:3px}
.pc-task-tx b{font:700 12px/1.3 var(--ff);color:var(--ink);display:block}

/* PROJECT VIEW — back + header + horizontal tabs */
.pv-head{margin-bottom:2px}
.pv-back{display:inline-flex;align-items:center;gap:6px;font:600 12px/1 var(--ff);color:var(--ink-3);padding:7px 11px;border-radius:8px;margin-bottom:14px;border:1px solid var(--line);background:var(--surface);cursor:pointer;transition:.14s}
.pv-back:hover{color:var(--primary);border-color:var(--primary-line);background:var(--primary-soft)}
.pv-back svg{width:15px;height:15px}
.pv-back-ic{flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer;transition:.14s}
.pv-back-ic:hover{color:var(--primary);border-color:var(--primary-line);background:var(--primary-soft)}
.pv-back-ic svg{width:17px;height:17px}
.pv-head-row{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.pv-thumb{width:48px;height:48px;flex:0 0 48px;border-radius:12px;display:grid;place-items:center;color:var(--primary-ink);background:linear-gradient(135deg,var(--primary-2),var(--primary));box-shadow:0 6px 16px -6px var(--primary-glow)}
.pv-thumb svg{width:23px;height:23px}
.pv-htx{min-width:0}
.pv-name{font:800 20px/1.2 var(--fh);color:var(--ink)}
.pv-sub{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font:600 12px/1 var(--ff);color:var(--ink-3);margin-top:5px}
.pv-sub .pc-tag{margin-left:2px}
.pv-dot{color:var(--ink-4)}
.ptabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:20px;overflow-x:auto}
.ptab{display:inline-flex;align-items:center;gap:7px;padding:11px 15px;font:700 12.5px/1 var(--ff);color:var(--ink-3);white-space:nowrap;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:.14s}
.ptab svg{width:15px;height:15px}
.ptab:hover{color:var(--ink)}
.ptab.on{color:var(--primary);border-bottom-color:var(--primary)}
.ptab-ro{display:inline-flex;align-items:center;color:var(--ink-4);margin-left:1px}.ptab-ro svg{width:11px;height:11px}
.ptab.on .ptab-ro{color:var(--primary)}
.pv-sec-sub{font:600 13px/1 var(--ff);color:var(--ink-3);margin-bottom:14px}

/* QUICK ACTIONS */
.quick-bar{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);box-shadow:var(--sh-sm);padding:14px 16px}
.quick-lbl{font:700 10.5px/1 var(--ff);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:10px}
.quick-btns{display:flex;gap:8px;flex-wrap:wrap}
.qa{display:inline-flex;align-items:center;gap:6px;padding:8px 13px;border-radius:9px;font:600 12px/1 var(--ff);background:var(--surface-2);border:1px solid var(--line);color:var(--ink-2);cursor:pointer;transition:.14s}
.qa:hover{background:var(--primary-soft);color:var(--primary);border-color:var(--primary-line)}
.qa svg{width:14px;height:14px}

/* TASKS PANEL */
.panel-card{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);box-shadow:var(--sh-sm);overflow:hidden}
.panel-hdr{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--line)}
.panel-hdr h3{font:800 13.5px/1 var(--fh);color:var(--ink);margin:0}
.task-item{display:flex;align-items:flex-start;gap:10px;padding:10px 16px;border-bottom:1px solid var(--line);cursor:pointer;transition:.12s}
.task-item:last-child{border-bottom:0}
.task-item:hover{background:var(--surface-2)}
.task-item.done .task-title{text-decoration:line-through;color:var(--ink-4)}
.task-cb{width:16px;height:16px;flex:0 0 16px;border-radius:4px;border:1.5px solid var(--line-2);display:grid;place-items:center;transition:.14s;margin-top:1px}
.task-cb.on{background:var(--green);border-color:var(--green)}
.task-cb svg{width:10px;height:10px;color:#fff;display:none}
.task-cb.on svg{display:block}
.task-body{flex:1;min-width:0}
.task-title{font:500 12px/1.4 var(--ff);color:var(--ink-2)}
.task-meta{font:500 10.5px/1 var(--ff);color:var(--ink-4);margin-top:3px;display:flex;align-items:center;gap:6px}
.t-pri{font:700 10px/1 var(--ff)}
.t-pri.high{color:var(--red)}.t-pri.medium{color:var(--amber)}.t-pri.low{color:var(--ink-4)}

/* ACTIVITY */
.act-item{display:flex;gap:10px;padding:10px 16px;border-bottom:1px solid var(--line)}
.act-item:last-child{border-bottom:0}
.act-av{width:28px;height:28px;border-radius:50%;flex:0 0 28px;display:grid;place-items:center;font:700 10px/1 var(--ff);color:#fff}
.act-body{min-width:0;flex:1}
.act-body p{margin:0 0 3px;font:500 11.5px/1.4 var(--ff);color:var(--ink-2)}
.act-time{font:500 10px/1 var(--ff);color:var(--ink-4)}

/* NOTICE BAR */
.notice-bar{display:flex;align-items:flex-start;gap:10px;padding:11px 14px;background:var(--primary-soft);border:1px solid var(--primary-line);border-radius:var(--r1);margin-bottom:16px;font:500 12px/1.5 var(--ff);color:var(--ink-2)}
.notice-bar svg{width:15px;height:15px;color:var(--primary);flex:0 0 15px;margin-top:1px}

/* STORY CARD HEADER */
.sc-hdr{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);box-shadow:var(--sh-sm);padding:16px 20px;display:flex;gap:16px;align-items:center;margin-bottom:18px}
.sc-thumb{width:80px;height:58px;flex:0 0 80px;border-radius:9px;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;color:var(--ink-4)}
.sc-info{flex:1;min-width:0}
.sc-id{font:700 10.5px/1 var(--ff);color:var(--ink-3);letter-spacing:.06em;margin-bottom:4px}
.sc-title{font:800 17px/1.2 var(--fh);color:var(--ink);margin-bottom:10px}
.sc-stats{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.sc-stat{font:600 11.5px/1 var(--ff);color:var(--ink-3)}
.sc-stat b{color:var(--ink);font-weight:700}
.sc-prog-row{display:flex;align-items:center;gap:10px}
.sc-bar{width:140px;height:6px;border-radius:3px;background:var(--surface-3);overflow:hidden}
.sc-fill{height:100%;border-radius:3px;background:linear-gradient(90deg,#2dd4bf,#0d9488);transition:.3s}
.sc-pct{font:700 12px/1 var(--ff);color:var(--green)}
.sc-nav{display:flex;align-items:center;gap:6px;margin-left:auto}
.sc-nav-btn{width:28px;height:28px;border-radius:7px;border:1px solid var(--line);background:var(--surface-2);display:grid;place-items:center;cursor:pointer;transition:.14s;color:var(--ink-3)}
.sc-nav-btn:hover{background:var(--primary-soft);color:var(--primary);border-color:var(--primary-line)}
.sc-nav-btn:disabled{opacity:.4;cursor:not-allowed}
.sc-nav-btn svg{width:14px;height:14px}
.sc-nav-info{font:600 11px/1 var(--ff);color:var(--ink-3)}

/* OBJECT GRID */
.otg-hdr{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.otg-hdr h3{font:800 14.5px/1 var(--fh);color:var(--ink);margin:0}
.otg{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}
.otc{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);box-shadow:var(--sh-sm);overflow:hidden;transition:.14s}
.otc:hover{box-shadow:var(--sh);transform:translateY(-1px)}
.otc.complete-card{border-color:var(--green-line)}
.otc-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 15px;border-bottom:1px solid var(--line)}
.otc-name{font:800 14px/1.2 var(--ff);color:var(--ink)}
.sb{display:inline-flex;align-items:center;padding:4px 9px;border-radius:6px;font:700 10px/1 var(--ff);white-space:nowrap;flex:0 0 auto}
.sb.complete{background:var(--green-soft);color:var(--green);border:1px solid var(--green-line)}
.sb.in-progress{background:var(--amber-soft);color:var(--amber);border:1px solid var(--amber-line)}
.sb.ready{background:var(--surface-2);color:var(--ink-3);border:1px solid var(--line)}
.sb.waiting{background:var(--surface-2);color:var(--ink-4);border:1px solid var(--line)}
/* 2.5D slice thumbnail */
.otc-thumb{position:relative;height:118px;background:var(--surface-2);overflow:hidden}
.otc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.otc-thumb-badge{position:absolute;top:9px;right:9px}
.otc-thumb-badge.sb{color:#fff;border:0;box-shadow:0 2px 10px rgba(0,0,0,.28)}
.otc-thumb-badge.sb.complete{background:#0d9488}
.otc-thumb-badge.sb.in-progress{background:#b45309}
.otc-thumb-badge.sb.waiting{background:#64748b}
.otc-slice-id{font:700 10px/1 var(--ff);color:var(--ink-4);background:var(--surface-2);border:1px solid var(--line);padding:4px 8px;border-radius:6px;letter-spacing:.03em;flex:0 0 auto}
/* Artist production-status stepper */
.prod-row{display:flex;flex-direction:column;gap:7px}
.prod-lbl{font:600 11.5px/1 var(--ff);color:var(--ink-3)}
.prod-seg{display:flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--surface-2)}
.prod-step{flex:1;min-width:0;padding:7px 5px;font:700 10.5px/1.1 var(--ff);color:var(--ink-3);background:transparent;border:0;border-right:1px solid var(--line);cursor:pointer;transition:.13s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prod-step:last-child{border-right:0}
.prod-step:hover:not(:disabled):not(.on){background:var(--primary-soft);color:var(--primary)}
.prod-step.on{font-weight:800}
.prod-step.on[data-prod="not-started"]{background:var(--surface);color:var(--ink)}
.prod-step.on[data-prod="wip"]{background:var(--amber-soft);color:var(--amber)}
.prod-step.on[data-prod="completed"]{background:var(--green-soft);color:var(--green)}
.prod-step:disabled{cursor:not-allowed}
.prod-row.locked .prod-step:not(.on){opacity:.45}
.prod-hint{display:flex;align-items:flex-start;gap:6px;font:600 10.5px/1.4 var(--ff);color:var(--ink-3);background:var(--surface-2);border:1px dashed var(--line);border-radius:8px;padding:7px 9px}
.prod-hint svg{width:12px;height:12px;flex:0 0 12px;margin-top:1px;color:var(--primary)}
.prod-hint b{color:var(--ink)}
.otc-body{padding:14px 15px;display:flex;flex-direction:column;gap:10px}
.otc-model-line{font:500 12px/1.45 var(--ff);color:var(--ink-2)}
.otc-model-line b{color:var(--ink);font-weight:700}
.otc-task{font:600 12.5px/1.4 var(--ff);color:var(--ink)}
.otc-task span{color:var(--ink-3);font-weight:600}
.tex-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tex-lbl{font:600 11.5px/1 var(--ff);color:var(--ink-3)}
.tex-val{font:800 11.5px/1 var(--ff)}
.tex-val.not-started{color:var(--ink-3)}
.tex-val.in-progress{color:var(--amber)}
.tex-val.waiting{color:var(--ink-4)}
.tex-val.complete{color:var(--green)}
.tex-files{display:flex;flex-direction:column;gap:5px;margin-top:2px;padding:9px 11px;background:var(--surface-2);border-radius:8px;border:1px solid var(--line)}
.tex-file{display:flex;align-items:center;gap:7px;font:600 11px/1 var(--ff);color:var(--ink-2)}
.tex-file svg{width:12px;height:12px;color:var(--green);flex:0 0 12px}
.otc-bot{padding:10px 14px;border-top:1px solid var(--line);background:var(--surface-2);display:flex;gap:6px;flex-wrap:wrap}
.otc-btn{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:7px;font:600 11px/1 var(--ff);border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer;transition:.14s;white-space:nowrap}
.otc-btn:hover:not(:disabled){background:var(--primary-soft);color:var(--primary);border-color:var(--primary-line)}
.otc-btn:disabled{opacity:.38;cursor:not-allowed}
.otc-btn svg{width:11px;height:11px}
.otc-btn.dl{background:var(--primary-soft);color:var(--primary);border-color:var(--primary-line)}
.otc-btn.dl:hover{background:var(--primary-soft-2)}
.otc-btn.done-btn{background:var(--green-soft);color:var(--green);border-color:var(--green-line)}
.otc-btn.done-btn:hover{background:var(--green-soft);filter:brightness(.95)}
/* QA review states */
.tex-val.review{color:var(--primary)}
.tex-val.changes{color:var(--red)}
.sb.review{background:var(--primary-soft);color:var(--primary);border:1px solid var(--primary-line)}
.sb.changes{background:var(--red-soft);color:var(--red);border:1px solid var(--red-line)}
.otc.changes-card{border-color:var(--red-line)}
.qa-line{display:flex;align-items:flex-start;gap:7px;font:600 11px/1.45 var(--ff)}
.qa-line svg{width:13px;height:13px;flex:0 0 13px;margin-top:1px}
.qa-line.review{color:var(--primary)}
.qa-line.approved{color:var(--green)}.qa-line.approved b{color:var(--ink)}
.qa-flag{display:flex;align-items:flex-start;gap:8px;padding:9px 11px;border-radius:var(--r1);background:var(--red-soft);border:1px solid var(--red-line)}
.qa-flag>svg{width:15px;height:15px;color:var(--red);flex:0 0 15px;margin-top:1px}
.qa-flag-tx b{font:700 11px/1.4 var(--ff);color:var(--red);display:block;margin-bottom:3px}
.qa-flag-tx p{margin:0;font:500 11.5px/1.5 var(--ff);color:var(--ink-2)}
.otc-btn.reopen-btn{background:var(--amber-soft);color:var(--amber);border-color:var(--amber-line)}
.otc-btn.reopen-btn:hover{filter:brightness(.96);background:var(--amber-soft);color:var(--amber)}
.otc-btn.review-btn{color:var(--primary);border-color:var(--primary-line);background:var(--primary-soft)}
.otc-btn.done-btn.approved{background:var(--green-soft);color:var(--green);border-color:var(--green-line)}
.otc-btn.ver-btn{padding:5px 8px}
/* version history modal */
.ver-timeline{display:flex;flex-direction:column}
.ver-row{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line)}
.ver-row:last-child{border-bottom:0}
.ver-rail{display:flex;justify-content:center;width:14px;flex:0 0 14px;padding-top:3px}
.ver-dot{width:11px;height:11px;border-radius:50%;border:2px solid var(--surface);box-shadow:0 0 0 1px var(--line)}
.ver-dot.ok{background:var(--green)}.ver-dot.amber{background:var(--amber)}.ver-dot.primary{background:var(--primary)}.ver-dot.ink{background:var(--ink-4)}
.ver-main{flex:1;min-width:0}
.ver-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.ver-top b{font:800 13px/1 var(--fh);color:var(--ink)}
.ver-cur{font:700 8.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--primary);background:var(--primary-soft);border:1px solid var(--primary-line);padding:2px 5px;border-radius:4px}
.ver-st{font:700 10px/1 var(--ff);padding:3px 6px;border-radius:5px}
.ver-st.ok{color:var(--green);background:var(--green-soft)}.ver-st.amber{color:var(--amber);background:var(--amber-soft)}.ver-st.primary{color:var(--primary);background:var(--primary-soft)}.ver-st.ink{color:var(--ink-3);background:var(--surface-2)}
.ver-meta{font:500 10.5px/1 var(--ff);color:var(--ink-4);margin-top:5px}
.ver-note{font:500 11.5px/1.4 var(--ff);color:var(--ink-2);margin-top:5px}
.ver-dl{flex:0 0 auto;align-self:center}
.ver-files-hdr{font:700 10px/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin:14px 0 8px}
/* img2 — slice reference (View Info) modal */
.info-b{display:flex;gap:20px;align-items:flex-start}
.info-viewer{display:flex;flex-direction:column;gap:11px;flex:1;min-width:0}
.info-stage{position:relative;border-radius:var(--r2);overflow:hidden;background:var(--surface-2);border:1px solid var(--line);aspect-ratio:16/10}
.info-stage img{width:100%;height:100%;object-fit:cover;display:block}
.info-stage img.broken{opacity:0}
.info-badge{position:absolute;left:10px;top:10px;z-index:1;font:700 9.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:#fff;background:rgba(8,12,20,.72);backdrop-filter:blur(3px);padding:5px 9px;border-radius:6px}
.info-cap{font:700 12.5px/1 var(--ff);color:var(--ink)}
.info-thumbs{display:flex;gap:8px;flex-wrap:wrap}
.info-thumb{width:62px;height:46px;border-radius:8px;overflow:hidden;border:2px solid var(--line-2);background:var(--surface-2);cursor:pointer;padding:0;transition:.13s}
.info-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.info-thumb.on{border-color:var(--primary)}
.info-thumb:hover{border-color:var(--primary-line)}
.info-dlrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.info-side{flex:0 0 248px;align-self:stretch;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r2);padding:14px 16px}
.info-side-hdr{font:700 10px/1 var(--ff);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}
.info-row{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--line);font:600 12px/1.3 var(--ff);color:var(--ink-3)}
.info-row:last-child{border-bottom:0}
.info-row b{color:var(--ink);font-weight:700;text-align:right;word-break:break-word}
@media(max-width:600px){.info-b{flex-direction:column}.info-side{flex:1 1 auto;width:100%}}
/* upload history (Upload Queue) */
.view-hdr.between{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.uq-pick-l{display:inline-flex;align-items:center;gap:5px;font:700 9.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-4)}.uq-pick-l svg{width:13px;height:13px}
.vhead-r{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.uq-sel{height:36px;border-radius:9px;border:1px solid var(--line-2);background:var(--surface-2);color:var(--ink);font:600 12.5px/1 var(--ff);padding:0 12px;cursor:pointer;min-width:180px}
.uq-list{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm);overflow:hidden}
.uq-row{display:flex;align-items:center;gap:13px;padding:13px 16px;border-bottom:1px solid var(--line)}
.uq-row:last-child{border-bottom:0}.uq-row:hover{background:var(--surface-2)}
.uq-ic{width:36px;height:36px;flex:0 0 36px;border-radius:9px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary)}.uq-ic svg{width:17px;height:17px}
.uq-main{flex:1;min-width:0}
.uq-file{font:700 13px/1.2 var(--ff);color:var(--ink);word-break:break-word}
.uq-meta{font:600 10.5px/1.35 var(--ff);color:var(--ink-4);margin-top:4px;word-break:break-word}
.uq-badge{flex:0 0 auto;font:700 9.5px/1 var(--ff);padding:4px 9px;border-radius:6px;white-space:nowrap}
.uq-badge.ok{background:var(--green-soft);color:var(--green);border:1px solid var(--green-line)}
.uq-badge.review{background:var(--primary-soft);color:var(--primary);border:1px solid var(--primary-line)}
.uq-badge.changes{background:var(--red-soft);color:var(--red);border:1px solid var(--red-line)}
.uq-badge.up{background:var(--amber-soft);color:var(--amber);border:1px solid var(--amber-line)}
.uq-time{flex:0 0 auto;font:600 10.5px/1 var(--ff);color:var(--ink-3);white-space:nowrap}
.uq-dl{width:30px;height:30px;flex:0 0 30px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface-2);color:var(--ink-3);display:grid;place-items:center;cursor:pointer;transition:.13s}
.uq-dl:hover{color:var(--primary);border-color:var(--primary-line)}.uq-dl svg{width:14px;height:14px}
@media(max-width:640px){.uq-row{flex-wrap:wrap}.uq-badge{order:5}.uq-time{order:6}}

/* ARTIST TASK PANEL (ai-col) */
.atp{background:var(--surface-2);border-radius:var(--r2);border:1px solid var(--line);padding:14px;margin-bottom:14px}
.atp-hdr{font:800 14px/1 var(--fh);color:var(--ink);margin-bottom:3px}
.atp-card-ref{font:700 10px/1 var(--ff);color:var(--ink-4);letter-spacing:.06em;text-transform:uppercase;margin-bottom:12px}
.atp-total{display:flex;align-items:center;justify-content:space-between;padding:11px 13px;background:var(--primary-soft);border:1px solid var(--primary-line);border-radius:var(--r1);margin-bottom:10px}
.atp-total span{font:600 12px/1 var(--ff);color:var(--ink-2)}
.atp-total b{font:800 22px/1 var(--fh);color:var(--primary)}
.atp-stats{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--r1);overflow:hidden;margin-bottom:12px}
.atp-stat{display:flex;justify-content:space-between;align-items:center;padding:9px 13px;font:600 12.5px/1 var(--ff);color:var(--ink-2);border-bottom:1px solid var(--line)}
.atp-stat:last-child{border-bottom:0}
.atp-v{min-width:24px;height:22px;padding:0 7px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font:800 12.5px/1 var(--fh);background:var(--surface-2);color:var(--ink-3)}
.atp-v.green{color:var(--green);background:var(--green-soft)}.atp-v.primary{color:var(--primary);background:var(--primary-soft)}.atp-v.red{color:var(--red);background:var(--red-soft)}.atp-v.amber{color:var(--amber);background:var(--amber-soft)}.atp-v.ink{color:var(--ink-2);background:var(--surface-2)}
.atp-badge{display:flex;align-items:center;gap:7px;padding:8px 10px;border-radius:8px;font:600 11px/1.4 var(--ff);margin-bottom:8px}
.atp-badge.amber{background:var(--amber-soft);color:var(--amber);border:1px solid var(--amber-line)}
.atp-badge.red{background:var(--red-soft);color:var(--red);border:1px solid var(--red-line)}
.atp-badge svg{width:13px;height:13px;flex:0 0 13px}
.guidelines{border-radius:var(--r1);border:1px solid var(--line);overflow:hidden;margin-bottom:12px}
.gl-hdr{padding:8px 12px;border-bottom:1px solid var(--line);font:700 11px/1 var(--ff);color:var(--ink-2);background:var(--surface-3)}
.gl-row{display:flex;gap:8px;padding:7px 12px;border-bottom:1px solid var(--line);font:500 11px/1.3 var(--ff);color:var(--ink-3)}
.gl-row:last-child{border-bottom:0}
.gl-row b{color:var(--ink-2);font-weight:600;flex:0 0 80px}

/* AI PANEL */
.ai-hdr{font:800 13.5px/1 var(--fh);color:var(--ink);margin:0 0 4px}
.ai-sub{font:700 10px/1 var(--ff);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4);margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.ai-item{font:500 12px/1.5 var(--ff);color:var(--ink-3);padding:8px 0;border-bottom:1px solid var(--line);display:flex;gap:7px}
.ai-item:last-child{border-bottom:0}
.ai-item::before{content:"•";color:var(--primary);flex:0 0 auto}
.ai-item b{color:var(--ink-2);font-weight:600}

/* SECONDARY VIEWS */
.view-hdr{margin-bottom:20px}
.view-hdr h1{font:800 22px/1.2 var(--fh);color:var(--ink);margin:0 0 4px}
.view-hdr p{font:500 13px/1 var(--ff);color:var(--ink-3);margin:0}
.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center;color:var(--ink-3)}
.empty-state svg{width:40px;height:40px;margin-bottom:14px;opacity:.4}
.empty-state h3{font:700 15px/1 var(--fh);color:var(--ink-2);margin:0 0 6px}
.empty-state p{font:500 13px/1.5 var(--ff);max-width:300px;margin:0}
.msg-item{background:var(--surface);border-radius:var(--r2);border:1px solid var(--line);padding:14px 16px;margin-bottom:10px}
.msg-item.unread{border-left:3px solid var(--primary);background:var(--primary-soft)}
.msg-from{font:700 13px/1 var(--ff);color:var(--ink);margin-bottom:4px}
.msg-body{font:500 12px/1.4 var(--ff);color:var(--ink-2);margin-bottom:6px}
.msg-time{font:500 10.5px/1 var(--ff);color:var(--ink-4)}
.files-grid{display:flex;flex-direction:column;gap:8px}
.file-row{background:var(--surface);border-radius:var(--r1);border:1px solid var(--line);padding:12px 16px;display:flex;align-items:center;gap:12px}
.file-ico{width:36px;height:36px;border-radius:8px;background:var(--primary-soft);display:grid;place-items:center;color:var(--primary);flex:0 0 36px}
.file-ico svg{width:18px;height:18px}
.file-name{font:600 13px/1 var(--ff);color:var(--ink);flex:1}
.file-meta{font:500 11px/1 var(--ff);color:var(--ink-3);margin-top:2px}

/* MODAL */
.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.42);display:grid;place-items:center;z-index:100;padding:20px}
.mc{background:var(--surface);border-radius:var(--r3);box-shadow:var(--sh-lg);width:100%;max-width:540px;overflow:hidden}
.mc.wide{max-width:660px}
.mc-h{display:flex;align-items:flex-start;gap:14px;padding:18px 22px;border-bottom:1px solid var(--line)}
.mc-h-text h3{font:800 17px/1.2 var(--fh);color:var(--ink);margin:0}
.mc-h-text p{font:500 12px/1.4 var(--ff);color:var(--ink-3);margin:4px 0 0}
.mc-x{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:var(--ink-3);border:1px solid var(--line);background:var(--surface-2);margin-left:auto;flex:0 0 30px;cursor:pointer}
.mc-x:hover{background:var(--surface-3);color:var(--ink)}
.mc-b{padding:20px 22px;display:flex;flex-direction:column;gap:14px;max-height:68vh;overflow-y:auto}
.mc-f{padding:14px 22px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px}
.fld{display:flex;flex-direction:column;gap:5px}
.fld label{font:700 11.5px/1 var(--ff);color:var(--ink-2)}
.fld input,.fld select,.fld textarea{height:36px;border-radius:8px;border:1px solid var(--line-2);background:var(--surface-2);padding:0 10px;font:500 13px/1 var(--ff);color:var(--ink);width:100%;font-family:var(--ff)}
.fld textarea{height:80px;padding:8px 10px;resize:none;line-height:1.5}
.fld select{cursor:pointer}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.upload-zone{border:2px dashed var(--line-2);border-radius:var(--r1);padding:24px 20px;text-align:center;background:var(--surface-2);cursor:pointer;transition:.14s}
.upload-zone:hover,.upload-zone.over{border-color:var(--primary-line);background:var(--primary-soft)}
.upload-zone p{font:600 13px/1.4 var(--ff);color:var(--ink-3);margin:6px 0 4px}
.upload-zone span{font:500 11px/1 var(--ff);color:var(--ink-4)}
.upload-zone svg{width:28px;height:28px;color:var(--ink-3);margin-bottom:4px}
.file-list{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.fl-item{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--green-soft);border:1px solid var(--green-line);border-radius:8px;font:600 12px/1 var(--ff);color:var(--green-d)}
.fl-item svg{width:13px;height:13px}
.fl-rm{margin-left:auto;width:20px;height:20px;border-radius:5px;display:grid;place-items:center;cursor:pointer;color:var(--ink-3);flex:0 0 20px}
.fl-rm:hover{background:var(--red-soft);color:var(--red)}
.fl-rm svg{width:11px;height:11px}
.info-box{background:var(--primary-soft);border:1px solid var(--primary-line);border-radius:var(--r1);padding:10px 12px;font:500 11.5px/1.5 var(--ff);color:var(--ink-2)}
.warn-box{background:var(--amber-soft);border:1px solid var(--amber-line);border-radius:var(--r1);padding:10px 12px;font:500 11.5px/1.5 var(--ff);color:var(--ink-2)}
.brief-section{margin-bottom:14px}
.brief-section h4{font:700 12px/1 var(--ff);color:var(--ink-2);margin:0 0 8px;text-transform:uppercase;letter-spacing:.07em;font-size:10.5px}
.brief-row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid var(--line);font:500 12px/1 var(--ff);color:var(--ink-3)}
.brief-row:last-child{border-bottom:0}
.brief-row b{color:var(--ink-2);font-weight:600}
/* img1 — Overview info grid */
.ov-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.ov-tile{display:flex;align-items:center;gap:13px;padding:16px 18px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm)}
.ov-ic{width:40px;height:40px;flex:0 0 40px;border-radius:11px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary)}
.ov-ic svg{width:19px;height:19px}
.ov-tx{min-width:0}
.ov-tx>span{display:block;font:600 11px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-4);margin-bottom:6px}
.ov-tx b{font:700 15px/1.35 var(--ff);color:var(--ink);display:block;word-break:break-word}
.ov-pri{font-weight:800}.ov-pri.high{color:var(--red)}.ov-pri.medium{color:var(--amber)}.ov-pri.low{color:var(--ink-2)}
@media(max-width:760px){.ov-grid{grid-template-columns:1fr}}
.checklist{display:flex;flex-direction:column;gap:6px}
.cl-item{display:flex;align-items:flex-start;gap:8px;font:500 12px/1.4 var(--ff);color:var(--ink-2)}
.cl-item svg{width:14px;height:14px;color:var(--green);flex:0 0 14px;margin-top:1px}

/* TOASTS */
.toasts{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;z-index:200;pointer-events:none}
.toast{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:11px;background:var(--ink);color:var(--bg);font:600 13px/1 var(--ff);box-shadow:var(--sh);animation:fadeUp .25s ease;pointer-events:auto}
.toast.ok{background:var(--green-d)}.toast.err{background:var(--red-2)}.toast.info{background:var(--primary-3)}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@media(max-width:560px){#logoutBtn{display:none}}

/* ══ WORKFLOW — project detail as a guided pipeline ══ */
.pvh-actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
/* story-card strip */
.cstrip-lbl{font:700 10px/1 var(--ff);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-4);margin-bottom:9px;display:flex;align-items:center;gap:7px}
.cstrip-lbl svg{width:13px;height:13px}
.cardstrip{display:flex;gap:9px;overflow-x:auto;padding:2px 2px 7px;margin-bottom:16px}
.cchip{flex:0 0 auto;min-width:162px;max-width:210px;text-align:left;padding:11px 13px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--sh-sm);cursor:pointer;transition:.14s}
.cchip:hover{border-color:var(--primary-line)}
.cchip.on{border-color:var(--primary);background:var(--primary-soft);box-shadow:0 5px 14px -7px var(--primary-glow)}
.cchip-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cchip-id{font:700 9.5px/1 var(--ff);letter-spacing:.06em;color:var(--ink-3)}
.cchip.on .cchip-id{color:var(--primary)}
.cchip-pct{font:800 11px/1 var(--fh);color:var(--ink-2)}
.cchip.on .cchip-pct{color:var(--primary)}
.cchip-title{font:700 12px/1.3 var(--ff);color:var(--ink);margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cchip-bar{height:4px;border-radius:2px;background:var(--surface-3);overflow:hidden;margin-top:9px}
.cchip-bar i{display:block;height:100%;border-radius:2px;background:linear-gradient(90deg,#2dd4bf,#0d9488)}
/* stepper */
.wf{display:flex;align-items:center;gap:1px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm);padding:7px;margin-bottom:18px;overflow-x:auto}
.wf-step{flex:1 1 0;min-width:128px;display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;cursor:pointer;transition:.14s;background:transparent;text-align:left}
.wf-step:hover{background:var(--surface-2)}
.wf-step.on{background:linear-gradient(180deg,var(--primary-soft),var(--primary-soft-2))}
.wf-num{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:grid;place-items:center;background:var(--surface-2);color:var(--ink-3);font:800 13px/1 var(--fh);border:1px solid var(--line)}
.wf-num svg{width:15px;height:15px}
.wf-step.cur .wf-num{border-color:var(--primary-line);color:var(--primary)}
.wf-step.done .wf-num{background:var(--green-soft);color:var(--green);border-color:var(--green-line)}
.wf-step.on .wf-num{background:linear-gradient(180deg,var(--primary-2),var(--primary));color:var(--primary-ink);border:0;box-shadow:0 5px 12px -4px var(--primary-glow)}
.wf-tx{min-width:0;flex:1}
.wf-tx b{display:block;font:800 12.5px/1 var(--fh);color:var(--ink);white-space:nowrap}
.wf-tx span{display:block;font:600 9.5px/1 var(--ff);color:var(--ink-4);white-space:nowrap;margin-top:3px}
.wf-step.on .wf-tx b{color:var(--primary)}
.wf-cnt{flex:0 0 auto;min-width:20px;height:20px;padding:0 6px;border-radius:99px;display:inline-flex;align-items:center;justify-content:center;font:800 10.5px/1 var(--fh);background:var(--surface-2);color:var(--ink-3)}
.wf-step.on .wf-cnt{background:var(--primary);color:var(--primary-ink)}
.wf-sep{flex:0 0 auto;color:var(--line-2);display:flex}.wf-sep svg{width:15px;height:15px}
@media(max-width:860px){.wf-step{min-width:48px;justify-content:center}.wf-tx,.wf-sep,.wf-cnt{display:none}.wf-step.on{flex:2 1 0}.wf-step.on .wf-tx{display:block}}
/* stage head + empty */
.stage-head{margin-bottom:16px}
.stage-head h2{font:800 17px/1.2 var(--fh);color:var(--ink);display:flex;align-items:center;gap:9px;margin:0}
.stage-head h2 svg{width:19px;height:19px;color:var(--primary);flex:0 0 19px}
.stage-head p{font:500 12.5px/1.55 var(--ff);color:var(--ink-3);margin:6px 0 0;max-width:80ch}
.stage-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:42px 20px;border:1px dashed var(--line-2);border-radius:var(--r2);color:var(--ink-3);background:var(--surface)}
.stage-empty svg{width:34px;height:34px;color:var(--ink-4);margin-bottom:11px}
.stage-empty h3{font:700 14px/1 var(--fh);color:var(--ink-2);margin:0 0 6px}
.stage-empty p{font:500 12px/1.5 var(--ff);margin:0;max-width:340px}
/* brief stage */
.brief-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:14px}
.brief-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm);padding:17px 19px}
.brief-card h3{font:800 13.5px/1 var(--fh);color:var(--ink);margin:0 0 13px;display:flex;align-items:center;gap:8px}
.brief-card h3 svg{width:16px;height:16px;color:var(--primary);flex:0 0 16px}
.brief-req{font:500 13px/1.65 var(--ff);color:var(--ink-2);margin:0}.brief-req b{color:var(--ink);font-weight:700}
.brief-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:15px}
.brief-mini-c{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r1);padding:11px 12px}
.brief-mini-c .v{font:800 18px/1 var(--fh);color:var(--ink)}
.brief-mini-c .v.amber{color:var(--amber)}.brief-mini-c .v.green{color:var(--green)}
.brief-mini-c .l{font:600 10px/1.2 var(--ff);color:var(--ink-3);margin-top:5px;text-transform:uppercase;letter-spacing:.03em}
.brief-cta{margin-top:16px}
.brief-refnote{display:flex;align-items:flex-start;gap:9px;margin-top:13px;padding:11px 13px;background:var(--primary-soft);border:1px solid var(--primary-line);border-radius:var(--r1);font:500 11.5px/1.5 var(--ff);color:var(--ink-2)}
.brief-refnote svg{width:14px;height:14px;color:var(--primary);flex:0 0 14px;margin-top:1px}
@media(max-width:760px){.brief-grid{grid-template-columns:1fr}.cchip{min-width:142px}}
/* project-card pipeline track (dashboard) */
.pc-stage{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.pc-track{display:flex;gap:5px;flex:0 0 auto}
.pc-track i{width:7px;height:7px;border-radius:50%;background:var(--surface-3)}
.pc-track i.done{background:var(--green)}.pc-track i.cur{background:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.pc-stage-n{font:700 10.5px/1 var(--ff);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* ══ Messages — replies/threads ══ */
.msg-actions{margin-top:12px;display:flex;gap:8px}
.msg-thread{margin-top:13px;padding-top:13px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:9px}
.msg-reply{padding:10px 13px;background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--primary);border-radius:var(--r1)}
.msg-reply-from{font:700 11.5px/1 var(--ff);color:var(--primary)}
.msg-reply-body{font:500 12px/1.55 var(--ff);color:var(--ink-2);margin-top:5px}
.msg-reply-time{font:500 10px/1 var(--ff);color:var(--ink-4);margin-top:5px}
.reply-quote{padding:11px 13px;background:var(--surface-2);border:1px solid var(--line);border-left:3px solid var(--ink-4);border-radius:var(--r1)}
.reply-quote-from{font:700 11px/1 var(--ff);color:var(--ink-3)}
.reply-quote p{margin:6px 0 0;font:500 12px/1.5 var(--ff);color:var(--ink-3)}
/* ══ My Tasks — enhanced ══ */
.tasks-prog{background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm);padding:14px 16px;margin-bottom:16px}
.tasks-prog-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:9px}
.tasks-prog-top b{font:800 15px/1 var(--fh);color:var(--ink)}
.tasks-prog-top span{font:600 11.5px/1 var(--ff);color:var(--ink-3)}
.task-list{display:flex;flex-direction:column;gap:10px}
.task-sec-lbl{font:700 10px/1 var(--ff);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4);margin:10px 0 1px}
.task-c{display:flex;align-items:center;gap:13px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm);padding:14px 16px;transition:.14s;position:relative}
.task-c::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:var(--r2) 0 0 var(--r2);background:transparent}
.task-c.pri-high::before{background:var(--red)}.task-c.pri-medium::before{background:var(--amber)}
.task-c:hover{border-color:var(--line-2);box-shadow:var(--sh)}
.task-c.done{opacity:.62}
.task-c.done .task-c-title{text-decoration:line-through;color:var(--ink-4)}
.task-c .task-cb{width:23px;height:23px;flex:0 0 23px;border-radius:7px;border:2px solid var(--line-2);display:grid;place-items:center;cursor:pointer;background:var(--surface-2);transition:.14s;padding:0}
.task-c .task-cb svg{width:13px;height:13px;color:#fff;display:none}
.task-c .task-cb.on{background:var(--green);border-color:var(--green)}
.task-c .task-cb.on svg{display:block}
.task-c-main{flex:1;min-width:0}
.task-c-title{font:700 13.5px/1.35 var(--ff);color:var(--ink)}
.task-c-meta{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-top:8px}
.t-pri-pill{font:800 9px/1 var(--ff);letter-spacing:.04em;padding:4px 7px;border-radius:5px}
.t-pri-pill.high{background:var(--red-soft);color:var(--red);border:1px solid var(--red-line)}
.t-pri-pill.medium{background:var(--amber-soft);color:var(--amber);border:1px solid var(--amber-line)}
.t-pri-pill.low{background:var(--surface-2);color:var(--ink-3);border:1px solid var(--line)}
.t-due,.t-proj{display:inline-flex;align-items:center;gap:5px;font:600 10.5px/1 var(--ff);color:var(--ink-3)}
.t-due svg,.t-proj svg{width:12px;height:12px;color:var(--ink-4);flex:0 0 12px}
.t-due.red{color:var(--red)}.t-due.red svg{color:var(--red)}
.t-due.amber{color:var(--amber)}.t-due.amber svg{color:var(--amber)}
.task-open{flex:0 0 auto}
@media(max-width:600px){.task-c{flex-wrap:wrap}.task-open{width:100%;margin-left:36px}}

/* ═══ ASSET PIPELINE (artist push/pull tracker, synced with the Project Panel) ═══ */
.pipe-flow{display:flex;align-items:center;gap:9px;padding:11px 14px;border-radius:var(--r2);background:var(--primary-soft);border:1px solid var(--primary-line);margin-bottom:16px;font:500 12px/1.55 var(--ff);color:var(--ink-2)}
.pipe-flow svg{width:16px;height:16px;color:var(--primary);flex:0 0 auto}.pipe-flow b{color:var(--ink);white-space:nowrap}
.pipe-st{display:inline-flex;align-items:center;gap:5px;font:800 9px/1 var(--ff);letter-spacing:.03em;text-transform:uppercase;padding:5px 9px;border-radius:6px;white-space:nowrap;flex:0 0 auto}
.pipe-st.assigned{background:var(--primary-soft);color:var(--primary);border:1px solid var(--primary-line)}
.pipe-st.wip{background:var(--amber-soft);color:var(--amber);border:1px solid var(--amber-line)}
.pipe-st.pushed{background:var(--violet-soft);color:var(--violet);border:1px solid var(--violet-line)}
.pipe-st.accepted{background:var(--green-soft);color:var(--green);border:1px solid var(--green-line)}
.pipe-st.rejected{background:var(--red-soft);color:var(--red);border:1px solid var(--red-line)}
.pipe-st.pulled{background:var(--surface-3);color:var(--ink-3);border:1px solid var(--line-2)}
.pipe-st.unassigned{background:var(--surface-2);color:var(--ink-3);border:1px solid var(--line)}
.apipe-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}
@media(max-width:760px){.apipe-stats{grid-template-columns:repeat(2,1fr)}}
.apipe-stat{display:flex;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r2);box-shadow:var(--sh-sm);padding:13px 15px}
.apipe-stat-ic{width:36px;height:36px;flex:0 0 36px;border-radius:10px;display:grid;place-items:center;background:var(--surface-2);color:var(--ink-3)}.apipe-stat-ic svg{width:17px;height:17px}
.apipe-stat.pushed .apipe-stat-ic{background:var(--amber-soft);color:var(--amber)}
.apipe-stat.wip .apipe-stat-ic{background:var(--primary-soft);color:var(--primary)}
.apipe-stat.rejected .apipe-stat-ic{background:var(--red-soft);color:var(--red)}
.apipe-stat.accepted .apipe-stat-ic{background:var(--green-soft);color:var(--green)}
.apipe-stat-v{font:800 20px/1 var(--fh);color:var(--ink)}
.apipe-stat-l{font:600 10.5px/1 var(--ff);color:var(--ink-3);margin-top:5px}
.apipe-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px;align-items:start}
.apipe-card{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--line-2);border-radius:var(--r2);box-shadow:var(--sh-sm);padding:15px 16px;display:flex;flex-direction:column;gap:13px}
.apipe-card.assigned{border-left-color:var(--primary)}.apipe-card.wip{border-left-color:var(--amber)}.apipe-card.pushed{border-left-color:var(--violet)}.apipe-card.accepted{border-left-color:var(--green)}.apipe-card.rejected{border-left-color:var(--red)}
.apipe-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.apipe-kind{font:800 8.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;padding:4px 7px;border-radius:5px;color:#fff;background:rgba(10,126,180,.9);flex:0 0 auto}
.apipe-kind.tool{background:rgba(217,119,6,.92)}.apipe-kind.equipment{background:rgba(124,58,237,.92)}.apipe-kind.slice{background:rgba(8,145,178,.92)}
.apipe-name{font:800 14.5px/1.2 var(--fh);color:var(--ink);flex:1;min-width:0}
.atrack{display:flex;align-items:center;gap:5px}
.atrack-seg{flex:1;text-align:center;font:700 9.5px/1 var(--ff);letter-spacing:.02em;text-transform:uppercase;color:var(--ink-4);background:var(--surface-2);border:1px solid var(--line);padding:7px 4px;border-radius:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atrack-seg.done{background:var(--green-soft);color:var(--green);border-color:var(--green-line)}
.atrack-seg.on{background:var(--primary-soft);color:var(--primary);border-color:var(--primary-line)}
.atrack-seg.acc{background:var(--green);color:#fff;border-color:var(--green)}
.atrack-seg.rej{background:var(--red);color:#fff;border-color:var(--red)}
/* artist 3D-Models filter tabs */
.amf-tabs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px;padding:5px;background:var(--surface-2);border:1px solid var(--line);border-radius:11px}
.amf-tab{display:inline-flex;align-items:center;gap:7px;font:700 12px/1 var(--ff);color:var(--ink-3);background:transparent;border:0;padding:9px 13px;border-radius:8px;cursor:pointer;transition:.13s}
.amf-tab:hover{color:var(--ink)}
.amf-tab.on{color:var(--primary-ink);background:var(--primary);box-shadow:var(--sh-sm)}
.amf-n{font:800 10px/1 var(--ff);padding:3px 7px;border-radius:20px;background:var(--surface-3);color:var(--ink-3)}
.amf-tab.on .amf-n{background:rgba(255,255,255,.22);color:#fff}
/* model detail modal */
.md-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:13px}
.md-meta .apipe-kind{position:static}
.md-chip{display:inline-flex;align-items:center;gap:5px;font:700 10.5px/1 var(--ff);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);padding:6px 9px;border-radius:7px}
.md-chip svg{width:12px;height:12px;color:var(--ink-3)}
.md-desc{font:500 12.5px/1.65 var(--ff);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin-bottom:14px}
.md-track{margin-bottom:14px}
.md-fb{display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border-radius:10px;background:var(--red-soft);border:1px solid var(--red-line);margin-bottom:14px}
.md-fb svg{width:15px;height:15px;color:var(--red);flex:0 0 15px;margin-top:1px}
.md-fb b{display:block;font:700 11.5px/1.3 var(--ff);color:var(--ink);margin-bottom:3px}
.md-fb p{font:500 11.5px/1.5 var(--ff);color:var(--ink-2);margin:0}
.md-slices-h{display:flex;align-items:center;gap:8px;font:700 12px/1 var(--ff);color:var(--ink-2);margin-bottom:11px}
.md-slices-h svg{width:15px;height:15px;color:var(--primary)}
.md-sc{margin-left:auto;font:800 10px/1 var(--ff);color:var(--amber);background:var(--amber-soft);border:1px solid var(--amber-line);padding:4px 8px;border-radius:6px}
.md-sc.ok{color:var(--green);background:var(--green-soft);border-color:var(--green-line)}
.md-single{display:inline-flex;align-items:center;gap:8px;font:600 12px/1 var(--ff);color:var(--ink-3)}
.md-single svg{width:15px;height:15px;color:var(--primary)}
.md-slices{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.md-slice{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface-2)}
.md-slice.done{border-color:var(--green-line)}
.md-sthumb{position:relative;height:74px;background:var(--surface-3)}
.md-sthumb img{width:100%;height:100%;object-fit:cover;display:block}
.md-sdone{position:absolute;right:6px;top:6px;width:19px;height:19px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;border:2px solid var(--surface)}
.md-sdone svg{width:10px;height:10px}
.md-sn{display:block;font:700 11px/1.25 var(--ff);color:var(--ink);padding:8px 9px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.md-sst{display:block;font:700 9px/1 var(--ff);color:var(--ink-4);padding:5px 9px 9px;text-transform:uppercase;letter-spacing:.03em}
.md-slice.done .md-sst{color:var(--green)}
.pv3-card{cursor:pointer}
.apipe-fb{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-radius:10px;background:var(--red-soft);border:1px solid var(--red-line)}
.apipe-fb svg{width:14px;height:14px;color:var(--red);flex:0 0 14px;margin-top:1px}
.apipe-fb b{display:block;font:700 11px/1.3 var(--ff);color:var(--ink);margin-bottom:3px}
.apipe-fb p{font:500 11.5px/1.5 var(--ff);color:var(--ink-2);margin:0}
.apipe-act{display:flex}.apipe-act .btn{width:100%;justify-content:center}
.apipe-wait{display:inline-flex;align-items:center;gap:7px;width:100%;justify-content:center;font:700 12px/1 var(--ff);color:var(--violet);background:var(--violet-soft);border:1px solid var(--violet-line);padding:9px;border-radius:var(--r1)}.apipe-wait svg{width:14px;height:14px}
.apipe-done{display:inline-flex;align-items:center;gap:7px;width:100%;justify-content:center;font:700 12px/1 var(--ff);color:var(--green);background:var(--green-soft);border:1px solid var(--green-line);padding:9px;border-radius:var(--r1)}.apipe-done svg{width:14px;height:14px}
.apipe-meta{display:flex;flex-wrap:wrap;gap:7px}
.apipe-alloc,.apipe-due{display:inline-flex;align-items:center;gap:5px;font:700 10.5px/1 var(--ff);padding:5px 9px;border-radius:6px;white-space:nowrap}
.apipe-alloc{color:var(--primary);background:var(--primary-soft);border:1px solid var(--primary-line)}
.apipe-due{color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line)}
.apipe-alloc svg,.apipe-due svg{width:12px;height:12px;flex:0 0 12px}
.apipe-kind.model{background:rgba(15,118,110,.92)}
.apipe-slices{border-top:1px solid var(--line);padding-top:11px;display:flex;flex-direction:column;gap:8px}
.apipe-slices-h{display:flex;align-items:center;gap:7px;font:700 11px/1 var(--ff);color:var(--ink-3);letter-spacing:.02em}
.apipe-slices-h svg{width:14px;height:14px;color:var(--primary);flex:0 0 14px}
.apipe-sc{margin-left:auto;font:800 10px/1 var(--ff);color:var(--amber);background:var(--amber-soft);border:1px solid var(--amber-line);padding:4px 8px;border-radius:6px}
.apipe-sc.ok{color:var(--green);background:var(--green-soft);border-color:var(--green-line)}
.apipe-chips{display:flex;flex-wrap:wrap;gap:6px}
.apipe-chip{display:inline-flex;align-items:center;gap:5px;font:600 10.5px/1 var(--ff);color:var(--ink-3);background:var(--surface-2);border:1px solid var(--line);padding:5px 8px;border-radius:6px}
.apipe-chip svg{width:11px;height:11px;color:var(--ink-4);flex:0 0 11px}
.apipe-chip.done{color:var(--green);background:var(--green-soft);border-color:var(--green-line)}
.apipe-chip.done svg{color:var(--green)}
/* upload-model modal — every mandatory slice must be uploaded & named */
.up-prog{margin-bottom:14px}
.up-prog-tx{font:600 12px/1 var(--ff);color:var(--ink-2);margin-bottom:8px}.up-prog-tx b{color:var(--ink);font-weight:800}
.up-prog-bar{height:8px;border-radius:5px;background:var(--surface-3);overflow:hidden}
.up-prog-bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--green),var(--primary));transition:width .3s}
.up-list{display:flex;flex-direction:column;gap:8px}
.up-row{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--surface-2)}
.up-row.on{border-color:var(--green-line);background:var(--green-soft)}
.up-row.bad{border-color:var(--red-line);background:var(--red-soft)}
.up-pin{width:22px;height:22px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;background:var(--surface);border:1.5px solid var(--line-2);font:800 10px/1 var(--fh);color:var(--ink-3)}
.up-row.on .up-pin{border-color:var(--green);color:var(--green)}
.up-id{flex:0 0 auto;font:700 9.5px/1 var(--fh);color:var(--ink-4);background:var(--surface);border:1px solid var(--line);padding:4px 6px;border-radius:6px;white-space:nowrap}
.up-name{flex:1;min-width:60px;font:600 12.5px/1 var(--ff);color:var(--ink);background:var(--surface);border:1px solid var(--line-2);border-radius:7px;padding:7px 9px;outline:none}
.up-name:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}
.up-name.err{border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft)}
.up-file{display:inline-flex;align-items:center;gap:5px;max-width:148px;font:700 10.5px/1 var(--ff);color:var(--green);flex:0 0 auto}
.up-file svg{width:13px;height:13px;flex:0 0 13px}
.up-file span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.up-upbtn{flex:0 0 auto;white-space:nowrap}
.up-x{width:26px;height:26px;flex:0 0 auto;border-radius:7px;display:grid;place-items:center;color:var(--ink-4);background:var(--surface)}
.up-x:hover{color:var(--red);background:var(--red-soft)}.up-x svg{width:13px;height:13px}
.up-note{display:flex;align-items:flex-start;gap:8px;margin-top:13px;padding:11px 13px;border-radius:10px;font:600 12px/1.5 var(--ff)}
.up-note svg{width:15px;height:15px;flex:0 0 15px;margin-top:1px}
.up-note.ok{background:var(--green-soft);border:1px solid var(--green-line);color:var(--green)}
.up-note.bad{background:var(--red-soft);border:1px solid var(--red-line);color:var(--red)}
/* Whole-model upload → scan → match report */
.updrop{border:2px dashed var(--line-2);border-radius:14px;background:var(--surface-2);padding:30px 22px;text-align:center;cursor:pointer;transition:.15s;margin-bottom:14px}
.updrop:hover{border-color:var(--primary);background:var(--primary-soft)}
.updrop-ic{width:50px;height:50px;margin:0 auto 12px;border-radius:14px;display:grid;place-items:center;background:var(--surface);border:1px solid var(--line);color:var(--primary)}
.updrop-ic svg{width:24px;height:24px}
.updrop b{display:block;font:800 15px/1.2 var(--fh);color:var(--ink)}
.updrop p{font:500 12px/1.5 var(--ff);color:var(--ink-3);margin:6px 0 14px}
.scan-exp{border:1px solid var(--line);border-radius:11px;background:var(--surface-2);padding:12px 13px}
.scan-exp-h{display:flex;align-items:center;gap:7px;font:700 11.5px/1 var(--ff);color:var(--ink-2);margin-bottom:9px}
.scan-exp-h svg{width:14px;height:14px;color:var(--primary)}
.scan-exp-list{display:flex;flex-wrap:wrap;gap:7px}
.scan-exp-chip{display:inline-flex;align-items:center;gap:5px;font:600 11px/1 var(--ff);color:var(--ink-2);background:var(--surface);border:1px solid var(--line);padding:6px 9px;border-radius:7px}
.scan-exp-chip i{font-style:normal;font:700 8.5px/1 var(--fh);color:var(--ink-4);background:var(--surface-2);border:1px solid var(--line);padding:2px 5px;border-radius:4px}
.scan-exp-chip svg{width:11px;height:11px;color:var(--green)}
.scan-exp-chip.on{color:var(--green);border-color:var(--green-line);background:var(--green-soft)}
.scan-exp-chip.scanning{color:var(--primary);border-color:var(--primary-line);background:var(--primary-soft);animation:scanpulse 1s ease-in-out infinite}
@keyframes scanpulse{0%,100%{opacity:.5}50%{opacity:1}}
.scan-file{display:flex;align-items:center;gap:11px;padding:12px 13px;border-radius:11px;border:1px solid var(--line);background:var(--surface-2);margin-bottom:13px}
.scan-file>svg{width:20px;height:20px;flex:0 0 20px;color:var(--primary)}
.scan-file.ok>svg{color:var(--green)}
.scan-spin{display:grid;place-items:center;flex:0 0 20px;color:var(--primary);animation:scanspin 1s linear infinite}
.scan-spin svg{width:20px;height:20px}
@keyframes scanspin{to{transform:rotate(360deg)}}
.scan-file b{display:block;font:800 13px/1.2 var(--ff);color:var(--ink)}
.scan-file span{display:block;font:600 11px/1 var(--ff);color:var(--ink-4);margin-top:4px}
.scan-bar{height:8px;border-radius:5px;background:var(--surface-3);overflow:hidden;margin-bottom:8px}
.scan-bar i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,var(--primary),var(--green))}
.scan-bar i.go{width:8%;animation:scanfill 1.05s ease forwards}
@keyframes scanfill{to{width:100%}}
.scan-pct{font:600 11.5px/1 var(--ff);color:var(--ink-3);margin-bottom:12px}
.scan-report{display:flex;flex-direction:column;gap:7px}
.scan-row{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;border:1px solid var(--line);background:var(--surface-2)}
.scan-row.ok{border-color:var(--green-line);background:var(--green-soft)}
.scan-row.bad{border-color:var(--red-line);background:var(--red-soft)}
.scan-row>svg{width:16px;height:16px;flex:0 0 16px}
.scan-row.ok>svg{color:var(--green)}.scan-row.bad>svg{color:var(--red)}
.scan-rtx{flex:1;min-width:0}
.scan-rtx b{display:block;font:700 12.5px/1.2 var(--ff);color:var(--ink)}
.scan-rtx span{display:block;font:700 9px/1 var(--fh);color:var(--ink-4);margin-top:4px}
.scan-rst{flex:0 0 auto;font:700 10px/1 var(--ff);color:var(--green)}
.scan-row.bad .scan-rst{color:var(--red)}
/* My Tasks — cross-project main models + slice breakdown */
.task-proj{margin-bottom:18px}
.task-proj-h{display:flex;align-items:center;gap:11px;padding:0 2px 11px;margin-bottom:9px;border-bottom:1px solid var(--line)}
.task-proj-ic{width:34px;height:34px;flex:0 0 auto;border-radius:9px;display:grid;place-items:center;color:#fff;font:800 11px/1 var(--fh)}
.task-proj-tx{flex:1;min-width:0}
.task-proj-tx b{display:block;font:800 14.5px/1.2 var(--fh);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.task-proj-tx span{display:block;font:500 11.5px/1.3 var(--ff);color:var(--ink-3);margin-top:4px}
.task-proj-badge{flex:0 0 auto;font:700 10px/1 var(--ff);letter-spacing:.03em;text-transform:uppercase;padding:5px 9px;border-radius:6px;color:var(--ink-3);background:var(--surface-2);border:1px solid var(--line)}
.task-proj-badge.in-progress{color:var(--amber);background:var(--amber-soft);border-color:var(--amber-line)}
.task-proj-badge.ready{color:var(--primary);background:var(--primary-soft);border-color:var(--primary-line)}
.task-models{display:flex;flex-direction:column;gap:8px}
.task-model{border:1px solid var(--line);border-radius:var(--r1);background:var(--surface);overflow:hidden}
.task-msum{display:flex;align-items:center;gap:10px;padding:11px 13px;cursor:pointer;list-style:none}
.task-msum::-webkit-details-marker{display:none}
.task-msum:hover{background:var(--surface-2)}
.task-msum .apipe-kind{flex:0 0 auto}
.task-mtx{flex:1;min-width:0}
.task-mtx b{display:block;font:750 13.5px/1.2 var(--fh);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.task-mtx span{display:inline-flex;align-items:center;gap:4px;font:600 10.5px/1 var(--ff);color:var(--ink-3);margin-top:5px}
.task-mtx span svg{width:11px;height:11px;flex:0 0 11px}
.task-mc{flex:0 0 auto;font:700 10px/1 var(--ff);color:var(--ink-2);background:var(--surface-2);border:1px solid var(--line);padding:4px 8px;border-radius:6px;white-space:nowrap}
.task-caret{flex:0 0 auto;width:7px;height:7px;border-right:2px solid var(--ink-4);border-bottom:2px solid var(--ink-4);transform:rotate(45deg);transition:transform .18s}
.task-model[open] .task-caret{transform:rotate(-135deg)}
.task-mbody{padding:0 13px 13px;border-top:1px solid var(--line)}
.task-mbody .apipe-chips{margin-top:12px}
.task-single{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font:600 11.5px/1 var(--ff);color:var(--ink-3)}
.task-single svg{width:14px;height:14px;color:var(--primary)}
@media(max-width:560px){.task-mc{display:none}}
/* Project → 3D Models screen (model + slice images) */
.pv3-lead{margin:6px 0 16px}
.pv3-lead h2{display:flex;align-items:center;gap:9px;font:800 18px/1.2 var(--fh);color:var(--ink);margin:0}
.pv3-lead h2 svg{width:20px;height:20px;color:var(--primary)}
.pv3-lead p{font:500 12.5px/1.6 var(--ff);color:var(--ink-3);margin:7px 0 0;max-width:760px}
.pv3-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:16px}
.pv3-card{display:flex;flex-direction:column;border-radius:var(--r2);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-sm);overflow:hidden;transition:.15s}
.pv3-card:hover{box-shadow:var(--sh);transform:translateY(-2px)}
/* whole-card status colour-coding — a theme-aware tint + border, no hard top bar */
.pv3-card.assigned{border-color:var(--primary-line)}.pv3-card.wip{border-color:var(--amber-line)}.pv3-card.pushed{border-color:var(--violet-line)}.pv3-card.accepted{border-color:var(--green-line)}.pv3-card.rejected{border-color:var(--red-line)}
.pv3-card.assigned .pv3-b{background:linear-gradient(180deg,var(--primary-soft),transparent 104px)}
.pv3-card.wip .pv3-b{background:linear-gradient(180deg,var(--amber-soft),transparent 104px)}
.pv3-card.pushed .pv3-b{background:linear-gradient(180deg,var(--violet-soft),transparent 104px)}
.pv3-card.accepted .pv3-b{background:linear-gradient(180deg,var(--green-soft),transparent 104px)}
.pv3-card.rejected .pv3-b{background:linear-gradient(180deg,var(--red-soft),transparent 104px)}
.pv3-img{position:relative;height:148px;background:var(--surface-2);display:grid;place-items:center;overflow:hidden}
.pv3-imgshade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(8,12,20,.32),transparent 40%,transparent 62%,rgba(8,12,20,.14))}
.pv3-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pv3-imgfill{position:relative;color:var(--ink-4)}.pv3-imgfill svg{width:38px;height:38px}
.pv3-img .apipe-kind{position:absolute;top:10px;left:10px;z-index:1}
.pv3-img .pipe-st{position:absolute;top:10px;right:10px;z-index:1}
.pv3-b{padding:14px 15px;display:flex;flex-direction:column;gap:10px;flex:1}
.pv3-top{display:flex;align-items:center;gap:9px}
.pv3-name{flex:1;min-width:0;font:800 15px/1.2 var(--fh);color:var(--ink)}
.pv3-id{flex:0 0 auto;font:700 9.5px/1 var(--fh);color:var(--ink-4);background:var(--surface-2);border:1px solid var(--line);padding:4px 7px;border-radius:6px}
.pv3-desc{font:500 11.5px/1.55 var(--ff);color:var(--ink-3);margin-top:-3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.pv3-meta{display:flex;flex-wrap:wrap;gap:7px;margin-top:-2px}
.pv3-due,.pv3-alloc{display:inline-flex;align-items:center;gap:5px;font:700 10.5px/1 var(--ff);padding:5px 8px;border-radius:6px}
.pv3-due{color:var(--amber);background:var(--amber-soft);border:1px solid var(--amber-line)}.pv3-due svg{width:12px;height:12px}
.pv3-alloc{color:var(--primary);background:var(--primary-soft);border:1px solid var(--primary-line)}
.pv3-slices{border-top:1px solid var(--line);padding-top:11px;display:flex;flex-direction:column;gap:9px}
.pv3-slices-h{display:flex;align-items:center;gap:7px;width:100%;font:700 11px/1 var(--ff);color:var(--ink-3);background:transparent;border:0;padding:0;cursor:pointer;text-align:left}
.pv3-slices-h:hover{color:var(--ink)}
.pv3-slices-h svg{width:13px;height:13px;color:var(--primary);flex:0 0 13px}
.pv3-sh-tx{flex:0 0 auto}
.pv3-slices-h .md-sc{margin-left:auto}
.pv3-chev{flex:0 0 auto;width:7px;height:7px;border-right:2px solid var(--ink-4);border-bottom:2px solid var(--ink-4);transform:rotate(45deg);transition:transform .2s}
.pv3-slices-h:hover .pv3-chev{border-color:var(--ink-2)}
.pv3-slices.collapsed .pv3-chev{transform:rotate(-45deg)}
.pv3-slices.collapsed .md-slices{display:none}
.pv3-sc{margin-left:auto;font:800 10px/1 var(--ff);color:var(--amber);background:var(--amber-soft);border:1px solid var(--amber-line);padding:4px 8px;border-radius:6px}
.pv3-sc.ok{color:var(--green);background:var(--green-soft);border-color:var(--green-line)}
.pv3-slice-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(70px,1fr));gap:9px}
.pv3-slice{display:flex;flex-direction:column;gap:5px;min-width:0}
.pv3-sthumb{position:relative;aspect-ratio:1;border-radius:9px;overflow:hidden;background:var(--surface-2);border:1px solid var(--line)}
.pv3-sthumb img{width:100%;height:100%;object-fit:cover;display:block}
.pv3-slice.done .pv3-sthumb{border-color:var(--green-line)}
.pv3-sdone{position:absolute;top:3px;right:3px;width:17px;height:17px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff}.pv3-sdone svg{width:11px;height:11px}
.pv3-sname{font:600 10px/1.25 var(--ff);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center}
.pv3-single{border-top:1px solid var(--line);padding-top:11px;display:inline-flex;align-items:center;gap:7px;font:600 11.5px/1.4 var(--ff);color:var(--ink-3)}
.pv3-single svg{width:14px;height:14px;color:var(--primary);flex:0 0 14px}
.pv3-act{margin-top:auto;display:flex;flex-direction:column;gap:7px}.pv3-act .btn{width:100%;justify-content:center}
.pv3-wait,.pv3-doneact{display:inline-flex;align-items:center;justify-content:center;gap:7px;width:100%;font:700 12px/1 var(--ff);padding:10px;border-radius:var(--r1)}
.pv3-wait{color:var(--violet);background:var(--violet-soft);border:1px solid var(--violet-line)}.pv3-wait svg{width:14px;height:14px}
.pv3-doneact{color:var(--green);background:var(--green-soft);border:1px solid var(--green-line)}.pv3-doneact svg{width:14px;height:14px}
/* My Tasks — refined list */
.tk-head{display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:20px}
.tk-head-tx{flex:1;min-width:240px}
.tk-head-tx h1{font:800 23px/1.1 var(--fh);color:var(--ink);margin:0}
.tk-head-tx p{font:500 13px/1.5 var(--ff);color:var(--ink-3);margin:7px 0 0}
.tk-sum{display:flex;gap:8px}
.tk-sum-i{display:flex;flex-direction:column;gap:4px;align-items:center;padding:11px 16px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-sm);min-width:70px}
.tk-sum-i b{font:800 19px/1 var(--fh);color:var(--ink)}.tk-sum-i b.g{color:var(--green)}
.tk-sum-i span{font:600 9.5px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-4)}
.tk-proj{margin-bottom:22px}
.tk-proj-h{display:flex;align-items:center;gap:11px;margin-bottom:10px}
.tk-proj-ic{width:32px;height:32px;flex:0 0 auto;border-radius:9px;display:grid;place-items:center;color:#fff;font:800 10.5px/1 var(--fh)}
.tk-proj-tx{flex:1;min-width:0}
.tk-proj-tx b{display:block;font:800 14px/1.2 var(--fh);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-proj-tx span{display:block;font:500 11px/1 var(--ff);color:var(--ink-4);margin-top:4px}
.tk-proj-prog{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.tk-proj-prog>span{font:800 11px/1 var(--fh);color:var(--ink-2);min-width:30px;text-align:right}
.tk-bar{width:120px;height:6px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.tk-bar.sm{width:64px;height:5px}
.tk-bar i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--primary),var(--green))}
.tk-models{display:flex;flex-direction:column;gap:7px}
.tk-model{border:1px solid var(--line);border-radius:11px;background:var(--surface);box-shadow:var(--sh-sm);overflow:hidden;transition:.13s}
.tk-model:hover{border-color:var(--line-2)}
.tk-msum{display:flex;align-items:center;gap:11px;padding:12px 14px;cursor:pointer;list-style:none}
.tk-msum::-webkit-details-marker{display:none}
.tk-msum:hover{background:var(--surface-2)}
.tk-mkind{flex:0 0 auto;font:700 9px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;padding:4px 7px;border-radius:5px;color:#fff;background:rgba(15,118,110,.92)}
.tk-mkind.tool{background:rgba(217,119,6,.92)}.tk-mkind.equipment{background:rgba(124,58,237,.92)}
.tk-mtx{flex:1;min-width:0}
.tk-mtx b{display:block;font:750 13.5px/1.2 var(--fh);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-mtx span{display:block;font:600 10.5px/1 var(--ff);color:var(--ink-4);margin-top:4px}
.tk-mprog{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.tk-mprog>span{font:700 10.5px/1 var(--fh);color:var(--ink-3);min-width:26px;text-align:right}
.tk-msingle{flex:0 0 auto;font:700 10px/1 var(--ff);color:var(--ink-4);background:var(--surface-2);border:1px solid var(--line);padding:5px 8px;border-radius:6px}
.tk-caret{flex:0 0 auto;width:7px;height:7px;border-right:2px solid var(--ink-4);border-bottom:2px solid var(--ink-4);transform:rotate(45deg);transition:transform .18s}
.tk-model[open] .tk-caret{transform:rotate(-135deg)}
.tk-mbody{padding:4px 14px 13px;border-top:1px solid var(--line)}
.tk-slices{display:flex;flex-direction:column;gap:1px;margin-top:9px}
.tk-slice{display:flex;align-items:center;gap:10px;padding:8px 6px;border-radius:7px}
.tk-slice:hover{background:var(--surface-2)}
.tk-sdot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:var(--ink-4)}
.tk-slice.done .tk-sdot{background:var(--green)}
.tk-sn{flex:1;min-width:0;font:600 12.5px/1.3 var(--ff);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tk-sst{flex:0 0 auto;font:700 10px/1 var(--ff);color:var(--ink-4)}
.tk-slice.done .tk-sst{color:var(--green)}
.tk-single{display:inline-flex;align-items:center;gap:7px;margin-top:11px;font:600 11.5px/1.4 var(--ff);color:var(--ink-3)}
.tk-single svg{width:14px;height:14px;color:var(--primary);flex:0 0 14px}
.tk-filters{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:18px;padding:12px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-sm)}
.tk-fgrp{display:flex;align-items:center;gap:9px;min-width:0}
.tk-flbl{display:inline-flex;align-items:center;gap:6px;font:700 10px/1 var(--ff);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-4);white-space:nowrap}
.tk-flbl svg{width:13px;height:13px}
.tk-fseg{display:flex;flex-wrap:wrap;gap:5px;background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:3px}
.tk-fseg button{font:700 11px/1 var(--ff);color:var(--ink-3);background:transparent;border:0;padding:7px 11px;border-radius:7px;cursor:pointer;transition:.12s;white-space:nowrap}
.tk-fseg button:hover{color:var(--ink)}
.tk-fseg button.on{color:var(--primary-ink);background:var(--primary);box-shadow:var(--sh-sm)}
.tk-retract{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;font:700 10.5px/1 var(--ff);color:var(--ink-3);background:var(--surface);border:1px solid var(--line-2);padding:6px 9px;border-radius:7px;cursor:pointer;transition:.12s}
.tk-retract:hover{color:var(--amber);border-color:var(--amber-line);background:var(--amber-soft)}
.tk-retract svg{width:12px;height:12px}
@media(max-width:600px){.tk-proj-prog,.tk-mprog{display:none}.tk-sum{width:100%}.tk-filters{flex-direction:column;gap:11px}.tk-fgrp{width:100%}}