:root{--bg: #160f22;--bg-2: #1f1733;--panel: #2a1e3d;--panel-2: #38294f;--ink: #f4ecff;--ink-dim: #b9a9d6;--line: #0c0814;--gold: #f0d722;--cyan: #73bed3;--pink: #c65197;--green: #75a743;--red: #cf573c;--you: #4f8fba;--you-deep: #253a5e;--you-ink: #e7eef5;--you-dim: #a4c4dd;--them: #402751;--them-dim: #c3a7d6;--player: var(--you);--npc: var(--them);--shadow: 4px 4px 0 0 var(--line);--shadow-sm: 3px 3px 0 0 var(--line);--shadow-xs: 2px 2px 0 0 var(--line);--font-pixel: "Press Start 2P", monospace;--font-body: "VT323", monospace}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:20px;line-height:1.25;-webkit-font-smoothing:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}img{image-rendering:pixelated}button{font-family:var(--font-pixel);cursor:pointer}.app-stage{max-width:480px;margin:0 auto;min-height:100%;position:relative;background:var(--bg);box-shadow:0 0 0 100vmax #00000059}.panel{background:var(--panel);border:4px solid var(--line);box-shadow:var(--shadow)}.pixel{font-family:var(--font-pixel);line-height:1.4;letter-spacing:0}.map-screen{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center}.map-topbar{position:relative;z-index:5;width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;background:var(--bg);border-bottom:4px solid var(--line)}.map-title{font-family:var(--font-pixel);font-size:13px;color:var(--gold);text-shadow:2px 2px 0 var(--line)}.map-subtitle{font-family:var(--font-pixel);font-size:8px;color:var(--ink-dim)}.map-loader{font-family:var(--font-pixel);font-size:12px;color:var(--gold);letter-spacing:1px;animation:blink 1s steps(2,start) infinite}.map-canvas{position:relative;display:inline-block;line-height:0;max-width:100%}.map-img{display:block;width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 96px);-webkit-user-select:none;user-select:none;-webkit-user-drag:none}.pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px;background:none;border:none;padding:0;animation:bob 2.4s ease-in-out infinite}.pin:nth-child(2n){animation-delay:-.8s}.pin:nth-child(3n){animation-delay:-1.5s}@keyframes bob{0%,to{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 4px))}}.pin-top{display:flex;align-items:center;gap:4px}.pin-count{font-family:var(--font-pixel);font-size:11px;color:var(--gold);text-shadow:2px 2px 0 var(--line)}.pin-dots{display:flex;gap:4px}.pin .pixel-sprite,.pin .img-star{filter:drop-shadow(1px 1px 0 var(--line))}.img-star{display:inline-block;image-rendering:pixelated;vertical-align:middle}.img-star-off{filter:grayscale(1) brightness(.45);opacity:.7}.pin-label{font-family:var(--font-pixel);font-size:10px;color:var(--ink);background:var(--gold);color:var(--line);border:3px solid var(--line);box-shadow:var(--shadow-xs);padding:5px 7px;white-space:nowrap;text-transform:lowercase}.pin:active .pin-label{transform:translate(2px,2px);box-shadow:none}.pixel-sprite{position:relative;display:inline-block;line-height:0;vertical-align:middle}.pixel-seed{position:absolute;top:0;left:0;background:transparent}.star-total{display:inline-flex;align-items:center;gap:6px}.star-total-count{font-family:var(--font-pixel);font-size:12px;color:var(--gold);text-shadow:2px 2px 0 var(--line)}.loc-screen{position:relative;display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;background-color:var(--bg-2)}.loc-bg{position:fixed;top:0;bottom:0;left:50%;transform:translate(-50%);width:100%;max-width:480px;z-index:0;background-position:center;background-repeat:no-repeat;background-size:cover;pointer-events:none}.loc-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#160f228c,#160f22c7)}.loc-topbar{position:relative;z-index:3;flex:0 0 auto;display:flex;align-items:center;gap:12px;padding:12px 14px}.btn-back{font-size:9px;color:var(--ink);background:var(--panel);border:3px solid var(--line);box-shadow:var(--shadow-xs);padding:8px 10px}.btn-back:active{transform:translate(2px,2px);box-shadow:none}.loc-hero-title{font-family:var(--font-pixel);font-size:16px;color:var(--gold);text-shadow:2px 2px 0 var(--line);text-transform:lowercase}.loc-chat{position:relative;z-index:1;flex:1 1 auto;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:12px}.loc-dock{position:relative;z-index:2;flex:0 0 auto;padding:12px 14px;display:flex;flex-direction:column;gap:10px;background:var(--bg);border-top:4px solid var(--line)}.bubble-row.center{justify-content:center}.bubble.scene{max-width:90%;background:var(--ink);color:var(--line);border:3px solid var(--line);box-shadow:var(--shadow-xs);text-align:center;font-size:17px}.convo{display:flex;flex-direction:column;gap:4px}.bubble-row{display:flex}.bubble-row.other{justify-content:flex-start}.bubble-row.user{justify-content:flex-end}.bubble-stack{display:inline-flex;flex-direction:column;gap:8px;max-width:82%}.bubble-row.other .bubble-stack{align-items:flex-end}.bubble-row.user .bubble-stack{align-items:flex-start}.bubble{position:relative;max-width:82%;border:3px solid var(--line);box-shadow:var(--shadow-xs);padding:8px 10px;font-size:19px;line-height:1.2}.bubble.other,.bubble.user{margin-bottom:4px}.bubble.other:after,.bubble.user:after{content:"";position:absolute;top:100%;width:3px;height:3px;background:var(--line)}.bubble.other:after{left:9px;box-shadow:3px 0 var(--them),6px 0 var(--them),9px 0 var(--them),12px 0 var(--them),15px 0 var(--them),18px 0 var(--line),0 3px var(--line),3px 3px var(--them),6px 3px var(--them),9px 3px var(--them),12px 3px var(--them),15px 3px var(--line),0 6px var(--line),3px 6px var(--them),6px 6px var(--them),9px 6px var(--them),12px 6px var(--line),0 9px var(--line),3px 9px var(--them),6px 9px var(--them),9px 9px var(--line),0 12px var(--line),3px 12px var(--them),6px 12px var(--line),0 15px var(--line),3px 15px var(--line)}.bubble.user:after{right:27px;box-shadow:3px 0 var(--you),6px 0 var(--you),9px 0 var(--you),12px 0 var(--you),15px 0 var(--you),18px 0 var(--line),3px 3px var(--line),6px 3px var(--you),9px 3px var(--you),12px 3px var(--you),15px 3px var(--you),18px 3px var(--line),6px 6px var(--line),9px 6px var(--you),12px 6px var(--you),15px 6px var(--you),18px 6px var(--line),9px 9px var(--line),12px 9px var(--you),15px 9px var(--you),18px 9px var(--line),12px 12px var(--line),15px 12px var(--you),18px 12px var(--line),15px 15px var(--line),18px 15px var(--line)}.bubble-stack .bubble{max-width:100%}.bubble.other{background:var(--them);color:var(--ink)}.bubble.user{background:var(--you);color:var(--you-ink)}.bubble .tl{display:block;margin-top:4px;font-size:15px;color:var(--them-dim)}.bubble.user .tl{color:var(--you-dim)}.bubble.user.submitted{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold),var(--shadow-xs);font-weight:700}.bubble.user.submitted:after{background:var(--gold);box-shadow:3px 0 var(--you),6px 0 var(--you),9px 0 var(--you),12px 0 var(--you),15px 0 var(--you),18px 0 var(--gold),3px 3px var(--gold),6px 3px var(--you),9px 3px var(--you),12px 3px var(--you),15px 3px var(--you),18px 3px var(--gold),6px 6px var(--gold),9px 6px var(--you),12px 6px var(--you),15px 6px var(--you),18px 6px var(--gold),9px 9px var(--gold),12px 9px var(--you),15px 9px var(--you),18px 9px var(--gold),12px 12px var(--gold),15px 12px var(--you),18px 12px var(--gold),15px 15px var(--gold),18px 15px var(--gold)}.caret{display:inline-block;width:.5em;height:1em;margin-left:1px;background:currentColor;vertical-align:text-bottom;animation:caret-blink .7s steps(1) infinite}@keyframes caret-blink{50%{opacity:0}}.btn.next-msg{background:var(--gold);color:var(--line)}.btn.next-msg:active:not(:disabled){transform:translate(3px,3px);box-shadow:none}.btn.next-msg.bobbing{animation:next-bob 2.4s ease-in-out infinite}@keyframes next-bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.intent{background:var(--you-deep);border:4px solid var(--you);box-shadow:var(--shadow-sm);padding:12px;text-align:center}.intent .label{font-family:var(--font-pixel);font-size:8px;color:var(--cyan);text-transform:uppercase;letter-spacing:1px}.intent .text{margin-top:8px;font-size:24px;color:var(--you-ink)}.chat-input{display:flex;align-items:stretch;background:var(--bg-2);border:4px solid var(--line);box-shadow:var(--shadow-sm)}.builder{flex:1 1 auto;min-width:0;padding:10px 12px;min-height:60px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.builder.empty{color:var(--gold);font-size:18px;justify-content:flex-start;text-align:left}.send-btn{flex:0 0 auto;align-self:flex-end;width:48px;height:48px;margin:6px;display:flex;align-items:center;justify-content:center;border:3px solid var(--line);box-shadow:var(--shadow-xs);background:var(--you);color:var(--you-ink);font-family:var(--font-pixel);font-size:14px}.send-btn:active:not(:disabled){transform:translate(2px,2px);box-shadow:none;background:var(--you-deep)}.send-btn:disabled{opacity:.45;cursor:not-allowed}.px-arrow{position:relative;width:16px;height:28px}.px-arrow:before{content:"";position:absolute;top:0;left:0;width:4px;height:4px;background:currentColor;box-shadow:0 4px,4px 4px,0 8px,4px 8px,8px 8px,0 12px,4px 12px,8px 12px,12px 12px,0 16px,4px 16px,8px 16px,0 20px,4px 20px,0 24px}.chip{font-family:var(--font-body);font-size:20px;line-height:1;padding:8px 10px;border:3px solid var(--line);box-shadow:var(--shadow-xs);background:var(--gold);color:var(--line);-webkit-user-select:none;user-select:none}.chip:active{transform:translate(2px,2px);box-shadow:none}.chip.in-bank{background:#c79b45}.chip.used{opacity:.3;pointer-events:none;background:#5a4a73;color:var(--ink-dim);box-shadow:none}.chip.in-sentence{background:#fff}.chip .x{margin-left:6px;color:var(--red);font-weight:700}.bank{display:flex;flex-wrap:wrap;gap:8px}.actions{display:flex;gap:8px}.btn{font-family:var(--font-pixel);font-size:10px;padding:12px;border:4px solid var(--line);box-shadow:var(--shadow-sm);color:var(--line)}.btn:active:not(:disabled){transform:translate(3px,3px);box-shadow:none}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--green);flex:1}.btn-ghost{background:var(--panel);color:var(--ink)}.feedback{background:var(--panel);border:4px solid var(--line);box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;gap:12px}.goal-verdict{font-family:var(--font-pixel);font-size:9px;text-transform:uppercase;letter-spacing:1px;text-align:center;padding:8px;border:3px solid var(--line);box-shadow:var(--shadow-xs)}.goal-verdict.goal-win{background:#1f7a3d;color:#eaffea}.goal-verdict.goal-fail{background:#7a1f2b;color:#ffeaea}.feedback-head{display:flex;align-items:center;justify-content:space-between}.feedback-head .title{font-family:var(--font-pixel);font-size:12px;color:var(--gold)}.score-badge{font-family:var(--font-pixel);font-size:11px;padding:6px 8px;border:3px solid var(--line);box-shadow:var(--shadow-xs);color:var(--line)}.criteria{display:grid;grid-template-columns:1fr 1fr;gap:8px}.criterion{background:var(--bg-2);border:3px solid var(--line);padding:8px}.criterion .c-head{display:flex;justify-content:space-between;align-items:center;gap:6px}.criterion .c-name{font-family:var(--font-pixel);font-size:7px;color:var(--ink-dim);text-transform:uppercase}.criterion .c-val{font-family:var(--font-pixel);font-size:10px}.criterion .c-fb{margin-top:6px;font-size:16px;color:var(--ink-dim);line-height:1.15}.proposals{display:flex;flex-direction:column;gap:8px}.proposal{background:var(--bg-2);border:3px solid var(--green);box-shadow:2px 2px #1f5b1a;padding:8px 10px}.proposal .p-sent{font-size:21px;color:var(--ink)}.proposal .p-why{margin-top:4px;font-size:15px;color:var(--ink-dim)}.quest-panel{background:var(--panel);border:4px solid var(--line);box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;gap:10px;margin-top:8px}.quest-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:8px;border-bottom:3px solid var(--line)}.quest-title{font-family:var(--font-pixel);font-size:12px;color:var(--gold);text-shadow:2px 2px 0 var(--line)}.quest-step{display:flex;align-items:center;gap:10px;padding:10px;background:var(--bg-2);border:3px solid var(--line);box-shadow:var(--shadow-xs);color:var(--ink);text-align:left}.quest-step:active:not(:disabled){transform:translate(2px,2px);box-shadow:none}.quest-step.next{border-color:var(--gold)}.quest-step.locked{opacity:.45;cursor:not-allowed}.qs-num{flex:0 0 auto;font-family:var(--font-pixel);font-size:10px;color:var(--line);background:var(--gold);border:2px solid var(--line);padding:4px 6px}.quest-step.locked .qs-num{background:#5a4a73;color:var(--ink-dim)}.qs-title{flex:1 1 auto;font-size:20px}.qs-state{flex:0 0 auto;display:flex;align-items:center;gap:3px;font-family:var(--font-pixel);font-size:8px;color:var(--ink-dim)}.quest-step.next .qs-state{color:var(--gold)}.quest-done{font-family:var(--font-pixel);font-size:9px;color:var(--green);text-align:center;padding:8px}.loc-topbar-total{margin-left:auto;display:flex;align-items:center;gap:8px}.typing-dots{display:inline-flex;gap:5px;padding:4px 0}.typing-dots span{width:8px;height:8px;background:currentColor;animation:typing-blink 1s steps(1) infinite}.typing-dots span:nth-child(2){animation-delay:.15s}.typing-dots span:nth-child(3){animation-delay:.3s}@keyframes typing-blink{0%,to{opacity:.25}50%{opacity:1}}.step-result{background:var(--panel);border:4px solid var(--line);box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;gap:10px;align-items:center;text-align:center}.step-result-stars{display:flex;gap:4px}.step-result-msg{font-size:18px;color:var(--ink-dim)}.step-result .actions{width:100%}.step-result .btn-ghost{flex:1}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;min-height:60vh;text-align:center}.loading .blink{font-family:var(--font-pixel);font-size:11px;color:var(--gold);animation:blink 1s steps(2,start) infinite}@keyframes blink{to{visibility:hidden}}.error-box{background:var(--panel);border:4px solid var(--red);box-shadow:var(--shadow);padding:12px;font-size:18px;color:var(--red)}.score-good{background:var(--green)}.score-mid{background:var(--gold)}.score-bad{background:var(--red);color:#fff}
