:root{font-family:system-ui,-apple-system,Hiragino Kaku Gothic ProN,Noto Sans JP,sans-serif;color:#f1f6ff;background:#101b32;color-scheme:dark;font-synthesis:none}*{box-sizing:border-box}body{margin:0}[hidden]{display:none!important}button,a.secondary{font:inherit;color:inherit;border:1px solid #435d7e;border-radius:9px;background:#213553;cursor:pointer;touch-action:manipulation}button:disabled{cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ffcb72;outline-offset:2px}#app{min-height:100dvh;display:flex;flex-direction:column;padding:max(8px,env(safe-area-inset-top)) max(9px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(9px,env(safe-area-inset-left));background:radial-gradient(ellipse at 8% 0%,#223e65,#101b32 64%)}.menu{width:min(100%,970px);margin:auto;padding:24px clamp(6px,2.5vw,24px);display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,5vw,58px);align-items:center}.brand{color:#ffcb72;font-weight:800;letter-spacing:.08em}.title-copy h1{margin:8px 0 15px;font-size:clamp(30px,4.4vw,54px);letter-spacing:-.065em;line-height:1.12}.title-copy h1 span{color:#ffcb72}.title-copy p{color:#d1dfef;line-height:1.65}.title-art{display:flex;gap:8px;margin-top:20px}.title-art span{display:grid;width:clamp(55px,9vw,88px);aspect-ratio:1;place-items:center;border-radius:12px;background:#2d4970;border:1px solid #5a779e}.title-art svg{width:80%;height:80%;fill:#d8eeff}.title-art .mystery{color:#ffcb72;border:2px dashed #cb9c51;background:#253552;font-size:clamp(28px,5vw,50px);font-weight:900}.panel{background:#192942;border:1px solid #425979;border-radius:20px;padding:clamp(15px,3vw,30px)}.panel h2{margin:0 0 12px}.main-modes{display:grid;gap:8px}.mode-choice{text-align:left;padding:9px 13px}.mode-choice strong,.mode-choice small{display:block}.mode-choice small{margin-top:2px;opacity:.86}.mode-choice:disabled,.regions button:disabled{opacity:.52}.primary{background:#ffcb72;color:#182438;border-color:#ffcb72;font-weight:800}.regions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:8px}.regions button{min-height:42px;padding:5px}.linked-mode{outline:2px solid #ffcb72}.hint,details{color:#d0dbed;font-size:.85rem}details{margin-top:12px;line-height:1.55}summary{cursor:pointer}details p{margin:8px 0}#play{height:calc(100dvh - max(8px,env(safe-area-inset-top)) - max(8px,env(safe-area-inset-bottom)));min-height:355px;display:flex;flex-direction:column;gap:5px}.game-header{display:flex;align-items:center;gap:6px 16px;flex-wrap:wrap}.game-header h2{font-size:clamp(15px,2vw,24px);margin:0}.stats{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:clamp(11px,1.18vw,15px)}.stats strong{color:#ffe2a7;font-variant-numeric:tabular-nums}#quit{margin-left:auto;padding:3px 12px}.status{margin:0;min-height:1.4em;font-size:clamp(11px,1.2vw,14px);color:#d1dfef}.boards{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,65fr) minmax(0,35fr);gap:6px}.board{min-height:0;display:flex;flex-direction:column;gap:4px;border-radius:10px;padding:5px;background:#253953}.board h3{font-size:13px;margin:0}.board small{color:#ccd9eb;font-weight:400;margin-left:5px}.shape-grid,.name-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(var(--columns),minmax(0,1fr));grid-template-rows:repeat(var(--rows),minmax(0,1fr));gap:3px}.shape-card,.name-card{min-width:0;min-height:0;display:grid;place-items:center;padding:0;border-radius:5px;transition:background .12s,border-color .12s}.shape-card{background:#eaf5ff;border-color:#93afcf}.shape-card svg{display:block;width:100%;height:100%;min-height:0}.shape-card path{fill:#244d76}.shape-card[aria-pressed=true]{background:#ffdb9f;border-color:#bd6b16;box-shadow:inset 0 0 0 2px #bd6b16}.name-board{--key-bg: #e5f2ff;--key-border: #7caed7;--key-text: #174f81;background:#244265}.name-board.mode-clear{--key-bg: #fff0d8;--key-border: #dfa452;--key-text: #744308;background:#59402a}.name-card{background:var(--key-bg);border-color:var(--key-border);color:var(--key-text);font-size:clamp(10px,1.14vw,17px);font-weight:700;white-space:nowrap}.regional .name-card{font-size:clamp(14px,2.4vw,30px)}.name-card.wrong{background:#ffb8b8;border-color:#da2b38;color:#8c1422}.gone{visibility:hidden}.mode-label{display:inline-block;padding:2px 7px;margin-left:4px;border-radius:999px;font-size:11px;color:var(--key-text);background:var(--key-bg)}.empty-shapes{margin:auto;text-align:center}.result{width:min(100%,610px);margin:auto}.result-score{font-size:clamp(34px,8vw,66px);font-weight:850;color:#ffcb72;font-variant-numeric:tabular-nums}#personalBest{color:#ffe2a7;font-weight:750}.result-actions{display:flex;flex-wrap:wrap;gap:8px}.result-actions :is(button,a){display:inline-flex;align-items:center;padding:10px 15px;text-decoration:none}@media(max-width:670px){.menu{grid-template-columns:1fr;gap:18px}.status{min-height:2.8em}}@media(orientation:portrait){#play{height:auto;flex:1}.boards{grid-template-columns:1fr}.shape-grid,.empty-shapes{height:clamp(335px,85vw,660px);flex:none}.empty-shapes{display:grid;place-items:center;margin:0}.name-grid{height:clamp(460px,78vw,570px);flex:none}.name-card{font-size:clamp(12px,2.8vw,17px)}.regional .boards{grid-template-rows:minmax(min-content,1fr) auto}.regional :is(.shape-grid,.empty-shapes){height:auto;min-height:clamp(180px,57vw,460px);flex:1}.regional .name-grid{height:auto;grid-template-rows:repeat(var(--rows),minmax(44px,1fr))}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}.result-card{position:relative;margin:16px 0;overflow:hidden;border-radius:12px}.result-card img{display:block;width:100%;height:auto}.result-card-light{position:absolute;inset:0;pointer-events:none;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.result-card-light:before{content:"";position:absolute;width:70%;aspect-ratio:1;left:75%;top:51%;background:conic-gradient(transparent 68%,#fff 96%,transparent);animation:result-map-sweep 1.1s ease-out both}@keyframes result-map-sweep{0%{transform:translate(-50%,-50%) rotate(-90deg);opacity:0}16%{opacity:1}83%{opacity:1}to{transform:translate(-50%,-50%) rotate(270deg);opacity:0}}.result-card[data-rank=gold]{animation:result-card-glow .65s ease-out}@keyframes result-card-glow{45%{box-shadow:0 0 18px #ffca787a}}@media(prefers-reduced-motion:reduce){.result-card-light:before,.result-card[data-rank=gold]{animation:none}.result-card-light{display:none}}