:root{--ink:#000;--paper:#fff;--g1:#f2f2f2;--g2:#d6d6d6;--g3:#8a8a8a;--g4:#3a3a3a;
 --halftone:radial-gradient(circle,#000 1.1px,transparent 1.3px) 0 0/7px 7px;--hatch:repeating-linear-gradient(45deg,#000 0 1.5px,transparent 1.5px 6px)}
*{box-sizing:border-box}
body{margin:0;font-family:'Space Mono',ui-monospace,monospace;font-size:15px;line-height:1.5;color:var(--ink);background:var(--g1);background-image:radial-gradient(circle,#0000001f 1px,transparent 1.3px);background-size:9px 9px}
header,main,footer{max-width:1040px;margin:auto;padding:16px}
h1,h2,h3,h4{font-family:Anton,Impact,'Arial Narrow',sans-serif;font-weight:400;letter-spacing:.03em;text-transform:uppercase;margin:.3em 0}
h1{font-size:clamp(44px,8vw,84px);line-height:.95;-webkit-text-stroke:0;text-shadow:4px 4px 0 var(--g2)}
h2{font-size:28px;display:inline-block;background:var(--ink);color:var(--paper);padding:0 10px;transform:rotate(-1deg)}
h3{font-size:20px;border-bottom:3px solid var(--ink)}
a{color:var(--ink);font-weight:700;text-decoration-thickness:2px}
section{background:var(--paper);border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:16px;margin:20px 0}
.row{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
input{flex:1;min-width:180px;padding:10px;border:3px solid var(--ink);background:var(--paper);color:var(--ink);font:inherit}
input:focus,button:focus-visible{outline:3px dashed var(--ink);outline-offset:3px}
button{padding:9px 14px;border:3px solid var(--ink);background:var(--ink);color:var(--paper);font-family:Anton,Impact,sans-serif;font-size:16px;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;box-shadow:3px 3px 0 var(--g3)}
button:hover{background:var(--paper);color:var(--ink)}button:active{transform:translate(2px,2px);box-shadow:none}
button:disabled{background:var(--g2);color:var(--g4);border-style:dashed;box-shadow:none;cursor:not-allowed}
.chips button{background:var(--paper);color:var(--ink)}.chips button:hover{background:var(--ink);color:var(--paper)}
.msg{font-weight:700;border-left:6px solid var(--ink);padding-left:8px}.small{font-size:.85em;color:var(--g4)}
.warn{display:inline-block;background:var(--ink);color:var(--paper);padding:6px 12px;font-weight:700;border:3px double var(--paper);outline:3px solid var(--ink)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px}
.card{background:var(--paper);border:3px solid var(--ink);padding:6px;text-align:center;cursor:pointer;font-weight:700}
.card:hover{box-shadow:5px 5px 0 var(--ink);transform:translate(-2px,-2px)}
.card img{width:100%;image-rendering:pixelated;border:2px solid var(--ink);display:block;background:#fff}
.agentwrap{display:grid;grid-template-columns:280px 1fr;gap:16px}@media(max-width:720px){.agentwrap{grid-template-columns:1fr}}
.stage{position:relative;text-align:center;padding:10px;background:var(--halftone),var(--paper)}
.stage img,.stage video{width:250px;max-width:100%;image-rendering:pixelated;border:4px solid var(--ink);background:#fff;animation:bob 2.4s ease-in-out infinite}
.stage img.talk{animation:talk .25s ease-in-out 6}
@keyframes bob{50%{transform:translateY(-8px) rotate(1deg)}}@keyframes talk{50%{transform:scale(1.04,.97)}}
@media (prefers-reduced-motion:reduce){.stage img,.stage video,.stage img.talk{animation:none}}
.bubble{position:relative;background:var(--paper);border:3px solid var(--ink);border-radius:16px;padding:8px 10px;margin-top:14px;min-height:2.2em;font-size:.88em;text-align:left}
.bubble:before{content:"";position:absolute;top:-14px;left:40px;border:12px solid transparent;border-bottom-color:var(--ink);border-top:0}
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px}
.stat{border:2px solid var(--ink);background:var(--paper);padding:6px;font-size:.75em;text-transform:uppercase;letter-spacing:.05em}
.stat b{display:block;font-family:Anton,Impact,sans-serif;font-weight:400;font-size:1.5em;text-transform:none;letter-spacing:0;color:var(--ink)}
.chat{height:260px;overflow:auto;background:var(--paper);border:3px solid var(--ink);padding:10px;margin-top:10px;font-size:.9em;white-space:pre-wrap}
.chat .me{font-weight:700;border-left:4px solid var(--ink);padding-left:6px;margin:6px 0}.chat .bot{margin-bottom:8px}
/* tiers: patterns + frames, no colour */
.badge{display:inline-block;padding:1px 7px;border:2px solid var(--ink);font-family:Anton,Impact,sans-serif;font-weight:400;font-size:.95em;letter-spacing:.05em;background:var(--paper);color:var(--ink)}
.badge.Common{border-style:dashed}
.badge.Rare{background:var(--paper) linear-gradient(var(--paper),var(--paper)) padding-box;box-shadow:inset 0 -5px 0 var(--g2)}
.badge.Epic{background:var(--hatch),var(--paper);color:var(--ink);text-shadow:0 0 3px #fff,0 0 3px #fff,0 0 3px #fff;border-width:3px}
.badge.Legendary{background:var(--ink);color:var(--paper);border:4px double var(--paper);outline:2px solid var(--ink)}
.badge.Rune{background:var(--paper);border-style:dotted;font-size:.75em}
body[data-tier=Epic] .stage img,body[data-tier=Epic] .stage video{border:6px solid var(--ink);box-shadow:8px 8px 0 -2px var(--paper),8px 8px 0 0 var(--ink)}
body[data-tier=Legendary] .stage{background:radial-gradient(circle,#000 1.6px,transparent 1.9px) 0 0/8px 8px,var(--paper)}
body[data-tier=Legendary] .stage img,body[data-tier=Legendary] .stage video{border:10px double var(--ink);outline:4px solid var(--paper);box-shadow:0 0 0 8px var(--ink),0 0 0 14px var(--paper),0 0 0 16px var(--ink)}
body[data-tier=Legendary] .stage:after{content:"★";position:absolute;top:-6px;right:6px;font-size:44px;line-height:1;color:var(--paper);-webkit-text-stroke:3px var(--ink);text-shadow:3px 3px 0 var(--ink)}
/* alerts */
.alert{border:2px solid var(--ink);padding:6px 8px;margin:6px 0;background:var(--paper)}
.alert.rogue{background:var(--ink);color:var(--paper);font-weight:700;border:3px double var(--paper);outline:2px solid var(--ink)}
li{font-size:.9em}
.locked{opacity:.55;background-image:var(--hatch);background-color:var(--g1);background-blend-mode:normal;padding:4px;filter:grayscale(1)}
.locked input,.locked button{opacity:.8}
.need{font-family:'Space Mono',monospace;font-size:.6em;background:var(--ink);color:var(--paper);padding:2px 6px;vertical-align:middle;letter-spacing:0}
table{border-collapse:collapse;width:100%;font-size:.88em;background:var(--paper)}th,td{border:2px solid var(--ink);padding:6px;text-align:center}th{text-align:left;font-weight:400}
td.no{color:var(--g3);background:repeating-linear-gradient(45deg,var(--g1) 0 4px,var(--paper) 4px 8px)}
td.you{background:var(--ink);color:var(--paper);font-weight:700}
.meter{height:18px;border:3px solid var(--ink);background:var(--paper);overflow:hidden}.meter div{height:100%;background:var(--hatch),var(--g4)}
footer{text-align:center;font-weight:700}
.sov{border:4px double var(--ink);background:var(--paper);padding:10px 12px;font-weight:700;box-shadow:4px 4px 0 var(--ink)}
.vbadge{display:inline-block;background:var(--ink);color:var(--paper);border:3px double var(--paper);outline:2px solid var(--ink);padding:3px 10px;font-family:Anton,Impact,sans-serif;letter-spacing:.06em}
.steps li{margin:6px 0}.post{border:2px solid var(--ink);padding:8px;margin:8px 0;background:var(--paper)}.post .kind{background:var(--ink);color:var(--paper);padding:0 6px;font-family:Anton,Impact,sans-serif}
.reply{margin-left:16px;border-left:3px solid var(--ink);padding-left:6px;margin-top:4px}select{border:3px solid var(--ink);background:var(--paper);font:inherit;padding:8px}
.testing{background:#000;color:#fff;text-align:center;font-weight:700;padding:8px;border-bottom:4px double #fff;font-family:"Space Mono",monospace}
.btnlink{display:inline-block;padding:9px 14px;border:3px solid #000;background:#000;color:#fff;font-family:Anton,Impact,sans-serif;text-transform:uppercase;text-decoration:none;box-shadow:3px 3px 0 #8a8a8a}.btnlink:hover{background:#fff;color:#000}
.chart{display:flex;gap:3px;align-items:flex-end;height:140px;border:3px solid #000;padding:6px;background:#fff}.bar{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.bar span{display:block;width:100%;background:repeating-linear-gradient(45deg,#000 0 2px,#fff 2px 5px);border:2px solid #000;min-height:2px}.bar i{font-style:normal;font-size:10px}
.gamebox{border:4px solid #000;box-shadow:6px 6px 0 #000;background:#fff;touch-action:manipulation}#gcv{display:block;width:100%;height:auto;image-rendering:pixelated;cursor:pointer}.lb{list-style:none;padding:0}.lb li{display:flex;gap:10px;align-items:center;border-bottom:2px solid #000;padding:4px 0}.lb img{border:2px solid #000;image-rendering:pixelated;background:#fff}