:root { color-scheme: dark; --bg:#050913; --panel:#0c1424; --panel-2:#101b30; --line:rgba(255,255,255,.09); --muted:#7f8ca3; --text:#f7f9fc; --teal:#37d5c0; --blue:#72a7ff; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 68% -8%,rgba(48,91,190,.16),transparent 34%),var(--bg); color:var(--text); font:15px/1.5 Inter,"Segoe UI",system-ui,sans-serif; }
button,input,select { font:inherit; }
button { cursor:pointer; border:0; }
a { color:var(--teal); }
[hidden] { display:none!important; }
.topbar { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px max(24px,calc((100vw - 1480px)/2)); border-bottom:1px solid var(--line); background:rgba(5,9,19,.86); backdrop-filter:blur(18px); position:sticky; top:0; z-index:10; }
.brand { display:flex; align-items:center; gap:12px; }.brand>span:last-child{display:grid}.brand small{color:#718099;font-size:12px}.brand-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,var(--teal),#60a5fa);color:#031c2b;font-size:23px;font-weight:900;box-shadow:0 0 35px rgba(55,213,192,.19)}.brand-mark.small{width:40px;height:40px;border-radius:12px;font-size:19px}
.top-actions,.button-row { display:flex;align-items:center;gap:8px; }.user-email{color:#718099;font-size:13px}.ghost,.light,.button-row button,.invite-card button,.compact-form button { border:1px solid var(--line); border-radius:10px; padding:9px 14px; background:rgba(255,255,255,.05); color:var(--text); font-weight:700; }.ghost:hover{background:rgba(255,255,255,.1)}
.shell { width:min(1480px,calc(100% - 40px)); margin:auto; padding:32px 0 56px; }.heading-row{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.12em;color:#718099}.eyebrow.teal{color:var(--teal);margin:0 0 6px}.heading-row h1{margin:0;font-size:34px;letter-spacing:-.04em}.filters{display:flex;gap:10px}.filters label{display:grid;gap:5px;color:#8e9bb0;font-size:11px}.filters select,.compact-form input,.invite-card input{min-width:180px;border:1px solid var(--line);border-radius:10px;background:#0b1425;color:#fff;padding:10px 12px;outline:none}.filters select:focus,.compact-form input:focus,.invite-card input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(55,213,192,.1)}
.metrics { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }.metric{min-height:142px;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,#101b30,#09111f);padding:18px}.metric:after{content:"";position:absolute;width:120px;height:120px;right:-52px;bottom:-65px;border-radius:50%;background:var(--tone);opacity:.12}.metric span,.metric small{display:block;color:#7d8aa0}.metric strong{display:block;margin:20px 0 2px;font-size:30px;letter-spacing:-.04em}.metric small{font-size:12px}
.grid-main,.grid-bottom,.grid-insights{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(340px,.7fr);gap:16px;margin-top:16px}.grid-bottom{grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr)}.grid-insights{grid-template-columns:1fr 1fr}.panel{border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,rgba(16,27,48,.98),rgba(8,15,28,.98));padding:22px;box-shadow:0 18px 50px rgba(0,0,0,.12)}.panel-head h2,.install-card h2{font-size:17px;margin:0}.panel-head p,.install-card>p{margin:4px 0 0;color:#7d8aa0;font-size:13px}.chart{position:relative;height:275px;margin-top:20px;touch-action:pan-y}.chart svg,.detail-chart svg{width:100%;height:100%;overflow:visible;background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(25% - 1px),rgba(255,255,255,.055) 25%)}.chart-cursor{position:absolute;inset:0 auto 0 0;width:1px;border-left:1px dashed rgba(114,167,255,.9);pointer-events:none}.chart-cursor i{position:absolute;left:0;width:11px;height:11px;border:3px solid #72a7ff;border-radius:50%;background:#0b1425;transform:translate(-55%,-50%);box-shadow:0 0 0 4px rgba(114,167,255,.14)}.chart-tooltip{position:absolute;z-index:2;min-width:180px;padding:12px 14px;border:1px solid rgba(114,167,255,.35);border-radius:12px;background:rgba(7,17,31,.96);box-shadow:0 18px 45px rgba(0,0,0,.38);pointer-events:none}.chart-tooltip span,.chart-tooltip small{display:block;color:#8ea0ba;font-size:11px}.chart-tooltip strong{display:block;margin:6px 0 3px;font-size:18px}.empty{color:#718099;font-size:13px}.chart-empty{display:grid;place-items:center;height:100%}
.bars{display:grid;gap:18px;margin-top:24px}.bar-row>div{display:flex;justify-content:space-between;gap:20px;font-size:13px}.bar-row b{color:#94a3b8;white-space:nowrap}.bar-row i{display:block;height:7px;margin-top:8px;border-radius:99px;background:rgba(255,255,255,.055);overflow:hidden}.bar-row em{display:block;height:100%;border-radius:inherit}.subhead{margin:26px 0 10px;padding-top:18px;border-top:1px solid var(--line);color:#718099;font-size:11px;letter-spacing:.1em;text-transform:uppercase}.chips{display:flex;flex-wrap:wrap;gap:7px}.chips.roomy{margin-top:20px}.chips span{padding:6px 9px;border-radius:8px;background:rgba(255,255,255,.05);font-size:12px}.chips b{color:#fff}
.content-panel{padding:0;overflow:hidden}.content-panel .panel-head{padding:22px;border-bottom:1px solid var(--line)}.content-list{display:grid}.content-row{display:grid;grid-template-columns:72px minmax(220px,1fr) minmax(390px,.9fr);align-items:center;gap:16px;padding:15px 20px;border-bottom:1px solid rgba(255,255,255,.06);cursor:pointer;outline:none}.content-row:hover,.content-row:focus{background:rgba(255,255,255,.035)}.page-preview{width:72px;height:48px;border-radius:9px;overflow:hidden;background:#14213a;display:grid;place-items:center}.page-preview img{width:100%;height:100%;object-fit:cover}.page-preview.image-error img{display:none}.preview-letter{color:var(--teal);font-weight:900;font-size:19px}.page-copy{min-width:0}.page-title{display:flex;align-items:center;gap:8px}.page-title strong,.page-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.page-copy small{color:#718099;margin-top:4px}.article-link{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:rgba(55,213,192,.1);text-decoration:none;flex:0 0 auto}.content-row dl{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0}.content-row dl div{text-align:right}.content-row dt{color:#718099;font-size:10px;text-transform:uppercase;letter-spacing:.05em}.content-row dd{margin:3px 0 0;font-weight:750}.content-empty{padding:30px}
.side-stack{display:grid;align-content:start;gap:16px}.install-card{border-radius:17px;background:linear-gradient(145deg,#f8fafc,#dfe7f1);color:#0f172a;padding:24px;box-shadow:0 22px 55px rgba(0,0,0,.2)}.code-icon{display:grid;place-items:center;width:44px;height:44px;margin-bottom:20px;border-radius:12px;background:#07111f;color:var(--teal);font-weight:850}.install-card pre{white-space:pre-wrap;word-break:break-all;margin:20px 0 14px;padding:15px;border-radius:12px;background:#050913;color:#a7f3d0;font-size:12px;line-height:1.65}.button-row button{flex:1;background:#07111f;color:#fff}.button-row .light{background:transparent;color:#0f172a;border-color:#bcc9d9}.action-message{min-height:20px;color:#405168!important;font-weight:700}.privacy-note{border-top:1px solid #bdc9d7;padding-top:15px;color:#66758a!important;font-size:12px!important}.invite-card button{margin-top:18px;background:var(--teal);color:#05201e}.invite-card input{width:100%;margin-top:12px;font-size:12px}.compact-form{display:grid;gap:9px;margin-top:18px}.compact-form input{min-width:0;width:100%}.compact-form button{background:#f7f9fc;color:#07111f}
.article-dialog{width:min(900px,calc(100% - 28px));max-height:88vh;overflow:auto;border:1px solid var(--line);border-radius:20px;background:#091221;color:#fff;padding:30px;box-shadow:0 40px 110px rgba(0,0,0,.7)}.article-dialog::backdrop{background:rgba(2,6,15,.77);backdrop-filter:blur(5px)}.dialog-close{position:sticky;float:right;top:0;width:36px;height:36px;border-radius:50%;background:#17233a;color:#fff;font-size:25px}.dialog-title{display:grid;grid-template-columns:100px 1fr;gap:18px;align-items:center}.dialog-title img{width:100px;height:70px;object-fit:cover;border-radius:11px}.dialog-title h2{margin:0;font-size:25px}.dialog-title p{color:#718099;margin:4px 0}.detail-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin:24px 0}.detail-metrics div{padding:14px;border-radius:12px;background:#101b30}.detail-metrics span{display:block;color:#718099;font-size:11px}.detail-metrics strong{display:block;margin-top:7px;font-size:21px}.detail-chart{height:210px;padding:15px;border:1px solid var(--line);border-radius:14px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px}.detail-grid h3{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:#718099}
.auth-body{display:grid;place-items:center;padding:24px}.auth-shell{width:min(460px,100%)}.auth-card{border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#101b30,#080f1d);padding:38px;box-shadow:0 32px 90px rgba(0,0,0,.35)}.auth-card h1{margin:12px 0 4px;font-size:31px;letter-spacing:-.04em}.muted{color:#7d8aa0}.auth-form{display:grid;gap:17px;margin-top:28px}.auth-form label{display:grid;gap:7px;color:#c8d2e2;font-size:13px}.auth-form input{min-width:0;width:100%;border:1px solid var(--line);border-radius:10px;background:#0b1425;color:#fff;padding:12px;outline:none}.auth-form input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(55,213,192,.12)}.auth-form button{margin-top:4px;border-radius:11px;padding:12px;background:var(--teal);color:#042f2e;font-weight:850}.auth-form button:disabled{opacity:.6}.form-error{min-height:20px;margin:0;color:#fda4af;font-size:13px}.auth-footer{margin:18px 0 0;color:#718099;font-size:12px}.notice{padding:10px 12px;border-radius:9px;background:rgba(55,213,192,.09);color:#99f6e4;font-size:12px}.notice.danger{background:rgba(251,113,133,.1);color:#fecdd3}
@media(max-width:1150px){.metrics{grid-template-columns:repeat(3,1fr)}.grid-main,.grid-bottom{grid-template-columns:1fr}.content-row{grid-template-columns:72px 1fr}.content-row dl{grid-column:2}.detail-metrics{grid-template-columns:repeat(3,1fr)}}
@media(max-width:720px){.shell{width:min(100% - 24px,1480px);padding-top:22px}.topbar{padding:12px}.heading-row{align-items:stretch;flex-direction:column}.filters{flex-direction:column}.filters select{width:100%}.metrics{grid-template-columns:repeat(2,1fr)}.metric{min-height:128px}.user-email,.top-actions .ghost:first-of-type{display:none}.panel{padding:16px}.grid-insights{grid-template-columns:1fr}.content-row{grid-template-columns:56px 1fr;padding:13px 12px}.page-preview{width:56px;height:44px}.content-row dl{grid-column:1/-1;grid-template-columns:repeat(2,1fr)}.content-row dl div{text-align:left}.auth-card{padding:26px}.button-row{flex-direction:column}.detail-metrics{grid-template-columns:repeat(2,1fr)}.detail-grid{grid-template-columns:1fr}.dialog-title{grid-template-columns:1fr}.dialog-title>div:first-child:empty{display:none}}

:root[data-theme="light"]{color-scheme:light;--bg:#f3f6fb;--panel:#fff;--panel-2:#eef3fa;--line:rgba(30,52,82,.14);--muted:#64748b;--text:#142033;--teal:#0f9f91;--blue:#3979df}
:root[data-theme="light"] body{background:radial-gradient(circle at 68% -8%,rgba(81,132,230,.14),transparent 34%),var(--bg)}
:root[data-theme="light"] .topbar{background:rgba(255,255,255,.88);box-shadow:0 5px 24px rgba(36,55,84,.06)}
:root[data-theme="light"] .brand small,:root[data-theme="light"] .user-email,:root[data-theme="light"] .eyebrow,:root[data-theme="light"] .filters label,:root[data-theme="light"] .metric span,:root[data-theme="light"] .metric small,:root[data-theme="light"] .panel-head p,:root[data-theme="light"] .page-copy small,:root[data-theme="light"] .content-row dt,:root[data-theme="light"] .detail-metrics span,:root[data-theme="light"] .dialog-title p,:root[data-theme="light"] .empty{color:#64748b}
:root[data-theme="light"] .ghost{background:#fff;color:#24344d;box-shadow:0 2px 8px rgba(36,55,84,.05)}
:root[data-theme="light"] .ghost:hover{background:#edf3fb}
:root[data-theme="light"] .filters select,:root[data-theme="light"] .compact-form input,:root[data-theme="light"] .invite-card input,:root[data-theme="light"] .auth-form input{background:#fff;color:#142033}
:root[data-theme="light"] .metric,:root[data-theme="light"] .panel{background:linear-gradient(145deg,#fff,#f7f9fd);box-shadow:0 16px 42px rgba(36,55,84,.08)}
:root[data-theme="light"] .chart svg,:root[data-theme="light"] .detail-chart svg{background:repeating-linear-gradient(to bottom,transparent 0,transparent calc(25% - 1px),rgba(30,52,82,.09) 25%)}
:root[data-theme="light"] .chart-cursor i{background:#fff}
:root[data-theme="light"] .chart-tooltip{background:rgba(255,255,255,.97);color:#142033;box-shadow:0 18px 45px rgba(36,55,84,.2)}
:root[data-theme="light"] .bar-row b{color:#53647c}
:root[data-theme="light"] .bar-row i{background:rgba(30,52,82,.08)}
:root[data-theme="light"] .chips span{background:rgba(30,52,82,.07)}
:root[data-theme="light"] .chips b{color:#142033}
:root[data-theme="light"] .content-row{border-bottom-color:rgba(30,52,82,.09)}
:root[data-theme="light"] .content-row:hover,:root[data-theme="light"] .content-row:focus{background:rgba(57,121,223,.055)}
:root[data-theme="light"] .page-preview{background:#e8eef7}
:root[data-theme="light"] .article-dialog{background:#fff;color:#142033;box-shadow:0 40px 110px rgba(36,55,84,.3)}
:root[data-theme="light"] .dialog-close{background:#e8eef7;color:#142033}
:root[data-theme="light"] .detail-metrics div{background:#eef3fa}
:root[data-theme="light"] .auth-card{background:linear-gradient(145deg,#fff,#f4f7fc);box-shadow:0 32px 90px rgba(36,55,84,.16)}
:root[data-theme="light"] .auth-form label{color:#34445b}
:root[data-theme="light"] .muted,:root[data-theme="light"] .auth-footer{color:#64748b}