.site-editor{margin:22px 0;padding:16px;border:1px solid var(--line);border-radius:10px}
.site-editor>summary{font-size:15px}
.site-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.85fr);gap:22px;align-items:start}
.site-editor fieldset{display:grid;gap:12px;margin:0;padding:15px;border:1px solid var(--line);border-radius:9px}
.site-editor legend{padding:0 6px;color:var(--green);font-weight:850}
.color-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.color-grid input{height:42px;padding:4px}
.site-live-preview{--preview-brand:#1e6b50;--preview-paper:#fbfaf5;--preview-ink:#17231d;position:sticky;top:88px;height:auto;display:block;padding:18px;border:1px solid var(--line);border-radius:13px;background:var(--preview-paper);color:var(--preview-ink);box-shadow:var(--shadow)}
.site-live-preview>small{color:var(--preview-brand);font-weight:850;text-transform:uppercase;letter-spacing:.12em}
.site-live-preview>header{margin:10px 0 28px;font-weight:850}
.site-live-preview h3{margin:0 0 8px;font:600 30px/1.05 Georgia,serif}
.site-live-preview p{color:inherit;opacity:.7}
.preview-posts{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:8px;margin:22px 0}
.preview-posts article{display:grid;align-content:start;gap:7px;min-height:145px;padding:13px;border:1px solid color-mix(in srgb,var(--preview-ink) 15%,transparent);border-radius:10px;background:#fff}
.preview-posts article:first-child{background:var(--preview-brand);color:#fff}
.preview-posts span{font-size:9px;opacity:.75}
.site-live-preview>footer{padding-top:14px;border-top:1px solid color-mix(in srgb,var(--preview-ink) 15%,transparent);font-size:10px;opacity:.7}
.site-live-preview[data-font="sans"] h3,.site-live-preview[data-font="sans"] header{font-family:system-ui,sans-serif}
.site-live-preview[data-font="rounded"] h3,.site-live-preview[data-font="rounded"] header{font-family:"Trebuchet MS",system-ui,sans-serif}
.site-live-preview[data-layout="cards"] .preview-posts{grid-template-columns:repeat(3,1fr)}
.site-live-preview[data-layout="cards"] .preview-posts article:first-child{border-top:5px solid var(--preview-brand);background:#fff;color:inherit}
.site-live-preview[data-layout="minimal"] .preview-posts{grid-template-columns:1fr}
.site-live-preview[data-layout="minimal"] .preview-posts article{min-height:0;border-width:0 0 1px;border-radius:0;background:transparent;color:inherit}
@media(max-width:1000px){.site-editor-grid{grid-template-columns:1fr}.site-live-preview{position:static}}
@media(max-width:600px){.color-grid,.preview-posts,.site-live-preview[data-layout="cards"] .preview-posts{grid-template-columns:1fr}}