/* Subtwo dashboard: "calm control centre". Tokens in /tokens.css (same file as the website). */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg-subtle);color:var(--text);font:400 var(--t-14)/1.5 var(--font-sans);-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:var(--r-sm)}
.i{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.i.sm{width:14px;height:14px}
.skip{position:absolute;left:-999px;top:8px;z-index:99;padding:8px 12px;border-radius:8px;background:var(--text);color:var(--bg)}
.skip:focus{left:8px}
.muted{color:var(--text-3)}
.fine{margin:8px 0 0;font-size:var(--t-12);color:var(--text-3)}
.fine.flush{margin:0;font-size:var(--t-13)}
.link{font:500 var(--t-13)/1 var(--font-sans);color:var(--accent);text-decoration:none}
.link:hover{text-decoration:underline;text-underline-offset:3px}

/* brand */
.brand{display:inline-flex;align-items:baseline;gap:0;font:700 21px/1 var(--font-sans);letter-spacing:-.035em;text-decoration:none;color:var(--text)}
.brand i{font-style:normal;color:var(--accent)}
.brand small{margin-left:10px;font:500 10.5px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text-3)}
.brand.sm{font-size:15px}
.brand.light{color:#fff}.brand.light i{color:#BFD0FF}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:38px;padding:0 16px;border-radius:var(--r-md);border:0;font:600 var(--t-14)/1 var(--font-sans);text-decoration:none;cursor:pointer;white-space:nowrap;transition:background var(--d-fast),box-shadow var(--d-fast),transform var(--d-fast)}
.btn:active{transform:translateY(1px)}
.btn .i{width:16px;height:16px}
.btn-sm{height:32px;padding:0 12px;font-size:var(--t-13);border-radius:8px}
.btn-primary{background:var(--accent);color:var(--on-accent)}
.btn-primary:hover{background:var(--accent-hover)}
.btn-ghost{background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1px var(--line-strong)}
.btn-ghost:hover{background:var(--bg-subtle)}
.icon-btn{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;color:var(--text-3);text-decoration:none}
.icon-btn:hover{background:var(--bg-muted);color:var(--text)}

/* pills */
.pill{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:var(--r-pill);font:500 11px/1.35 var(--font-mono);white-space:nowrap}
.pill.ok{background:var(--success-weak);color:var(--success)}
.pill.warn{background:var(--warning-weak);color:var(--warning)}
.pill.bad{background:var(--danger-weak);color:var(--danger)}
.live{width:7px;height:7px;border-radius:50%;background:var(--success);animation:ping 2s infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 rgba(12,138,95,.45)}70%{box-shadow:0 0 0 7px rgba(12,138,95,0)}100%{box-shadow:0 0 0 0 rgba(12,138,95,0)}}
.stars{color:#E3A008;letter-spacing:1px;font-size:13px}
.s-off{color:var(--line-strong)}

/* shell */
.shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.rail{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:18px;padding:20px 14px;background:var(--surface);border-right:1px solid var(--line)}
.rail .brand{padding:4px 8px 6px}
.biz{display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--r-md);border:1px solid var(--line);background:var(--bg-subtle)}
.biz-i{width:32px;height:32px;border-radius:9px;background:var(--text);color:var(--bg);display:grid;place-items:center;font:700 14px/1 var(--font-sans);flex-shrink:0}
.biz b{display:block;font:600 var(--t-13)/1.2 var(--font-sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.biz div span{display:block;font-size:var(--t-12);color:var(--text-3)}
.rail-nav{display:grid;gap:18px}
.ng{display:grid;gap:2px}
.ng-h{padding:0 10px 6px;font:500 10.5px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--text-4)}
.ng a{display:flex;align-items:center;gap:10px;height:36px;padding:0 10px;border-radius:8px;text-decoration:none;color:var(--text-2);font:500 var(--t-14)/1 var(--font-sans);transition:background var(--d-fast),color var(--d-fast)}
.ng a:hover{background:var(--bg-subtle);color:var(--text)}
.ng a.on{background:var(--accent-weak);color:var(--accent)}
.nb{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--accent);color:var(--on-accent);font:600 11px/20px var(--font-sans);text-align:center}
.rail-help{margin-top:auto;display:grid;gap:4px;padding:14px;border-radius:var(--r-md);background:var(--bg-subtle);border:1px solid var(--line);font-size:var(--t-13)}
.rail-help b{font-weight:600}
.rail-help span{color:var(--text-3)}
.rail-help a{margin-top:4px;color:var(--accent);font-weight:600;text-decoration:none}
.main-col{display:flex;flex-direction:column;min-width:0}
.top{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:14px;height:56px;padding:0 28px;background:color-mix(in srgb,var(--bg-subtle) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.crumbs{display:flex;align-items:center;gap:6px;font-size:var(--t-13);color:var(--text-3)}
.crumbs b{color:var(--text);font-weight:600}
.top-r{margin-left:auto;display:flex;align-items:center;gap:8px}
.sample{padding:4px 9px;border-radius:999px;background:var(--warning-weak);color:var(--warning);font:500 11px/1.3 var(--font-mono)}
.jump{display:flex;align-items:center;gap:8px;height:34px;width:220px;padding:0 10px;border-radius:9px;border:1px solid var(--line);background:var(--surface);color:var(--text-3)}
.jump input{flex:1;min-width:0;border:0;background:none;outline:none;font:400 var(--t-13)/1 var(--font-sans);color:var(--text)}
.jump kbd{padding:2px 6px;border-radius:5px;border:1px solid var(--line);font:500 11px/1 var(--font-mono);color:var(--text-3)}
.jump:focus-within{border-color:var(--accent);box-shadow:var(--focus)}
.main{flex:1;width:100%;max-width:1160px;margin:0 auto;padding:28px 28px 40px}
.foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;max-width:1160px;width:100%;margin:0 auto;padding:18px 28px 28px;border-top:1px solid var(--line);font-size:var(--t-12);color:var(--text-3)}
.foot a{text-decoration:none}
.foot a:hover{color:var(--text)}
.ok-dot{margin-left:auto;display:inline-flex;align-items:center;gap:6px}
.ok-dot::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--success)}
.m-only{display:none}
.tabs{display:none}

/* account menu */
.acct{position:relative}
.av{width:34px;height:34px;border-radius:50%;border:0;background:var(--text);color:var(--bg);font:600 13px/1 var(--font-sans);cursor:pointer;display:inline-grid;place-items:center}
.av.sm{width:30px;height:30px;font-size:12px;flex-shrink:0}
.menu{position:absolute;right:0;top:calc(100% + 8px);width:260px;padding:6px;border-radius:var(--r-md);background:var(--surface-raised);border:1px solid var(--line);box-shadow:var(--e-pop);z-index:30;display:grid}
.menu[hidden]{display:none}
.menu-h{display:flex;align-items:center;gap:10px;padding:8px 10px 10px;border-bottom:1px solid var(--line);margin-bottom:4px}
.menu-h b{display:block;font:500 11px/1.2 var(--font-mono);color:var(--text-3);text-transform:uppercase;letter-spacing:.06em}
.menu-h div span{display:block;margin-top:2px;font:500 var(--t-13)/1.3 var(--font-sans);color:var(--text);word-break:break-all}
.menu a,.menu button{display:block;width:100%;text-align:left;padding:9px 10px;border:0;border-radius:7px;background:none;color:var(--text-2);font:500 var(--t-14)/1.2 var(--font-sans);text-decoration:none;cursor:pointer}
.menu a:hover,.menu button:hover{background:var(--bg-subtle);color:var(--text)}
.menu hr{border:0;border-top:1px solid var(--line);margin:4px}
.menu .danger{color:var(--danger)}

/* page header */
.ph{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}
.ph-e{font:500 var(--t-12)/1 var(--font-mono);color:var(--text-3)}
.ph h1{margin:8px 0 0;font:400 clamp(30px,3.4vw,38px)/1.05 var(--font-display);letter-spacing:-.01em}
.ph p{margin:6px 0 0;color:var(--text-3);font-size:var(--t-15)}
.ph-a{display:flex;flex-wrap:wrap;gap:8px}

/* layout */
.grid-2{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:16px;align-items:start}
.grid-2.wide-l{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.col{display:grid;gap:16px}
.settings{display:grid;gap:16px;max-width:860px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px 20px;min-width:0;scroll-margin-top:72px}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.panel-h h2{margin:0;font:600 var(--t-15)/1.3 var(--font-sans)}
.count{min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--bg-muted);font:600 12px/22px var(--font-sans);text-align:center;color:var(--text-2)}
.empty{margin:0;padding:14px 0;color:var(--text-3)}

/* lists */
.list{list-style:none;margin:0;padding:0}
.li{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--line)}
.list>.li:first-child{border-top:0}
.li-i{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--accent-weak);color:var(--accent)}
.li-i.warm{background:var(--warning-weak);color:var(--warning)}
.li-t b{display:block;font:600 var(--t-14)/1.3 var(--font-sans)}
.li-t span{display:block;margin-top:2px;font-size:var(--t-13);color:var(--text-3)}
.li.lead{display:block}
.li.lead[hidden]{display:none}
.li.lead summary{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;cursor:pointer;list-style:none}
.li.lead summary::-webkit-details-marker{display:none}
.li.lead .chev{color:var(--text-4);transition:transform var(--d-base) var(--ease)}
.li.lead details[open] .chev{transform:rotate(90deg)}
.lead-b{padding:12px 0 4px 46px}
.lead-b p{margin:0 0 10px;color:var(--text-2)}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.feed{list-style:none;margin:0;padding:0;position:relative}
.feed li{position:relative;display:grid;grid-template-columns:18px 1fr;gap:10px;padding:8px 0}
.feed li::before{content:"";position:absolute;left:4px;top:22px;bottom:-8px;width:1px;background:var(--line)}
.feed li:last-child::before{display:none}
.f-dot{width:9px;height:9px;margin-top:5px;border-radius:50%;background:var(--surface);box-shadow:inset 0 0 0 2px var(--accent)}
.feed b{display:block;font:500 var(--t-14)/1.35 var(--font-sans)}
.feed span{display:block;font-size:var(--t-12);color:var(--text-3)}

/* stats */
.stats{display:grid;gap:0}
.st{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:10px;padding:12px 0;border-top:1px solid var(--line)}
.st:first-child{border-top:0;padding-top:4px}
.st>span{grid-column:1;font-size:var(--t-13);color:var(--text-3)}
.st b{grid-column:1;font:400 30px/1.1 var(--font-display);font-variant-numeric:tabular-nums}
.st b small{font-size:.5em;color:var(--text-3)}
.st em{grid-column:2;grid-row:1/3;align-self:center;display:inline-flex;align-items:center;gap:3px;font:500 var(--t-12)/1 var(--font-mono);font-style:normal;color:var(--success)}
.spark{grid-column:2;grid-row:1/3;align-self:end;display:flex;align-items:flex-end;gap:4px;height:34px}
.spark i{width:10px;border-radius:3px 3px 1px 1px;background:var(--accent-line)}
.spark i.now{background:var(--accent)}
.site{display:flex;align-items:center;gap:10px}
.uptime{display:grid;grid-template-columns:repeat(30,1fr);gap:3px;margin-top:12px}
.uptime i{height:22px;border-radius:3px;background:var(--success);opacity:.85}
.uptime i.dn{background:var(--warning)}
.kv{margin:0;display:grid;gap:0}
.kv div{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--line);font-size:var(--t-13)}
.kv div:first-child{border-top:0;padding-top:2px}
.kv dt{color:var(--text-3)}
.kv dd{margin:0;font-weight:600;text-align:right}

/* segmented filter */
.seg{display:inline-flex;flex-wrap:wrap;gap:2px;padding:3px;margin-bottom:8px;border-radius:10px;background:var(--bg-muted)}
.seg button{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:0;border-radius:8px;background:none;font:500 var(--t-13)/1 var(--font-sans);color:var(--text-2);cursor:pointer}
.seg button span{font:500 11px/1 var(--font-mono);color:var(--text-3)}
.seg button.on{background:var(--surface);color:var(--text);box-shadow:var(--e-1)}

/* reviews */
.rvs .rv{list-style:none;padding:14px 0;border-top:1px solid var(--line)}
.rvs .rv:first-child{border-top:0;padding-top:4px}
.rv-h{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rv-h b{font-weight:600}
.rv-h .pill{margin-left:auto}
blockquote{margin:8px 0 10px;color:var(--text-2);font-size:var(--t-14)}
.draft{padding:10px 12px;border-radius:10px;background:var(--bg-subtle);border:1px solid var(--line);margin-bottom:10px}
.draft small{display:block;font:500 10.5px/1 var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:5px}
.draft p{margin:0;color:var(--text-2);outline:none}
.draft p[contenteditable="true"]{background:var(--surface);border-radius:6px;padding:6px 8px;box-shadow:inset 0 0 0 1.5px var(--accent)}
.rv.done{opacity:.65}
.rating{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.rating b{font:400 44px/1 var(--font-display)}
.rating .muted{display:block;font-size:var(--t-12)}
.bars{display:grid;gap:7px}
.bars div{display:grid;grid-template-columns:28px 1fr 26px;gap:8px;align-items:center;font-size:var(--t-12);color:var(--text-3)}
.bars i{display:block;height:8px;border-radius:4px;background:var(--bg-muted);overflow:hidden}
.bars u{display:block;height:100%;background:#E3A008;text-decoration:none}
.bars b{text-align:right;font:500 12px/1 var(--font-mono);color:var(--text-2)}

/* results */
.map-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:center}
.grid5{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:12px;border-radius:12px;background:var(--bg-subtle);border:1px solid var(--line)}
.grid5 i{aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font:600 11px/1 var(--font-sans);font-style:normal;color:#fff}
.grid5 i.shop{box-shadow:0 0 0 2px var(--surface),0 0 0 4px var(--text)}
.d1{background:var(--success)}.d2{background:#D69A1D}.d3{background:#A3AAB8}.d0{background:var(--surface);box-shadow:inset 0 0 0 1.5px #E7C2BE;color:var(--danger)!important}
.big-num{font:400 52px/1 var(--font-display)}
.big-num small{font-size:.36em;color:var(--text-3)}
.legend{display:flex;flex-wrap:wrap;gap:4px 12px;margin:10px 0 0;font-size:var(--t-12);color:var(--text-3)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px;vertical-align:-1px}
.vbars{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;align-items:end;height:150px;padding-top:6px}
.vbars div{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:6px}
.vbars i{width:100%;max-width:44px;border-radius:6px 6px 2px 2px;background:var(--accent-line)}
.vbars div:last-child i{background:var(--accent)}
.vbars b{font:500 12px/1 var(--font-mono)}
.vbars span{font-size:var(--t-12);color:var(--text-3)}
.done{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.done li{display:grid;grid-template-columns:18px 1fr;gap:8px;align-items:start;color:var(--text-2)}
.done li .i{color:var(--success);margin-top:3px}

/* settings rows */
.set{display:grid}
.set-r{display:grid;grid-template-columns:160px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--line);font-size:var(--t-14)}
.set-r:first-child{border-top:0;padding-top:2px}
.set-r>span:first-child{color:var(--text-3)}
.set-r b{font-weight:500}
.req{display:grid;gap:8px;margin-bottom:10px}
.req label{font:600 var(--t-13)/1 var(--font-sans)}
.req textarea{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--line-strong);background:var(--bg);color:var(--text);font:400 var(--t-14)/1.45 var(--font-sans);resize:vertical}
.req textarea:focus{outline:none;border-color:var(--accent);box-shadow:var(--focus)}
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:var(--t-13)}
th,td{padding:10px 8px;text-align:left;border-top:1px solid var(--line);vertical-align:top}
thead th{border-top:0;font:500 10.5px/1.3 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--text-3)}
td:first-child{white-space:nowrap}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin-bottom:16px;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--line)}
.kpis div{background:var(--surface);padding:16px 18px}
.kpis span{display:block;font-size:var(--t-12);color:var(--text-3)}
.kpis b{display:block;margin-top:4px;font:400 32px/1 var(--font-display)}

/* dialogs + toast */
dialog.confirm{width:min(92vw,420px);padding:22px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface-raised);color:var(--text);box-shadow:var(--e-pop)}
dialog.confirm::backdrop{background:rgba(6,10,20,.45)}
dialog.confirm h2{margin:0 0 6px;font:400 28px/1.1 var(--font-display)}
dialog.confirm>p{margin:0 0 16px;color:var(--text-3)}
dialog.confirm .actions{justify-content:flex-end;margin-top:16px}
.askrow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.askrow input{min-width:0;height:38px;padding:0 12px;border-radius:10px;border:1px solid var(--line-strong);background:var(--bg-subtle);color:var(--text-2);font:400 var(--t-13)/1 var(--font-mono)}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,16px);max-width:min(92vw,440px);padding:10px 16px;border-radius:12px;background:var(--text);color:var(--bg);font:500 var(--t-13)/1.35 var(--font-sans);opacity:0;pointer-events:none;transition:opacity var(--d-base),transform var(--d-base) var(--ease);z-index:60;text-align:center}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* sign-in */
body.auth{background:var(--bg)}
.auth-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:100vh}
.auth-wrap.single{grid-template-columns:minmax(0,1fr)}
.auth-side{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:36px;color:#fff;background:radial-gradient(70% 60% at 50% 115%,rgba(255,236,196,.45),transparent 70%),linear-gradient(180deg,#2F53FF,#1B37D0)}
.auth-side::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(80% 70% at 50% 40%,#000,transparent)}
.auth-side>*{position:relative}
.auth-side h2{margin:0;font:400 clamp(40px,4.4vw,60px)/1 var(--font-display)}
.auth-side h2 em{color:#C9D5FF}
.auth-side p{margin:14px 0 0;max-width:420px;color:rgba(255,255,255,.85);font-size:var(--t-16)}
.fine.light{color:rgba(255,255,255,.7)}
.auth-main{display:flex;flex-direction:column;justify-content:center;gap:8px;width:min(420px,100%);margin:0 auto;padding:40px 20px}
.auth-main h1{margin:10px 0 0;font:400 40px/1.05 var(--font-display)}
.auth-main .muted{margin:0 0 10px}
/* our own sign-in, sign-up and welcome screens */
.btn-lg{height:48px;padding:0 20px;font-size:var(--t-15);border-radius:12px}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn.busy{position:relative;color:transparent!important}
.btn.busy::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;border:2px solid;border-color:var(--on-accent) var(--on-accent) transparent transparent;animation:spin .7s linear infinite}
.btn-ghost.busy::after{border-color:var(--text-3) var(--text-3) transparent transparent}
.btn .g{width:18px;height:18px}
button.link{padding:0;border:0;background:none;cursor:pointer;font:inherit;font-weight:600;color:var(--accent)}
.auth-main section{display:flex;flex-direction:column;gap:12px}
.auth-main section[hidden]{display:none}
.auth-main form{display:flex;flex-direction:column;gap:8px}
.auth-main form .btn-lg,.auth-main section>.btn-lg{width:100%;margin-top:4px}
.auth-main .muted{margin:0}
.auth-main h1{margin:4px 0 0}
.fld{display:flex;align-items:baseline;justify-content:space-between;font:600 var(--t-13)/1.2 var(--font-sans);color:var(--text-2)}
.fld em{margin-left:6px;font:400 var(--t-12)/1 var(--font-sans);font-style:normal;color:var(--text-3)}
.auth input:not([type=checkbox]),.auth select,dialog.confirm input.code-in{width:100%;height:48px;padding:0 14px;border-radius:12px;border:1px solid var(--line-strong);background:var(--surface);color:var(--text);font:400 var(--t-16)/1 var(--font-sans);transition:border-color var(--d-fast),box-shadow var(--d-fast)}
.auth select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%237A8295' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.auth input:focus,.auth select:focus,dialog.confirm input.code-in:focus{outline:none;border-color:var(--accent);box-shadow:var(--focus)}
.auth input::placeholder,dialog.confirm input::placeholder{color:var(--text-4)}
.code-in{font:500 22px/1 var(--font-mono)!important;letter-spacing:.4em;text-align:center}
.pw{position:relative}
.pw input{padding-right:72px!important}
.pw-t{position:absolute;right:6px;top:6px;height:36px;padding:0 12px;border:0;border-radius:8px;background:var(--bg-muted);font:600 var(--t-13)/1 var(--font-sans);color:var(--text-2);cursor:pointer}
.hint{font-size:var(--t-12);color:var(--text-3)}
.err{margin:2px 0 0;padding:10px 12px;border-radius:10px;background:var(--danger-weak);color:var(--danger);font-size:var(--t-13);line-height:1.4}
.err[hidden]{display:none}
.or{display:flex;align-items:center;gap:12px;margin:6px 0;font-size:var(--t-12);color:var(--text-3)}
.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}
.alt{margin:2px 0 0;font-size:var(--t-14);color:var(--text-3)}
.alt [hidden]{display:none}
.who{display:inline-flex;align-self:flex-start;align-items:center;gap:8px;max-width:100%;height:34px;padding:0 12px 0 8px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font:500 var(--t-13)/1 var(--font-sans);color:var(--text-2);cursor:pointer}
.who span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who u{text-decoration:none;color:var(--accent);font-weight:600}
.wait{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;background:var(--bg-subtle);border:1px solid var(--line);color:var(--text-2);font-size:var(--t-14)}
.wait[hidden]{display:none}
.spin{width:18px;height:18px;flex-shrink:0;border-radius:50%;border:2px solid var(--accent-line);border-top-color:var(--accent);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.fine.help{margin-top:18px}
.fine a{color:inherit}
.side-list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px;font-size:var(--t-16);color:rgba(255,255,255,.92)}
.side-list li{display:flex;align-items:center;gap:10px}
.side-list .i{width:20px;height:20px;padding:3px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff}
.auth-wrap.tinted{background:var(--bg-subtle)}
.auth-main.wide{width:min(640px,100%);justify-content:flex-start;padding-top:40px}
.auth-main.wide>.brand{margin-bottom:14px}
.card{padding:28px;border:1px solid var(--line);border-radius:var(--r-xl);background:var(--surface);box-shadow:var(--e-2)}
.card h1{margin:8px 0 6px}
.card>.muted{margin-bottom:18px}
.stack{display:grid!important;gap:14px!important}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.row2>div{display:grid;gap:8px}
.stack .actions{justify-content:flex-end;margin-top:4px}
.stack .actions .btn-lg{width:auto;margin:0}

/* new-member home */
.pill:not(.ok):not(.warn):not(.bad){background:var(--bg-muted);color:var(--text-2)}
.pill .i{width:12px;height:12px}
.lede{margin:0 0 12px;color:var(--text-2);font-size:var(--t-15)}
.panel .done{margin-bottom:16px}
.banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;margin-bottom:20px;padding:14px 16px;border-radius:var(--r-lg);border:1px solid var(--accent-line);background:var(--accent-weak)}
.banner>.i{width:22px;height:22px;color:var(--accent)}
.banner b{display:block;font:600 var(--t-14)/1.3 var(--font-sans)}
.banner span{display:block;margin-top:2px;font-size:var(--t-13);color:var(--text-2)}
.steps{list-style:none;margin:4px 0 0;padding:0;display:grid}
.steps li{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr);gap:12px;padding-bottom:18px}
.steps li:last-child{padding-bottom:0}
.steps li::before{content:"";position:absolute;left:11px;top:26px;bottom:2px;width:2px;background:var(--line)}
.steps li:last-child::before{display:none}
.steps li.ok::before{background:var(--success)}
.steps i{width:24px;height:24px;box-sizing:border-box;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line-strong);background:var(--surface)}
.steps li.ok i{border-color:var(--success);background:var(--success);color:#fff}
.steps li.ok i .i{width:13px;height:13px;stroke-width:2.6}
.steps li.now i{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-weak)}
.steps li.now i::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent);animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{50%{opacity:.35}}
.steps b{display:block;font:600 var(--t-14)/1.4 var(--font-sans)}
.steps span{display:block;font-size:var(--t-13);color:var(--text-3)}
.steps li:not(.ok):not(.now) b{color:var(--text-3)}
.locked{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--line);background:var(--bg-subtle)}
.locked-ui{padding:14px;filter:blur(2.5px) saturate(.8);opacity:.75;user-select:none;pointer-events:none}
.kpis.mini{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:10px}
.kpis.mini div{padding:10px 12px}
.kpis.mini b{font-size:24px}
.kpis.mini small{font-size:.5em;color:var(--text-3)}
.locked .list{padding:0 4px}
.locked-ui{filter:blur(1.6px) saturate(.85);opacity:.8}
.lock-card{position:absolute;inset:auto 12px 12px 12px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;padding:14px 16px;border-radius:12px;background:color-mix(in srgb,var(--surface) 95%,transparent);border:1px solid var(--line);box-shadow:var(--e-2);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.lock-card>.i{width:18px;height:18px;padding:7px;box-sizing:content-box;border-radius:9px;background:var(--accent-weak);color:var(--accent)}
.lock-card b{display:block;font:600 var(--t-14)/1.3 var(--font-sans)}
.lock-card span{display:block;margin:2px 0 6px;font-size:var(--t-13);color:var(--text-3)}
dialog.confirm form{display:grid;gap:8px}
dialog.confirm .fine .link{font-size:inherit}

/* phones and tablets */
@media (max-width:1000px){
  .shell{grid-template-columns:minmax(0,1fr)}
  .rail{display:none}
  .d-only{display:none!important}
  .m-only{display:inline-flex}
  .top{padding:0 16px;padding-top:env(safe-area-inset-top,0px);height:calc(56px + env(safe-area-inset-top,0px))}
  .main{padding:18px 16px 24px}
  .foot{padding:16px 16px calc(96px + env(safe-area-inset-bottom,0px))}
  .grid-2,.grid-2.wide-l{grid-template-columns:minmax(0,1fr)}
  .map-wrap{grid-template-columns:minmax(0,1fr)}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .set-r{grid-template-columns:120px minmax(0,1fr)}
  .set-r .pill{grid-column:2;justify-self:start}
  .ph-a{width:100%}
  .ph-a .btn{flex:1}
  .tabs{position:fixed;left:0;right:0;bottom:0;z-index:20;display:grid;grid-template-columns:repeat(5,1fr);padding:6px 4px calc(6px + env(safe-area-inset-bottom,0px));background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line)}
  .tabs a{position:relative;display:grid;justify-items:center;gap:3px;padding:6px 0;text-decoration:none;color:var(--text-3);font:500 11px/1 var(--font-sans)}
  .tabs a .i{width:22px;height:22px}
  .tabs a.on{color:var(--accent)}
  .tabs .nb{position:absolute;top:0;left:calc(50% + 6px);margin:0;min-width:17px;height:17px;font-size:10px;line-height:17px;padding:0 5px}
  .toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .auth-wrap{grid-template-columns:minmax(0,1fr)}
  .auth-side{display:none}
  .banner{grid-template-columns:auto minmax(0,1fr)}
  .banner .btn{grid-column:1/-1}
}
@media (max-width:560px){.row2{grid-template-columns:minmax(0,1fr)}.card{padding:22px 18px;border-radius:var(--r-lg)}.stack .actions .btn-lg{flex:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}