:root{color-scheme:dark;--bg:#101217;--rail:#121316;--canvas:#252932;--panel:#1e222a;--line:#363d49;--line-soft:#303743;--text:#e6eaf0;--muted:#a4afbf;--quiet:#8593a6;--cyan:#9cdce9;--pink:#ffa2b0;--green:#78d7a6;--mono:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:13px/1.55 var(--mono)}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:wait;opacity:.65}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}svg{display:block;flex:none}[hidden]{display:none!important}
.frame{margin:16px auto;width:calc(100% - 32px);max-width:1560px;min-height:calc(100dvh - 32px);border:1px solid #3b4657;border-radius:13px;overflow:clip;background:var(--canvas);box-shadow:5px 5px 0 #151b25,0 18px 50px #090a0e75}
.layout{display:grid;grid-template-columns:207px minmax(0,1fr);min-height:calc(100dvh - 34px)}.sidebar{display:flex;flex-direction:column;background:var(--rail);border-right:1px solid #303641;padding:24px 14px 18px}.brand{display:flex;gap:10px;align-items:center;margin:0 5px 30px;font-size:17px;color:var(--pink);font-weight:700;letter-spacing:.035em;line-height:1.18}.brand small{display:block;font-size:9px;letter-spacing:.23em;color:var(--quiet);font-weight:400;margin-top:5px}.brand-mark{width:33px;height:33px;border-radius:8px;background:#291f28;border:1px solid #56333e;display:grid;place-items:center}.new-project,.primary,.button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:6px;border:1px solid var(--line);background:#20252e;color:var(--text);min-height:38px;padding:0 12px;font-weight:600;white-space:nowrap}.new-project{justify-content:flex-start;color:var(--pink);border-color:#60404a;background:#28202a;padding:0 9px;font-size:11px;margin-bottom:26px}.new-project svg{width:15px}.new-project:hover,.primary:hover{background:#ffb4bf;color:#19151c}.nav-label{padding:0 9px;color:var(--quiet);font-size:10px;letter-spacing:.13em;margin:0 0 7px}.nav-label.secondary{margin-top:26px}.sidebar nav{display:grid;gap:3px}.sidebar nav a{display:flex;align-items:center;gap:9px;padding:9px 8px;border:1px solid transparent;border-radius:5px;color:#a9bac9;font-size:12px}.sidebar nav a:hover{background:#21262d;color:var(--cyan)}.sidebar nav a[aria-current=page]{background:#20282f;color:var(--cyan);border-color:#31434e}.sidebar nav svg{width:15px;height:15px}.nav-count{margin-left:auto;font-size:10px;color:var(--quiet)}.sidebar-footer{display:flex;gap:9px;align-items:center;margin-top:auto;padding:18px 4px 0;color:#b0bdca;border-top:1px solid #292e37;font-size:11px}.sidebar-footer small{display:block;color:var(--quiet);font-size:10px}.footer-mark{display:grid;place-items:center;color:var(--cyan);width:29px;height:29px;border-radius:6px;background:#1c242b;border:1px solid #2b3a45}.footer-mark svg{width:14px;height:14px}
.topbar{height:53px;padding:0 27px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #353d49;background:#232730;font-size:11px;color:var(--quiet)}.topbar>div{display:flex;align-items:center;gap:10px}.topbar strong{color:#c4cedb;font-weight:600}.slash{color:#647388}.private{display:flex;align-items:center;gap:7px;color:var(--cyan);font-size:9px;letter-spacing:.12em}.private i{width:6px;height:6px;background:var(--cyan);box-shadow:0 0 8px #9cdce950}.menu-btn{display:none!important}
.content{max-width:1310px;margin:auto;padding:29px 30px 35px}.eyebrow{margin:0 0 8px;color:var(--cyan);font-size:10px;letter-spacing:.15em;text-transform:uppercase;display:flex;align-items:center;gap:7px}.eyebrow svg{width:14px;height:14px}.heading{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:23px}.heading h1{font-size:clamp(25px,3.4vw,35px);letter-spacing:-.065em;line-height:1.12;margin:0 0 8px;color:#f0edf1}.heading p:last-child{margin:0;color:var(--muted);font-size:12px}.actions{display:flex;gap:8px;flex-wrap:wrap}.actions svg,.button svg,.primary svg{width:15px;height:15px}.primary{background:#f6a3b2;border-color:#f6a3b2;color:#231920}.button:hover,.icon-button:hover{background:#2d3542;border-color:#546478;color:var(--cyan)}.icon-button{padding:0;width:34px;min-height:34px;background:transparent}.button.small{min-height:32px;font-size:11px}
.demo{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 15px;padding:8px 11px;border:1px solid #51404b;border-radius:6px;background:#2c2630;color:#d7beca;font-size:11px}.demo strong{color:var(--pink);letter-spacing:.09em;font-size:9px;margin-right:8px}.demo a{color:var(--pink);white-space:nowrap}.demo a:hover{text-decoration:underline}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-bottom:15px}.metric,.panel{background:var(--panel);border:1px solid var(--line);border-radius:8px}.metric{min-width:0;padding:13px 14px}.metric-label{display:flex;justify-content:space-between;gap:6px;align-items:center;color:#a9b6c7;font-size:11px}.metric-label svg{width:15px;height:15px;color:var(--cyan)}.metric strong{display:block;font-size:clamp(20px,2.6vw,29px);letter-spacing:-.065em;line-height:1.25;margin:6px 0 4px;font-weight:600}.metric strong em{color:var(--quiet);font-style:normal;font-size:.55em;margin-left:4px;letter-spacing:0}.metric small{color:var(--quiet);font-size:10px}.metric .green{color:var(--green)}
.chart-panel{padding:15px 16px 12px;margin-bottom:15px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.panel h2{font-size:14px;letter-spacing:-.025em;margin:0;color:#e2e8ef}.panel-head p,.panel-copy{margin:3px 0 0;color:var(--quiet);font-size:11px}.tabs{display:flex;align-items:center;gap:2px;padding:2px;border:1px solid var(--line);background:#181c23;border-radius:6px}.tabs button{background:transparent;border:0;color:var(--muted);font-size:10px;min-width:33px;min-height:25px;border-radius:4px}.tabs button[aria-pressed=true]{color:var(--cyan);background:#293641}.chart{display:block;width:100%;height:140px}.chart text{fill:#91a0b4;font:10px var(--mono)}.chart .grid{stroke:#36414d;stroke-dasharray:3 4}.chart .guide{stroke:#33404b}.chart-empty{display:grid;place-items:center;min-height:140px;border-top:1px dashed var(--line);color:var(--quiet);text-align:center}.legend{display:flex;gap:7px;align-items:center;color:var(--muted);font-size:10px;margin:1px 0 0 2px}.legend i{width:6px;height:6px;background:var(--cyan)}
.projects-panel{overflow:hidden}.projects-panel>.panel-head{padding:13px 15px;margin:0}.panel-link{display:flex;gap:4px;align-items:center;color:var(--cyan);font-size:11px;white-space:nowrap}.panel-link:hover{text-decoration:underline}.panel-link svg{width:13px;height:13px}.table-scroll{overflow:auto}.table{width:100%;border-collapse:collapse;text-align:left;white-space:nowrap}.table th,.table td{padding:9px 14px;border-top:1px solid var(--line-soft)}.table th{font-size:9px;color:#a3afc0;background:#1a1e26;letter-spacing:.07em;font-weight:500;text-transform:uppercase}.table td{font-size:11px;color:#d6dfe9}.table tbody tr:hover{background:#252d37}.project-name{display:flex;align-items:center;gap:10px;text-align:left;background:none;border:0;padding:0;color:var(--text)}.project-name:hover strong{color:var(--cyan)}.project-name strong{display:block;font-weight:600}.project-name small{color:var(--quiet);display:block;font-size:10px;max-width:230px;overflow:hidden;text-overflow:ellipsis}.project-icon{color:var(--cyan);width:29px;height:29px;display:grid;place-items:center;border:1px solid #3c4b58;border-radius:6px;background:#26313b}.project-icon svg{width:15px;height:15px}.tag{display:inline-flex;align-items:center;gap:5px;border:1px solid #345449;color:var(--green);background:#23382f;border-radius:5px;padding:2px 6px;font-size:10px}.tag i{width:5px;height:5px;background:currentColor}.tag.down{color:var(--pink);border-color:#63444f;background:#392831}.tag.pending{color:#b2bdcc;border-color:#495465;background:#303845}.spark{display:flex;align-items:center;gap:2px}.spark i{display:block;width:4px;height:12px;border-radius:1px;background:#394553}.spark .pass{background:#66c799}.spark .miss{background:#ef8295}.row-arrow{padding:0 4px;background:none;border:0;color:var(--quiet)}.row-arrow:hover{color:var(--cyan)}.row-arrow svg{width:14px;height:14px}.empty{display:grid;justify-items:center;text-align:center;padding:37px 16px 42px;gap:9px;color:var(--muted)}.empty h2{margin:2px 0 0;color:var(--text)}.empty p{margin:0 0 5px}.empty>svg{width:26px;height:26px;color:var(--cyan)}
.loading{display:flex;align-items:center;gap:8px;color:var(--cyan)}.footnote{margin:12px 0 0;color:var(--quiet);font-size:10px}.footnote a,.text-link{color:var(--cyan);text-decoration:underline;text-underline-offset:3px}.settings{padding:20px;max-width:700px}.settings p{color:var(--muted);max-width:64ch;margin:8px 0 15px}.settings+.settings{margin-top:14px}.detail-link{display:inline-flex;gap:7px;align-items:center;color:var(--cyan);overflow-wrap:anywhere}.detail-link svg{width:14px;height:14px}.danger{color:var(--pink)}
dialog{width:min(490px,calc(100% - 28px));border:1px solid #526173;border-radius:10px;background:#20252e;color:var(--text);padding:0;box-shadow:0 22px 90px #000a}dialog::backdrop{background:#0b0c12bc}.dialog-inner{padding:25px;position:relative}.dialog-close{position:absolute;right:13px;top:12px}.dialog-inner h2{margin:0 35px 7px 0;font-size:20px;line-height:1.3}.dialog-inner p{color:var(--muted);margin:0 0 14px;font-size:12px}.dialog-inner form{display:grid;gap:12px}.dialog-inner label{display:grid;gap:4px;color:#d6deea;font-size:11px}.dialog-inner input,.dialog-inner textarea,.dialog-inner select{width:100%;border:1px solid #475466;background:#171b22;color:var(--text);border-radius:5px;padding:9px 10px}.dialog-inner textarea{min-height:110px;resize:vertical}.dialog-inner .actions{justify-content:flex-end}.dialog-inner .form-error{color:var(--pink);margin:0}.dialog-inner .form-error:empty{display:none}#toast{position:fixed;z-index:4;bottom:20px;right:20px;max-width:min(450px,calc(100% - 40px));padding:10px 14px;background:#162128;border:1px solid #456270;border-radius:7px;color:var(--cyan);box-shadow:0 4px 20px #0007}
@media(max-width:950px){.layout{grid-template-columns:173px minmax(0,1fr)}.sidebar{padding-left:10px;padding-right:10px}.content{padding:23px 20px 28px}.topbar{padding:0 20px}.metric{padding:11px 9px}.table th,.table td{padding-left:9px;padding-right:9px}.heading{align-items:flex-start}}
@media(max-width:700px){.frame{margin:7px;width:calc(100% - 14px);min-height:calc(100dvh - 14px)}.layout{display:block;min-height:calc(100dvh - 16px);position:relative}.sidebar{display:none;position:absolute;z-index:3;inset:0 auto 0 0;width:192px;box-shadow:8px 0 20px #0006}.sidebar.open{display:flex}.menu-btn{display:inline-flex!important;min-height:30px;width:30px}.topbar{padding:0 11px}.content{padding:18px 12px 24px}.heading{flex-direction:column;gap:12px;margin-bottom:16px}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.demo{align-items:flex-start}.chart-panel{padding:11px}.chart{height:124px}.table{min-width:610px}.sidebar-footer{margin-top:26px}}

.auth-screen{min-height:100dvh;display:grid;place-items:center;padding:20px;background:radial-gradient(ellipse at 50% 15%,#28313b 0%,var(--bg) 66%)}
.auth-card{width:min(100%,460px);padding:30px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 22px 70px #0a0b105c}
.auth-brand{display:flex;align-items:center;gap:10px;color:var(--pink);font-weight:700;margin-bottom:25px}
.auth-card h1{font-size:clamp(22px,6vw,29px);line-height:1.15;letter-spacing:-.04em;margin:0 0 9px}
.auth-copy{color:var(--muted);margin:0 0 18px}.auth-card form{display:grid;gap:11px}.auth-card label{display:grid;gap:4px;font-size:12px}
.auth-card input{width:100%;padding:9px 10px;border:1px solid #475466;border-radius:5px;background:#171b22;color:var(--text)}.auth-card form small{color:var(--quiet);margin-top:-6px}.auth-card .form-error{margin:0;color:var(--pink)}.auth-card .form-error:empty{display:none}
.auth-qr{width:195px;height:195px;background:#fff;margin:14px auto;border-radius:6px}.auth-card details{color:var(--cyan);margin:0 0 13px}.manual-key{display:block;background:#171b22;color:var(--text);padding:10px;margin:8px 0;overflow-wrap:anywhere}.recovery-key{margin:0 0 15px;color:var(--cyan)}
.auth-secondary{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}.text-button{background:none;border:0;padding:0;color:var(--cyan);margin-top:10px;text-decoration:underline;text-underline-offset:3px}
.docker-panel{margin-top:14px}.docker-metrics{margin:10px 0 0}.docker-metrics .metric{background:#242a33}
@media(prefers-reduced-motion:no-preference){button,a{transition:background-color .12s,color .12s,border-color .12s}}