:root{color-scheme:light;--bg: oklch(1 0 0);--surface: oklch(.985 .01 243);--surface-strong: oklch(.945 .032 243);--ink: oklch(.24 .055 248);--muted: oklch(.44 .045 248);--primary: oklch(.56 .15 242);--primary-dark: oklch(.42 .15 244);--primary-soft: oklch(.86 .07 243);--green: oklch(.62 .15 145);--green-dark: oklch(.4 .12 146);--sun: oklch(.84 .16 88);--sun-dark: oklch(.55 .13 72);--danger: oklch(.58 .2 28);--danger-soft: oklch(.93 .055 29);--path: oklch(.89 .1 83);--path-edge: oklch(.67 .11 75);--grass: oklch(.69 .16 139);--grass-dark: oklch(.47 .14 145);--water: oklch(.66 .13 224);--focus: oklch(.7 .18 86);--shadow: oklch(.25 .08 245 / 22%);--radius: 8px;--control-size: 3.4rem}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:radial-gradient(circle at 18% 8%,oklch(.82 .12 220 / 65%) 0 15rem,transparent 15.2rem),linear-gradient(135deg,#00629c,#0083b3,#00a6c9 46%,#2eb7a6,#57c578);background:radial-gradient(circle at 18% 8%,oklch(.82 .12 220 / 65%) 0 15rem,transparent 15.2rem),linear-gradient(135deg,color(xyz 0.109 0.111 0.424),color(xyz 0.163 0.196 0.518),color(xyz 0.239 0.315 0.62) 46%,#2eb7a6,#57c578)}button,input{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.58}button:focus-visible,input:focus-visible{outline:3px solid var(--focus);outline-offset:3px}h1,h2,h3,p{margin-top:0}.primary-button,.secondary-button,.icon-button,.tab,.level-button,.avatar-choice,.word-card,.home-links button{border:0}.primary-button{min-height:2.9rem;padding:.75rem 1.15rem;border-radius:999px;color:#fff;background:linear-gradient(180deg,var(--primary),var(--primary-dark));font-weight:800;box-shadow:0 5px 8px var(--shadow)}.primary-button:hover{filter:brightness(1.05)}.secondary-button{min-height:2.75rem;padding:.68rem 1rem;border:1px solid oklch(.79 .06 242);border-radius:999px;color:var(--primary-dark);background:#f3f9ff;font-weight:750}.secondary-button:hover{background:var(--primary-soft)}.secondary-button.small{min-height:2.2rem;padding:.4rem .85rem}.secondary-button.wide{width:100%}.icon-button{width:3.1rem;height:3.1rem;border-radius:var(--radius);color:#fff;background:linear-gradient(180deg,oklch(.7 .12 232),var(--primary));font-size:1.35rem;font-weight:900;box-shadow:0 4px 8px var(--shadow)}.icon-button.quiet{color:var(--primary-dark);background:var(--surface);box-shadow:none}.mini-badge{display:inline-flex;width:fit-content;align-items:center;gap:.35rem;padding:.28rem .65rem;border-radius:999px;color:var(--primary-dark);background:var(--primary-soft);font-size:.85rem;font-weight:850}.avatar-dot{display:inline-grid;width:2.35rem;height:2.35rem;place-items:center;border-radius:50%;background:#fff4de;background:oklch(.97 .05 84);font-size:1.35rem}.home-page,.result-page{width:min(1180px,calc(100% - 2rem));margin:0 auto;padding:2rem 0}.home-hero{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:1.2rem;align-items:stretch;min-height:34rem}.home-copy,.home-start-panel,.home-panel,.result-panel{border:1px solid oklch(.82 .09 236 / 68%);border-radius:var(--radius);background:#ffffffed;box-shadow:0 6px 10px var(--shadow)}.home-copy{position:relative;overflow:hidden;padding:2.4rem;color:#fff;background:linear-gradient(0deg,#00243e73,#00243e1f),radial-gradient(circle at 76% 22%,var(--sun) 0 5rem,transparent 5.2rem),linear-gradient(145deg,var(--primary-dark),var(--primary) 48%,var(--green));background:linear-gradient(0deg,color(xyz 0.016 0.016 0.065 / 0.451),color(xyz 0.016 0.016 0.065 / 0.122)),radial-gradient(circle at 76% 22%,var(--sun) 0 5rem,transparent 5.2rem),linear-gradient(145deg,var(--primary-dark),var(--primary) 48%,var(--green))}.home-copy:after{position:absolute;right:2rem;bottom:1.5rem;width:min(34rem,85%);height:17rem;border-radius:42% 58% 40% 60%;background:linear-gradient(180deg,var(--grass),var(--grass-dark)),var(--grass);content:"";clip-path:polygon(0 55%,10% 42%,21% 51%,32% 36%,45% 50%,56% 33%,69% 51%,82% 37%,100% 58%,100% 100%,0 100%);opacity:.9}.home-copy h1{position:relative;z-index:1;max-width:13ch;margin:.9rem 0 1rem;color:#fff8e8;color:oklch(.98 .05 87);font-size:3rem;line-height:1.06;text-wrap:balance;text-shadow:0 3px 0 oklch(.25 .11 246 / 45%)}.home-copy p{position:relative;z-index:1;max-width:42ch;color:#edf7ff;color:oklch(.97 .02 243);font-size:1.15rem;line-height:1.7}.home-start-panel{display:flex;flex-direction:column;gap:1rem;padding:1.5rem}.field-label{color:var(--muted);font-weight:800}.text-input{width:100%;min-height:3rem;padding:.75rem .95rem;border:2px solid oklch(.82 .06 243);border-radius:var(--radius);color:var(--ink);background:var(--bg);font-size:1.05rem}.text-input::placeholder{color:#4c6073}.avatar-picker{display:flex;flex-wrap:wrap;gap:.65rem}.avatar-choice{width:3rem;height:3rem;border-radius:var(--radius);background:var(--surface-strong);font-size:1.45rem}.avatar-choice.active{background:var(--sun);box-shadow:inset 0 0 0 3px #fff}.start-actions{display:grid;grid-template-columns:1fr;gap:.7rem}.home-links{display:flex;flex-wrap:wrap;gap:.6rem}.home-links button{min-height:2.6rem;padding:.55rem .8rem;border-radius:999px;color:var(--green-dark);background:#ccf5cc;font-weight:800}.home-panel{margin-top:1rem;padding:1.25rem}.home-panel h2,.result-panel h1{margin-bottom:.75rem}.rules-copy p{max-width:68ch;color:var(--muted);line-height:1.7}.game-page{position:relative;width:min(1420px,calc(100% - 1.25rem));min-height:100vh;margin:0 auto;padding:.75rem 0 1rem}.hud-bar{display:grid;grid-template-columns:minmax(13rem,1.1fr) repeat(3,auto) auto auto;gap:.6rem;align-items:center;padding:.65rem;border-radius:var(--radius);background:linear-gradient(180deg,#00669f,#004672);background:linear-gradient(180deg,color(xyz 0.115 0.119 0.442),color(xyz 0.058 0.055 0.252));color:#fff;box-shadow:0 6px 10px var(--shadow)}.hud-player,.hud-pill{display:inline-flex;min-height:3.1rem;align-items:center;gap:.55rem;padding:.45rem .8rem;border:1px solid oklch(.72 .08 235 / 75%);border-radius:var(--radius);background:#0033558c;background:oklch(.31 .13 245 / 55%)}.hud-pill strong{color:var(--sun);font-size:1.3rem}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,340px);gap:.75rem;margin-top:.75rem}.maze-column{min-width:0}.maze-shell{overflow:hidden;border:4px solid var(--primary-dark);border-radius:var(--radius);background:linear-gradient(180deg,oklch(.72 .11 218),var(--water) 22%,var(--grass) 22%,var(--grass-dark));box-shadow:0 6px 10px var(--shadow)}.mission-strip{padding:.65rem 1rem;color:#fff;background:#003d66;background:oklch(.35 .14 246);font-weight:850}.maze-board{display:grid;grid-template-columns:repeat(17,minmax(0,1fr));grid-template-rows:repeat(13,minmax(0,1fr));gap:.22rem;aspect-ratio:17 / 13;padding:.8rem;background:radial-gradient(circle at 10% 82%,var(--water) 0 7rem,transparent 7.2rem),radial-gradient(circle at 90% 10%,var(--water) 0 8rem,transparent 8.2rem),linear-gradient(180deg,var(--grass),oklch(.61 .16 142))}.maze-cell{position:relative;display:grid;min-width:0;min-height:0;place-items:center;border-radius:var(--radius);font-weight:900}.cell-grass{background:radial-gradient(circle at 70% 28%,oklch(.82 .14 142) 0 .18rem,transparent .2rem),radial-gradient(circle at 30% 70%,oklch(.94 .1 88) 0 .12rem,transparent .14rem),var(--grass)}.cell-path,.cell-start,.cell-sun,.cell-volcano,.cell-cloud,.cell-storm,.cell-treasure{border:1px solid var(--path-edge);background:radial-gradient(circle at 20% 20%,oklch(.97 .07 88 / 80%) 0 .2rem,transparent .22rem),var(--path)}.cell-icon,.start-label,.path-arrow,.collected-sun{z-index:1}.cell-icon{font-size:1.55rem;filter:drop-shadow(0 2px 1px oklch(.2 .08 80 / 28%))}.start-label{display:inline-flex;max-width:100%;padding:.15rem .25rem;border-radius:999px;color:#fff;background:var(--green-dark);font-size:.7rem}.path-arrow{color:#b3150f;font-size:1.05rem}.collected-sun{display:grid;width:1.65rem;height:1.65rem;place-items:center;border-radius:50%;color:#fff;background:var(--green)}.cell-volcano.phase-warning{animation:pulse-warning .55s ease-out infinite alternate}.cell-volcano.phase-danger{background:var(--danger-soft);animation:pulse-danger .4s ease-out infinite alternate}.cell-cloud.raining{background:#a6e2fb}.cell-storm.storm-rainbow{border-color:#ca83e9;background:linear-gradient(135deg,#ffd3d1,#ffe6a8 25%,#dbe997,#a5eda6 50%,#a5e1ff 75%,#cddaff,#ebd3ff);background:linear-gradient(135deg,color(xyz 0.826 0.728 0.634),color(xyz 0.771 0.803 0.341) 25%,#dbe997,#a5eda6 50%,color(xyz 0.595 0.696 1.171) 75%,color(xyz 0.69 0.701 1.182),color(xyz 0.793 0.705 1.192))}.cell-storm.storm-lightning{border-color:#006abe;border-color:oklch(.52 .18 252);background:#9dc9f7;animation:lightning-flash .55s ease-out infinite alternate}.maze-player{z-index:5;display:grid;align-self:center;justify-self:center;width:78%;height:78%;place-items:center;border:3px solid oklch(1 0 0);border-radius:50%;background:var(--sun);font-size:1.65rem;box-shadow:0 4px 8px var(--shadow);transition:transform .18s ease-out}.maze-player.protected{box-shadow:0 0 0 .35rem #8ad0eba6}.side-panel{display:flex;min-height:100%;flex-direction:column;gap:.75rem;padding:.75rem;border-radius:var(--radius);background:#edf7ff;box-shadow:0 6px 10px var(--shadow)}.tab-list{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;padding:.25rem;border-radius:var(--radius);background:var(--surface-strong)}.tab{min-height:2.6rem;border-radius:var(--radius);color:var(--primary-dark);background:transparent;font-weight:850}.tab.active{color:#fff;background:var(--primary)}.rule-list{display:grid;gap:.48rem}.rule-item{display:grid;grid-template-columns:2.4rem 5.5rem 1fr;align-items:center;gap:.5rem;min-height:3rem;padding:.35rem .55rem;border:1px solid oklch(.85 .035 92);border-radius:var(--radius);background:#fffcf3;background:oklch(.99 .016 88)}.rule-item span:last-child{color:var(--muted);font-size:.92rem;line-height:1.35}.rule-icon{font-size:1.55rem}.suggestion-panel{margin-top:auto;padding:.75rem;border-radius:var(--radius);color:var(--green-dark);background:#d1f3ce}.suggestion-panel p{margin:.35rem 0 0;color:#18421c;line-height:1.55}.hint-bar,.game-bottom{display:flex;align-items:center;gap:.65rem}.hint-bar{margin-top:.55rem;padding:.6rem;border-radius:var(--radius);color:#fff;background:#003b61;background:oklch(.34 .14 245)}.hint-bar span:nth-child(3){flex:1;min-width:0;line-height:1.45}.game-bottom{justify-content:space-between;margin-top:.7rem}.target-time{padding:.7rem 1rem;border-radius:var(--radius);color:#fff;background:#00436d;background:oklch(.37 .14 245);font-weight:800}.mobile-controls{display:grid;grid-template-columns:repeat(3,var(--control-size));grid-template-rows:repeat(2,var(--control-size));gap:.38rem;justify-content:center}.mobile-controls.compact{--control-size: 2.8rem}.control-button{border:0;border-radius:var(--radius);color:#fff;background:linear-gradient(180deg,oklch(.66 .13 232),var(--primary));font-size:1.5rem;font-weight:900;box-shadow:0 4px 7px var(--shadow)}.control-up{grid-column:2;grid-row:1}.control-left{grid-column:1;grid-row:2}.control-right{grid-column:3;grid-row:2}.control-down{grid-column:2;grid-row:2}.pause-chip{position:fixed;z-index:12;left:50%;top:5rem;transform:translate(-50%);padding:.65rem 1rem;border-radius:999px;color:#fff;background:var(--primary-dark);font-weight:850}.modal-backdrop{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:1rem;background:#0013248c;background:oklch(.18 .08 245 / 55%)}.treasure-modal{width:min(900px,100%);max-height:min(92vh,820px);overflow:auto;padding:1rem;border-radius:var(--radius);background:var(--bg);box-shadow:0 8px 12px #00040a59;box-shadow:0 8px 12px oklch(.1 .06 245 / 35%)}.modal-head,.mini-game-head,.street-status,.mini-actions,.result-actions{display:flex;align-items:center;gap:.75rem}.modal-head{justify-content:space-between;margin-bottom:1rem}.modal-head h2,.mini-game-head h3{margin:.35rem 0 0}.chest-menu{display:grid;gap:.75rem}.level-button{display:grid;grid-template-columns:3rem 1fr;gap:.45rem .75rem;align-items:center;min-height:5rem;padding:.9rem;border-radius:var(--radius);text-align:left;color:var(--ink);background:var(--surface)}.level-button span{grid-row:span 2;font-size:2rem}.level-button em{color:var(--muted);font-style:normal}.notice{padding:.7rem .85rem;border-radius:var(--radius);font-weight:800}.notice.danger{color:#820003;color:oklch(.38 .16 28);background:var(--danger-soft)}.mini-game{display:grid;gap:.85rem}.mini-message{margin:0;color:var(--muted);line-height:1.55}.answer-zone,.word-bank{display:flex;flex-wrap:wrap;gap:.55rem;min-height:4.2rem;align-items:center;padding:.75rem;border-radius:var(--radius)}.answer-zone{border:2px dashed oklch(.72 .1 243);background:var(--surface)}.word-bank{background:#fdedc9}.placeholder-text{color:#44586b;font-weight:750}.word-card{min-height:2.6rem;padding:.55rem .8rem;border-radius:var(--radius);color:var(--ink);background:#fff;font-weight:850;box-shadow:0 3px 6px #442e0029;box-shadow:0 3px 6px oklch(.32 .08 80 / 16%)}.word-card.selected{color:#fff;background:var(--green)}.mini-actions{flex-wrap:wrap}.street-status{flex-wrap:wrap;justify-content:space-between;color:var(--primary-dark);font-weight:850}.street-board{position:relative;overflow:hidden;width:100%;min-height:22rem;border:3px solid oklch(.72 .06 248);border-radius:var(--radius);background:linear-gradient(90deg,transparent 0 48%,oklch(.93 .012 248) 48% 52%,transparent 52%),linear-gradient(0deg,transparent 0 48%,oklch(.93 .012 248) 48% 52%,transparent 52%),#abb9c7}.street-lane{position:absolute;background:#f4f2ead1}.lane-x{left:0;right:0;height:.25rem}.lane-x.one{top:34%}.lane-x.two{top:58%}.lane-y{top:0;bottom:0;width:.25rem}.lane-y.one{left:42%}.lane-y.two{left:68%}.street-exit,.street-player,.pedestrian,.falling-shadow,.falling-item{position:absolute;transform:translate(-50%,-50%)}.street-exit{display:grid;width:4.8rem;height:2.4rem;place-items:center;border-radius:999px;color:#fff;background:var(--green);font-weight:900;animation:exit-glow 1s ease-out infinite alternate}.street-player{z-index:5;display:grid;width:2.8rem;height:2.8rem;place-items:center;border-radius:50%;background:var(--sun);font-size:1.7rem;box-shadow:0 4px 8px var(--shadow)}.street-player.shield{box-shadow:0 0 0 .45rem #80d1ef99}.pedestrian,.falling-item{z-index:4;font-size:1.8rem}.falling-shadow{z-index:2;width:3.2rem;height:3.2rem;border:3px dashed oklch(.28 .05 248 / 45%);border-radius:50%;background:#0a17231f;animation:warning-ring .5s ease-out infinite alternate}.leaderboard-table{display:grid;gap:.4rem;overflow-x:auto}.leaderboard-row{display:grid;grid-template-columns:3.2rem minmax(8rem,1fr) 5.4rem 4rem 5rem;gap:.5rem;align-items:center;min-width:34rem;padding:.6rem .7rem;border-radius:var(--radius);background:#fff}.table-head{color:var(--muted);background:var(--surface-strong);font-weight:850}.empty-state{display:grid;gap:.35rem;padding:1rem;border-radius:var(--radius);background:var(--surface)}.empty-state span{color:var(--muted)}.result-page{display:grid;min-height:100vh;place-items:center}.result-panel{width:min(720px,100%);padding:1.5rem;text-align:center}.result-icon{display:inline-grid;width:4.5rem;height:4.5rem;place-items:center;border-radius:50%;background:var(--sun);font-size:2.5rem}.result-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1rem 0;text-align:left}.result-grid div{display:grid;gap:.25rem;padding:.8rem;border-radius:var(--radius);background:var(--surface)}.result-grid span{color:var(--muted);font-size:.92rem;font-weight:750}.result-grid strong{font-size:1.25rem}.result-actions{justify-content:center;flex-wrap:wrap}@keyframes pulse-warning{0%{filter:saturate(1)}to{filter:saturate(1.5) brightness(1.08)}}@keyframes pulse-danger{0%{transform:scale(1)}to{transform:scale(1.04)}}@keyframes warning-ring{0%{opacity:.55;transform:translate(-50%,-50%) scale(.92)}to{opacity:1;transform:translate(-50%,-50%) scale(1.05)}}@keyframes exit-glow{0%{filter:brightness(1)}to{filter:brightness(1.18)}}@keyframes lightning-flash{0%{filter:brightness(.92) saturate(1.05)}to{filter:brightness(1.2) saturate(1.35)}}@media(max-width:1050px){.hud-bar,.game-layout{grid-template-columns:1fr}.hud-bar{align-items:stretch}.hud-player,.hud-pill{justify-content:center}.side-panel{min-height:auto}}@media(max-width:760px){.home-page,.result-page,.game-page{width:min(100% - .75rem,100%);padding-block:.5rem}.home-hero,.result-grid{grid-template-columns:1fr}.home-hero{min-height:auto}.home-copy{min-height:23rem;padding:1.3rem}.home-copy h1{font-size:2.15rem}.game-bottom,.hint-bar{align-items:stretch;flex-direction:column}.hint-bar{text-align:center}.target-time{width:100%;text-align:center}.maze-board{gap:.12rem;padding:.42rem}.cell-icon{font-size:1.05rem}.path-arrow{font-size:.75rem}.maze-player{font-size:1.2rem}.rule-item{grid-template-columns:2rem minmax(4.8rem,auto) 1fr;font-size:.92rem}.treasure-modal{max-height:94vh;padding:.75rem}.street-board{min-height:19rem}.leaderboard-row{min-width:31rem}}@media(max-width:460px){.hud-pill strong{font-size:1.05rem}.hud-player,.hud-pill,.icon-button{min-height:2.75rem}.icon-button{width:2.75rem;height:2.75rem}.rule-item{grid-template-columns:2rem 1fr}.rule-item span:last-child{grid-column:2}.start-label{font-size:.58rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}