:root{color-scheme:light;font-family:IBM Plex Sans,Segoe UI,sans-serif;background:#e9e1d2;color:#111}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(circle at top left,rgba(255,255,255,.65),transparent 35%),linear-gradient(135deg,#e9e1d2,#d8d0c0)}button,input,select,textarea{font:inherit}input,select,textarea{width:100%;border:1px solid #c1b59d;border-radius:12px;padding:.8rem .9rem;background:#fffdf8;color:#1a1a1a}textarea{resize:vertical;min-height:6rem}label{display:grid;gap:.4rem}label span{font-size:.84rem;text-transform:uppercase;letter-spacing:.08em;color:#6c604f}.app-shell{display:grid;grid-template-columns:minmax(320px,420px) 1fr;min-height:100vh}.sidebar{padding:2rem;background:#fff9f0e0;border-right:1px solid rgba(104,87,63,.15);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow-y:auto}.brand-block{margin-bottom:2rem}.brand-block h1,.preview-header h2{margin:0;font-family:Georgia,serif;font-weight:700}.brand-block h1{font-size:clamp(2.2rem,4vw,3.2rem)}.lead,.preview-header p,.preview-card p,.hero-card p{color:#584d3d}.data-source{margin-top:.4rem;font-size:.95rem;max-width:60ch}.eyebrow{margin:0 0 .6rem;color:#8d6a2d;text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:700}.sidebar-section{margin-bottom:1rem;border:1px solid rgba(104,87,63,.16);border-radius:24px;background:#fffdf8;overflow:hidden}.section-head{padding:1rem 1.2rem;border-bottom:1px solid rgba(104,87,63,.1)}.section-head h3{margin:0;font-size:1rem}.section-body{display:grid;gap:1rem;padding:1rem 1.2rem 1.2rem}.project-toolbar{display:grid;gap:1rem;margin-bottom:1rem;padding:1rem 1.1rem;border-radius:24px;background:#ffffffad;border:1px solid rgba(104,87,63,.16)}.toolbar-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}.solid-button,.outline-button{border-radius:999px;padding:.85rem 1rem;cursor:pointer}.solid-button{border:0;background:#111;color:#fff}.outline-button{border:1px solid rgba(17,17,17,.14);background:#ffffffb8}.solid-button:disabled,.outline-button:disabled{opacity:.6;cursor:wait}.status-strip{display:flex;flex-wrap:wrap;gap:.75rem}.status-strip span,.notice{font-size:.88rem}.notice{margin:0}.success{color:#1d6b3a}.error{color:#9e2d2d}.color-field{display:grid;grid-template-columns:4rem 1fr;gap:.75rem;align-items:center}.color-field input[type=color]{padding:.2rem;min-height:3rem}.preview-area{padding:2rem}.preview-header{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}.preview-tabs{display:flex;flex-wrap:wrap;gap:.6rem}.preview-tabs button{border:1px solid rgba(26,26,26,.1);background:#ffffffb3;padding:.75rem 1rem;border-radius:999px;cursor:pointer}.preview-tabs .active{background:#111;color:#fff}.preview-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-bottom:1rem}.preview-summary div{display:grid;gap:.25rem;padding:1rem 1.1rem;border-radius:22px;background:#ffffff8c;border:1px solid rgba(17,17,17,.06)}.preview-summary strong{font-size:1.1rem}.preview-summary span{font-size:.84rem;color:#6c604f;text-transform:uppercase;letter-spacing:.08em}.preview-canvas{min-height:calc(100vh - 15rem);padding:1.5rem;border-radius:32px;background:#ffffff73;border:1px solid rgba(17,17,17,.08)}.preview-stage{overflow:auto;padding-bottom:1rem}.preview-stage-inner{width:calc(var(--preview-width) * var(--preview-scale) * 1px);min-height:calc(1120px * var(--preview-scale))}.preview-viewport{width:calc(var(--preview-width) * 1px);min-height:1120px;transform:scale(var(--preview-scale));transform-origin:top left}.preview-frame{color:var(--preview-text);background:var(--preview-background);border-radius:calc(var(--preview-radius) + 12px);padding:calc(var(--preview-spacing) * 1.25);font-family:var(--preview-body-font);font-size:var(--preview-body-size);max-width:var(--preview-container-width);box-shadow:0 24px 70px #2517061f}.preview-frame.boxed{margin:0 auto}.preview-frame.full-width{max-width:100%}.hero-card{padding:calc(var(--preview-spacing) * 1.5);background:linear-gradient(135deg,color-mix(in srgb,var(--preview-primary) 88%,white 12%) 0%,var(--preview-primary) 100%);color:#fff;border-radius:var(--preview-radius)}.hero-kicker{color:#ffffffd9;text-transform:uppercase;letter-spacing:.1em;font-size:.82rem;font-weight:700}.hero-card h1{margin:0 0 1rem;font-family:var(--preview-heading-font);font-size:var(--preview-h1-size);line-height:.95;max-width:11ch}.hero-actions{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.5rem}.primary-action,.secondary-action{border:0;border-radius:999px;padding:.9rem 1.2rem;cursor:pointer}.primary-action{background:#fff;color:var(--preview-primary)}.secondary-action{background:color-mix(in srgb,var(--preview-secondary) 86%,white 14%);color:#111}.preview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--preview-spacing);margin-top:var(--preview-spacing)}.preview-card{padding:1.4rem;background:#ffffffb3;border-radius:var(--preview-radius)}.preview-card h3{margin-top:0;font-family:var(--preview-heading-font)}.tablet .preview-grid,.mobile .preview-grid{grid-template-columns:1fr}@media (max-width: 1100px){.app-shell{grid-template-columns:1fr}.preview-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 720px){.sidebar,.preview-area{padding:1.25rem}.toolbar-row{grid-template-columns:1fr}.preview-header{display:grid;align-items:start}.preview-summary,.preview-grid,.color-field{grid-template-columns:1fr}}@media (max-width: 520px){.hero-card h1{max-width:none}.preview-tabs{gap:.45rem}.preview-tabs button{padding:.65rem .9rem}}