diff --git a/src/styles.css b/src/styles.css
new file mode 100644
index 0000000..36fca84
--- /dev/null
+++ b/src/styles.css
@@ -0,0 +1 @@
+*{box-sizing:border-box}html{background:#f3f6f8;color:#152033;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{margin:0;min-width:320px}button,input,textarea{font:inherit}button{cursor:pointer}.app{min-height:100dvh;max-width:1100px;margin:0 auto;background:#f7f9fb}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:max(14px,env(safe-area-inset-top)) 16px 12px;background:rgba(247,249,251,.94);backdrop-filter:blur(14px);border-bottom:1px solid #e3e8ef}.topbar.landing{position:relative;justify-content:space-between;border:0;padding-top:max(24px,env(safe-area-inset-top))}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.16em;color:#6a7280}.topbar h1{margin:3px 0 0;font-size:28px;letter-spacing:-.04em}.circle{width:42px;height:42px;border:1px solid #d8dee8;border-radius:999px;background:white;font-size:21px;color:#1c2737}.circle.primary,.button.primary,.publish-button{background:#111827;color:white;border-color:#111827}.intro{padding:0 16px 14px;color:#596579;max-width:560px}.intro p{margin:0;font-size:16px;line-height:1.55}.template-list{display:grid;gap:10px;padding:8px 16px 90px}.template-card{text-align:left;border:1px solid #e0e6ed;background:white;border-radius:17px;padding:16px;display:grid;gap:7px;color:#152033;box-shadow:0 2px 10px rgba(15,23,42,.03)}.template-card strong{font-size:17px}.type-badge{justify-self:start;padding:4px 8px;border-radius:999px;font-size:11px;text-transform:uppercase;font-weight:800;letter-spacing:.06em;background:#eaf2ff;color:#315fa8}.type-badge.email{background:#eef9f0;color:#347549}.muted{color:#748094;font-size:13px}.empty{padding:32px 20px;text-align:center;color:#7a8596}.account-row{position:fixed;left:0;right:0;bottom:0;max-width:1100px;margin:auto;display:flex;justify-content:space-between;align-items:center;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(255,255,255,.96);border-top:1px solid #e4e9ef;font-size:13px;color:#697588}.account-row a{color:#334155;text-decoration:none;font-weight:700}.error-banner{margin:8px 16px;padding:11px 13px;background:#fff1f2;color:#a1122d;border:1px solid #fecdd3;border-radius:12px;font-size:13px}.error-banner.inline{margin-top:12px}.editor-topbar{display:grid;grid-template-columns:42px minmax(0,1fr) auto}.title-stack{min-width:0;display:grid}.title-stack strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.save-state{font-size:11px;color:#7b8697}.save-state.offline{color:#9a6700}.publish-button{border:0;border-radius:10px;padding:9px 11px;font-size:12px;font-weight:800}.canvas{padding:18px 14px 110px;display:grid;gap:10px;max-width:720px;margin:auto}.canvas-label{font-size:10px;letter-spacing:.16em;font-weight:800;color:#8a94a3;padding:0 4px}.block-card{position:relative;display:grid;gap:4px;text-align:left;padding:15px 42px 15px 15px;background:white;border:1px solid #dfe5ec;border-radius:15px;color:#172033;min-height:72px}.block-card.selected{border-color:#111827;box-shadow:0 0 0 2px rgba(17,24,39,.06)}.block-type{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#8993a2;font-weight:800}.block-card strong{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.block-index{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:11px;color:#a0a8b4}.add-block{border:1.5px dashed #c9d1dc;border-radius:15px;background:transparent;padding:17px;color:#536072;font-weight:800}.center{text-align:center}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;max-width:1100px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:rgba(255,255,255,.97);border-top:1px solid #dfe5ec;box-shadow:0 -7px 20px rgba(15,23,42,.05)}.bottom-nav button{display:grid;place-items:center;gap:2px;border:0;background:transparent;color:#778395;font-size:11px;font-weight:700;padding:5px}.bottom-nav button span{font-size:17px}.bottom-nav button.active{color:#111827}.sheet-backdrop{position:fixed;inset:0;z-index:50;background:rgba(15,23,42,.35);display:flex;align-items:flex-end;justify-content:center}.sheet-backdrop.light{background:rgba(15,23,42,.2)}.sheet{width:100%;max-width:720px;max-height:88dvh;overflow:auto;background:white;border-radius:22px 22px 0 0;padding:10px 16px calc(18px + env(safe-area-inset-bottom));box-shadow:0 -12px 40px rgba(15,23,42,.15)}.sheet.compact{max-width:520px}.grabber{width:42px;height:5px;background:#d7dde5;border-radius:999px;margin:0 auto 14px}.sheet h2{margin:0 0 16px;font-size:21px}.sheet h3{font-size:13px;margin:18px 0 8px}.sheet label{display:grid;gap:7px;font-size:12px;font-weight:800;color:#596579;margin-bottom:12px}.sheet input,.sheet textarea,.json-editor{width:100%;border:1px solid #d4dbe4;border-radius:11px;background:white;color:#182235;padding:11px 12px;outline:none}.sheet textarea{min-height:90px;resize:vertical}.sheet input:focus,.sheet textarea:focus,.json-editor:focus{border-color:#111827;box-shadow:0 0 0 3px rgba(17,24,39,.06)}.segmented{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;background:#eef2f5;padding:4px;border-radius:12px;margin-bottom:14px}.segmented button{border:0;background:transparent;border-radius:9px;padding:9px;color:#647083;font-weight:800}.segmented button.active{background:white;color:#111827;box-shadow:0 1px 5px rgba(15,23,42,.08)}.segmented.small{margin:0;max-width:230px}.button{border:1px solid #d9dfe7;background:white;border-radius:10px;padding:10px 13px;font-weight:800;color:#293548}.button.full{width:100%}.block-picker{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.block-picker button{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #dfe5ec;background:#fafbfd;border-radius:13px;padding:13px;color:#263348;font-weight:800}.picker-icon{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:white;border:1px solid #e1e6ec;color:#475569}.sheet-title-row{display:flex;align-items:center;justify-content:space-between}.text-button{border:0;background:transparent;color:#1f4f93;font-weight:800}.block-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:18px}.block-actions button{border:1px solid #dce2ea;background:#f8fafc;border-radius:10px;padding:10px;color:#3d4b60}.danger-link{width:100%;border:0;background:transparent;color:#b42336;padding:14px;font-weight:800}.binding-chips{display:flex;gap:7px;flex-wrap:wrap}.binding-chips button{border:1px solid #dbe2ea;background:#f8fafc;border-radius:999px;padding:6px 9px;font-size:11px;color:#42506a}.preview-panel,.data-panel{padding:16px 14px 110px;max-width:900px;margin:auto}.preview-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.preview-frame-wrap{margin:auto;background:#cbd3dd;border-radius:18px;padding:10px;transition:max-width .2s ease}.preview-frame-wrap.mobile{max-width:420px}.preview-frame-wrap.desktop{max-width:880px}.preview-frame-wrap iframe{display:block;width:100%;height:68dvh;border:0;border-radius:10px;background:white}.preview-panel>.button{margin-top:12px}.data-panel h2{margin:2px 0 4px}.json-editor{min-height:46dvh;margin:14px 0 10px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;resize:vertical}.binding-list{display:grid;gap:7px}.binding-list code{padding:8px 10px;background:white;border:1px solid #dfe5ec;border-radius:9px;font-size:11px;overflow:auto}@media(min-width:760px){.app{min-height:100vh;border-left:1px solid #e5e9ef;border-right:1px solid #e5e9ef}.template-list{grid-template-columns:repeat(2,minmax(0,1fr))}.sheet-backdrop{align-items:center;padding:24px}.sheet{border-radius:22px;max-height:82vh}.canvas{padding-top:26px}.block-picker{grid-template-columns:repeat(3,1fr)}}@media(min-width:1050px){.template-list{grid-template-columns:repeat(3,minmax(0,1fr))}}