/* Sunny, painted casual-game art direction. */
:root{--ink:#614645;--paper:#fff9ed;--mint:#1bc7c4;--berry:#b36bd8;--gold:#ffd25c}
html{overflow:clip}body{position:fixed;inset:0;overflow:clip;background:linear-gradient(120deg,#b9e9ee,#ccebdc 52%,#ebd9f0);color:var(--ink)}
#app{overflow:clip;background:#a9ddf1;box-shadow:0 10px 90px #477b7d45}
.desktop-wordmark{color:#fffaf0e6;text-shadow:0 3px #8ebbb5;transform:rotate(-5deg)}
.desktop-wordmark small,.desktop-wordmark span{color:#587e84;text-shadow:none}
button:focus-visible{outline:3px solid #974eb9;outline-offset:4px}
.wallet{top:2.7%;height:5.2%;gap:9px}
.wallet button{border:2px solid #fffcf3;border-radius:30px;background:linear-gradient(#fffefa,#ffeadd);color:#734f46;box-shadow:inset 0 2px #fff,0 4px 0 #b99d8790,0 5px 10px #56644c25}
.wallet button:first-child,.wallet button:last-child{border-radius:50%;background:linear-gradient(#8ef8ff,#17b2e2);border-color:#ccfbff;box-shadow:inset 0 2px #fff8,0 4px #3d93ac}
.wallet i{filter:drop-shadow(0 2px 1px #b97e384f);height:135%;width:38%}.wallet b{color:#795145;font-size:clamp(16px,2.5dvh,25px)}.wallet em{background:#89d940;color:white;border:2px solid #d8f9a4;border-radius:50%;width:21px;height:21px;display:grid;place-items:center;line-height:1;text-shadow:0 1px #559322;font-size:17px}.wallet button:nth-child(3) em{background:none;border:0;color:#aa9075;font-size:10px}
.journey{top:9.6%;left:22%;width:56%;height:4.6%;background:#fffcf0eb;border:2px solid #fff;border-bottom:3px solid #d6bfa3;color:#83583d;border-radius:30px;box-shadow:0 4px 10px #44747420}
.journey strong{font-size:clamp(9px,1.35dvh,14px)}.journey small{font-size:8px;color:#aa8264;margin:2px 0}.journey>i{filter:drop-shadow(0 2px #b9787550)}.journey-track{height:4px;background:#e5dac4}.journey-track i{background:linear-gradient(90deg,#8dd35c,#bdea68)}
.graffiti-title{top:16.1%;left:14%;width:72%;transform:rotate(-5deg);filter:drop-shadow(0 4px 0 #8c685e45)}
.season-label{background:#fff6e5e8;border:2px solid #fffaf1;box-shadow:0 2px #bba37e75;color:#916a47;border-radius:20px;padding:3px 13px;font-size:clamp(8px,1.15dvh,11px);letter-spacing:1px}
.graffiti-title h1{font-weight:1000;font-size:clamp(43px,7.6dvh,76px);color:#fff5ac;-webkit-text-stroke:1px #5c6b24;text-shadow:0 2px #6ea936,0 4px #53792f,1px 6px #704830;letter-spacing:-4px;margin:5px 0 2px}
.graffiti-title h1:before{color:#fff9e9;-webkit-text-stroke:8px #fffaf1;filter:drop-shadow(0 2px 0 #6b5538)}
.graffiti-title h1 .logo-green{background:linear-gradient(#efff89 12%,#badc36 45%,#75be35 70%,#e5f698 100%);background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px #789333);text-shadow:none;-webkit-text-stroke:0}
.graffiti-title h1 .logo-orange{background:linear-gradient(#fff7a2 12%,#ffc648 45%,#ef842c 74%,#ffcb65 100%);background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px #b96534);text-shadow:none;-webkit-text-stroke:0}
.logo-sub{background:linear-gradient(#51dfd3,#19a5bc);border:2px solid #e7ffeb;border-bottom:3px solid #4b9291;border-radius:18px;padding:4px 20px;color:#fffef0;letter-spacing:4px;font-size:10px;box-shadow:0 3px 8px #27545425}.logo-splash{display:none}
.side-rail{top:34%;width:15%;gap:2.6dvh}.side-rail button{background:none;border:0;border-radius:0;box-shadow:none;padding:0 0 4px;color:#765249}.side-rail i{height:6.7dvh;width:100%;filter:drop-shadow(0 3px 1px #75564560)}.side-rail span{display:inline-block;max-width:100%;font-size:clamp(8px,1.35dvh,13px);background:linear-gradient(#fffef6,#ffe6d1);padding:3px 5px;border:1px solid #fff8e7;border-radius:15px;box-shadow:0 2px #c2a08588;white-space:nowrap}.badge{top:-3px;right:0;background:linear-gradient(#ffa879,#f27569);border-color:#fff6e5;border-radius:50%;color:white;box-shadow:0 2px #c6716059;min-width:19px;line-height:12px;text-shadow:0 1px #bc6245}
.wardrobe-pill{top:68.4%;background:linear-gradient(#fffdf4ee,#ffe8d8ef);border:2px solid white;box-shadow:0 3px #c3a99580;color:#926552;height:4.3%;font-size:10px}.wardrobe-pill b{color:#ac71cb;font-size:11px}
.start-dock{left:17%;width:66%;bottom:10.4%;filter:drop-shadow(0 4px 1px #566b574f)}
.mode-ribbon{border:2px solid #e9fff8;border-bottom:3px solid #4c9caa;background:linear-gradient(#81dee4,#51b9cb);color:white;border-radius:18px 18px 9px 9px;height:4.4dvh;box-shadow:inset 0 2px #e4ffff80}.mode-ribbon small{color:#effffe}.mode-ribbon>span{text-shadow:0 1px #5195a5}.mode-ribbon>b{font-size:11px}
.start-button{border:3px solid #fbffe1;border-bottom:6px solid #2d9da0;border-radius:24px;background:linear-gradient(#8dffdf 0%,#34e3cd 33%,#13b6c1 75%,#32cbcc 100%);box-shadow:inset 0 3px #dcfff4,0 2px 0 #2a868c;color:#fffdf0;text-shadow:0 3px #229798;height:8.2dvh}.start-button span{letter-spacing:3px;font-size:clamp(23px,3.7dvh,37px)}.start-button b{color:#fffccb;text-shadow:0 2px #29aab0}.start-dock p{color:#547f81;text-shadow:0 1px #fffae6;font-size:8px}
.bottom-nav{height:8.2%;background:linear-gradient(#fffef4f5,#ffe9d4f5);border-top:3px solid white;box-shadow:0 -3px 20px #8d97872b;gap:3px}.bottom-nav button{color:#8f6757}.bottom-nav i{filter:drop-shadow(0 2px #af88544d);height:4.8dvh}.bottom-nav span{font-size:11px}.bottom-nav .selected{background:linear-gradient(#ead5ff,#bf84e9);border:2px solid #fff6ff;border-bottom:4px solid #9867bb;border-radius:20px;box-shadow:0 3px #9366a538;color:#fffef1;transform:translateY(-7px)}
.dialog{background:linear-gradient(150deg,#fffdf4,#fff1df);border:4px solid #fffdf5;box-shadow:0 0 0 100vmax #2c5c686e,0 8px #b6a18d75;color:#755149;border-radius:29px}.dialog-cap{background:linear-gradient(#65d7e6,#31adc7);border-bottom:4px solid #3299af;color:#fffef1;text-shadow:0 2px #358fa4;font-size:20px}.dialog h2{color:#785545}.primary{background:linear-gradient(#91efce,#2ac6b8);color:#fffcef;border:2px solid #d6fff0;border-bottom:5px solid #41998e;border-radius:18px;text-shadow:0 2px #329e98;box-shadow:inset 0 2px #d9fff2}.secondary,.small-button{background:linear-gradient(#89e7f3,#33b7dc);border:2px solid #dcfbff;border-bottom:4px solid #4296b7;border-radius:17px;text-shadow:0 1px #3894b1;color:white}
.field{border-bottom:1px solid #ead9c6;color:#846454}.field select{background:#fffaf2;border:2px solid #bbddd9;border-radius:12px;color:#796355}.field input{accent-color:#34bbb8}.character-cards button{background:radial-gradient(ellipse at 50% 20%,#fffef5,#eee0fa);color:#88617c;border:2px solid #e4cdec;border-radius:18px}.character-cards .active{border-color:#bb83d8;background:radial-gradient(#fffcf0,#ebd1ff);box-shadow:0 0 0 2px #f7e8ff}.character-cards img{filter:drop-shadow(0 4px 3px #ad88b738)}.model-note{font-size:11px;line-height:1.6;background:#e9f8ed;border-radius:13px;padding:10px;color:#58816f}.palette{display:none}
.setting-note{background:linear-gradient(130deg,#ba82d9,#65b7d0);border:2px solid #eed8fa;box-shadow:inset 0 2px #ffffff70}.record-row b{color:#1faebb}.mission,.record-row{border:2px solid #e6ceb4;background:#fffef7;border-radius:17px}.mission.done{background:#eef8ce;border-color:#a1cb7e}.obstacle-card{background:radial-gradient(#fffdf0,#ecdbba);border-color:#e0c497;border-radius:17px;color:#886844}.guide-grid div{background:#dff8f3;border-color:#a5d9ca;border-radius:17px;color:#23a7ae}.guide-grid b{color:#698479}
.top-score,.coin-stat{background:linear-gradient(#fffdf2f5,#ffe8d9eb);border:2px solid #fffcf2;border-radius:27px;box-shadow:0 3px #8b9b7973;color:#78584d;text-shadow:none}.multiplier{color:#51b7a7;text-shadow:0 1px #fff}.top-score b,.coin-stat b{font-size:clamp(17px,2.8dvh,26px);text-shadow:none}.top-score small{color:#9d7a61}.pause-button{background:linear-gradient(#8ef7ff,#25b1d6);border:3px solid #ecfffe;border-radius:18px;color:#fff;box-shadow:inset 0 2px white,0 4px #4b99ad}
.zone-hud{background:#fff8e1e0;border:2px solid #fffdf0;border-radius:17px;padding:7px 10px 8px;color:#6b8277;text-shadow:none;box-shadow:0 3px #9db9a659;font-size:13px;top:10.8%;left:3.5%;max-width:53%}.zone-hud strong{font-size:14px}.zone-hud b{font-size:11px;color:#b49b5e}.zone-hud small{font-size:9px;color:#8d9780;margin:3px 0 5px}.zone-hud .track{height:6px;background:#d9e5d2;border:0}.zone-hud .track i{background:linear-gradient(90deg,#87d94e,#d7ec60)}
.bottom-left{background:#34646a80;padding:8px 10px;border-radius:17px;text-shadow:0 2px #3a7577;color:#fffbed;bottom:10%;left:3.5%;width:48%;backdrop-filter:blur(4px)}.bottom-left>small{font-size:11px}.speed-line strong{font-size:28px}.speed-line b{font-size:10px;color:#dcf596}.speed-line span{font-size:12px}.bottom-left .track{height:5px;border:0;background:#1b626e85}.bottom-left .track i{background:linear-gradient(90deg,#86e8e1,#d3f289)}
.controls{bottom:1.8%;left:12%;width:76%;gap:8px}.controls button{background:linear-gradient(#ffffffde,#e5f7ecb8);border:2px solid white;border-bottom:4px solid #88b9b3ab;border-radius:19px;color:#379da9;font-size:28px;box-shadow:0 3px #63867b3b;backdrop-filter:blur(4px)}
#toast{background:linear-gradient(#fffdf3,#fff0d9);border:2px solid #fff;border-bottom:4px solid #d3b48e;color:#89704f;border-radius:20px}.chase.warning{background:linear-gradient(#d6a0edee,#ac70c8e8);border:2px solid #fce5ff;color:white;border-radius:18px}.track{overflow:hidden}.chase{font-size:12px}
#shop{background:linear-gradient(#b6e8f033,transparent 30%,#dbbded33)}.shop-back{background:linear-gradient(#8aedf3,#2eb5d0);border:2px solid #e1fffa;border-bottom:4px solid #429eac;border-radius:50%;color:white;box-shadow:0 2px #358697}.shop-heading strong{color:#756058;text-shadow:0 2px #fff6e8}.shop-heading small{color:#9c9080}.shop-wallet{background:linear-gradient(#fffff7,#ffeadd);color:#856044;border:2px solid #fff;border-radius:30px;box-shadow:0 3px #c3a78a}.shop-name small{background:linear-gradient(#dbb3f5,#ae73d3);border:2px solid #fff3ff;color:white}.shop-name h2{color:#6c524d}.shop-name p{color:#a18b6f}.shop-drawer{background:linear-gradient(#fffdf2,#fff0df);border:4px solid white;border-radius:32px 32px 0 0;box-shadow:0 -5px 24px #888f7729}.shop-buy-row #shopBuy{background:linear-gradient(#92f2cf,#2ac4b9);border:2px solid #e7fff3;border-bottom:5px solid #4b9e95;color:white;text-shadow:0 2px #409d95;border-radius:20px}.shop-buy-row #shopEarn{background:linear-gradient(#ffe292,#ffbd53);border-color:#fff4bd;border-bottom-color:#cea264;color:#9b6a31}.shop-filters button{background:#f1e5dc;color:#ab8c78;border:1px solid #e7d4c6}.shop-filters .active{background:linear-gradient(#d8a9f0,#b17bd4);border:1px solid #f7e5ff;box-shadow:0 2px #9d6cbd;color:white}.outfit-card{background:radial-gradient(ellipse at 50% 12%,#fffefa,color-mix(in srgb,var(--outfit-color),#f8eddc 77%));border:2px solid #f1dfc7;border-bottom:4px solid #ccbaa8;border-radius:21px;color:#826757}.outfit-card.active{border-color:#ae7bd1;box-shadow:0 0 0 2px #e8c7fa}.outfit-state{color:#ba8b50;background:#fffcf0ed}.outfit-card.active .outfit-state{background:#bd83de;color:white}.shop-footnote{color:#ad977e}
#workshop[data-panel=maps]{background:linear-gradient(#fffcf4,#fff0dc);border:4px solid #fff}.map-intro h2{color:#85634f}.map-intro small{color:#b57fb9}.map-card{background:#fffdf6;border:2px solid #e9d5bd;border-bottom:4px solid #c9b298;border-radius:21px;color:#825f4a}.map-card svg{border-bottom:1px solid #e8d3ba}.map-card.active{background:#fff2cb;border-color:#d8ad55;box-shadow:0 0 0 2px #ffeaab,0 4px #baa07350}.map-card strong{color:#ae8b63}.map-card.active em{background:#9bd3a8;color:#467454}.map-country em{background:#eee5d8;color:#b1987c}.map-card>small{color:#ad9985}.map-selection{background:#fff9eaf5;border-color:#ead8bc}.map-selection strong{color:#87674c}.map-selection>span{color:#a28e71}
#workshop[data-panel=maps] .dialog-cap{background:linear-gradient(#6ddbe6,#3baac4);border-bottom:4px solid #5099aa;color:#fffdf3;text-shadow:0 2px #3f91a4}
#loading{background:linear-gradient(0deg,#2f8d9d52,transparent 30%),url('assets/storybook-loading.png?v=6.3.0') center/cover;display:block;padding:0;color:white}
#loading:before{content:'';position:absolute;inset:0;background:linear-gradient(#97d8eb00 0%,transparent 66%,#175b6d40 100%);pointer-events:none}
#loading>b{position:absolute;top:13%;left:0;width:100%;font-size:clamp(42px,8dvh,80px);color:#fff8b1;-webkit-text-stroke:1px #bc833e;text-shadow:0 3px #e3a13f,0 6px #956039,2px 8px #ffffff9c;transform:rotate(-6deg);letter-spacing:-4px}
#loading>b:after{content:'世 界 漫 游';display:block;width:max-content;margin:8px auto;background:linear-gradient(#55dac7,#1e9fb3);border:3px solid #f8ffde;border-radius:19px;padding:6px 18px;color:white;font-size:13px;letter-spacing:4px;text-shadow:0 2px #418e8a;-webkit-text-stroke:0;box-shadow:0 3px #438285}
.load-mascot{position:absolute;top:41%;left:27%;width:46%;height:32%;background:url('assets/portrait-runner.png?v=6.3.0') center/contain no-repeat;filter:drop-shadow(0 15px 6px #897a4666);animation:hop 2s ease-in-out infinite}
#loadStatus{position:absolute;top:82%;left:7%;width:86%;font-size:12px;color:#fffefa;text-shadow:0 2px 4px #235b60;background:#286c79a6;border:1px solid #b9e5dcc0;border-radius:20px;padding:9px}
.load-track{position:absolute;top:76%;left:10%;width:80%;height:26px;border:4px solid #fff9e8;border-radius:22px;box-shadow:0 4px #6b7f7575;background:#21677c;overflow:hidden}.load-track i{background:linear-gradient(#87ffe2,#24d6bf 55%,#0db4aa);border-radius:15px;box-shadow:inset 0 2px #ddffe8;height:100%}
#loading small{position:absolute;top:90%;left:0;width:100%;color:#fff8e9;text-shadow:0 1px 4px #296472;font-size:10px}#reloadGame{position:absolute;top:85%;left:25%;width:50%;background:linear-gradient(#fff3b0,#ffd163);border:3px solid #fff4ce;border-bottom:5px solid #bf9c58;border-radius:20px;color:#966938}
#updateNotice{background:#fff9e7;border:2px solid #fff;border-bottom:4px solid #c0ae8c;border-radius:20px;color:#816445}#applyUpdate{background:linear-gradient(#79ddd8,#2cafbb);border-radius:15px}
@media(max-height:700px){.side-rail{gap:2dvh}.side-rail i{height:6.5dvh}.side-rail span{font-size:8px;padding:2px 4px}.journey small{font-size:7px}.wallet b{font-size:16px}.wardrobe-pill{font-size:9px}.zone-hud{padding:5px 8px}.zone-hud strong{font-size:12px}.zone-hud small{font-size:8px}.bottom-left{padding:6px 9px}.speed-line strong{font-size:24px}.controls button{font-size:23px}.start-dock p{margin-top:6px;font-size:7px}}

.shop-name{top:8.6%}.shop-name h2{font-size:19px;margin:6px 0 3px}.shop-name p{font-size:9px}.shop-name small{padding:2px 12px;font-size:9px}

.map-illustration{display:block;width:100%;aspect-ratio:1.6;object-fit:cover;background:radial-gradient(ellipse at 55% 40%,#fffdf4,#dcebf1);border-bottom:1px solid #e4d4bb}.map-card.active .map-illustration{background:radial-gradient(#ffffef,#e8edce)}
#workshop[data-panel=maps]{left:3%}.map-country{flex-wrap:wrap;white-space:nowrap}
.dialog{overflow-x:hidden}
.shop-rotate{left:5%;width:25%;top:41.8%}

.shop-search{display:flex;align-items:center;gap:6px;margin:0 0 5px;flex-shrink:0}.shop-search input,.shop-search select{min-width:0;border:1px solid #d9c5b7;border-radius:12px;background:#fffefa;color:#73564b;padding:6px;font-size:11px}.shop-search input{width:42%}.shop-search select{width:36%}.shop-search span{font-size:9px;white-space:nowrap;color:#967f6c}.shop-search input{pointer-events:auto;user-select:text}#shop select{pointer-events:auto}#shopMotion{max-width:35%;font-size:9px}