:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;color:#271a14;background:#fff7ed;font-synthesis:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}*{box-sizing:border-box}html,body,#root{margin:0;min-width:320px;min-height:100vh}body{background:radial-gradient(circle at top left,rgba(255,107,53,.18),transparent 24%),radial-gradient(circle at top right,rgba(79,70,229,.14),transparent 24%),#fff7ed}button,input,select,textarea{font:inherit}.studio-shell{max-width:1720px;margin:0 auto;padding:36px 5vw 56px}.hero,.builder-panel,.preview-panel,.template-card,.email-frame,.metrics-grid div,.checklist,input,select,textarea{border:1px solid rgba(124,45,18,.12);background:#ffffffb8;box-shadow:0 28px 80px #7c2d121a}.hero{border-radius:42px;padding:clamp(36px,6vw,76px);background:linear-gradient(135deg,#ffffffd6,#ffedd5c2),#ffffffb8}.eyebrow{margin:0;color:#ea580c;font-size:.78rem;font-weight:900;letter-spacing:.24em;text-transform:uppercase}.hero h1{max-width:1040px;margin:18px 0 0;font-size:clamp(3.2rem,8vw,6rem);line-height:.9;letter-spacing:-.075em}.hero-text{max-width:780px;margin:24px 0 0;color:#7c4a32;font-size:1.1rem;line-height:1.8}.workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(420px,.85fr);gap:28px;margin-top:28px}.builder-panel,.preview-panel{border-radius:36px;padding:32px}.section-head,.actions-row,.mode-switch,.metrics-grid{display:flex;justify-content:space-between;align-items:center;gap:16px}.section-head h2,.checklist h3{margin:0;font-size:2rem;letter-spacing:-.06em}.section-head span{color:#9a5a3b;font-size:.9rem;font-weight:800}.template-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}.template-card{cursor:pointer;border-radius:28px;padding:24px;text-align:left;transition:.22s ease}.template-card.active{border-color:var(--accent);box-shadow:0 22px 60px color-mix(in srgb,var(--accent) 22%,transparent)}.template-card:hover,.actions-row button:hover,.mode-switch button:hover{transform:translateY(-3px)}.template-card span{color:var(--accent);font-size:.78rem;text-transform:uppercase;letter-spacing:.18em;font-weight:900}.template-card strong{display:block;margin-top:14px;font-size:1.3rem;line-height:1.2}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:28px}label{display:grid;gap:10px;color:#7c4a32;font-weight:800}label.wide{grid-column:1 / -1}input,select,textarea{width:100%;border-radius:22px;color:#271a14;padding:17px 18px;outline:0}textarea{resize:vertical}.actions-row{justify-content:flex-start;margin-top:24px}.actions-row button,.mode-switch button{border:0;border-radius:999px;cursor:pointer;padding:16px 22px;font-weight:900}.actions-row button,.mode-switch button.active{color:#fff;background:linear-gradient(135deg,#ff6b35,#ef4444)}.actions-row button.secondary,.mode-switch button{color:#271a14;background:#fff;border:1px solid rgba(124,45,18,.14)}.email-frame{margin-top:28px;border-radius:36px;padding:24px;transition:.24s ease}.email-frame.mobile{max-width:360px;margin-left:auto;margin-right:auto}.email-preheader{color:#9a5a3b;font-size:.86rem;margin-bottom:14px}.email-card{border-radius:30px;padding:34px;color:#fff;background:linear-gradient(135deg,var(--accent),#271a14)}.email-badge{display:inline-flex;border-radius:999px;padding:10px 14px;background:#ffffff2e;font-size:.8rem;font-weight:900}.email-card h3{margin:24px 0 0;font-size:clamp(2rem,5vw,3.8rem);line-height:.95;letter-spacing:-.07em}.email-card p{margin:22px 0 0;line-height:1.75;color:#ffffffdb}.email-card a{display:inline-flex;margin-top:26px;border-radius:999px;padding:16px 22px;background:#fff;color:#271a14;font-weight:900;text-decoration:none}.metrics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:22px}.metrics-grid div,.checklist{border-radius:26px;padding:22px}.metrics-grid span{color:#9a5a3b;font-size:.76rem;text-transform:uppercase;letter-spacing:.18em;font-weight:900}.metrics-grid strong{display:block;margin-top:10px;font-size:1.9rem;letter-spacing:-.06em}.checklist{margin-top:22px}.checklist p{margin:14px 0 0;color:#7c4a32;font-weight:700}@media (max-width: 1080px){.workspace,.template-grid,.form-grid{grid-template-columns:1fr}}@media (max-width: 640px){.studio-shell{padding-inline:16px}.builder-panel,.preview-panel{padding:22px}.section-head,.actions-row{align-items:flex-start;flex-direction:column}}
