:root{--paper:#fffbf4;--cream:#f8faf2;--ink:#17251f;--muted:#65756a;--moss:#355f42;--sky:#7eb8c7;--blue:#4f8cff;--pink:#e98ad7;--solar:#f2b35d;--sprout:#a6c86d}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Futura,"Trebuchet MS",Avenir,system-ui,sans-serif;color:var(--ink);background:linear-gradient(135deg,var(--cream),#edf6ef 48%,#eef7f8);overflow-x:hidden}body:before{content:"";position:fixed;inset:0;background:radial-gradient(circle at 82% 12%,rgba(242,179,93,.24),transparent 28%),radial-gradient(circle at 8% 90%,rgba(126,184,199,.24),transparent 35%);pointer-events:none}.component-page{position:relative;width:min(1180px,100%);margin:0 auto;padding:28px}.component-topbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:20px}.back-link,.button,button{border:0;border-radius:18px;padding:12px 15px;font-weight:1000;font:inherit;text-decoration:none;color:var(--ink);background:rgba(255,255,255,.62);box-shadow:0 10px 26px rgba(65,50,29,.08);cursor:pointer}.button.primary,button.primary{color:#fff;background:linear-gradient(90deg,var(--blue),var(--pink));box-shadow:0 16px 30px rgba(79,140,255,.25)}.brand-pill{display:inline-flex;align-items:center;gap:10px;padding:10px 15px;border-radius:16px;background:linear-gradient(135deg,rgba(53,95,66,.94),rgba(23,162,184,.82));color:#fffdf4;font-weight:1000;letter-spacing:.13em;text-transform:uppercase;font-size:12px}.component-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.65fr);gap:18px;align-items:stretch}.hero-card,.panel-card,.result-card,.draft-card{border:1px solid rgba(53,95,66,.14);border-radius:30px;background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(248,250,242,.66));box-shadow:0 24px 70px rgba(45,58,39,.12);padding:22px}.hero-card h1{font-size:clamp(44px,6vw,82px);line-height:.9;letter-spacing:-.065em;margin:16px 0;color:#14221c}.hero-card p,.panel-card p,.result-card p{color:var(--muted);line-height:1.55}.quick-stat{display:grid;gap:10px}.quick-stat div{border:1px solid rgba(53,95,66,.12);border-radius:20px;background:rgba(255,255,255,.48);padding:14px}.quick-stat span,.mini-label{font-size:11px;font-weight:1000;letter-spacing:.12em;text-transform:uppercase;color:var(--moss)}.quick-stat strong{display:block;font-size:24px;margin-top:4px}.component-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.7fr);gap:16px;margin-top:16px}.search-row{display:grid;grid-template-columns:1fr auto;gap:10px;margin:12px 0}input,select{width:100%;border:1px solid rgba(53,95,66,.18);background:rgba(255,255,255,.78);border-radius:18px;padding:14px 15px;font:inherit;color:var(--ink);outline:none}input:focus,select:focus{border-color:rgba(79,140,255,.75);box-shadow:0 0 0 4px rgba(79,140,255,.14)}label{display:grid;gap:7px;color:var(--moss);font-weight:900}.results-grid,.draft-grid{display:grid;gap:12px}.result-card h3,.draft-card h3{font-size:24px;margin:5px 0}.tag-row{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.tag-row small{border:1px solid rgba(53,95,66,.12);background:rgba(255,255,255,.52);border-radius:999px;padding:7px 9px;color:var(--moss);font-weight:850}.form-grid{display:grid;gap:12px}.starter-module-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.starter-module-option{display:flex;align-items:center;gap:8px;border:1px solid rgba(53,95,66,.12);background:rgba(255,255,255,.48);border-radius:14px;padding:8px;color:var(--ink)}.starter-module-option input{width:auto}.launch-list{margin:12px 0 0;padding-left:20px;color:var(--muted);line-height:1.55}.empty-state{border:1px dashed rgba(53,95,66,.24);border-radius:22px;padding:18px;text-align:center;color:var(--muted);background:rgba(255,255,255,.36)}@media(max-width:850px){.component-page{padding:calc(env(safe-area-inset-top) + 14px) 14px calc(env(safe-area-inset-bottom) + 18px)}.component-topbar{position:sticky;top:calc(env(safe-area-inset-top) + 8px);z-index:4}.component-hero,.component-grid{grid-template-columns:1fr}.hero-card h1{font-size:44px}.search-row{grid-template-columns:1fr}.starter-module-options{grid-template-columns:1fr}.button,button{width:100%}.back-link{width:auto}.brand-pill{display:none}}
