html,body{margin:0;height:100%;overflow:hidden;overscroll-behavior:none;background:#c3c8d1}body{font-family:Caveat,cursive;color:#4a4a4a;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}#game{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}#overlay{position:fixed;inset:0;pointer-events:none}.fps{position:absolute;top:6px;right:14px;font-size:20px;opacity:.55}html,#game{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 L13.7 10.3 L22 12 L13.7 13.7 L12 22 L10.3 13.7 L2 12 L10.3 10.3 Z' fill='%232b2b2b' stroke='white' stroke-width='1.5' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='white'/%3E%3C/svg%3E") 12 12,crosshair}#game.panning{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='white' stroke-width='3'/%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='%232b2b2b' stroke-width='1.4'/%3E%3Cpath d='M12 2 L13.7 10.3 L22 12 L13.7 13.7 L12 22 L10.3 13.7 L2 12 L10.3 10.3 Z' fill='%232b2b2b' stroke='white' stroke-width='1.5' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='white'/%3E%3C/svg%3E") 12 12,grabbing}.sketch-btn,.panel-close,.slider input{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 L13.7 10.3 L22 12 L13.7 13.7 L12 22 L10.3 13.7 L2 12 L10.3 10.3 Z' fill='%23c96f6f' stroke='white' stroke-width='1.5' stroke-linejoin='round'/%3E%3Ccircle cx='12' cy='12' r='1.5' fill='white'/%3E%3C/svg%3E") 12 12,pointer}.controls{position:absolute;left:0;right:0;bottom:calc(12px + env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:flex-end;padding:0 calc(12px + env(safe-area-inset-right)) 0 calc(12px + env(safe-area-inset-left));pointer-events:none}.controls .group{display:flex;gap:6px}.sketch-btn{pointer-events:auto;position:relative;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:transparent;color:#4a4a4a;font:600 25px Caveat,cursive;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.sketch-btn svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.sketch-btn span{position:relative;white-space:nowrap}.sketch-btn svg.pencil-icon{position:static;display:block;width:24px;height:24px}.sketch-btn:hover{color:#262626}.sketch-btn:active span{transform:translate(1px,1px)}.sketch-btn:focus-visible{outline:2px dashed rgba(74,74,74,.5);outline-offset:3px}.sketch-frame{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.controls .actions{margin:0 auto;justify-content:center}.hud{position:absolute;top:calc(10px + env(safe-area-inset-top));left:calc(14px + env(safe-area-inset-left));right:calc(14px + env(safe-area-inset-right));display:flex;justify-content:space-between;align-items:flex-start;gap:16px;pointer-events:none}.hud-right{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.hud-page{font-size:20px;opacity:.6;text-align:right;text-shadow:0 0 6px #c3c8d1,0 0 3px #c3c8d1}.notes{max-width:min(360px,44vw);text-align:right;font-size:18px;line-height:1.12;color:#3a3a40;text-shadow:0 0 6px #c3c8d1,0 0 3px #c3c8d1,0 0 2px #c3c8d1}.notes-toggle{pointer-events:auto;border:0;padding:0 0 2px;background:none;color:inherit;font:inherit;opacity:.55;cursor:pointer}.notes-toggle:hover{opacity:.85}.notes-body .eq{opacity:.78}.notes-body .val{font-weight:700;white-space:nowrap}.hud-left{max-width:min(520px,62vw);text-shadow:0 0 6px #c3c8d1,0 0 3px #c3c8d1}.hud-title{font-size:26px;font-weight:600;line-height:1.1}.hud-task{font-size:22px;line-height:1.15;margin-top:2px}.hud-hint{font-size:18px;line-height:1.2;opacity:.75;margin-top:2px}.fuel{display:flex;align-items:center;gap:8px;font-size:20px;margin-top:26px}.fuel svg{position:relative;overflow:visible}.toast{position:fixed;left:50%;top:22%;transform:translate(-50%,-6px);font-size:30px;font-weight:600;width:max-content;max-width:calc(100vw - 32px);text-align:center;line-height:1.1;pointer-events:none;opacity:0;transition:opacity .4s,transform .4s;text-shadow:0 0 8px #c3c8d1,0 0 4px #c3c8d1}.toast.shown{opacity:1;transform:translate(-50%)}.screens{position:absolute;inset:0;pointer-events:none}.screen{position:absolute;inset:0;display:flex;justify-content:center;padding:16px}.screen.place-center{align-items:flex-start;overflow-y:auto}.screen.place-center>.sketch-panel{margin:auto 0}.screen.place-bottom{align-items:flex-end;padding-bottom:calc(var(--bar-h, 52px) + 24px + env(safe-area-inset-bottom))}.sketch-panel{position:relative;pointer-events:auto;box-sizing:border-box;width:min(460px,100%);padding:22px 28px 20px;text-align:center}.sketch-panel>div{position:relative}.sketch-panel .big{font-size:44px;font-weight:600;line-height:1.05;margin:2px 0 6px}.sketch-panel.title .big{font-size:58px}.sketch-panel .small{font-size:20px;opacity:.7}.sketch-panel .line{font-size:21px;line-height:1.25}.sketch-panel .total{font-size:26px;font-weight:600;margin-top:6px}.sketch-panel .buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}.sketch-panel .buttons.waiting{opacity:0;pointer-events:none}.sketch-panel .buttons{transition:opacity .6s}.sketch-panel.wide{width:min(600px,100%)}.sketch-panel .fine{font-size:18px;line-height:1.2;opacity:.72;margin-top:6px}.sketch-panel .story{font-size:20px;line-height:1.2;margin-top:4px;text-align:left}.sketch-panel .picked{font-size:19px;margin-top:10px;opacity:.8}.sketch-btn[aria-pressed=true] span{font-weight:700}@media(max-width:520px){.hud-title{font-size:21px}.hud-task{font-size:19px}.hud-hint{font-size:16px}.fuel{margin-top:2px;font-size:17px}.hud{gap:8px}.hud-left{flex:1 1 auto;min-width:0}.hud-right{flex:0 1 auto;max-width:46vw}.hud-fuel svg{width:104px!important;height:16px!important}.notes{max-width:52vw;font-size:13px;line-height:1.12}.notes .note{white-space:nowrap}.sketch-panel .big{font-size:36px}.toast{top:32%;font-size:26px}.sketch-panel.title .big{font-size:46px}.controls .group{gap:4px}}.controls .view{align-items:flex-end}.sound-wrap{position:relative;display:flex}.sound-panel{position:absolute;right:0;bottom:56px;width:230px;padding:14px 16px 12px;display:flex;flex-direction:column;gap:8px;align-items:stretch}.controls .sketch-btn{touch-action:none}.sound-panel .sketch-btn{align-self:center}.track-row{display:flex;justify-content:center;gap:4px}.track-row .sketch-btn{font-size:18px}.slider{position:relative;display:flex;align-items:center;gap:8px;font-size:19px}.slider span{width:60px;text-align:left}.slider input{flex:1;-webkit-appearance:none;appearance:none;height:22px;background:transparent}.slider input::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(90deg,#d98a8a 0 var(--v, 50%),rgba(74,74,74,.35) var(--v, 50%))}.slider input::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;margin-top:-6.5px;border-radius:50%;background:#c3c8d1;border:1.5px solid #4a4a4a}.slider input::-moz-range-track{height:3px;background:#4a4a4a59}.slider input::-moz-range-progress{height:3px;background:#d98a8a}.slider input::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#c3c8d1;border:1.5px solid #4a4a4a}.audio-debug{position:absolute;top:120px;right:14px;width:240px;padding:10px;background:#c3c8d1f2;border:1px dashed rgba(74,74,74,.5);font-size:17px;pointer-events:auto}@media(max-width:560px){.controls{flex-wrap:wrap;row-gap:8px}.controls .actions{order:-1;flex-basis:100%}.controls .view{margin-left:auto}.sound-panel{bottom:50px}}.panel-close{position:absolute;top:2px;right:6px;width:34px;height:34px;padding:0;border:0;background:transparent;color:#4a4a4a;font:600 30px/30px Caveat,cursive;cursor:pointer;pointer-events:auto;z-index:1}.panel-close:hover{color:#d98a8a}.sound-panel{padding-top:26px}.tooltip{position:absolute;width:auto;max-width:min(280px,80vw);padding:10px 14px 9px;text-align:left;pointer-events:none}.tooltip-title{position:relative;font-size:22px;font-weight:600;line-height:1.05}.tooltip-text{position:relative;font-size:18px;line-height:1.2}.howto-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:12px;background:#282e4852;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto;z-index:20}.sketch-panel.howto{width:min(640px,100%);max-height:calc(100% - 8px);display:flex;flex-direction:column;text-align:left;padding:16px 22px 12px}.sketch-panel.howto .big{text-align:center;font-size:34px;margin:0 0 2px}.sketch-panel.howto .buttons{margin-top:10px}.sketch-panel.howto .credits{margin-top:8px}.howto-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:8px;scrollbar-width:thin;scrollbar-color:rgba(74,74,74,.35) transparent}.howto-body.more{-webkit-mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to bottom,#000 calc(100% - 28px),transparent)}.howto-body::-webkit-scrollbar{width:6px}.howto-body::-webkit-scrollbar-track{background:transparent}.howto-body::-webkit-scrollbar-thumb{background:#4a4a4a4d;border-radius:3px}.howto-body::-webkit-scrollbar-thumb:hover{background:#4a4a4a80}.howto-step{display:flex;gap:14px;align-items:center;margin-top:6px}.howto-pic{flex:0 0 200px}.howto-pic svg{display:block;width:100%;height:auto}.howto-text{font-size:18px;line-height:1.15}.howto-text>div+div{margin-top:4px}.howto-title{font-size:22px;font-weight:600}.howto-section{font-size:26px;font-weight:600;text-align:center;margin:14px 0 0;padding-top:8px;border-top:1px dashed rgba(74,74,74,.35)}@media(max-width:560px){.howto-step{flex-direction:column;align-items:stretch;gap:2px}.howto-pic{flex:none;max-width:260px;margin:0 auto;width:100%}}.sketch-panel .row-break{flex-basis:100%;height:0}.credits{margin-top:14px;font-size:14px;line-height:1.25;opacity:.5;text-align:center;transition:opacity .3s}.credits:hover{opacity:.85}.credits a{color:inherit;text-decoration:underline dotted;text-underline-offset:2px}.page-turn{position:fixed;inset:0;width:100%;height:100%;z-index:40;pointer-events:none}.cover{position:fixed;inset:0;z-index:60;perspective:1600px;cursor:pointer;pointer-events:auto}.cover-shade{position:absolute;inset:0;background:linear-gradient(90deg,#14182840,#14182800);transition:opacity .8s ease-out}.cover-board{position:absolute;inset:0;border-radius:14px;overflow:hidden;transform-origin:left center;transition:transform .8s cubic-bezier(.3,.6,.2,1),box-shadow .8s;box-shadow:0 0 40px #0a0e1866;outline:none}.cover-art{display:block;width:100%;height:100%}.cover-foot{position:absolute;left:16px;right:16px;bottom:calc(28px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}.cover-found{font-size:15px;color:#eef0f499}.cover-hint{text-align:center;font-size:22px;font-weight:600;color:#eef0f4;animation:cover-hint 2.4s ease-in-out infinite}@keyframes cover-hint{50%{opacity:.45}}.cover.opening .cover-board{transform:rotateY(-165deg);box-shadow:0 0 #0a0e1800}.cover.opening .cover-shade,.cover.fading{opacity:0}.cover.fading{transition:opacity .25s ease-out}.screen.leaving{pointer-events:none;perspective:1400px;z-index:2}.screen.leaving>.sketch-panel{pointer-events:none;transform-origin:left center;animation:page-over .65s cubic-bezier(.37,0,.63,1) both}.screen.leaving.turn-back>.sketch-panel{transform-origin:right center;animation-name:page-back}@keyframes page-over{0%{transform:rotateY(0);opacity:1}70%{opacity:1}to{transform:rotateY(-120deg);opacity:0}}@keyframes page-back{0%{transform:rotateY(0);opacity:1}70%{opacity:1}to{transform:rotateY(120deg);opacity:0}}@media(prefers-reduced-motion:reduce){.screen.leaving>.sketch-panel{animation:none;opacity:0;transition:opacity .2s}.cover-hint{animation:none}}.sketch-panel.stages{width:min(680px,100%)}.stage-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:10px 0 4px}.stage{display:flex;flex-direction:column;align-items:center;line-height:1}.stage-icon{display:block;margin-bottom:4px}.stage-name{font-size:20px;white-space:nowrap}.stage-sub{font-size:16px;margin-top:3px;opacity:.75}.stage-next .stage-sub{color:#9a454b;opacity:1}.stage-grid.compact{gap:6px}.stage-grid.compact .stage-name{font-size:17px}.stage-grid.compact .stage-sub{font-size:13px}.sketch-panel .buttons{align-items:center}.sketch-btn.locked{cursor:default}.sketch-btn.locked .stage-icon{opacity:.45;filter:grayscale(1)}.sketch-btn.locked .stage-name{opacity:.66}.sketch-btn.locked .stage-sub{opacity:.55}.sketch-btn.locked .sketch-frame{opacity:.45}.stage-icon{transition:transform .16s cubic-bezier(.2,.8,.2,1)}.sketch-btn:hover:not(:disabled) .stage-icon{transform:translateY(-2px) rotate(-3deg)}.menu-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:12px;background:#282e4852;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);pointer-events:auto;z-index:21}.sketch-panel.game-menu{width:min(300px,100%)}.menu-buttons{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:8px}.route-chart{position:fixed;inset:0;z-index:25;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12px;background:#282e4840;pointer-events:auto}.route-canvas canvas{display:block;max-width:min(96vw,1100px);max-height:64vh;width:auto;height:auto;box-shadow:0 6px 30px #14182840}.sketch-panel.route-note{width:min(560px,100%);padding:12px 22px}.sketch-btn .sketch-frame path:first-child{transition:fill .12s ease-out}.sketch-btn:hover:not(:disabled) .sketch-frame path:first-child{fill:#d6dae1f2}.sketch-btn.accent .sketch-frame path:first-child{fill:#c6c1c9eb}.sketch-btn.accent:hover:not(:disabled) .sketch-frame path:first-child{fill:#d4cbd1f2}.sketch-btn:active:not(:disabled) .sketch-frame path:first-child{fill:#b4bac5f2}.sketch-btn:active:not(:disabled) .sketch-frame{transform:translate(1px,1px)}.sketch-btn:focus-visible{outline:2px dashed #4a4a4a;outline-offset:4px}.sketch-btn.ready{animation:ready .9s cubic-bezier(.45,0,.55,1) infinite}@keyframes ready{50%{transform:scale(1.045)}}@keyframes sheet-in{0%{opacity:0;transform:translateY(10px) rotate(-.6deg)}to{opacity:1;transform:none}}@keyframes veil-in{0%{opacity:0}}.screen:not(.leaving)>.sketch-panel,.menu-wrap>.sketch-panel,.howto-wrap>.sketch-panel{animation:sheet-in .26s cubic-bezier(.2,.8,.2,1) both}.menu-wrap,.howto-wrap{background:#d6dae180;-webkit-backdrop-filter:blur(2px) saturate(.85);backdrop-filter:blur(2px) saturate(.85);animation:veil-in .18s ease-out both}.sketch-panel:not(.tooltip){box-shadow:0 10px 24px -12px #282e4859}.hud-left,.hud-page,.notes,.toast{text-shadow:0 0 2px #c3c8d1,0 0 4px #c3c8d1,0 0 8px #c3c8d1,0 0 14px rgba(195,200,209,.9)}.hud-hint{opacity:.88}.hud-page{opacity:.78}.notes-toggle{opacity:.72;padding:8px 0 8px 14px;margin:-8px 0 -6px -14px}@media(max-width:520px){.hud-page{font-size:15px}.toast{top:24%}.howto-step+.howto-step{margin-top:14px;padding-top:12px;border-top:1px dashed rgba(74,74,74,.25)}}.sketch-panel.result .picked{font-size:28px;font-weight:600;opacity:1;margin-top:8px}.credits{font-size:15px;opacity:.72}.hud,.controls{transition:opacity .25s}.turning .hud,.turning .controls{opacity:0;transition:opacity .15s}@media(pointer:coarse){.panel-close{width:44px;height:44px;top:0;right:2px}}.screen{padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.screen.place-bottom{padding-bottom:calc(var(--bar-h, 52px) + 24px + env(safe-area-inset-bottom))}@media(prefers-reduced-motion:reduce){.sketch-btn.ready,.screen>.sketch-panel,.menu-wrap>.sketch-panel,.howto-wrap>.sketch-panel{animation:none}.toast{transition:opacity .3s;transform:translate(-50%)}}.sketch-panel.album{width:min(760px,100%);max-height:calc(100% - 16px);display:flex;flex-direction:column}.album-wrap{z-index:30}.album-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin:10px 0;overflow-y:auto;min-height:0;flex:1 1 auto}.album-card{padding:0;border:0;background:none;cursor:pointer;transition:transform .16s cubic-bezier(.2,.8,.2,1)}.album-card img{display:block;width:100%;height:auto;box-shadow:0 6px 14px -6px #282e4873}.album-card:hover{transform:translateY(-2px) rotate(-.8deg)}.update-note{position:fixed;left:50%;top:calc(8px + env(safe-area-inset-top));transform:translate(-50%);z-index:70;padding:6px 14px;border:1.5px dashed #9a454b;border-radius:6px;background:#d6dae1f5;color:#4a4a4a;font:600 18px Caveat,cursive;pointer-events:auto;cursor:pointer;box-shadow:0 6px 14px -8px #282e4873}.toast,.hud .toast{top:auto;bottom:calc(var(--bar-h, 52px) + 86px + env(safe-area-inset-bottom));font-size:21px;line-height:1.15;padding:6px 16px 7px;max-width:min(560px,calc(100vw - 32px));width:max-content;background:#d6dae1f2;border:1px dashed rgba(74,74,74,.4);border-radius:8px;box-shadow:0 8px 18px -10px #282e4873;text-shadow:none;transform:translate(-50%,6px)}.toast.shown{transform:translate(-50%)}@media(max-width:520px){.toast,.hud .toast{top:auto;font-size:18px}}.sound-corner{position:fixed;top:calc(10px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));z-index:65;pointer-events:none}.sound-corner .sound-wrap{pointer-events:auto}.sound-corner .sound-panel{top:54px;bottom:auto}.track-row{flex-wrap:wrap;row-gap:4px}.postcard-view{position:fixed;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:calc(12px + env(safe-area-inset-top)) 16px calc(12px + env(safe-area-inset-bottom));background:#d6dae19e;-webkit-backdrop-filter:blur(3px) saturate(.85);backdrop-filter:blur(3px) saturate(.85);pointer-events:auto;animation:veil-in .18s ease-out both}.postcard-big{display:block;width:min(100%,900px,calc((100vh - 190px)*1.5));width:min(100%,900px,calc((100dvh - 190px)*1.5));height:auto;aspect-ratio:3 / 2;transform:rotate(-1.2deg);box-shadow:0 2px 3px #282e482e,0 18px 34px -14px #282e488c;animation:postcard-in .42s cubic-bezier(.2,.9,.25,1.05) both}@keyframes postcard-in{0%{opacity:0;transform:translateY(40px) rotate(4deg) scale(.94)}to{opacity:1;transform:rotate(-1.2deg)}}.postcard-note{min-height:1.2em;max-width:34em;text-align:center;font:600 22px/1.2 Caveat,cursive;color:#4a4a4a}.postcard-note:empty{display:none}.postcard-buttons{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px}@media(prefers-reduced-motion:reduce){.postcard-big{animation:none}}