:root{
  --bg:#0a1020;
  --panel:#0f1a32;
  --panel2:#0b152b;
  --text:#e5e7eb;
  --muted:#a7b0c0;
  --accent:#22c55e;
  --accent2:#60a5fa;
  --border:rgba(229,231,235,.12);
}

html,body{height:100%}
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:radial-gradient(700px 320px at 12% 0%, rgba(34,197,94,.18), transparent 60%),
  radial-gradient(700px 320px at 85% 10%, rgba(96,165,250,.16), transparent 60%), var(--bg);
  color:var(--text)}
a{color:inherit}
.container{max-width:1160px;margin:0 auto;padding:0 16px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.topbar{position:sticky;top:0;z-index:10;background:rgba(15,26,50,.86);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--border)}
.row{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:12px 0}
#logo img{display:block;height:34px;width:auto}
.menu-toggle,.drawer-close{appearance:none;border:1px solid var(--border);background:rgba(15,26,50,.92);color:var(--text);border-radius:12px;padding:10px 12px;font-weight:800;cursor:pointer}
.top-ads{min-width:180px;max-width:420px}

.panes{max-width:1160px;margin:0 auto;padding:16px;display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px}
.panel{background:var(--panel);border:1px solid var(--border);border-radius:18px;padding:16px;box-shadow:0 14px 44px rgba(0,0,0,.35)}
.panel.alt{background:linear-gradient(180deg, rgba(34,197,94,.10), rgba(96,165,250,.08)), var(--panel2)}
.mini-title{font-weight:900;margin-bottom:10px}
.slot{border:1px dashed rgba(229,231,235,.22);border-radius:16px;padding:10px;background:rgba(15,26,50,.55)}

.drawer{position:fixed;inset:0;z-index:30}
.drawer[hidden]{display:none}
.drawer-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.drawer-inner{position:absolute;right:10px;top:10px;bottom:10px;width:min(360px, calc(100% - 20px));
  background:rgba(15,26,50,.92);border:1px solid var(--border);border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.55);
  padding:14px;display:flex;flex-direction:column;gap:12px}
.drawer-head{display:flex;align-items:center;justify-content:space-between}
.drawer-title{font-weight:900}
.drawer-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.drawer-list a{display:block;padding:10px 10px;border-radius:12px;text-decoration:none}
.drawer-list li.active a{background:rgba(34,197,94,.18);font-weight:900}
.drawer-note{color:var(--muted);font-size:14px}

#footer{border-top:1px solid var(--border);padding:16px 0;background:rgba(11,21,43,.88)}
#footer .social{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
#footer .social a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:12px;border:1px solid var(--border);background:rgba(15,26,50,.92)}
#footer p{margin:0;color:var(--muted)}

@media (max-width: 980px){
  .panes{grid-template-columns:1fr}
  .top-ads{display:none}
}