html,body{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff;color:#171717;overflow-x:hidden}.template-preview-page{min-height:100vh;background:linear-gradient(180deg,#f4f5f8,#e9ecf2);color:#13151a;font-family:Inter,ui-sans-serif,system-ui,sans-serif}.template-preview-page.is-compact-view{padding-bottom:calc(7.5rem + env(safe-area-inset-bottom))}.template-preview-shell{width:100%;margin:0;padding:0;min-height:100vh;display:flex;flex-direction:column}.template-preview-header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:1rem;row-gap:.75rem;padding:.85rem 1rem;border-bottom:1px solid rgba(255,255,255,.1);background:linear-gradient(135deg,#1e1f20,#252627)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border-width:0}.template-preview-title{margin:0;font-family:Epilogue,Inter,ui-sans-serif,system-ui,sans-serif;font-size:clamp(1rem,1.7vw,1.28rem);font-weight:700;letter-spacing:-.03em;line-height:1.1;color:#f3f6fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:none;min-width:0}.template-preview-header-mobile{display:flex;align-items:center;gap:.8rem}.template-preview-mobile-title{flex:1;font-size:.98rem;white-space:nowrap}.template-preview-mobile-back{appearance:none;border:0;background:transparent;color:#f3f6fb;display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;border-radius:999px;cursor:pointer;transition:background-color .14s ease,transform .14s ease}.template-preview-mobile-back:hover{background:#f3f6fb1a}.template-preview-mobile-back:active{transform:scale(.98)}.template-preview-mobile-back:focus-visible{outline:none;box-shadow:0 0 0 2px #0f131a80,0 0 0 5px #f3f6fb73}.template-preview-mobile-back-arrow{font-size:1.2rem;line-height:1}.template-preview-subtitle{margin:.35rem 0 0;color:#58606a;font-size:.92rem}.template-preview-controls{display:flex;align-items:center;flex-wrap:nowrap;justify-content:flex-end;justify-self:end;gap:.5rem}.template-preview-actions{display:flex;align-items:center;flex-wrap:nowrap;gap:.5rem}.template-preview-btn{border:1px solid rgba(243,246,251,.8);color:#f3f6fb;text-decoration:none;text-transform:uppercase;letter-spacing:.08em;font-size:.64rem;padding:.36rem .66rem;border-radius:999px;font-weight:600;white-space:nowrap;line-height:1;display:inline-flex;cursor:pointer;align-items:center;justify-content:center;min-height:2.35rem;gap:.32rem;transition:transform .14s ease,background-color .14s ease,color .14s ease,box-shadow .14s ease;transform:translateZ(0)}.template-preview-back-btn{position:relative;overflow:hidden;box-shadow:0 0 #f3f6fb00;color:#0e1118}.template-preview-cta-btn{border-color:#c7f1e6;background:#c7f1e6;color:#0f131a;box-shadow:0 12px 28px -20px #78e1c4bf}.template-preview-cta-btn:hover{background:#ddf8f0;border-color:#ddf8f0;color:#0f131a}.template-preview-back-btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px -12px #f3f6fbcc;color:#fff}.template-preview-back-btn:active{transform:translateY(0)}.template-preview-btn:focus-visible,.template-preview-back-btn:focus-visible{outline:none;box-shadow:0 0 0 2px #0f131a80,0 0 0 5px #f3f6fb73}.template-preview-back-btn:hover,.template-preview-btn:hover{background:#f3f6fb;color:#0f131a}.template-preview-back-arrow{display:inline-flex;align-items:center;transition:transform .14s ease}.template-preview-back-btn:hover .template-preview-back-arrow{transform:translate(-1px)}.template-preview-toggle{display:inline-flex;border:1px solid rgba(243,246,251,.8);border-radius:999px;overflow:hidden;background:transparent}.template-preview-toggle-btn{appearance:none;border:0;background:transparent;color:#f3f6fb;cursor:pointer;display:grid;place-items:center;width:40px;height:34px;padding:0;transition:background-color .16s ease,color .16s ease,transform .16s ease}.template-preview-toggle-btn.is-active{background:#f3f6fb;color:#0f131a}.template-preview-toggle-btn:hover{background:#f3f6fb1f}.template-preview-toggle-btn.is-active:hover{background:#f3f6fb}.template-preview-frame-wrap{border:1px solid rgba(30,34,41,.2);border-radius:0;border-left:0;border-right:0;border-bottom:0;background:#fff;box-shadow:none;min-height:0;flex:1;padding:0}.template-preview-frame-wrap.is-desktop .template-preview-device{width:100%;border-radius:0;overflow:hidden}.template-preview-frame-wrap.is-mobile{display:flex;align-items:flex-start;justify-content:center;padding:clamp(.9rem,2vw,1.5rem);background:radial-gradient(circle at top right,rgba(13,16,23,.12),transparent 60%),linear-gradient(180deg,#f8f9fb,#eef1f6)}.template-preview-frame-wrap.is-mobile .template-preview-device{width:min(390px,100%);border:10px solid #11151b;border-radius:28px;overflow:hidden;margin:0 auto;box-shadow:0 24px 50px -20px #080a0e73}.template-preview-frame-wrap.is-mobile .template-preview-device:before{content:"";display:block;width:42%;max-width:160px;height:16px;margin:10px auto 6px;border-radius:999px;background:#0e1118}.template-preview-frame{width:100%;height:calc(100vh - 52px);height:calc(100dvh - 52px);border:0;display:block}.template-preview-inline-error{display:flex;align-items:center;justify-content:space-between;gap:.6rem;font-size:.8rem;color:#f8d2d2;background:#5b1515;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);padding:.55rem .75rem}.template-preview-inline-retry-btn{border:1px solid rgba(248,210,210,.7);border-radius:999px;background:transparent;color:#f8d2d2;text-transform:uppercase;letter-spacing:.08em;font-size:.62rem;padding:.3rem .54rem;font-weight:600;cursor:pointer}.template-preview-status{min-height:calc(100vh - 52px);min-height:calc(100dvh - 52px);display:grid;place-items:center;padding:1.25rem}.template-preview-status-card{width:min(420px,100%);background:#fff;border:1px solid rgba(30,34,41,.14);border-radius:14px;box-shadow:0 18px 42px -28px #080a0e80;padding:1rem}.template-preview-status-card.is-error{border-color:#a0222259}.template-preview-status-card p{margin:0;color:#1d2530;font-size:.93rem;line-height:1.45}.template-preview-retry-btn{margin-top:.85rem;border:0;background:#0f131a;color:#f3f6fb;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:.48rem .82rem;cursor:pointer;font-weight:600}.template-preview-loading{position:absolute;top:16px;left:16px;z-index:3;color:#f3f6fb;background:#0f131ad1;border:1px solid rgba(243,246,251,.25);font-size:.67rem;text-transform:uppercase;letter-spacing:.1em;padding:.42rem .66rem;border-radius:999px}.template-preview-device{position:relative}.template-preview-frame-wrap.is-devtools-open .template-preview-frame{filter:blur(8px);pointer-events:none}.template-preview-devtools-warning{position:absolute;inset:0;z-index:4;display:grid;place-items:center;background:#080a0ed6;color:#f3f6fb;text-align:center;font-size:.9rem;letter-spacing:.01em;padding:1rem}.template-preview-frame-wrap.is-mobile .template-preview-frame{height:min(812px,calc(100vh - 118px));height:min(812px,calc(100dvh - 118px))}.template-preview-mobile-cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:.75rem 1rem calc(.85rem + env(safe-area-inset-bottom));background:#0d1017;border-top:1px solid rgba(255,255,255,.07);box-shadow:0 -8px 32px -4px #00000073}.template-preview-mobile-cta-inner{display:flex;flex-direction:column;gap:.6rem;width:min(100%,34rem);margin:0 auto}.template-preview-mobile-cta-nav{display:flex;align-items:center;gap:.65rem;min-width:0}.template-preview-mobile-cta-back{appearance:none;border:0;background:#f3f6fb1a;color:#f3f6fbbf;display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .65rem .3rem .5rem;border-radius:999px;cursor:pointer;font-size:.72rem;font-weight:600;letter-spacing:.01em;white-space:nowrap;flex-shrink:0;transition:background .14s ease,color .14s ease}.template-preview-mobile-cta-back:active{background:#f3f6fb29;color:#f3f6fb}.template-preview-mobile-cta-title{margin:0;font-family:Epilogue,Inter,ui-sans-serif,system-ui,sans-serif;font-size:.85rem;font-weight:700;letter-spacing:-.02em;color:#f3f6fbeb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.template-preview-mobile-cta-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:3rem;padding:0 1.25rem;border-radius:14px;text-decoration:none;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:#09120e;background:linear-gradient(160deg,#c8fce8,#96edc7);border:1px solid rgba(255,255,255,.5);box-shadow:0 1px #ffffff73 inset,0 12px 32px -12px #50c8968c;transition:opacity .12s ease,transform .12s ease}.template-preview-mobile-cta-btn:active{opacity:.88;transform:scale(.985)}@media(max-width:780px){body{background:#0d1017}.template-preview-page.is-compact-view{height:100dvh;overflow:hidden;padding-bottom:0}.is-compact-view .template-preview-shell{min-height:unset;height:100dvh;overflow:hidden}.template-preview-frame-wrap.is-mobile .template-preview-device{width:100%;border:0;border-radius:0;margin:0;box-shadow:none;overflow:hidden}.template-preview-frame-wrap.is-mobile{padding:0;background:#0d1017;overflow:hidden}.template-preview-frame-wrap.is-mobile .template-preview-device:before{display:none}.template-preview-frame-wrap.is-mobile .template-preview-frame,.template-preview-frame{height:calc(100dvh - 7.5rem - env(safe-area-inset-bottom))}}