.menu-button{width:40px;height:40px;border:1px solid var(--line);background:var(--panel);display:grid;place-content:center;gap:4px;cursor:pointer}.menu-button span{width:17px;height:2px;background:var(--text);display:block}
.character-menu{position:fixed;left:0;top:0;bottom:0;width:min(390px,92vw);background:#101212;z-index:40;border-right:1px solid var(--line);box-shadow:20px 0 70px #000b;transform:translateX(-105%);transition:.22s;padding:25px;overflow:auto}.character-menu.open{transform:translateX(0)}.menu-backdrop{position:fixed;inset:0;background:#0009;z-index:39;opacity:0;pointer-events:none;transition:.2s}.menu-backdrop.open{opacity:1;pointer-events:auto}
.menu-head{display:flex;justify-content:space-between;align-items:start;margin-bottom:20px}.menu-head h2{margin:0}.menu-head button{width:34px;height:34px;background:transparent;border:1px solid var(--line);color:var(--text);cursor:pointer}
.menu-search input{width:100%;background:#090b0b;border:1px solid var(--line);color:var(--text);padding:11px;margin-bottom:15px}
.character-list{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.character-item{border:1px solid var(--line);background:var(--panel);color:var(--text);padding:13px;text-align:left;cursor:pointer;position:relative}.character-item:hover,.character-item.active{border-color:var(--lime)}.character-item.active{background:#202718}.character-item strong,.character-item span{display:block}.character-item strong{font-size:13px}.character-item span{font-size:8px;color:var(--muted);margin-top:4px;letter-spacing:.1em}.character-item i{position:absolute;right:9px;top:9px;background:#272d2b;color:var(--muted);font-style:normal;font-size:8px;padding:3px 5px}.character-item.active i{background:var(--lime);color:#111}
@media(max-width:600px){.topbar{gap:7px}.menu-button{width:36px;height:36px}.topbar nav{margin-left:auto}.nav-link{font-size:11px}}