:root{--ink:#3b2f2a;--ink-soft:#6b5a50;--cream:#fff7e8;--cream-2:#f6e8cf;--yellow:#ffcc4d;--yellow-d:#e5a91f;--red:#f0645a;--red-d:#c9423a;--green:#7cc47a;--green-d:#4f9a4d;--blue:#7fb8e6;--blue-d:#4f8ec2;--shadow:0 4px 0 #3b2f2a59;--radius:18px;--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);--safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;touch-action:none;overscroll-behavior:none;background:#cfe6f3;margin:0;font-family:Fredoka,Trebuchet MS,system-ui,sans-serif;overflow:hidden}canvas#game{outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.vignette{pointer-events:none;background:radial-gradient(at 50% 45%,#0000 55%,#281e3247 100%);position:fixed;inset:0}#hud{pointer-events:none;position:fixed;inset:0}#hud>*{pointer-events:auto}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:none;padding:0}.chip{background:var(--cream);border:3px solid var(--ink);box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:8px;padding:6px 14px 6px 8px;font-size:20px;font-weight:600;line-height:1;display:inline-flex}.chip svg{flex:none;width:28px;height:28px}.top-left{top:calc(12px + var(--safe-t));left:calc(12px + var(--safe-l));pointer-events:none;flex-direction:column;align-items:flex-start;gap:8px;display:flex;position:absolute}.money.bump{animation:.35s bump}@keyframes bump{30%{transform:scale(1.15)rotate(-2deg)}}.tidy{gap:6px;padding:5px 12px 5px 10px;font-size:14px}.tidy .bar{border:2px solid var(--ink);background:#e4d6bd;border-radius:6px;width:70px;height:10px;overflow:hidden}.tidy .bar i{background:var(--green);height:100%;transition:width .5s,background .5s;display:block}.status{flex-wrap:wrap;gap:6px;max-width:60vw;padding:6px 12px 6px 8px;font-size:15px}.status:empty{display:none}.status svg{width:24px;height:24px}.status b{font-weight:700}.status .sep{opacity:.35}.status .done{color:#3f8f4a}.wtag{background:var(--cream);border:3px solid var(--ink);box-shadow:var(--shadow);white-space:nowrap;pointer-events:none;border-radius:999px;align-items:center;gap:6px;padding:4px 10px 4px 5px;font-size:14px;font-weight:600;display:flex;position:absolute;top:0;left:0}.wtag:after{content:"";background:var(--cream);border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);width:10px;height:10px;position:absolute;bottom:-9px;left:50%;transform:translate(-50%)rotate(45deg)}.wtag .sw{border:2px solid var(--ink);background:var(--c);border-radius:4px;width:22px;height:16px}.wtag.good,.wtag.good:after{background:#d8f5d0}.wtag.bad,.wtag.bad:after{background:#ffd9d0}.top-right{top:calc(12px + var(--safe-t));right:calc(12px + var(--safe-r));gap:8px;display:flex;position:absolute}.icon-btn{background:var(--cream);border:3px solid var(--ink);width:54px;height:54px;box-shadow:var(--shadow);border-radius:16px;place-items:center;transition:transform .1s;display:grid;position:relative}.icon-btn svg{width:30px;height:30px}.icon-btn:active{transform:translateY(3px);box-shadow:0 1px #3b2f2a59}.icon-btn .badge{background:var(--red);color:#fff;border:2px solid var(--ink);border-radius:11px;place-items:center;min-width:22px;height:22px;padding:0 5px;font-size:13px;font-weight:700;display:none;position:absolute;top:-8px;right:-8px}.icon-btn .badge.on{animation:1.2s 3 pulse;display:grid}.controls{right:calc(16px + var(--safe-r));bottom:calc(16px + var(--safe-b));grid-template-rows:auto auto;grid-template-columns:auto auto;align-items:end;gap:10px;display:grid;position:absolute}.grab-btn{background:var(--yellow);border:4px solid var(--ink);width:112px;height:112px;box-shadow:0 6px 0 var(--ink);border-radius:50%;flex-direction:column;grid-area:1/2/span 2;justify-content:center;align-items:center;gap:2px;font-size:20px;font-weight:700;transition:transform 80ms,background .2s;display:flex}.grab-btn svg{width:44px;height:44px}.grab-btn:active,.grab-btn.pressed{box-shadow:0 1px 0 var(--ink);transform:translateY(5px)}.grab-btn[data-tone=blue]{background:var(--blue)}.grab-btn[data-tone=orange]{background:#f5a26b}.grab-btn[data-tone=green]{background:var(--green)}.grab-btn[data-tone=grey]{color:#7a6a5e;background:#d8cbb4}.grab-btn span{text-align:center;padding:0 6px;line-height:1}.winch{flex-direction:column;gap:8px;display:flex}.round-btn{background:var(--cream);border:3px solid var(--ink);width:58px;height:58px;box-shadow:var(--shadow);border-radius:50%;place-items:center;display:grid}.round-btn svg{width:28px;height:28px}.round-btn:active,.round-btn.pressed{transform:translateY(3px);box-shadow:0 1px #3b2f2a59}.tool-btn{background:var(--cream);border:3px solid var(--ink);width:auto;height:46px;box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:6px;padding:0 14px 0 8px;font-size:15px;font-weight:600;display:flex;position:absolute;bottom:calc(100% + 12px);right:0}.tool-btn svg{width:28px;height:28px}.tool-btn.hidden{display:none}.context{left:50%;bottom:calc(22px + var(--safe-b));pointer-events:none;gap:12px;display:flex;position:absolute;transform:translate(-50%)}.big-action{pointer-events:auto;border:4px solid var(--ink);box-shadow:0 6px 0 var(--ink);color:#fff;text-shadow:0 2px #00000040;white-space:nowrap;border-radius:999px;align-items:center;gap:10px;padding:12px 22px 12px 14px;font-size:22px;font-weight:700;display:none}.big-action.on{animation:.35s cubic-bezier(.3,1.6,.5,1) popin;display:flex}.big-action svg{width:34px;height:34px}.big-action:active{box-shadow:0 1px 0 var(--ink);transform:translateY(5px)}.big-action.red{background:var(--red)}.big-action.red.on{animation:.35s cubic-bezier(.3,1.6,.5,1) popin,1.6s .4s infinite wobble}.big-action.red.on.still{animation:1.6s infinite wobble}.big-action.green{background:var(--green)}.big-action.blue{background:var(--blue-d)}.big-action.on.still:not(.red){animation:none}.swatch{pointer-events:auto;border:4px solid var(--ink);background:var(--c);width:46px;height:46px;box-shadow:0 4px 0 var(--ink);border-radius:50%;align-self:center}.swatch:active{box-shadow:0 1px 0 var(--ink);transform:translateY(3px)}.big-action small{opacity:.9;font-size:15px;font-weight:600}@keyframes popin{0%{opacity:0;transform:scale(.4)}}@keyframes wobble{0%,to{transform:rotate(0)}10%{transform:rotate(-3deg)scale(1.05)}20%{transform:rotate(3deg)scale(1.05)}30%{transform:rotate(0)scale(1)}}@keyframes pulse{50%{transform:scale(1.12)}}.hints{left:calc(14px + var(--safe-l));bottom:calc(14px + var(--safe-b));color:var(--ink);pointer-events:none;background:#fff7e8d1;border:2px solid #3b2f2a80;border-radius:12px;padding:8px 12px;font-size:13px;line-height:1.6;position:absolute}.hints kbd{text-align:center;background:var(--cream);border:2px solid var(--ink);border-bottom-width:3px;border-radius:5px;min-width:20px;margin-right:2px;padding:0 5px;font-family:inherit;font-size:12px;font-weight:700;display:inline-block}.touch .hints{display:none}.card{top:calc(12px + var(--safe-t));background:var(--cream);border:3px solid var(--ink);border-radius:var(--radius);width:min(520px,100vw - 404px);box-shadow:var(--shadow);align-items:center;gap:12px;padding:10px 14px 10px 10px;display:none;position:absolute;left:50%;transform:translate(-50%)}.card.on{animation:.4s cubic-bezier(.3,1.4,.5,1) slidein;display:flex}@keyframes slidein{0%{opacity:0;transform:translate(-50%,-30px)}}.card .avatar{flex:none;width:56px;height:56px}.card .who{color:var(--ink-soft);font-size:14px;font-weight:700}.card .text{font-size:17px;line-height:1.3}.card .text b{color:#c9423a}.card .step{color:var(--ink-soft);align-self:flex-start;margin-left:auto;font-size:12px}.toasts{top:calc(96px + var(--safe-t));pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:absolute;left:50%;transform:translate(-50%)}.toast{background:var(--ink);color:var(--cream);text-align:center;border-radius:999px;max-width:calc(100vw - 32px);padding:8px 18px;font-size:16px;animation:.3s toastin,.4s forwards toastout;box-shadow:0 4px 12px #0003}.toast b{color:var(--yellow)}@keyframes toastin{0%{opacity:0;transform:translateY(-10px)}}@keyframes toastout{to{opacity:0;transform:translateY(-10px)}}.world{pointer-events:none;position:fixed;inset:0;overflow:hidden}.float{white-space:nowrap;-webkit-text-stroke:5px var(--ink);paint-order:stroke fill;text-shadow:0 3px 0 var(--ink);will-change:transform, opacity;font-size:24px;font-weight:700;position:absolute;top:0;left:0}.bubble{pointer-events:auto;background:var(--cream);border:3px solid var(--ink);width:280px;box-shadow:var(--shadow);transform-origin:50% 100%;border-radius:16px;padding:10px 12px 12px;font-size:15px;line-height:1.3;animation:.35s cubic-bezier(.3,1.6,.5,1) popin;position:absolute;top:0;left:0}.bubble:after{content:"";background:var(--cream);border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);width:20px;height:20px;position:absolute;bottom:-13px;left:50%;transform:translate(-50%)rotate(45deg)}.bubble .head{align-items:center;gap:8px;margin-bottom:4px;display:flex}.bubble .head svg{flex:none;width:38px;height:38px}.bubble .name{font-size:16px;font-weight:700}.bubble .role{color:var(--ink-soft);font-size:12px}.bubble .tip{justify-content:space-between;align-items:center;margin-top:8px;display:flex}.bubble .tip span{color:var(--green-d);font-weight:700}.pill-btn{background:var(--yellow);border:3px solid var(--ink);box-shadow:0 3px 0 var(--ink);border-radius:999px;padding:5px 14px;font-size:15px;font-weight:700}.pill-btn:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)}.pill-btn:disabled{color:#9a8a7e;cursor:default;background:#e3d7c3}.pointer{width:44px;height:52px;animation:.9s ease-in-out infinite bob;display:none;position:absolute;top:0;left:0}.pointer.on{display:block}@keyframes bob{50%{margin-top:-12px}}.site-list{flex-direction:column;gap:10px;display:flex}.site-card{border:3px solid var(--ink);background:#fff;border-radius:16px;align-items:center;gap:12px;padding:12px;display:flex}.site-card.here{background:#fff3c9}.site-card .ic{background:var(--cream-2);border-radius:14px;flex:none;place-items:center;width:64px;height:64px;display:grid}.site-card .ic svg{width:44px;height:44px}.site-card .info{flex:1;min-width:0}.site-card .info b{font-size:18px}.site-card .info p{color:var(--ink-soft);margin:2px 0 0;font-size:13px;line-height:1.3}.here-pill{background:var(--green);color:#fff;white-space:nowrap}.site-card .pill-btn{white-space:nowrap}.travel{z-index:9;pointer-events:none;opacity:0;background:#f4c98f;justify-content:center;align-items:center;transition:opacity .35s;display:flex;position:fixed;inset:0}.travel.on{opacity:1}.travel h2{color:var(--yellow);-webkit-text-stroke:7px var(--ink);paint-order:stroke fill;text-shadow:0 6px 0 var(--ink);margin:0;font-size:clamp(34px,6vw,60px);transform:rotate(-2deg)}.pause-wrap{z-index:8;background:#281e1e66;justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}.pause-wrap.on{display:flex}.pause-card{text-align:center;background:var(--cream);border:4px solid var(--ink);box-shadow:0 8px 0 var(--ink);border-radius:24px;padding:20px 28px 16px;animation:.3s cubic-bezier(.3,1.5,.5,1) popin}.pause-card h2{margin:0;font-size:34px}.pause-card p{color:var(--ink-soft);margin:4px 0 16px}.pause-card small{color:var(--ink-soft);margin-top:12px;font-size:13px;display:block}.touch .pause-card small{display:none}.pill-btn.big{align-items:center;gap:8px;padding:10px 22px 10px 14px;font-size:20px;display:inline-flex}.pill-btn.big svg{width:28px;height:28px}.fly{pointer-events:none;z-index:6;filter:drop-shadow(0 4px #3b2f2a59);width:100px;height:100px;position:fixed;top:0;left:0}.icon-btn.bump{animation:.4s bump}.discovery{text-align:center;background:var(--cream);border:4px solid var(--ink);width:min(300px,100vw - 32px);box-shadow:0 8px 0 var(--ink);z-index:5;cursor:pointer;border-radius:24px;flex-direction:column;align-items:center;gap:4px;padding:16px 18px 14px;display:none;position:fixed;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}.discovery.on{animation:.5s cubic-bezier(.3,1.6,.5,1) discover;display:flex}@keyframes discover{0%{opacity:0;transform:translate(-50%,-50%)scale(.3)rotate(-6deg)}}.discovery .burst{background:repeating-conic-gradient(#ffcc4d59 0 12deg, transparent 12deg 24deg);pointer-events:none;width:320px;height:320px;margin-left:-160px;animation:12s linear infinite spin-slow;position:absolute;top:-90px;left:50%}@keyframes spin-slow{to{transform:rotate(360deg)}}.discovery img{width:132px;height:132px;margin-top:2px;position:relative}.discovery .label{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);font-size:13px;font-weight:700;position:relative}.discovery .label span{color:var(--red-d)}.discovery b{font-size:22px;line-height:1.1;position:relative}.discovery p{color:var(--ink-soft);margin:2px 0 4px;font-size:15px;line-height:1.3;position:relative}.discovery .fee{color:var(--green-d);font-size:17px;font-weight:700;position:relative}.discovery small{color:var(--ink-soft);margin-top:4px;font-size:12px;position:relative}.book-hint{color:var(--ink-soft);margin:-4px 4px 10px;font-size:13px;line-height:1.4}.panel-wrap{pointer-events:auto;background:#281e1e59;justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}.panel-wrap.on{display:flex}.panel{background:var(--cream);border:4px solid var(--ink);width:min(640px,100%);max-height:min(86vh,760px);box-shadow:0 8px 0 var(--ink);border-radius:24px;flex-direction:column;animation:.3s cubic-bezier(.3,1.5,.5,1) popin;display:flex;overflow:hidden}.panel header{border-bottom:3px dashed #e3d2b3;align-items:center;gap:10px;padding:14px 16px 10px 20px;display:flex}.panel header h2{flex:1;margin:0;font-size:26px}.panel header .chip{box-shadow:none;font-size:17px}.panel .close{border:3px solid var(--ink);background:var(--red);color:#fff;border-radius:50%;place-items:center;width:42px;height:42px;font-size:20px;font-weight:700;display:grid}.panel .body{touch-action:pan-y;padding:12px 16px 18px;overflow-y:auto}.panel h3{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);margin:10px 4px 8px;font-size:15px}.shop-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;display:grid}.item{border:3px solid var(--ink);background:#fff;border-radius:16px;align-items:center;gap:10px;padding:10px;display:flex}.item .ic{background:var(--cream-2);border-radius:12px;flex:none;place-items:center;width:52px;height:52px;display:grid}.item .ic svg{width:36px;height:36px}.item .info{flex:1;min-width:0}.item .info b{font-size:16px;display:block}.item .info p{color:var(--ink-soft);margin:2px 0 0;font-size:13px;line-height:1.25}.item.owned{opacity:.6}.item.owned .pill-btn{background:var(--green);color:#fff}.book-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;display:grid}.treasure{border:3px solid var(--ink);text-align:center;background:#fff;border-radius:16px;padding:8px}.treasure .pic{background:radial-gradient(circle,#fff3c9,#f6e1b0);border-radius:10px}.treasure img{aspect-ratio:1;width:100%;display:block}.treasure.missing .pic{background:#efe4d0}.treasure.missing img{filter:brightness(0)opacity(.18)}.treasure b{margin-top:6px;font-size:14px;display:block}.treasure p{color:var(--ink-soft);margin:3px 0 0;font-size:12px;line-height:1.25}.stats{flex-wrap:wrap;gap:8px;margin:4px 0 8px;display:flex}.stats .chip{box-shadow:none;padding:6px 12px;font-size:15px}.settings-list{flex-direction:column;gap:10px;display:flex}.toggle{border:3px solid var(--ink);background:#fff;border-radius:14px;justify-content:space-between;align-items:center;padding:10px 14px;font-size:17px;font-weight:600;display:flex}.switch{border:3px solid var(--ink);background:#d8cbb4;border-radius:16px;flex:none;width:58px;height:32px;transition:background .2s;display:inline-block;position:relative}.switch:after{content:"";border:2px solid var(--ink);background:#fff;border-radius:50%;width:20px;height:20px;transition:left .2s;position:absolute;top:50%;left:3px;transform:translateY(-50%)}.switch.on{background:var(--green)}.switch.on:after{left:calc(100% - 23px)}.danger{background:#ffe1dc}.about{color:var(--ink-soft);margin:12px 4px 0;font-size:13px;line-height:1.5}#title{z-index:10;text-align:center;background:radial-gradient(at 50% 40%,#fff3d9 0%,#f4c98f 60%,#e39a6b 100%);flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:20px;transition:opacity .7s;display:flex;position:fixed;inset:0}#title.hide{opacity:0;pointer-events:none}#title h1{color:var(--yellow);-webkit-text-stroke:8px var(--ink);paint-order:stroke fill;text-shadow:0 8px 0 var(--ink);letter-spacing:.01em;margin:0;font-size:clamp(44px,9vw,96px);line-height:.95;transform:rotate(-3deg)}#title h1 span{color:#ff8f6b;font-size:.75em;display:block}#title .tag{max-width:560px;color:var(--ink);font-size:clamp(16px,2.6vw,22px)}#title .bar{border:3px solid var(--ink);background:var(--cream);border-radius:10px;width:min(320px,70vw);height:18px;overflow:hidden}#title .bar i{background:var(--yellow);width:0;height:100%;transition:width .2s;display:block}#title .start{background:var(--yellow);border:4px solid var(--ink);box-shadow:0 6px 0 var(--ink);border-radius:999px;padding:14px 36px;font-size:26px;font-weight:700;animation:1.4s infinite pulse;display:none}#title .start:active{box-shadow:0 1px 0 var(--ink);transform:translateY(5px)}#title .credit{bottom:calc(14px + var(--safe-b));color:var(--ink-soft);font-size:13px;position:absolute}#title .cube-logo{width:110px;height:110px;animation:6s linear infinite spin}@keyframes spin{50%{transform:rotate(8deg)translateY(-6px)}}@media (max-width:720px){.top-left{flex-direction:row;align-items:center;gap:6px}.tidy .bar{width:44px}.card{top:calc(70px + var(--safe-t));width:calc(100vw - 24px);padding:8px 10px 8px 8px}.card .avatar{width:44px;height:44px}.card.on{animation:none}.toasts{top:auto;bottom:calc(200px + var(--safe-b))}.card .text{font-size:15px}.chip{font-size:18px}.icon-btn{width:48px;height:48px}.grab-btn{width:100px;height:100px}.context{left:calc(14px + var(--safe-l));bottom:calc(18px + var(--safe-b));flex-direction:column;align-items:flex-start;transform:none}.big-action{padding:10px 16px 10px 10px;font-size:18px}.big-action svg{width:28px;height:28px}.bubble{width:240px;font-size:14px}}@media (max-width:480px){.tidy .lbl{display:none}.tidy{padding:6px 8px}.chip{padding:4px 10px 4px 6px;font-size:16px}.chip svg{width:24px;height:24px}.icon-btn{border-radius:14px;width:44px;height:44px}.icon-btn svg{width:26px;height:26px}.top-right{gap:6px}.grab-btn{width:92px;height:92px;font-size:17px}.grab-btn svg{width:36px;height:36px}.round-btn{width:52px;height:52px}}
