:root{color-scheme:dark;--bg:#090f1e;--panel:#121d32;--line:#2b3a55;--muted:#9aaccc;--blue:#a9cdff;--green:#65d9b2;font-family:system-ui,'Microsoft YaHei','PingFang SC',sans-serif}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--bg);color:#f4f7ff}button,input,select{font:inherit}button{cursor:pointer}.ambient{pointer-events:none;position:fixed;inset:0;background:radial-gradient(ellipse 53% 32% at 76% 0%,#214c9e55,transparent 80%),radial-gradient(ellipse 40% 27% at 0% 42%,#442d6450,transparent 85%);z-index:-1}.shell{width:min(1150px,calc(100% - 48px));margin:auto}.topbar{height:90px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;white-space:nowrap}.brand img{width:50px;height:50px;object-fit:contain;filter:drop-shadow(0 8px 14px #518fff80)}.brand strong{display:block;font-size:20px;font-weight:800;letter-spacing:-.05em}.brand strong span{color:var(--blue)}.brand small{display:block;margin-top:1px;font-size:9px;letter-spacing:.21em;font-weight:800;color:#7890b7}.top-actions{display:flex;align-items:center;gap:17px}.status-pill{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:12px;color:#a6b7d1}.status-indicator{width:7px;height:7px;border-radius:50%;background:#7385a0;box-shadow:0 0 0 4px #7385a025}.status-pill.connected .status-indicator{background:var(--green);box-shadow:0 0 0 4px #65d9b225}.status-pill.disconnected .status-indicator{background:#ffbc78;box-shadow:0 0 0 4px #ffbc7825}.login-button,.ghost-button,.add-button{min-height:38px;padding:0 15px;border-radius:9px;font-size:12px;font-weight:700;white-space:nowrap}.login-button,.ghost-button{background:#15213a;border:1px solid #384b6a;color:#d8e5fa}.login-button:hover,.ghost-button:hover{background:#233657}.add-button{background:var(--blue);border:1px solid var(--blue);color:#10203d}.add-button:hover{background:#c9e0ff}.add-button span{font-size:18px;vertical-align:-1px}.intro{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:300px;overflow:hidden;border-bottom:1px solid var(--line)}.eyebrow{font-size:10px;letter-spacing:.24em;font-weight:800;color:#86b4f7}.eyebrow span{color:#ffaed1}.intro h1{font-size:clamp(39px,5.3vw,64px);line-height:1.2;letter-spacing:-.065em;margin:17px 0 12px}.intro h1 em{font-style:normal;color:#add2ff}.intro p{font-size:14px;color:#a8b6d0;margin:0}.intro-decoration{position:relative;display:grid;place-items:center;align-self:stretch;width:34%;min-width:270px}.intro-decoration img{position:relative;width:240px;height:240px;object-fit:contain;z-index:1;filter:drop-shadow(0 18px 42px #6194fa75)}.decoration-orbit{position:absolute;width:272px;height:272px;border:1px solid #5786d845;border-radius:50%;box-shadow:0 0 0 31px #467dd80d,0 0 0 65px #467dd809}.decoration-line{position:absolute;right:0;top:26px;font-size:9px;font-weight:800;letter-spacing:.24em;color:#7088b0}.sites-section{padding-top:37px}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:21px}.section-head h2{font-size:25px;letter-spacing:-.04em;margin:6px 0 0}.section-head h2 span{font-size:12px;color:#7890b4;margin-left:7px;vertical-align:middle}.admin-actions{display:flex;gap:8px}.admin-actions[hidden],#confirmGroup[hidden],#setupCodeGroup[hidden]{display:none}.site-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.site-card{--accent:#8bbdff;min-width:0;overflow:hidden;border:1px solid #2d3d59;border-radius:15px;background:linear-gradient(145deg,#16233b,#101a2e 80%);box-shadow:0 10px 28px #0003;transition:transform .2s,border-color .2s}.site-card:hover{transform:translateY(-3px);border-color:#668cc7}.site-card:before{content:'';display:block;height:2px;background:linear-gradient(90deg,var(--accent),transparent 75%)}.card-header{display:flex;align-items:center;gap:12px;padding:19px 20px 16px}.card-identity{min-width:0;flex:1}.card-name,.card-domain{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-name{font-size:16px;font-weight:800}.card-domain{margin-top:3px;font-size:11px;color:#91a0bc}.card-visit{display:grid;place-items:center;width:30px;height:30px;border:1px solid #425574;border-radius:9px;text-decoration:none;color:#d2e1f8;font-size:18px}.card-visit:hover{background:#304b73}.card-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 20px 16px;padding:14px 0;border-top:1px solid #293a56;border-bottom:1px solid #293a56}.card-metric{min-width:0}.card-metric span{display:block;color:#91a2bc;font-size:10px;white-space:nowrap}.card-metric strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:4px;font-size:14px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.03em}.card-metric strong.mint{color:#85e2c3}.card-metric strong.pink{color:#ffaccf}.history{margin:0 20px 19px}.history-row{display:grid;grid-template-columns:42px minmax(0,1fr) 41px;gap:9px;align-items:center;margin-top:9px}.history-label{font-size:10px;color:#a0aec5}.history-value{font-size:10px;font-weight:800;text-align:right;color:#86dfc0;font-variant-numeric:tabular-nums}.history-cells{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));gap:2px;height:13px}.history-cell{height:13px;border-radius:2px;background:#34435d}.history-cell.good{background:#5ed5ac}.history-cell.fair{background:#eccb6b}.history-cell.bad{background:#f28b91}.card-footer{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 20px 12px;background:#0b172b9c;border-top:1px solid #253550}.card-footer span{color:#8e9fba;font-size:10px}.card-footer span:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#7b8aa7;margin-right:7px;vertical-align:1px}.card-footer span.online:before{background:#5fdab1}.card-footer span.offline:before{background:#f28b91}.card-controls{display:flex;gap:12px}.card-controls button{padding:2px;border:0;background:none;color:#adbfdb;font-size:10px;font-weight:700}.card-controls button:hover{color:#fff}.card-controls button.delete:hover{color:#ff9daa}.empty{grid-column:1/-1;padding:52px 20px;border:1px dashed #455879;border-radius:14px;text-align:center;color:#9aabc6}.empty strong{display:block;margin-bottom:6px;font-size:17px;color:#f0f5ff}.measurement-note{margin:20px 0 0;color:#7387a9;font-size:11px;line-height:1.7}footer{display:flex;justify-content:center;gap:7px;padding:50px 0 32px;color:#7185a6;font-size:11px}dialog{width:min(460px,calc(100% - 28px));max-height:calc(100% - 24px);overflow:auto;padding:0;border:1px solid #557099;border-radius:17px;background:#121e34;color:#f5f7ff;box-shadow:0 30px 100px #000c}dialog::backdrop{background:#020817bf;backdrop-filter:blur(5px)}dialog form{padding:25px}.dialog-head{display:flex;align-items:start;justify-content:space-between}.dialog-head h2{margin:8px 0 0;font-size:23px;letter-spacing:-.04em}.close-button{border:0;background:transparent;color:#a9bbd4;font-size:25px;line-height:1}.dialog-help{margin:16px 0;color:#a9b7cd;font-size:12px;line-height:1.6}label{display:block;margin:17px 0 7px;color:#e0e9f8;font-size:12px;font-weight:700}.optional{color:#90a2bd;font-size:11px;font-weight:500}input,select{display:block;width:100%;height:43px;padding:0 12px;border:1px solid #3e5375;border-radius:9px;outline:none;background:#0a1427;color:#f8faff;font-size:13px}input::placeholder{color:#6e819e}input:focus,select:focus{border-color:#9bc4ff;box-shadow:0 0 0 3px #9bc4ff25}.form-error{min-height:17px;margin:12px 0;color:#ffaab5;font-size:12px}.dialog-actions{display:flex;justify-content:flex-end;gap:8px}.cancel-button,.save-button{min-height:38px;padding:0 17px;border-radius:9px;font-size:12px;font-weight:800}.cancel-button{border:1px solid #435b7d;background:transparent;color:#d8e6fa}.save-button{border:1px solid var(--blue);background:var(--blue);color:#0d1b33}.save-button:hover{background:#c8e0ff}.save-button:disabled{opacity:.5;cursor:wait}:focus-visible{outline:2px solid #9bc4ff;outline-offset:3px}
@media(max-width:870px){.site-grid{grid-template-columns:1fr}.intro-decoration{min-width:250px}.intro-decoration img{width:210px;height:210px}}@media(max-width:620px){.shell{width:calc(100% - 28px)}.topbar{height:75px}.brand img{width:42px;height:42px}.brand strong{font-size:17px}.brand small{font-size:7px}.status-pill{display:none}.intro{min-height:245px}.intro h1{font-size:40px}.intro-decoration{position:absolute;right:-67px;opacity:.3;min-width:230px}.section-head{align-items:start;flex-direction:column}.admin-actions{flex-wrap:wrap}.card-header{padding:18px 16px 14px}.card-metrics{margin:0 16px 14px;gap:4px}.card-metric strong{font-size:12px}.history{margin:0 16px 16px}.history-row{grid-template-columns:36px minmax(0,1fr) 34px;gap:5px}.history-cells{gap:1px}.card-footer{padding:10px 16px}}@media(max-width:380px){.card-metric strong{font-size:11px}.history-label,.history-value{font-size:9px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}



.site-card.accent-0{--accent:#86baff}.site-card.accent-1{--accent:#ffabd0}.site-card.accent-2{--accent:#ffbe9c}.site-card.accent-3{--accent:#b7a7ff}.site-card.accent-4{--accent:#8adac9}.site-card.accent-5{--accent:#ffce88}