:root{--bar-height: 64px;--border: #e6e8ec;--text: #172033;--muted: #667085;--surface: #ffffff;--accent: #2563eb;--accent-hover: #1d4ed8}*{box-sizing:border-box}html,body{height:100%}body{background:#f6f5f3;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;margin:0;overflow:hidden;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}.preview-toolbar{align-items:center;background:#ffffffeb;border-bottom:1px solid var(--border);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;height:var(--bar-height);padding:0 24px;position:sticky;top:0;z-index:10;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.toolbar-left,.toolbar-right{align-items:center;display:flex;gap:10px;min-width:0}.toolbar-right{justify-content:flex-end}.back-link,.action-button{align-items:center;border-radius:8px;display:inline-flex;font-size:14px;font-weight:600;gap:8px;height:40px;justify-content:center;text-decoration:none;white-space:nowrap}.back-link{border:1px solid var(--border);color:#344054;flex:0 0 auto;width:40px}.back-link:hover,.action-button.secondary:hover{background:#f9fafb;border-color:#d0d5dd}.brand{align-items:center;display:flex;gap:12px;min-width:0}.brand-logo{display:block;flex:0 0 auto;height:24px;-o-object-fit:contain;object-fit:contain;width:32px}.toolbar-center{justify-self:center;min-width:0}.template-title{color:var(--text);font-size:15px;font-weight:700;display:block;max-width:min(460px,42vw);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.action-button{border:1px solid var(--border);cursor:pointer;padding:0 14px}.action-button.secondary{background:var(--surface);color:#344054}.action-button.primary{background:var(--accent);border-color:var(--accent);color:#fff}.action-button.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}.preview-stage{background:var(--template-bg, #f6f5f3);height:calc(100vh - var(--bar-height));overflow:auto;padding:0;transition:background-color .18s ease}.frame-wrap{align-items:flex-start;display:flex;justify-content:center;min-height:100%}.frame-shell{margin:0 auto;width:var(--frame-width, 600px)}.template-frame{background:var(--template-bg, transparent);border:0;display:block;height:calc(100vh - var(--bar-height));margin:0;width:var(--frame-width, 600px)}.icon{height:16px;width:16px}@media (max-width: 760px){.preview-toolbar{grid-template-columns:auto minmax(0,1fr) auto;height:auto;min-height:var(--bar-height);padding:10px 12px}.template-title{max-width:100%;text-align:center}.toolbar-right{gap:8px}.action-button{padding:0 10px}.action-button span{display:none}}