.clean-board-frame--hex{--clean-board-max-width:1050px;width:min(100%, var(--clean-board-max-width))}.hex-board-stack{justify-items:center;gap:clamp(.65rem,1.4vw,1rem);width:100%;display:grid}.hex-mobile-swap{background:linear-gradient(145deg,#231d1ff5,#0e0c0dfa);border:1px solid #ffffff17;border-radius:.9rem;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.65rem;width:min(100%,25rem);margin:0 auto .55rem;padding:.55rem .6rem;display:none;box-shadow:0 12px 28px #0000004d,inset 0 1px #ffffff09}.hex-mobile-swap__sides{background:#0000003d;border:1px solid #ffffff12;border-radius:.65rem;justify-content:center;align-items:center;gap:.28rem;min-width:3.75rem;min-height:2.4rem;display:flex}.hex-mobile-swap__sides svg{flex:none;width:.78rem;height:.78rem}.hex-mobile-swap__side{border-radius:50%;flex:none;width:.7rem;height:.7rem;display:block;box-shadow:0 2px 5px #00000080}.hex-mobile-swap__side.is-red{background:var(--primary);border:1px solid #ffffff29}.hex-mobile-swap__side.is-white{background:#f1efe9;border:1px solid #ffffffb3}.hex-mobile-swap__copy{gap:.12rem;min-width:0;display:grid}.hex-mobile-swap__copy strong{color:#fffffff0;font-size:.72rem;font-weight:780;line-height:1.15}.hex-mobile-swap__copy span{color:#efeee96b;font-size:.58rem;line-height:1.25}.hex-mobile-swap button{border:1px solid color-mix(in srgb, var(--primary) 55%, transparent);background:color-mix(in srgb, var(--primary) 20%, #0a0809eb);color:#fff;white-space:nowrap;cursor:pointer;border-radius:.65rem;flex:none;min-height:2.4rem;padding-inline:.72rem;font-size:.62rem;font-weight:760;transition:border-color .15s,background .15s,transform .15s}.hex-mobile-swap button:hover{border-color:color-mix(in srgb, var(--primary) 78%, white);background:color-mix(in srgb, var(--primary) 30%, #0a0809eb)}.hex-mobile-swap button:focus-visible{outline:2px solid color-mix(in srgb, var(--ring) 82%, white);outline-offset:2px}.hex-mobile-swap button:active{transform:scale(.97)}.hex-board-shell{width:100%;padding:clamp(.55rem,2.2cqi,1.25rem);position:relative}.hex-board{isolation:isolate;width:100%;aspect-ratio:var(--hex-board-ratio);filter:none;position:relative}.hex-swap-extension{z-index:4;pointer-events:none;position:absolute;inset:0}.hex-swap-extension__cells{z-index:0;position:absolute;inset:0}.hex-swap-extension__cell{left:var(--hex-swap-left);top:var(--hex-swap-top);width:var(--hex-cell-width);aspect-ratio:.866025;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);transform-origin:0;background:#2f2629;display:block;position:absolute}.hex-swap-extension__surface{z-index:1;clip-path:polygon(68.43% 4.25%,71.5% 1.39%,74.57% 4.25%,77.64% 1.39%,80.71% 4.25%,83.78% 1.39%,86.86% 4.25%,89.93% 1.39%,93% 4.25%,96.07% 1.39%,99.14% 4.25%,99.14% 9.97%,96.07% 12.82%,96.07% 18.54%,93% 21.4%,89.93% 18.54%,86.86% 21.4%,83.78% 18.54%,80.71% 21.4%,77.64% 18.54%,74.57% 21.4%,71.5% 18.54%,71.5% 12.82%,68.43% 9.97%);pointer-events:none;background:linear-gradient(145deg,#393032 0%,#2f2629 46%,#251f22 100%);display:block;position:absolute;inset:0}.hex-swap-extension__content{z-index:2;flex-direction:column;justify-content:center;align-items:center;gap:clamp(.4rem,.7vw,.6rem);width:30.71%;height:20.01%;display:flex;position:absolute;top:1.39%;left:68.43%}.hex-swap-extension__copy{text-align:left;text-shadow:0 1px 8px #000000b8;white-space:nowrap;align-items:baseline;gap:.28rem;display:flex}.hex-swap-extension__copy strong{color:#ffffffeb;font-size:clamp(.6rem,.78vw,.82rem);font-weight:780;line-height:1.15}.hex-swap-extension__copy span{color:#efeee95c;font-size:clamp(.5rem,.62vw,.64rem);line-height:1.25}.hex-swap-extension__content button{color:#ffffffe6;white-space:nowrap;cursor:pointer;pointer-events:auto;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#0a080985;border:1px solid #efeee921;border-radius:.55rem;min-height:clamp(1.65rem,2.5vw,2.15rem);padding-inline:clamp(.45rem,.8vw,.75rem);font-size:clamp(.52rem,.68vw,.68rem);font-weight:750;transition:border-color .15s,background .15s,color .15s}.hex-swap-extension__content button:hover{color:#fff;background:#7e97397a;border-color:#d8ff6b85}.hex-swap-extension__content button:focus-visible{outline:2px solid color-mix(in oklch, var(--ring) 92%, transparent);outline-offset:2px}.hex-board__plate{z-index:0;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0;overflow:visible}.hex-board__plate-cell{stroke:none}.hex-board__grooves{fill:none;stroke-linecap:round;stroke-linejoin:round}.hex-board__grooves--highlight{stroke:#ffffff13;stroke-width:.052px}.hex-board__grooves--shadow{stroke:#030203d1;stroke-width:.032px}.hex-cell{z-index:1;left:var(--hex-left);top:var(--hex-top);width:var(--hex-cell-width);aspect-ratio:.866025;appearance:none;cursor:pointer;clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%);background:0 0;border:0;padding:0;position:absolute}.hex-cell:disabled{cursor:default}.hex-cell__surface{clip-path:inherit;box-shadow:none;background:0 0;place-items:center;transition:background .15s,filter .15s,transform .15s;display:grid;position:absolute;inset:1.2%}.hex-cell:not(:disabled):hover .hex-cell__surface,.hex-cell:not(:disabled):focus-visible .hex-cell__surface{filter:brightness(1.08)}.hex-cell:focus-visible{outline:none}.hex-cell:focus-visible .hex-cell__surface{box-shadow:inset 0 0 0 3px #efeee97a, 0 0 18px color-mix(in oklch, var(--ring) 38%, transparent)}.hex-stone{aspect-ratio:1;width:76%;height:auto;transform-style:preserve-3d;border-radius:999px;animation:.24s cubic-bezier(.2,.9,.22,1.2) both hex-stone-place;display:block;box-shadow:0 12px 18px #0000003d,inset 0 0 0 1px #d8c18d29}.hex-stone--red{background:radial-gradient(circle at 34% 24%,#ffe2e2eb,#0000 22%),radial-gradient(circle at 58% 82%,#4e621757,#0000 36%),linear-gradient(#98b947 0%,#7fa82b 42%,#5b781e 74%,#2c3d12 100%)}.hex-stone--white{background:radial-gradient(circle at 31% 24%,#fff 0 10%,#0000 24%),radial-gradient(circle at 55% 72%,#d9d1c3,#0000 68%),linear-gradient(145deg,#fffef9 0%,#eee8dd 55%,#aaa298 100%)}.hex-stone--preview{opacity:0;filter:saturate(.9);transition:opacity .14s;animation:none;scale:.86}.hex-cell:not(:disabled):hover .hex-stone--preview,.hex-cell:not(:disabled):focus-visible .hex-stone--preview{opacity:.38}.hex-cell.is-last-move .hex-cell__surface:after{content:"";aspect-ratio:1;border-radius:50%;width:18%;position:absolute}.hex-cell.has-red.is-last-move .hex-cell__surface:after{background:#fff;box-shadow:0 0 0 1px #efeee97a,0 0 7px #efeee938}.hex-cell.has-white.is-last-move .hex-cell__surface:after{background:#cbff3b;box-shadow:0 0 0 1px #72911cb3,0 0 7px #cbff3b85}.hex-cell.is-tutorial-rejected .hex-stone{animation:.48s ease-in-out both tutorial-rejected-disc}.hex-boundary{z-index:5;pointer-events:none;display:block;position:absolute;inset:0}.hex-boundary.is-white{filter:drop-shadow(0 0 5px #efeee924);background:#ffffffe0}.hex-boundary.is-white.is-north{z-index:8}.hex-boundary.is-red{filter:drop-shadow(0 0 5px #cbff3b57);background:#cbff3b}.hex-cell.is-winning{z-index:2;overflow:visible}.hex-cell.has-red.is-winning .hex-cell__surface{box-shadow:none;background:#819942ad}.hex-cell.has-white.is-winning .hex-cell__surface{box-shadow:none;background:#a8adb666}@keyframes hex-stone-place{0%{opacity:0;transform:scale(.45)translateY(-28%)}to{opacity:1;transform:scale(1)translateY(0)}}.clean-game-layout:has(.clean-board-frame--hex){grid-template-columns:minmax(0,1fr) 380px;gap:clamp(1rem,2vw,2rem);width:min(100%,1480px)}@media (min-width:1101px){.clean-game-shell .clean-game-layout:fullscreen:has(.clean-board-frame--hex){grid-template-columns:minmax(0,min(60vw,1020px)) minmax(380px,min(32vw,540px))}}.clean-board-stage:has(.clean-board-frame--hex){min-height:min(80svh,840px)}@media (max-width:1050px){.clean-game-layout:has(.clean-board-frame--hex){grid-template-columns:minmax(0,1fr)}}@media (max-width:700px),(orientation:landscape) and (max-width:1100px) and (max-height:600px){.hex-mobile-swap{display:grid}.hex-swap-extension{display:none}}@media (max-width:700px){.hex-board-shell{padding:.65rem}}@media (max-width:360px){.hex-mobile-swap{grid-template-columns:minmax(0,1fr) auto;gap:.5rem;padding:.5rem}.hex-mobile-swap__sides{display:none}.hex-mobile-swap__copy strong{font-size:.68rem}.hex-mobile-swap__copy span{font-size:.54rem}.hex-mobile-swap button{padding-inline:.62rem;font-size:.58rem}}@media (orientation:landscape) and (max-width:1100px) and (max-height:600px){.clean-game-layout[data-game-match-layout]:has(.clean-board-frame--hex){grid-template-columns:minmax(0,1fr) clamp(16rem,42vw,24rem);gap:.5rem}.clean-game-shell .clean-game-layout[data-game-match-layout]:fullscreen:has(.clean-board-frame--hex){grid-template-columns:minmax(0,1fr) clamp(16rem,42vw,24rem);gap:.5rem}.clean-game-layout[data-game-match-layout]:has(.clean-board-frame--hex) .clean-board-frame--hex{aspect-ratio:auto;justify-self:center;width:min(100%,max(20rem,157dvh - 7.85rem));height:auto;max-height:none}.clean-game-layout[data-game-match-layout] .clean-board-stage.has-board-extras .clean-board-frame--hex{width:min(100%,max(20rem,157dvh - 11rem))}}@media (prefers-reduced-motion:reduce){.hex-stone,.hex-cell.is-tutorial-rejected .hex-stone{animation:none}}[data-board-surface=ivory][data-game-id=hex] .hex-board__plate-cell{fill:var(--board-surface-light-mid)}[data-board-surface=ivory][data-game-id=hex] .hex-board__grooves--highlight{stroke:var(--board-groove-highlight-light)}[data-board-surface=ivory][data-game-id=hex] .hex-board__grooves--shadow{stroke:var(--board-groove-shadow-light)}[data-board-surface=ivory][data-game-id=hex] .hex-swap-extension__cell{background:var(--board-surface-light-mid)}[data-board-surface=ivory][data-game-id=hex] .hex-swap-extension__surface{background:linear-gradient(145deg, var(--board-surface-light-high) 0%, var(--board-surface-light-mid) 48%, var(--board-surface-light-low) 100%)}