:root{--bg:#070b1c;--panel:#0e1531;--ink:#f7f3ff;--muted:#9aa7c9;--gold:#ffcc68;--violet:#8c58ff;--cyan:#4bd8ff;--wood1:#7a3e22;--wood2:#3d1d14;--wood3:#a65c2e}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#050817;color:var(--ink);font-family:Inter,ui-rounded,"SF Pro Rounded",system-ui,-apple-system,sans-serif}body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;overflow-x:hidden}.app{position:relative;z-index:4;min-height:100svh;padding:env(safe-area-inset-top) max(18px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));max-width:1280px;margin:auto}.world{position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none;background:#061324;transition:background .8s ease}.sky,.world-back,.world-mid,.world-front,.atmosphere,.world-vignette{position:absolute;inset:-4%;transition:background 1s ease,filter 1s ease,opacity 1s ease}.world-vignette{inset:0;background:radial-gradient(circle at 50% 40%,transparent 20%,#03050d44 68%,#02030a 100%);z-index:10}.atmosphere{z-index:8}.ambient{position:absolute;left:var(--x);top:var(--y);animation-duration:var(--d);animation-delay:var(--delay);animation-iteration-count:infinite;animation-timing-function:linear;opacity:.65;transform:scale(var(--s))}.cloud{width:120px;height:34px;border-radius:999px;background:#fff2;filter:blur(8px);animation-name:drift}.bird{width:12px;height:5px;border-top:2px solid #fff8;border-radius:50%;animation-name:fly}.sparkle,.star,.firefly,.dust,.ember,.ash,.spray,.snow,.bubble,.petal,.leaf{width:5px;height:5px;border-radius:50%;background:#fff;box-shadow:0 0 12px currentColor;animation-name:float}.ember{background:#ff9a45;color:#ff6b32}.snow{background:#dff7ff;color:#c7ecff}.bubble{background:transparent;border:1px solid #d8ffffaa;box-shadow:inset 0 0 4px #fff}.petal{width:8px;height:5px;background:#ff9fc2;border-radius:80% 10% 80% 10%;box-shadow:none}.leaf{width:8px;height:4px;background:#91c979;border-radius:90% 10%;box-shadow:none}.firefly{background:#dfff7d;color:#dfff7d}.smoke,.mist,.wisp{width:90px;height:90px;border-radius:50%;background:#ffffff0b;filter:blur(22px);animation-name:floatSlow}.beam,.ray{width:2px;height:220px;background:linear-gradient(transparent,#fff4,transparent);filter:blur(4px);animation-name:sweep}.fish{width:22px;height:8px;border-radius:70% 40% 40% 70%;background:#73d8ff66;animation-name:swim}.orb,.lantern,.drone{width:16px;height:16px;border-radius:50%;background:#ffe79b88;box-shadow:0 0 20px #ffd77299;animation-name:floatSlow}.drone{border-radius:4px;background:#5ce9ff99;box-shadow:0 0 16px #3fe5ff}.banner{width:10px;height:54px;background:#ffcf7666;transform-origin:top;animation-name:sway}.gridpulse{width:100%;height:2px;left:0!important;background:#ff4eff33;animation-name:gridPulse}.meteor{width:42px;height:2px;background:linear-gradient(90deg,transparent,#fff);transform:rotate(-25deg);animation-name:meteor}
@keyframes drift{from{transform:translateX(-25vw) scale(var(--s))}to{transform:translateX(115vw) scale(var(--s))}}@keyframes fly{from{transform:translateX(-20vw)}to{transform:translateX(120vw) translateY(-12vh)}}@keyframes float{0%{transform:translate(0,12vh) rotate(0) scale(var(--s));opacity:0}15%{opacity:.75}100%{transform:translate(7vw,-30vh) rotate(260deg) scale(var(--s));opacity:0}}@keyframes floatSlow{0%,100%{transform:translate(-10px,10px) scale(var(--s));opacity:.28}50%{transform:translate(20px,-25px) scale(calc(var(--s)*1.2));opacity:.65}}@keyframes sweep{0%{transform:translateX(-12vw) rotate(18deg);opacity:0}50%{opacity:.35}100%{transform:translateX(92vw) rotate(18deg);opacity:0}}@keyframes swim{from{transform:translateX(-20vw) scale(var(--s))}to{transform:translateX(120vw) scale(var(--s))}}@keyframes sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(6deg)}}@keyframes gridPulse{0%{transform:translateY(80vh);opacity:0}40%{opacity:.6}100%{transform:translateY(-10vh);opacity:0}}@keyframes meteor{0%,82%{opacity:0;transform:translate(-20vw,-20vh) rotate(-25deg)}84%{opacity:1}100%{opacity:0;transform:translate(70vw,40vh) rotate(-25deg)}}
/* Living world compositions */
body[data-world="tropical"] .world{background:linear-gradient(#2f89cf 0 38%,#0e6d8a 39% 62%,#073545 63%)}body[data-world="tropical"] .sky{background:radial-gradient(circle at 78% 18%,#fff6 0 4%,transparent 12%),linear-gradient(#4fb2e8,#8ed6ef 50%,transparent 51%)}body[data-world="tropical"] .world-back{background:radial-gradient(ellipse at 18% 53%,#1b5f62 0 8%,transparent 8.5%),radial-gradient(ellipse at 86% 50%,#184e5d 0 11%,transparent 11.5%),linear-gradient(180deg,transparent 55%,#19a6b088 55% 62%,transparent 63%)}body[data-world="tropical"] .world-mid{background:repeating-radial-gradient(ellipse at 50% 68%,#b7ffff26 0 1px,transparent 3px 18px);animation:ocean 5s ease-in-out infinite}body[data-world="tropical"] .world-front{background:radial-gradient(ellipse at -4% 86%,#0d4a2d 0 20%,transparent 21%),radial-gradient(ellipse at 104% 88%,#0d4a2d 0 23%,transparent 24%)}
body[data-world="ember"] .world{background:radial-gradient(circle at 50% 72%,#8c341e 0,#26100d 30%,#090812 72%)}body[data-world="ember"] .world-back{background:repeating-linear-gradient(90deg,transparent 0 13%,#6b3c2025 13.2% 13.8%);filter:blur(1px)}body[data-world="ember"] .world-mid{background:radial-gradient(circle at 12% 62%,#ff8c3c66,transparent 12%),radial-gradient(circle at 89% 59%,#ff8c3c55,transparent 13%);animation:firelight 2.5s ease-in-out infinite alternate}
body[data-world="obsidian"] .world{background:radial-gradient(circle at 50% 45%,#361870,#111027 45%,#04050b)}body[data-world="obsidian"] .world-back{background:linear-gradient(120deg,transparent 40%,#ac7cff12 41% 42%,transparent 43%),linear-gradient(60deg,transparent 53%,#ffc95b11 54% 55%,transparent 56%)}body[data-world="obsidian"] .world-mid{background:radial-gradient(circle at 20% 70%,#7a3cff22,transparent 22%),radial-gradient(circle at 80% 68%,#7a3cff22,transparent 20%);animation:arcane 6s ease-in-out infinite alternate}
body[data-world="zen"] .world{background:linear-gradient(#789aa0 0 38%,#8b9a7e 39% 56%,#404737 57%)}body[data-world="zen"] .world-back{background:radial-gradient(ellipse at 15% 56%,#374b37 0 11%,transparent 12%),radial-gradient(ellipse at 84% 53%,#304537 0 13%,transparent 14%),repeating-radial-gradient(ellipse at 50% 90%,#d8d2b222 0 1px,transparent 2px 18px)}body[data-world="zen"] .world-mid{background:linear-gradient(90deg,transparent 8%,#222c 9% 9.5%,transparent 10% 90%,#222c 90.5% 91%,transparent 92%)}
body[data-world="neon"] .world{background:linear-gradient(#09102d,#120b2e 50%,#070812)}body[data-world="neon"] .world-back{background:repeating-linear-gradient(90deg,transparent 0 7%,#1cdfff22 7.1% 7.4%,transparent 7.6% 12%),linear-gradient(180deg,transparent 34%,#ff33db1f 35% 36%,transparent 37%)}body[data-world="neon"] .world-mid{background:linear-gradient(90deg,#1be7ff18,transparent 28%,#fa3fff12 74%,transparent);animation:neonPulse 3s ease-in-out infinite alternate}
body[data-world="sunken"] .world{background:linear-gradient(#073c5f,#06415a 45%,#031d2e)}body[data-world="sunken"] .sky{background:repeating-linear-gradient(112deg,transparent 0 11%,#9cf7ff10 12% 13%,transparent 14% 22%);animation:caustic 7s linear infinite}body[data-world="sunken"] .world-back{background:radial-gradient(ellipse at 18% 78%,#082f27 0 15%,transparent 16%),radial-gradient(ellipse at 82% 77%,#082f27 0 18%,transparent 19%)}
body[data-world="celestial"] .world{background:radial-gradient(circle at 70% 23%,#5b3ba5 0 5%,transparent 11%),radial-gradient(circle at 28% 42%,#174c7b 0 10%,transparent 23%),#050713}body[data-world="celestial"] .world-back{background:radial-gradient(circle at 12% 26%,#87baff 0 1%,transparent 1.5%),radial-gradient(circle at 87% 35%,#fbcfff 0 1.5%,transparent 2%),radial-gradient(ellipse at 50% 82%,#6a42c827,transparent 30%);animation:spaceDrift 12s ease-in-out infinite alternate}
body[data-world="sakura"] .world{background:linear-gradient(#5b6f9c,#dd96a9 48%,#342d4d 49%)}body[data-world="sakura"] .world-back{background:radial-gradient(ellipse at 10% 64%,#482d4d 0 18%,transparent 19%),radial-gradient(ellipse at 93% 58%,#503047 0 20%,transparent 21%)}body[data-world="sakura"] .world-mid{background:radial-gradient(circle at 14% 57%,#ff8db820 0 9%,transparent 10%),radial-gradient(circle at 82% 48%,#ff8db820 0 10%,transparent 11%)}
body[data-world="desert"] .world{background:linear-gradient(#6a8bb0,#f6b860 52%,#7d4928 53%)}body[data-world="desert"] .sky{background:radial-gradient(circle at 76% 20%,#fff0ad 0 4%,#ffbf5b 5%,transparent 13%)}body[data-world="desert"] .world-back{background:radial-gradient(ellipse at 25% 74%,#c78039 0 26%,transparent 27%),radial-gradient(ellipse at 83% 71%,#a96836 0 31%,transparent 32%)}
body[data-world="frozen"] .world{background:linear-gradient(#071b3e,#193b61 50%,#09233f)}body[data-world="frozen"] .sky{background:linear-gradient(128deg,transparent 22%,#51ffd12f 32%,#aa76ff3a 42%,transparent 56%);filter:blur(8px);animation:aurora 8s ease-in-out infinite alternate}body[data-world="frozen"] .world-back{background:radial-gradient(ellipse at 13% 86%,#d9f7ff55 0 19%,transparent 20%),radial-gradient(ellipse at 91% 82%,#bce8f755 0 24%,transparent 25%)}
body[data-world="forest"] .world{background:radial-gradient(circle at 50% 48%,#36624b,#112a21 45%,#06110e)}body[data-world="forest"] .world-back{background:radial-gradient(ellipse at 8% 63%,#0b2519 0 28%,transparent 29%),radial-gradient(ellipse at 94% 59%,#0b2519 0 30%,transparent 31%)}body[data-world="forest"] .world-mid{background:radial-gradient(circle at 50% 60%,#b8ff8d17,transparent 25%);animation:breath 5s ease-in-out infinite alternate}
body[data-world="volcanic"] .world{background:radial-gradient(circle at 50% 82%,#ff5527 0 8%,#5b1b15 26%,#140909 58%,#050506)}body[data-world="volcanic"] .world-back{background:linear-gradient(170deg,transparent 53%,#ff4c2538 54% 55%,transparent 56%),linear-gradient(10deg,transparent 57%,#ff7a2d2f 58% 59%,transparent 60%);animation:lavaPulse 2.2s ease-in-out infinite alternate}
body[data-world="ocean"] .world{background:linear-gradient(#142a52,#526a91 48%,#082947 49%)}body[data-world="ocean"] .sky{background:radial-gradient(circle at 78% 20%,#fff8dc 0 4%,#d7e4ff55 5%,transparent 13%)}body[data-world="ocean"] .world-mid{background:repeating-radial-gradient(ellipse at 50% 73%,#d9fbff20 0 1px,transparent 3px 19px);animation:ocean 5s ease-in-out infinite}
body[data-world="deco"] .world{background:linear-gradient(#06101c,#0d1725 58%,#04070d)}body[data-world="deco"] .world-back{background:repeating-linear-gradient(120deg,transparent 0 9%,#d4a85b13 9.2% 9.6%,transparent 9.8% 18%),radial-gradient(circle at 50% 84%,#d5a14a1b,transparent 23%)}
body[data-world="synth"] .world{background:linear-gradient(#170729,#44215f 43%,#16051f 44%)}body[data-world="synth"] .sky{background:radial-gradient(circle at 50% 42%,#ffb15c 0 7%,#ff4f8799 8% 12%,transparent 13%)}body[data-world="synth"] .world-mid{background:repeating-linear-gradient(0deg,transparent 0 26px,#ff49d51f 27px 28px),repeating-linear-gradient(90deg,transparent 0 8%,#49d9ff16 8.2% 8.5%);transform:perspective(320px) rotateX(62deg) translateY(31%);transform-origin:bottom;animation:gridMove 4s linear infinite}
body[data-world="moon"] .world{background:linear-gradient(#070d25,#151d3b 55%,#08101f)}body[data-world="moon"] .sky{background:radial-gradient(circle at 75% 18%,#f6f1dc 0 5%,#c9d5ff66 6%,transparent 13%)}body[data-world="moon"] .world-back{background:radial-gradient(ellipse at 50% 82%,#d8e4ff18 0 22%,transparent 23%);animation:cloudSea 8s ease-in-out infinite alternate}
@keyframes ocean{50%{transform:translateY(7px) scaleX(1.04)}}@keyframes firelight{to{filter:brightness(1.25);transform:scale(1.02)}}@keyframes arcane{to{transform:translateY(-14px);filter:hue-rotate(20deg)}}@keyframes neonPulse{to{filter:brightness(1.45)}}@keyframes caustic{to{transform:translateX(11%)}}@keyframes spaceDrift{to{transform:scale(1.06) rotate(.4deg)}}@keyframes aurora{to{transform:translateX(8%) skewX(-8deg);filter:blur(14px)}}@keyframes breath{to{filter:brightness(1.3);transform:scale(1.04)}}@keyframes lavaPulse{to{filter:brightness(1.55)}}@keyframes gridMove{to{background-position:0 28px,8% 0}}@keyframes cloudSea{to{transform:translateX(4%) scale(1.04)}}
body.world-react .world-mid{animation-duration:.65s!important;filter:brightness(1.35) saturate(1.25)}body.world-react .world{filter:brightness(1.12)}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px}.brand img{width:44px;height:44px;border-radius:14px;box-shadow:0 0 24px #6c48ff66}.brand strong{font-size:19px;letter-spacing:.08em;text-shadow:0 2px 12px #000}.brand span{display:block;font-size:11px;color:#d8e3fa;margin-top:2px;text-shadow:0 2px 8px #000}.top-actions{display:flex;gap:8px}.icon-btn,.back-btn{border:1px solid #ffffff25;background:#07101f88;backdrop-filter:blur(12px);color:#fff;border-radius:999px;height:40px;padding:0 14px;font-weight:800}.icon-btn{width:40px;padding:0}.screen{display:none}.screen.active{display:block}.home-glass{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:28px;align-items:end;padding:8vh 0 4vh}.hero{padding:28px;border-radius:34px;background:linear-gradient(135deg,#071124aa,#111a37a0);border:1px solid #ffffff1c;box-shadow:0 30px 90px #0008;backdrop-filter:blur(15px)}.eyebrow{display:inline-flex;border:1px solid #9c74ff66;background:#5d37ba37;padding:8px 12px;border-radius:999px;color:#e0d5ff;font-size:11px;font-weight:900;letter-spacing:.16em}.hero h1{font-size:clamp(48px,8vw,92px);line-height:.91;letter-spacing:-.055em;margin:22px 0}.hero h1 em{font-style:normal;color:transparent;background:linear-gradient(90deg,var(--gold),#ff8a55,var(--violet),var(--cyan));-webkit-background-clip:text;background-clip:text}.hero p{font-size:clamp(16px,2vw,20px);line-height:1.55;color:#d7dff1;max-width:620px}.hero-actions{display:flex;gap:12px;margin-top:28px}.primary,.secondary,.tertiary{border:0;border-radius:18px;font-weight:900;font-size:16px;padding:17px 22px;color:white}.primary{background:linear-gradient(135deg,#965bff,#4b83ff);box-shadow:0 10px 38px #6f58ff55,inset 0 1px #ffffff66}.secondary{background:#07101faa;border:1px solid #ffffff28;backdrop-filter:blur(12px)}.tertiary{margin-top:12px;background:#061625aa;border:1px solid #4bd8ff66;color:#bff5ff}.home-side{display:grid;gap:12px}.world-preview{width:100%;border:1px solid #ffffff25;background:#07101fbf;backdrop-filter:blur(16px);color:#fff;padding:16px;border-radius:24px;display:grid;grid-template-columns:52px 1fr auto;align-items:center;text-align:left;gap:12px}.preview-icon{width:52px;height:52px;display:grid;place-items:center;font-size:26px;border-radius:16px;background:linear-gradient(145deg,#ffffff18,#ffffff06)}.world-preview small,.next-unlock span{font-size:10px;color:#aebbd7;letter-spacing:.13em}.world-preview b,.world-preview em{display:block}.world-preview b{font-size:17px;margin:2px 0}.world-preview em{font-size:11px;color:#8fe8ff;font-style:normal}.world-preview strong{font-size:12px;color:#ffd88b}.stats-card{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:12px;border:1px solid #ffffff18;background:#07101fb5;backdrop-filter:blur(16px);border-radius:24px}.stats-card div{padding:15px;background:#ffffff0a;border-radius:18px}.stats-card span{font-size:11px;color:#aebbd7;text-transform:uppercase;letter-spacing:.1em}.stats-card b{display:block;font-size:26px;margin-top:5px}.next-unlock{padding:16px 18px;border:1px solid #ffcc6840;background:#281d0f99;backdrop-filter:blur(14px);border-radius:20px}.next-unlock b,.next-unlock em{display:block}.next-unlock em{font-size:11px;color:#e8c98c;font-style:normal;margin-top:3px}.game-head,.score-row,.game-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}.game-head{padding:8px 0 14px}.turn-pill{border:1px solid #4bd8ff77;background:#062234b5;color:#c8f7ff;border-radius:999px;padding:10px 18px;font-weight:900;box-shadow:0 0 28px #4bd8ff22;backdrop-filter:blur(12px)}.score-row{padding-bottom:10px}.player-card{display:flex;align-items:baseline;gap:10px;background:#06101fbb;border:1px solid #ffffff22;backdrop-filter:blur(12px);border-radius:16px;padding:10px 14px}.player-card span,.mode-label{font-size:12px;color:#d0d9ec}.player-card b{font-size:24px}.board-shell{position:relative;padding:12px 0}.board-glow{position:absolute;inset:3% 2%;background:radial-gradient(circle,#7b49ff3e,transparent 62%);filter:blur(30px)}.move-fx{position:absolute;inset:0;pointer-events:none;z-index:9;overflow:visible}.move-burst{position:absolute;width:34px;height:34px;margin:-17px;border-radius:50%;border:2px solid #ffd873;box-shadow:0 0 14px #ffd873,0 0 44px #ffad42;animation:burst 1.1s ease-out forwards}.move-burst:before,.move-burst:after{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px dashed currentColor;animation:spin 1s linear}.move-burst.aqua{color:#63eeff;border-color:#63eeff;box-shadow:0 0 18px #63eeff,0 0 48px #168cff}.move-burst.petal{color:#ff97c4;border-color:#ffb4d4;box-shadow:0 0 18px #ff8abf}.move-burst.prism{color:#d991ff;border-color:#66edff;box-shadow:0 0 18px #d991ff,0 0 44px #4de7ff}.move-burst.frost{color:#d9f8ff;border-color:#d9f8ff;box-shadow:0 0 22px #8eeeff}.move-burst.ember{color:#ff9b4e;border-color:#ffd08b;box-shadow:0 0 18px #ff5d28,0 0 50px #ff5d28}.move-burst.void{color:#a57aff;border-color:#a57aff;box-shadow:0 0 20px #7d49ff,0 0 60px #571fff}.move-burst.stellar{color:#fff6b7;border-color:#fff6b7;box-shadow:0 0 20px #ffe572,0 0 70px #7aa6ff}.move-burst.capture{transform:scale(1.35)}.move-burst.bonus:after{inset:-25px}@keyframes burst{0%{opacity:0;transform:scale(.2)}25%{opacity:1}100%{opacity:0;transform:scale(4)}}@keyframes spin{to{transform:rotate(180deg)}}
.board{position:relative;display:grid;grid-template-columns:12% 1fr 12%;grid-template-rows:1fr 1fr;gap:12px;padding:18px;border-radius:34px;background:linear-gradient(145deg,var(--wood3),var(--wood1) 35%,var(--wood2));border:2px solid #d48745;box-shadow:0 28px 80px #0009,inset 0 2px #ffd49a55,inset 0 -10px 24px #210b08aa;min-height:430px;overflow:hidden;transition:background .55s,border-color .55s,filter .55s}.board-inlay{position:absolute;inset:7px;border-radius:28px;border:1px solid #ffdc9e22;pointer-events:none}.board:before{content:"";position:absolute;inset:0;opacity:.22;background:repeating-linear-gradient(5deg,transparent 0 16px,#ffe3ba12 17px 18px)}body[data-board="obsidian"] .board{background:linear-gradient(145deg,#252530,#050507 58%,#17121d);border-color:#d9b965;box-shadow:0 28px 80px #000b,inset 0 1px #fff4,0 0 30px #8d61ff33}body[data-board="marble"] .board{background:linear-gradient(145deg,#eef0ef,#9ca8af 48%,#535f6c);border-color:#f7f0db;box-shadow:0 28px 80px #0009,inset 0 1px #fff}body[data-board="jade"] .board{background:linear-gradient(145deg,#3a8c72,#124d44 50%,#062925);border-color:#b3d89d}body[data-board="ice"] .board{background:linear-gradient(145deg,#c9f7ffcc,#4c8eb6cc 55%,#173a62dd);border-color:#dffbff;box-shadow:0 28px 80px #0009,inset 0 1px #fff,0 0 34px #8eeeff55}body[data-board="basalt"] .board{background:linear-gradient(145deg,#4c403b,#191716 58%,#080808);border-color:#a75937;box-shadow:0 28px 80px #000b,inset 0 1px #ffb06b33,0 0 35px #ff4d2033}body[data-board="neon"] .board{background:linear-gradient(145deg,#163a4fcc,#09101bdd 60%,#180b27dd);border-color:#54efff;box-shadow:0 28px 80px #000b,inset 0 1px #fff5,0 0 35px #4beaff55}body[data-board="celestial"] .board{background:radial-gradient(circle at 20% 30%,#234c7b,#090e22 45%,#03050e);border-color:#8ea5ff;box-shadow:0 28px 80px #000c,inset 0 1px #fff4,0 0 40px #7259ff55}.store{position:relative;z-index:1;grid-row:1/3;border-radius:999px;background:radial-gradient(ellipse at center,#17101a,#08070a 72%);border:2px solid #b56f3f;box-shadow:inset 0 12px 28px #000a,inset 0 -3px #f2b77833;display:flex;align-items:center;justify-content:center}.store span{font-size:32px;font-weight:950;color:var(--gold);text-shadow:0 0 22px #ffb84d66}.store2{grid-column:1}.store1{grid-column:3}.pits{position:relative;z-index:1;grid-column:2;display:grid;grid-template-columns:repeat(6,1fr);gap:10px}.top{grid-row:1}.bottom{grid-row:2}.pit{position:relative;min-width:0;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 50% 58%,#120b10 0 52%,#2d2021 70%,#88664f 72%,#1d1112 77%);box-shadow:inset 0 15px 22px #000c,0 2px 0 #ffc98b22;border:0;color:white}.pit.legal{cursor:pointer;animation:pulse 1.6s infinite}.pit.legal:after{content:"";position:absolute;inset:-5px;border-radius:50%;border:2px solid #7be6ff99;box-shadow:0 0 18px #4bd8ff66}.pit-count{position:absolute;right:6%;bottom:3%;font-weight:950;font-size:12px;background:#090b18cc;border-radius:999px;min-width:24px;padding:4px;text-align:center}.stones{position:absolute;inset:12%}.stone{position:absolute;width:28%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 35% 28%,#fff9 0 5%,var(--stoneA) 10%,var(--stoneB) 70%,#111 100%);box-shadow:inset -3px -5px 8px #0008,0 4px 9px #0008,0 0 10px color-mix(in srgb,var(--stoneA),transparent 55%);transform:translate(-50%,-50%)}body[data-stones="pearl"] .stone{filter:saturate(.65) brightness(1.18)}body[data-stones="prism"] .stone{box-shadow:inset -3px -5px 8px #0008,0 4px 9px #0008,0 0 16px var(--stoneA)}body[data-stones="obsidian"] .stone{filter:contrast(1.2) brightness(.8)}body[data-stones="aurora"] .stone{box-shadow:inset -3px -5px 8px #0008,0 0 17px var(--stoneA)}body[data-stones="ember"] .stone{box-shadow:inset -3px -5px 8px #0008,0 0 18px #ff6a29;animation:stoneGlow 2s ease-in-out infinite alternate}body[data-stones="stars"] .stone{box-shadow:inset -3px -5px 8px #0008,0 0 18px var(--stoneA)}@keyframes stoneGlow{to{filter:brightness(1.3)}}.hint{font-size:13px;color:#d5ddef;text-shadow:0 2px 8px #000}.game-foot{padding-top:10px}.small{padding:10px 15px;font-size:13px}.modal{position:fixed;inset:0;background:#02040ccc;backdrop-filter:blur(18px);display:none;align-items:center;justify-content:center;padding:20px;z-index:100}.modal.show{display:flex}.modal-card{position:relative;width:min(560px,100%);max-height:88svh;overflow:auto;background:linear-gradient(180deg,#151f49f2,#0a1027f5);border:1px solid #ffffff1c;border-radius:28px;padding:28px;box-shadow:0 30px 100px #000b}.modal.wide .modal-card{width:min(980px,100%)}.close{position:absolute;right:16px;top:12px;border:0;background:transparent;color:#fff;font-size:30px}.modal h2{margin:8px 0}.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.choice{padding:16px;border:1px solid #ffffff15;background:#ffffff08;border-radius:16px;color:#fff;text-align:left}.choice b,.choice span{display:block}.choice span{font-size:12px;color:var(--muted);margin-top:4px}.winner{font-size:44px;line-height:1;margin:8px 0;background:linear-gradient(90deg,var(--gold),#ff8a55,var(--violet));-webkit-background-clip:text;color:transparent}.reward{font-weight:900;color:#ffe399}.confetti{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:200}.spark{position:absolute;width:8px;height:18px;border-radius:2px;background:var(--gold);animation:fall 1.7s ease-in forwards}.online-box{padding:14px;border:1px solid #ffffff15;background:#ffffff08;border-radius:16px;margin-top:12px}.online-box input{width:100%;padding:14px;border:1px solid #ffffff1a;background:#050817;color:white;border-radius:12px;margin:8px 0}.pill-note{padding:12px;border-radius:14px;background:#4bd8ff12;border:1px solid #4bd8ff30;color:#b7efff;font-size:13px;line-height:1.5}.custom-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.custom-head p{color:#b5c0db;margin:4px 0 0}.random-toggle{font-size:12px;color:#dbe4fa;background:#ffffff08;border:1px solid #ffffff14;padding:10px 12px;border-radius:14px;white-space:nowrap}.custom-tabs{display:flex;gap:7px;overflow:auto;margin:20px 0 14px;padding-bottom:3px}.custom-tabs button{border:1px solid #ffffff17;background:#ffffff06;color:#b9c5df;border-radius:999px;padding:10px 16px;font-weight:800}.custom-tabs button.active{background:#7750e5;color:#fff;border-color:#a78bff}.catalog{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.catalog-card{display:grid;grid-template-columns:70px 1fr auto;gap:12px;align-items:center;text-align:left;border:1px solid #ffffff15;background:#ffffff07;color:#fff;padding:10px;border-radius:18px}.catalog-card.selected{border-color:#ffc95d;box-shadow:inset 0 0 0 1px #ffc95d55,0 0 20px #ffc95d12}.catalog-card.locked{opacity:.48;filter:grayscale(.3)}.swatch{width:70px;height:58px;border-radius:13px;display:grid;place-items:center;font-size:24px;background:linear-gradient(145deg,#654129,#241611);box-shadow:inset 0 1px #fff2}.swatch-board[data-id="obsidian"]{background:linear-gradient(145deg,#333,#050505)}.swatch-board[data-id="marble"]{background:linear-gradient(145deg,#fff,#7e8c9a)}.swatch-board[data-id="jade"]{background:linear-gradient(145deg,#3ea786,#0b4037)}.swatch-board[data-id="ice"]{background:linear-gradient(145deg,#e4fbff,#4a91be)}.swatch-board[data-id="basalt"]{background:linear-gradient(145deg,#554741,#0c0b0b)}.swatch-board[data-id="neon"]{background:linear-gradient(145deg,#25e9ff,#14204b,#f73bff)}.swatch-board[data-id="celestial"]{background:radial-gradient(circle,#546dff,#080c20)}.swatch-stones{background:radial-gradient(circle at 35% 35%,#fff 0 5%,#6bcff2 8%,#3422b6 46%,#130b29 60%),radial-gradient(circle at 65% 65%,#fff 0 5%,#ff8d88 8%,#8c2644 46%,#210912 60%)}.swatch-effect{background:radial-gradient(circle,#fff 0 5%,#79eaff 8%,transparent 22%),conic-gradient(from 20deg,#6cf0ff22,#f78cff33,#ffd56a22,#6cf0ff22)}.swatch-world{background:linear-gradient(160deg,#4b7bb5,#152342)}.catalog-copy b,.catalog-copy em,.catalog-copy small{display:block}.catalog-copy b{font-size:14px}.catalog-copy em{font-size:11px;color:#aeb8d2;font-style:normal;margin-top:3px}.catalog-copy small{font-size:10px;color:#7ce5ff;margin-top:4px}.catalog-state{font-size:9px;letter-spacing:.09em;color:#ffda8f;font-weight:900}@keyframes pulse{50%{transform:translateY(-2px)}}@keyframes fall{to{transform:translateY(105vh) rotate(520deg);opacity:0}}
@media(max-width:760px){.app{padding-left:12px;padding-right:12px}.topbar{height:64px}.brand span{display:none}.home-glass{display:block;padding-top:3vh}.hero{padding:20px}.hero h1{font-size:clamp(48px,16vw,72px)}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.home-side{margin-top:12px}.primary,.secondary,.tertiary{padding:15px 14px}.board{min-height:0;grid-template-columns:1fr;grid-template-rows:12% 1fr 1fr 12%;border-radius:28px;padding:14px;gap:7px;aspect-ratio:.68}.store{grid-column:1!important;grid-row:auto!important;border-radius:30px}.store2{grid-row:1!important}.top{grid-row:2}.bottom{grid-row:3}.store1{grid-row:4!important}.pits{grid-column:1;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:6px}.top .pit:nth-child(1){order:6}.top .pit:nth-child(2){order:5}.top .pit:nth-child(3){order:4}.top .pit:nth-child(4){order:3}.top .pit:nth-child(5){order:2}.top .pit:nth-child(6){order:1}.pit{aspect-ratio:1}.score-row{gap:6px}.mode-label{display:none}.player-card{padding:8px 10px}.player-card span{font-size:10px}.player-card b{font-size:20px}.catalog{grid-template-columns:1fr}.catalog-card{grid-template-columns:58px 1fr auto}.swatch{width:58px}.custom-head{display:block}.random-toggle{display:block;margin-top:12px;width:max-content}.world-preview{grid-template-columns:44px 1fr auto}.preview-icon{width:44px;height:44px}.game-foot{align-items:flex-start}}
@media(min-width:900px) and (orientation:landscape){#game.active .board{min-height:min(55vh,520px)}#game.active .board-shell{max-width:1080px;margin:auto}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}.atmosphere{display:none}}

/* v3 — classic Kalah board topology. Never reflow pits away from 2 x 6. */
.board{isolation:isolate;grid-template-columns:12.5% minmax(0,1fr) 12.5%;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:14px 12px;padding:28px 18px;border-radius:36px;aspect-ratio:2.32;min-height:0;overflow:visible}
.board:after{content:"";position:absolute;left:13.6%;right:13.6%;top:50%;height:3px;transform:translateY(-50%);background:linear-gradient(90deg,transparent,#3d1a0e 5%,#f4b96a55 50%,#3d1a0e 95%,transparent);box-shadow:0 -2px 0 #150906aa,0 2px 0 #ffc78126;z-index:0}
.board-rail{position:absolute;left:14.5%;right:14.5%;height:8px;border-radius:999px;background:linear-gradient(180deg,#e0a45d55,#2c1009 55%,#120807);box-shadow:inset 0 1px #ffe0af3d,0 2px 5px #0009;z-index:0;pointer-events:none}
.board-rail-top{top:47.7%}.board-rail-bottom{top:51.1%;opacity:.76}
.store{grid-row:1/3!important;overflow:hidden;border-radius:46% / 18%;border-width:2px;min-width:0;background:radial-gradient(ellipse at 50% 48%,#140b0c 0 50%,#2e1711 69%,#0a0505 77%);box-shadow:inset 0 18px 30px #000d,inset 0 -5px 10px #ffbc7030,0 2px 4px #0007}
.store2{grid-column:1!important}.store1{grid-column:3!important}
.store-name{position:absolute;z-index:4;top:10px;left:50%;transform:translateX(-50%);font-size:8px;line-height:1;letter-spacing:.09em;font-weight:900;color:#e7b96d99;white-space:nowrap}
.store-count{position:absolute;z-index:5;left:50%;bottom:9px;transform:translateX(-50%);display:grid;place-items:center;min-width:34px;height:26px;padding:0 8px;border-radius:999px;background:#08070ccc;border:1px solid #ffc96e55;font-size:18px!important;font-weight:950;color:var(--gold);text-shadow:0 0 22px #ffb84d66}
.store-stones{position:absolute;inset:17% 12% 16%;z-index:2;pointer-events:none}.store-stone-field{position:absolute;inset:0}.store-stones .stone{width:24%;}
.pits{grid-column:2!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-template-rows:1fr!important;gap:9px;align-items:center;overflow:visible}
.top{grid-row:1!important}.bottom{grid-row:2!important}
.pit{width:100%;aspect-ratio:1;border:1px solid #ffd0921a;background:radial-gradient(circle at 50% 58%,#0d0809 0 51%,#2b1714 66%,#9b5f38 69%,#422014 74%,#160a09 78%);box-shadow:inset 0 14px 22px #000d,inset 0 -3px 8px #f4ad6930,0 2px 4px #0007}
.pit-label{position:absolute;z-index:5;left:50%;transform:translateX(-50%);font-size:11px;font-weight:950;letter-spacing:.06em;color:#f2d0a2;text-shadow:0 2px 5px #000;pointer-events:none}.top .pit-label{top:-21px}.bottom .pit-label{bottom:-21px}
.pit-count{z-index:6;right:-2px;bottom:-2px;border:1px solid #ffffff12;box-shadow:0 2px 8px #0009}
.board-direction{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);font-size:7px;letter-spacing:.22em;color:#f2c98542;font-weight:900;pointer-events:none}

@media(max-width:760px){
  #game.active{padding-top:2px}
  .game-head{padding:3px 0 8px}.score-row{padding-bottom:6px}
  .board-shell{padding:18px 0 20px;margin-left:-4px;margin-right:-4px}
  .board{grid-template-columns:12.5% minmax(0,1fr) 12.5%!important;grid-template-rows:1fr 1fr!important;gap:8px 5px!important;padding:18px 8px!important;border-radius:20px!important;aspect-ratio:2.14!important;min-height:0!important;width:100%!important;overflow:visible!important}
  .store{grid-row:1/3!important;border-radius:48% / 18%!important}.store2{grid-column:1!important}.store1{grid-column:3!important}
  .pits{grid-column:2!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-template-rows:1fr!important;gap:3px!important}.top{grid-row:1!important}.bottom{grid-row:2!important}
  .top .pit:nth-child(n),.bottom .pit:nth-child(n){order:initial!important}
  .pit{aspect-ratio:1!important;min-width:0!important}.pit.legal:after{inset:-2px;border-width:1px;box-shadow:0 0 9px #4bd8ff77}
  .stones{inset:11%}.stone{width:31%}
  .pit-count{font-size:9px;min-width:17px;padding:2px;right:-1px;bottom:-2px}
  .pit-label{font-size:8px}.top .pit-label{top:-12px}.bottom .pit-label{bottom:-12px}
  .store-name{font-size:5px;top:7px;letter-spacing:.04em}.store-count{font-size:12px!important;min-width:25px;height:19px;bottom:5px;padding:0 5px}.store-stones{inset:18% 9% 18%}.store-stones .stone{width:28%}
  .board-rail{left:14%;right:14%;height:5px}.board-rail-top{top:47.5%}.board-rail-bottom{top:51.2%}.board-direction{font-size:4px}
  .game-foot{padding-top:5px}.hint{font-size:11px;max-width:55%}.small{padding:9px 12px}
}

@media(max-width:390px){
  .board{aspect-ratio:2.04!important;padding-left:6px!important;padding-right:6px!important;gap-left:3px!important}
  .pits{gap:2px!important}.pit-label{font-size:7px}.stones{inset:9%}.stone{width:32%}.store-name{display:none}
}

/* v4 — interaction clarity + stone-by-stone sowing */
.turn-pill{min-width:190px;padding:8px 18px;border-radius:18px;text-align:center;display:grid;gap:1px;line-height:1.05;transition:border-color .25s,box-shadow .25s,background .25s,transform .25s}
.turn-pill small{font-size:9px;letter-spacing:.18em;color:#7fe7ff;font-weight:950}.turn-pill strong{font-size:17px;color:#fff}.turn-pill em{font-size:9px;color:#b7c5dd;font-style:normal;font-weight:700;margin-top:2px}
body[data-turn="p2"] .turn-pill{border-color:#ffc96888;background:#2b180dbd;box-shadow:0 0 30px #ffb34b24}body[data-turn="p2"] .turn-pill small{color:#ffd184}
.player-card{position:relative;overflow:hidden;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease;padding-right:70px}.player-card:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#4bd8ff17,transparent 70%);opacity:0;transition:opacity .2s}.player-card.p2:before{background:linear-gradient(90deg,#ffbd5618,transparent 70%)}
.player-card.active-turn{transform:translateY(-2px);border-color:#66e7ff99;background:#072333e8;box-shadow:0 0 0 1px #55e5ff2c,0 0 28px #33d9ff22}.player-card.p2.active-turn{border-color:#ffc86499;background:#2a180ee8;box-shadow:0 0 0 1px #ffc86428,0 0 28px #ffb13d22}.player-card.active-turn:before{opacity:1}
.turn-badge{position:absolute;right:7px;top:50%;transform:translateY(-50%);font-size:8px;letter-spacing:.12em;font-style:normal;font-weight:950;color:#71809d;border:1px solid #ffffff14;border-radius:999px;padding:5px 7px;background:#030816aa}.active-turn .turn-badge{color:#8ff0ff;border-color:#4bd8ff66;background:#093044}.p2.active-turn .turn-badge{color:#ffd889;border-color:#ffc96866;background:#3d210d}.thinking .turn-badge{animation:badgePulse .8s ease-in-out infinite alternate}
.board-shell{isolation:isolate}.side-marker{position:absolute;left:50%;z-index:18;pointer-events:none;opacity:0;transform:translateX(-50%) scale(.92);transition:opacity .2s ease,transform .2s ease}.side-marker span{display:block;border:1px solid #4bd8ff88;background:#051c2ae8;color:#adf3ff;border-radius:999px;padding:5px 12px;font-size:8px;font-weight:950;letter-spacing:.13em;white-space:nowrap;box-shadow:0 0 22px #38dfff33;backdrop-filter:blur(8px)}.marker-p2{top:-2px}.marker-p1{bottom:-2px}.marker-p2 span{border-color:#ffc96888;background:#2a170be8;color:#ffda91;box-shadow:0 0 22px #ffb33d2d}.side-marker.active{opacity:1;transform:translateX(-50%) scale(1)}
body[data-turn="p1"] .board{box-shadow:inset 0 -12px 34px #42dcff18,inset 0 12px 28px #0007,0 20px 60px #0009}body[data-turn="p2"] .board{box-shadow:inset 0 12px 34px #ffc24c16,inset 0 -12px 28px #0007,0 20px 60px #0009}
.flying-stone{position:fixed;z-index:500;width:clamp(14px,3.1vw,25px);aspect-ratio:1;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 31% 26%,#fff 0 5%,var(--stoneA) 10%,var(--stoneB) 68%,#050611 100%);box-shadow:inset -3px -4px 7px #0008,inset 2px 2px 5px #fff5,0 7px 15px #000a,0 0 18px var(--stoneA);will-change:transform}.flying-stone:after{content:"";position:absolute;inset:-7px;border-radius:50%;background:radial-gradient(circle,var(--stoneA) 0,transparent 64%);opacity:.28;filter:blur(5px)}.flying-stone.capture{box-shadow:inset -3px -4px 7px #0008,inset 2px 2px 5px #fff5,0 7px 16px #000a,0 0 27px #ffd76d}.flying-stone.sweep{opacity:.9}
.pit.drop-hit,.store.drop-hit{animation:dropLand .34s cubic-bezier(.2,.9,.2,1)}.store.capture-hit{animation:captureStore .42s cubic-bezier(.2,.9,.2,1)}.pit.source-lift{animation:sourceLift .32s ease-out}.pit.source-lift:before{content:"";position:absolute;inset:5%;border-radius:50%;box-shadow:inset 0 0 0 2px #fff4,0 0 24px #fff2}
.pit.legal{cursor:pointer}.pit.legal:after{animation:legalBreath 1.35s ease-in-out infinite}.pit.legal:active{transform:scale(.94)}
@keyframes dropLand{0%{transform:scale(.94)}45%{transform:scale(1.075);filter:brightness(1.28)}100%{transform:scale(1);filter:none}}@keyframes captureStore{0%{filter:brightness(1)}50%{filter:brightness(1.55);box-shadow:inset 0 0 28px #ffd56e55,0 0 32px #ffcc6455}100%{filter:none}}@keyframes sourceLift{50%{filter:brightness(1.35);transform:scale(1.04)}}@keyframes legalBreath{0%,100%{opacity:.55;transform:scale(.98)}50%{opacity:1;transform:scale(1.035)}}@keyframes badgePulse{to{opacity:.5}} 
@media(max-width:760px){.game-head{display:grid;grid-template-columns:auto 1fr auto;gap:7px;align-items:center}.turn-pill{min-width:0;padding:7px 8px;border-radius:14px}.turn-pill small{font-size:7px}.turn-pill strong{font-size:13px}.turn-pill em{font-size:7px}.score-row{margin-top:3px}.player-card{min-height:44px;padding:7px 55px 7px 9px}.player-card b{font-size:18px}.turn-badge{font-size:6px;padding:4px 5px}.marker-p2{top:1px}.marker-p1{bottom:1px}.side-marker span{font-size:6px;padding:4px 8px}.board-shell{padding-top:22px!important;padding-bottom:22px!important}.back-btn{font-size:10px;padding:8px 9px}.flying-stone{width:17px}}
@media(prefers-reduced-motion:reduce){.flying-stone{transition:none}.side-marker,.turn-pill,.player-card{transition:none}.pit.legal:after{animation:none!important}}

.game-callout{position:fixed;z-index:650;left:50%;top:max(88px,calc(env(safe-area-inset-top) + 70px));transform:translate(-50%,-12px) scale(.94);opacity:0;display:grid;text-align:center;gap:2px;min-width:180px;padding:10px 18px;border-radius:18px;border:1px solid #4bd8ff88;background:#071827eb;box-shadow:0 12px 45px #000b,0 0 28px #38dfff2f;backdrop-filter:blur(15px);pointer-events:none;transition:opacity .22s ease,transform .22s cubic-bezier(.2,.9,.2,1)}.game-callout.show{opacity:1;transform:translate(-50%,0) scale(1)}.game-callout strong{font-size:15px;letter-spacing:.06em;color:#b5f4ff}.game-callout span{font-size:9px;color:#b8c6db}.game-callout.bonus{border-color:#ffc95f99;background:#2a190bec;box-shadow:0 12px 45px #000b,0 0 34px #ffb64330}.game-callout.bonus strong{color:#ffdc91}.game-callout.capture{border-color:#a974ff99;background:#1d1034ec;box-shadow:0 12px 45px #000b,0 0 34px #9f69ff35}.game-callout.capture strong{color:#d8bcff}

/* v5 - premium homes, slower/clearer AI, stronger turn hierarchy */
.store{position:relative!important;border-radius:34px!important;border:3px solid #9a5a2f!important;background:linear-gradient(90deg,#2e140d,#6f381f 7%,#3b1a10 13%,transparent 18% 82%,#3b1a10 87%,#6f381f 93%,#2e140d),radial-gradient(ellipse at 50% 50%,#0a0708 0 53%,#1b0d0b 55%,#3e2117 68%,#0b0606 72%)!important;box-shadow:inset 0 0 0 2px #d9975644,inset 0 18px 24px #000d,inset 0 -8px 16px #f5ad5d20,0 5px 12px #0008!important}
.store:before{content:"";position:absolute;inset:7px;border:1px solid #f0ba7360;border-radius:27px;pointer-events:none;box-shadow:inset 0 0 0 2px #2d120b,0 0 0 1px #120806}
.store:after{content:"";position:absolute;inset:16% 19% 18%;border-radius:42% / 18%;background:radial-gradient(ellipse at 50% 42%,#090607 0 59%,#20100d 70%,#4c2a1b 77%,#0c0706 81%);box-shadow:inset 0 16px 26px #000f,inset 0 -5px 11px #e58a4522;z-index:1;pointer-events:none}
.store-name{top:10px!important;z-index:8!important;display:flex!important;flex-direction:column;align-items:center;gap:2px;line-height:1!important;text-shadow:0 1px 3px #000!important}.store-name small{font-size:6px;letter-spacing:.14em;color:#d8a66eaa}.store-name b{font-size:9px;letter-spacing:.18em;color:#ffe1a8}
.store-stones{z-index:4!important;inset:24% 20% 23%!important}.store-count{z-index:9!important;bottom:10px!important;background:linear-gradient(#3c210f,#160b07)!important;border:1px solid #e6a95f88!important;box-shadow:inset 0 1px #fff2,0 3px 9px #0009!important;color:#ffe3a2!important}
body[data-turn="p1"] .store1,body[data-turn="p2"] .store2{border-color:#ffd073!important;box-shadow:inset 0 0 0 2px #ffc56f55,inset 0 18px 24px #000d,inset 0 -8px 16px #ffc15e33,0 0 24px #ffc05b2b,0 5px 12px #0008!important}
body[data-turn="p1"] .store1:before{border-color:#61e7ff90;box-shadow:inset 0 0 0 2px #2d120b,0 0 17px #4bd8ff45}body[data-turn="p2"] .store2:before{border-color:#ffd07390;box-shadow:inset 0 0 0 2px #2d120b,0 0 17px #ffc45a45}
.turn-pill{border:1px solid #55dcff80!important;background:linear-gradient(180deg,#0a3047e8,#061421e8)!important;box-shadow:0 8px 26px #0007,0 0 24px #43ddff2a!important}
body[data-turn="p2"] .turn-pill{border-color:#ffc76880!important;background:linear-gradient(180deg,#41250fe8,#211208e8)!important;box-shadow:0 8px 26px #0007,0 0 24px #ffbd4a2b!important}
.side-marker span{font-size:9px!important;padding:6px 14px!important;box-shadow:0 6px 18px #0008,0 0 26px #38dfff3b!important}.marker-p2 span{box-shadow:0 6px 18px #0008,0 0 26px #ffb33d3b!important}
.player-card.active-turn{transform:translateY(-2px) scale(1.015)!important}.player-card.active-turn .turn-badge{animation:turnBadgeGlow 1.15s ease-in-out infinite alternate}@keyframes turnBadgeGlow{to{filter:brightness(1.25);box-shadow:0 0 14px currentColor}}
body[data-turn="p1"] .bottom .pit.legal{filter:brightness(1.12)}body[data-turn="p2"] .top .pit.legal{filter:brightness(1.12)}
.flying-stone{filter:drop-shadow(0 0 8px var(--stoneA))}.pit.drop-hit:after{content:"";position:absolute;inset:14%;border-radius:50%;border:1px solid #fff7;animation:landingRing .32s ease-out forwards;pointer-events:none}@keyframes landingRing{from{transform:scale(.62);opacity:1}to{transform:scale(1.32);opacity:0}}
@media(max-width:760px){.store{border-radius:18px!important;border-width:2px!important}.store:before{inset:4px;border-radius:14px}.store:after{inset:19% 17% 21%;border-radius:38% / 16%}.store-name{top:5px!important}.store-name small{font-size:4px}.store-name b{font-size:6px}.store-stones{inset:27% 17% 25%!important}.store-count{bottom:4px!important}.side-marker span{font-size:7px!important;padding:5px 10px!important}}

/* v6 — illustrated living-world backdrops + final UX hierarchy */
.world::before{content:"";position:absolute;inset:-2%;z-index:1;background-image:var(--world-scene);background-size:cover;background-position:center 44%;filter:saturate(1.05) contrast(1.03);transform:scale(1.035);animation:sceneDrift 16s ease-in-out infinite alternate;opacity:.94}.world>.sky{z-index:2;opacity:.22}.world>.world-back{z-index:3;opacity:.34}.world>.world-mid{z-index:4;opacity:.58}.world>.world-front{z-index:5}.world>.atmosphere{z-index:7}.world>.world-vignette{z-index:9;background:linear-gradient(180deg,#02040a15 0 35%,#03060ca8 84%,#02030ad9 100%),radial-gradient(circle at 50% 35%,transparent 14%,#02040a42 66%,#02030ab8 100%)}
body[data-world="tropical"]{--world-scene:url('world-tropical.svg')}body[data-world="ember"]{--world-scene:url('world-ember.svg')}body[data-world="obsidian"]{--world-scene:url('world-obsidian.svg')}body[data-world="zen"]{--world-scene:url('world-zen.svg')}body[data-world="neon"]{--world-scene:url('world-neon.svg')}body[data-world="sunken"]{--world-scene:url('world-sunken.svg')}body[data-world="celestial"]{--world-scene:url('world-celestial.svg')}body[data-world="sakura"]{--world-scene:url('world-sakura.svg')}body[data-world="desert"]{--world-scene:url('world-desert.svg')}body[data-world="frozen"]{--world-scene:url('world-frozen.svg')}body[data-world="forest"]{--world-scene:url('world-forest.svg')}body[data-world="volcanic"]{--world-scene:url('world-volcanic.svg')}body[data-world="ocean"]{--world-scene:url('world-ocean.svg')}body[data-world="deco"]{--world-scene:url('world-deco.svg')}body[data-world="synth"]{--world-scene:url('world-synth.svg')}body[data-world="moon"]{--world-scene:url('world-moon.svg')}
@keyframes sceneDrift{from{transform:scale(1.035) translate3d(-.35%,0,0)}to{transform:scale(1.06) translate3d(.35%,-.45%,0)}}
#game.active .game-head,#game.active .score-row,#game.active .game-foot{position:relative;z-index:20}.board-shell{z-index:12}.board{backdrop-filter:none}
.turn-pill{position:relative;overflow:visible}.turn-pill:after{content:"";position:absolute;left:50%;bottom:-7px;transform:translateX(-50%) rotate(45deg);width:12px;height:12px;background:#0a3047;border-right:1px solid #55dcff80;border-bottom:1px solid #55dcff80}body[data-turn="p2"] .turn-pill:after{background:#41250f;border-color:#ffc76880}
.player-card.active-turn:after{content:"ACTIVE";position:absolute;inset:auto 8px 5px auto;font-size:6px;font-weight:950;letter-spacing:.16em;color:#8ff0ff}.player-card.p2.active-turn:after{color:#ffd889}
.board-shell:before{content:"";position:absolute;inset:13% -5% 8%;border-radius:50%;background:radial-gradient(ellipse,#0008,transparent 67%);filter:blur(14px);z-index:-1;pointer-events:none}
.board{border-color:#d79a54!important;box-shadow:inset 0 0 0 2px #2b1009,inset 0 0 0 4px #d99b5055,inset 0 14px 26px #ffffff10,0 22px 60px #000c,0 0 40px #0006!important}
.store-name{top:7px!important}.store-name small{display:block}.store-count{font-variant-numeric:tabular-nums}.store:after{box-shadow:inset 0 18px 28px #000f,inset 0 -5px 11px #e58a4522,0 0 0 1px #f5bd7040!important}
body[data-turn="p1"] .bottom:before,body[data-turn="p2"] .top:before{content:"";position:absolute;left:0;right:0;height:3px;border-radius:999px;pointer-events:none;opacity:.85}body[data-turn="p1"] .bottom:before{bottom:-29px;background:linear-gradient(90deg,transparent,#52e4ff,#52e4ff,transparent);box-shadow:0 0 15px #4bd8ff}body[data-turn="p2"] .top:before{top:-29px;background:linear-gradient(90deg,transparent,#ffc965,#ffc965,transparent);box-shadow:0 0 15px #ffc15a}
.game-foot{margin-top:5px;padding:11px 12px;border:1px solid #ffffff13;background:#06101bd6;border-radius:17px;backdrop-filter:blur(14px);box-shadow:0 8px 28px #0007}.hint{font-weight:760;color:#e2ecff}
@media(max-width:760px){.world::before{background-position:center 42%;transform:scale(1.08);opacity:.98}.world-vignette{background:linear-gradient(180deg,#02040a10 0 28%,#03060c8f 78%,#02030ad6 100%)}.player-card.active-turn:after{display:none}.turn-pill:after{width:9px;height:9px;bottom:-5px}.game-foot{margin-left:-2px;margin-right:-2px}.store-name b{font-size:5.5px!important}.store-name small{font-size:3.5px!important}.store:after{inset:18% 15% 19%!important}}
@media(prefers-reduced-motion:reduce){.world::before{animation:none!important;transform:scale(1.03)}}


/* v7 — contained stores + one-screen match layout */
body[data-screen="game"]{overflow:hidden;height:100dvh;min-height:100dvh}
body[data-screen="game"] .app{height:100dvh;min-height:0;max-height:100dvh;overflow:hidden;padding-top:max(8px,env(safe-area-inset-top));padding-bottom:max(8px,env(safe-area-inset-bottom))}
body[data-screen="game"] .topbar{display:none}
body[data-screen="game"] main{height:100%;min-height:0}
body[data-screen="game"] #game.active{height:100%;min-height:0;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:5px;overflow:hidden}
body[data-screen="game"] .game-head{padding:0;min-height:47px}
body[data-screen="game"] .score-row{padding:0;min-height:46px}
body[data-screen="game"] .board-shell{min-height:0;padding:18px 0!important;display:grid;place-items:center;align-self:stretch;overflow:visible}
body[data-screen="game"] .board{width:100%;height:auto;max-height:100%;aspect-ratio:2.14;min-height:0;overflow:hidden!important;isolation:isolate;gap:8px 9px}
body[data-screen="game"] .game-foot{margin:0;min-height:48px;padding:7px 9px}

/* Stores must never paint over A1/A6/B1/B6. All emphasis is inset. */
.store{overflow:hidden!important;isolation:isolate;contain:paint;z-index:3!important}
.store1,.store2{filter:none!important;transform:none!important}
body[data-turn="p1"] .store1,body[data-turn="p2"] .store2{
  box-shadow:inset 0 0 0 2px #ffc56f72,inset 0 0 22px #ffc15e42,inset 0 18px 24px #000d,inset 0 -8px 16px #ffc15e2b,0 4px 9px #0007!important;
}
body[data-turn="p1"] .store1:before,body[data-turn="p2"] .store2:before{box-shadow:inset 0 0 0 2px #2d120b,inset 0 0 15px currentColor!important}
.pits{z-index:4!important;min-width:0}
.pit{z-index:1;overflow:visible}

@media(max-width:760px){
  body[data-screen="game"] .app{padding-left:max(7px,env(safe-area-inset-left));padding-right:max(7px,env(safe-area-inset-right))}
  body[data-screen="game"] #game.active{gap:3px}
  body[data-screen="game"] .game-head{min-height:40px;gap:5px}
  body[data-screen="game"] .game-head .back-btn{height:34px;padding:0 9px;font-size:9px}
  body[data-screen="game"] .turn-pill{padding:5px 8px;line-height:1.02}
  body[data-screen="game"] .turn-pill small{font-size:6px}.turn-pill strong{font-size:12px}.turn-pill em{font-size:6px;margin-top:2px}
  body[data-screen="game"] .score-row{min-height:39px;gap:5px}
  body[data-screen="game"] .player-card{min-height:37px;padding:5px 44px 5px 7px;border-radius:12px;gap:5px}
  body[data-screen="game"] .player-card span{font-size:9px}.player-card b{font-size:16px}.mode-label{font-size:8px;text-align:center;white-space:nowrap}
  body[data-screen="game"] .board-shell{padding:15px 0!important}
  body[data-screen="game"] .board{grid-template-columns:11.5% minmax(0,1fr) 11.5%!important;grid-template-rows:1fr 1fr!important;gap:7px 7px!important;padding:15px 7px!important;border-radius:18px!important;aspect-ratio:2.14!important;overflow:hidden!important}
  body[data-screen="game"] .pits{gap:3px!important}
  body[data-screen="game"] .store{border-radius:15px!important;contain:paint!important;overflow:hidden!important}
  body[data-screen="game"] .store:before{inset:3px!important;border-radius:11px!important}
  body[data-screen="game"] .store:after{inset:18% 15% 19%!important}
  body[data-screen="game"] .store-name{top:4px!important}.store-name small{font-size:3px!important}.store-name b{font-size:5px!important}
  body[data-screen="game"] .store-count{bottom:3px!important;min-width:22px;height:17px;font-size:11px!important;padding:0 4px}
  body[data-screen="game"] .store-stones{inset:25% 15% 24%!important}
  body[data-screen="game"] .pit-label{font-size:7px}.top .pit-label{top:-11px}.bottom .pit-label{bottom:-11px}
  body[data-screen="game"] .pit-count{font-size:8px;min-width:15px;padding:2px}
  body[data-screen="game"] .game-foot{min-height:41px;padding:5px 7px;border-radius:13px;gap:5px}
  body[data-screen="game"] .game-foot .hint{font-size:10px;line-height:1.15;max-width:55%}
  body[data-screen="game"] .game-foot .secondary.small{padding:8px 9px;font-size:9px;border-radius:11px}
}

/* Extra compression for short iPhones / landscape-height browsers. */
@media(max-height:700px){
  body[data-screen="game"] #game.active{grid-template-rows:36px 34px minmax(0,1fr) 36px;gap:2px}
  body[data-screen="game"] .game-head{min-height:36px}.score-row{min-height:34px}
  body[data-screen="game"] .board-shell{padding:12px 0!important}
  body[data-screen="game"] .game-foot{min-height:36px;padding:3px 6px}
  body[data-screen="game"] .player-card{min-height:32px;padding-top:3px;padding-bottom:3px}
  body[data-screen="game"] .turn-pill{padding-top:4px;padding-bottom:4px}
}

@media(max-width:390px){
  body[data-screen="game"] .board{grid-template-columns:11% minmax(0,1fr) 11%!important;gap:6px 5px!important;padding-left:5px!important;padding-right:5px!important}
  body[data-screen="game"] .pits{gap:2px!important}
  body[data-screen="game"] .game-foot .hint{font-size:9px}
}
