/* =====================================================================
   Zenvy Aura — design layer
   Palette: #1A1F1D charcoal green · #2E3532 graphite · #F2F2EF off-white
            #D9D6CD stone · #C7E637 lime (accent only, dark text on it)
   ===================================================================== */
:root{
  --z-ink:#1A1F1D;--z-graphite:#2E3532;--z-off:#F2F2EF;--z-stone:#D9D6CD;--z-lime:#C7E637;--z-lime-2:#DDF36B;--z-olive:#5E7012;--z-olive-2:#8DA71C;
  --z-bg:#F5F5F1;--z-card:#FFFFFF;--z-line:#E4E3DD;--z-line-soft:#EEEDE8;--z-text:#1F2421;--z-muted:#6B706C;--z-faint:#9A9E99;
  --z-ok:#1F7A4D;--z-okbg:#EAF6EF;--z-warn:#8A5A00;--z-warnbg:#FFF6DD;--z-danger:#B42318;--z-dangerbg:#FEF1EF;
  --z-r:16px;--z-shadow:0 1px 2px rgba(26,31,29,.04),0 2px 8px rgba(26,31,29,.04);--z-shadow-lg:0 18px 48px rgba(26,31,29,.14),0 3px 8px rgba(26,31,29,.06);
  --z-side:252px;
  /* engine variables, re-pointed to Zenvy */
  --bg:var(--z-bg);--card:#fff;--line:var(--z-line);--line-soft:var(--z-line-soft);--text:var(--z-text);--muted:var(--z-muted);--ink:var(--z-ink);
  --accent:var(--z-lime);--accent-2:var(--z-lime-2);--accent-soft:#F5F9E3;--orange:var(--z-olive);--orange2:var(--z-lime-2);--soft:#F5F9E3;
  --green:var(--z-ok);--greenbg:var(--z-okbg);--danger:var(--z-danger);--dangerbg:var(--z-dangerbg);--r:16px;
  --shadow:var(--z-shadow);--shadow-lg:var(--z-shadow-lg);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;font-family:Manrope,Inter,-apple-system,"Segoe UI",Roboto,system-ui,sans-serif;font-size:14px;line-height:1.5;background:var(--z-bg);color:var(--z-text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}
::selection{background:#E6F3A8;color:var(--z-ink)}
.ic{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
code,pre,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}

/* ---------------------------------------------------------------- shell */
.zv-app{display:grid;grid-template-columns:var(--z-side) minmax(0,1fr);min-height:100vh;background:linear-gradient(to right,var(--z-ink) var(--z-side),var(--z-bg) var(--z-side))}
.zv-side{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px;padding:18px 14px 14px;background:var(--z-ink);color:#C9CEC8;z-index:60;overflow-y:auto;scrollbar-width:none}
.zv-side::-webkit-scrollbar{display:none}
.zv-brand{display:flex;align-items:center;gap:10px;padding:6px 10px 20px;text-decoration:none}
.zv-brand img{height:22px;width:auto;display:block}
.zv-product{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--z-ink);background:var(--z-lime);border-radius:999px;padding:3px 8px 2px}
.zv-nav{display:flex;flex-direction:column;gap:2px;flex:none}
.zv-side .side-label{font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#6F7771;padding:14px 12px 6px;display:block}
.zv-side .side-item{position:relative;display:flex;align-items:center;gap:11px;width:100%;height:38px;padding:0 12px;border:0;border-radius:10px;background:transparent;color:#BFC5BF;font:inherit;font-size:13.5px;font-weight:500;text-decoration:none;cursor:pointer;text-align:left;transition:background .15s,color .15s;flex-direction:row;min-height:0}
.zv-side .side-item span{display:inline;font-size:inherit;white-space:nowrap}
.zv-side .side-item:hover{background:rgba(255,255,255,.06);color:#fff}
.zv-side .side-item.active{background:var(--z-graphite);color:#fff;font-weight:650}
.zv-side .side-item.active::before{content:"";position:absolute;left:-14px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:var(--z-lime)}
.zv-side .side-item.active .ic{color:var(--z-lime)}
.zv-side .side-item:focus-visible{outline:2px solid var(--z-lime);outline-offset:1px}
.zv-user{display:flex;align-items:center;gap:10px;margin-top:18px;padding:10px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}
.zv-avatar{width:32px;height:32px;border-radius:50%;background:var(--z-lime);color:var(--z-ink);display:grid;place-items:center;font-weight:800;font-size:13px;flex:none}
.zv-user-meta{min-width:0;flex:1}.zv-user-meta b{display:block;font-size:12.5px;color:#fff;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.zv-user-meta span{display:block;font-size:11px;color:#8C938D;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zv-logout{color:#8C938D;display:grid;place-items:center;width:30px;height:30px;border-radius:8px}.zv-logout:hover{color:#fff;background:rgba(255,255,255,.08)}
.zv-impersonate{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);z-index:300;background:var(--z-ink);color:#fff;border:1px solid var(--z-lime);border-radius:999px;padding:9px 16px;font-size:12.5px;box-shadow:var(--z-shadow-lg)}
.zv-impersonate a{color:var(--z-lime);font-weight:700;margin-left:6px}

/* ---------------------------------------------------------------- studio (engine) refinements */
.is-studio .app-main{min-width:0;display:flex;flex-direction:column}
.is-studio .topbar{background:rgba(245,245,241,.88)}
.is-studio .topbar h1{font-size:21px;font-weight:750;letter-spacing:-.02em}
.zv-topright{display:flex;align-items:center;gap:10px;min-width:0;max-width:62%;justify-content:flex-end}
.zv-topright .ctx-chip{max-width:none;min-width:0}
.zv-usage{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px 0 8px;border:1px solid var(--z-line);border-radius:999px;background:#fff;font-size:12px;color:var(--z-muted);text-decoration:none;white-space:nowrap;box-shadow:var(--z-shadow)}
.zv-usage b{color:var(--z-ink);font-weight:700}
.zv-usage-ring{width:18px;height:18px;border-radius:50%;background:conic-gradient(var(--z-olive-2) calc(var(--p)*1%),#ECEBE5 0);position:relative;flex:none}
.zv-usage-ring::after{content:"";position:absolute;inset:4px;border-radius:50%;background:#fff}
.is-studio .card{border-radius:18px;border-color:var(--z-line)}
.is-studio .head h2{font-weight:700;font-size:15px}
.is-studio .num{background:#F1F6DC;color:var(--z-olive);font-weight:800}
.is-studio .btn{font-weight:650;border-radius:10px}
.is-studio .btn.primary{background:var(--z-ink);border-color:var(--z-ink)}
.is-studio .btn.primary:hover{background:var(--z-graphite);border-color:var(--z-graphite)}
.is-studio .genbar .btn.primary,#strategyBtn,#adGenerateBtn,#adLandingGenerateBtn,#blogOutlineBtn{background:var(--z-lime)!important;border-color:var(--z-lime)!important;color:var(--z-ink)!important;box-shadow:0 6px 18px rgba(141,167,28,.28),inset 0 1px 0 rgba(255,255,255,.4)!important}
.is-studio .genbar .btn.primary:hover,#strategyBtn:hover,#adGenerateBtn:hover,#adLandingGenerateBtn:hover,#blogOutlineBtn:hover{background:#D4F04A!important}
.is-studio .btn:focus-visible,.is-studio .side-item:focus-visible{outline:2px solid var(--z-olive-2)}
.is-studio input:focus,.is-studio textarea:focus,.is-studio select:focus{border-color:#A9C43A;box-shadow:0 0 0 3px rgba(199,230,55,.32)}
.is-studio .tabbtn.active{border-bottom-color:var(--z-ink)}
.is-studio .pill.active,.is-studio .switch .btn.active{font-weight:700}
.is-studio .tag{background:#F1F6DC;color:#3F4A10}
.is-studio .ad-progress>span{background:linear-gradient(90deg,var(--z-lime),var(--z-olive-2))}
.is-studio .key-banner{background:#F5F9E3;border-color:#D9EA97;color:#3F4A10}
.is-studio .ai-banner{background:#FAFAF7}
.is-studio .role{color:var(--z-olive);background:#F1F6DC}
.is-studio .empty{background:#FAFAF7;border-color:#DCDBD3}
.is-studio .side-badge{background:var(--z-lime)}
.zv-keybox{margin-top:2px}
.zv-keyline{display:flex;align-items:center;flex-wrap:wrap;gap:9px;min-height:44px;padding:8px 10px 8px 12px;border:1px solid var(--z-line);border-radius:12px;background:#FAFAF7;font-size:13px}
.zv-keyline code{font-size:12px;background:#fff;border:1px solid var(--z-line);border-radius:6px;padding:2px 7px}
.zv-keydot{width:8px;height:8px;border-radius:50%;background:var(--z-ok);box-shadow:0 0 0 3px var(--z-okbg)}
.zv-keyline.warn .zv-keydot{background:#D99A00;box-shadow:0 0 0 3px var(--z-warnbg)}
.zv-keymuted{color:var(--z-muted);font-size:12px}
.zv-keyactions{margin-left:auto;display:flex;gap:6px}
.zv-keyform{display:flex;gap:8px}.zv-keyform input{flex:1}
.zv-danger{color:var(--z-danger)!important}
.zv-savebar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:8px;padding:14px 16px;border-radius:14px;background:var(--z-ink);color:#fff}
.zv-savebar b{display:block;font-size:13.5px}.zv-savebar span{display:block;font-size:12px;color:#A9B0AA;margin-top:2px;max-width:560px}
.zv-savebar-actions{display:flex;gap:8px}
.zv-savebar .btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.2)}
.zv-savebar .btn:hover{background:rgba(255,255,255,.08);color:#fff}
.zv-savebar .btn.primary{background:var(--z-lime)!important;border-color:var(--z-lime)!important;color:var(--z-ink)!important}
.zv-libbtn.zv-saved{color:var(--z-ok);border-color:#BFE3CE}
.zv-libbar{display:flex;justify-content:flex-end;margin:10px 0 0}

/* ---------------------------------------------------------------- pages */
.zv-main{min-width:0;display:flex;flex-direction:column}
.zv-top{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 40px 16px;background:rgba(245,245,241,.88);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px)}
.zv-top h1{margin:0;font-size:22px;font-weight:750;letter-spacing:-.02em;color:var(--z-ink)}
.zv-top p{margin:3px 0 0;font-size:13px;color:var(--z-muted)}
.zv-top-actions{display:flex;gap:8px;flex-wrap:wrap}
.zv-content{width:100%;max-width:1160px;margin:0 auto;padding:8px 40px 80px;display:flex;flex-direction:column;gap:18px}
.zv-card{background:var(--z-card);border:1px solid var(--z-line);border-radius:18px;box-shadow:var(--z-shadow)}
.zv-card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;border-bottom:1px solid var(--z-line-soft)}
.zv-card-head h2{margin:0;font-size:15.5px;font-weight:720;letter-spacing:-.01em;color:var(--z-ink)}
.zv-card-head p{margin:3px 0 0;font-size:12.5px;color:var(--z-muted)}
.zv-card-body{padding:20px 22px}
.zv-grid{display:grid;gap:18px}.zv-grid.c2{grid-template-columns:repeat(2,minmax(0,1fr))}.zv-grid.c3{grid-template-columns:repeat(3,minmax(0,1fr))}.zv-grid.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.zv-stat{padding:18px 20px}
.zv-stat span{display:block;font-size:12px;color:var(--z-muted);font-weight:600}
.zv-stat b{display:block;font-size:28px;letter-spacing:-.02em;font-weight:800;color:var(--z-ink);margin-top:4px;line-height:1.1}
.zv-stat small{display:block;font-size:12px;color:var(--z-muted);margin-top:6px}
.zv-stat.dark{background:var(--z-ink);border-color:var(--z-ink)}.zv-stat.dark span,.zv-stat.dark small{color:#A9B0AA}.zv-stat.dark b{color:#fff}
.zv-meter{height:8px;border-radius:99px;background:#ECEBE5;overflow:hidden;margin-top:12px}.zv-meter>i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--z-lime),var(--z-olive-2))}
.zv-stat.dark .zv-meter{background:#2E3532}

.zv-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:0 15px;border:1px solid var(--z-line);border-radius:10px;background:#fff;color:var(--z-ink);font:inherit;font-size:13px;font-weight:650;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .15s,border-color .15s,box-shadow .15s}
.zv-btn:hover{background:#FAFAF7;border-color:#CFCEC6}
.zv-btn:disabled{opacity:.5;cursor:not-allowed}
.zv-btn.dark{background:var(--z-ink);border-color:var(--z-ink);color:#fff}.zv-btn.dark:hover{background:var(--z-graphite)}
.zv-btn.lime{background:var(--z-lime);border-color:var(--z-lime);color:var(--z-ink);box-shadow:0 6px 18px rgba(141,167,28,.25)}.zv-btn.lime:hover{background:#D4F04A}
.zv-btn.ghost{background:transparent;border-color:transparent}.zv-btn.ghost:hover{background:rgba(26,31,29,.05)}
.zv-btn.danger{color:var(--z-danger)}.zv-btn.danger:hover{background:var(--z-dangerbg);border-color:#F4C7C1}
.zv-btn.sm{min-height:32px;padding:0 11px;font-size:12px;border-radius:9px}
.zv-btn .ic{width:16px;height:16px}

.zv-form{display:flex;flex-direction:column;gap:14px}
.zv-row{display:flex;gap:14px;flex-wrap:wrap}.zv-row>.zv-field{flex:1;min-width:200px}
.zv-field label{display:block;font-size:12.5px;font-weight:650;color:#353A36;margin-bottom:6px}
.zv-field .hint,.zv-hint{font-size:12px;color:var(--z-muted);margin-top:6px;line-height:1.5}
.zv-input,.zv-field input,.zv-field select,.zv-field textarea{width:100%;min-height:42px;border:1px solid #DEDDD6;border-radius:11px;background:#fff;color:var(--z-text);padding:10px 13px;font:inherit;font-size:14px;transition:border-color .15s,box-shadow .15s}
.zv-field textarea{min-height:96px;resize:vertical}
.zv-input:focus,.zv-field input:focus,.zv-field select:focus,.zv-field textarea:focus{outline:0;border-color:#A9C43A;box-shadow:0 0 0 3px rgba(199,230,55,.32)}
.zv-field select{appearance:none;padding-right:34px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236B706C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 13px center}
.zv-check{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:500}.zv-check input{width:auto;min-height:0;accent-color:var(--z-ink)}

.zv-flash{padding:12px 16px;border-radius:12px;font-size:13px;border:1px solid}
.zv-flash.ok{background:var(--z-okbg);border-color:#BFE3CE;color:#14532D}
.zv-flash.error{background:var(--z-dangerbg);border-color:#F4C7C1;color:#7A1A12}
.zv-flash.warn{background:var(--z-warnbg);border-color:#F1D9A0;color:#5C3D00}

.zv-badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:700;background:#F0EFE9;color:#3D423E;white-space:nowrap}
.zv-badge.lime{background:var(--z-lime);color:var(--z-ink)}.zv-badge.ok{background:var(--z-okbg);color:var(--z-ok)}.zv-badge.bad{background:var(--z-dangerbg);color:var(--z-danger)}.zv-badge.dark{background:var(--z-ink);color:#fff}
.zv-dot{width:7px;height:7px;border-radius:50%;background:currentColor;display:inline-block}

.zv-table-wrap{overflow-x:auto}
.zv-table{width:100%;border-collapse:collapse;font-size:13px}
.zv-table th{text-align:left;font-size:11.5px;font-weight:700;color:var(--z-muted);text-transform:uppercase;letter-spacing:.05em;padding:12px 22px;border-bottom:1px solid var(--z-line-soft);white-space:nowrap}
.zv-table td{padding:13px 22px;border-bottom:1px solid var(--z-line-soft);vertical-align:middle}
.zv-table tr:last-child td{border-bottom:0}
.zv-table tbody tr:hover td{background:#FBFBF8}
.zv-table td b{font-weight:650;color:var(--z-ink)}
.zv-table small{color:var(--z-muted);display:block;font-size:12px}
.zv-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.zv-inline{display:inline}
.zv-empty{text-align:center;padding:44px 20px;color:var(--z-muted)}
.zv-empty b{display:block;color:var(--z-ink);font-size:15px;margin-bottom:4px}

.zv-code{position:relative;background:var(--z-ink);color:#E9ECE6;border-radius:14px;padding:16px 18px;font-size:12.5px;line-height:1.6;overflow-x:auto;white-space:pre;margin:0}
.zv-code .k{color:var(--z-lime)}
.zv-copy{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);color:#fff;border-radius:8px;padding:5px 9px;font:inherit;font-size:11.5px;font-weight:650;cursor:pointer}
.zv-copy:hover{background:rgba(255,255,255,.16)}
.zv-secret{display:flex;gap:8px;align-items:center;padding:14px;border-radius:14px;background:#F5F9E3;border:1px solid #D9EA97}
.zv-secret code{flex:1;font-size:13px;word-break:break-all;color:#2C350A}

.zv-tabs{display:flex;gap:4px;padding:4px;border-radius:12px;background:#ECEBE5;width:max-content;max-width:100%;overflow-x:auto}
.zv-tabs button{border:0;background:transparent;font:inherit;font-size:13px;font-weight:650;color:var(--z-muted);padding:8px 14px;border-radius:9px;cursor:pointer;white-space:nowrap}
.zv-tabs button.active{background:#fff;color:var(--z-ink);box-shadow:0 1px 3px rgba(26,31,29,.08)}
.zv-tabpanel{display:none}.zv-tabpanel.active{display:block}

.zv-steps{counter-reset:s;display:flex;flex-direction:column;gap:14px;margin:0;padding:0;list-style:none}
.zv-steps>li{counter-increment:s;position:relative;padding-left:40px;font-size:13.5px;line-height:1.6}
.zv-steps>li::before{content:counter(s);position:absolute;left:0;top:0;width:26px;height:26px;border-radius:50%;background:var(--z-ink);color:var(--z-lime);font-size:12px;font-weight:800;display:grid;place-items:center}
.zv-steps b{color:var(--z-ink)}

.zv-tool{display:flex;gap:12px;padding:14px;border:1px solid var(--z-line);border-radius:14px;background:#fff}
.zv-tool-ic{width:36px;height:36px;border-radius:10px;background:#F1F6DC;color:var(--z-olive);display:grid;place-items:center;flex:none}
.zv-tool b{display:block;font-size:13px;font-family:ui-monospace,Menlo,monospace;color:var(--z-ink)}
.zv-tool span{display:block;font-size:12.5px;color:var(--z-muted);margin-top:2px}

/* library */
.zv-lib{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.zv-lib-item{background:#fff;border:1px solid var(--z-line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--z-shadow);transition:transform .15s,box-shadow .15s}
.zv-lib-item:hover{transform:translateY(-2px);box-shadow:var(--z-shadow-lg)}
.zv-lib-thumb{aspect-ratio:4/3;background:#F0EFE9 center/cover no-repeat;display:grid;place-items:center;color:var(--z-muted);text-decoration:none}
.zv-lib-thumb.doc{background:linear-gradient(160deg,#1A1F1D,#2E3532);color:#fff;padding:18px;text-align:left;place-items:end start}
.zv-lib-thumb.doc b{font-size:15px;line-height:1.3;font-weight:700}
.zv-lib-thumb.doc em{font-style:normal;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--z-lime);display:block;margin-bottom:8px}
.zv-lib-meta{padding:12px 14px;display:flex;flex-direction:column;gap:8px;flex:1}
.zv-lib-meta b{font-size:13px;font-weight:650;color:var(--z-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.zv-lib-meta small{font-size:11.5px;color:var(--z-muted)}
.zv-lib-actions{display:flex;gap:6px;margin-top:auto}

/* toasts (pages; the studio brings its own) */
.toasts{position:fixed;right:20px;bottom:20px;z-index:400;display:flex;flex-direction:column;gap:8px;max-width:min(420px,calc(100vw - 40px));pointer-events:none}
.toast{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;padding:12px 12px 12px 14px;background:var(--z-ink);color:#fff;border-radius:12px;box-shadow:var(--z-shadow-lg);font-size:13px;line-height:1.45;opacity:0;transform:translateY(8px);transition:opacity .2s,transform .2s}
.toast.in{opacity:1;transform:none}.toast>div{flex:1}.toast button{border:0;background:transparent;color:#A9ADB3;font-size:17px;line-height:1;cursor:pointer;padding:0 2px}
.toast-dot{width:8px;height:8px;border-radius:50%;margin-top:5px;flex:none;background:#8A8F96}.toast.ok .toast-dot{background:var(--z-lime)}.toast.warn .toast-dot{background:#F5C451}.toast.error .toast-dot{background:#FF6B5E}

/* ---------------------------------------------------------------- auth */
.zv-auth{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.zv-auth-art{position:relative;overflow:hidden;background:var(--z-ink);color:#fff;padding:44px 56px;display:flex;flex-direction:column;justify-content:space-between}
.zv-auth-art img{height:30px;width:auto;display:block;position:relative;z-index:1}
.zv-auth-quote{position:relative;z-index:1;max-width:460px}
.zv-kicker{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--z-ink);background:var(--z-lime);border-radius:999px;padding:4px 10px 3px;margin-bottom:18px}
.zv-auth-quote h2{font-size:44px;line-height:1.08;letter-spacing:-.035em;margin:0 0 16px;font-weight:800}
.zv-auth-quote h2 em{font-style:normal;color:var(--z-lime)}
.zv-auth-quote p{font-size:15px;color:#A9B0AA;margin:0;line-height:1.6}
.zv-orb{position:absolute;width:520px;height:520px;right:-170px;top:-140px;border-radius:50%;background:radial-gradient(circle at 35% 35%,rgba(199,230,55,.55),rgba(199,230,55,.08) 55%,transparent 70%);filter:blur(4px)}
.zv-orb::after{content:"";position:absolute;width:120px;height:120px;border-radius:50%;background:var(--z-lime);left:120px;bottom:-310px;box-shadow:0 0 80px rgba(199,230,55,.5)}
.zv-auth-form{display:grid;place-items:center;padding:40px 24px}
.zv-auth-card{width:100%;max-width:400px;display:flex;flex-direction:column;gap:16px}
.zv-auth-card h1{margin:0;font-size:28px;letter-spacing:-.025em;font-weight:800;color:var(--z-ink)}
.zv-auth-card .lead{margin:-8px 0 6px;color:var(--z-muted);font-size:14px}
.zv-auth-card .zv-btn{min-height:46px;font-size:14px}
.zv-auth-alt{font-size:13px;color:var(--z-muted);text-align:center}.zv-auth-alt a{color:var(--z-ink);font-weight:700}

/* ---------------------------------------------------------------- responsive */
@media (max-width:1100px){.zv-grid.c4{grid-template-columns:repeat(2,minmax(0,1fr))}.zv-grid.c3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1024px){
  :root{--z-side:88px}
  .zv-side{padding:16px 8px}
  .zv-brand{flex-direction:column;gap:6px;padding:4px 0 14px}.zv-brand img{height:16px}
  .zv-side .side-label{display:none}
  .zv-side .side-item{flex-direction:column;justify-content:center;gap:4px;height:auto;min-height:58px;padding:8px 4px;text-align:center}
  .zv-side .side-item span{font-size:10.5px;line-height:1.2;white-space:normal}
  .zv-side .side-item.active::before{left:-8px}
  .zv-user{flex-direction:column;padding:8px 4px}.zv-user-meta{display:none}
  .zv-topright{max-width:70%}
}
@media (max-width:860px){.zv-auth{grid-template-columns:1fr}.zv-auth-art{min-height:260px;padding:28px}.zv-auth-quote h2{font-size:32px}.zv-orb{width:340px;height:340px}}
@media (max-width:760px){
  .zv-app{display:block;background:var(--z-bg)}
  .zv-side{position:sticky;top:0;height:auto;flex-direction:row;align-items:center;padding:8px 10px;gap:6px;overflow-x:auto}
  .zv-brand{flex-direction:row;padding:0 6px 0 2px}.zv-brand img{height:15px}.zv-product{display:none}
  .zv-nav{flex-direction:row;flex:none;gap:2px}
  .zv-side .side-item{width:auto;min-width:68px;min-height:52px;padding:6px}
  .zv-side .side-item span{white-space:nowrap;font-size:10px}
  .zv-side .side-item.active::before{display:none}
  .zv-user{margin:0 0 0 auto;padding:0;background:none;border:0;flex-direction:row}.zv-avatar{display:none}
  .zv-top{position:static;padding:16px;flex-direction:column;align-items:flex-start}
  .zv-content{padding:4px 14px 60px}
  .zv-grid.c2,.zv-grid.c3,.zv-grid.c4{grid-template-columns:1fr}
  .zv-card-head,.zv-card-body{padding-left:16px;padding-right:16px}.zv-table th,.zv-table td{padding-left:16px;padding-right:16px}
  .zv-topright{max-width:100%;flex-wrap:wrap;justify-content:flex-start}
  .zv-keyform{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* engine-style buttons and inputs reused by shared widgets on regular pages */
.is-page .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 14px;border:1px solid var(--z-line);border-radius:10px;background:#fff;color:var(--z-ink);font:inherit;font-size:13px;font-weight:650;cursor:pointer;white-space:nowrap}
.is-page .btn:hover{background:#FAFAF7;border-color:#CFCEC6}
.is-page .btn.primary{background:var(--z-ink);border-color:var(--z-ink);color:#fff}.is-page .btn.primary:hover{background:var(--z-graphite)}
.is-page .btn:disabled{opacity:.5}
.is-page .hint{font-size:12px;color:var(--z-muted);margin-top:6px;line-height:1.5}
.is-page .zv-keyform input{min-height:42px;border:1px solid #DEDDD6;border-radius:11px;padding:10px 13px;font:inherit;font-size:14px}
.is-page .zv-keyform input:focus{outline:0;border-color:#A9C43A;box-shadow:0 0 0 3px rgba(199,230,55,.32)}
.zv-announce{margin:12px 40px 0;padding:10px 16px;border-radius:12px;background:var(--z-ink);color:#E9ECE6;font-size:13px;border-left:4px solid var(--z-lime)}
.zv-announce.warn{background:var(--z-warnbg);color:#5C3D00;border-left-color:#E0A100}
.is-studio .zv-announce{margin:12px max(32px,calc((100% - 1100px)/2 + 32px)) 0}
@media(max-width:760px){.zv-announce,.is-studio .zv-announce{margin:10px 16px 0}}

/* admin */
.zv-admin-nav{display:flex;gap:4px;padding:4px;border-radius:14px;background:#fff;border:1px solid var(--z-line);overflow-x:auto;scrollbar-width:none;box-shadow:var(--z-shadow)}
.zv-admin-nav::-webkit-scrollbar{display:none}
.zv-admin-nav a{display:flex;align-items:center;gap:7px;padding:9px 13px;border-radius:10px;text-decoration:none;font-size:13px;font-weight:650;color:var(--z-muted);white-space:nowrap}
.zv-admin-nav a .ic{width:16px;height:16px}
.zv-admin-nav a:hover{background:#F5F5F1;color:var(--z-ink)}
.zv-admin-nav a.active{background:var(--z-ink);color:#fff}.zv-admin-nav a.active .ic{color:var(--z-lime)}
.zv-bars{display:flex;align-items:flex-end;gap:4px;height:180px;padding-top:6px}
.zv-bar{flex:1;height:100%;display:flex;flex-direction:column-reverse;border-radius:5px;background:#F3F3EE;overflow:hidden;min-width:4px}
.zv-bar i{display:block;width:100%}
.zv-bar:hover{outline:2px solid var(--z-lime)}
.zv-key{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.zv-table a{color:var(--z-ink);text-decoration:none}.zv-table a:hover{text-decoration:underline}
@media(max-width:900px){.zv-content .zv-grid[style*="grid-template-columns"]{grid-template-columns:1fr!important}}
.zv-replace{display:inline-block;position:relative;margin-top:6px;font-size:11.5px;font-weight:700;color:var(--z-olive);cursor:pointer}
.zv-replace input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.zv-replace:hover{text-decoration:underline}
.zv-gtable td{padding-top:10px;padding-bottom:10px}
.zv-gtable input[type=checkbox]{width:18px;height:18px}

/* video studio */
.vs-grid{display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px;align-items:start}
.vs-side{display:flex;flex-direction:column;gap:18px;position:sticky;top:92px}
.vs-main{display:flex;flex-direction:column;gap:18px;min-width:0}
.vs-list{display:flex;flex-direction:column;max-height:360px;overflow:auto}
.vs-item{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;text-align:left;border:0;border-bottom:1px solid var(--z-line-soft);background:#fff;padding:12px 18px;font:inherit;cursor:pointer}
.vs-item:hover{background:#FAFAF7}.vs-item.on{background:#F5F9E3}
.vs-item b{font-size:13px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vs-item small{grid-column:2;font-size:11.5px;color:var(--z-muted)}
.vs-fmt{grid-row:span 2;align-self:center;font-size:10.5px;font-weight:800;background:var(--z-ink);color:var(--z-lime);border-radius:7px;padding:4px 6px}
.vs-title{width:100%;border:0;background:transparent;font:inherit;font-size:19px;font-weight:750;letter-spacing:-.02em;color:var(--z-ink);padding:0;outline:0}
.vs-title:focus{box-shadow:0 2px 0 var(--z-lime)}
.vs-meta{display:flex;gap:14px;flex-wrap:wrap}.vs-meta .zv-field{flex:1;min-width:180px;margin:0}
.vs-progress{position:relative;height:30px;margin:0 22px 18px;border-radius:10px;background:#F0EFE9;overflow:hidden}
.vs-progress i{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,var(--z-lime),var(--z-olive-2));transition:width .3s}
.vs-progress span{position:relative;display:block;padding:6px 12px;font-size:12.5px;font-weight:700;color:var(--z-ink)}
.vs-scenes{display:flex;flex-direction:column;gap:12px}
.vs-scene{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:14px;background:#fff;border:1px solid var(--z-line);border-radius:16px;box-shadow:var(--z-shadow)}
.vs-scene.working{opacity:.6;pointer-events:none}
.vs-scene.working .vs-frame::after{content:"Rendering…";position:absolute;inset:0;display:grid;place-items:center;background:rgba(26,31,29,.55);color:#fff;font-weight:700;font-size:12px}
.vs-frame{position:relative;width:150px;max-height:270px;border-radius:12px;overflow:hidden;background:#F0EFE9;display:grid;place-items:center;color:var(--z-muted);font-size:12px;align-self:start}
.vs-frame img{width:100%;height:100%;object-fit:cover;display:block}
.vs-frame em{position:absolute;top:8px;left:8px;width:24px;height:24px;border-radius:50%;background:var(--z-ink);color:var(--z-lime);font-style:normal;font-weight:800;font-size:12px;display:grid;place-items:center}
.vs-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px}
.vs-fields .zv-field{margin:0}.vs-fields .zv-field:first-child{grid-column:span 2}
.vs-fields input,.vs-fields textarea{min-height:38px;padding:8px 11px;font-size:13px}
.vs-fields textarea{min-height:58px}
.vs-row{grid-column:span 2;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.vs-sec{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:650;color:#353A36}
.vs-sec input{width:72px;min-height:34px;border:1px solid #DEDDD6;border-radius:9px;padding:5px 8px;font:inherit}
.vs-change{flex:1;min-width:160px;min-height:34px;border:1px solid #DEDDD6;border-radius:9px;padding:6px 10px;font:inherit;font-size:12.5px}
.vs-tools{margin-left:auto;display:flex;gap:2px}
.vs-add{border:1.5px dashed #D3D2CA;border-radius:14px;background:transparent;padding:14px;font:inherit;font-weight:700;color:var(--z-muted);cursor:pointer}
.vs-add:hover{border-color:var(--z-olive-2);color:var(--z-ink)}
.vs-render{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:22px;align-items:start}
.vs-canvas-wrap{width:100%;max-height:540px;border-radius:14px;overflow:hidden;background:#1A1F1D;display:grid;place-items:center}
.vs-canvas-wrap canvas{width:100%;height:100%;object-fit:contain;display:block}
.vs-result video{width:100%;max-height:420px;border-radius:12px;background:#000;margin-top:14px}
@media(max-width:1100px){.vs-grid{grid-template-columns:1fr}.vs-side{position:static}.vs-render{grid-template-columns:1fr}.vs-canvas-wrap{max-width:320px}}
@media(max-width:640px){.vs-scene{grid-template-columns:1fr}.vs-frame{width:100%;max-width:220px}.vs-fields{grid-template-columns:1fr}.vs-fields .zv-field:first-child,.vs-row{grid-column:auto}}

/* batch creatives */
.bc-grid{display:grid;grid-template-columns:400px minmax(0,1fr);gap:18px;align-items:start}
.bc-side{display:flex;flex-direction:column;gap:18px}
.bc-main{position:sticky;top:92px}
.bc-n{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--z-ink);color:var(--z-lime);font-size:11.5px;margin-right:8px;vertical-align:1px}
.bc-models{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bc-drop{position:relative;display:grid;place-items:center;aspect-ratio:3/4;border:1.5px dashed #D3D2CA;border-radius:14px;background:#FAFAF7 center/cover no-repeat;cursor:pointer;text-align:center;transition:border-color .15s,background-color .15s}
.bc-drop.wide{aspect-ratio:auto;min-height:92px}
.bc-drop:hover,.bc-drop.over{border-color:var(--z-olive-2);background-color:#F5F9E3}
.bc-drop.filled{border-style:solid;border-color:var(--z-line)}.bc-drop.filled .bc-ph{display:none}
.bc-drop.busy::after{content:"Uploading…";position:absolute;inset:0;display:grid;place-items:center;background:rgba(255,255,255,.75);font-weight:700;font-size:12px;border-radius:14px}
.bc-ph b{display:block;font-size:13px;color:var(--z-ink)}.bc-ph small{font-size:11.5px;color:var(--z-muted)}
.bc-x{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;border:0;background:rgba(26,31,29,.75);color:#fff;font-size:15px;line-height:1;cursor:pointer}
.bc-prods{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.bc-prod{display:flex;gap:10px;align-items:center}
.bc-thumb{position:relative;flex:none;width:52px;height:52px;border-radius:10px;background:#F0EFE9 center/cover;border:1px solid var(--z-line);display:grid;place-items:center;font-size:9px;color:var(--z-muted)}
.bc-thumb .bc-x{top:-6px;right:-6px;width:20px;height:20px;font-size:13px}
.bc-prod input{flex:1;min-height:36px;border:1px solid #DEDDD6;border-radius:9px;padding:7px 10px;font:inherit;font-size:12.5px}
.bc-recent{margin-top:12px;font-size:12.5px}.bc-recent summary{cursor:pointer;font-weight:700;color:var(--z-ink)}
.bc-recent-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:8px}
.bc-recent-grid button{aspect-ratio:1;border:1px solid var(--z-line);border-radius:8px;background:#F0EFE9 center/cover;cursor:pointer}
.bc-recent-grid button:hover{outline:2px solid var(--z-lime)}
.bc-recipes select{min-height:32px;border:1px solid var(--z-line);border-radius:9px;padding:4px 8px;font:inherit;font-size:12px}
.bc-bar{height:4px;background:#F0EFE9}.bc-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--z-lime),var(--z-olive-2));transition:width .3s}
.bc-out{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.bc-out .zv-empty{grid-column:1/-1}
.bc-card{border:1px solid var(--z-line);border-radius:14px;overflow:hidden;background:#fff}
.bc-img{position:relative;background:#F0EFE9;display:grid;place-items:center;align-content:center;gap:8px;color:var(--z-muted);font-size:12px}
.bc-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bc-spin{width:26px;height:26px;border-radius:50%;border:3px solid #DCDBD3;border-top-color:var(--z-ink);animation:bcspin .8s linear infinite}
.bc-card.queued .bc-spin{animation:none;opacity:.4}
@keyframes bcspin{to{transform:rotate(360deg)}}
.bc-err{padding:12px;color:var(--z-danger);font-size:11.5px;text-align:center}
.bc-card.error{border-color:#F4C7C1}
.bc-meta{padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.bc-meta b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bc-acts{display:flex;gap:6px;align-items:center}
.bc-change{flex:1;min-width:0;min-height:32px;border:1px solid #DEDDD6;border-radius:8px;padding:5px 8px;font:inherit;font-size:12px}
@media(max-width:1150px){.bc-grid{grid-template-columns:1fr}.bc-main{position:static}}