:root{color-scheme:light;font-family:Space Grotesk,sans-serif;--bg-dark: #0c0d10;--bg-panel: #141620;--bg-accent: #1c2233;--text-primary: #f7f4ee;--text-muted: #b3b7c1;--accent: #f15b47;--accent-2: #f5d66b;--border: rgba(255, 255, 255, .08);--shadow: 0 24px 60px rgba(6, 9, 16, .6)}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;color:var(--text-primary);background:radial-gradient(circle at top left,#283149,var(--bg-dark) 60%);overflow:hidden}.app-shell{display:grid;grid-template-columns:280px 1fr;grid-template-rows:auto 1fr;height:100vh;position:relative}.topbar{grid-column:1 / -1;display:flex;align-items:center;justify-content:space-between;padding:18px 28px;background:#0c0d10bf;border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:16px}.brand__dot{width:14px;height:14px;border-radius:50%;background:linear-gradient(140deg,var(--accent),var(--accent-2));box-shadow:0 0 18px #f15b4799}.brand__title{font-size:1.25rem;font-weight:700;letter-spacing:.02em}.brand__subtitle{font-size:.85rem;color:var(--text-muted)}.topbar__actions{display:flex;gap:12px}button{font-family:inherit;border:none;border-radius:999px;padding:10px 18px;font-size:.95rem;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}button:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}button.primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#141418;font-weight:600;box-shadow:0 8px 20px #f15b4759}button.ghost{background:transparent;color:var(--text-primary);border:1px solid var(--border)}button:hover{transform:translateY(-1px)}.sidebar{padding:24px 20px;background:var(--bg-panel);border-right:1px solid var(--border);display:flex;flex-direction:column;gap:18px;transition:width .35s ease,opacity .35s ease;overflow:hidden}.sidebar.is-collapsed{width:0;opacity:0;padding:24px 0;border-right:none}.sidebar__header{font-size:.9rem;text-transform:uppercase;letter-spacing:.18em;color:var(--text-muted)}.sidebar__nav{display:grid;gap:10px}.sidebar__nav button{text-align:left;border-radius:16px;background:var(--bg-accent);color:var(--text-primary);padding:14px 16px;font-size:.95rem;border:1px solid transparent}.sidebar__nav button.is-active{border-color:#f15b4799;box-shadow:0 0 18px #f15b4733}.stage{position:relative;overflow:hidden}.stage__viewport{width:100%;height:100%}.stage__overlay{position:absolute;top:28px;left:28px;max-width:340px;padding:18px 22px;background:#141620a6;border:1px solid var(--border);border-radius:18px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);z-index:2;box-shadow:var(--shadow);animation:floatIn .6s ease}.stage__overlay h1{font-size:1.35rem;margin-bottom:8px}.stage__overlay p{font-size:.95rem;color:var(--text-muted);line-height:1.4}.ride-hud{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:space-between;padding:28px;pointer-events:none;z-index:2}.ride-hud__panel,.ride-hud__prompt{background:#0a0d14ad;border:1px solid var(--border);border-radius:18px;padding:16px 18px;max-width:340px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.ride-hud__title{font-size:1.1rem;font-weight:700;margin-bottom:10px}.ride-hud__stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px;margin-bottom:12px}.ride-hud__stats div,.ride-hud__biome{display:flex;flex-direction:column;gap:4px;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.ride-hud__stats strong,.ride-hud__biome strong{font-size:1.1rem;color:var(--text-primary);letter-spacing:.02em}.ride-hud__message{font-size:1rem;margin-bottom:12px;color:var(--text-primary)}.ride-hud__buttons{display:flex;gap:10px}.ride-hud__buttons button{pointer-events:auto;flex:1;border-radius:14px;padding:12px 0;background:var(--bg-accent);color:var(--text-primary);border:1px solid transparent;font-weight:600}.ride-hud__buttons button:hover{box-shadow:0 0 18px #f15b4740;border-color:#f15b4766}.immersive .topbar,.immersive .sidebar,.immersive .stage__overlay{opacity:0;pointer-events:none;transform:translateY(-12px)}.immersive .app-shell{grid-template-columns:0 1fr;grid-template-rows:0 1fr}.immersive .sidebar{width:0;padding:0;border:none}@keyframes floatIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@media (max-width: 900px){.app-shell{grid-template-columns:1fr}.sidebar{position:absolute;z-index:3;width:260px;height:calc(100% - 70px);top:70px;left:0;border-right:none;border-top:1px solid var(--border)}.sidebar.is-collapsed{transform:translate(-100%)}.stage__overlay{max-width:280px}.ride-hud{padding:18px}.ride-hud__panel,.ride-hud__prompt{max-width:100%}}
