:root{--bg:#0f1115;--card:#181b22;--line:#2a2f3a;--txt:#e9e9ee;--mut:#9aa0ad;--acc:#ff7a1a;--acc2:#ffb066;--ok:#2fbf71;--bad:#ff5a5a}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--txt);font:16px/1.55 -apple-system,Segoe UI,Roboto,Arial,sans-serif}
a{color:var(--acc2)}
main{max-width:1100px;margin:0 auto;padding:24px 20px 60px}
h1{font-size:34px;line-height:1.2;margin:.4em 0}
h2{margin-top:2em}
.top{display:flex;align-items:center;gap:20px;padding:14px 20px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.logo{font-weight:800;font-size:22px;color:var(--txt);text-decoration:none}.logo span{color:var(--acc)}.logo small{font-weight:400;color:var(--mut);font-size:14px}
.top nav{display:flex;gap:16px;flex-wrap:wrap;flex:1}.top nav a{color:var(--mut);text-decoration:none}.top nav a.on,.top nav a:hover{color:var(--txt)}
.acts{display:flex;gap:10px;align-items:center;margin-left:auto}.acts form{margin:0}
.btn{display:inline-block;background:var(--acc);color:#111;border:0;border-radius:10px;padding:9px 16px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn.ghost{background:transparent;color:var(--txt);border:1px solid var(--line)}.btn.big{padding:13px 22px;font-size:17px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.hero{display:grid;grid-template-columns:1.3fr 1fr;gap:30px;align-items:center;padding:30px 0}
.kicker{color:var(--acc);letter-spacing:.12em;font-size:13px;font-weight:700}.lead{font-size:19px;color:#cfd2da}
.tree{position:relative;height:280px}
.tree .n{position:absolute;width:62px;height:62px;border-radius:50%;border:2px solid var(--acc);background:radial-gradient(circle at 35% 35%,#3a2a1c,#1a1410)}
.tree .n0{left:44%;top:0}.tree .n1{left:20%;top:100px}.tree .n2{left:68%;top:100px}.tree .n3{left:6%;top:205px}.tree .n4{left:32%;top:205px}.tree .n5{left:56%;top:205px}.tree .n6{left:82%;top:205px}
.tree:before{content:"";position:absolute;inset:30px 10% 40px;border:1px dashed #6b4a2a;border-bottom:0;border-radius:40px 40px 0 0}
.ticks{display:flex;flex-wrap:wrap;gap:10px 26px;padding:0;list-style:none}.ticks li:before{content:"● ";color:var(--acc)}
.cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.cards.three{grid-template-columns:repeat(3,1fr)}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px}.card h3{margin:.2em 0 .4em}
.card>b:first-child{color:var(--acc);font-size:26px}
.principle,.note{margin:26px 0;padding:16px 18px;border-left:4px solid var(--acc);background:#1d1812;border-radius:8px}
.note{border-color:var(--acc2);background:var(--card)}
.muted{color:var(--mut)}.small{font-size:13px}
table{width:100%;border-collapse:collapse;font-size:15px}th,td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--mut);font-weight:500}.num{text-align:right;white-space:nowrap}.scroll{overflow-x:auto}
tr.held td{color:var(--mut)}tr.neg .num{color:var(--bad)}tr.on td{background:#1d1812}
.steps li{margin:10px 0}
footer{border-top:1px solid var(--line);padding:24px 20px;color:var(--mut);font-size:14px;display:grid;gap:6px;max-width:1100px;margin:0 auto}
.tabs{display:flex;gap:4px;overflow-x:auto;padding:0 16px;border-bottom:1px solid var(--line)}
.tabs a{padding:12px 14px;color:var(--mut);text-decoration:none;white-space:nowrap;border-bottom:2px solid transparent}.tabs a.on{color:var(--txt);border-color:var(--acc)}
.auth{max-width:420px;margin:30px auto}.auth form,.admin{display:grid;gap:12px}
label{display:grid;gap:4px;color:var(--mut);font-size:14px}label.check{display:flex;gap:8px;align-items:flex-start}
input,select,textarea{background:#0b0d11;color:var(--txt);border:1px solid var(--line);border-radius:8px;padding:10px;font:inherit}
textarea{width:100%;font:13px/1.4 ui-monospace,monospace}
.admin.inline{display:flex;flex-wrap:wrap;gap:8px}.fields{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.demo{margin-top:30px;padding-top:20px;border-top:1px solid var(--line);display:grid;gap:6px}
.err,.bad{background:#2a1214;border:1px solid #5a2228;color:#ffb3b3;padding:12px 14px;border-radius:10px;margin:14px 0}
.ok{background:#11251a;border:1px solid #1f5a39;color:#a8ecc5;padding:12px 14px;border-radius:10px;margin:14px 0}
.flash{background:var(--card);padding:12px;border-radius:10px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid .card{display:grid;gap:8px;align-content:start}
.big{font-size:30px;font-weight:700}.legs{display:flex;gap:20px;font-size:18px}.legs b{color:var(--acc2)}
.bar{height:8px;background:#0b0d11;border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:var(--acc)}
.link{width:100%;margin-bottom:10px}
.tree-view{overflow-x:auto;padding:10px 0}
.sub{display:flex;flex-direction:column;align-items:center;min-width:150px}.kids{display:flex;gap:10px;margin-top:14px;padding-top:14px;border-top:1px dashed #6b4a2a}
.node{display:grid;justify-items:center;gap:2px;padding:10px;border-radius:12px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--txt);font-size:13px;min-width:130px;text-align:center}
.node.me{border-color:var(--acc)}.node.sleep{opacity:.6}.node.empty{color:var(--mut);border-style:dashed;min-height:60px;align-content:center}
.av{width:40px;height:40px;border-radius:50%;border:2px solid var(--acc);display:grid;place-items:center;font-weight:700;background:#1d1812}
details summary{cursor:pointer;color:var(--acc2)}
@media (max-width:760px){.hero,.cards,.cards.three,.grid,.fields{grid-template-columns:1fr}.tree{display:none}h1{font-size:27px}.top nav{order:3;width:100%}}