:root{--bg:#04050b;--panel:rgba(255,255,255,.07);--line:rgba(255,255,255,.14);--gold:#E8B53A;--violet:#b478ff;--mint:#5fe3b0;--red:#ff3b5c;--sky:#5bd9ff;--ink:#f4f0e8;--muted:#b9b1a2;--shadow:0 34px 120px rgba(0,0,0,.58);--fast:cubic-bezier(.2,.8,.2,1)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 8% -8%,rgba(232,181,58,.28),transparent 34rem),radial-gradient(circle at 90% 0,rgba(180,120,255,.22),transparent 34rem),linear-gradient(135deg,#03040a,#080a18 54%,#03040a);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{border:1px solid var(--line);border-radius:15px;padding:12px 16px;background:rgba(255,255,255,.08);color:var(--ink);font-weight:900;cursor:pointer;transition:.18s var(--fast)}button:hover{transform:translateY(-2px);border-color:rgba(232,181,58,.48);box-shadow:0 0 42px rgba(232,181,58,.18)}button.primary{background:var(--gold);color:#100d05;border-color:transparent}input,textarea,select{width:100%;border:1px solid var(--line);border-radius:15px;background:rgba(0,0,0,.30);color:var(--ink);padding:12px}textarea{min-height:90px;resize:vertical}label{display:grid;gap:7px;color:var(--muted);font-weight:800}.wrap{max-width:1720px;margin:0 auto;padding:22px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.pill{display:inline-flex;gap:8px;align-items:center;border:1px solid rgba(232,181,58,.32);border-radius:999px;padding:9px 12px;color:var(--gold);background:rgba(232,181,58,.08);font:900 11px/1 ui-monospace,Menlo,monospace;text-transform:uppercase}.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;border:1px solid var(--line);border-radius:34px;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035));box-shadow:var(--shadow);margin-bottom:16px}.hero-copy{padding:clamp(24px,4vw,54px)}h1{font-size:clamp(3rem,7vw,8rem);line-height:.78;letter-spacing:-.105em;margin:10px 0;background:linear-gradient(100deg,#fff,var(--gold),#fff,var(--violet));-webkit-background-clip:text;background-clip:text;color:transparent}h2{font-size:clamp(1.8rem,3.5vw,3.8rem);line-height:.9;letter-spacing:-.07em;margin:0 0 10px}p{color:#ded7c9;line-height:1.55}.hero canvas{width:100%;height:100%;min-height:480px}.grid{display:grid;grid-template-columns:350px minmax(0,1fr) 400px;gap:14px;align-items:start}.panel,.preview,.artifact,.gate{border:1px solid var(--line);border-radius:26px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.03));box-shadow:0 18px 60px rgba(0,0,0,.24);padding:18px;position:relative;overflow:hidden}.panel:before,.preview:before,.artifact:before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--gold),var(--violet),var(--sky))}.form{display:grid;gap:12px}.chip{display:inline-flex;border:1px solid rgba(255,255,255,.15);border-radius:999px;padding:7px 10px;color:#d9d2c4;font:800 10px/1 ui-monospace,Menlo,monospace;text-transform:uppercase;margin:2px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.component{border:1px solid rgba(255,255,255,.12);border-radius:20px;background:rgba(0,0,0,.20);padding:14px;margin:10px 0}.score{font-size:clamp(3rem,7vw,6rem);font-weight:1000;color:var(--gold);letter-spacing:-.1em;line-height:.8}.ok{color:var(--mint)}.bad{color:var(--red)}.toast{position:fixed;right:18px;bottom:18px;z-index:99;background:rgba(3,7,12,.94);border:1px solid rgba(95,227,176,.55);border-radius:18px;color:var(--mint);padding:12px 14px}@media(max-width:1180px){.hero,.grid{grid-template-columns:1fr}.hero canvas{min-height:360px}}