:root{--bg:#0e141b;--card:#17212b;--card2:#1e2a36;--tx:#e8eef4;--mut:#8da0b3;--ln:#2b3a48;--ok:#33c27f;--brain:#21d4c4;--bad:#ff5d6c;--pv:#f5b800}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
header.top{display:flex;align-items:center;gap:.6em;padding:.6em 1em;padding-top:max(.6em,env(safe-area-inset-top))}
header h1{font-size:1.25em;margin:0}.logo{color:var(--pv)}.sp{flex:1}
main{max-width:720px;margin:0 auto;padding:0 12px 24px}
.card{background:var(--card);border:1px solid var(--ln);border-radius:16px;padding:14px 16px;margin-bottom:12px}
.card h2{font-size:.95em;margin:0 0 .6em;color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4em;min-height:44px;padding:0 1em;border-radius:12px;border:1px solid var(--ln);background:var(--card2);color:var(--tx);font-size:1em;text-decoration:none;cursor:pointer}
.btn.pri{background:var(--brain);color:#042;border:0;font-weight:700}.btn.bad{color:var(--bad)}.btn.sm{min-height:36px;padding:0 .8em;font-size:.9em}
.btn.full{width:100%}
input,select{width:100%;min-height:44px;border-radius:12px;border:1px solid var(--ln);background:var(--card2);color:var(--tx);font-size:1em;padding:0 .8em;margin:.25em 0 .7em}
label{font-size:.9em;color:var(--mut)}
.mut{color:var(--mut)}.sm{font-size:.85em}.hide{display:none!important}.err{color:var(--bad);min-height:1.2em}
.dev{display:flex;align-items:center;gap:.7em;padding:.7em 0;border-bottom:1px solid var(--ln)}.dev:last-child{border:0}
.dev .nm{flex:1;min-width:0}.dev .nm b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dot{width:10px;height:10px;border-radius:50%;background:var(--mut);flex:none}.dot.on{background:var(--ok)}
.row{display:flex;gap:.5em;flex-wrap:wrap}.row>*{flex:1}
.tabs{display:flex;gap:.4em;margin-bottom:.8em}.tabs button{flex:1}.tabs .on{border-color:var(--brain);color:var(--brain)}
video{width:100%;border-radius:12px;background:#000;max-height:50vh;object-fit:cover}
.code{font:700 1.4em ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}
details summary{cursor:pointer;min-height:40px;display:flex;align-items:center;font-weight:600}
.kv{display:grid;grid-template-columns:1fr auto;gap:.3em .8em;font-size:.95em}
.sw{display:flex;align-items:center;justify-content:space-between;gap:1em;padding:.4em 0}
.sw input{width:auto;min-height:0;transform:scale(1.4)}
#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--card2);border:1px solid var(--brain);padding:.6em 1em;border-radius:12px;display:none;z-index:9}
.badge{font-size:.75em;padding:.15em .5em;border-radius:8px;background:var(--card2);border:1px solid var(--ln);color:var(--mut)}
