:root{--bg: #0b0e1a;--bg-2: #131a2e;--gold: #c9a227;--gold-soft: #e6c86a;--text: #e8e6df;--text-dim: #9aa0b4}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,sans-serif;background:radial-gradient(1200px 600px at 80% -10%,#2a1f4d 0%,transparent 60%),radial-gradient(900px 500px at 10% 110%,#123a52 0%,transparent 55%),var(--bg);color:var(--text);min-height:100vh}h1,h2,h3,.font-display{font-family:Cinzel,serif}.topbar{display:flex;justify-content:space-between;align-items:center;padding:1.2rem 2rem}.topbar-link{color:var(--gold-soft);text-decoration:none;font-weight:600;border:1px solid var(--gold);border-radius:6px;padding:.45rem .9rem}.topbar-link:hover{background:#c9a22726}.hero{text-align:center;padding:6rem 2rem 4rem;position:relative}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(600px 300px at 50% 20%,rgba(201,162,39,.12),transparent 70%);pointer-events:none}.hero-title{font-size:clamp(2.4rem,6vw,4rem);color:var(--gold-soft);margin-bottom:1rem;letter-spacing:.02em}.hero-sub{color:var(--text-dim);max-width:34rem;margin:0 auto 2.2rem;font-size:1.1rem;line-height:1.6}.cta-btn{display:inline-block;background:linear-gradient(180deg,var(--gold-soft),var(--gold));color:#1a1400;font-family:Cinzel,serif;font-weight:700;font-size:1.15rem;padding:.9rem 2.2rem;border-radius:8px;text-decoration:none;box-shadow:0 6px 24px #c9a22759;transition:transform .15s ease,box-shadow .15s ease}.cta-btn:hover{transform:translateY(-2px);box-shadow:0 10px 32px #c9a22780}.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.4rem;max-width:900px;margin:0 auto;padding:1rem 2rem 4rem}.feature{background:linear-gradient(180deg,#ffffff0a,#ffffff03);border:1px solid rgba(201,162,39,.25);border-radius:10px;padding:1.4rem}.feature-title{color:var(--gold-soft);margin-bottom:.5rem}.feature-text{color:var(--text-dim);line-height:1.55}.footer{text-align:center;color:var(--text-dim);font-size:.85rem;padding:2rem;border-top:1px solid rgba(255,255,255,.06)}.generator-page{min-height:100vh;display:flex;flex-direction:column}.generator-layout{display:grid;grid-template-columns:minmax(300px,420px) 1fr;gap:2rem;max-width:1100px;margin:0 auto;padding:2rem;width:100%;flex:1}.controls{display:flex;flex-direction:column;gap:1.4rem}.group{border:1px solid rgba(201,162,39,.3);border-radius:10px;padding:1rem}.group legend{font-family:Cinzel,serif;color:var(--gold-soft);padding:0 .4rem}.chip{background:#ffffff0a;color:var(--text);border:1px solid rgba(255,255,255,.15);border-radius:6px;padding:.4rem .9rem;cursor:pointer;margin-right:.4rem}.chip.is-active,.card.is-active{border-color:var(--gold);background:#c9a22726;color:var(--gold-soft)}.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:.5rem;margin-top:.6rem}.card{background:#ffffff08;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:var(--text);padding:.5rem;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.3rem;font-size:.72rem}.card:hover{border-color:var(--gold)}.row{display:flex;flex-wrap:wrap;gap:1rem}.row label{display:flex;flex-direction:column;gap:.3rem;color:var(--text-dim);font-size:.85rem}.row select{background:var(--bg-2);color:var(--text);border:1px solid rgba(201,162,39,.4);border-radius:6px;padding:.4rem}.result-panel{display:flex;align-items:flex-start}.result-card{width:100%;background:linear-gradient(180deg,#ffffff0d,#ffffff03);border:1px solid var(--gold);border-radius:14px;padding:3rem 2rem;text-align:center;box-shadow:0 12px 40px #00000080}.result-race-icons{display:flex;justify-content:center;gap:1rem;margin-bottom:1.2rem}.nickname{font-family:Cinzel,serif;font-size:clamp(2rem,5vw,3.2rem);color:var(--gold-soft);letter-spacing:.03em;margin-bottom:1rem;word-break:break-word}.result-note{color:var(--text-dim);font-style:italic;margin-bottom:1rem}.result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem}.btn{background:#ffffff0d;color:var(--text);border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:.55rem 1.4rem;cursor:pointer;font-size:.95rem}.btn:hover{border-color:var(--gold);color:var(--gold-soft)}.result-empty{color:var(--text-dim);font-size:1.05rem;text-align:center;width:100%;padding:4rem 2rem}@media (max-width: 820px){.generator-layout{grid-template-columns:1fr}}
