#gate{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:radial-gradient(ellipse at top,var(--bg2),var(--bg))}
body:not(.locked) #gate{display:none}
#gf{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:36px 34px;max-width:380px;width:100%;text-align:center;box-shadow:var(--shadow)}
#gf h1{font-family:var(--serif);font-size:2rem;margin:.2em 0}
#gf p{color:var(--muted)}
.gsprig{font-size:2.2rem;color:var(--gold)}
#gp{font:inherit;width:100%;box-sizing:border-box;padding:11px 16px;border-radius:999px;border:1px solid var(--line);background:var(--bg);color:var(--ink);margin:10px 0 14px}
#gb{min-width:140px}#gb[disabled]{opacity:.6;cursor:wait}
.gerr{color:var(--acc)!important;min-height:1.3em;font-weight:600}
.gnote{font-size:.8rem}
.shake{animation:sh .4s}@keyframes sh{20%,60%{transform:translateX(-7px)}40%,80%{transform:translateX(7px)}}
.lockbtn{width:auto!important;padding:0 12px!important;font-size:.85rem}
img[data-msrc]{background:var(--bg2)}
.xtree{height:min(78vh,860px)}
.xtree .xn text{pointer-events:auto}.xtree .xn a:hover text:first-child{text-decoration:underline}
.xtree .xn:hover rect.bx{filter:drop-shadow(0 3px 8px rgba(60,40,20,.18))}
.legend .lg.anc{background:var(--pat)}.legend .lg.sib{background:var(--gold)}.legend .lg.kin{background:var(--green)}
#xq{font:inherit;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--ink);min-width:180px}
@media(max-width:520px){#gf{padding:28px 22px;border-radius:14px}#gf h1{font-size:1.7rem}#gate{padding:16px;min-height:100svh}}