:root{--gb-grass:#4a8c3f;--gb-grass-dark:#3f7a35;--gb-path:#c4a45a;--gb-wall:#6b5a3e;--gb-water:#204060;--gb-ui:#f8f0d8;--gb-ui-dark:#e8dcbc;--gb-border:#4a3828;--gb-ink:#38281a;--gb-muted:#8a7355;--gb-accent:#c4783a;--gb-shadow:#3a2e2059;--font-pixel:"Press Start 2P", "Courier New", monospace;--font-ui:"Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{height:100%}body{color:var(--gb-ink);font-family:var(--font-ui);background:radial-gradient(at 50% 20%,#4a8c3f40,#0000 60%),#16311f;justify-content:center;width:100vw;height:100dvh;display:flex;overflow:hidden}#app{justify-content:center;align-items:center;width:100vw;height:100dvh;padding:0;display:flex}#game-container-wrapper{background:var(--gb-ui);border-left:3px solid var(--gb-border);border-right:3px solid var(--gb-border);flex-direction:column;width:100%;max-width:480px;height:100dvh;display:flex;position:relative;overflow:hidden;box-shadow:0 0 40px #00000073}@media (width>=520px){#game-container-wrapper{border:3px solid var(--gb-border);height:min(100dvh,900px);box-shadow:0 0 0 4px var(--gb-border), 0 18px 60px #00000080;border-radius:10px;margin:12px 0}}#top-bar{background:var(--gb-ui);border-bottom:3px solid var(--gb-border);height:36px;font-family:var(--font-pixel);flex-shrink:0;align-items:center;gap:8px;padding:6px 10px;display:flex}.player-status-dot{border:2px solid var(--gb-border);border-radius:2px;flex-shrink:0;width:12px;height:12px}.player-status-name{color:var(--gb-ink);letter-spacing:.02em;white-space:nowrap;font-size:10px}.player-status-zone{color:var(--gb-muted);letter-spacing:.02em;background:var(--gb-ui-dark);border:1px solid var(--gb-border);white-space:nowrap;text-overflow:ellipsis;border-radius:3px;max-width:150px;padding:3px 6px;font-size:8px;overflow:hidden}.topbar-spacer{flex:1}.topbar-nearby{color:var(--gb-ink);background:var(--gb-ui-dark);border:1px solid var(--gb-border);text-align:center;border-radius:3px;min-width:34px;padding:3px 6px;font-size:8px}.back-btn{font-family:var(--font-pixel);color:var(--gb-ink);border:2px solid var(--gb-border);background:var(--gb-ui);box-shadow:0 2px 0 var(--gb-border);white-space:nowrap;border-radius:3px;padding:5px 8px;font-size:8px;text-decoration:none;transition:transform .1s}.back-btn:hover{background:var(--gb-ui-dark)}.back-btn:active{box-shadow:none;transform:translateY(2px)}#phaser-canvas-parent{background:var(--gb-grass-dark);flex:1;justify-content:center;align-items:center;min-height:0;display:flex;position:relative;overflow:hidden}#phaser-canvas-parent canvas{image-rendering:pixelated;image-rendering:crisp-edges;display:block}#phaser-canvas-parent.pan-mode canvas{cursor:grab!important}#canvas-chrome{z-index:20;border:2px solid var(--gb-border);box-shadow:0 3px 0 var(--gb-border);-webkit-user-select:none;user-select:none;background:#f8f0d8eb;border-radius:4px;align-items:center;gap:3px;padding:4px;display:flex;position:absolute;top:8px;right:8px}.chrome-btn{font-family:var(--font-pixel);border:2px solid var(--gb-border);background:var(--gb-ui);min-width:28px;height:28px;color:var(--gb-ink);cursor:pointer;border-radius:3px;padding:0 6px;font-size:10px;font-weight:400;line-height:1;transition:background .12s,transform 80ms}.chrome-btn:hover{background:var(--gb-ui-dark)}.chrome-btn:active{transform:translateY(2px)}.chrome-btn.chrome-wide{min-width:auto;padding:0 7px;font-size:7px}.chrome-btn.chrome-icon{padding:0 7px;font-size:12px}.chrome-btn.active{background:var(--gb-accent);border-color:var(--gb-border);color:var(--gb-ui)}.zoom-level{font-family:var(--font-pixel);color:var(--gb-ink);text-align:center;min-width:34px;font-size:7px}.dialog-box{z-index:30;background:var(--gb-ui);border:3px solid var(--gb-border);min-height:96px;box-shadow:0 4px 0 var(--gb-border), inset 0 0 0 2px var(--gb-ui-dark);opacity:0;pointer-events:none;border-radius:4px;padding:10px 12px 12px;transition:opacity .2s,transform .2s;position:absolute;bottom:8px;left:8px;right:8px;transform:translateY(12px)}.dialog-box.show{opacity:1;transform:translateY(0)}.dialog-speaker-row{margin-bottom:6px}#dialog-speaker{font-family:var(--font-pixel);letter-spacing:.04em;font-size:9px}#dialog-text{font-family:var(--font-pixel);color:var(--gb-ink);word-break:break-word;font-size:9px;line-height:1.9}.dialog-arrow{color:var(--gb-ink);font-size:10px;animation:1s steps(2,end) infinite dialog-blink;position:absolute;bottom:8px;right:12px}@keyframes dialog-blink{0%,49%{opacity:1}50%,to{opacity:.15}}.bottom-drawer{background:var(--gb-ui);border-top:3px solid var(--gb-border);flex-direction:column;flex-shrink:0;height:48px;transition:height .28s;display:flex;overflow:hidden}.bottom-drawer.open{height:min(42vh,360px)}#drawer-tab{height:48px;font-family:var(--font-pixel);color:var(--gb-ink);background:var(--gb-ui-dark);border:none;border-bottom:2px solid var(--gb-border);cursor:pointer;flex-shrink:0;justify-content:center;align-items:center;gap:10px;font-size:9px;transition:background .12s;display:flex}#drawer-tab:hover{background:#f0e4c4}#drawer-tab:active{background:var(--gb-ui)}.drawer-tab-caret{font-size:8px;transition:transform .25s}.bottom-drawer.open .drawer-tab-caret{transform:rotate(180deg)}.drawer-tabs{border-bottom:2px solid var(--gb-border);flex-shrink:0;display:flex}.drawer-tab-btn{font-family:var(--font-pixel);color:var(--gb-ink);background:var(--gb-ui);border:none;border-right:2px solid var(--gb-border);cursor:pointer;flex:1;padding:10px 0;font-size:8px;transition:background .12s}.drawer-tab-btn:last-child{border-right:none}.drawer-tab-btn.active{background:var(--gb-ink);color:var(--gb-ui)}.drawer-body{flex:1;padding:12px;overflow:hidden auto}.drawer-panel{flex-direction:column;gap:10px;display:none}.drawer-panel.active{display:flex}.drawer-panel-title{font-family:var(--font-pixel);color:var(--gb-ink);border-left:3px solid var(--gb-accent);padding-left:8px;font-size:9px}.drawer-panel-desc{color:var(--gb-muted);font-size:.78rem;line-height:1.4}#bot-selector-grid{flex-direction:column;gap:8px;display:flex}.bot-btn{background:var(--gb-ui);border:2px solid var(--gb-border);cursor:pointer;text-align:left;box-shadow:0 2px 0 var(--gb-border);font-family:var(--font-ui);border-radius:4px;align-items:center;padding:10px 12px;transition:all .15s;display:flex;position:relative;overflow:hidden}.bot-btn:before{content:"";background-color:var(--bot-color);opacity:.7;width:5px;height:100%;position:absolute;top:0;left:0}.bot-indicator{border:2px solid var(--gb-border);background-color:var(--bot-color);flex-shrink:0;width:12px;height:12px;margin-right:12px}.bot-name{font-family:var(--font-pixel);color:var(--gb-ink);flex-grow:1;font-size:9px}.bot-role{font-family:var(--font-pixel);color:var(--gb-ink);background:var(--gb-ui-dark);border:1px solid var(--gb-border);border-radius:2px;padding:4px 8px;font-size:7px}.bot-btn.active{border-color:var(--bot-color);box-shadow:0 2px 0 var(--gb-border), 0 0 0 2px color-mix(in srgb, var(--bot-color) 35%, transparent)}.bot-btn:active{box-shadow:none;transform:translateY(2px)}.nearby-panel{background:var(--gb-ui);border:2px solid var(--gb-border);min-height:60px;box-shadow:inset 0 0 0 2px var(--gb-ui-dark);border-radius:4px;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:12px;font-size:.8rem;display:flex}.nearby-empty{color:var(--gb-muted);font-size:.78rem;line-height:1.5}.nearby-dot{border:2px solid var(--gb-border);flex-shrink:0;width:12px;height:12px}.nearby-name{font-family:var(--font-pixel);font-size:9px}.nearby-role{color:var(--gb-muted);background:var(--gb-ui-dark);border:1px solid var(--gb-border);border-radius:2px;padding:3px 8px;font-size:.72rem;font-weight:700}.nearby-hint{color:var(--gb-muted);flex-basis:100%;font-size:.74rem}.nearby-panel kbd,.nearby-empty kbd{background:var(--gb-ui-dark);border:1px solid var(--gb-border);font-size:.7rem;font-family:var(--font-pixel);color:var(--gb-ink);border-radius:2px;padding:1px 6px}.content-panel{background:var(--gb-ui);border:2px solid var(--gb-border);min-height:48px;box-shadow:inset 0 0 0 2px var(--gb-ui-dark);border-radius:4px;flex-direction:column;gap:8px;padding:10px;font-size:.8rem;display:flex}.content-teaser{cursor:pointer;background:#3a2e200a;border:1px solid #0000;border-radius:3px;align-items:center;gap:8px;padding:6px 8px;text-decoration:none;transition:background .15s,border-color .15s;display:flex}.content-teaser:hover{border-color:var(--gb-border);background:#c4783a1a}.content-teaser-type{font-family:var(--font-pixel);text-transform:uppercase;letter-spacing:.05em;color:var(--gb-accent);flex-shrink:0;min-width:44px;font-size:6px;font-weight:400}.content-teaser-title{color:var(--gb-ink);flex:1;min-width:0;font-size:.78rem;font-weight:700;line-height:1.3}.content-zone-link{text-align:right;font-family:var(--font-pixel);color:var(--gb-accent);margin-top:2px;font-size:7px;text-decoration:none;display:block}.content-zone-link:hover{text-decoration:underline}.story-feed{flex-direction:column;gap:8px;display:flex}#bot-console{background:var(--gb-ui);border:2px solid var(--gb-border);font-family:var(--font-ui);max-height:150px;box-shadow:inset 0 0 0 2px var(--gb-ui-dark);border-radius:4px;flex-direction:column;gap:6px;padding:10px;font-size:.74rem;line-height:1.5;display:flex;overflow-y:auto}.console-line{word-break:break-word}.console-line.system{color:var(--gb-muted)}.console-line.action{color:var(--gb-accent)}.console-name{margin-right:4px;font-weight:700}.console-line.bot-msg{color:var(--gb-ink);border-left:2px solid var(--gb-border);padding-left:8px}.consult-form{flex-direction:column;gap:8px;display:flex}.consult-input{font-family:var(--font-ui);border:2px solid var(--gb-border);background:var(--gb-ui);color:var(--gb-ink);border-radius:4px;outline:none;padding:10px 12px;font-size:.82rem;transition:border-color .15s}.consult-input:focus{border-color:var(--gb-accent)}.consult-textarea{resize:vertical;min-height:52px}.consult-submit{font-family:var(--font-pixel);border:2px solid var(--gb-border);background:var(--gb-accent);color:var(--gb-ui);cursor:pointer;box-shadow:0 3px 0 var(--gb-border);border-radius:4px;padding:12px 16px;font-size:9px;transition:transform .1s,background .15s}.consult-submit:hover{background:#b06830}.consult-submit:active{box-shadow:none;transform:translateY(3px)}.consult-submit:disabled{opacity:.5;cursor:not-allowed}.consult-status{border-radius:4px;margin:0;padding:8px 12px;font-size:.76rem;font-weight:600}.consult-status.success{color:#2d8a5a;background:#3dbf7a24;border:1px solid #3dbf7a66}.consult-status.error{color:#c0392b;background:#ff6b6b24;border:1px solid #ff6b6b66}#touch-controls{z-index:25;pointer-events:none;display:none;position:absolute;inset:0}@media (pointer:coarse){#touch-controls{display:block}}.dpad{pointer-events:none;width:150px;height:150px;position:absolute;bottom:126px;left:14px}.dpad-btn{border:2px solid var(--gb-border);width:50px;height:50px;color:var(--gb-ink);font-size:14px;font-family:var(--font-pixel);cursor:pointer;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;box-shadow:0 3px 0 var(--gb-border);background:#f8f0d8c7;border-radius:4px;justify-content:center;align-items:center;display:flex;position:absolute}.dpad-btn:active{box-shadow:none;background:#c4783ad9;transform:translateY(2px)}.dpad-up{top:0;left:50px}.dpad-down{top:100px;left:50px}.dpad-left{top:50px;left:0}.dpad-right{top:50px;left:100px}.ab-buttons{pointer-events:none;gap:10px;display:flex;position:absolute;bottom:132px;right:14px}.ab-btn{border:3px solid var(--gb-border);width:54px;height:54px;font-family:var(--font-pixel);cursor:pointer;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;box-shadow:0 4px 0 var(--gb-border);border-radius:50%;justify-content:center;align-items:center;font-size:13px;display:flex}.ab-btn:active{box-shadow:none;transform:translateY(4px)}.ab-a{color:var(--gb-ui);background:#d44040d9}.ab-b{color:var(--gb-ui);background:#4a9bc7d9}.welcome-overlay{z-index:100;-webkit-backdrop-filter:blur(4px);background:#16281adb;flex-direction:column;justify-content:center;align-items:center;transition:opacity .4s;display:flex;position:fixed;inset:0}.welcome-overlay.fade-out{opacity:0;pointer-events:none}.welcome-card{background:var(--gb-ui);border:4px solid var(--gb-border);text-align:center;width:calc(100% - 32px);max-width:400px;box-shadow:0 0 0 3px var(--gb-ui-dark), 0 16px 48px #0006;border-radius:6px;padding:32px 24px 24px}.welcome-title{font-family:var(--font-pixel);color:var(--gb-ink);margin:0 0 12px;font-size:22px;line-height:1.3}.welcome-sub{color:var(--gb-muted);margin:0 0 22px;font-size:.9rem;line-height:1.5}.welcome-actions{flex-direction:column;gap:10px;margin-bottom:22px;display:flex}.welcome-btn{font-family:var(--font-pixel);border:2px solid var(--gb-border);cursor:pointer;width:100%;box-shadow:0 3px 0 var(--gb-border);border-radius:4px;padding:14px 20px;font-size:10px;transition:all .15s}.welcome-btn:active{box-shadow:none;transform:translateY(3px)}.welcome-btn-primary{background:var(--gb-accent);color:var(--gb-ui)}.welcome-btn-primary:hover{background:#b06830}.welcome-btn-ghost{color:var(--gb-muted);background:0 0}.welcome-btn-ghost:hover{border-color:var(--gb-accent);color:var(--gb-accent)}.welcome-crew{border-top:2px solid var(--gb-border);padding-top:14px}.welcome-crew-label{font-family:var(--font-pixel);text-transform:uppercase;letter-spacing:.1em;color:var(--gb-muted);margin-bottom:10px;font-size:7px;display:block}.welcome-crew-list{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;font-size:.8rem;font-weight:700;display:flex}.welcome-dot{color:var(--gb-border);font-size:.6rem}.welcome-hint{color:#f8f0d8a6;text-align:center;margin-top:16px;font-size:.72rem}.welcome-hint kbd{font-family:var(--font-pixel);color:#f8f0d8cc;background:#f8f0d81f;border:1px solid #f8f0d840;border-radius:3px;padding:1px 6px;font-size:7px}.greeter-choices{z-index:90;flex-wrap:wrap;justify-content:center;gap:10px;width:calc(100% - 32px);max-width:400px;transition:opacity .3s;display:flex;position:fixed;bottom:130px;left:50%;transform:translate(-50%)}.greeter-choices.hidden{opacity:0;pointer-events:none}.greeter-choice-btn{font-family:var(--font-pixel);border:2px solid var(--gb-border);background:var(--gb-ui);color:var(--gb-ink);cursor:pointer;white-space:normal;box-shadow:0 3px 0 var(--gb-border);border-radius:4px;flex:1;min-width:200px;padding:12px 16px;font-size:9px;transition:all .15s}.greeter-choice-btn:active{box-shadow:none;transform:translateY(3px)}.greeter-choice-btn:hover{border-color:var(--gb-accent);color:var(--gb-accent)}.greeter-choice-secondary{color:var(--gb-muted);background:0 0}.hidden{display:none!important}.drawer-body::-webkit-scrollbar{width:8px}#bot-console::-webkit-scrollbar{width:8px}.drawer-body::-webkit-scrollbar-track{background:0 0}#bot-console::-webkit-scrollbar-track{background:0 0}.drawer-body::-webkit-scrollbar-thumb{background:var(--gb-border);border-radius:4px}#bot-console::-webkit-scrollbar-thumb{background:var(--gb-border);border-radius:4px}