@font-face{font-family:Vazirmatn;src:local("Vazirmatn"),local("Vazir");font-display:swap}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}
body.atlas-template-preview{overflow-x:hidden;background:#0b1427;color:#fff;font-family:Vazirmatn,Tahoma,sans-serif}
.template-preview-app{min-height:100dvh;background:radial-gradient(circle at 16% 10%,#e8463c2c,transparent 28%),radial-gradient(circle at 74% 72%,#dca55c22,transparent 32%),#0b1427}
.template-preview-header{position:relative;z-index:20;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:32px;height:78px;padding:10px max(24px,calc((100vw - 1380px)/2));border-bottom:1px solid #ffffff16;background:#0b1427d9;backdrop-filter:blur(16px)}
.template-preview-brand{display:flex;align-items:center;gap:9px;color:#fff;text-decoration:none}.template-preview-brand>b{display:grid;place-items:center;width:43px;height:43px;background:#eb493f;font:900 1.25rem Arial}.template-preview-brand>span{font:900 .86rem Arial;letter-spacing:.12em}.template-preview-brand small{display:block;color:#aab5c8;font-size:.48rem;letter-spacing:.19em}
.template-preview-header nav{display:flex;justify-content:center;gap:9px;color:#8490a5;font-size:.67rem}.template-preview-header nav a{color:#b8c1d1;text-decoration:none}.template-preview-edit{min-height:42px;display:flex;align-items:center;gap:10px;padding:0 16px;border-radius:10px;background:#e8463c;color:#fff;text-decoration:none;font-size:.72rem;font-weight:900}
.template-preview-layout{width:min(1380px,calc(100% - 48px));min-height:calc(100dvh - 78px);display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,390px);direction:ltr;margin:auto}
.template-preview-stage{position:relative;display:grid;place-items:center;min-width:0;overflow:hidden;isolation:isolate}.template-preview-stage:before{position:absolute;inset:8% 6%;content:"";border:1px solid #ffffff12;border-radius:50%;background:radial-gradient(circle,#ffffff0a,transparent 65%)}
.template-preview-scene{position:relative;z-index:3;width:min(760px,94%);height:min(680px,calc(100dvh - 150px));min-height:520px;overflow:hidden;border:1px solid #ffffff20;border-radius:28px;box-shadow:0 42px 110px #0007}.template-preview-scene.atlas-envelope-scene{background-color:#e9dfd2}.template-preview-sequence{position:absolute;z-index:12;bottom:19px;left:50%;display:flex;gap:5px;padding:5px;border:1px solid #ffffff21;border-radius:999px;background:#071225c9;backdrop-filter:blur(12px);transform:translateX(-50%)}.template-preview-sequence span{display:flex;align-items:center;gap:5px;padding:5px 9px;color:#b7c0d0;font-size:.56rem;white-space:nowrap}.template-preview-sequence b{display:grid;place-items:center;width:23px;height:23px;border-radius:50%;background:#ffffff10;color:#ff6b63;font:800 .52rem Arial}.template-preview-error{height:100%;display:grid;place-content:center;gap:6px;text-align:center}.template-preview-error span{color:#738096;font-size:.7rem}
.template-preview-orbit{position:absolute;border:1px solid #ffffff12;border-radius:50%;animation:preview-orbit 18s linear infinite}.orbit-one{width:640px;height:640px}.orbit-two{width:820px;height:320px;transform:rotate(-22deg);animation-direction:reverse;animation-duration:24s}
.template-preview-particles i{position:absolute;width:5px;height:5px;border-radius:50%;background:#f6c982;box-shadow:0 0 14px #f7c775;opacity:.45}.template-preview-particles i:nth-child(1){top:19%;left:18%}.template-preview-particles i:nth-child(2){top:32%;right:15%}.template-preview-particles i:nth-child(3){bottom:18%;left:26%}.template-preview-particles i:nth-child(4){top:13%;right:32%}.template-preview-particles i:nth-child(5){bottom:27%;right:18%}.template-preview-particles i:nth-child(6){top:58%;left:11%}
.template-preview-device{position:relative;z-index:4;width:min(370px,42vw,calc((100dvh - 125px)*.53));padding:10px;border:1px solid #ffffff2b;border-radius:40px;background:#030915;box-shadow:0 42px 100px #000a,0 0 0 6px #ffffff0b;transform:translateY(10px)}.template-preview-device:after{position:absolute;top:22%;right:-5px;width:3px;height:78px;content:"";border-radius:2px;background:#455069}
.template-preview-device-bar{height:28px;display:flex;align-items:center;justify-content:space-between;padding:0 11px;color:#cbd2df;font:700 .56rem Arial}.template-preview-device-bar i{width:68px;height:18px;border-radius:99px;background:#111827}
.template-preview-screen{position:relative;aspect-ratio:9/16;overflow:hidden;border-radius:29px;background:#fff}.template-preview-canvas{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;background-position:center;background-size:cover;isolation:isolate}
.template-preview-canvas .designer-element{position:absolute;display:flex;align-items:center;justify-content:center;box-sizing:border-box;overflow:hidden;line-height:1.45;white-space:pre-wrap;opacity:1}.template-preview-canvas .designer-element.is-image img{width:100%;height:100%;object-fit:cover}.template-preview-screen video{position:absolute;z-index:6;inset:0;width:100%;height:100%;object-fit:cover;background:#0b1427}
.template-preview-light{position:absolute;z-index:8;top:-25%;bottom:-25%;left:-55%;width:34%;background:linear-gradient(90deg,transparent,#fff6,transparent);transform:rotate(16deg);pointer-events:none}
.template-preview-open{position:absolute;z-index:12;right:24px;bottom:24px;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid #ffffff32;border-radius:12px;background:#0b1427df;color:#fff;font:inherit;box-shadow:0 20px 60px #0008;backdrop-filter:blur(12px);cursor:pointer;transition:.25s}.template-preview-open:hover{transform:translateY(-3px);border-color:#f05c54}.template-preview-open-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#e8463c}.template-preview-open b{font-size:.68rem}.template-preview-open small{display:none}.is-opened .template-preview-open{opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none}.is-error .template-preview-open{opacity:1;visibility:visible;pointer-events:auto}
.template-preview-info{direction:rtl;align-self:center;padding:45px 0 45px 45px}.template-preview-kicker{color:#ff6860;font-size:.67rem;font-weight:900}.template-preview-info h1{margin:9px 0 13px;font-size:clamp(2rem,3.3vw,3.6rem);line-height:1.12;letter-spacing:-.045em}.template-preview-info>p{margin:0;color:#adb7c9;font-size:.82rem;line-height:2}
.template-preview-live{display:grid;grid-template-columns:auto 1fr;gap:11px;margin:26px 0;padding:16px 0;border-block:1px solid #ffffff17}.template-preview-live>i{width:9px;height:9px;margin-top:6px;border-radius:50%;background:#35c781;box-shadow:0 0 0 6px #35c7811c}.template-preview-live span{display:grid;gap:3px}.template-preview-live b{font-size:.73rem}.template-preview-live small{color:#8995a9;font-size:.62rem;line-height:1.7}
.template-preview-controls{display:flex;gap:8px}.template-preview-controls button{min-height:41px;padding:0 13px;border:1px solid #ffffff20;border-radius:9px;background:#ffffff0b;color:#dce2ec;font:700 .67rem Vazirmatn;cursor:pointer}.template-preview-controls button:hover{border-color:#ffffff45;background:#ffffff12}.template-preview-controls span{margin-left:5px;font:700 .85rem Arial}
.template-preview-actions{display:grid;gap:8px;margin-top:28px}.template-preview-actions a{min-height:48px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid #ffffff26;border-radius:10px;color:#fff;text-decoration:none;font-size:.73rem;font-weight:900}.template-preview-actions a.primary{border-color:#e8463c;background:#e8463c}.template-preview-note{display:block;margin-top:14px;color:#778398;font-size:.59rem;line-height:1.8}
.is-playing .template-preview-device{animation:preview-device-in .72s cubic-bezier(.2,.8,.2,1) both}.is-playing .template-preview-canvas{animation:preview-canvas-breathe 8s ease-in-out .5s both}.is-playing .template-preview-canvas .designer-element{animation:preview-element-in .72s cubic-bezier(.2,.75,.2,1) var(--preview-delay,.12s) both}.is-playing .template-preview-light{animation:preview-light 6s ease-in-out 1.2s infinite}.is-playing .template-preview-particles i{animation:preview-particle 4s ease-in-out infinite}.is-paused *{animation-play-state:paused!important}.prefers-reduced-motion *{animation-duration:.01ms!important;animation-iteration-count:1!important}.prefers-reduced-motion .template-preview-canvas .designer-element{opacity:1}
@keyframes preview-device-in{0%{opacity:.45;transform:translateY(30px) scale(.97)}100%{opacity:1;transform:translateY(10px) scale(1)}}@keyframes preview-canvas-breathe{0%{filter:saturate(.82);transform:scale(1.025)}35%,75%{filter:saturate(1);transform:scale(1)}100%{filter:saturate(.94);transform:scale(1.015)}}@keyframes preview-element-in{0%{opacity:.3;clip-path:inset(12% 0 12%);transform:translateY(5px)}100%{opacity:1;clip-path:inset(0 0 0);transform:translateY(0)}}@keyframes preview-light{0%,18%{left:-55%;opacity:0}30%{opacity:.7}50%,100%{left:125%;opacity:0}}@keyframes preview-particle{0%,100%{opacity:.25;translate:0 0}50%{opacity:.9;translate:0 -13px}}@keyframes preview-orbit{to{rotate:360deg}}
@media(max-width:900px){.template-preview-header{grid-template-columns:auto 1fr;gap:16px;padding-inline:16px}.template-preview-header nav{display:none}.template-preview-edit{justify-self:end}.template-preview-layout{width:100%;min-height:calc(100dvh - 78px);grid-template-columns:1fr}.template-preview-stage{min-height:calc(100dvh - 78px);padding:26px 16px}.template-preview-device{width:min(360px,82vw,calc((100dvh - 135px)*.54))}.template-preview-info{padding:45px 22px 65px;background:#101a2e}.template-preview-info h1{font-size:2.25rem}.template-preview-orbit{scale:.72}}
@media(max-width:520px){.template-preview-header{height:68px;display:flex;justify-content:space-between;padding-inline:11px}.template-preview-brand>b{width:38px;height:38px}.template-preview-brand>span{display:none}.template-preview-edit{min-height:39px;padding:0 11px;font-size:.62rem}.template-preview-layout{max-width:100vw;min-height:calc(100dvh - 68px);overflow:hidden}.template-preview-stage{width:100%;max-width:100vw;min-height:calc(100dvh - 68px);padding:12px}.template-preview-device{width:min(330px,85vw,calc((100dvh - 98px)*.54));border-radius:34px}.template-preview-screen{border-radius:25px}.template-preview-open{min-width:175px;padding:15px}.template-preview-info{padding:38px 16px 55px}.template-preview-controls button{flex:1}}
@media(max-width:900px){.template-preview-scene{width:min(720px,94vw);height:min(680px,calc(100dvh - 124px));min-height:520px}.template-preview-sequence{bottom:35px}}
@media(max-width:520px){.template-preview-scene{width:100%;height:calc(100dvh - 94px);min-height:470px;border-radius:22px}.template-preview-sequence{bottom:20px;max-width:92%;overflow:auto}.template-preview-sequence span{padding:4px 6px}.template-preview-sequence span:not(:last-child){font-size:0}.template-preview-sequence b{font-size:.5rem}.template-preview-scene .aes-replay{bottom:66px}}