:root{--sand-1: #F6ECD3;--sand-2: #E9D7AC;--sand-3: #DFC894;--panel: #FBF4E2;--panel-2: #FFF7EC;--field: #FFFFFF;--line: #D8C89B;--line-soft: #E5DAC0;--ink: #1E2A32;--ink-2: #3A2E1E;--muted: #6B5A3E;--title: #8C5525;--accent: #D9694F;--accent-2: #C1543A;--on-accent: #FFFFFF;--focus: #1F6F8B;--keep: #3FA34D;--keep-soft: rgba(63, 163, 77, .35);--back-soft: rgba(217, 105, 79, .35);--ocean: #134A5C;--ocean-soft: #DCEEF2;--ocean-line: #4FA3BD;--ocean-deep: linear-gradient(160deg, #2D8FB0, #134A5C);--overlay: rgba(30, 20, 10, .55);--p0: #1F6F8B;--p1: #D9694F;--p2: #3F8F4D;--p3: #8A6656;--p4: #8E5BB5;--salt-bg: #EDF3F4;--salt-line: #8FB3BE;--salt-ink: #2C4A54;--caramel-bg: #FBEBD9;--caramel-line: #D99A56;--caramel-ink: #8C5525;--chocolate-bg: #E9DDD6;--chocolate-line: #8A6656;--chocolate-ink: #3E2723;--tide-bg: #DCEEF2;--tide-line: #4FA3BD;--tide-ink: #134A5C;--display: "Fredoka", "Trebuchet MS", sans-serif;--body: "Inter", system-ui, sans-serif;--tw: min(16.5vw, 84px);--gap: min(1.6vw, 8px);--tr: calc(var(--tw) * .12);color-scheme:light}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--sand-1: #17222A;--sand-2: #1B2830;--sand-3: #13202A;--panel: #22313A;--panel-2: #2A3C47;--field: #1A262E;--line: #3D5260;--line-soft: #33454F;--ink: #EDE6D6;--ink-2: #E2D8C3;--muted: #AFA691;--title: #F0B27A;--accent: #E8846B;--accent-2: #D9694F;--on-accent: #1A0F0A;--focus: #7CC4DD;--keep: #6CCB7B;--ocean-soft: #1D3F4C;--ocean: #BFE6F2;--overlay: rgba(4, 8, 12, .7);--p0: #7CC4DD;--p1: #E8846B;--p2: #6CCB7B;--p3: #C9A693;--p4: #C29BE0;color-scheme:dark}}:root[data-theme=dark]{--sand-1: #17222A;--sand-2: #1B2830;--sand-3: #13202A;--panel: #22313A;--panel-2: #2A3C47;--field: #1A262E;--line: #3D5260;--line-soft: #33454F;--ink: #EDE6D6;--ink-2: #E2D8C3;--muted: #AFA691;--title: #F0B27A;--accent: #E8846B;--accent-2: #D9694F;--on-accent: #1A0F0A;--focus: #7CC4DD;--keep: #6CCB7B;--ocean-soft: #1D3F4C;--ocean: #BFE6F2;--overlay: rgba(4, 8, 12, .7);--p0: #7CC4DD;--p1: #E8846B;--p2: #6CCB7B;--p3: #C9A693;--p4: #C29BE0;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%}body{background:var(--sand-2);background-image:radial-gradient(ellipse at top left,var(--sand-1) 0%,var(--sand-2) 55%,var(--sand-3) 100%);background-attachment:fixed;color:var(--ink);font-family:var(--body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}button,input{font:inherit;color:inherit}p{margin:0 0 12px}h1,h2,h3{font-family:var(--display);font-weight:600;color:var(--title)}.wrap{max-width:560px;margin:0 auto;padding:18px 16px 40px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:8px 18px;border:2px solid var(--line);border-radius:10px;background:var(--field);color:var(--ink-2);cursor:pointer;font-weight:600;transition:filter .15s ease,transform .1s ease}.btn:hover:not(:disabled){filter:brightness(1.06)}.btn:active:not(:disabled){transform:translateY(1px)}.btn.primary{background:linear-gradient(160deg,var(--accent),var(--accent-2));border-color:transparent;color:var(--on-accent);box-shadow:0 4px 12px #c1543a59}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.small{min-height:36px;padding:4px 12px;font-size:13px}.btn.wide{width:100%}.btn:focus-visible,.tile:focus-visible,.pick:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--focus);outline-offset:3px}h1.cover{margin:0;line-height:0}h1.cover img{display:block;width:100%;height:auto;border-radius:16px;box-shadow:0 12px 30px #3c280a2e}.played{margin:14px 0 0;font-size:14px;color:var(--muted)}.played b{color:var(--ink);font-family:var(--display);font-size:22px;margin-right:2px}.tagline{margin:18px 0 0;font-family:var(--display);font-weight:600;font-size:19px;color:var(--title);line-height:1.25}.lede{margin:10px 0 8px;font-size:16px}.pick-h{font-size:19px;margin:20px 0 8px}.field{display:block;width:100%;padding:10px 12px;border-radius:10px;border:2px solid var(--line);background:var(--field);font-size:15px}.picks{display:grid;gap:8px}.picks.four{grid-template-columns:repeat(4,1fr)}.picks.two{grid-template-columns:1fr 1fr}.pick{text-align:left;padding:10px 12px;border:2px solid var(--line);border-radius:12px;background:var(--panel);cursor:pointer;display:flex;flex-direction:column;gap:3px}.pick .nm{font-family:var(--display);font-weight:600;font-size:18px;color:var(--ink-2);line-height:1.15}.pick .ds{font-size:13px;color:var(--muted);line-height:1.35}.pick[aria-pressed=true]{border-color:var(--accent);background:var(--panel-2);box-shadow:0 0 0 3px var(--back-soft)}.picks.four .pick{text-align:center;align-items:center}.picks.four .pick .nm{font-size:24px}.start-go{margin-top:22px}details{margin-top:24px;background:var(--panel);border:2px solid var(--line);border-radius:14px;padding:10px 14px}summary{cursor:pointer;font-weight:700;min-height:28px;color:var(--ink-2)}.rules{font-size:14px;line-height:1.55;color:var(--ink-2);max-width:68ch}.rules h3{font-size:16px;margin:18px 0 4px;padding-bottom:4px;border-bottom:1px solid var(--line-soft);color:var(--ink)}.rules h4{font-family:var(--display);font-weight:600;font-size:15px;margin:14px 0 4px;display:flex;align-items:center;gap:8px;color:var(--ink)}.rules h4 .num{width:22px;height:22px;border-radius:6px;background:var(--accent);color:var(--on-accent);display:inline-flex;align-items:center;justify-content:center;font-size:12px}.rules ul,.rules ol{margin:0 0 6px;padding-left:20px}.rules li{margin-bottom:4px}.callout{border-radius:10px;padding:10px 12px;margin:12px 0;background:var(--caramel-bg);border:2px solid var(--caramel-line);color:#3a2e1e}.callout.ocean{background:var(--tide-bg);border-color:var(--tide-line)}.callout b.t{display:block;font-family:var(--display);font-weight:600;margin-bottom:2px;color:var(--caramel-ink)}.callout.ocean b.t{color:var(--tide-ink)}.chips{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0}.chip{display:inline-flex;align-items:center;gap:6px;border-radius:8px;padding:4px 8px;font-size:12px;font-weight:600;border:1.5px solid}.chip img{width:16px;height:16px;object-fit:contain}.chip .h{font-weight:400;opacity:.85}.game{max-width:1100px;margin:0 auto;padding:16px 16px 40px}.top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}.top>div{flex:1 1 auto;min-width:0}.top h1.banner{margin:0;line-height:0;max-width:420px}.top h1.banner img{display:block;width:100%;height:auto;border-radius:10px}.top .sub{font-size:13px;color:var(--muted);margin:2px 0 0}.layout{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}.side{display:flex;flex-direction:column;gap:10px}.board{background:#ffffff4d;border:2px solid var(--line);border-radius:18px;padding:14px}:root[data-theme=dark] .board{background:#00000026}@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .board{background:#00000026}}.board-h{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px}.draw{font-size:13px;color:var(--muted)}.draw b{color:var(--ink)}.tides{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.tides .lbl{font-size:13px;color:var(--muted);margin-right:2px}.tok{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#fdfbf4,#eadfc2);border:2px solid #C7B183;color:#b79b62;box-shadow:0 2px 4px #0003}.tok.blue{background:var(--ocean-deep);border-color:#0e3a49;color:#eaf7fa}.toast{display:flex;align-items:center;gap:10px;border-radius:12px;padding:10px 14px;margin-bottom:10px;background:var(--tide-bg);border:2px solid var(--tide-line);color:var(--tide-ink);box-shadow:0 4px 12px #134a5c40;animation:fade-in .35s ease}.toast.hightide{background:var(--ocean-deep);border-color:#0e3a49;color:#eaf7fa}.toast b{display:block;font-family:var(--display);font-weight:600;font-size:15px}.toast span{font-size:13px;opacity:.92}.beach{display:grid;grid-template-columns:repeat(5,var(--tw));gap:var(--gap);justify-content:center}.slot,.tile{width:var(--tw);height:var(--tw);border-radius:var(--tr)}.slot{border:2px dashed var(--line);background:#ffffff1f}.tile{position:relative;display:block;padding:0;overflow:hidden;border:2px solid;cursor:default;transition:transform .12s ease,box-shadow .12s ease;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}.tile.down{border-color:#b5966a;background:#d9c08e center / cover no-repeat;background-image:var(--sand-art);box-shadow:inset 0 0 10px #3c280a59}.tile.up{display:flex;align-items:center;justify-content:center;padding:12%}.tile.up img.art{width:100%;height:100%;object-fit:contain;display:block;-webkit-touch-callout:none;pointer-events:none}.tile.salt{background:var(--salt-bg);border-color:var(--salt-line);--tink: var(--salt-ink)}.tile.caramel{background:var(--caramel-bg);border-color:var(--caramel-line);--tink: var(--caramel-ink)}.tile.chocolate{background:var(--chocolate-bg);border-color:var(--chocolate-line);--tink: var(--chocolate-ink)}.tile.tide{background:var(--tide-bg);border-color:var(--tide-line);--tink: var(--tide-ink)}.tile .val{position:absolute;top:3px;right:3px;min-width:18px;height:18px;padding:0 4px;border-radius:6px;background:var(--tink);color:#fff;font-family:var(--display);font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;line-height:1;box-shadow:0 1px 3px #00000059}.tile .tag{position:absolute;left:0;right:0;bottom:0;font-size:10px;font-weight:700;text-align:center;padding:2px 0;color:#fff;letter-spacing:.3px}.tile.keep{border-color:var(--keep);box-shadow:0 0 0 3px var(--keep-soft)}.tile.keep .tag{background:#3fa34d}.tile.back{border-color:var(--accent-2);box-shadow:0 0 0 3px var(--back-soft)}.tile.back .tag{background:#c1543a}.tile.back img.art{opacity:.55}.tile.live{cursor:pointer}.tile.live:hover{transform:translateY(-2px);box-shadow:0 6px 14px #1e2a3240}.tile.down.live{box-shadow:inset 0 0 10px #3c280a59,0 0 0 2px var(--accent)}.tile.down.live:hover{box-shadow:inset 0 0 10px #3c280a59,0 0 0 2px var(--accent),0 6px 14px #1e2a3240}.tile.target{outline:3px solid var(--accent);outline-offset:2px;transform:translateY(-3px);z-index:2;animation:pulse-ring .82s ease-in-out infinite}@keyframes pulse-ring{0%,to{box-shadow:0 0 #d9694f00}50%{box-shadow:0 0 0 8px #d9694f73}}.tile.fx-flip{animation:flip-in .35s ease}.tile.fx-new{animation:drop-in .4s cubic-bezier(.34,1.56,.64,1)}.tile.fx-shuffle{animation:drop-in .5s cubic-bezier(.34,1.56,.64,1)}.tile.fx-back{animation:wash 1s ease-out}@keyframes flip-in{0%{opacity:0;transform:scale(.9) rotateY(70deg)}to{opacity:1;transform:none}}@keyframes drop-in{0%{opacity:0;transform:translateY(-14px) scale(.82)}70%{opacity:1;transform:translateY(2px) scale(1.03)}to{opacity:1;transform:none}}@keyframes wash{0%{box-shadow:0 0 0 14px #4fa3bd00}30%{box-shadow:0 0 0 6px #4fa3bde6}to{box-shadow:0 0 #4fa3bd00}}.tile .fxchip{position:absolute;z-index:2;left:0;right:0;top:38%;text-align:center;font-weight:700;font-size:10px;line-height:1.4;color:#fff;background:#1f6f8b;animation:chip-out 1.8s ease-in forwards;pointer-events:none}@keyframes chip-out{0%,70%{opacity:1}to{opacity:0}}.peek{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:16px;background:#0a0e1080;pointer-events:none;animation:peek-in .14s ease-out}.peek .tile{--tw: min(70vw, 320px);border-width:4px;box-shadow:0 12px 40px #00000080}.peek .tile .val{min-width:54px;height:54px;font-size:32px;border-radius:14px;top:10px;right:10px}.peek .cap{position:absolute;bottom:calc(50% - min(35vw,160px) - 48px);color:#fff;font-family:var(--display);font-weight:600;font-size:20px;text-shadow:0 1px 4px #000}@keyframes peek-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}.prompt{margin:0 0 12px;padding:12px 14px;background:var(--panel);border:2px solid var(--line);border-left:6px solid var(--muted);border-radius:12px;min-height:52px;display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2)}.prompt.you{border-left-color:var(--p0)}.prompt.bot{border-left-color:var(--accent)}.prompt.decide{background:var(--panel-2);border-color:var(--accent);border-left-width:10px;font-weight:600;box-shadow:0 0 0 3px var(--back-soft)}.prompt .who{font-weight:700}.dot{width:10px;height:10px;border-radius:50%;background:var(--accent);flex:0 0 auto;animation:blink 1.2s ease-in-out infinite}@keyframes blink{0%,to{opacity:.3}50%{opacity:1}}.acts{margin-top:12px;display:flex;flex-direction:column;gap:8px}.acts .row{display:flex;gap:8px;flex-wrap:wrap}.hint{font-size:13px;color:var(--muted);margin:0}.players{display:flex;flex-direction:column;gap:8px}.player{border:2px solid var(--line);border-left:6px solid var(--pc);background:var(--panel);border-radius:14px;padding:9px 12px}.player.now{border-color:var(--accent);border-left-color:var(--pc);background:var(--panel-2);box-shadow:0 4px 12px #d9694f40}.player-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;gap:6px}.player .nm{font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink-2)}.you-tag{font-size:10px;background:var(--p0);color:var(--sand-1);border-radius:6px;padding:1px 6px;font-weight:700;margin-left:6px;vertical-align:2px}.turn-tag{font-size:11px;font-weight:700;color:var(--accent)}.stacks{display:flex;gap:6px;margin-bottom:4px}.stack{display:flex;align-items:center;gap:6px;border-radius:9px;padding:3px 8px;min-width:46px;border:1.5px solid;font-weight:700;font-size:14px}.stack img{width:16px;height:16px;object-fit:contain}.player .craft{font-size:12px;color:var(--muted)}.log{background:var(--panel);border:2px solid var(--line);border-radius:14px;padding:12px;margin-top:16px}.log-h{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:0 0 8px}.log h2{font-size:16px;margin:0;color:var(--ink-2)}.log ol{list-style:none;margin:0;padding:0;max-height:300px;overflow:auto}.log li{font-size:13px;line-height:1.4;padding:4px 0 4px 9px;border-left:3px solid var(--line-soft);margin-bottom:3px;color:var(--ink-2)}.log li .t{color:var(--muted);margin-right:6px;font-variant-numeric:tabular-nums}.log li.p0{border-left-color:var(--p0)}.log li.p1{border-left-color:var(--p1)}.log li.p2{border-left-color:var(--p2)}.log li.p3{border-left-color:var(--p3)}.log li.p4{border-left-color:var(--p4)}.log li.sys{border-left-color:var(--muted);font-style:italic}.log li.tide{color:var(--ocean)}.log li.hightide,.log li.gameover{font-weight:700}.over{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);display:flex;align-items:center;justify-content:center;padding:16px;z-index:50}.panel{position:relative;background:var(--panel);border:2px solid var(--line);border-radius:20px;max-width:480px;width:100%;padding:22px 20px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;animation:fade-in .35s ease}.panel-tr{position:absolute;top:12px;right:12px}.panel h2{font-size:28px;margin:0 0 8px;padding-right:110px;line-height:1.1}.panel .why{font-weight:700;color:var(--ink-2)}.panel .flavor{font-style:italic;color:var(--muted)}.panel .small-note{font-size:13px;color:var(--muted)}.results{list-style:none;margin:14px 0;padding:0;display:flex;flex-direction:column;gap:6px}.results li{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--field);border:2px solid var(--line-soft);border-left:6px solid var(--pc);border-radius:12px;padding:8px 12px}.results li.win{border-color:var(--accent);border-left-color:var(--pc);background:var(--panel-2)}.results .rk{font-family:var(--display);font-weight:600;width:18px;color:var(--muted)}.results .nm{font-weight:700;font-size:14px}.results .det{font-size:12px;color:var(--muted)}.results .sc{font-family:var(--display);font-weight:700;font-size:20px;color:var(--ink-2)}.results li.win .sc{color:var(--accent)}.panel .btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.panel .btns .btn{flex:1 1 auto}.rules-panel{max-width:640px}.rules-panel .btns{position:sticky;bottom:-22px;background:var(--panel);padding:12px 0 22px;margin-bottom:-22px}@keyframes fade-in{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}@media (max-width: 520px){.wrap,.game{padding-left:12px;padding-right:12px}.board{padding:10px}.picks.two{grid-template-columns:1fr}.panel h2{font-size:24px}.stack{min-width:0;padding:3px 6px}}@media (min-width: 960px){:root{--tw: min(8.6vw, 96px);--gap: 9px}body{font-size:16px}.wrap{max-width:720px;padding-top:28px}.layout{grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"main side" "below side";align-items:start}.layout>.main{grid-area:main}.layout>.side{grid-area:side}.layout>.below{grid-area:below}.below .log{margin-top:0}.top h1.banner{max-width:520px}.rules{font-size:15px}.log li{font-size:14px}.log ol{max-height:420px}}@media (prefers-reduced-motion: reduce){.tile,.tile.target,.tile.fx-flip,.tile.fx-new,.tile.fx-shuffle,.tile.fx-back,.tile .fxchip,.dot,.peek,.toast,.panel,.btn{animation:none;transition:none}.tile.target{transform:none;outline-width:4px}.tile.live:hover{transform:none}.tile.fx-new,.tile.fx-shuffle,.tile.fx-flip{outline:2px solid var(--focus);outline-offset:2px}.tile.fx-back{box-shadow:0 0 0 3px var(--tide-line)}}