:root{--paper: #f5f2ea;--ink: #232633;--ink-soft: rgba(35, 38, 51, .62)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;background:var(--paper);color:var(--ink);font-family:Georgia,Times New Roman,serif;-webkit-user-select:none;user-select:none}#app{position:fixed;top:0;right:0;bottom:0;left:0}#app>canvas{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none}.lettered canvas{mix-blend-mode:multiply}.loader{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;z-index:60;transition:opacity .7s ease}.loader.gone{opacity:0;pointer-events:none}.loader-track{width:min(240px,60vw);height:3px;background:#2326331f;border-radius:2px;overflow:hidden}.loader-bar{height:100%;background:var(--ink-soft);transform-origin:left;transform:scaleX(0)}.title-veil{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-start;justify-content:center;padding-top:max(6vh,28px);z-index:50;transition:opacity .9s ease;pointer-events:none}.title-veil.gone{opacity:0}.title-box{display:flex;flex-direction:column;align-items:center;gap:14px;pointer-events:auto}.title-veil.gone .title-box{pointer-events:none}.game-title{max-width:92vw}.game-title canvas,.game-sub canvas{max-width:100%;height:auto}.game-sub{opacity:.85;max-width:92vw}.game-sub canvas{max-width:100%;height:auto}.title-btn{background:#f5f2eacc;border:1.6px solid rgba(35,38,51,.55);border-radius:3px 14px 4px 12px/10px 4px 12px 5px;padding:9px 26px 7px;cursor:pointer;transition:transform .15s ease,border-color .15s ease}.title-btn:hover{transform:rotate(-.6deg) scale(1.03);border-color:var(--ink)}.hud{position:absolute;top:max(10px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));display:flex;gap:10px;z-index:40;opacity:0;pointer-events:none;transition:opacity .6s ease}.hud.show{opacity:1;pointer-events:auto}.hud-btn{background:none;border:1.4px solid rgba(35,38,51,.4);border-radius:3px 10px 4px 9px/8px 4px 9px 5px;padding:6px 12px 4px;cursor:pointer}.hud-btn:hover{border-color:var(--ink)}.region-card{position:absolute;left:50%;top:12%;transform:translate(-50%) translateY(-8px);display:flex;flex-direction:column;align-items:center;gap:2px;opacity:0;pointer-events:none;z-index:35;transition:opacity .8s ease,transform .8s ease;padding:6px 20px 9px;border-radius:40% 46% 44% 42%/50% 48% 52% 46%;background:#f7f4eb99;box-shadow:0 0 22px 16px #f7f4eb99}.region-card.show{opacity:1;transform:translate(-50%) translateY(0)}.region-card .district{margin-top:2px;opacity:.8}.blink{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--paper);opacity:0;pointer-events:none;z-index:58;transition:opacity .7s ease}.blink.show{opacity:1;transition:opacity .22s ease}.hint{position:absolute;left:50%;bottom:max(26px,env(safe-area-inset-bottom));transform:translate(-50%);opacity:0;pointer-events:none;z-index:35;transition:opacity .7s ease}.hint.show{opacity:1}.hint.held{visibility:hidden}.labels{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:30}.poi-label{position:absolute;transform:translate(-50%,-100%);opacity:0;transition:opacity .5s ease;pointer-events:none;white-space:nowrap}.poi-label.show{opacity:1}#prompt{position:absolute;transform:translate(-50%,-100%);opacity:0;transition:opacity .4s ease;cursor:pointer;z-index:32;padding:4px 10px;pointer-events:none}#prompt.show{opacity:1;pointer-events:auto}.hold-line{position:absolute;width:140px;height:10px;transform:translate(-50%,2px);opacity:0;pointer-events:none;z-index:32}.hold-line.show{opacity:1}#joy{position:absolute;width:96px;height:96px;margin:-48px 0 0 -48px;border:1.4px solid rgba(35,38,51,.25);border-radius:50%;opacity:0;pointer-events:none;z-index:34;transition:opacity .2s ease}#joy .nub{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border:1.6px solid rgba(35,38,51,.45);background:#f5f2ea80;border-radius:50%}#joy.active{opacity:1}#joy.running{border-color:#2326338c;border-width:2.6px}#joy.running .nub{background:#f5f2ea57;border-color:#2326339e;border-width:2.2px}.note-veil{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#3c382e2e;opacity:0;pointer-events:none;z-index:55;transition:opacity .4s ease}.note-veil.show{opacity:1;pointer-events:auto}.note-card{background:#f7f4eb;border:1.4px solid rgba(35,38,51,.3);border-radius:4px 16px 5px 14px/12px 5px 14px 6px;box-shadow:3px 4px #2326331f;padding:clamp(15px,4.6vw,26px) clamp(17px,5.6vw,30px) clamp(12px,3.8vw,20px);max-width:min(460px,92vw);max-height:86vh;overflow-y:auto;transform:rotate(-.5deg);display:flex;flex-direction:column;gap:clamp(6px,2vw,12px)}.note-close{align-self:flex-end;opacity:.7;cursor:pointer}.choice-card{transform:rotate(.3deg)}.choice-options{display:flex;flex-direction:column;align-items:stretch;gap:clamp(6px,1.8vw,10px);margin-top:clamp(4px,1.4vw,8px)}.choice-btn{background:#f5f2eab3;border:1.5px solid rgba(35,38,51,.5);border-radius:3px 12px 4px 10px/9px 4px 10px 5px;padding:8px 14px 6px;cursor:pointer;text-align:left;transition:transform .15s ease,border-color .15s ease}.choice-btn:hover{transform:rotate(-.4deg) scale(1.015);border-color:var(--ink)}.choice-btn canvas{max-width:100%;height:auto}.replies{position:absolute;left:50%;bottom:58px;transform:translate(-50%);display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px;opacity:0;pointer-events:none;transition:opacity .25s ease;z-index:34;max-width:calc(100vw - 24px)}.replies.show{opacity:1;pointer-events:auto}@media (max-aspect-ratio: 4/5){.replies{bottom:10px;flex-direction:column;align-items:center;gap:6px}.reply-btn{padding:6px 12px 4px}}.reply-btn{background:#f7f4ebf0;border:1.5px solid rgba(35,38,51,.6);border-radius:3px 12px 4px 10px/9px 4px 10px 5px;padding:8px 14px 6px;cursor:pointer;transition:transform .15s ease,border-color .15s ease}.reply-btn:nth-child(2){transform:rotate(.5deg)}.reply-btn:hover{border-color:var(--ink)}.reply-btn canvas{max-width:100%;height:auto;display:block}.replies.nudge .reply-btn{animation:reply-nudge .55s ease;border-color:var(--ink)}@keyframes reply-nudge{0%,to{transform:translateY(0)}30%{transform:translateY(-6px)}60%{transform:translateY(2px)}}.name-card{transform:rotate(-.6deg);align-items:stretch}.name-preview{min-height:34px;display:flex;justify-content:center;align-items:flex-end;padding:6px 0 0}.name-input{display:block;width:100%;box-sizing:border-box;background:transparent;border:0;border-bottom:1.6px solid rgba(35,38,51,.5);outline:none;font:22px/1.3 Iowan Old Style,Palatino,Georgia,serif;text-align:center;letter-spacing:.06em;color:transparent;caret-color:#23262f;padding:2px 6px 4px}.name-input::placeholder{color:transparent}.name-input:focus{border-bottom-color:#23262f}.name-btn{align-self:flex-end;margin-top:4px}.name-clear{align-self:flex-end;margin-top:4px;margin-bottom:-26px;margin-right:92px;opacity:.7}.map-veil{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#3c382e38;opacity:0;pointer-events:none;z-index:56;transition:opacity .4s ease}.map-veil.show{opacity:1;pointer-events:auto}.map-slot{transform:rotate(.4deg);box-shadow:4px 6px #23263324;border:1.4px solid rgba(35,38,51,.3);border-radius:3px 12px 4px 10px/9px 4px 10px 5px;overflow:hidden;line-height:0}.map-canvas{width:min(92vw,78vh * 1.2368,940px);height:auto;display:block}.speech-root{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:33}.bubble{position:absolute;transform:translate(-50%,-100%);opacity:0;transition:opacity .22s ease;pointer-events:none;white-space:nowrap}.bubble.show{opacity:1}.bubble canvas{display:block}.shout{position:absolute;left:50%;top:22%;transform:translate(-50%);opacity:0;pointer-events:none;z-index:34;transition:opacity .25s ease;padding:4px 18px;border-radius:40% 46% 44% 42%/50% 48% 52% 46%;background:#f7f4ebb8;box-shadow:0 0 18px 14px #f7f4ebb8}.shout.show{opacity:1}.toasts{position:absolute;left:50%;bottom:max(64px,calc(env(safe-area-inset-bottom) + 58px));transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;z-index:36}.toasts.held{visibility:hidden}.toast{display:flex;align-items:center;gap:6px;opacity:0;transform:translateY(6px);transition:opacity .18s ease,transform .25s ease;padding:2px 12px;border-radius:40% 46% 44% 42%/50% 48% 52% 46%;background:#f7f4eb80;box-shadow:0 0 12px 8px #f7f4eb80}.toast.show{opacity:1;transform:translateY(0)}.toast canvas{display:block;mix-blend-mode:multiply}.objective{position:absolute;left:max(14px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));opacity:0;pointer-events:none;cursor:pointer;z-index:40;padding:3px 10px 2px 8px;border-left:2px solid rgba(35,38,51,.45);background:#f7f4eb8c;transition:opacity .5s ease,transform .3s ease}.objective.show{opacity:1;pointer-events:auto}.objective.flash{animation:objective-flash 1.4s ease}@keyframes objective-flash{0%{transform:scale(1);background:#f7f4eb8c}20%{transform:scale(1.08) rotate(-.8deg);background:#f7f0d2f2}to{transform:scale(1);background:#f7f4eb8c}}.nb-veil{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#3c382e33;opacity:0;visibility:hidden;pointer-events:none;z-index:57;transition:opacity .3s ease,visibility .3s}.nb-veil.show{opacity:1;visibility:visible;pointer-events:auto}.nb-page{width:min(520px,92vw);height:min(640px,86vh);background-color:#f6f3ea;background-size:100% 100%;border:1.4px solid rgba(35,38,51,.3);border-radius:4px 14px 5px 12px/12px 5px 14px 6px;box-shadow:3px 4px #2326331f;transform:rotate(-.4deg);padding:14px 18px 14px 20px;display:flex;flex-direction:column;gap:8px}.nb-head{display:flex;align-items:center;justify-content:space-between;padding-left:8%}.nb-close{background:none;border:1.4px solid rgba(35,38,51,.4);border-radius:3px 10px 4px 9px/8px 4px 9px 5px;padding:5px 10px 3px;cursor:pointer;opacity:.8}.nb-tabs{display:flex;flex-wrap:wrap;gap:2px 10px;padding-left:8%}.nb-tab{background:none;border:none;padding:2px 4px 0;cursor:pointer;opacity:.6;display:flex;flex-direction:column;align-items:center}.nb-tab.active{opacity:1}.nb-rule{display:block;margin-top:-2px}.nb-body{flex:1;overflow-y:auto;padding-left:9%;padding-right:4px;display:flex;flex-direction:column;gap:5px}.nb-line canvas{max-width:100%;height:auto}.nb-body>.nb-l-head{margin-top:6px}.nb-heard{display:flex;flex-direction:column;gap:0;padding-bottom:4px}.nb-job{display:flex;flex-direction:column;gap:3px;padding-bottom:8px}.nb-jobhead{position:relative;display:flex;align-items:center;gap:6px}.nb-strike{position:absolute;left:0;top:0;pointer-events:none;mix-blend-mode:multiply}.nb-job.complete{opacity:.6}.nb-step{display:flex;align-items:center;gap:8px;padding-left:6px}.nb-step.done{opacity:.55}.nb-box{width:15px;height:15px;flex:none;border:1.4px solid rgba(35,38,51,.5);border-radius:3px 5px/4px 3px 5px;display:flex;align-items:center;justify-content:center}.nb-box canvas{mix-blend-mode:multiply}@media (max-aspect-ratio: 4 / 5){.title-veil{padding-top:max(7vh,34px)}.title-btn{position:absolute;left:50%;bottom:max(8.5vh,62px);transform:translate(-50%);padding:13px 34px 11px;background:#f5f2eadb}.title-btn:hover{transform:translate(-50%) rotate(-.6deg) scale(1.03)}.title-btn+.title-btn{bottom:max(3.4vh,22px)}.toasts{left:max(12px,env(safe-area-inset-left));top:max(118px,calc(env(safe-area-inset-top) + 110px));bottom:auto;transform:none;align-items:flex-start}.objective{top:max(60px,calc(env(safe-area-inset-top) + 52px));max-width:88vw}.hud-btn.wait-btn{position:fixed;right:max(12px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom))}.nb-page{height:min(640px,82vh);padding:12px 12px 12px 14px}}.talk{position:absolute;left:50%;bottom:max(30px,calc(env(safe-area-inset-bottom) + 24px));transform:translate(-50%) rotate(-.3deg);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:36;cursor:pointer;touch-action:none}.talk.show{opacity:1;pointer-events:auto}.talk.answering{cursor:default}.talk canvas{display:block;max-width:calc(100vw - 20px);height:auto}.bubble.beckon.show{animation:beckon-bob 1.1s ease-in-out infinite}@keyframes beckon-bob{0%,to{margin-top:0}50%{margin-top:-5px}}
