:root{color:#443730;font-synthesis:none;text-rendering:optimizelegibility;background:#f5eddd;font-family:Inter,Geist,Avenir Next,Helvetica Neue,system-ui,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden}button{font:inherit}button:focus-visible{outline-offset:3px;outline:3px solid #2e8f8061}.app-shell{--cream:#fff8e9;--ink:#443730;--coral:#df644d;--teal:#2f8f83;--line:#4f3b2f29;touch-action:none;-webkit-user-select:none;user-select:none;background:#f5eddd;width:100%;height:100%;min-height:420px;position:relative;overflow:hidden}.game-host,.game-host canvas{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}.top-bar{z-index:10;top:max(16px, env(safe-area-inset-top));left:max(16px, env(safe-area-inset-left));right:max(16px, env(safe-area-inset-right));pointer-events:none;justify-content:space-between;align-items:flex-start;gap:12px;display:flex;position:absolute}.brand,.action-cluster,.context-actions,.tool-dock{-webkit-backdrop-filter:blur(18px)saturate(1.12);backdrop-filter:blur(18px)saturate(1.12);background:#fff8e9e6;border:1px solid #4d392d24;box-shadow:0 8px 26px #5e432e1f,0 1px 2px #5e432e1f}.brand{border-radius:18px;align-items:center;gap:10px;min-height:50px;padding:7px 14px 7px 8px;display:flex}.brand-mark{color:#fff9ea;background:#df644d;border-radius:11px;place-items:center;width:34px;height:34px;font-family:Georgia,serif;font-size:24px;font-style:italic;line-height:1;display:grid;box-shadow:inset 0 -2px #542a1f29}.brand-copy{flex-direction:column;gap:1px;line-height:1.1;display:flex}.brand-copy strong{letter-spacing:-.02em;font-size:14px;font-weight:650}.brand-copy small{color:#4437309e;letter-spacing:.02em;font-size:10px;font-weight:550}.action-cluster{pointer-events:auto;border-radius:18px;align-items:center;gap:3px;padding:4px;display:flex}.action-button,.tool-button{appearance:none;color:var(--ink);cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:0}.action-button{border-radius:14px;justify-content:center;align-items:center;gap:7px;min-width:44px;min-height:42px;padding:0 12px;font-size:12px;font-weight:620;display:inline-flex}.action-button[data-compact=true]{width:42px;min-width:42px;padding:0}.action-button:hover:not(:disabled),.action-button[data-active=true]{background:#5b433313}.action-button[data-active=true]{color:var(--teal);box-shadow:inset 0 0 0 1.5px #2f8f833d}.action-button[data-tone=accent]{color:#fff9ed;background:var(--teal);box-shadow:inset 0 -1px #1e4b4438}.action-button[data-tone=danger]{color:#bd4c3d}.action-button:disabled{opacity:.28;cursor:default}.action-button .icon,.tool-button .icon{flex:none;width:20px;height:20px;display:block}.cluster-divider{background:var(--line);width:1px;height:24px;margin:0 2px}.context-actions{z-index:11;top:max(78px, calc(env(safe-area-inset-top) + 66px));right:max(16px, env(safe-area-inset-right));border-radius:18px;align-items:center;gap:3px;padding:4px;display:flex;position:absolute}.motor-speed{background:#5b43330e;border-radius:14px;align-items:center;height:42px;padding:0 2px;display:flex}.motor-speed output{min-width:72px;color:var(--ink);text-align:center;font-variant-numeric:tabular-nums;font-size:12px;font-weight:680}.motor-speed output span{color:#44373085;font-size:9px;font-weight:620}.tool-dock{z-index:12;left:50%;bottom:max(14px, env(safe-area-inset-bottom));pointer-events:auto;border-radius:26px;align-items:stretch;gap:3px;padding:6px;display:flex;position:absolute;translate:-50%}.tool-button{border-radius:20px;align-content:center;place-items:center;gap:3px;min-width:64px;min-height:58px;padding:6px 10px;font-size:10px;font-weight:620;display:grid;position:relative}.tool-shortcut{color:currentColor;font:inherit;opacity:.42;font-size:8px;font-weight:720;line-height:1;position:absolute;top:6px;right:7px}.tool-button[data-active=true] .tool-shortcut{opacity:.72}.tool-button:hover{background:#5b43330f}.tool-button[data-active=true]{color:#fff9ed;background:var(--coral);box-shadow:inset 0 -2px #5a261c29,0 3px 8px #c14e3933}@media (width<=720px){.brand-copy small,.action-cluster .action-button span,.context-actions .action-button span{display:none}.brand{padding-right:9px}.action-button{width:42px;min-width:42px;padding:0}}@media (width<=520px){.brand-copy{display:none}.brand{min-height:50px;padding:7px}.action-cluster{gap:1px}.action-cluster .action-button{width:38px;min-width:38px}.cluster-divider{margin-inline:0}}@media (width<=420px){.top-bar{top:10px;left:10px;right:10px}.tool-button{min-width:55px;padding-inline:6px}.tool-dock{border-radius:24px;gap:1px;padding:5px}.tool-button{border-radius:19px}.context-actions{right:10px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important}}