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,Plus Jakarta Sans,ui-sans-serif,system-ui,sans-serif}.template-preview-shell{width:100%;margin:0;padding:0;min-height:100vh;display:flex;flex-direction:column}.template-preview-header{display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.5rem 1rem;border-bottom:1px solid rgba(255,255,255,.14);background:#0f131a}.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-size:clamp(.95rem,1.5vw,1.2rem);letter-spacing:-.02em;color:#f3f6fb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(58vw,420px)}.template-preview-subtitle{margin:.35rem 0 0;color:#58606a;font-size:.92rem}.template-preview-controls{display:flex;align-items:center;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;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-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:5px;overflow:hidden;background:transparent}.template-preview-toggle-btn{appearance:none;border:0;background:transparent;color:#f3f6fb;cursor:pointer;display:grid;place-items:center;width:36px;height:30px;padding:0}.template-preview-toggle-btn.is-active{background:#f3f6fb;color:#0f131a}.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;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;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 - 84px));height:min(812px,calc(100dvh - 84px))}@media(max-width:780px){.template-preview-header{flex-wrap:wrap;align-items:flex-start;padding:.55rem .75rem}.template-preview-controls{margin-left:auto;justify-content:flex-end}.template-preview-btn{text-align:center;font-size:.68rem;padding:.42rem .72rem}.template-preview-title{max-width:100%;font-size:1rem;white-space:normal}.template-preview-frame-wrap.is-mobile .template-preview-device{width:min(390px,calc(100% - 1rem))}.template-preview-toggle{display:none}}