@media(max-width:900px){:root{--bottom-ui: max(10px, env(safe-area-inset-bottom, 0px));--bottom-ui-h: 58px;--map-tools-stack: 50px;--mobile-ui-stack: calc(var(--bottom-ui) + var(--bottom-ui-h) + var(--map-tools-stack));--mobile-stats-stack: 96px;--safe-top: max(10px, env(safe-area-inset-top, 0px));--safe-left: max(10px, env(safe-area-inset-left, 0px));--safe-right: max(10px, env(safe-area-inset-right, 0px))}button,.tool,.hp-btn{-webkit-tap-highlight-color:transparent}#game-canvas,#hub-canvas,#spectate-canvas{touch-action:none}.hud{display:block;padding:0}.hud-dock{position:absolute}.hud-dock.hud-dock-left{top:var(--safe-top);left:var(--safe-left);right:auto;bottom:auto;padding:4px 6px;gap:4px;max-width:min(280px,calc(100vw - var(--safe-left) - var(--safe-right) - 120px))}.hud-logo-btn{align-self:center}.hud-logo{height:32px}.hud-dock.hud-dock-right{top:var(--safe-top);right:var(--safe-right);left:auto;bottom:auto;padding:4px 6px;gap:4px}.hud-dock.hud-dock-center{top:auto;bottom:calc(var(--mobile-ui-stack) + var(--mobile-stats-stack) + 6px);left:var(--safe-left);right:var(--safe-right);width:auto;height:auto;transform:none;max-width:none;padding:5px 6px;gap:4px;flex-wrap:wrap;justify-content:center;row-gap:4px;overflow-x:visible;overflow-y:visible;-webkit-overflow-scrolling:touch;grid-column:auto;grid-row:auto}.hud-dock-center.stats-tutorial{padding-top:5px}.hud-dock-center .stat b{font-size:12px}.hud-dock-center .stat{flex-shrink:0}.icon-btn,.hub-btn{min-width:44px;min-height:44px}.hub-btn{gap:0;min-width:44px;padding-left:8px;padding-right:8px;font-size:0;letter-spacing:0}.hub-btn .hub-avatar{margin:0}.speed-btn{width:36px;height:36px}.play-mode-badge{font-size:8px;padding:3px 7px}.word,.clock [data-date]{display:none}.toolbar-zone{bottom:var(--bottom-ui);padding:0 var(--safe-left) 0 var(--safe-right)}.toolbar-stack{max-width:100%;width:100%}.toolbar-build{max-width:100%;padding:5px 6px}#app:has(.vita:not(.hidden)) .toolbar-stack{max-width:100%}.map-tool{width:44px!important;height:44px!important}.map-zoom-btn{font-size:18px;font-weight:700;line-height:1;color:var(--accent)}.toolbar-build .tool{min-width:52px;min-height:52px;padding:6px 4px!important}.toolbar-build .tool label{font-size:8px}.vita{right:var(--safe-right);bottom:calc(var(--bottom-ui) + var(--bottom-ui-h) + var(--map-tools-stack) + 8px);height:auto}.vita-orb{width:52px!important;height:52px!important}.vita-bubble{width:min(300px,calc(100vw - var(--safe-left) - var(--safe-right) - 16px));right:0;bottom:calc(100% + 8px)}.quest-panel{top:calc(var(--safe-top) + 56px);left:var(--safe-left);right:var(--safe-right);width:auto;max-height:min(38vh,280px);overflow-y:auto;-webkit-overflow-scrolling:touch}.quest-reopen{top:calc(var(--safe-top) + 56px);left:var(--safe-left)}.quest-close{width:36px;height:36px}.inspector{top:auto;bottom:calc(var(--mobile-ui-stack) + 58px);left:var(--safe-left);right:var(--safe-right);width:auto;max-height:34vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.panel{top:var(--safe-top);left:var(--safe-left);right:var(--safe-right);width:auto;max-height:calc(100vh - var(--safe-top) - var(--bottom-ui))}.toasts{bottom:calc(var(--mobile-ui-stack) + 54px);left:var(--safe-left);right:var(--safe-right);max-width:none;transform:none}.toast{font-size:13px;max-width:100%}.tool-tip{max-width:min(320px,calc(100vw - var(--safe-left) - var(--safe-right) - 16px));font-size:11px}.tutorial-callout{font-size:11px;max-width:min(240px,calc(100vw - 24px))}.hub-topbar{padding:max(10px,env(safe-area-inset-top,0px)) var(--safe-right) 10px var(--safe-left)}.hub-topbar-actions{display:flex;align-items:center;gap:8px}.hub-panel-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 14px;border:1px solid var(--paper-line);border-radius:10px;background:#38bdf81f;color:var(--accent);font-family:var(--font-ui);font-size:12px;font-weight:600;cursor:pointer}.hub-panel-backdrop{position:absolute;inset:0;z-index:2;background:#00000073}.hub-panel-backdrop.hidden{display:none!important}#hub-screen .hub-panel{inset:auto 0 0;width:100%;max-width:none;max-height:min(78vh,620px);padding:16px 16px max(20px,env(safe-area-inset-bottom,0px));border-left:none;border-top:1px solid var(--paper-line);border-radius:16px 16px 0 0;transform:translateY(100%);transition:transform .32s var(--ease);z-index:3;-webkit-overflow-scrolling:touch}#hub-screen.hub-panel-open .hub-panel{transform:translateY(0)}.hub-panel-close{position:sticky;top:0;float:right;width:36px;height:36px;margin:0 0 8px 8px;border:1px solid var(--paper-line);border-radius:10px;background:var(--paper-up);color:var(--ink-soft);font-size:14px;cursor:pointer;z-index:1}.trade-btn,.auction-btn,.auction-post-btn{min-height:44px;font-size:12px}.trade-row input,.auction-qty-input,.auction-form-row select,.auction-form-row input{min-height:44px;font-size:14px}.primary-btn.small{min-height:40px;padding:8px 12px}.spectate-badge{bottom:max(16px,env(safe-area-inset-bottom,0px))}}@media(min-width:901px){.hub-panel-toggle,.hub-panel-close,.hub-panel-backdrop,.map-zoom-btn{display:none!important}}@media(max-width:900px)and (max-height:500px){.quest-panel{max-height:28vh}.hud-dock.hud-dock-center{bottom:calc(var(--mobile-ui-stack) + 52px + 6px)}}@media(max-width:380px){.hud-dock.hud-dock-left .island-reset-btn{display:none}}.ob-overlay{z-index:55;justify-content:flex-start;padding:max(16px,env(safe-area-inset-top,0px)) clamp(16px,4vw,32px) max(24px,env(safe-area-inset-bottom,0px));background:radial-gradient(ellipse 80% 50% at 20% -10%,rgba(56,189,248,.14) 0%,transparent 55%),radial-gradient(ellipse 60% 40% at 90% 100%,rgba(167,139,250,.08) 0%,transparent 50%),linear-gradient(180deg,#0a1428,#03060c)}.ob-shell{width:min(1080px,100%);margin:0 auto}.ob-shell-narrow{max-width:720px}.ob-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:clamp(20px,4vh,36px)}.ob-logo{display:block;height:42px;width:auto;max-width:none;object-fit:contain;object-position:left center;transform:translateY(2px);filter:drop-shadow(0 2px 8px rgba(0,0,0,.45))}.ob-stepper{display:flex;align-items:center;gap:10px}.ob-step{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-faint);padding:6px 12px;border-radius:999px;border:1px solid transparent}.ob-step.active{color:var(--accent);border-color:#38bdf859;background:#38bdf814}.ob-step.done{color:var(--mint)}.ob-step-line{width:28px;height:1px;background:var(--paper-line)}.ob-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,4vw,40px);align-items:center}.ob-visual{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}.ob-visual-glow{position:absolute;left:50%;bottom:18%;transform:translate(-50%);width:72%;height:45%;background:radial-gradient(ellipse at center,rgba(56,189,248,.22) 0%,transparent 70%);filter:blur(20px);pointer-events:none}.ob-avatar-glow{bottom:28%;height:38%;background:radial-gradient(ellipse at center,rgba(56,189,248,.28) 0%,rgba(167,139,250,.1) 50%,transparent 75%)}#start-preview{position:relative;z-index:1;width:100%;max-width:560px;height:auto;image-rendering:pixelated;border-radius:16px;border:1px solid var(--paper-line);box-shadow:0 24px 60px #00000073}.ob-visual-caption{margin:0;font-size:12px;color:var(--ink-faint);text-align:center;max-width:36ch}.ob-card{padding:clamp(20px,3vw,28px);border-radius:18px;border:1px solid var(--paper-line);background:#0b1528e0;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 20px 50px #00000059}.ob-card-center{text-align:center}.ob-kicker{margin:0 0 6px;font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}.ob-title{margin:0 0 10px;font-family:var(--font-display);font-size:clamp(1.75rem,4vw,2.25rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:var(--ink)}.ob-lead{margin:0 0 20px;font-size:14px;line-height:1.55;color:var(--ink-soft)}.ob-demo-note{margin:-8px 0 16px;padding:8px 10px;font-size:12px;line-height:1.45;color:var(--gold);background:#f0be481a;border:1px solid rgba(240,190,72,.22);border-radius:8px}.ob-fields{display:flex;flex-direction:column;gap:14px;margin-bottom:20px}.ob-field{display:flex;flex-direction:column;gap:6px;text-align:left}.ob-field span{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}.ob-field input,.ob-field select{width:100%;padding:11px 14px;border:1px solid var(--paper-line);border-radius:10px;background:#060c18e6;color:var(--ink);font-family:var(--font-ui);font-size:14px;outline:none;transition:border-color .15s var(--ease)}.ob-field input:focus,.ob-field select:focus{border-color:var(--accent)}.ob-cta{width:100%}.ob-tips{margin-top:18px;text-align:left}.ob-tips summary{font-size:12px;font-weight:600;color:var(--ink-soft);cursor:pointer;list-style:none}.ob-tips summary::-webkit-details-marker{display:none}.ob-tips ul{margin:10px 0 0;padding-left:18px;font-size:12px;line-height:1.55;color:var(--ink-faint)}.ob-tips li{margin-bottom:4px}.ob-avatar-grid{display:flex;flex-direction:column;align-items:center;gap:clamp(16px,3vh,28px)}.ob-avatar-stage{position:relative;display:flex;align-items:center;justify-content:center;min-height:200px}#avatar-preview{position:relative;z-index:1;image-rendering:pixelated}.ob-swatches{display:flex;flex-direction:column;align-items:center;gap:8px;margin:16px 0 20px}.ob-sw-label{font-size:10px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}.ob-actions{display:flex;gap:10px;align-items:center}.ob-actions .ob-cta{flex:1}@media(max-width:820px){.ob-grid{grid-template-columns:1fr}.ob-visual{order:-1}#start-preview{max-width:100%}.ob-top{flex-direction:column;align-items:flex-start}}@media(max-height:680px){.ob-visual-caption{display:none}.ob-lead{font-size:13px;margin-bottom:14px}}