.g-crazy-eights{--cw:48px;--ch:67px;--tw:52px;--th:73px;--card-face:#fbfaf6;--card-ink:#1d2320;--card-red:#c0392b;padding:6px;border-radius:8px;background:var(--accent-soft);outline-offset:2px;touch-action:manipulation}.g-crazy-eights .ce-opps{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.g-crazy-eights .ce-seat{display:grid;justify-items:center;gap:2px;padding:4px 10px;min-width:88px;border-radius:8px;border:2px solid transparent;font-size:13px;line-height:1.2;color:var(--ink)}.g-crazy-eights .ce-seat.is-turn,.g-crazy-eights .ce-you.is-turn{border-color:var(--gold);background:rgba(242,193,78,.22)}.g-crazy-eights .ce-seat.is-last .ce-back span{background:var(--danger)}.g-crazy-eights .ce-name{font-size:14px}.g-crazy-eights .ce-sc{font-weight:600}.g-crazy-eights .ce-back{width:34px;height:46px;border-radius:4px;border:2px solid #f3f1ea;display:grid;place-items:center;color:#fff;font-weight:700;font-size:14px;background:repeating-linear-gradient(45deg,#2c6b8c 0 3px,#245a76 3px 6px);box-shadow:2px 2px 0 -1px #245a76,0 1px 2px rgba(0,0,0,.3)}.g-crazy-eights .ce-back span{background:rgba(0,0,0,.55);border-radius:999px;padding:0 6px}.g-crazy-eights .ce-center{display:flex;justify-content:center;align-items:flex-start;gap:14px;margin:8px 0 4px}.g-crazy-eights .ce-pilebox,.g-crazy-eights .ce-suit{display:grid;justify-items:center;gap:3px}.g-crazy-eights .ce-pilelabel{font-size:12px;color:var(--ink-2)}.g-crazy-eights .ce-pile{appearance:none;padding:0;width:var(--tw);height:var(--th);border-radius:calc(var(--tw) * .1);border:2px solid #f3f1ea;cursor:pointer;position:relative;color:#fff;font:inherit;background:repeating-linear-gradient(45deg,#2c6b8c 0 4px,#245a76 4px 8px);box-shadow:3px 3px 0 -1px #245a76,0 1px 3px rgba(0,0,0,.35);display:grid;place-items:center}.g-crazy-eights .ce-stock{margin-bottom:18px}.g-crazy-eights .ce-stock .ce-pilelabel{position:absolute;left:0;right:0;top:100%;margin-top:4px;color:var(--ink-2)}.g-crazy-eights .ce-stock .ce-count{background:rgba(0,0,0,.55);border-radius:999px;padding:0 7px;font-weight:700;font-size:14px}.g-crazy-eights .ce-stock.is-live{box-shadow:0 0 0 3px var(--gold),0 3px 6px rgba(0,0,0,.35)}.g-crazy-eights .ce-stock.is-live .ce-pilelabel{color:var(--ink);font-weight:700}.g-crazy-eights .ce-stock.is-empty{background:0 0;border:2px dashed var(--line);box-shadow:none;color:var(--ink-2)}.g-crazy-eights .ce-stock:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.g-crazy-eights .ce-pilebox .ce-card{position:relative;width:var(--tw);height:var(--th);font-size:calc(var(--tw) * .3)}.g-crazy-eights .ce-suit{min-width:calc(var(--tw) * .9);align-self:stretch;align-content:start;padding-top:6px}.g-crazy-eights .ce-suitsym{display:grid;place-items:center;width:calc(var(--tw) * .8);height:calc(var(--tw) * .8);border-radius:50%;background:var(--card-face);color:var(--card-ink);border:2px solid var(--gold);font-size:calc(var(--tw) * .5);line-height:1;box-shadow:0 1px 2px rgba(0,0,0,.3)}.g-crazy-eights .ce-suit.red .ce-suitsym{color:var(--card-red)}.g-crazy-eights .ce-card{box-sizing:border-box;border-radius:calc(var(--cw) * .1);border:1px solid #8e9791;font-weight:700;line-height:1;color:var(--card-ink);background:var(--card-face);box-shadow:0 1px 2px rgba(0,0,0,.3);overflow:hidden;user-select:none;-webkit-user-select:none}.g-crazy-eights .ce-card.red{color:var(--card-red)}.g-crazy-eights .ce-card.is-eight{border-color:#b8892b;background:linear-gradient(#fffaf0,#fbefd0)}.g-crazy-eights .ce-ix{position:absolute;left:.2em;top:.16em;white-space:nowrap;letter-spacing:-.04em;font-size:1.2em}.g-crazy-eights .ce-ix i{font-style:normal;margin-left:.04em}.g-crazy-eights .ce-mid{position:absolute;left:0;right:0;bottom:8%;text-align:center;font-size:2.1em;line-height:1}.g-crazy-eights .ce-you{display:flex;justify-content:center;align-items:baseline;gap:10px;margin:2px auto 4px;padding:2px 10px;width:fit-content;border:2px solid transparent;border-radius:8px;font-size:14px;color:var(--ink)}.g-crazy-eights .ce-yourturn{font-weight:700}.g-crazy-eights .ce-hand{display:grid;justify-content:center;gap:6px;padding-top:14px}.g-crazy-eights .ce-row{position:relative;margin:0 auto}.g-crazy-eights .ce-hand .ce-card{position:absolute;top:0;width:var(--cw);height:var(--ch);font-size:calc(var(--cw) * .27);cursor:pointer;transition:transform .08s;touch-action:manipulation}.g-crazy-eights .ce-hand .ce-card:hover{transform:translateY(-4px)}.g-crazy-eights .ce-hand .ce-card.is-dim{filter:brightness(.62)saturate(.7);cursor:default}.g-crazy-eights .ce-hand .ce-card.is-dim:hover{transform:none}.g-crazy-eights .ce-hand .ce-card.is-sel{transform:translateY(-14px);box-shadow:0 0 0 3px var(--focus),0 3px 6px rgba(0,0,0,.35);z-index:3}.g-crazy-eights .ce-hand .ce-card.is-new{box-shadow:0 0 0 2px var(--gold),0 1px 2px rgba(0,0,0,.3)}.g-crazy-eights .ce-hand .ce-card.is-hint{box-shadow:0 0 0 3px var(--gold),0 3px 6px rgba(0,0,0,.35);transform:translateY(-8px);z-index:4}.g-crazy-eights .ce-hand .ce-card.is-cursor{outline:3px solid var(--focus);outline-offset:-1px;z-index:5}.g-crazy-eights .is-shake{animation:ce-shake .35s}@keyframes ce-shake{20%{margin-left:-4px}40%{margin-left:4px}60%{margin-left:-3px}80%{margin-left:3px}}.g-crazy-eights .ce-actions{display:flex;justify-content:center;margin:8px 0 2px;min-height:40px}.g-crazy-eights .ce-suitpick{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px}.g-crazy-eights .ce-pickline{width:100%;text-align:center;font-weight:700;font-size:14px;color:var(--ink)}.g-crazy-eights .ce-sbtn{display:grid;justify-items:center;line-height:1.1;min-width:56px;min-height:48px;padding:4px 8px;font-size:24px}.g-crazy-eights .ce-sbtn.red{color:var(--card-red)}.g-crazy-eights .ce-sbtn small{font-size:11px;color:var(--ink-2)}.g-crazy-eights .ce-scores{margin-top:6px}.g-crazy-eights .ce-scroll{max-height:9.5em;overflow:auto;border-radius:6px;background:var(--surface);border:1px solid var(--line)}.g-crazy-eights table{width:100%;border-collapse:collapse;font-size:13px;text-align:center;color:var(--ink);font-variant-numeric:tabular-nums}.g-crazy-eights th,.g-crazy-eights td{padding:2px 4px}.g-crazy-eights thead th{position:sticky;top:0;background:var(--surface-2)}.g-crazy-eights tfoot th{position:sticky;bottom:0;background:var(--surface-2);border-top:1px solid var(--line)}.g-crazy-eights td.is-win{font-weight:700}.g-crazy-eights .ce-goal{margin:4px 0 0;text-align:center;font-size:12px;color:var(--ink-2)}@media(max-width:420px){.g-crazy-eights{padding:4px}.g-crazy-eights .ce-opps{gap:4px}.g-crazy-eights .ce-seat{padding:2px 4px;min-width:76px;font-size:12px}.g-crazy-eights .ce-name{font-size:13px}.g-crazy-eights .ce-center{gap:10px}.g-crazy-eights table{font-size:12px}}@media(prefers-reduced-motion:reduce){.g-crazy-eights .ce-hand .ce-card,.g-crazy-eights .is-shake{transition:none;animation:none}}.g-crazy-eights .ce-rules{margin:0 0 8px;padding:10px 12px;border-radius:8px;background:var(--surface);border:1px solid var(--line);color:var(--ink);font-size:14px;line-height:1.45}.g-crazy-eights .ce-rules h3{margin:0 0 4px;font-size:16px}.g-crazy-eights .ce-rules p{margin:0 0 8px}