:root{--paper:#f4f0e5;--ink:#243c34;--muted:#768077;--orange:#e96936;--line:#d8d9cd;--green:#46614a;--white:#fffdf6;font-family:"Hiragino Kaku Gothic ProN","Yu Gothic","Noto Sans JP",system-ui,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;color:inherit;border:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #e96936;outline-offset:3px}button:disabled{opacity:.32;cursor:default}button{transition:transform .12s,background .15s,opacity .15s}button:active{transform:translateY(2px)}button.active{background:var(--ink);color:white}a{color:inherit;text-decoration:none}.hidden{display:none!important}.screen{min-height:100dvh}.masthead{height:83px;max-width:1350px;margin:auto;display:flex;align-items:center;gap:25px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:800;letter-spacing:1.7px}.brand-mark{display:grid;place-items:center;border:1.8px solid var(--ink);width:30px;height:30px;border-radius:50%;font-size:23px}.edition{font-size:10px;letter-spacing:2px;margin-left:auto}.sound-button{padding:8px 12px;border:1px solid var(--line);border-radius:20px;background:transparent;font-size:11px;font-weight:bold}.studio-layout{max-width:1170px;margin:48px auto 42px;display:grid;grid-template-columns:1fr 510px;gap:82px;align-items:center}.intro{align-self:center}.eyebrow,.tiny-label{font-size:9px;font-weight:800;letter-spacing:2.3px}.eyebrow{color:var(--orange);font-size:10px}h1{font-size:clamp(46px,5.3vw,78px);letter-spacing:-4px;font-weight:900;line-height:1.17;margin:23px 0 28px}h1>span{display:block;position:relative;width:fit-content;font-size:1.28em;letter-spacing:-7px}h1 svg{position:absolute;left:0;bottom:-15px;width:100%;height:23px;fill:none;stroke:var(--orange);stroke-width:4;stroke-linecap:round}.lead{font-size:17px;font-weight:600;line-height:1.9;letter-spacing:.5px}.intro-scene{position:relative;height:220px;margin-top:24px}#introCanvas{width:100%;height:100%;display:block}.scene-note{position:absolute;right:7px;top:20px;transform:rotate(-8deg);font-size:12px;color:#637366;letter-spacing:1px}.rules{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:22px;gap:15px}.rules div{display:flex;flex-direction:column;gap:8px}.rules b{font-size:11px;font-weight:500;font-family:monospace;color:var(--orange)}.rules span{font-size:12px;font-weight:700}.saved-note{font-size:10px;color:var(--muted);margin-top:25px}.paint-card{background:var(--white);padding:25px 28px 21px;border:1px solid #cecfbf;box-shadow:5px 6px 0 #e4e2d7;border-radius:3px;position:relative}.paint-card:before{content:"";display:block;position:absolute;top:-10px;left:42%;height:20px;width:82px;transform:rotate(-3deg);background:#e4bc7260}.card-heading{display:flex;justify-content:space-between;align-items:center}.card-heading h2{font-size:20px;letter-spacing:-.6px;margin:6px 0 13px}.tiny-label{color:#7a8876}.passport-number{font-family:monospace;font-size:12px;align-self:flex-start;color:#a0a794;padding-top:4px}.name-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding-bottom:10px;font-size:11px;margin-bottom:13px}.name-row label{color:var(--muted);white-space:nowrap}.name-row input{border:none;border-bottom:1px dashed #b2b8a8;color:var(--ink);font-weight:600;font-size:14px;background:transparent;min-width:0;width:100%;padding:3px 4px}.name-row>span{white-space:nowrap;font-size:9px;color:#939889}.paint-area{position:relative;width:100%;aspect-ratio:480/420;overflow:hidden;background-color:#fafaf5;background-image:radial-gradient(#c9d0c555 .8px,transparent .8px);background-size:15px 15px;border:1px solid #e0e2d5}.paint-area canvas{width:100%;height:100%;display:block;touch-action:none;cursor:crosshair}.paint-hint{position:absolute;bottom:10px;left:0;right:0;text-align:center;pointer-events:none;font-size:10px;color:#9ba296;transition:opacity .2s}.canvas-corner{position:absolute;width:10px;height:10px;border-color:#7b8d7c;border-style:solid;pointer-events:none}.tl{left:8px;top:8px;border-width:1px 0 0 1px}.tr{right:8px;top:8px;border-width:1px 1px 0 0}.bl{left:8px;bottom:8px;border-width:0 0 1px 1px}.br{right:8px;bottom:8px;border-width:0 1px 1px 0}.tool-row{display:flex;justify-content:space-between;gap:8px;margin:12px 0}.tool-group{display:flex;gap:3px;align-items:center}.tool{background:transparent;border-radius:5px;padding:6px 8px;font-size:20px}.tool span{font-size:10px;vertical-align:middle}.icon-button{background:transparent;font-size:23px;width:30px;height:33px}.text-button{font-size:10px;background:transparent;padding:6px}.color-row{display:flex;align-items:center;gap:9px;margin-bottom:13px}.palette{display:flex;justify-content:space-between;flex:1;gap:5px}.color-swatch{height:24px;width:24px;flex-shrink:0;border-radius:50%;background:var(--swatch);border:1px solid #0002;position:relative}.color-swatch.selected:after{content:"";position:absolute;inset:-4px;border:1.5px solid var(--ink);border-radius:50%}.custom-color{height:25px;width:25px;border:1px dashed #aaa;border-radius:50%;position:relative;display:grid;place-items:center;overflow:hidden;flex-shrink:0}.custom-color input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.brush-row{display:flex;align-items:center;gap:8px;padding:7px 0 11px;border-bottom:1px solid #e7e8dd}.control-label{font-size:10px;color:var(--muted);white-space:nowrap}.brush-options{display:flex;gap:5px}.brush-options button{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:transparent;border:1px solid transparent}.brush-options button.active{border-color:#506547;background:#edf1e7}.brush-options i{width:var(--dot);height:var(--dot);background:var(--ink);border-radius:50%}.symmetry{font-size:10px;margin-left:auto;background:transparent;padding:7px 3px}.symmetry b{font-size:8px;background:#e9ebe1;padding:3px 4px;border-radius:3px;margin-left:4px}.symmetry.active{background:transparent;color:#478455}.symmetry.active b{background:#426649;color:white}.template-row{display:flex;align-items:center;gap:7px;padding:12px 0 0}.template-row button{font-size:11px;background:#eef0e5;padding:5px 11px;border-radius:5px}.template-note{font-size:9px;color:var(--muted);margin-left:auto}.departure p{font-size:11px;text-align:center;margin:14px 0 11px;color:#798271}.primary-button{display:flex;justify-content:center;align-items:center;gap:24px;width:100%;padding:16px 14px;background:var(--orange);color:#fffdf4;border-radius:4px;font-weight:800;font-size:15px;box-shadow:0 3px 0 #b84e28}.primary-button>span{font-size:22px;line-height:16px}.primary-button:hover{background:#db5b29}.departure-note{display:block;text-align:center;font-size:9px;color:var(--muted);margin-top:12px}.studio-footer{border-top:1px solid var(--line);max-width:1350px;margin:auto;display:flex;justify-content:space-between;padding:20px 0;font-size:10px;letter-spacing:.7px;color:#8c9485}
#journey{position:fixed;inset:0;overflow:hidden;background:#dde8d1;touch-action:none;user-select:none;-webkit-user-select:none}#gameCanvas{width:100%;height:100%;display:block}.game-top{position:absolute;top:max(25px,env(safe-area-inset-top));left:35px;right:35px;display:flex;justify-content:space-between}.journey-heading{display:flex;flex-direction:column;gap:6px}.journey-heading strong{font-size:20px;letter-spacing:1px}.journey-heading>span:last-child{font-size:11px;opacity:.65}.game-actions{display:flex;gap:9px}.round-button{width:39px;height:39px;border:1px solid #36564044;border-radius:50%;background:#fff8;font-size:18px}.distance-panel{position:absolute;top:116px;left:35px}.distance-panel>span{font-size:45px;font-weight:900;letter-spacing:-2px;font-variant-numeric:tabular-nums}.distance-panel small{font-size:15px;margin-left:5px}.distance-panel em{font-size:10px;font-style:normal;opacity:.5;margin-left:9px}.route-bar{position:absolute;top:185px;left:35px;right:35px;height:3px;background:#24453422}.route-bar>span{display:block;width:0;height:3px;background:#456b46}.route-bar>i{position:absolute;top:-2px;width:1px;height:7px;background:#264b423b}.route-bar b{position:absolute;top:-6px;font-size:10px;left:0;color:#e76d34;transition:left .15s}.area-banner{position:absolute;left:0;right:0;top:33%;display:flex;flex-direction:column;align-items:center;opacity:0;transform:translateY(6px);transition:opacity .55s,transform .55s;pointer-events:none;text-shadow:0 1px 12px #fffa}.area-banner.visible{opacity:1;transform:translateY(0)}.area-banner>span{font-size:11px;letter-spacing:4px}.area-banner strong{font-size:clamp(25px,4vw,43px);font-weight:900;margin:8px}.area-banner p{font-size:12px;margin:0}.game-tip{position:absolute;left:50%;transform:translateX(-50%);bottom:210px;background:#fff9;border:1px solid #fff9;border-radius:25px;padding:9px 18px;text-align:center;font-size:12px;white-space:nowrap;transition:opacity .3s;pointer-events:none}.game-bottom{position:absolute;left:50%;transform:translateX(-50%);bottom:max(13px,env(safe-area-inset-bottom));width:430px;max-width:calc(100% - 34px)}.balance-row{display:flex;justify-content:space-between;gap:30px;padding:0 5px 13px}.balance-row>div:first-child{flex:1}.balance-row span{font-size:10px;font-weight:700}.balance-meter{position:relative;height:8px;margin-top:7px;border-radius:5px;background:linear-gradient(to right,#e9876880,#f4d89980 20%,#aacdb599 36%,#aacdb599 64%,#f4d89980 80%,#e9876880)}.balance-meter>i{position:absolute;width:4px;height:14px;background:#3b5443;left:50%;top:-3px;border-radius:3px;transform:translateX(-50%)}.stamina-wrap{width:95px}.stamina-meter{height:5px;background:#2f4e4022;margin-top:8px;border-radius:5px;overflow:hidden}.stamina-meter i{display:block;width:100%;height:100%;background:#527b49;transition:width .1s}.game-controls{display:flex;gap:12px}.action-button{height:76px;flex:1;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #203c3544;border-radius:9px;box-shadow:0 5px 0 #1d382e35;touch-action:none;font-size:17px;font-weight:800}.action-button:active,.action-button.pressed{transform:translateY(4px);box-shadow:0 1px 0 #1d382e35;filter:brightness(.96)}.action-button.brace{background:#fffcefec}.action-button.jump{background:#e96b38;color:#fff5e6;border-color:#ba4d30}.action-icon{font-size:30px;font-weight:400}.action-button>span:nth-child(2){display:flex;flex-direction:column;align-items:flex-start;gap:3px}.action-button small{font-weight:400;font-size:9px;opacity:.7}.action-button kbd{font-size:9px;opacity:.6;border:1px solid currentColor;padding:2px 4px;border-radius:3px}.control-footnote{text-align:center;font-size:10px;letter-spacing:1px;margin:12px 0 0;opacity:.6}.overlay{position:absolute;inset:0;background:#233b3475;display:flex;align-items:center;justify-content:center;padding:22px;backdrop-filter:blur(5px);overflow:auto}.pause-card,.result-card{background:var(--paper);border:1px solid #fff;border-radius:5px;padding:32px;width:390px;max-width:100%;box-shadow:8px 8px 0 #1b33272b;text-align:center}.pause-card h2{font-size:23px;margin:20px 0 12px}.pause-card p{color:var(--muted);font-size:12px;margin-bottom:27px}.secondary-button{display:block;width:100%;background:transparent;border:1px solid #acb6a6;padding:12px;margin-top:13px;border-radius:4px;font-size:12px;font-weight:700}.result-overlay{background:#233b3455;padding:18px}.result-card{width:390px;position:relative;padding:24px 28px 15px;max-height:calc(100dvh - 30px);overflow:auto}.result-top{display:flex;justify-content:space-between;align-items:flex-start}.result-top .tiny-label{font-size:8px;text-align:left}.result-stamp{color:#bc562e;border:2px solid #bc562e;border-radius:3px;transform:rotate(9deg);font-size:13px;font-weight:900;padding:5px 7px;white-space:nowrap}.result-portrait{width:130px;height:103px;margin:0 auto}.result-portrait canvas{width:100%;height:100%;object-fit:contain}.result-name{font-size:11px;letter-spacing:1px}.result-card h2{font-size:23px;margin:9px -10px 10px;letter-spacing:-1px}.result-quote{font-size:11px;color:#6d796a;line-height:1.7;min-height:35px;margin:0}.result-distance{margin:12px 0 3px}.result-distance strong{font-size:66px;line-height:1;letter-spacing:-4px;font-variant-numeric:tabular-nums}.result-distance span{font-size:12px;margin-left:9px;font-weight:600}.result-meta{display:flex;justify-content:space-between;font-size:9px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0;margin-top:15px}.result-route{display:flex;justify-content:space-between;margin:12px 0 18px;gap:4px}.result-route span{background:#dedfd2;font-size:9px;padding:5px 9px;border-radius:3px;color:#929886}.result-route span.passed{background:#dce4c9;color:#4a6342}.result-route span.current{background:#e87a47;color:white}.result-card .primary-button{font-size:13px;padding:14px 8px;gap:10px}.postcard-button{font-size:10px;background:transparent;color:#7f867b;padding:14px 5px 5px}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);color:#fffaf0;background:#294236;padding:13px 20px;z-index:20;border-radius:8px;font-size:12px;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:90%;width:max-content}#toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1500px){.studio-layout{margin-top:65px;gap:110px;max-width:1250px;grid-template-columns:1fr 550px}.paint-area{aspect-ratio:480/420}.intro-scene{height:245px}}
@media(max-width:1390px){.masthead,.studio-footer{margin-left:5%;margin-right:5%}.studio-layout{margin-left:6%;margin-right:6%;gap:7%;grid-template-columns:1fr 47%}}
@media(max-width:900px){.studio-layout{gap:30px;margin:35px 5%;grid-template-columns:1fr 52%}h1{font-size:52px}.intro-scene{height:175px}.rules span{font-size:10px}.paint-card{padding:22px 19px}.template-note{display:none}.tool{padding:5px}.tool span{font-size:9px}.color-swatch{width:21px;height:21px}.palette{gap:4px}.lead{font-size:14px}.rules{gap:5px}.card-heading h2{font-size:17px}.brush-options{gap:1px}.brush-options button{width:25px}.symmetry{font-size:9px}}
@media(max-width:640px){.masthead{height:62px;margin:0 20px;gap:8px}.brand{font-size:8px;letter-spacing:1.1px}.brand-mark{width:25px;height:25px;font-size:19px}.edition{display:none}.sound-button{margin-left:auto;font-size:9px;padding:7px 8px}.studio-layout{display:block;margin:23px 18px 25px}.intro{position:relative;margin:0 3px 25px}.eyebrow{font-size:8px;letter-spacing:1.7px}h1{font-size:39px;line-height:1.14;letter-spacing:-2px;margin:11px 0 10px}h1>span{font-size:1.15em;letter-spacing:-3px;display:inline;margin-left:4px}h1 svg{bottom:-12px;height:15px}.lead{font-size:12px;line-height:1.7;margin:22px 0 0;position:relative;z-index:1}.intro-scene{height:110px;position:absolute;right:-5px;bottom:-6px;width:47%;margin:0}.scene-note{display:none}.rules,.saved-note{display:none}.paint-card{padding:20px 17px 18px}.card-heading h2{font-size:19px}.paint-area{aspect-ratio:480/420}.paint-controls{margin-top:3px}.tool{padding:6px 7px}.tool span{font-size:10px}.color-swatch{width:23px;height:23px}.color-row{gap:8px}.color-row .palette{gap:5px}.brush-options button{width:30px;height:30px}.brush-options{gap:6px}.symmetry{font-size:10px}.template-row button{padding:6px 12px}.template-note{display:block;font-size:8px}.departure p{margin-top:13px}.departure-note{font-size:8px}.primary-button{padding:17px 10px;font-size:14px}.studio-footer{margin:0 20px;padding:16px 0;justify-content:center}.studio-footer>span:first-child{display:none}.studio-footer>span:last-child{font-size:9px}.game-top{top:max(21px,env(safe-area-inset-top));left:20px;right:20px}.journey-heading strong{font-size:19px}.journey-heading .tiny-label{font-size:7px;letter-spacing:1.8px}.journey-heading>span:last-child{font-size:10px}.game-actions{gap:6px}.round-button{height:33px;width:33px;font-size:16px}.distance-panel{left:20px;top:112px}.distance-panel>span{font-size:43px}.route-bar{top:178px;left:20px;right:20px}.game-tip{font-size:10px;padding:8px 12px;bottom:202px;max-width:94%;white-space:normal;width:max-content}.game-bottom{bottom:max(18px,env(safe-area-inset-bottom))}.action-button{height:72px}.action-button kbd{display:none}.action-button small{font-size:9px}.area-banner{top:29%}.area-banner strong{font-size:28px}.area-banner p{font-size:11px}.result-card{padding:20px 23px 13px}.result-distance strong{font-size:58px}}
@media(max-height:690px){.result-portrait{height:65px;width:100px}.result-card h2{margin:6px 0;font-size:20px}.result-distance{margin:8px 0 2px}.result-distance strong{font-size:45px}.result-route{margin:8px 0 12px}.result-meta{margin-top:10px;padding:8px 0}.result-quote{min-height:0}.result-card{padding-top:18px}.game-tip{bottom:172px}.action-button{height:58px}.game-bottom{bottom:9px}.balance-row{padding-bottom:10px}.distance-panel{top:90px}.distance-panel>span{font-size:34px}.route-bar{top:143px}}
@media(max-height:510px) and (min-width:641px){.game-bottom{left:auto;right:22px;transform:none;max-width:350px}.game-tip{bottom:27px;left:30px;transform:none;max-width:40%}.area-banner{top:28%}.result-card{width:440px}.result-portrait{display:none}.result-route{display:none}.result-card h2{font-size:18px}.result-card .secondary-button{margin-top:9px;padding:9px}.result-card .primary-button{padding:11px}.result-quote{font-size:10px}.result-distance strong{font-size:38px}.result-meta{margin:9px 0}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto}button,.area-banner{transition:none}}
.drawing-profile{display:flex;flex-wrap:wrap;gap:5px;margin-top:14px;padding-top:11px;border-top:1px dashed #d3d9c8}.drawing-profile span{font-size:9px;padding:5px 7px;border-radius:4px;background:#eaf0df;color:#516948}.drawing-profile span:empty{display:none}.departure p{font-size:10px}.auto-bottom{width:400px;padding:16px 20px 12px;border:1px solid #ffffff60;border-radius:10px;background:#f8f5eabb;backdrop-filter:blur(6px)}.watch-status{display:flex;justify-content:space-between;align-items:center}.auto-live{font-size:9px;letter-spacing:2px;font-weight:900;color:#df693b}#runSpeed{font-family:monospace;font-size:13px;color:#7f8b74}#autoAction{font-size:18px;display:block;margin:10px 0 12px;letter-spacing:-.3px}.auto-bottom .balance-row{padding:0;gap:25px}.hands-off{font-size:9px!important;font-weight:400!important;line-height:1.65;color:#88907f}.auto-bottom .control-footnote{margin-top:10px;font-size:9px}.game-tip{bottom:210px}.result-diagnosis{text-align:left;background:#e8eddf;border-radius:5px;padding:10px 12px;margin:0 0 14px}.result-diagnosis>strong{font-size:11px}.result-diagnosis>p{font-size:10px;line-height:1.6;margin:5px 0;color:#68785d}.result-diagnosis>span{font-size:10px;color:#d35f2e;font-weight:bold}.result-card #retry{background:transparent;color:#43583b;border:1px solid #aeb9a1;box-shadow:none;padding:11px;font-weight:600;font-size:11px}.result-card #editCharacter{background:#2f4937;color:#f8f7e8;border-color:#2f4937;margin-top:10px}.result-card{max-height:calc(100dvh - 24px)}.result-portrait{height:86px}.result-distance strong{font-size:57px}.result-distance{margin:8px 0}.result-meta{margin-top:11px;padding:9px 0}.result-route{margin:10px 0 12px}.result-card h2{font-size:21px}.result-quote{min-height:0}.result-card .postcard-button{font-size:10px}
@media(max-width:640px){.auto-bottom{max-width:calc(100% - 38px);bottom:max(17px,env(safe-area-inset-bottom));padding:15px 18px 11px}.game-tip{bottom:205px}.drawing-profile span{font-size:8px}.result-card{padding:18px 22px 12px}.result-portrait{height:75px}#autoAction{font-size:16px}.departure .primary-button{font-size:13px;gap:12px}}
@media(max-height:690px){.auto-bottom{padding:10px 16px 8px}.auto-bottom #autoAction{margin:6px 0;font-size:15px}.auto-bottom .control-footnote{margin-top:6px}.game-tip{bottom:177px}.result-portrait{height:50px}.result-card .result-distance strong{font-size:43px}.result-diagnosis{margin-bottom:9px;padding:8px 10px}.result-card h2{font-size:18px}.result-meta{margin-top:7px}.result-route{margin:7px 0 9px}}
.before-chip{position:absolute;top:108px;right:35px;width:80px;text-align:center;background:#fff9;border:1px solid #ffffff85;border-radius:7px;padding:6px 4px 1px;pointer-events:none}.before-chip span{display:block;font-size:9px;color:#7d8873;letter-spacing:1px}.before-chip canvas{display:block;width:70px;height:62px}.damage-meter{height:6px;margin-top:9px;background:#5a70541c;border-radius:5px;overflow:hidden}.damage-meter>i{display:block;height:100%;width:0;background:linear-gradient(90deg,#d7bb64,#e56d39);border-radius:5px;transition:width .35s}.damage-number{font-size:9px!important;font-weight:500!important;color:#8a735c;white-space:nowrap;align-self:center}.damage-number b{font-size:23px;color:#d4703f;margin-right:3px}.result-portrait{width:100%;height:auto;aspect-ratio:640/225;margin:13px 0 7px}.result-portrait canvas{width:100%;height:100%;display:block}.result-card .result-name{font-size:10px}.result-card h2{font-size:20px;margin-top:5px}.result-card .result-quote{font-size:10px}.result-diagnosis{padding:9px 12px}.result-diagnosis>strong{font-size:11px}.departure .primary-button{font-size:13px;gap:12px}.auto-bottom #autoAction{font-size:16px}
@media(max-width:640px){.before-chip{right:20px;top:110px;width:68px;padding:5px 2px 0}.before-chip canvas{width:62px;height:54px}.before-chip span{font-size:8px}.result-portrait{height:auto;width:100%}.result-card h2{font-size:18px}.departure .primary-button{font-size:12px}}
@media(max-height:690px){.before-chip{top:84px}.result-portrait{height:auto;max-height:107px}.auto-bottom #autoAction{font-size:14px}}

/* The two paintings are the main result, including on short screens. */
.result-overlay .result-card{width:620px;padding:24px 22px 18px}
.result-overlay .result-portrait{display:block;width:100%;height:auto;max-height:none;aspect-ratio:840/500;margin:18px 0 12px}
.result-overlay .result-portrait canvas{display:block;width:100%;height:100%}
@media(max-width:640px){.result-overlay{padding:10px}.result-overlay .result-card{padding:20px 12px 14px;max-height:calc(100dvh - 20px)}.result-overlay .result-portrait{margin:16px 0 12px}}

/* Keep the moving painting free of commentary. */
#biomeDesc,#areaSubtitle,#gameTip,#autoAction{display:none!important}
.auto-bottom{padding:12px 18px 10px}
.auto-bottom .balance-row{margin-top:8px}
/* Before/after dominates the report; supporting numbers stay small. */
.result-overlay .result-card{width:900px;padding:16px 16px 14px}
.result-overlay .result-portrait{height:auto;aspect-ratio:840/500;margin:10px 0 12px;max-height:56dvh}
.result-overlay .result-portrait canvas{object-fit:contain}
.result-overlay .result-top{align-items:center}
.result-overlay .result-stamp{font-size:10px;border-width:1px;padding:3px 6px;transform:none}
.result-overlay .result-name{font-size:10px;color:#7a8876}
.result-overlay .result-card h2{font-size:14px;letter-spacing:0;margin:5px 0}
.result-overlay .result-quote,.result-overlay .result-route,#resultCause,#comparison{display:none}
.result-overlay .result-distance{display:inline-block;margin:4px 12px 6px 0}
.result-overlay .result-distance strong{font-size:25px;letter-spacing:-1px}
.result-overlay .result-distance span{font-size:10px;margin-left:5px}
.result-overlay .result-diagnosis{display:inline-block;background:none;padding:0;margin:0 0 8px;text-align:center}
.result-overlay .result-diagnosis>strong{font-size:10px;font-weight:500}
.result-overlay .result-meta{margin:0 0 10px;padding:6px 0;font-size:9px}
.result-overlay .result-card .primary-button{font-size:12px;padding:11px 8px}
.result-overlay .result-card #editCharacter{background:transparent;color:#43583b;margin-top:7px;padding:9px;font-size:11px}
@media(max-width:640px){.result-overlay{padding:6px}.result-overlay .result-card{padding:12px 8px;max-height:calc(100dvh - 12px)}.result-overlay .result-portrait{aspect-ratio:840/1120;max-height:none;margin:8px 0 10px}}

/* A short invitation and drawing tools are enough on the start screen. */
#studio .edition,#studio .eyebrow,#studio .scene-note,#studio .rules,#studio .saved-note,#studio .card-heading .tiny-label,#studio .passport-number,#studio .name-row>span,#studio .template-note,#studio .drawing-profile,#studio #bodyAdvice,#studio .departure-note,#studio .studio-footer{display:none}
#studio .studio-layout{margin-top:24px;margin-bottom:24px;gap:48px}
#studio .lead{font-size:15px;line-height:1.6;margin:12px 0}
#studio .intro-scene{height:170px;margin-top:14px}
#studio .departure{margin-top:14px}
#studio .card-heading h2{font-size:17px;margin:0 0 12px}
@media(max-width:640px){#studio .masthead{height:54px}#studio .studio-layout{margin-top:12px;gap:12px}#studio .intro h1{font-size:29px;letter-spacing:-1px;line-height:1.2;margin:0}#studio .intro h1>span{display:inline;font-size:1em;letter-spacing:-1px;margin-left:4px}#studio .intro h1 svg{display:none}#studio .lead{font-size:12px;margin:8px 0 0}#studio .intro-scene{display:none}#studio .paint-card{padding-top:16px}}

/* Growth is a record of the journey, never a remaining-health bar. */
.damage-meter{display:none}
#studio .intro h1{font-size:clamp(32px,4.2vw,60px);letter-spacing:-2px}
#studio .intro h1>span{font-size:1em;letter-spacing:-2px}
@media(max-width:640px){#studio .intro h1{font-size:26px;letter-spacing:-1px}#studio .intro h1>span{letter-spacing:-1px}.brand{font-size:10px;letter-spacing:.5px}}

/* The square drawing surface is the largest element on every start screen. */
#studio{padding:0 14px 20px}
#studio .masthead{max-width:760px;height:56px}
#studio .studio-layout{display:flex;flex-direction:column;max-width:760px;margin:16px auto 24px;gap:14px;align-items:stretch}
#studio .intro{text-align:center}
#studio .intro h1{font-size:26px;line-height:1.3;letter-spacing:-1px;margin:0}
#studio .intro h1>span{display:inline;font-size:1em;letter-spacing:-1px;margin-left:4px}
#studio .intro .lead{font-size:12px;margin:7px 0 0}
#studio .intro-scene{display:none}
#studio .paint-card{width:100%;max-width:none;padding:16px;box-shadow:3px 4px 0 #e4e2d7}
#studio .paint-area{width:100%;aspect-ratio:1/1;background-color:#fafaf5;background-image:linear-gradient(to right,#81948038 1px,transparent 1px),linear-gradient(to bottom,#81948038 1px,transparent 1px),linear-gradient(to right,#81948025 1px,transparent 1px),linear-gradient(to bottom,#81948025 1px,transparent 1px);background-size:10% 10%,10% 10%,50% 50%,50% 50%;background-position:0 0}
#studio .paint-area canvas{width:100%;height:100%;aspect-ratio:1/1}
@media(max-width:640px){#studio{padding:0 8px 16px}#studio .studio-layout{margin:10px auto 16px;gap:10px}#studio .paint-card{padding:10px 6px}#studio .intro h1{font-size:22px}#studio .card-heading,#studio .name-row,#studio .paint-controls,#studio .departure{margin-left:4px;margin-right:4px}#studio .name-row{margin-bottom:9px}}



/* Let the traveler occupy the screen; keep controls at the edges. */
#journey .journey-heading,#journey .area-banner,#journey .before-chip{display:none!important}
#journey .game-top{top:max(12px,env(safe-area-inset-top));left:12px;right:12px;justify-content:flex-end}
#journey .distance-panel{top:max(12px,env(safe-area-inset-top));left:16px;display:flex;align-items:baseline;gap:4px}
#journey .distance-panel>span{font-size:30px;letter-spacing:-1px}
#journey .distance-panel small{font-size:12px;margin-left:0}
#journey .distance-panel em{font-size:10px;margin-left:4px}
#journey .round-button{width:38px;height:38px}
#journey .route-bar{top:64px;left:16px;right:16px;height:2px}
#journey .auto-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;bottom:max(10px,env(safe-area-inset-bottom));width:auto;min-width:240px;max-width:calc(100% - 24px);padding:8px 13px;border-radius:24px;background:#f8f5eac9}
#journey .auto-bottom .auto-live,#journey .auto-bottom .control-footnote{display:none}
#journey .auto-bottom .watch-status{font-size:11px;white-space:nowrap}
#journey .auto-bottom .balance-row{margin:0;padding:0;gap:10px;align-items:center}
#journey .auto-bottom #balanceLabel{font-size:10px;font-weight:500}
#journey .auto-bottom .damage-number b{font-size:19px}
#studio .card-heading{justify-content:flex-end;margin-bottom:10px}

/* A fixed foreground bubble stays readable above both towns. */
.town-cheer{position:absolute;z-index:3;top:86px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);padding:10px 28px 12px;background:#fffdf5;border:2px solid #52694d;border-radius:18px;box-shadow:0 4px 0 #334b3220;text-align:center;pointer-events:none;color:#284a35}
.town-cheer:after{content:'';position:absolute;left:calc(50% - 8px);bottom:-9px;width:14px;height:14px;background:#fffdf5;border-right:2px solid #52694d;border-bottom:2px solid #52694d;transform:rotate(45deg)}
.town-cheer strong{display:block;font-size:clamp(25px,5vw,32px);line-height:1.25;font-weight:900;letter-spacing:1px}
.town-cheer span{display:block;font-size:clamp(17px,3.8vw,22px);font-weight:800;line-height:1.4;margin-top:2px}
@media(max-height:510px){.town-cheer{top:76px;padding:6px 22px 8px}.town-cheer strong{font-size:22px}.town-cheer span{font-size:16px}}

#pauseOverlay{z-index:4}

.privacy-note{margin-top:14px;color:#596b51;font-size:11px;line-height:1.7}.privacy-note summary{cursor:pointer;padding:6px 0}.privacy-note p{margin:7px 0}.privacy-note button{background:transparent;border:1px solid #b5c2aa;border-radius:5px;padding:8px 12px;margin-top:3px}

#studio .start-bar{position:sticky;top:0;z-index:5;max-width:760px;margin:0 auto;padding:calc(8px + env(safe-area-inset-top)) 0 8px;background:var(--paper)}#studio .start-bar #depart{width:100%;min-height:48px;padding:12px 16px;font-size:16px}

.result-overlay .result-top{gap:8px;flex-wrap:wrap}.result-game-title{font-size:clamp(17px,4.2vw,24px);font-weight:900;line-height:1.4;letter-spacing:.02em;text-align:left;color:var(--ink)}
