*{box-sizing:border-box;margin:0;padding:0}body{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;overflow:hidden;padding:16px;touch-action:none;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}#game-container{position:relative;overflow:hidden;max-width:95vw;max-height:calc(100vh - 80px);aspect-ratio:4 / 3;display:flex}canvas#game-canvas{display:block;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:none}@media(pointer:coarse),(max-width:1024px),(max-height:650px),(hover:none){body{padding:0;margin:0;width:100vw;height:100dvh;min-height:100dvh;justify-content:flex-start;align-items:center}#game-container{width:100vw;height:100dvh;max-width:100vw;max-height:100dvh;aspect-ratio:auto}@media(orientation:portrait){#game-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:140px}canvas#game-canvas{width:100vw;height:75vw;max-height:55vh;object-fit:contain}}@media(orientation:landscape){#game-container{display:flex;align-items:center;justify-content:center}canvas#game-canvas{height:100dvh;width:calc(100dvh * 4 / 3);max-width:100vw;object-fit:contain}}}.hud-link{position:absolute;top:max(16px,env(safe-area-inset-top));left:max(16px,env(safe-area-inset-left));z-index:50}.hud-mode{position:absolute;top:max(16px,env(safe-area-inset-top));right:max(16px,env(safe-area-inset-right));z-index:50}#status-msg{position:absolute;bottom:24px;left:50%;transform:translate(-50%);z-index:50;pointer-events:none}#touch-controls{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:40;display:flex;justify-content:space-between;align-items:flex-end;padding:28px;padding-left:max(32px,calc(env(safe-area-inset-left) + 20px));padding-right:max(32px,calc(env(safe-area-inset-right) + 20px));padding-bottom:max(36px,calc(env(safe-area-inset-bottom) + 24px))}#touch-controls.touch-hidden{display:none!important}@media(orientation:portrait)and ((pointer:coarse)or (max-width:1024px)){#touch-controls{padding-bottom:max(52px,calc(env(safe-area-inset-bottom) + 38px));padding-left:max(32px,calc(env(safe-area-inset-left) + 20px));padding-right:max(32px,calc(env(safe-area-inset-right) + 20px))}}#joystick-zone{pointer-events:auto;position:relative;width:140px;height:140px;display:flex;align-items:center;justify-content:center;touch-action:none}#joystick-base{width:110px;height:110px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center}#joystick-thumb{width:52px;height:52px;border-radius:50%;position:absolute;pointer-events:none;will-change:transform}#action-cluster{pointer-events:auto;display:flex;flex-direction:column;gap:12px;align-items:flex-end}.action-row{display:flex;gap:12px;align-items:center}.auxiliary-actions{margin-bottom:2px}.touch-btn{border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;touch-action:manipulation}.touch-btn.lg-btn{width:64px;height:64px}.touch-btn.sm-btn{width:44px;height:44px}#controls-guide{position:fixed;bottom:12px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:16px;pointer-events:auto}@media(pointer:coarse),(max-width:1024px),(hover:none){#controls-guide{display:none}}.inventory-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:100;pointer-events:auto;padding:16px}.inventory-backdrop.hidden{display:none!important}.inventory-card{width:min(440px,94vw);max-height:85vh;display:flex;flex-direction:column;overflow:hidden}.inventory-header{height:52px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.inventory-title{display:flex;align-items:center;gap:10px}.inventory-body{padding:18px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}.inventory-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;justify-items:center}.inventory-slot{width:100%;aspect-ratio:1 / 1;max-width:72px;min-height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative}.inventory-slot img{width:75%;height:75%;object-fit:contain;image-rendering:pixelated;image-rendering:crisp-edges;pointer-events:none}.inventory-empty.hidden{display:none!important}.inventory-detail{padding:12px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px}.inventory-detail.hidden{display:none!important}.detail-info{display:flex;flex-direction:column;gap:3px;overflow:hidden}.btn-drop{display:flex;align-items:center;gap:6px;cursor:pointer;flex-shrink:0}:root{--theme-bg-deep: #15191e;--theme-bg-surface: #171b20;--theme-bg-header: #1c222b;--theme-bg-slot: #1c222b;--theme-bg-slot-hover: #232b36;--theme-bg-slot-selected: #202b25;--theme-border-subtle: rgba(141, 164, 184, .22);--theme-border-card: rgba(141, 164, 184, .28);--theme-border-focus: #526c5d;--theme-border-selected: #638572;--theme-text-primary: #e4ebe6;--theme-text-muted: #8da4b8;--theme-text-faint: #7b8893;--theme-accent-sage: #526c5d;--theme-accent-sage-dark: #3e5246;--theme-accent-crimson-bg: rgba(90, 40, 40, .35);--theme-accent-crimson-border: rgba(220, 100, 100, .4);--theme-accent-crimson-text: #fca5a5;--theme-shadow-card: 0 24px 60px rgba(0, 0, 0, .65);--theme-shadow-pill: 0 4px 16px rgba(0, 0, 0, .4)}body{background:var(--theme-bg-deep);color:var(--theme-text-primary);font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,Roboto,sans-serif}#game-container{box-shadow:0 16px 40px #0006;border:1px solid #28303a;border-radius:12px;background:#000}@media(pointer:coarse),(max-width:1024px),(max-height:650px),(hover:none){#game-container{border-radius:0;border:none;box-shadow:none}}a.back-link{color:var(--theme-text-muted);text-decoration:none;font-size:.85rem;background:#1c222bd9;padding:8px 14px;border-radius:8px;border:1px solid var(--theme-border-subtle);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all .15s ease;box-shadow:var(--theme-shadow-pill)}a.back-link:hover,a.back-link:active{background:#252d37f2;color:#fff;border-color:#8da4b866}.mode-toggle-btn{background:#1c222bd9;color:var(--theme-text-muted);border:1px solid var(--theme-border-subtle);border-radius:8px;padding:8px 14px;font-size:.85rem;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all .15s ease;box-shadow:var(--theme-shadow-pill)}.mode-toggle-btn:hover,.mode-toggle-btn:active{background:#252d37f2;color:#fff;border-color:#8da4b866}#status-msg{background:#171b20d9;padding:6px 14px;border-radius:8px;border:1px solid var(--theme-border-subtle);font-size:.82rem;color:var(--theme-text-muted);letter-spacing:.02em;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);transition:opacity .5s ease}#joystick-base{background:radial-gradient(circle at center,#171b2099,#12161ad1 70%,#0e1115eb);border:1.5px solid rgba(141,164,184,.3);box-shadow:0 8px 24px #00000073,inset 0 2px 6px #ffffff0a;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:border-color .2s ease,box-shadow .2s ease}#joystick-zone.active #joystick-base{border-color:#8da4b88c;box-shadow:0 8px 28px #0009,0 0 12px #526c5d59}#joystick-thumb{background:radial-gradient(circle at 35% 35%,#4a6154,#36473d 60%,#25312a);border:1.5px solid rgba(162,196,178,.4);box-shadow:0 4px 12px #00000080,inset 0 2px 4px #ffffff26;transition:border-color .15s ease}#joystick-zone.active #joystick-thumb{border-color:#b4dcc8b3;box-shadow:0 4px 14px #0009,0 0 10px #63857266}.touch-btn{background:#1c222bd1;border:1.5px solid var(--theme-border-subtle);color:#cdd7df;box-shadow:0 8px 20px #0006,inset 0 1px 3px #ffffff0f;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:all .12s cubic-bezier(.2,0,0,1)}.touch-btn:hover{background:#252d37e6;color:#fff;border-color:#8da4b866}.touch-btn:active,.touch-btn.pressed{transform:scale(.92);background:#2d3744f2;border-color:#8da4b899;box-shadow:0 2px 8px #0009}.touch-btn.primary-btn{background:#2e3d34e0;border-color:#63857299;color:#e4ebe6}.touch-btn.primary-btn:hover{background:#384a3ff2;border-color:#638572}.touch-btn.primary-btn:active,.touch-btn.primary-btn.pressed{background:#41574a;border-color:#7ba68e;box-shadow:0 0 16px #63857280}.touch-btn.active{background:#2e3d34eb;border-color:#638572;box-shadow:0 0 14px #63857273}.touch-btn.primary-btn.has-nearby{border-color:#8bbfa3;box-shadow:0 0 16px #6ea0828c}#controls-guide{color:var(--theme-text-muted);font-size:.82rem;letter-spacing:.03em}#controls-guide .hints{background:#1c222bb3;padding:7px 14px;border-radius:8px;border:1px solid var(--theme-border-subtle);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.8rem;color:var(--theme-text-muted)}#controls-guide a{color:var(--theme-text-muted);text-decoration:none;transition:color .15s ease}#controls-guide a:hover{color:#fff}.inventory-backdrop{background:#000000a6;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:1;transition:opacity .18s ease}.inventory-backdrop.hidden{opacity:0}.inventory-card{background:var(--theme-bg-surface);border:1px solid var(--theme-border-card);border-radius:16px;box-shadow:var(--theme-shadow-card)}.inventory-header{background:var(--theme-bg-header);border-bottom:1px solid rgba(141,164,184,.18)}.inventory-title{font-size:.95rem;font-weight:500;color:var(--theme-text-primary);letter-spacing:.03em}.inventory-badge{font-size:.75rem;background:#252d37;color:var(--theme-text-muted);padding:2px 8px;border-radius:10px;border:1px solid var(--theme-border-subtle)}.modal-close-btn{background:transparent;border:none;color:var(--theme-text-muted);font-size:1.6rem;line-height:1;cursor:pointer;padding:4px 8px;border-radius:8px;transition:all .15s ease}.modal-close-btn:hover,.modal-close-btn:active{color:#fff;background:#8da4b826}.inventory-slot{background:var(--theme-bg-slot);border:1px solid var(--theme-border-subtle);border-radius:10px;transition:all .15s ease}.inventory-slot:hover{border-color:#8da4b873;background:var(--theme-bg-slot-hover)}.inventory-slot.selected{border-color:var(--theme-border-selected);background:var(--theme-bg-slot-selected);box-shadow:0 0 12px #63857266}.inventory-empty{text-align:center;color:var(--theme-text-faint);font-size:.9rem;padding:24px 0}.inventory-detail{background:var(--theme-bg-header);border:1px solid var(--theme-border-subtle);border-radius:12px}.detail-name{font-size:.92rem;font-weight:500;color:var(--theme-text-primary)}.detail-desc{font-size:.78rem;color:var(--theme-text-muted)}.btn-drop{background:var(--theme-accent-crimson-bg);border:1px solid var(--theme-accent-crimson-border);color:var(--theme-accent-crimson-text);border-radius:8px;padding:8px 14px;font-size:.85rem;font-weight:500;transition:all .15s ease}.btn-drop:hover,.btn-drop:active{background:#8c2d2d8c;border-color:#f07878b3;color:#fff;transform:scale(.98)}