:root{--hud-bg: rgba(250, 248, 240, .72);--hud-ink: #3f4237;--hud-muted: #7a7d6e;--hud-line: rgba(60, 60, 50, .12);--accent: #b08d4f;--page: #eeece3;--font: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif}@media(prefers-color-scheme:dark){:root{--hud-bg: rgba(32, 36, 30, .7);--hud-ink: #e4e1d3;--hud-muted: #a2a593;--hud-line: rgba(255, 255, 240, .12);--page: #20251f}}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--page);color:var(--hud-ink);font-family:var(--font);overflow:hidden}body{-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button{font:inherit;font-size:14px;color:var(--hud-ink);background:var(--hud-bg);border:1px solid var(--hud-line);border-radius:999px;padding:10px 16px;cursor:pointer;min-height:44px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}button:hover{border-color:var(--accent)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.space{position:fixed;inset:0}.stage{position:absolute;inset:0;touch-action:none}.stage canvas{display:block}.labels{position:absolute;inset:0;pointer-events:none}.hud{position:absolute;left:0;right:0;margin:0;pointer-events:none}.hud>*,.hud button{pointer-events:auto}.top{top:0;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:max(12px,env(safe-area-inset-top)) 16px 0}.pill{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:4px 14px 4px 4px;background:var(--hud-bg);border:1px solid var(--hud-line);border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:14px}button.pill{padding:4px 16px}.pill .icon{border:0;background:transparent;min-height:36px;padding:0 10px;-webkit-backdrop-filter:none;backdrop-filter:none;color:var(--hud-muted)}.pill .title{font-weight:600;letter-spacing:1px}.muted{color:var(--hud-muted);font-size:12px;font-variant-numeric:tabular-nums}.hint,.gathering{left:50%;right:auto;transform:translate(-50%);white-space:nowrap;padding:5px 12px;border-radius:999px;background:var(--hud-bg);font-size:12px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.hint{top:calc(max(12px,env(safe-area-inset-top)) + 58px);color:var(--hud-muted);transition:opacity 1.2s}.hint.gone{opacity:0}.gathering{bottom:calc(max(16px,env(safe-area-inset-bottom)) + 58px);color:var(--hud-ink)}.gathering.now{color:var(--accent);font-weight:600}.gestures{bottom:max(16px,env(safe-area-inset-bottom));display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding:0 16px}.gestures kbd{display:none;margin-right:6px;font:inherit;font-size:11px;color:var(--hud-muted)}@media(hover:hover){.gestures kbd{display:inline}}.kbd-only{display:none}@media(hover:hover)and (pointer:fine){.kbd-only{display:inline}}.nametag{padding:3px 9px;border-radius:999px;background:var(--hud-bg);color:var(--hud-ink);font-size:11px;white-space:nowrap;border:1px solid var(--hud-line)}.nametag b{display:inline-grid;place-items:center;width:16px;height:16px;margin-right:5px;border-radius:50%;background:var(--accent);color:#fff;font-size:9px;font-weight:600}.message{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px 16px;text-align:center}.message h1{margin:0;font-size:22px;font-weight:500;letter-spacing:2px}.message p{margin:0 0 8px;color:var(--hud-muted);font-size:14px;line-height:1.7}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
