:root{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#edf5ff;background:#081321;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px}button,select{font:inherit}button{cursor:pointer}.app{min-height:100dvh;max-width:780px;margin:auto;padding:env(safe-area-inset-top) 16px env(safe-area-inset-bottom);display:flex;flex-direction:column;background:radial-gradient(circle at 10% 10%,#163762 0,#0b1b32 34%,#081321 70%)}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;letter-spacing:.1em}.brand-icon{width:34px;height:34px;display:grid;place-items:center;color:#0b1730;background:#9af6f7;clip-path:polygon(50% 0,63% 35%,100% 50%,63% 65%,50% 100%,37% 65%,0 50%,37% 35%)}.brand strong{display:block;font-size:14px}.brand small{display:block;font-size:8px;color:#83a7c8;letter-spacing:.16em;margin-top:3px}.text-button{border:0;background:transparent;color:#89dcec;font-size:12px;padding:10px}.setup{margin:auto 0;max-width:520px;padding:20px 4px 28px}.eyebrow,.mission,.turn-label{font-size:11px;letter-spacing:.18em;color:#7ce3e8;font-weight:800}.setup h1{font-size:clamp(44px,11vw,80px);line-height:1.03;margin:20px 0 18px;letter-spacing:-.06em}.setup h1 em{font-style:normal;color:#9af6f7}.setup p{max-width:390px;color:#b5c5d8;line-height:1.6}.setting{margin:18px 0;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid #29415b;padding:6px 0 17px}.setting label{font-size:14px}.setting select{border:1px solid #385873;border-radius:10px;background:#122b46;color:#fff;padding:10px;min-width:180px}.primary{border:0;border-radius:14px;padding:15px 22px;background:#93f1ee;color:#0c1a2c;font-weight:900;box-shadow:0 8px 24px #29ddd93b}.primary span{margin-left:20px}.primary:disabled{opacity:.5}.roster{display:flex;flex-wrap:wrap;gap:7px;margin-top:26px}.roster-item{border:1px solid currentColor;border-radius:999px;padding:7px 11px;font-size:11px}.red{--tone:#fd7079;color:#fd7079}.green{--tone:#54daac;color:#54daac}.yellow{--tone:#ffd866;color:#ffd866}.blue{--tone:#73a8ff;color:#73a8ff}.rules{position:fixed;z-index:20;inset:80px 16px auto;max-width:500px;margin:auto;background:#183653;border:1px solid #74cdd4;border-radius:18px;padding:20px;box-shadow:0 25px 80px #000a;line-height:1.6}.rules h2{margin:0 0 8px}.rules button{padding:10px 16px;border:0;border-radius:8px;background:#9af6f7;color:#061521}.play{flex:1;display:flex;flex-direction:column;gap:14px}.mission{display:flex;align-items:center;justify-content:space-between}.player-strip{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.player-card{display:flex;align-items:center;gap:8px;border:1px solid #29445f;border-radius:10px;padding:6px 8px;opacity:.58;background:#0d253d}.player-card.active{border-color:var(--tone);opacity:1;box-shadow:0 0 16px color-mix(in srgb,var(--tone),transparent 77%)}.player-card .avatar{display:grid;place-items:center;width:29px;height:29px;flex:none;border-radius:8px;background:var(--tone);color:#092035;font-weight:900}.player-card strong{display:block;font-size:12px}.player-card small{display:block;color:#a9bdd0;font-size:8px;letter-spacing:.08em;margin-top:2px}.board{width:min(100%,520px);aspect-ratio:1;margin:0 auto;display:grid;grid-template-columns:repeat(15,1fr);grid-template-rows:repeat(15,1fr);background:#092038;border:3px solid #88d8e3;border-radius:12px;overflow:hidden;box-shadow:0 14px 40px #0009}.cell{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;min-height:0;border:1px solid #23425d;background:#0b2138}.cell.track{background:#d3e9f0;border-color:#5c9aae}.cell.home.red{background:#702c41}.cell.home.green{background:#1c6a60}.cell.home.yellow{background:#7a6530}.cell.home.blue{background:#2c5085}.cell.lane.red,.cell.start.red{background:#ffadb3}.cell.lane.green,.cell.start.green{background:#8be7c5}.cell.lane.yellow,.cell.start.yellow{background:#ffe297}.cell.lane.blue,.cell.start.blue{background:#a4c2ff}.cell.center{background:#235575}.safe{position:absolute;color:#526b81;font-size:clamp(8px,2vw,15px)}.core{color:#b8fbf8;font-size:18px}.piece{z-index:2;border:2px solid #fff8;border-radius:50%;width:75%;height:75%;min-width:0;min-height:0;padding:0;background:var(--tone);color:#092035;font-size:clamp(6px,1.6vw,12px);font-weight:900;box-shadow:0 2px 4px #0008}.piece:disabled{cursor:default}.piece.selectable{box-shadow:0 0 0 3px #fff,0 0 12px 6px var(--tone);animation:pulse 1.2s infinite}.cell:has(.piece:nth-of-type(2)) .piece{width:45%;height:65%;font-size:7px}.cell:has(.piece:nth-of-type(3)) .piece{width:31%;height:55%}@keyframes pulse{50%{transform:scale(1.12)}}.control{display:flex;align-items:center;gap:12px;padding:14px;background:#122b45;border:1px solid #2c526e;border-radius:14px}.turn{flex:1;min-width:0}.turn strong{display:block;font-size:13px;margin-top:5px;line-height:1.3}.die{width:42px;height:42px;display:grid;place-items:center;flex:none;border-radius:9px;background:#f1fcff;color:#122f4a;font-weight:900;font-size:25px;box-shadow:0 3px 8px #0007}.roll{padding:12px 15px;white-space:nowrap;font-size:12px}.choose-hint{font-size:11px;color:#b8d7e6}footer{text-align:center;color:#64859e;font-size:9px;letter-spacing:.1em;padding:18px 0 10px}@media(max-width:430px){.app{padding-left:8px;padding-right:8px}.topbar{height:64px}.play{gap:8px}.control{padding:8px;gap:7px}.player-card{padding:5px}.player-card .avatar{width:23px;height:23px}.player-card strong{font-size:10px}.turn strong{font-size:11px}.die{width:35px;height:35px}.roll{padding:10px 8px}}@media(prefers-reduced-motion:reduce){.piece.selectable{animation:none}}.online-setup{display:grid;gap:10px;margin-top:28px;padding-top:22px;border-top:1px solid #29415b}.online-label{font-size:10px;font-weight:900;letter-spacing:.17em;color:#7ce3e8}.secondary{border:1px solid #6abcc8;border-radius:10px;background:#173b55;color:#d9ffff;padding:11px 14px;font-weight:800;font-size:12px}.secondary:disabled{opacity:.5}.join-row{display:flex;gap:8px}.join-row input{flex:1;min-width:0;background:#0a2036;border:1px solid #385873;border-radius:10px;color:#fff;padding:10px 12px;letter-spacing:.13em;font:inherit;font-size:13px}.room-banner{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:8px 12px;background:#183d50;border:1px solid #76cdd2;border-radius:12px}.room-banner small{display:block;font-size:9px;letter-spacing:.12em;color:#b1dce4}.room-banner strong{display:block;font-size:19px;letter-spacing:.2em;margin-top:2px}.error{margin:8px 0;padding:10px 13px;border:1px solid #fa8585;border-radius:9px;color:#ffd5d5;background:#653044;font-size:12px}.cinema-banner{position:relative;height:clamp(185px,38vw,248px);border:1px solid #6ad9e8;border-radius:18px;margin:16px 0 20px;overflow:hidden;background-image:linear-gradient(0deg,#071b35d9,#071b3533 35%,#071b3500 75%),url(/assets/hikari-scene-clean.png);background-size:cover,auto 145%;background-position:center,center 47%;box-shadow:0 14px 35px #0008,0 0 27px #44c6df44}.cinema-banner span{position:absolute;left:16px;bottom:17px;color:#e8ffff;font-size:10px;font-weight:900;letter-spacing:.22em;text-shadow:0 2px 8px #001e34}.cinema-banner img{position:absolute;right:12px;bottom:11px;width:58px;height:58px;object-fit:cover;border-radius:12px;border:1px solid #b6fbff;box-shadow:0 0 16px #15b9e8bb}.setup h1{max-width:530px}.play{position:relative;isolation:isolate}.play:before{content:"";position:absolute;inset:0;z-index:-1;background:url(/assets/hikari-crystal.png) center 15% / cover no-repeat;opacity:.07;pointer-events:none}@media(max-width:480px){.cinema-banner{height:202px}.setup h1{font-size:clamp(42px,11vw,58px)}}footer a{color:#89dcec;text-decoration:none}footer a:hover{text-decoration:underline}.about-series{grid-column:1/-1;margin-top:20px;border-top:1px solid #345773;padding-top:6px;color:#bbd2df;font-size:13px}.about-series summary{min-height:48px;padding:14px 4px;cursor:pointer;color:#b8dce5;touch-action:manipulation}.about-series summary:focus-visible{outline:3px solid #e8ff9e;outline-offset:2px}.setup .about-series p{margin:0 4px 8px;font-size:13px;line-height:1.5}.about-series a{display:inline-flex;flex-direction:column;min-height:48px;padding:10px 4px;color:#9af1eb;line-height:1.5;text-decoration:underline;text-underline-offset:3px;touch-action:manipulation}.about-series a>span{display:block}.about-series a small{color:#94b3c7;font-size:11px;text-decoration:none}.quick-steps{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0 22px}.quick-steps span{border:1px solid #345e78;border-radius:8px;background:#0b2940;padding:7px 9px;color:#d4e8f1;font-size:11px}.quick-steps b{color:#89e5e9;margin-right:5px}.token-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.choice{display:flex;align-items:center;gap:10px;min-height:56px;border:1px solid var(--tone);border-radius:12px;background:#102a42;color:#eefaff;padding:8px 12px;text-align:left;font-size:12px;font-weight:800}.choice-num{display:grid;place-items:center;width:34px;height:34px;flex:none;border-radius:50%;background:var(--tone);color:#092035;font-weight:900;font-size:15px;box-shadow:0 0 13px color-mix(in srgb,var(--tone),transparent 40%)}.choice:active{transform:scale(.98)}.result-actions{display:flex;gap:9px;flex-wrap:wrap}.result-actions .primary,.result-actions .secondary{flex:1;min-width:150px}.primary,.secondary,.text-button{min-height:46px;touch-action:manipulation}.roll{min-height:48px}.piece{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #e8ff9e;outline-offset:2px}.player-card strong{font-size:13px}.player-card small{font-size:10px}footer{font-size:11px}footer a{display:inline-block;padding:7px 4px}@media(max-width:430px){.player-card strong{font-size:11px}.player-card small{font-size:9px}.turn strong{font-size:12px}.quick-steps span{font-size:10px}.choice{min-height:54px}}.result-panel{border:1px solid #74dfe6;border-radius:16px;background:linear-gradient(135deg,#174861,#10273f);padding:16px;box-shadow:0 0 24px #22c4d333}.result-eyebrow{display:block;color:#90e8eb;font-size:10px;font-weight:900;letter-spacing:.18em}.result-panel>strong{display:block;margin:8px 0 5px;color:#efffff;font-size:clamp(18px,5vw,27px)}.result-panel p{margin:0 0 15px;color:#bad3dd;font-size:12px;line-height:1.5}@media(orientation:landscape)and (max-height:480px)and (min-width:650px){.app{max-width:960px;padding-left:14px;padding-right:14px}.topbar{height:48px;min-height:48px}.play{display:grid;grid-template-columns:minmax(260px,1fr) minmax(260px,.95fr);grid-auto-rows:min-content;align-content:start;column-gap:14px;row-gap:7px}.mission{grid-column:1/-1}.board{grid-column:1;grid-row:2/span 6;width:min(100%,calc(100dvh - 102px));justify-self:center}.room-banner,.player-strip,.control,.token-choices,.result-panel{grid-column:2}.room-banner{padding:5px 9px}.player-card{padding:4px 6px}.player-card .avatar{width:24px;height:24px}.control{padding:7px}.result-panel{padding:9px}.result-panel p{margin-bottom:8px}footer{padding-top:8px}}@media(orientation:landscape)and (max-height:480px)and (min-width:650px){.setup{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-auto-rows:min-content;gap:6px 16px;align-content:start;max-width:none;padding:4px 0 20px;margin:0}.setup>.eyebrow{grid-column:1;grid-row:1}.cinema-banner{grid-column:1;grid-row:2/span 5;height:238px;margin:0;background-size:cover,auto 135%}.setup h1{grid-column:2;grid-row:1;font-size:30px;margin:0}.setup p{grid-column:2;grid-row:2;margin:0;max-width:none;font-size:11px;line-height:1.3}.quick-steps{grid-column:2;grid-row:3;margin:0;gap:4px}.quick-steps span{padding:4px 6px}.setting{grid-column:2;margin:0;padding:3px 0 5px}.setting label{font-size:12px}.setting select{min-width:170px;padding:5px}.setup>.primary{grid-column:2;min-height:44px;padding:9px 15px}.online-setup{grid-column:2;margin-top:4px;padding-top:7px;gap:5px}.roster{grid-column:1;margin-top:3px;align-self:end}}.dialog-backdrop{position:fixed;inset:0;z-index:30;background:#03111ccb;display:grid;place-items:center;padding:20px}.exit-dialog{width:min(100%,380px);background:#173a55;border:1px solid #8ce5e7;border-radius:18px;padding:21px;box-shadow:0 24px 80px #000b}.exit-dialog h2{margin:0 0 9px;font-size:22px}.exit-dialog p{color:#c8dce8;line-height:1.5;margin:0 0 18px}.exit-dialog>div{display:flex;gap:9px;flex-wrap:wrap}.exit-dialog button{flex:1;min-width:120px}.top-actions{display:flex;align-items:center;gap:2px}.settings-toggle{display:grid;place-items:center;min-width:46px;min-height:46px;border:0;background:transparent;color:#91e9ef;font-size:23px;touch-action:manipulation}.settings-panel{position:fixed;z-index:25;top:70px;right:12px;width:min(340px,calc(100vw - 24px));border:1px solid #83dfe6;border-radius:16px;background:#122f49;box-shadow:0 22px 60px #000b;padding:16px}.settings-row{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:48px;border-bottom:1px solid #315675;color:#e6f8ff;font-size:13px}.settings-row button{border:1px solid #6ecdd5;border-radius:9px;background:#0c2439;color:#a5f4f2;min-width:80px;min-height:40px;font-weight:800}.settings-row button[aria-pressed=false]{color:#bfd0df;border-color:#4c6a80}.settings-row input{width:145px;accent-color:#8befee}.settings-panel>.secondary{margin-top:12px;width:100%}.board-stage{display:block;position:relative}.board-stage canvas{display:block;width:100%;height:100%;touch-action:manipulation}.render-note{color:#b7dbe1;font-size:11px;text-align:center}@media(max-width:430px){.topbar .brand small{font-size:7px}.topbar .brand strong{font-size:12px}.top-actions .text-button{font-size:11px;padding:7px}.settings-toggle{min-width:42px}}.board-stage canvas{position:absolute;inset:0}.loading-board{display:grid;place-items:center;color:#b4e9ee;font-size:13px;font-weight:800}.board-stage{aspect-ratio:1}@media(orientation:portrait)and (max-height:680px){.topbar{height:48px;min-height:48px}.play{gap:6px}.player-card{padding-top:4px;padding-bottom:4px}}.profile-hint,.fine-print{font-size:11px!important;color:#94b5c9!important;line-height:1.5!important}.profile-hint{margin:0!important}.die-tray{position:relative;flex:none;width:84px;height:84px;border:1px solid #74bfcf66;border-radius:18px;background:radial-gradient(ellipse at 50% 35%,#3b6576,#102a3e 75%);box-shadow:inset 0 0 18px #06172499,0 4px 12px #0005;overflow:hidden}.die-canvas{position:absolute;inset:0}.die-canvas canvas{display:block;width:100%;height:100%}.die-tray small{position:absolute;right:5px;bottom:3px;background:#092035;color:#affff4;border-radius:5px;min-width:19px;padding:1px 4px;text-align:center;font-weight:900;font-size:11px}.die-fallback{position:absolute;inset:0;display:grid;place-items:center;color:#fff;font-size:32px;font-weight:900}.die-tray.requesting{border-color:#adffef}.animation-label{font-size:11px;letter-spacing:.08em;color:#a9e7e4;text-align:center;margin:0;min-height:17px}.social-bar{margin-top:14px;border-top:1px solid #30536d;padding-top:7px}.social-heading{display:flex;align-items:center;justify-content:space-between}.social-heading small{font-size:10px;letter-spacing:.17em;color:#83dce0;font-weight:800}.reaction-buttons{display:flex;gap:6px;overflow-x:auto;padding:3px 0 8px}.reaction-buttons button{flex:none;min-height:44px;padding:8px 12px;font-size:11px}.reaction-log{min-height:24px;color:#c6e2ec;font-size:12px}.reaction-log p{margin:4px 0}.reaction-log strong{color:#98eee9;margin-right:5px}.community-backdrop{position:fixed;inset:0;z-index:40;background:#020c17e6;display:flex;justify-content:center;align-items:center;padding:14px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.community-hub{width:min(100%,650px);max-height:calc(100dvh - 28px);display:flex;flex-direction:column;overflow:auto;overscroll-behavior:contain;background:linear-gradient(155deg,#183c55,#0a1c30 60%);border:1px solid #78d7dd;border-radius:22px;padding:20px;box-shadow:0 30px 100px #000b}.community-hub>header{display:flex;justify-content:space-between;gap:14px;align-items:center}.community-hub h2{font-size:23px;letter-spacing:-.035em;margin:6px 0 15px}.community-hub h3{font-size:21px;letter-spacing:-.025em;margin:20px 0 10px}.community-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;border-bottom:1px solid #345773;padding:8px 0 13px}.community-tabs button{min-height:46px;border:1px solid #42617a;border-radius:10px;background:#0c2237;color:#b8cddd;font-size:12px;touch-action:manipulation}.community-tabs button.selected{color:#082637;background:#9af1eb;border-color:#b8fff4;font-weight:900}.community-content p{font-size:13px;line-height:1.6;color:#bbd2df}.profile-card{display:flex;align-items:center;gap:13px;margin-top:12px}.profile-card h3{margin:0 0 6px}.profile-card small{display:block;font-size:10px;color:#8fb8cd;letter-spacing:.09em;overflow-wrap:anywhere}.profile-emblem{display:grid;place-items:center;width:62px;height:62px;border:1px solid #93f7eb;border-radius:18px;background:#286675;color:#c2ffed;font-size:34px;box-shadow:0 0 30px #3cdbcd22}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:22px 0}.stat-grid>div{padding:13px 7px;border:1px solid #3e627b;border-radius:12px;background:#0b253b;text-align:center}.stat-grid b{display:block;color:#c3fff4;font-size:24px}.stat-grid span{display:block;color:#95b6c9;font-size:10px;margin-top:5px}.profile-option{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:13px}.profile-option select{min-height:46px;border:1px solid #527b91;border-radius:10px;background:#0e2a42;color:#fff;padding:8px 14px}.listing-option{display:flex;align-items:flex-start;gap:12px;margin:20px 0 5px;font-size:13px;line-height:1.5}.listing-option input{width:22px;height:22px;flex:none;accent-color:#9af1eb;margin:0}.league-filter{display:flex;gap:9px;margin:16px 0}.league-filter button[aria-pressed=true]{background:#8cddd9;color:#092537}.league-list,.crew-list,.match-history{list-style:none;margin:14px 0;padding:0}.league-list li,.crew-list li,.match-history li{display:flex;align-items:center;gap:12px;padding:14px 5px;border-bottom:1px solid #30516b;color:#e2f9ff;font-size:13px}.league-list li>span,.crew-list li>span,.match-history li>span{flex:1;min-width:0;overflow-wrap:anywhere}.league-list li>b{color:#83dbe6;font-size:17px;min-width:30px}.league-list li>strong,.match-history li>strong{color:#b4f5d7;white-space:nowrap}.league-list small,.crew-list small,.match-history small{display:block;font-size:10px;color:#8caec4;margin-top:5px}.league-list .is-you{background:#55e8d511;border-radius:10px;padding-left:8px;padding-right:8px}.achievement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.achievement{display:flex;gap:10px;border:1px solid #36546d;border-radius:14px;background:#102a40;padding:15px;opacity:.7}.achievement.unlocked{border-color:#9ce3c5;background:linear-gradient(140deg,#22555a,#123344);opacity:1}.achievement>span{color:#7c9bb0;font-size:28px}.achievement.unlocked>span{color:#e4f7b0;text-shadow:0 0 16px #c2ff8977}.achievement>div{min-width:0;flex:1}.achievement h4{margin:0;font-size:13px}.achievement p{margin:6px 0;font-size:11px;line-height:1.4}.achievement progress{width:100%;height:6px;accent-color:#a2f4d6}.achievement small{font-size:10px;color:#accdce}.save-state{color:#a8f1df!important;font-size:12px;line-height:1.5}.delete-confirm{border:1px solid #c48189;border-radius:12px;padding:12px;margin-top:16px}.danger{color:#f1adb1}.community-hub>.error{flex:none}.community-content>.join-row input{font-size:11px;letter-spacing:.04em}@media(max-width:430px){.die-tray{width:65px;height:65px;border-radius:14px}.community-hub{padding:14px;border-radius:17px}.community-hub h2{font-size:20px}.community-tabs button{font-size:10px}.achievement-grid{grid-template-columns:1fr}.stat-grid{gap:5px}.stat-grid b{font-size:21px}.community-backdrop{padding:8px}.community-hub{max-height:calc(100dvh - 16px)}.top-actions .text-button{padding:5px}.top-actions .settings-toggle{min-width:38px}}@media(prefers-reduced-motion:reduce){.choice:active{transform:none}}.community-hub{overflow:hidden}.community-hub>header,.community-tabs{flex:none}.community-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 2px 8px}.community-tabs button{overflow:hidden;text-overflow:ellipsis;padding:6px 3px}.reduced-motion .piece.selectable{animation:none}.reduced-motion .choice:active{transform:none}