@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:Manrope,system-ui,sans-serif;color:#f6f0d9;background:#0b1c18;font-synthesis:none;color-scheme:dark}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #ecce81;outline-offset:4px}button:disabled{opacity:.45;cursor:default}button{border:0}button:hover:not(:disabled){filter:brightness(1.15)}.game{max-width:1800px;min-height:100vh;margin:auto;background:#102a24;box-shadow:0 0 100px #0009}header{height:70px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;background:#0d211de8;border-bottom:1px solid #a7c09120}.brand{font-size:21px;letter-spacing:5px;font-weight:800;text-decoration:none;color:#e8e7d6;line-height:1}.brand span{display:block;font-size:8px;letter-spacing:5px;margin-top:8px;text-align:center}.prototype{font-size:10px;letter-spacing:2.5px;color:#bcc7af}.prototype i{display:inline-block;height:6px;width:6px;background:#b7d387;border-radius:50%;margin-right:8px}.icon{border:1px solid #d6d7aa40;background:#ffffff05;width:36px;height:36px;border-radius:50%;font-size:18px}.stage{position:relative;min-height:630px;height:calc(100vh - 248px);max-height:850px;background:linear-gradient(0deg,#102a24 0%,transparent 30%),url('assets/background/background-1.png') center 44%/cover;display:flex;flex-direction:column;align-items:center;padding-top:12px;isolation:isolate}.stage:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#071c2260,transparent 45%,#071c2220);z-index:-1}.logo{width:200px;height:100px;object-fit:contain;filter:drop-shadow(0 5px 12px #071e20b0)}.mode{font-size:10px;font-weight:800;letter-spacing:3px;color:#f9eec5;text-shadow:0 2px 5px #000;margin:0 0 12px}.board-wrap{position:relative;width:min(640px,70vw);aspect-ratio:2268/1483;background:url('assets/background/board.png') center/100% 100%;filter:drop-shadow(0 15px 24px #001810b0);flex-shrink:0}.board{position:absolute;left:17.8%;right:19.4%;top:24%;bottom:10.2%;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,1fr);background:#0c2523;overflow:hidden;border-radius:5px;gap:2px;padding:3px;box-shadow:inset 0 0 35px #000b}.cell{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;border-radius:5px;background:linear-gradient(145deg,#18363170,#0a201d70);overflow:hidden}.cell img{width:98%;height:98%;object-fit:contain;user-select:none;filter:drop-shadow(0 3px 4px #0005)}.cell.landing img{animation:land .25s ease-out}.cell.winning{background:#d7b75555;box-shadow:inset 0 0 0 2px #f7df85}.cell.winning img{animation:win .8s ease-in-out infinite alternate}.cell.sticky{background:#165d375c;box-shadow:inset 0 0 0 1px #a5db6c90}.cell.spinning img,.cell.spinning .placeholder{animation:roll .13s linear infinite;filter:blur(2px)}.placeholder{display:flex;align-items:center;justify-content:center;flex-direction:column;width:90%;height:90%;border-radius:15%;border:2px solid #9ab94d;background:radial-gradient(ellipse,#537444,#1b3c2c);box-shadow:inset 0 0 15px #0007}.placeholder .glyph{font-size:clamp(20px,3.3vw,42px);line-height:1.05}.placeholder small{font-size:8px;font-weight:800;letter-spacing:1px;color:#f1e3a4;margin-top:3px}.placeholder.scatter{background:radial-gradient(ellipse,#a985db,#363254 55%,#b1a383 59%,#4c5348 72%);border-color:#d8b466}.placeholder.scatter .glyph{color:#eae1ff;text-shadow:0 0 10px #fff}.path-label{position:absolute;z-index:4;pointer-events:none;border:1px solid #d5f18c;border-radius:20px;background:#143b27ee;color:#edffc5;font-size:14px;font-weight:800;padding:3px 11px;box-shadow:0 0 18px #86db5a60;transform:translate(-50%,-50%)}.slash{position:absolute;height:5px;background:#efffc7;box-shadow:0 0 20px 7px #b2ee5f;border-radius:50%;transform-origin:left;animation:slash .6s ease-out forwards}.message{font-family:'Cormorant Garamond',Georgia,serif;text-align:center;font-size:23px;letter-spacing:.3px;min-height:32px;margin-top:-3px;color:#f8e9bd;text-shadow:0 2px 5px #000;padding:0 15px}.bonus-strip{display:flex;gap:35px;font-size:8px;letter-spacing:1.3px;margin-top:9px;color:#a9bbaa}.bonus-strip span{display:flex;gap:8px}.bonus-strip b{color:#dfd6b3;font-weight:600}.swords{position:absolute;left:4%;top:42%;width:170px}.eyebrow{font-size:8px;letter-spacing:1.7px;color:#c5c8ab}.swords>div{display:flex;gap:10px;align-items:center;margin-top:18px}.swords img{width:54px;height:54px;object-fit:contain;filter:drop-shadow(0 3px 6px #0009)}.swords span span,.swords>div>span{font-size:7px;letter-spacing:1px;line-height:1.8;color:#c7d3be}.swords b{display:block;color:#f2df9a;font-size:14px;letter-spacing:.5px}.console{position:relative;display:flex;justify-content:center;align-items:center;gap:42px;min-height:112px;background:linear-gradient(110deg,#142e26,#0b211b);border-top:1px solid #dfd09a30;border-bottom:1px solid #dfd09a15;box-shadow:0 -15px 40px #081b1960}.meter>span,.bet-control>span{font-size:9px;color:#a9baa8;letter-spacing:1.8px;display:block;margin-bottom:8px}.meter strong{font-size:24px;font-weight:500;font-variant-numeric:tabular-nums}.meter small{display:block;font-size:7px;letter-spacing:1.5px;margin-top:4px;color:#91a58d}.win{min-width:125px}.win strong{color:#eed68e}.bet-control{text-align:center}.bet-control>div{display:flex;gap:16px;align-items:center}.bet-control strong{font-size:19px;min-width:46px;font-weight:500}.bet-control button{border:1px solid #7e94753d;border-radius:50%;width:28px;height:28px;background:#ffffff05;font-size:17px}.spin{width:83px;height:83px;border-radius:50%;background:linear-gradient(140deg,#e8de98,#b9a450);color:#23361c;border:4px solid #284630;outline:1px solid #d6c67b90;display:flex;align-items:center;justify-content:center;flex-direction:column;box-shadow:0 0 35px #b5d75b20}.spin>span{font-size:47px;line-height:39px}.spin b{font-size:9px;letter-spacing:2px}.spin:disabled{opacity:.8}.spin.busy>span{animation:rotate 1s linear infinite}#turbo[aria-pressed=true]{color:#edda87;border-color:#edda87}footer{min-height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 4%;font-size:8px;color:#889c8b;letter-spacing:1px}footer button{font-size:9px;color:#c8cbb0;background:none;padding:12px}footer i{font-style:normal;margin:0 8px}.lab{padding:24px 4%;background:#091e19;border-top:1px solid #47614b}.lab p{font-size:11px;color:#9bb29e}.lab-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.lab-buttons button{background:#1b3c2e;border:1px solid #496344;border-radius:6px;font-size:11px;padding:10px 15px}.lab-buttons button.selected{background:#6b7541;border-color:#d6dd91}dialog{background:linear-gradient(135deg,#193e30,#10251f);color:#eee9ce;border:1px solid #8a9e62;border-radius:15px;max-width:510px;width:calc(100% - 30px);padding:40px;box-shadow:0 20px 100px #000a}dialog::backdrop{background:#03130fd9;backdrop-filter:blur(8px)}dialog h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:38px;font-weight:500;margin:12px 0}dialog p,dialog li{font-size:13px;color:#c2d0b7;line-height:1.8}dialog ul{padding-left:18px}.close{position:absolute;right:15px;top:10px;background:none;color:#becbb2;font-size:25px}.primary{padding:14px 28px;background:#d6c981;color:#23361c;font-size:12px;font-weight:800;border-radius:5px;margin-top:16px;letter-spacing:1px}.bonus-icon{font-size:50px}.bonus-tier{font-size:10px;letter-spacing:3px;color:#cfdb9c}body.bonus .stage{background-image:linear-gradient(0deg,#102a24 0%,transparent 30%),url('assets/background/background-3.png')}@keyframes roll{from{transform:translateY(-60%)}to{transform:translateY(65%)}}@keyframes land{0%{transform:translateY(-50%)}70%{transform:translateY(7%)}100%{transform:translateY(0)}}@keyframes win{to{transform:scale(1.07);filter:drop-shadow(0 0 8px #eac768)}}@keyframes slash{from{scale:0 1;opacity:1}70%{scale:1 1;opacity:1}to{opacity:0}}@keyframes rotate{to{transform:rotate(360deg)}}
@media(min-width:1500px){.board-wrap{width:790px}.swords{left:8%}}@media(max-width:1100px){.swords{display:none}.board-wrap{width:min(640px,92vw)}}@media(max-height:850px) and (min-width:700px){.stage{min-height:540px;height:calc(100vh - 220px)}.logo{width:160px;height:80px}.board-wrap{width:min(560px,70vw)}header{height:56px}.console{min-height:105px}.message{font-size:21px}.bonus-strip{margin-top:5px}}@media(max-width:650px){header{height:58px;padding:0 20px}.brand{font-size:16px}.prototype{font-size:7px;letter-spacing:1px}.stage{min-height:440px;height:calc(100svh - 270px);max-height:650px;justify-content:center;padding:12px 0 20px}.logo{width:200px;height:112px}.mode{font-size:8px;margin-bottom:8px;letter-spacing:2px}.board-wrap{width:99vw}.message{font-size:18px;margin-top:8px;min-height:44px;max-width:95%}.bonus-strip{gap:12px;font-size:6px;letter-spacing:.3px}.bonus-strip span{display:block;text-align:center}.bonus-strip b{display:block;margin-top:4px}.console{gap:14px;padding:15px 12px;flex-wrap:wrap;min-height:135px}.meter strong{font-size:19px}.meter>span,.bet-control>span{font-size:7px;letter-spacing:1px}.meter small{font-size:6px}.win{min-width:75px}.bet-control>div{gap:7px}.bet-control strong{font-size:16px;min-width:36px}.bet-control button{width:23px;height:23px}.spin{width:68px;height:68px}.spin>span{font-size:38px;line-height:32px}#turbo{display:none}footer{padding:0 12px;flex-wrap:wrap;font-size:6px;gap:2px}footer button{font-size:8px;padding:10px 3px}.placeholder small{font-size:5px;letter-spacing:.3px}.placeholder .glyph{font-size:26px}.path-label{font-size:10px;padding:2px 7px}dialog{padding:30px}dialog h1{font-size:32px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* Spine shares a stage-local overlay so dialogs, controls and path labels layer normally. */
.board-wrap{filter:none}
.cell.in-flight{overflow:visible;z-index:2}
.cell.in-flight>img,.cell.in-flight>.placeholder{animation:none;will-change:transform}
.cell.landing img,.cell.winning img{animation:none}
.cell.winning{background:#52603b60;box-shadow:inset 0 0 0 1px #eddb8e88}
.board.show-connections .cell:not(.winning){opacity:.55;transition:opacity .16s ease}
.cell{transition:background .18s ease,box-shadow .18s ease,opacity .18s ease}
.sticky-visitor{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:4;filter:drop-shadow(0 2px 4px #0008)}
.visitor-layer{position:absolute;left:17.8%;right:19.4%;top:24%;bottom:10.2%;overflow:hidden;border-radius:5px;pointer-events:none}
.sticky-visitor>.placeholder{width:65%;height:65%;border-width:1px}
.sticky-visitor .glyph{font-size:clamp(18px,2.6vw,30px)}
.sticky-visitor small{font-size:6px}
.path-sweep{position:absolute;background:linear-gradient(0deg,#8ecb3e10,#edffc4b0,#8ecb3e10);border-block:1px solid #dcffa8;box-shadow:0 0 14px #caff9a80;transform-origin:var(--origin) center}
.path-sweep.sword-0{filter:sepia(.8)}
.path-sweep.sword-1{filter:hue-rotate(55deg) saturate(.4)}
.cell.path-arrival{background:#8ab94a65;box-shadow:inset 0 0 15px #e6ffb799}
.cell.attacking{box-shadow:inset 0 0 18px #e6ffb7bb}
.payline-overlay{position:absolute;left:17.8%;top:24%;width:62.8%;height:65.8%;overflow:visible;z-index:7;pointer-events:none}
.payline-trace{fill:none;stroke:#ffe5a0;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 4px #cbb76a);vector-effect:non-scaling-stroke}
.payline-overlay circle{fill:#fff3c9;stroke:#b59045;stroke-width:2;vector-effect:non-scaling-stroke}
.line-caption{position:absolute;left:50%;top:94%;transform:translate(-50%,-50%);padding:4px 12px;border:1px solid #bca86680;border-radius:12px;background:#102a24f0;color:#ffedbc;font-size:10px;letter-spacing:1px;white-space:nowrap;z-index:8}
.cell.line-active{box-shadow:inset 0 0 0 2px #ffe6a0, inset 0 0 20px #cfb56a35}
.attack-trail .payline-trace{stroke:var(--sword-color);stroke-width:5;filter:drop-shadow(0 0 6px var(--sword-color))}
.attack-award{position:absolute;transform:translate(-50%,-50%);padding:3px 8px;border:1px solid #e4efb9;background:#173c29f5;border-radius:12px;color:#f2ffd5;font-size:13px;font-weight:800;z-index:8;pointer-events:none}
#effects{position:absolute;inset:0;z-index:3;pointer-events:none}
.stage>spine-overlay{z-index:2;pointer-events:none}
.cell .spine-art{position:absolute;inset:1%;width:98%;height:98%;pointer-events:none}
.spine-ready>img{visibility:hidden}
.cell.spine-ready.winning img{animation:none}
.mascot{position:absolute;right:8%;top:30%;width:170px;height:350px;pointer-events:none}
.mascot>img{position:absolute;width:100%;height:100%;object-fit:contain}
.mascot .spine-art{position:absolute;inset:0;width:100%;height:100%}
.mascot>span{position:absolute;bottom:-16px;left:0;right:0;text-align:center;font-size:7px;letter-spacing:1.5px;color:#e6e2ba;text-shadow:0 2px 6px #000}
@media(max-width:1200px){.mascot{right:6%;width:140px;height:310px}}
@media(max-width:1000px){.mascot{top:5px;right:6%;width:90px;height:150px}.mascot>span{font-size:6px;letter-spacing:.7px;bottom:-5px}}
@media(max-width:650px){.mascot{top:10px;right:4%;width:64px;height:110px}.mascot>span{display:none}}

.mode-toolbar{display:flex;gap:14px;align-items:center;justify-content:center;padding:10px 15px;background:#102a24;border-top:1px solid #62754d40;font-size:10px}.mode-toolbar label{letter-spacing:1.5px;color:#b8c5aa}.mode-toolbar select{background:#1a382a;border:1px solid #75885880;border-radius:5px;color:#f4edcf;padding:7px;max-width:270px;font:inherit}.mode-toolbar>span{color:#c4cfac;min-width:150px}.gaia-anchor{position:absolute;width:5.5%;height:auto;transform:translate(-50%,-40%);filter:drop-shadow(0 1px 4px #000);border-radius:5px}.scatter-overlay{position:absolute;right:2px;top:0;color:#e8d1ff;font-size:18px;font-weight:800;text-shadow:0 0 4px #000;z-index:5}.slash.sword-0{box-shadow:0 0 12px 4px #c2b484}.slash.sword-1{box-shadow:0 0 16px 5px #e1f4ff}.slash.sword-2{box-shadow:0 0 20px 7px #a2ed62}details{font-size:12px;line-height:1.8}summary{cursor:pointer;color:#ecda9e}
@media(max-width:650px){.mode-toolbar{gap:6px;flex-wrap:wrap;padding:8px;font-size:9px}.mode-toolbar label{font-size:7px}.mode-toolbar>span{min-width:0}.mode-toolbar select{max-width:200px}.scatter-overlay{font-size:13px}}