:root{--bg: #14161c;--panel: #1c1f28;--line: #2c313d;--text: #e7e9ee;--muted: #939ab0;--accent: #ffcb05;--good: #38b26b;--dupe: #d99a1e;--bad: #d0555a;--Normal: #9fa19f;--Fire: #e62829;--Water: #2980ef;--Electric: #fac000;--Grass: #3fa129;--Ice: #3dcef3;--Fighting: #ff8000;--Poison: #9141cb;--Ground: #915121;--Flying: #81b9ef;--Psychic: #ef4179;--Bug: #91a119;--Rock: #afa981;--Ghost: #704170;--Dragon: #5060e1;--Dark: #624d4e;--Steel: #60a1b8;--Fairy: #ef70ef;--cat-physical: #e0603f;--cat-special: #5b83e8;--cat-status: #98a0b4;--cat-bonus: #c77dd8}*{box-sizing:border-box}body{margin:0;padding:1.5rem;background:var(--bg);color:var(--text);font:15px/1.5 system-ui,Segoe UI,sans-serif}h1{font-size:1.6rem;margin:0 0 .4rem}h2{font-size:.95rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:1.4rem 0 .5rem}.muted{color:var(--muted)}.lede{color:var(--muted);margin:0 0 1.2rem}.error{color:var(--bad)}.screen{max-width:1100px;margin:0 auto}#screen-home,#screen-name,#screen-lobby{max-width:560px}button{background:var(--accent);color:#1a1a1a;border:0;border-radius:6px;padding:.55rem 1.1rem;font:inherit;font-weight:600;cursor:pointer}button:hover{filter:brightness(1.08)}button.danger{background:transparent;color:var(--bad);border:1px solid var(--bad)}button.secondary{background:transparent;color:var(--text);border:1px solid var(--line)}.actions{display:flex;gap:.6rem;margin-bottom:1rem}input[type=text]{background:var(--panel);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:.55rem .7rem;font:inherit;width:100%}input[type=text]:focus{outline:2px solid var(--accent);outline-offset:-1px}.check{display:block;margin:0 0 1rem;color:var(--text);cursor:pointer}.share{display:flex;gap:.5rem;margin-bottom:.5rem}#name-form{display:flex;gap:.5rem}.players{list-style:none;margin:0 0 1rem;padding:0}.players li{display:flex;justify-content:space-between;gap:1rem;padding:.3rem 0;border-bottom:1px solid var(--line)}.players li.offline{color:var(--muted)}.players li.offline .who:after{content:" (away)";font-size:.85em}.bar{display:flex;align-items:center;gap:1.5rem;flex-wrap:wrap;padding-bottom:.8rem;border-bottom:1px solid var(--line)}.bar .stat{display:flex;flex-direction:column}.bar .label{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.bar strong{font-size:1.4rem;font-variant-numeric:tabular-nums}.bar #pause-game{margin-left:auto}#clock.low{color:var(--bad)}#clock.paused{color:var(--dupe)}.progress-track{height:4px;background:var(--panel);border-radius:2px;margin-top:.5rem}.progress-fill{height:100%;width:0;background:var(--accent);border-radius:2px;transition:width .2s ease}#guess-form{margin:1rem 0 .2rem}#guess-input{font-size:1.15rem;padding:.7rem .8rem}.flash{min-height:1.4rem;margin:0 0 .8rem;font-size:.9rem;transition:opacity .5s ease}.flash.fading{opacity:0}.flash.correct{color:var(--good)}.flash.duplicate{color:var(--dupe)}.flash.wrong{color:var(--bad)}.play-wrap{position:relative}.play-layout{display:grid;grid-template-columns:1fr 280px;gap:1.5rem;align-items:start}@media(max-width:820px){.play-layout{grid-template-columns:1fr}}.board{display:flex;flex-direction:column;gap:.7rem}.type-block{border-left:3px solid var(--type, var(--line));padding-left:.5rem}.type-head{display:flex;justify-content:space-between;align-items:baseline;font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--type, var(--muted));margin-bottom:.25rem}.type-head .count{color:var(--muted);font-variant-numeric:tabular-nums}.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:2px}.slot{background:var(--panel);border-radius:3px;padding:.1rem .3rem;font-size:.7rem;line-height:1.35;min-height:1.25rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.slot.filled{background:color-mix(in srgb,var(--type) 24%,var(--panel));color:var(--text)}.slot.missed{color:var(--muted);text-decoration:line-through}.slot[class*=cat-]{border-left:6px solid var(--cat, var(--line));padding-left:.35rem}.cat-physical{--cat: var(--cat-physical)}.cat-special{--cat: var(--cat-special)}.cat-status{--cat: var(--cat-status)}.cat-bonus{--cat: var(--cat-bonus)}.legend{display:flex;flex-wrap:wrap;gap:1rem;list-style:none;margin:0 0 .9rem;padding:0;font-size:.75rem;color:var(--muted)}.legend li{display:flex;align-items:center;gap:.35rem}.legend li[hidden]{display:none}.swatch{width:14px;height:8px;border-radius:2px;background:var(--cat, var(--line))}.side h2:first-child{margin-top:0}.chat{list-style:none;margin:0;padding:.4rem .5rem;height:45vh;overflow-y:auto;font-size:.85rem;background:var(--panel);border:1px solid var(--line);border-radius:6px;overflow-wrap:anywhere;scrollbar-width:thin;scrollbar-color:var(--line) transparent}.chat::-webkit-scrollbar{width:8px}.chat::-webkit-scrollbar-track{background:transparent}.chat::-webkit-scrollbar-thumb{background:var(--line);border-radius:4px;border:2px solid var(--panel)}.chat:hover::-webkit-scrollbar-thumb{background:var(--muted)}.chat li{padding:.18rem 0}.chat .who{font-weight:600}.chat .verb,.chat .note{color:var(--muted)}.chat .mark{font-weight:700}.chat li.correct .mark{color:var(--good)}.chat li.duplicate .mark{color:var(--dupe)}.chat li.wrong .mark{color:var(--bad)}.chat li.wrong .what{text-decoration:line-through;color:var(--muted)}.chat li.achievement{color:var(--type, var(--accent));font-weight:600;padding:.3rem 0}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;text-align:center;background:color-mix(in srgb,var(--bg) 92%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:8px}.overlay[hidden]{display:none}.overlay-title{font-size:1.8rem;font-weight:700;margin:0 0 .3rem}.overlay button{margin-top:1rem}.headline strong{font-size:2.4rem}.breakdown{width:100%;border-collapse:collapse;margin-bottom:.5rem}.breakdown td{padding:.25rem .5rem .25rem 0;border-bottom:1px solid var(--line);vertical-align:middle}.breakdown td:first-child{width:8rem}.breakdown .num{text-align:right;width:6rem;font-variant-numeric:tabular-nums;color:var(--muted)}.breakdown .barcell{width:45%}.bar-track{background:var(--panel);border-radius:3px;height:8px}.bar-fill{background:var(--type, var(--accent));border-radius:3px;height:100%}.banner{position:fixed;left:0;right:0;bottom:0;margin:0;padding:.6rem 1rem;background:var(--bad);color:#fff;text-align:center}.footer{max-width:1100px;margin:2.5rem auto 0;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.78rem;text-align:center}.footer p{margin:.15rem 0}
