:root{--blue:#1455c9;--blue2:#0b3795;--gold:#ffc52f;--cream:#fff7de;--ink:#183467;--muted:#6d7991;--paper:#fffdfa;--shadow:0 18px 45px rgba(31,59,112,.16)}
*{box-sizing:border-box}body{margin:0;min-width:320px;color:var(--ink);font-family:"Avenir Next","PingFang TC","Microsoft JhengHei",sans-serif;background:#f5e4bd}button{font:inherit;color:inherit}button:focus-visible{outline:4px solid #6fc7ff;outline-offset:3px}.game-shell{min-height:100svh;padding:0 24px 28px;background:radial-gradient(circle at 50% -10%,#fff 0,transparent 36%),linear-gradient(180deg,#fff9e9,#f8e4bd);overflow:hidden}.topbar{width:min(1510px,100%);min-height:108px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:15px}.brand-mark{width:66px;height:66px;border:5px solid white;border-radius:22px;display:grid;place-items:center;color:white;background:linear-gradient(145deg,#347df0,#1047b8);box-shadow:0 7px 0 #0b3998;font-size:32px;font-weight:950;transform:rotate(-4deg)}.brand p,.panel-kicker{margin:0;color:#b47a12;font-size:10px;font-weight:900;letter-spacing:.16em}.brand h1{margin:2px 0 0;color:var(--blue2);font-size:clamp(26px,2.5vw,40px);line-height:1}.stats{display:flex;align-items:center;gap:9px}.stat{min-width:112px;padding:10px 15px;border:3px solid white;border-radius:19px;background:rgba(255,255,255,.85);box-shadow:var(--shadow)}.stat span{display:block;color:var(--muted);font-size:10px;font-weight:800}.stat strong{display:block;margin-top:2px;font-size:19px}.stat b{font-weight:950}.icon-btn{width:48px;height:48px;border:3px solid white;border-radius:50%;background:var(--blue);color:white;box-shadow:0 5px 0 var(--blue2);font-weight:900;cursor:pointer}.layout{width:min(1510px,100%);margin:auto;display:grid;grid-template-columns:245px minmax(640px,1fr) 270px;gap:18px;align-items:start}.panel{padding:23px 20px;border:4px solid rgba(255,255,255,.95);border-radius:28px;background:rgba(255,253,248,.9);box-shadow:var(--shadow)}.panel h2{margin:5px 0 18px;font-size:21px}.mascot-picker{display:grid;gap:9px}.mascot-option{min-height:66px;padding:5px 8px;border:2px solid #dde5ef;border-radius:18px;display:flex;align-items:center;gap:8px;background:white;cursor:pointer;transition:.2s}.mascot-option:hover{transform:translateY(-2px);border-color:#7ab4ff}.mascot-option.active{border-color:var(--blue);background:#eaf2ff;box-shadow:0 4px 0 #b6cff4}.mascot-option img{width:54px;height:54px;object-fit:contain}.mascot-option span{font-size:13px;font-weight:900}.energy-card{margin-top:17px;padding:13px;border-radius:17px;background:#e8f2ff}.energy-card>div:first-child{display:flex;justify-content:space-between;font-size:11px;font-weight:900}.energy-track{height:9px;margin-top:8px;border-radius:99px;background:#c7d6e9;overflow:hidden}.energy-track i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#5ad389,#1da866);transition:.4s}.mission{margin-top:12px;padding:14px;border-radius:18px;background:#fff0b7}.mission span{font-size:10px;font-weight:900;color:#a16b04}.mission strong{display:block;margin-top:5px;font-size:13px;line-height:1.5}.secondary-btn{width:100%;margin-top:14px;padding:11px;border:2px solid #d5deea;border-radius:14px;background:white;font-size:12px;font-weight:900;cursor:pointer}.board-wrap{padding:12px;border:5px solid white;border-radius:40px;background:#bbdbff;box-shadow:0 15px 0 #9cb5cf,var(--shadow)}.board{position:relative;aspect-ratio:9/7;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(7,1fr);gap:7px}.tile{position:relative;min-width:0;border:3px solid rgba(255,255,255,.85);border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:visible;background:#fff;box-shadow:0 4px 0 rgba(49,82,123,.19);transition:.18s}.tile .symbol{font-size:clamp(18px,2vw,28px);line-height:1}.tile .label{margin-top:2px;font-size:clamp(8px,.7vw,10px);font-weight:900;white-space:nowrap}.tile.start{background:#ffe069}.tile.coin{background:#fff6c7}.tile.star{background:#dceaff}.tile.lucky{background:#e3f7d7}.tile.danger{background:#ffe0dc}.tile.shop{background:#eee3ff}.tile.active{z-index:3;transform:translateY(-5px);box-shadow:0 7px 0 var(--blue2),0 9px 18px rgba(18,54,124,.25);border-color:var(--blue)}.token{position:absolute;z-index:5;width:70%;height:70%;object-fit:contain;filter:drop-shadow(0 4px 2px rgba(32,50,84,.25));animation:bob 1.3s ease-in-out infinite;pointer-events:none}.island-center{grid-column:2/9;grid-row:2/7;border:4px dashed rgba(255,255,255,.75);border-radius:34px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle,#fffdf5 0 10%,#dff1ff 65%,#bfe1ff);box-shadow:inset 0 0 40px rgba(49,130,218,.12)}.island-center>p:first-of-type{margin:0;color:#3280c7;font-size:10px;font-weight:900;letter-spacing:.15em}.island-center h2{margin:4px 0 11px;font-size:clamp(22px,2.3vw,38px)}.sun{font-size:25px;color:var(--gold)}.dice-stage{display:flex;align-items:center;gap:13px}.dice{width:73px;height:73px;border:5px solid white;border-radius:20px;display:grid;place-items:center;background:var(--blue);color:white;box-shadow:0 7px 0 var(--blue2);font-size:52px;line-height:1}.dice.rolling{animation:shake .14s linear infinite}.roll-btn{padding:15px 28px;border:0;border-radius:17px;background:linear-gradient(#ffd85a,#ffb718);color:#714400;box-shadow:0 6px 0 #d99400;font-weight:950;cursor:pointer}.roll-btn:disabled{filter:grayscale(.4);opacity:.7;cursor:wait}.hint{margin:15px 0 0!important;color:var(--muted)!important;font-size:12px!important;letter-spacing:0!important}.event-card{min-height:128px;padding:12px;border-radius:21px;display:flex;align-items:center;background:linear-gradient(135deg,#e6f1ff,#fff);box-shadow:inset 0 0 0 2px white}.event-card img{width:84px;height:95px;object-fit:contain}.event-card span{font-size:9px;font-weight:900;color:#2877d8;letter-spacing:.13em}.event-card strong{display:block;margin:3px 0;font-size:13px}.event-card p{margin:0;color:var(--muted);font-size:11px;line-height:1.4}.log-list{height:280px;margin:16px 0;padding:0;list-style:none;overflow:auto}.log-list li{padding:10px 0;border-bottom:1px solid #e5e8ed;display:flex;gap:9px;font-size:11px;line-height:1.4}.log-list i{min-width:37px;color:#9a7330;font-size:9px;font-style:normal;font-weight:800}.legend{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:10px;font-weight:800}.dot{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:50%}.dot.coin{background:#ffc62c}.dot.star{background:#4c91ef}.dot.lucky{background:#65c954}.dot.danger{background:#ef756b}.modal{position:fixed;z-index:50;inset:0;padding:22px;display:grid;place-items:center;background:rgba(10,34,78,.58);backdrop-filter:blur(5px)}.modal[hidden]{display:none}.modal-card{width:min(430px,100%);padding:30px;border:5px solid white;border-radius:34px;text-align:center;background:#fffaf0;box-shadow:0 22px 60px rgba(4,20,55,.35)}.modal-card img{width:150px;height:150px;object-fit:contain}.modal-card>p:first-of-type{margin:0;color:#2877d8;font-size:10px;font-weight:900;letter-spacing:.16em}.modal-card h2{margin:5px 0;font-size:30px}.modal-card>p{color:var(--muted)}@keyframes bob{50%{transform:translateY(-6px)}}@keyframes shake{25%{transform:rotate(8deg) scale(1.05)}75%{transform:rotate(-8deg) scale(.95)}}
@media(max-width:1120px){.layout{grid-template-columns:210px 1fr}.log-panel{grid-column:1/-1}.log-list{height:110px}.legend{grid-template-columns:repeat(4,1fr)}}
@media(max-width:820px){.game-shell{padding:0 10px 20px}.topbar{align-items:flex-start;padding:14px 4px;flex-direction:column}.stats{width:100%;overflow:auto;padding-bottom:5px}.stat{min-width:100px}.layout{display:flex;flex-direction:column}.board-wrap{width:100%;padding:7px;border-radius:25px;overflow:auto}.board{width:720px}.profile-panel,.log-panel{width:100%}.mascot-picker{grid-template-columns:repeat(3,1fr)}.mascot-option{flex-direction:column;text-align:center}.log-list{height:150px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}