:root{color-scheme:light;--ink:#17201c;--muted:#66716b;--line:#dfe5e1;--surface:#fff;--soft:#f4f7f5;--green:#16794b;--green-dark:#0d5634;--red:#b42318;--amber:#a15c00;--shadow:0 12px 38px rgba(23,32,28,.08)}
*{box-sizing:border-box}body{margin:0;background:#f7f9f8;color:var(--ink);font:15px/1.45 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;letter-spacing:0}button,input,select,textarea{font:inherit;letter-spacing:0}button{cursor:pointer}.topbar{height:72px;padding:0 clamp(18px,4vw,56px);display:flex;align-items:center;justify-content:space-between;background:var(--surface);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.brand-mark{width:38px;height:38px;display:grid;place-items:center;background:var(--green);color:#fff;font-weight:800;border-radius:7px}.brand strong,.brand small{display:block}.brand small{color:var(--muted);font-size:12px;margin-top:1px}.top-actions{display:flex;gap:8px;align-items:center;color:var(--muted);font-size:13px}.live-dot{width:8px;height:8px;border-radius:50%;background:#18a661;box-shadow:0 0 0 4px #daf4e7}.quiet,.refresh{border:1px solid var(--line);background:#fff;padding:8px 13px;border-radius:6px;color:var(--ink);margin-left:12px}.tabs{height:48px;padding:0 clamp(18px,4vw,56px);display:flex;gap:26px;background:#fff;border-bottom:1px solid var(--line);overflow-x:auto}.tab{position:relative;border:0;background:none;color:var(--muted);white-space:nowrap;padding:0}.tab.active{color:var(--ink);font-weight:700}.tab.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--green)}.content{max-width:1440px;margin:auto;padding:32px clamp(18px,4vw,56px) 64px}.view{display:none}.view.active{display:block}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:24px}.eyebrow{text-transform:uppercase;color:var(--green);font-size:11px;font-weight:800;margin:0 0 6px}.section-heading h1{font-size:28px;line-height:1.1;margin:0}.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);background:#fff;margin-bottom:28px}.metrics article{padding:22px 24px;border-right:1px solid var(--line)}.metrics article:last-child{border:0}.metrics span{display:block;color:var(--muted);font-size:13px}.metrics strong{font-size:30px;display:block;margin-top:7px}.table-section{background:#fff;border:1px solid var(--line)}.section-title{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}.section-title h2,.tool-panel h2{font-size:16px;margin:0}.section-title span{font-size:12px;color:var(--muted)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:720px}th,td{text-align:left;padding:14px 20px;border-bottom:1px solid #edf0ee;font-size:13px}th{color:var(--muted);font-size:11px;text-transform:uppercase;background:#fbfcfb}.status{display:inline-block;padding:4px 8px;border-radius:5px;background:#edf0ee;font-weight:700;font-size:11px}.status.sent{background:#daf4e7;color:#11633d}.status.failed{background:#fee4e2;color:var(--red)}.status.queued,.status.retrying,.status.processing{background:#fff0cf;color:var(--amber)}.empty{text-align:center;color:var(--muted);padding:34px}.tool-panel{background:#fff;border:1px solid var(--line);padding:24px;max-width:900px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-grid.compact{margin-top:28px}.span-2{grid-column:1/-1}label,legend{display:block;color:#435049;font-size:12px;font-weight:700;margin-bottom:7px}input,select,textarea{width:100%;border:1px solid #cbd4cf;border-radius:6px;padding:11px 12px;background:#fff;color:var(--ink);outline:none}input:focus,select:focus,textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(22,121,75,.1)}textarea{resize:vertical}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:18px;color:var(--muted);font-size:12px}.form-actions button,.login-form button{border:0;border-radius:6px;background:var(--green);color:#fff;padding:11px 18px;font-weight:750}.form-actions button:hover,.login-form button:hover{background:var(--green-dark)}fieldset{border:1px solid var(--line);padding:14px}.checks{display:flex;gap:20px;flex-wrap:wrap}.checks label{display:flex;align-items:center;gap:7px;margin:0}.checks input{width:auto}.instance-list{border:1px solid var(--line);background:#fff}.instance-row{display:grid;grid-template-columns:10px minmax(180px,1fr) 120px 80px;align-items:center;gap:14px;padding:16px 20px;border-bottom:1px solid var(--line)}.instance-row:last-child{border:0}.instance-row small{display:block;color:var(--muted);margin-top:3px}.instance-row b{text-align:right}.health{width:9px;height:9px;border-radius:50%;background:#aab3ae}.health.connected{background:#18a661}.health.error,.health.unavailable{background:#d92d20}.health-label{text-transform:capitalize;color:var(--muted)}.token-box{display:none;white-space:pre-wrap;word-break:break-all;padding:14px;background:#17201c;color:#dff7e9;border-radius:6px}.token-box:not(:empty){display:block}.toast{position:fixed;right:24px;bottom:24px;max-width:360px;padding:12px 16px;background:#17201c;color:#fff;border-radius:6px;box-shadow:var(--shadow);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}.toast.error{background:var(--red)}
.login-page{min-height:100vh;display:grid;place-items:center;background:linear-gradient(90deg,#eef5f1 0 42%,#f9fbfa 42%)}.login-shell{width:min(880px,calc(100% - 32px));min-height:480px;display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.login-brand{padding:54px;background:#19382b;color:#fff;display:flex;flex-direction:column;justify-content:center}.login-brand .brand-mark{background:#fff;color:#19382b;margin-bottom:22px}.login-brand h1{font-size:34px;line-height:1.08;margin:0 0 14px}.login-brand p{color:#bdd0c6;margin:0;max-width:280px}.login-form{padding:54px;display:flex;flex-direction:column;justify-content:center;gap:18px}.login-form button{margin-top:6px}.login-form button:disabled{opacity:.6}.form-error{min-height:20px;color:var(--red);font-size:13px;margin:0}
@media(max-width:760px){.top-actions>span:not(.live-dot){display:none}.tabs{gap:20px}.content{padding-top:24px}.metrics{grid-template-columns:1fr 1fr}.metrics article:nth-child(2){border-right:0}.metrics article:nth-child(-n+2){border-bottom:1px solid var(--line)}.form-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.instance-row{grid-template-columns:10px 1fr auto}.instance-row b{display:none}.login-page{background:#f4f7f5}.login-shell{display:block;min-height:0}.login-brand{padding:34px}.login-brand h1{font-size:27px}.login-form{padding:34px}.section-heading h1{font-size:24px}}

/* Theme system */
:root{--page:#f7f9f8;--surface-2:#fbfcfb;--field:#fff}
:root[data-theme="dark"]{color-scheme:dark;--ink:#eef4f0;--muted:#a5b1ab;--line:#34413a;--surface:#18201c;--surface-2:#202a25;--field:#121915;--soft:#202a25;--green:#36c77d;--green-dark:#23965c;--red:#ff746c;--amber:#f0ae45;--page:#101613;--shadow:0 14px 42px rgba(0,0,0,.32)}
body{background:var(--page);transition:background-color .18s,color .18s}.topbar,.tabs,.metrics,.table-section,.tool-panel,.instance-list,.login-shell{background:var(--surface)}.quiet,.refresh,input,select,textarea{background:var(--field);color:var(--ink)}th{background:var(--surface-2)}th,td{border-color:var(--line)}
.theme-switch{display:flex;align-items:center;padding:3px;background:var(--soft);border:1px solid var(--line);border-radius:7px}.theme-switch button{border:0;background:transparent;color:var(--muted);font-size:12px;padding:6px 9px;border-radius:4px}.theme-switch button.active{background:var(--surface);color:var(--ink);font-weight:750;box-shadow:0 1px 4px rgba(0,0,0,.12)}.login-theme{position:fixed;top:20px;right:20px;z-index:2}.login-page{background:linear-gradient(90deg,#eef5f1 0 42%,#f9fbfa 42%)}
:root[data-theme="dark"] .login-page{background:linear-gradient(90deg,#0d1712 0 42%,#111915 42%)}:root[data-theme="dark"] .login-brand{background:#0f3424}:root[data-theme="dark"] .login-brand p{color:#a8c4b5}:root[data-theme="dark"] .status{background:#2a342f;color:var(--ink)}:root[data-theme="dark"] .status.sent{background:#153d2a;color:#7be5a9}:root[data-theme="dark"] .status.failed{background:#492421;color:#ff9b94}:root[data-theme="dark"] .status.queued,:root[data-theme="dark"] .status.retrying,:root[data-theme="dark"] .status.processing{background:#44351b;color:#ffd17d}:root[data-theme="dark"] .token-box{background:#090e0b;border:1px solid var(--line)}
@media(max-width:760px){.topbar{height:auto;min-height:72px;padding-top:10px;padding-bottom:10px}.top-actions{gap:5px}.top-actions .theme-switch{margin-left:5px}.theme-switch button{padding:6px}.quiet{margin-left:3px}.login-theme{top:12px;right:12px}:root[data-theme="dark"] .login-page{background:#101613}}

.subnav{display:flex;gap:4px;padding:4px;margin-bottom:18px;background:var(--soft);border:1px solid var(--line);width:max-content;max-width:100%;overflow:auto}.subtab{border:0;background:transparent;color:var(--muted);padding:9px 13px;white-space:nowrap}.subtab.active{background:var(--surface);color:var(--ink);font-weight:750;box-shadow:0 1px 4px rgba(0,0,0,.08)}.instance-mode{display:none}.instance-mode.active{display:block}.evolution-row,.key-row{display:grid;grid-template-columns:10px minmax(180px,1fr) auto auto;align-items:center;gap:16px;padding:15px 18px;border-bottom:1px solid var(--line)}.evolution-row:last-child,.key-row:last-child{border:0}.evolution-row small,.key-row small{display:block;color:var(--muted);margin-top:3px}.row-actions{display:flex;gap:7px;align-items:center}.row-actions button,.import-instance{margin:0}.import-instance{border:0;border-radius:6px;background:var(--green);color:#fff;padding:8px 11px;font-weight:700}.managed-badge{color:var(--green);font-size:12px;font-weight:750;padding:7px}.managed-row{grid-template-columns:10px minmax(180px,1fr) 100px 80px auto}.field-help{display:block;color:var(--muted);margin-top:7px}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.project-card{min-height:145px;padding:20px;background:var(--surface);border:1px solid var(--line);display:grid;grid-template-columns:1fr auto;align-content:space-between;gap:14px}.project-card h2{font-size:17px;margin:6px 0 0}.project-card>strong{font-size:25px}.project-card>strong small{font-size:11px;color:var(--muted)}.project-slug{font:12px ui-monospace,monospace;color:var(--green)}.project-card .status{grid-column:1/-1;width:max-content}.table-section.compact{margin-top:28px;max-width:900px}.key-row{grid-template-columns:minmax(180px,1fr) auto auto auto}.key-row>span:not(.status){color:var(--muted);font-size:12px}dialog{width:min(440px,calc(100% - 32px));border:1px solid var(--line);border-radius:7px;padding:26px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow)}dialog::backdrop{background:rgba(3,8,5,.72)}.dialog-close{position:absolute;right:12px;top:10px;border:0;background:none;color:var(--muted);font-size:28px}.qr-content{text-align:center}.qr-content img{display:block;width:min(300px,100%);aspect-ratio:1;margin:18px auto;background:#fff;padding:10px;border-radius:6px}.qr-content p{color:var(--muted)}
@media(max-width:900px){.project-grid{grid-template-columns:1fr 1fr}.evolution-row{grid-template-columns:10px 1fr auto}.evolution-row>.status{display:none}.row-actions{grid-column:2/-1}.managed-row{grid-template-columns:10px 1fr auto}.managed-row .health-label,.managed-row b{display:none}.key-row{grid-template-columns:1fr auto}.key-row>span:not(.status){display:none}}
@media(max-width:600px){.project-grid{grid-template-columns:1fr}.evolution-row{gap:10px}.row-actions{flex-wrap:wrap}.top-actions .live-dot{display:none}.brand small{display:none}}

#instance-form{display:none}#instance-form.ready{display:grid}
.pairing-code{margin-top:16px;padding:13px;border:1px solid var(--line);background:var(--soft)}.pairing-code span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase}.pairing-code strong{display:block;margin-top:5px;font:700 22px ui-monospace,monospace;letter-spacing:2px}
.sync-control{display:flex;align-items:center;gap:10px}.sync-control>span{color:var(--muted);font-size:12px}.sync-control .refresh{margin:0}.sync-control .refresh:disabled{opacity:.55;cursor:wait}
@media(max-width:600px){.sync-control>span{display:none}.section-heading{align-items:center;gap:12px}.sync-control .refresh{padding:8px 10px}}
