:root{color-scheme:light;font-family:Trebuchet MS,Avenir Next,sans-serif;background:linear-gradient(180deg,#85c8ff,#b8e2ff 48%,#d8efe1);color:#f7f5ef}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{background:radial-gradient(circle at top,rgba(255,255,255,.4),transparent 35%),linear-gradient(180deg,#6cb7ff,#d9efe4)}#app{position:relative}canvas{display:block;width:100%;height:100%;cursor:crosshair;touch-action:none}.hud{position:absolute;inset:0;pointer-events:none;--touch-hud-offset: clamp(156px, 24vh, 214px);--touch-control-size: clamp(124px, 18vw, 176px)}.hud.touch-mode{pointer-events:auto;touch-action:none}.crosshair{position:absolute;left:50%;top:50%;width:18px;height:18px;margin-left:-9px;margin-top:-9px}.crosshair,.lock-hint,.status-panel,.hotbar-label,.message-toast{pointer-events:none}.orientation-lock{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at top,rgba(102,184,255,.28),transparent 42%),#0a141cd1;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);pointer-events:auto;z-index:6}.help-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at top,rgba(255,210,127,.16),transparent 38%),#08111ab3;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);pointer-events:auto;z-index:7}.hud.help-open .help-overlay{display:flex}.help-card{width:min(92vw,560px);display:grid;gap:18px;padding:24px;border-radius:24px;background:linear-gradient(180deg,#2a2013f5,#18202af5),#19232df0;border:1px solid rgba(255,240,194,.24);box-shadow:0 28px 56px #00000057;color:#f8f2dc}.help-card__header{display:flex;align-items:center;justify-content:space-between;gap:16px}.help-card__header strong{font-size:28px;letter-spacing:.04em}.help-card__close{width:42px;height:42px;border:0;border-radius:14px;background:#fff4d11f;color:#fff3c6;font:inherit;font-size:26px;line-height:1;cursor:pointer}.help-card__content{display:grid;gap:12px}.help-card__section{padding:14px 16px;border-radius:18px;background:#fff8dd0f;border:1px solid rgba(255,255,255,.08)}.help-card__section span{display:block;margin-bottom:6px;color:#ffe19c;font-size:13px;letter-spacing:.08em;text-transform:uppercase}.help-card__section p{margin:0;line-height:1.5;color:#f6f0df}.hud.touch-mode.landscape-required .orientation-lock{display:flex}.orientation-lock-card{width:min(88vw,420px);display:grid;gap:14px;justify-items:center;text-align:center;padding:26px 24px;border-radius:28px;background:#172631eb;border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 48px #0000004d;color:#edf6ff}.orientation-lock-card strong{font-size:24px;line-height:1.1}.orientation-lock-card span{color:#edf6ffc7;line-height:1.45}.orientation-lock-icon{width:66px;height:66px;border-radius:20px;border:2px solid rgba(255,237,173,.7);background:linear-gradient(135deg,#ffedad47,#ffedad00),#ffffff0f;transform:rotate(90deg);position:relative}.orientation-lock-icon:after{content:"";position:absolute;inset:12px;border-radius:12px;border:2px solid rgba(255,255,255,.42)}.crosshair:before,.crosshair:after{content:"";position:absolute;background:#fff8dcf2;box-shadow:0 0 10px #00000073}.crosshair:before{left:8px;top:0;width:2px;height:18px}.crosshair:after{left:0;top:8px;width:18px;height:2px}.lock-hint{position:absolute;left:50%;top:12%;transform:translate(-50%);padding:14px 18px;background:#0f1d2ca3;border:1px solid rgba(255,255,255,.18);border-radius:14px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.02em;transition:opacity .18s ease}.status-panel{position:absolute;left:18px;top:18px;padding:14px 16px;min-width:250px;background:#0e202899;border:1px solid rgba(255,255,255,.15);border-radius:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#e7f4ff;line-height:1.45}.hotbar{position:absolute;left:50%;bottom:20px;transform:translate(-50%);display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:8px;width:min(95vw,1080px)}.hud.touch-mode .hotbar{bottom:calc(var(--touch-hud-offset) + env(safe-area-inset-bottom));width:min(92vw,580px);grid-template-columns:repeat(5,minmax(0,1fr));pointer-events:auto}.hud.touch-mode:not(.inventory-open) .hotbar,.hud.touch-mode:not(.inventory-open) .hotbar-label{display:none}.hotbar-slot{display:grid;gap:6px;justify-items:center;padding:10px 8px 12px;background:#201d1594;border:1px solid rgba(255,255,255,.12);border-radius:18px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transform:translateY(0);transition:transform .16s ease,border-color .16s ease,background .16s ease}.hotbar-slot.active{transform:translateY(-8px);border-color:#ffedadf2;background:#3a3115db}.hud.touch-mode .hotbar-slot{min-height:74px;cursor:pointer}.hotbar-key{font-size:12px;opacity:.72}.hud.touch-mode .hotbar-key{font-size:11px}.hotbar-swatch{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;border:2px solid rgba(255,255,255,.38);box-shadow:inset 0 1px 2px #ffffff2e}.hotbar-swatch.is-tool{color:#2a2012;font-size:18px;font-weight:700}.hotbar-slot.is-tool-slot{background:#2d2312b8}.hotbar-name{text-align:center;font-size:12px;line-height:1.15}.hotbar-label{position:absolute;left:50%;bottom:136px;transform:translate(-50%);padding:8px 14px;border-radius:999px;background:#0f1d2c94;border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.hud.touch-mode .hotbar-label{bottom:calc(var(--touch-hud-offset) + 164px + env(safe-area-inset-bottom))}.message-toast{position:absolute;left:50%;bottom:178px;transform:translate(-50%) translateY(12px);padding:10px 16px;border-radius:999px;background:#fff4d1f0;color:#5d3d16;font-weight:700;opacity:0;transition:opacity .18s ease,transform .18s ease}.hud.touch-mode .message-toast{bottom:calc(var(--touch-hud-offset) + 208px + env(safe-area-inset-bottom))}.hud.touch-mode:not(.inventory-open) .message-toast{bottom:calc(128px + env(safe-area-inset-bottom))}.hud.touch-mode.landscape-required .lock-hint,.hud.touch-mode.landscape-required .status-panel,.hud.touch-mode.landscape-required .hotbar,.hud.touch-mode.landscape-required .hotbar-label,.hud.touch-mode.landscape-required .touch-controls,.hud.touch-mode.landscape-required .message-toast{display:none}.touch-controls{position:absolute;left:0;right:0;bottom:0;display:none;justify-content:space-between;align-items:flex-end;gap:18px;padding:20px max(18px,env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));pointer-events:none}.hud.touch-mode .touch-controls{display:flex}.touch-cluster{display:flex;flex-direction:column;gap:14px;pointer-events:none}.touch-cluster--move{align-items:flex-start}.touch-cluster--actions{align-items:flex-end}.touch-actions{width:min(38vw,320px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;pointer-events:none}.touch-pad,.touch-button{pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.touch-pad{position:relative;width:var(--touch-control-size);height:var(--touch-control-size);border-radius:50%;background:#12222e47;border:1px solid rgba(255,255,255,.18);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:inset 0 1px 1px #ffffff14,0 10px 30px #0000002e}.touch-pad:before{content:"";position:absolute;inset:18%;border-radius:inherit;border:1px solid rgba(255,255,255,.14)}.touch-pad.active{border-color:#fff0c2bd;background:#2539476b}.touch-pad-label{position:absolute;left:50%;top:16px;transform:translate(-50%);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#f3f8ffb8}.touch-pad-thumb{position:absolute;left:50%;top:50%;width:48px;height:48px;margin-left:-24px;margin-top:-24px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#ffffff70,#fff0 60%),#fff8d6db;border:1px solid rgba(81,58,24,.35);box-shadow:0 8px 18px #0000003d}.touch-button{min-height:52px;padding:11px 14px;border:1px solid rgba(255,255,255,.18);border-radius:18px;background:linear-gradient(180deg,#fbf5e32e,#fbf5e30a),#1c2b37b8;color:#f5f8ff;font:inherit;font-weight:700;letter-spacing:.02em;box-shadow:0 10px 24px #0003}.touch-button.is-pressed{transform:translateY(1px);background:linear-gradient(180deg,#fff5d047,#fff5d014),#293d4ce0;border-color:#ffecadb8}.message-toast.visible{opacity:1;transform:translate(-50%) translateY(0)}.hud.help-open .crosshair,.hud.help-open .message-toast{opacity:0}@media(max-width:920px){.status-panel{min-width:0;max-width:calc(100vw - 36px);font-size:13px}.hotbar{gap:6px;width:min(98vw,1080px)}.hotbar-slot{padding:8px 6px 10px}.hotbar-name{font-size:11px}}@media(max-width:920px),(max-height:760px){.hud{--touch-hud-offset: clamp(142px, 23vh, 188px);--touch-control-size: clamp(112px, 19vw, 148px)}.hud.touch-mode .status-panel{top:14px;max-width:min(52vw,300px);font-size:12px;padding:12px 13px}.hud.touch-mode .lock-hint{top:8%;max-width:min(82vw,520px);padding:12px 14px;font-size:13px}.touch-actions{width:min(42vw,240px);gap:8px}.touch-button{min-height:46px;padding:10px 12px;font-size:13px}.help-card{padding:20px}.help-card__header strong{font-size:24px}}@media(orientation:portrait){.hud.touch-mode .lock-hint{top:10px;width:min(92vw,640px)}.hud.touch-mode .status-panel{top:74px;max-width:calc(100vw - 24px)}.hud.touch-mode .hotbar{width:min(92vw,520px)}.touch-controls{padding-left:12px;padding-right:12px;gap:12px}.touch-actions{width:min(46vw,220px)}}