/* ORMIZ CRM: the ORMIZ visual identity (navy glass, scan cyan, Michroma wordmark, Rajdhani headings, Orbitron figures). */
@font-face{font-family:"Michroma";font-weight:400;font-display:swap;src:url(fonts/michroma-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Rajdhani";font-weight:500;font-display:swap;src:url(fonts/rajdhani-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Rajdhani";font-weight:600;font-display:swap;src:url(fonts/rajdhani-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Rajdhani";font-weight:700;font-display:swap;src:url(fonts/rajdhani-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Orbitron";font-weight:600;font-display:swap;src:url(fonts/orbitron-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Exo 2";font-weight:400;font-display:swap;src:url(fonts/exo-2-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Exo 2";font-weight:500;font-display:swap;src:url(fonts/exo-2-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Exo 2";font-weight:600;font-display:swap;src:url(fonts/exo-2-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:400;font-display:swap;src:url(fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2")}

:root{
  --void:#030812;--deck:#071226;--deck2:#0a1a35;--card:rgba(13,30,58,.72);--card-solid:#0c1c38;--card2:#10264a;--field:#0b1b37;
  --line:rgba(98,170,255,.14);--line2:rgba(98,170,255,.30);--ink:#eef6ff;--sub:#a6bcdc;--faint:#6b84a8;
  --scan:#4cd6ff;--scan-rgb:76,214,255;--azure:#2f8cff;--azure-rgb:47,140,255;--ice:#b8f0ff;
  --clean:#2cf5b0;--clean-rgb:44,245,176;--warn:#ffc24d;--warn-rgb:255,194,77;--threat:#ff4d6d;--threat-rgb:255,77,109;--violet:#a98bff;
  --metal:linear-gradient(180deg,#ffffff 0%,#dff6ff 38%,#8ec9ee 72%,#5d9cc9 100%);
  --hair:linear-gradient(90deg,transparent,rgba(140,225,255,.45),transparent);
  --shadow:0 10px 40px rgba(0,0,0,.35);--r:14px;--r2:10px;
  --brand:"Michroma","Rajdhani",system-ui,sans-serif;--disp:"Rajdhani","Exo 2",system-ui,sans-serif;
  --num:"Rajdhani","Exo 2",system-ui,sans-serif;--clockf:"Orbitron","Rajdhani",system-ui,sans-serif;--body:"Exo 2",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --c1:#4cd6ff;--c2:#2f8cff;--c3:#2cf5b0;--c4:#ffc24d;--c5:#a98bff;--c6:#ff7aa8;--c7:#7ee0c3;--c8:#ff9f5a;
  color-scheme:dark}
:root[data-theme=light]{
  --void:#eef3fa;--deck:#ffffff;--deck2:#f3f7fd;--card:rgba(255,255,255,.92);--card-solid:#ffffff;--card2:#f1f6fc;--field:#f7faff;
  --line:rgba(30,80,150,.13);--line2:rgba(30,80,150,.28);--ink:#0b1a33;--sub:#465f84;--faint:#7186a6;
  --scan:#0090cc;--scan-rgb:0,144,204;--azure:#2a6fd6;--clean:#08936a;--clean-rgb:8,147,106;--warn:#b26e00;--warn-rgb:178,110,0;--threat:#d3244a;--threat-rgb:211,36,74;
  --metal:linear-gradient(180deg,#0b2a4d 0%,#1b5d93 60%,#2c86c4 100%);--shadow:0 8px 30px rgba(20,50,100,.10);
  --c1:#0090cc;--c2:#2a6fd6;--c3:#08936a;--c4:#c98400;--c5:#7a5ad6;--c6:#d6457a;--c7:#2aa889;--c8:#e07a2c;color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:radial-gradient(1300px 760px at 78% -10%,rgba(var(--azure-rgb),.10),transparent 62%),radial-gradient(900px 620px at -6% 2%,rgba(var(--scan-rgb),.06),transparent 58%),var(--void);
  background-attachment:fixed;color:var(--ink);font:14px/1.5 var(--body);-webkit-font-smoothing:antialiased}
a{color:var(--scan);text-decoration:none}a:hover{text-decoration:underline}
svg.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.boot{display:flex;align-items:center;justify-content:center;height:100vh;font-family:var(--brand);letter-spacing:.3em;color:var(--faint)}
.word{font-family:var(--brand);letter-spacing:.22em;background:var(--metal);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

/* ---------------------------------------------------------------- shell */
.shell{display:grid;grid-template-columns:248px 1fr;min-height:100vh}
.shell.mini{grid-template-columns:72px 1fr}
.side{background:linear-gradient(180deg,rgba(7,18,38,.96),rgba(4,11,24,.98));border-right:1px solid var(--line);padding:16px 12px 24px;position:sticky;top:0;height:100vh;overflow:auto;scrollbar-width:thin}
:root[data-theme=light] .side{background:#fff}
.lock{display:flex;align-items:center;gap:11px;padding:4px 8px 18px;color:inherit;text-decoration:none!important}
.lock img{width:36px;height:36px;filter:drop-shadow(0 0 12px rgba(var(--scan-rgb),.5))}
.lock .word{font-size:16px;line-height:1}.lock small{display:block;margin-top:5px;font:italic 500 10px var(--disp);letter-spacing:.3em;color:var(--sub);text-transform:uppercase}
.nav .grp{font:600 10.5px var(--disp);letter-spacing:.24em;color:var(--faint);text-transform:uppercase;margin:16px 10px 6px}
.nav a{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:9px;color:var(--sub);font-weight:500;position:relative;text-decoration:none}
.nav a:hover{background:rgba(var(--scan-rgb),.07);color:var(--ink)}
.nav a.on{background:linear-gradient(90deg,rgba(var(--scan-rgb),.18),rgba(var(--scan-rgb),.03));color:var(--ink)}
.nav a.on::before{content:"";position:absolute;left:-12px;top:7px;bottom:7px;width:3px;border-radius:3px;background:var(--scan);box-shadow:0 0 12px var(--scan)}
.nav a .b{margin-left:auto;background:rgba(var(--scan-rgb),.18);color:var(--scan);font:600 11px var(--num);border-radius:20px;padding:1px 7px}
.nav a .b.hot{background:rgba(var(--threat-rgb),.2);color:var(--threat)}
.shell.mini .nav a span.t,.shell.mini .nav .grp,.shell.mini .lock span,.shell.mini .nav a .b{display:none}
.shell.mini .nav a{justify-content:center}
.main{min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:12px;padding:10px 24px;border-bottom:1px solid var(--line);background:rgba(7,18,38,.82);backdrop-filter:blur(14px);position:sticky;top:0;z-index:20}
:root[data-theme=light] .top{background:rgba(255,255,255,.88)}
.top .search{flex:1;max-width:460px;position:relative}.top .search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint)}
.top .search input{padding-left:36px;border-radius:30px}
.clock{display:flex;flex-direction:column;align-items:flex-end;line-height:1.1;margin-left:auto;padding-right:6px}
.clock b{font:600 17px var(--clockf);letter-spacing:.06em;color:var(--ink)}.clock span{font-size:11.5px;color:var(--sub)}
.iconbtn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--sub);cursor:pointer;padding:0}
.iconbtn:hover{color:var(--ink);border-color:var(--scan)}
.iconbtn .dot{position:absolute;top:-3px;right:-3px;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--threat);color:#fff;font:600 10.5px/18px var(--num);text-align:center;box-shadow:0 0 10px rgba(var(--threat-rgb),.6)}
.avatar{width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font:700 13px var(--disp);color:#031220;background:linear-gradient(135deg,var(--scan),var(--azure));flex:none;text-decoration:none!important}
.avatar.sm{width:26px;height:26px;font-size:11px}
/* pulse strip: the pipeline in numbers */
.pulse{display:flex;gap:0;overflow-x:auto;border-bottom:1px solid var(--line);background:rgba(4,12,26,.55);scrollbar-width:none}
:root[data-theme=light] .pulse{background:#f6f9fe}
.pulse a{flex:1 0 auto;min-width:118px;padding:9px 16px;border-right:1px solid var(--line);color:var(--sub);text-decoration:none;display:flex;flex-direction:column;gap:1px}
.pulse a:hover{background:rgba(var(--scan-rgb),.06)}
.pulse a small{font:600 10px var(--disp);letter-spacing:.18em;text-transform:uppercase;color:var(--faint)}
.pulse a b{font:700 17px var(--num);color:var(--ink);white-space:nowrap}.pulse a b i{font:500 11.5px var(--body);color:var(--sub);font-style:normal;margin-left:6px}
.pulse a.won b{color:var(--clean)}.pulse a.lost b{color:var(--threat)}.pulse a.key b{color:var(--scan)}
.page{padding:22px 26px 70px;max-width:1500px;width:100%}
.ph{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.ph .ttl{flex:1;min-width:240px}
h1{font:700 27px/1.15 var(--disp);letter-spacing:.02em;margin:2px 0 2px}
h2{font:700 19px var(--disp);margin:0 0 10px;letter-spacing:.02em}
h3{font:600 15px var(--disp);margin:0 0 8px;letter-spacing:.03em}
.kicker{font:600 11px var(--disp);letter-spacing:.26em;text-transform:uppercase;color:var(--scan)}
.lead{color:var(--sub);margin:2px 0 0}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.spacer{flex:1}
.muted{color:var(--sub)}.faint{color:var(--faint)}.small{font-size:12.5px}.err{color:var(--threat)}.ok{color:var(--clean)}
.mono{font-family:var(--mono);font-size:12.5px}.nowrap{white-space:nowrap}
/* ---------------------------------------------------------------- controls */
input,select,textarea{font:inherit;color:var(--ink);background:var(--field);border:1px solid var(--line2);border-radius:var(--r2);padding:8px 11px;width:100%;transition:border-color .15s,box-shadow .15s}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--scan)}
input[type=color]{padding:2px;height:36px}
textarea{min-height:90px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--scan);box-shadow:0 0 0 3px rgba(var(--scan-rgb),.18)}
input:disabled,select:disabled,textarea:disabled{opacity:.65}
button,.btn{font:600 13.5px var(--body);border:1px solid var(--line2);background:rgba(var(--scan-rgb),.04);color:var(--ink);border-radius:var(--r2);padding:8px 14px;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:7px;text-decoration:none!important;transition:all .15s}
button:hover,.btn:hover{border-color:var(--scan);background:rgba(var(--scan-rgb),.09)}
button.pri,.btn.pri{background:linear-gradient(180deg,#6fe0ff,var(--scan));border-color:var(--scan);color:#031220;box-shadow:0 4px 18px rgba(var(--scan-rgb),.28)}
button.pri:hover,.btn.pri:hover{filter:brightness(1.08)}
button.danger{border-color:rgba(var(--threat-rgb),.6);color:var(--threat);background:transparent}
button.danger:hover{background:rgba(var(--threat-rgb),.1)}
button.ghost,.btn.ghost{background:transparent;border-color:transparent}button.ghost:hover{border-color:var(--line2)}
button.sm,.btn.sm{padding:4px 10px;font-size:12.5px}
button:disabled{opacity:.5;cursor:default}
label{display:block;font:600 12.5px var(--disp);letter-spacing:.04em;color:var(--sub);margin:0 0 4px}
.field{margin-bottom:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 16px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:0 16px}.full{grid-column:1/-1}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:var(--r2);overflow:hidden}
.seg button{border:0;border-radius:0;background:transparent;border-right:1px solid var(--line)}.seg button:last-child{border-right:0}
.seg button.on{background:rgba(var(--scan-rgb),.16);color:var(--scan)}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line2);border-radius:20px;padding:3px 10px;font-size:12.5px;color:var(--sub);background:transparent;cursor:pointer}
.chip.on{border-color:var(--scan);color:var(--scan);background:rgba(var(--scan-rgb),.08)}
/* ---------------------------------------------------------------- cards and tables */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;position:relative;box-shadow:var(--shadow);backdrop-filter:blur(8px)}
.card::before{content:"";position:absolute;left:18px;right:18px;top:0;height:1px;background:var(--hair);opacity:.7}
.card.flat{padding:0;overflow:auto}
:not(.cards):not(.g2):not(.g2e):not(.g3):not(.tiles)>.card+.card{margin-top:16px}
.card .hd{display:flex;align-items:center;gap:10px;margin-bottom:12px}.card .hd .kicker{flex:1}
.card.flat .hd{padding:14px 16px 0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;margin-bottom:16px}
.kpi{display:flex;flex-direction:column;gap:2px;text-decoration:none!important;color:inherit;overflow:hidden}
.kpi:hover{border-color:var(--line2)}
.kpi .lbl{font:600 11px var(--disp);letter-spacing:.2em;text-transform:uppercase;color:var(--sub);display:flex;align-items:center;gap:8px}
.kpi .lbl svg{color:var(--scan)}
.kpi .v{font:700 30px/1.15 var(--num);color:var(--ink);letter-spacing:.02em}
.kpi .d{font-size:12px;color:var(--sub)}.kpi .d.up{color:var(--clean)}.kpi .d.down{color:var(--threat)}
.kpi svg.spark{position:absolute;right:12px;bottom:10px;width:110px;height:36px;opacity:.9}
.g2{display:grid;grid-template-columns:1.6fr 1fr;gap:16px}.g2e{display:grid;grid-template-columns:1fr 1fr;gap:16px}.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.stack>*+*{margin-top:16px}
table{width:100%;border-collapse:collapse}
th{font:600 11px var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--faint);text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;position:sticky;top:0;background:var(--card-solid)}
th.sort{cursor:pointer}th.sort:hover{color:var(--ink)}
td{padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
tr:last-child td{border-bottom:0}
tr.click{cursor:pointer}tr.click:hover td{background:rgba(var(--scan-rgb),.05)}
.num{text-align:right;font-variant-numeric:tabular-nums}
.empty{color:var(--faint);padding:28px;text-align:center}
.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:99px;font-size:11.5px;font-weight:600;border:1px solid var(--line2);color:var(--sub);white-space:nowrap}
.pill.good{color:var(--clean);border-color:rgba(var(--clean-rgb),.4);background:rgba(var(--clean-rgb),.07)}
.pill.bad{color:var(--threat);border-color:rgba(var(--threat-rgb),.4);background:rgba(var(--threat-rgb),.07)}
.pill.warn{color:var(--warn);border-color:rgba(var(--warn-rgb),.4);background:rgba(var(--warn-rgb),.07)}
.pill.info{color:var(--scan);border-color:rgba(var(--scan-rgb),.4);background:rgba(var(--scan-rgb),.07)}
.score{display:inline-flex;align-items:center;gap:8px;min-width:90px}.score i{flex:1;height:6px;border-radius:6px;background:var(--card2);overflow:hidden;position:relative}
.score i b{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,var(--azure),var(--scan));border-radius:6px}
.bar{height:8px;border-radius:9px;background:var(--card2);overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--azure),var(--scan))}
/* ---------------------------------------------------------------- charts */
.chart{width:100%;display:block;overflow:visible}
.chart text{fill:var(--sub);font:11px var(--body)}.chart .ax{stroke:var(--line);stroke-width:1}
.chart .hit{cursor:pointer}.chart .hit:hover{filter:brightness(1.25)}
.legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:10px;font-size:12.5px;color:var(--sub)}
.legend span{display:inline-flex;align-items:center;gap:6px;cursor:pointer}.legend i{width:10px;height:10px;border-radius:3px;display:inline-block}
.donutwrap{display:flex;align-items:center;gap:18px}.donutwrap svg{width:170px;height:170px;flex:none}
.tip{position:fixed;z-index:90;pointer-events:none;background:var(--card-solid);border:1px solid var(--line2);border-radius:8px;padding:6px 10px;font-size:12.5px;box-shadow:var(--shadow)}
.funnel div{display:grid;grid-template-columns:100px 1fr 74px;gap:10px;align-items:center;margin:6px 0;font-size:13px}
.funnel div i{display:block;height:24px;border-radius:6px;background:linear-gradient(90deg,rgba(var(--azure-rgb),.85),rgba(var(--scan-rgb),.85));margin:0 auto;min-width:4px}
/* ---------------------------------------------------------------- detail and timeline */
.detail{display:grid;grid-template-columns:1fr 370px;gap:18px;align-items:start}
.timeline .it{border-left:2px solid var(--line2);padding:2px 0 12px 14px;margin-left:5px;position:relative;white-space:pre-wrap;word-break:break-word}
.timeline .it::before{content:"";position:absolute;left:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--deck);border:2px solid var(--line2)}
.timeline .it small{color:var(--faint);display:block;white-space:normal}
.timeline .it.agent::before{border-color:var(--warn)}.timeline .it.note::before,.timeline .it.call::before,.timeline .it.email::before,.timeline .it.meeting::before{border-color:var(--scan)}
.related h3{margin:18px 0 8px;color:var(--sub)}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:8px;padding-top:14px;border-top:1px solid var(--line)}
/* ---------------------------------------------------------------- pipeline board */
.board{display:grid;grid-template-columns:repeat(7,minmax(132px,1fr));gap:10px;overflow-x:auto;padding-bottom:10px}
.col{background:rgba(4,12,26,.5);border:1px solid var(--line);border-radius:var(--r);padding:10px;min-height:340px}
:root[data-theme=light] .col{background:#f4f8fd}
.col.drop{border-color:var(--scan);box-shadow:inset 0 0 0 1px var(--scan)}
.col h3{font:600 12px var(--disp);letter-spacing:.14em;text-transform:uppercase;color:var(--sub);margin:2px 4px 10px;display:flex;flex-direction:column;gap:3px}
.col h3 small{letter-spacing:0;text-transform:none;font:600 12px var(--num);color:var(--ink)}
.col.won h3{color:var(--clean)}.col.lost h3{color:var(--threat)}
.opp{background:var(--card-solid);border:1px solid var(--line);border-radius:10px;padding:10px;margin-bottom:8px;cursor:grab}
.opp:hover{border-color:var(--scan)}.opp b{display:block;font-size:13.5px}.opp small{color:var(--sub);display:block}
.opp .mv{display:flex;gap:6px;margin-top:8px}.opp .mv button{padding:2px 8px;font-size:11.5px}
/* ---------------------------------------------------------------- quote editor */
.lines td{padding:6px}.lines input,.lines select{padding:6px 8px}
.tot{margin-left:auto;width:380px}.tot td{border:0;padding:4px 8px}.tot tr.g td{font:700 17px var(--num);border-top:1px solid var(--line2)}
/* ---------------------------------------------------------------- overlays */
.modal{position:fixed;inset:0;background:rgba(2,6,14,.72);backdrop-filter:blur(3px);display:flex;align-items:flex-start;justify-content:center;z-index:60;padding:6vh 16px;overflow:auto}
.modal>.card{width:min(620px,100%);background:var(--card-solid)}
.modal>.card.wide{width:min(920px,100%)}
.modal .foot{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--card-solid);border-left:1px solid var(--line2);z-index:70;box-shadow:var(--shadow);display:flex;flex-direction:column;animation:slide .18s ease-out}
@keyframes slide{from{transform:translateX(30px);opacity:0}to{transform:none;opacity:1}}
.drawer .dh{display:flex;align-items:center;gap:8px;padding:16px 18px;border-bottom:1px solid var(--line)}
.drawer .db{overflow:auto;flex:1}
.notif{display:flex;gap:12px;padding:12px 18px;border-bottom:1px solid var(--line);cursor:pointer;text-decoration:none!important;color:inherit}
.notif:hover{background:rgba(var(--scan-rgb),.05)}.notif.unread{background:rgba(var(--scan-rgb),.06)}
.notif .ic{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(var(--scan-rgb),.12);color:var(--scan);flex:none}
.notif.unread .t{font-weight:600}.notif small{color:var(--faint);display:block}
.toast{position:fixed;bottom:22px;right:22px;background:var(--card-solid);border:1px solid var(--scan);border-radius:12px;padding:11px 16px;z-index:95;box-shadow:var(--shadow);max-width:440px}
.toast.err{border-color:var(--threat)}
.secret{font-family:var(--mono);background:var(--field);border:1px dashed var(--scan);padding:10px;border-radius:8px;word-break:break-all;user-select:all}
.tabs{display:flex;gap:4px;margin-bottom:16px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.tabs button{border:0;border-bottom:2px solid transparent;border-radius:0;background:transparent;color:var(--sub);padding:9px 14px}
.tabs button.on{border-bottom-color:var(--scan);color:var(--ink)}
.menu{position:absolute;right:0;top:44px;background:var(--card-solid);border:1px solid var(--line2);border-radius:12px;box-shadow:var(--shadow);min-width:220px;padding:6px;z-index:40}
.menu a,.menu button{display:flex;width:100%;border:0;background:transparent;padding:8px 10px;border-radius:8px;color:var(--ink);font-weight:500}
.menu a:hover,.menu button:hover{background:rgba(var(--scan-rgb),.08)}
/* ---------------------------------------------------------------- sign-in */
.login{min-height:100vh;display:grid;grid-template-columns:1.15fr 1fr}
.login .art{background:radial-gradient(circle at 50% 42%,rgba(18,80,150,.55),transparent 60%),radial-gradient(circle at 50% 42%,rgba(var(--scan-rgb),.10),transparent 40%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;border-right:1px solid var(--line);position:relative;overflow:hidden}
.login .art::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(var(--scan-rgb),.035) 0 1px,transparent 1px 4px);pointer-events:none}
.login .art img{width:min(340px,58%);height:auto;image-rendering:auto;filter:drop-shadow(0 0 46px rgba(var(--scan-rgb),.35));animation:float 6s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px)}}
.login .art .word{font-size:46px}
.login .art span.sub{font:500 13px var(--disp);letter-spacing:.5em;color:var(--scan);text-transform:uppercase}
.login form{align-self:center;justify-self:center;width:min(390px,90%)}
.login h1{margin-bottom:6px}
/* ---------------------------------------------------------------- misc */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.tile{display:flex;gap:14px;align-items:flex-start;text-decoration:none!important;color:inherit;transition:transform .15s,border-color .15s}
.tile:hover{transform:translateY(-2px);border-color:var(--scan)}
.tile .ic{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(var(--scan-rgb),.22),rgba(var(--azure-rgb),.12));color:var(--scan);flex:none}
.tile .ic svg{width:24px;height:24px}
.tile b{display:block;font:700 16px var(--disp);letter-spacing:.03em}.tile small{color:var(--sub);display:block}.tile .u{font-family:var(--mono);font-size:11.5px;color:var(--faint);margin-top:4px;word-break:break-all}
.perm td,.perm th{text-align:center}.perm td:first-child,.perm th:first-child{text-align:left}
.dropzone{border:2px dashed var(--line2);border-radius:var(--r);padding:26px;text-align:center;color:var(--sub)}
.dropzone.over{border-color:var(--scan);background:rgba(var(--scan-rgb),.06)}
@media (max-width:1100px){.g2,.g2e,.g3,.detail{grid-template-columns:1fr}}
@media (max-width:860px){.shell{grid-template-columns:1fr}.side{position:static;height:auto}.login{grid-template-columns:1fr}.login .art{display:none}
  .grid2,.grid3,.grid4{grid-template-columns:1fr}.clock{display:none}.page{padding:16px}}
@media print{.side,.top,.pulse{display:none}.shell{display:block}body{background:#fff;color:#000}}