.scoundrel{--card-w: clamp(70px, 21vw, 110px)}.scoundrel-status{display:grid;grid-template-columns:1.2fr 1.4fr .8fr;gap:8px;margin:8px 0 16px}.scoundrel-status>div{display:grid;align-content:start;gap:2px;padding:10px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);min-width:0}.scoundrel-label{font-size:.75rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.scoundrel-status strong{font-size:1.15rem;overflow-wrap:anywhere}.scoundrel-meter{height:6px;margin-top:4px;background:var(--surface-2);border-radius:3px;overflow:hidden}.scoundrel-meter-fill{display:block;height:100%;transition:width .25s}.scoundrel-meter-fill.level-4{background:var(--hit)}.scoundrel-meter-fill.level-3{background:var(--near)}.scoundrel-meter-fill.level-2,.scoundrel-meter-fill.level-1{background:var(--boom)}.scoundrel-room{display:grid;grid-template-columns:repeat(4,var(--card-w));gap:8px;justify-content:center}.scoundrel-slot{padding:0;border:2px solid transparent;border-radius:10px;background:none;color:inherit;font:inherit;cursor:pointer;transition:transform .12s}.scoundrel-slot.selected{border-color:var(--accent);transform:translateY(-6px)}.scoundrel-slot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.scoundrel-card{position:relative;display:grid;place-items:center;aspect-ratio:5 / 7;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--black-suit);font-weight:700}.scoundrel-card.suit-D,.scoundrel-card.suit-H{color:var(--red-suit)}.scoundrel-card-corner{position:absolute;top:6px;left:7px;display:grid;justify-items:center;line-height:1;font-size:clamp(.95rem,4vw,1.2rem)}.scoundrel-card-corner.bottom{inset:auto 7px 6px auto;transform:rotate(180deg)}.scoundrel-card-pip{font-size:clamp(2rem,10vw,3rem);line-height:1}.scoundrel-log{max-width:520px;margin:20px auto 0;padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.scoundrel-log summary{cursor:pointer;font-weight:600}.log-summary{display:grid;gap:8px;margin:12px 0}.log-summary dt{font-size:.8rem;color:var(--muted)}.log-summary dd{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 0}.log-chip{padding:1px 6px;border:1px solid var(--border);border-radius:4px;font-weight:700;font-size:.85rem;color:var(--black-suit)}.log-chip.suit-D,.log-chip.suit-H{color:var(--red-suit)}.log-rooms{display:grid;gap:8px;margin:0;padding:0;list-style:none;font-size:.9rem}.log-rooms ul{margin:2px 0 0;padding-left:18px}.scoundrel-progress{margin:12px 0 0;text-align:center}.scoundrel-actions{display:grid;gap:8px;max-width:420px;margin:12px auto 0;text-align:center}.scoundrel-actions p{margin:0}.scoundrel-message{max-width:420px;margin:12px auto 0;text-align:center;color:var(--text)}.log-empty{margin:10px 0 2px;font-style:italic}.scoundrel-weapon .suit-D,.scoundrel-weapon .suit-H{color:var(--red-suit)}.explodingo{--km-key: var(--surface-2);--km-key-text: var(--text);--km-correct: var(--hit);--km-present: var(--near);--km-absent: var(--miss);--km-filled-text: #ffffff;--km-present-text: var(--near-text);--km-mine: var(--boom);--key-step: min(calc((100vw - 32px) / 10.5), 52px)}:root:not([data-theme=dark]) .explodingo{--km-key-edge: var(--border)}.status-bar{display:flex;align-items:center;gap:12px;margin-bottom:10px}.status-bar .muted{flex:1;text-align:right}.lives{font-size:1.4rem;color:#d83a4a}.life.lost{opacity:.2}.flag-toggle.active{background:var(--surface-2)}.km-board{display:grid;gap:6px;justify-content:center}.km-row{display:grid;grid-template-columns:40px repeat(var(--cols),clamp(40px,13vw,56px)) 40px;gap:6px;align-items:center}.km-row:before{content:""}.km-tile{display:grid;place-items:center;aspect-ratio:1;border:2px solid var(--border);border-radius:6px;font-size:1.5rem;font-weight:700}.km-tile.typed{border-color:var(--muted)}.km-row.current .km-tile{padding:0;font:inherit;font-size:1.5rem;font-weight:700;background:transparent;color:var(--text);cursor:pointer}.km-tile.cursor{border-color:var(--text);border-width:3px}.km-correct,.km-present,.km-absent{border-color:transparent;color:var(--km-filled-text)}.km-correct{background:var(--km-correct)}.km-present{background:var(--km-present);color:var(--km-present-text)}.km-absent{background:var(--km-absent)}.km-boom{border-color:transparent;background:var(--km-mine);color:var(--boom-text)}.km-tile.flip{animation:km-flip .3s ease-in-out backwards}@keyframes km-flip{0%{transform:rotateX(0);background:transparent;border-color:var(--muted);color:var(--text)}50%{transform:rotateX(90deg);background:transparent;border-color:var(--muted);color:var(--text)}to{transform:rotateX(0)}}@media(prefers-reduced-motion:reduce){.km-tile.flip{animation:none}}.km-row-note{font-size:.75rem;color:var(--muted)}.explodingo .message{min-height:1.4em}.km-keyboard{display:grid;gap:6px;width:calc(10.5 * var(--key-step));margin:8px auto 0}.km-key-row{display:flex}.km-key{position:relative;display:grid;place-items:center;width:calc(var(--key-step) - 5px);height:calc(var(--key-step) * 1.25);margin-right:5px;padding:0;font:inherit;padding-top:calc(var(--key-step) * .14);font-size:max(13px,calc(var(--key-step) * .36));font-weight:700;background:var(--km-key);color:var(--km-key-text);border:0;box-shadow:inset 0 0 0 1px var(--km-key-edge, transparent);border-radius:6px;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.km-key-correct{background:var(--km-correct);color:var(--km-filled-text)}.km-key-present{background:var(--km-present);color:var(--km-present-text)}.km-key-absent{background:var(--km-absent);color:var(--km-filled-text)}.km-key-mine{background:var(--km-mine);color:var(--boom-text)}.km-key-correct,.km-key-present,.km-key-absent,.km-key-mine{--km-key-edge: transparent}.km-action{padding-top:0;font-size:calc(var(--key-step) * .42)}.km-enter{width:calc(var(--key-step) * 1.5 - 5px)}.km-corner{position:absolute;--chip: clamp(12px, calc(var(--key-step) * .34), 17px);top:2px;right:2px;min-width:var(--chip);height:var(--chip);padding:0 2px;border-radius:calc(var(--chip) / 2);background:#ffffffeb;color:#1a1a1b;font-size:calc(var(--chip) * .7);font-weight:800;line-height:var(--chip);text-align:center;box-shadow:0 0 0 1px #00000026}.km-corner.safe{color:#2e7d32}.km-key.flagged{outline:2px dashed var(--km-mine);outline-offset:-2px;cursor:not-allowed}.km-key.flagged .km-key-letter{opacity:.35}.km-flag{position:absolute;top:1px;left:2px;font-size:clamp(9px,calc(var(--key-step) * .26),13px)}.km-key.focus{box-shadow:0 0 0 3px var(--text);z-index:1}.km-key.neighbour{box-shadow:0 0 0 3px var(--accent);z-index:1}.km-keyboard.over .km-key{cursor:default}.km-diagram{--key-step: min(calc((100vw - 80px) / 10.5), 40px);margin:8px 0 20px}.km-diagram .km-key{cursor:default}.explodingo.shake{animation:shake .45s cubic-bezier(.36,.07,.19,.97)}@keyframes shake{10%,90%{transform:translate(-2px,1px)}20%,80%{transform:translate(4px,-2px) rotate(.4deg)}30%,50%,70%{transform:translate(-7px,2px) rotate(-.6deg)}40%,60%{transform:translate(7px,-1px) rotate(.6deg)}}.blast-flash{position:fixed;inset:0;z-index:10;pointer-events:none;background:radial-gradient(ellipse at center,transparent 35%,var(--boom) 140%);animation:blast-flash .7s ease-out forwards}@keyframes blast-flash{0%{opacity:0}15%{opacity:.9}to{opacity:0}}@media(prefers-reduced-motion:reduce){.blast-flash{animation-duration:.9s}}.km-legend{display:grid;gap:6px;margin:8px 0 4px}.km-legend-row{display:flex;align-items:center;gap:10px}.km-legend .km-tile{width:32px;font-size:1rem}.showdown{--t-exact: var(--hit);--t-rank: var(--near);--t-suit: var(--suit);--t-none: var(--miss);--t-exact-text: var(--hit-text);--t-rank-text: var(--near-text);--t-suit-text: var(--suit-text);--t-none-text: var(--miss-text);--t-empty: var(--surface-2);--tile: clamp(40px, 12vw, 58px)}.card-face{display:inline-flex;align-items:baseline;gap:1px;font-weight:700;line-height:1}.card-rank{font-size:1.05em}.card-suit{font-size:1.1em}.suit-0 .card-suit,.suit-3 .card-suit{color:var(--black-suit)}.suit-1 .card-suit,.suit-2 .card-suit{color:var(--red-suit)}.board{display:grid;gap:6px;justify-content:center}.board-row{display:grid;grid-template-columns:repeat(5,var(--tile)) minmax(84px,auto);gap:6px;align-items:center}.board.no-hint .board-row,.example .board-row:not(:has(.hint)){grid-template-columns:repeat(5,var(--tile))}.board.no-hint .hint{display:none}.tile{position:relative;display:grid;place-items:center;width:var(--tile);height:var(--tile);border-radius:6px;font-size:calc(var(--tile) * .36);background:var(--t-empty);color:var(--text)}.tile:not(.tile-empty) .card-suit,.pick-card.colored .card-suit{margin-left:2px;padding:0 2px;border-radius:4px;background:#fff;line-height:1.2}.tile .suit-0 .card-suit,.tile .suit-3 .card-suit,.pick-card.colored .suit-0 .card-suit,.pick-card.colored .suit-3 .card-suit{color:#1c1c1e}.tile .suit-1 .card-suit,.tile .suit-2 .card-suit,.pick-card.colored .suit-1 .card-suit,.pick-card.colored .suit-2 .card-suit{color:#c0262d}.tile-empty{border:2px solid var(--border);background:transparent}.tile-exact{background:var(--t-exact);color:var(--t-exact-text)}.tile-rank{background:var(--t-rank);color:var(--t-rank-text)}.tile-suit{background:var(--t-suit);color:var(--t-suit-text)}.tile-none{background:var(--t-none);color:var(--t-none-text)}.tile-answer{background:var(--surface);border:2px solid var(--border)}.mark{position:absolute;top:2px;right:3px;font-size:.62rem;font-weight:800;line-height:1}.pick-card{position:relative}.tile.flip{animation:flip .3s ease-in-out backwards}.tile.flip .mark{animation:mark-in .3s step-end backwards}@keyframes mark-in{0%{opacity:0}50%{opacity:1}}@keyframes flip{0%{transform:rotateX(0);background:var(--t-empty);color:var(--text)}50%{transform:rotateX(90deg);background:var(--t-empty);color:var(--text)}to{transform:rotateX(0)}}.fade-in{animation:fade-in .2s ease-out backwards}@keyframes fade-in{0%{opacity:0}}@media(prefers-reduced-motion:reduce){.tile.flip,.tile.flip .mark,.fade-in{animation:none}}.hint{display:flex;align-items:center;gap:6px;font-size:.85rem;font-weight:600}.hint-icon{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font-size:1rem;border:2px solid currentColor}.hint-same{color:var(--text)}.hint-different{color:var(--muted)}.tray{margin:16px 0 12px;padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:12px}.tile-picked{padding:0;font:inherit;font-size:calc(var(--tile) * .36);font-weight:700;border-color:var(--muted);cursor:pointer}.tray-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}.tray-label{font-weight:600}.tray-label.invalid{color:var(--error)}.tray-actions{display:flex;gap:8px}.pick-card,.rank-button{min-width:44px;min-height:44px;padding:0;font:inherit;font-weight:700;background:var(--surface-2);color:var(--text);border:0;box-shadow:inset 0 0 0 1px var(--key-edge, transparent);border-radius:6px;cursor:pointer;touch-action:manipulation}:root:not([data-theme=dark]) .showdown{--key-edge: var(--border)}.pick-card.tile-exact{background:var(--t-exact);color:var(--t-exact-text)}.pick-card.tile-rank{background:var(--t-rank);color:var(--t-rank-text)}.pick-card.tile-suit{background:var(--t-suit);color:var(--t-suit-text)}.pick-card.tile-none{background:var(--t-none);color:var(--t-none-text)}.pick-card.colored{border-color:transparent}.pick-card.selected,.rank-button.active{outline:3px solid var(--text);outline-offset:-3px;background:var(--surface-2)}.pick-card:disabled,.rank-button:disabled{opacity:.35;cursor:default}.pick-card.selected:disabled{opacity:1}.picker-grid{display:grid;gap:4px}.picker-row{display:grid;grid-template-columns:repeat(13,minmax(44px,1fr));gap:4px}.picker-steps{display:none}.rank-buttons{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.rank-button{font-weight:700}.rank-button.has-pick{box-shadow:inset 0 -4px 0 var(--accent)}.suit-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px;min-height:52px}.suit-buttons p{grid-column:1 / -1;margin:auto}.suit-buttons .pick-card{min-height:52px;font-size:1.2rem}@media(max-width:660px){.picker-grid{display:none}.picker-steps{display:block}}.legend{display:grid;gap:8px}.legend-row{display:flex;align-items:center;gap:12px}.legend-row p{margin:0}.legend .tile,.example .tile{--tile: 44px}.example{padding:10px 0;border-top:1px solid var(--border)}.example .board-row{justify-content:start;margin:6px 0}.example p{margin:0}.example-answer{display:flex;align-items:center;gap:6px}.mini-card{padding:2px 5px;border:1px solid var(--border);border-radius:4px;background:var(--bg)}.answer-reveal{display:grid;justify-items:center;gap:6px}.answer-cards{display:flex;gap:6px}.showdown:has(.tray){display:flex;flex-direction:column;height:100vh;height:100dvh;padding-bottom:12px}.showdown:has(.tray) .board{flex:1 1 0;min-height:0;container-type:size;align-content:center}.showdown:has(.tray) .board-row{--tile: clamp(24px, min(12vw, (100cqh - 30px) / 6), 58px)}.showdown:has(.tray) :is(.tray,.picker){flex:none}@media(max-height:760px){.tray{margin:10px 0 8px;padding:8px 10px}.rank-button{min-height:40px}.rank-buttons{gap:5px}.suit-buttons{margin-top:6px;min-height:46px}.suit-buttons .pick-card{min-height:46px}}:root{color-scheme:light;--bg: #f6f5f1;--surface: #ffffff;--surface-2: #ecebe5;--text: #1c1c1e;--muted: #66655f;--border: #d6d4cc;--accent: #2f5bd3;--accent-text: #ffffff;--error: #b42318;--red-suit: #c0262d;--black-suit: #1c1c1e;--radius: 8px;--hit: #0f8b8d;--hit-text: #ffffff;--near: #f2a541;--near-text: #1c1c1e;--miss: #6b7079;--miss-text: #ffffff;--suit: #7c5cc4;--suit-text: #ffffff;--boom: #d64545;--boom-text: #ffffff;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}:root[data-theme=dark]{color-scheme:dark;--bg: #141416;--surface: #1f1f23;--surface-2: #2a2a30;--text: #f1f0ec;--muted: #a3a29c;--border: #3a3a42;--accent: #6d8ff0;--accent-text: #0d1020;--error: #ff8a80;--red-suit: #ff6b70;--black-suit: #f1f0ec}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}.page{max-width:720px;margin:0 auto;padding:12px 16px 48px}.muted{color:var(--muted)}.small{font-size:.85rem}.center{text-align:center}.error{color:var(--error)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.hub-title{display:flex;align-items:center;justify-content:space-between;margin-top:12px}.hub h1{margin:12px 0 4px}.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-top:24px}.hub-card{display:block;padding:20px;background:var(--surface);border:1px solid var(--border);border-radius:12px;color:inherit;text-decoration:none}.hub-card:hover,.hub-card:focus-visible{border-color:var(--accent)}.hub-card h2{margin:8px 0 4px}.hub-card p{margin:0;color:var(--muted)}.hub-icon{font-size:2rem}.game-header{display:flex;align-items:center;gap:8px;padding-bottom:8px;margin-bottom:12px;border-bottom:1px solid var(--border)}.game-header h1{flex:1;margin:0;font-size:1.3rem}.header-actions{display:flex;gap:4px}.button,.icon-button{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer}.button{min-height:44px;padding:0 16px;font-weight:600}.button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.button.active{outline:2px solid var(--accent)}.button.wide{width:100%}.button:disabled{opacity:.45;cursor:default}.icon-button{display:inline-grid;place-items:center;min-width:44px;min-height:44px;font-size:1.15rem;text-decoration:none}.icon-button[aria-pressed=true]{background:var(--surface-2);border-color:var(--accent)}.message{margin:8px 0;color:var(--error);font-weight:600}.dialog{width:min(560px,calc(100vw - 32px));max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;padding:0;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px}.dialog::backdrop{background:#00000080}.dialog-body{padding:20px}.dialog-body:focus{outline:none}.dialog-body h2{margin-top:0}.dialog-body li{margin-bottom:6px}.result{display:grid;gap:12px;margin-top:16px;padding:16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;text-align:center}.result h2,.result p{margin:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);margin:0;text-align:center}.stats dt{font-size:.8rem;color:var(--muted)}.stats dd{margin:0;font-size:1.5rem;font-weight:700}.stats dd.stats-best{font-size:.75rem;font-weight:400;color:var(--muted)}.histogram{display:grid;gap:4px;text-align:left}.histogram-row{display:flex;align-items:center;gap:8px}.histogram-label{min-width:1.2em;font-weight:600;white-space:nowrap}.histogram-bar{min-width:24px;padding:2px 6px;background:var(--surface-2);border-radius:4px;text-align:right;font-weight:600}.histogram-bar.mine{background:var(--accent);color:var(--accent-text)}.countdown{margin:0}.stats-panel{display:grid;gap:12px}.stats-heading{margin:0;font-size:.9rem;text-align:left}.share-preview{margin:0 0 12px;padding:10px;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);font-family:inherit;white-space:pre-wrap;line-height:1.3}.share-targets{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}.share-target{display:inline-flex;align-items:center;justify-content:center;gap:8px}.share-note{min-height:1.2em;margin:8px 0}.settings{display:grid;gap:4px;margin-bottom:16px}.setting-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--border);cursor:pointer}.setting-row>span{display:grid;gap:2px}.switch{appearance:none;flex:none;position:relative;width:44px;height:26px;margin:0;border-radius:13px;background:var(--border);cursor:pointer;transition:background .15s}.switch:after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0000004d;transition:left .15s}.switch:checked{background:var(--accent)}.switch:checked:after{left:21px}.switch:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(prefers-reduced-motion:reduce){.switch,.switch:after{transition:none}}.high-contrast{--hit: #0072b2;--near: #e69f00;--suit: #cc79a7;--suit-text: #1c1c1e;--boom: #cc79a7;--boom-text: #1c1c1e}.borders :is(.tile-exact,.km-correct,.km-key-correct){outline:3px solid #000000;outline-offset:-3px}.borders :is(.tile-rank,.km-present,.km-key-present){outline:3px dashed #000000;outline-offset:-3px}.borders :is(.tile-suit,.km-boom,.km-key-mine){outline:5px double #000000;outline-offset:-5px}
