/* Pro v2.0 */
:root { --ev-radius: 16px; --ev-gap: 1rem; --ev-bg: rgba(255,255,255,0.88); --ev-blur: 14px; --ev-border: rgba(0,0,0,0.06); }
.echt-viewer-btn.premium { display:inline-flex; align-items:center; gap:.6rem; padding:.8rem 1.1rem; border-radius:12px; border:1px solid var(--ev-border); background: linear-gradient(180deg, #121826, #0b0f1b); color:#fff; font-weight:700; box-shadow: 0 6px 18px rgba(17,24,39,.25), inset 0 1px 0 rgba(255,255,255,.05); transition: transform .08s ease, box-shadow .2s ease; }
.echt-viewer-btn.premium:hover { transform: translateY(-1px); box-shadow: 0 10px 26px rgba(17,24,39,.35), inset 0 1px 0 rgba(255,255,255,.05); }
#echt-viewer-overlay { position:fixed; inset:0; background:rgba(0,0,0,.45); opacity:0; pointer-events:none; transition:opacity .2s ease; z-index:99998; }
#echt-viewer-overlay.is-open { opacity:1; pointer-events:auto; }
#echt-viewer-modal { position:fixed; inset:auto 0 0 0; max-width:980px; margin:5vh auto 0; background: var(--ev-bg); -webkit-backdrop-filter: blur(var(--ev-blur)); backdrop-filter: blur(var(--ev-blur)); border:1px solid var(--ev-border); border-radius: var(--ev-radius); box-shadow: 0 20px 60px rgba(0,0,0,.35); padding: 0; z-index:99999; transform:translateY(20px); opacity:0; pointer-events:none; transition:all .18s ease; }
#echt-viewer-modal.is-open { transform:translateY(0); opacity:1; pointer-events:auto; }
.echt-modal-head { display:flex; align-items:center; justify-content:space-between; gap:var(--ev-gap); padding:.9rem 1rem; border-bottom:1px solid var(--ev-border); background: linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,.35)); border-top-left-radius: var(--ev-radius); border-top-right-radius: var(--ev-radius); }
.echt-modal-body { display:grid; grid-template-columns: 1fr 360px; gap: var(--ev-gap); padding: 1rem; }
.echt-modal-actions { display:flex; align-items:center; gap:.6rem; }
#echt-close { background:transparent; border:0; font-size:1.4rem; cursor:pointer; }
#echt-viewer-stage { position:relative; min-height:460px; background:#0b0f1b; border-radius:12px; overflow:hidden; border:1px solid rgba(255,255,255,.08); }
#echt-bg-preview { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:none; opacity:.85; }
#echt-status { font-size:.95rem; color:#374151; }
#echt-side-card { border:1px solid var(--ev-border); border-radius:12px; padding:1rem; background: linear-gradient(180deg, rgba(255,255,255,.75), rgba(255,255,255,.55)); }
#echt-generate { width:100%; padding:.8rem 1rem; border-radius:10px; border:0; cursor:pointer; background: linear-gradient(180deg, #0ea5e9, #0284c7); color:#fff; font-weight:700; }
#echt-generate[disabled] { opacity:.65; cursor:progress; }
#echt-save { padding:.6rem .9rem; border-radius:8px; }
@keyframes evPulse { 0%{opacity:.6} 50%{opacity:1} 100%{opacity:.6} }
.echt-skeleton { position:absolute; inset:0; background:linear-gradient(90deg, rgba(255,255,255,.06), rgba(255,255,255,.1), rgba(255,255,255,.06)); animation: evPulse 1.8s infinite ease-in-out; }
@media (max-width: 980px){ #echt-viewer-modal { inset: 0 0 0 0; margin:0; border-radius:0; } .echt-modal-body { grid-template-columns: 1fr; } }
.echt-no-scroll { overflow:hidden; }
