:root{color-scheme:light;--bg: #0b0d18;--panel: #151828;--panel-soft: #1d2236;--text: #f2f2f5;--muted: #b5b7c3;--accent: #ffb347;--accent-2: #5bc0eb;--shadow: 0 12px 40px rgba(0, 0, 0, .35)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:Space Grotesk,Segoe UI,system-ui,sans-serif;background:radial-gradient(circle at top,#1c1f33,#0b0d18 55%,#07090f);color:var(--text)}main{display:flex;flex-direction:column;gap:48px;padding:40px 20px 80px}.hero{max-width:900px;margin:0 auto;text-align:left}.hero h1{font-size:clamp(2.3rem,5vw,3.4rem);margin-bottom:12px}.hero p{color:var(--muted);font-size:1.05rem;line-height:1.6}.hero .cta{margin-top:20px;display:inline-flex;gap:12px;align-items:center}.hero .cta a{color:var(--text);text-decoration:none;background:linear-gradient(135deg,var(--accent),var(--accent-2));padding:12px 18px;border-radius:999px;font-weight:600}.hero .cta span{color:var(--muted);font-size:.95rem}.app-section{max-width:1100px;margin:0 auto;width:100%}.app-shell{background:var(--panel);border-radius:18px;padding:16px;box-shadow:var(--shadow);display:grid;grid-template-rows:minmax(240px,1fr) auto;gap:14px}.canvas-wrap{width:100%;aspect-ratio:16 / 9;background:#0a0c18;border-radius:14px;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}.app-canvas{image-rendering:pixelated;image-rendering:crisp-edges;background:transparent}.dock{display:flex;gap:12px;justify-content:center;padding:10px;background:var(--panel-soft);border-radius:12px}.dock-button{min-width:110px;padding:12px 16px;border-radius:999px;border:none;background:#232944;color:var(--text);font-size:.95rem;font-weight:600;cursor:pointer}.dock-button:disabled{opacity:.45;cursor:not-allowed}.dock-button-icon{min-width:52px;padding:12px;font-size:1.1rem;line-height:1}.dock-button-icon.is-active{background:#33406e}.dock-seed{display:flex;align-items:center;gap:8px;padding:0 10px;border-radius:999px;background:#232944}.dock-seed-label{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);-webkit-user-select:none;user-select:none}.dock-seed-input{width:9ch;padding:12px 0;border:none;background:transparent;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.95rem;font-weight:600;text-align:center}.dock-seed-input:focus{outline:none}.dock-seed-input.is-invalid{color:#ff9a8d}.dock-seed-copy{padding:6px 10px;border-radius:999px;border:none;background:#2f3757;color:var(--text);font-size:.78rem;font-weight:600;cursor:pointer}.dock-seed-copy:hover{background:#3a446a}.dock-seed-status{display:flex;align-items:center;min-width:8ch;font-size:.78rem;color:var(--muted);-webkit-user-select:none;user-select:none}.dock-brand{display:flex;align-items:center;padding:0 6px 0 10px;line-height:1;-webkit-user-select:none;user-select:none;text-decoration:none;border-radius:999px;cursor:pointer;opacity:.9}.dock-brand-icon{display:block;width:32px;height:32px}.dock-brand:hover,.dock-brand:focus-visible{opacity:1}#hud-mount{transition:opacity .26s ease,transform .26s ease}#hud-mount.is-hidden{opacity:0;transform:translateY(12px);pointer-events:none}@media(prefers-reduced-motion:reduce){#hud-mount{transition:none}#hud-mount.is-hidden{transform:none}}.content-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}.content-card{background:#151828cc;border-radius:16px;padding:18px;box-shadow:var(--shadow)}.content-card h3{margin-top:0}.faq{max-width:900px;margin:0 auto}.faq h2{margin-bottom:14px}.faq details{background:#151828cc;border-radius:12px;padding:12px 16px;margin-bottom:10px}footer{text-align:center;color:var(--muted);font-size:.9rem}.app-body{height:100%;overflow:hidden;background:#0b0d18}#app-root{position:fixed;inset:0;overflow:hidden}#canvas-mount{position:fixed;inset:0;width:100vw;height:100vh;display:flex;align-items:center;justify-content:center;background:#0a0c18;touch-action:none}#hud-mount{position:fixed;left:0;right:0;bottom:0;display:flex;justify-content:center;padding:0 16px calc(16px + env(safe-area-inset-bottom));background:transparent}@media(max-width:768px){main{padding:32px 16px 64px}.dock{flex-direction:column}.dock-button{width:100%}}
