
:root{--bg:#1b1430;--ink:#fff8ee;--muted:#d9cfe8;--card:#2a2046;--edge:#ffffff22;--red:#e8483a;--blue:#3a7bdc;--yel:#f7c637;--grn:#3fae4a;--pink:#ff7eb6}
*{box-sizing:border-box}body{margin:0;font:17px/1.6 "Trebuchet MS","Segoe UI",system-ui,sans-serif;color:var(--ink);background:radial-gradient(circle at 20% 0,#3b2a66,transparent 60%),radial-gradient(circle at 90% 30%,#1f4a3a,transparent 50%),var(--bg);min-height:100vh}
a{color:var(--yel)}a:hover{color:#fff}img{max-width:100%;height:auto;display:block}
header{position:sticky;top:0;z-index:5;background:#1b1430ee;backdrop-filter:blur(6px);border-bottom:3px solid #000}
nav{max-width:1100px;margin:auto;display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:8px 14px}
nav a{color:var(--ink);text-decoration:none;font-weight:700;padding:6px 12px;border-radius:999px;border:2px solid transparent}
nav a:hover,nav a[aria-current]{background:var(--card);border-color:#000;box-shadow:2px 3px 0 #000}
nav .logo{font-size:1.25rem;letter-spacing:1px;margin-right:auto}nav .logo span:nth-child(4n+1){color:var(--red)}nav .logo span:nth-child(4n+2){color:var(--blue)}nav .logo span:nth-child(4n+3){color:var(--yel)}nav .logo span:nth-child(4n){color:var(--grn)}
main{max-width:1100px;margin:auto;padding:18px 16px 40px}
h1,h2,h3{line-height:1.2;text-shadow:2px 3px 0 #000}h1{font-size:clamp(1.8rem,5vw,2.8rem)}
.blob{background:var(--card);border:3px solid #000;border-radius:22px 28px 20px 26px;box-shadow:4px 6px 0 #000;padding:16px 18px}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.btn{display:inline-block;margin:6px 8px 6px 0;padding:10px 18px;border-radius:16px 20px 14px 18px;border:3px solid #000;box-shadow:3px 4px 0 #000;font-weight:800;color:#000;text-decoration:none;background:var(--yel)}
.btn.b{background:var(--blue);color:#fff}.btn.g{background:var(--grn);color:#fff}.btn.r{background:var(--red);color:#fff}.btn:hover{transform:translate(-1px,-1px);color:#000}
.hero{display:grid;gap:18px;align-items:center;grid-template-columns:1.2fr 1fr}@media(max-width:800px){.hero{grid-template-columns:1fr}}
figure{margin:0}figure img{border:3px solid #000;border-radius:16px;box-shadow:4px 6px 0 #000}figcaption{font-size:.9rem;color:var(--muted);margin-top:8px}
.tag{display:inline-block;font-size:.75rem;font-weight:800;padding:2px 8px;border-radius:8px;border:2px solid #000;background:var(--pink);color:#000;margin-right:6px}.tag.real{background:var(--grn);color:#fff}
table{width:100%;border-collapse:collapse;font-size:.95rem}th,td{padding:6px 8px;border-bottom:1px solid var(--edge);text-align:left;vertical-align:top}th{color:var(--yel)}
.tw{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}.tw table{min-width:520px}.grid>*{min-width:0}html,body{overflow-x:clip}@media(max-width:600px){th,td{padding:5px 6px;font-size:.88rem}.blob{padding:12px}}.dim{color:var(--muted)}details{margin:12px 0}summary{cursor:pointer;font-weight:800;font-size:1.1rem}
kbd{background:#000;border-radius:6px;padding:1px 7px;font-size:.9em;border:1px solid #555}
footer{text-align:center;color:var(--muted);padding:24px 12px;border-top:3px solid #000;font-size:.9rem}
.toc a{display:inline-block;margin:3px 8px 3px 0}
