/* ZIPPLEE Soft Minimalism shared application foundation. Scoped operational chrome only. */
@font-face{font-family:Inter;src:url('/video-studio/assets/fonts/inter.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
@media screen {
html[data-zipplee-screen],html.zsm-shell{--on-accent:var(--zsm-on-green);--btn-fill:var(--zsm-green);--btn-ink:var(--zsm-on-green);--zsm-on-green:#fff;--zsm-ink:#20251f;--zsm-muted:#657064;--zsm-paper:#f5f6f2;--zsm-panel:#fff;--zsm-line:#e2e6de;--zsm-input:#dde3da;--zsm-green:#315c43;--zsm-soft:#edf3e9;--zsm-focus:#c9dc85;--zsm-shadow:0 18px 50px #26332112;--zsm-secondary:#4a574c;--zsm-secondary-hover:#fbfcfa;--zsm-secondary-line:#b8cbb5;--zsm-danger:#9b4c37;--zsm-danger-line:#eadbd5;--zsm-danger-hover:#fff8f5}
html[data-zipplee-screen][data-atelier-mode=dark],html[data-zipplee-screen][data-mode=dark],html[data-mode=dark].zsm-shell{--zsm-on-green:#19271c;--zsm-ink:#edf1e9;--zsm-muted:#b7c0b4;--zsm-paper:#1b211d;--zsm-panel:#263027;--zsm-line:#435144;--zsm-input:#566256;--zsm-green:#a9c49d;--zsm-soft:#334336;--zsm-focus:#d7e99d;--zsm-shadow:0 18px 50px #0000002e;--zsm-secondary:#d7e1d3;--zsm-secondary-hover:#303c31;--zsm-secondary-line:#6e806d}
html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=electric]{--zsm-green:#587d00;--zsm-focus:#b7ff00}html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=electric][data-mode=dark]{--zsm-green:#b7ff00;--zsm-on-green:#142000;--zsm-soft:#344500;--zsm-focus:#d4ff70}
html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=blue]{--zsm-green:#326da6;--zsm-soft:#e1effd;--zsm-focus:#9acbff}html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=blue][data-mode=dark]{--zsm-green:#8fc6ff;--zsm-on-green:#10243a;--zsm-soft:#294968}
html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=pink]{--zsm-green:#b6406c;--zsm-soft:#fce4ed;--zsm-focus:#f5a8c5}html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=pink][data-mode=dark]{--zsm-green:#ff9abc;--zsm-on-green:#3b1021;--zsm-soft:#5c2940}
html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=yellow]{--zsm-green:#8a6400;--zsm-soft:#fff2c6;--zsm-focus:#e7c95f}html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=yellow][data-mode=dark]{--zsm-green:#ffd75a;--zsm-on-green:#302300;--zsm-soft:#594b22}
html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=coral]{--zsm-green:#b74636;--zsm-soft:#ffe6de;--zsm-focus:#f5a397}html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-accent=coral][data-mode=dark]{--zsm-green:#ff9a86;--zsm-on-green:#3b1712;--zsm-soft:#633229}
html:is(.zsm-shell,[data-zipplee-screen])[data-zipplee-appearance=electric]{--zsm-paper:#080b08;--zsm-panel:#101610;--zsm-ink:#f0f8e7;--zsm-muted:#a8b89d;--zsm-line:#30451d;--zsm-input:#405629;--zsm-shadow:0 18px 50px #00000052}

/* Explicit chrome lists, never a blanket authored-content reset. */
html[data-zipplee-screen] body{background:var(--zsm-paper)!important;color:var(--zsm-ink)!important;font:400 14px/1.5 Inter,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;-webkit-font-smoothing:antialiased}
html[data-zipplee-screen] :is(button,input,select,textarea,.btn,.button):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){font-family:Inter,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
html[data-zipplee-screen] :is(h1,h2,h3,h4,h5):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){font-family:Inter,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;color:var(--zsm-ink)!important;font-weight:700!important;letter-spacing:-.035em!important}
html[data-zipplee-screen] h1:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){font-size:clamp(24px,3vw,30px)!important;line-height:1.12!important}
html[data-zipplee-screen] h2:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){font-size:17px!important;line-height:1.25!important}
html[data-zipplee-screen] h3:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){font-size:14px!important;line-height:1.3!important}
html[data-zipplee-screen] :is(.sub,.hint,.muted,.sec-hint,.card-hint,.help,.description,.empty p):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){color:var(--zsm-muted)!important}
html[data-zipplee-screen] :is(.card,.panel,.kpi,.modal-card,.dialog,.empty,.empty-lib,.login-card,.popover,.dropdown-menu):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border-color:var(--zsm-line)!important;border-radius:14px!important;box-shadow:var(--zsm-shadow)!important}
html[data-zipplee-screen] :is(.topbar,.top-bar,.toolbar,.bar,.headbar,.app-header):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border-color:var(--zsm-line)!important}
html[data-zipplee-screen] :is(input,select,textarea):not([type=color],[type=range],[type=checkbox],[type=radio]):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){min-height:36px;background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border:1px solid var(--zsm-input)!important;border-radius:8px!important;padding:8px 9px!important}
/* A cell you can type in is part of the table, never a box of its own (CLAUDE.md 1.8b, Todd 2026-11-08): flat at rest,
   a soft tint when you point at it, a tight ring inside the cell when you are in it. Layout does not move: the border stays, drawn clear. */
html[data-zipplee-screen] :is(td,th)>input:not([type=color],[type=range],[type=checkbox],[type=radio],[type=file],[type=date],[type=time],[type=datetime-local],[type=month],[type=week]):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){min-height:0;background:transparent!important;border-color:transparent!important;border-radius:0!important;box-shadow:none!important}
html[data-zipplee-screen] :is(td,th)>input:not([type=color],[type=range],[type=checkbox],[type=radio],[type=file],[type=date],[type=time],[type=datetime-local],[type=month],[type=week],[readonly],:disabled):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)):hover{background:color-mix(in srgb,var(--zsm-green) 10%,transparent)!important}
html[data-zipplee-screen] :is(td,th)>input:not([type=color],[type=range],[type=checkbox],[type=radio],[type=file],[type=date],[type=time],[type=datetime-local],[type=month],[type=week],[readonly],:disabled):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)):focus-visible{background:color-mix(in srgb,var(--zsm-green) 10%,transparent)!important;outline:2px solid var(--zsm-green)!important;outline-offset:-2px!important}
/* every dropdown draws its own chevron in the app's style, never the browser's arrow (CLAUDE.md 1.8) */
html[data-zipplee-screen] select:not([multiple],[size]):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){appearance:none!important;-webkit-appearance:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23939c93' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 11px center!important;background-size:11px!important;padding-right:30px!important;cursor:pointer}
html[data-zipplee-screen] :is(input,textarea):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *))::placeholder{color:var(--zsm-muted)!important;opacity:1}
html[data-zipplee-screen] :is(.btn,.button,.btn-ghost,.btn-soft,.btn-secondary,.secondary,.outline):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){border:1px solid var(--zsm-line)!important;border-radius:9px!important;background:var(--zsm-panel)!important;color:var(--zsm-secondary)!important;padding:9px 12px;box-shadow:none!important;font-size:12px!important;font-weight:680!important}
html[data-zipplee-screen] :is(.btn,.button,.btn-ghost,.btn-soft,.btn-secondary,.secondary,.outline):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)):hover:not(:disabled){background:var(--zsm-secondary-hover)!important;border-color:var(--zsm-secondary-line)!important;color:var(--zsm-ink)!important}
html[data-zipplee-screen] :is(.btn.primary,.btn-primary,.btn.pri,.primary,.manage,#publishBtn,.go):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){background:var(--zsm-green)!important;border-color:var(--zsm-green)!important;color:var(--zsm-on-green)!important}
html[data-zipplee-screen] :is(.btn.primary,.btn-primary,.btn.pri,.primary,.manage,#publishBtn,.go):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)):hover:not(:disabled){background:#234631!important;border-color:#234631!important;color:#fff!important}
html[data-zipplee-screen] :is(.danger,.delete,.destructive,.remove):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){color:var(--zsm-danger)!important;border-color:var(--zsm-danger-line)!important}
html[data-zipplee-screen] :is(.danger,.delete,.destructive,.remove):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)):hover:not(:disabled){background:var(--zsm-danger-hover)!important;color:#843a28!important}
html[data-zipplee-screen] :is(button,.btn,.button):disabled:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){opacity:.48!important;cursor:not-allowed!important}
/* A button disabled because it is BUSY keeps its colour and its spinner —
   greying it out reads as broken, and a broken-looking button gets pressed
   again or abandoned. Any surface can opt a button out by adding .working
   (or data-busy) for as long as the work is running. */
html[data-zipplee-screen] :is(button,.btn,.button).working:disabled,
html[data-zipplee-screen] :is(button,.btn,.button)[data-busy]:disabled,
html[data-zipplee-screen] :is(button,.btn,.button):disabled:has(.spin,.spinner,.zspin),
html[data-zipplee-screen] :is(button,.btn,.button,[role=button])[data-busy]{opacity:1!important;cursor:wait!important}
/* Spins in the button's own colour, so it reads on a filled button and a
   ghost one without knowing which it is. */
.zbusy-spin{display:inline-block;width:1em;height:1em;margin-right:.5em;vertical-align:-.15em;
  border:2px solid color-mix(in srgb,currentColor 26%,transparent);border-top-color:currentColor;
  border-radius:50%;animation:zbusyspin .7s linear infinite;flex:none}
@keyframes zbusyspin{to{transform:rotate(360deg)}}
html[data-zipplee-screen] :is(button,a,input,select,textarea,[tabindex]):focus-visible:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){outline:3px solid var(--zsm-focus)!important;outline-offset:2px!important}
html[data-zipplee-screen] :is(.tab.on,.tab.active,.tab.is-active,.atab.on,[aria-selected=true]):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){color:var(--zsm-green)!important;border-color:var(--zsm-green)!important;background:var(--zsm-soft)!important}
html[data-zipplee-screen] :is(table,th,td):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){border-color:var(--zsm-line)!important}
html[data-zipplee-screen] th:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){color:var(--zsm-muted)!important;font:700 10px/1.5 Inter,"Avenir Next",sans-serif!important;letter-spacing:.1em;text-transform:uppercase}

/* Editor variables live on chrome only so the slide itself retains authored art. */
html[data-zipplee-screen=builder] :is(.sidebar,.topbar,.top-bar,.app-header,.editor-grid>.controls,.editor-grid>.panel,.view:not(#view-editor),#view-create,#view-library,#view-home){--paper:var(--zsm-paper);--panel:var(--zsm-panel);--card:var(--zsm-panel);--field:var(--zsm-panel);--ink:var(--zsm-ink);--muted:var(--zsm-muted);--hair:var(--zsm-line);--hair-strong:var(--zsm-line);--teal:var(--zsm-green);--teal-soft:var(--zsm-soft);--navy:var(--zsm-green);--btn-pri-bg:var(--zsm-green);--btn-pri-ink:#fff}
html[data-zipplee-screen=app] :is(.topbar,.controls,.controls>.card){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border-color:var(--zsm-line)!important}

/* Original Video Studio: chrome changes only; selected slide families remain their own artwork. */
html.zsm-video-tool body{background:var(--zsm-paper)!important;color:var(--zsm-ink)!important;font-family:Inter,"Avenir Next",sans-serif!important}
html.zsm-video-tool body>header{min-height:67px!important;height:auto!important;padding:10px clamp(16px,4vw,54px)!important;background:var(--zsm-panel)!important;border-color:var(--zsm-line)!important}
html.zsm-video-tool .wordmark{color:var(--zsm-ink)!important;font:750 16px/1 Inter,"Avenir Next",sans-serif!important;letter-spacing:-.035em!important}html.zsm-video-tool .wordmark span{color:var(--zsm-muted)!important;font:500 12px/1 Inter,"Avenir Next",sans-serif!important}
html.zsm-video-tool body>header button,html.zsm-video-tool body>header a,html.zsm-video-tool .controls>button,html.zsm-video-tool .paging button{border:1px solid var(--zsm-line)!important;border-radius:9px!important;background:var(--zsm-panel)!important;color:var(--zsm-secondary)!important;padding:9px 12px!important;font:680 12px/1 Inter,"Avenir Next",sans-serif!important}
html.zsm-video-tool body>header button:hover,html.zsm-video-tool body>header a:hover,html.zsm-video-tool .controls>button:hover,html.zsm-video-tool .paging button:hover{background:var(--zsm-secondary-hover)!important;border-color:var(--zsm-secondary-line)!important;color:var(--zsm-ink)!important}
html.zsm-video-tool body>header button.active,html.zsm-video-tool body>header a#download{background:var(--zsm-green)!important;border-color:var(--zsm-green)!important;color:var(--zsm-on-green)!important}
html.zsm-video-tool main{max-width:1560px!important;padding:26px clamp(16px,4vw,54px)!important}html.zsm-video-tool #toolbar{margin-bottom:20px!important}html.zsm-video-tool #modeLabel{color:var(--zsm-muted)!important;font:750 10px/1.4 Inter,"Avenir Next",sans-serif!important;letter-spacing:.12em!important}html.zsm-video-tool .appearance-help,html.zsm-video-tool footer,html.zsm-video-tool #editorStatus{color:var(--zsm-muted)!important}
html.zsm-video-tool #stage{border:1px solid var(--zsm-line)!important;border-radius:13px!important;background:#e8ebe5!important;box-shadow:var(--zsm-shadow)!important}html.zsm-video-tool #filmstrip{padding-top:12px!important}html.zsm-video-tool .thumb{border-color:var(--zsm-line)!important;border-radius:8px!important}html.zsm-video-tool .thumb.current{border-color:var(--zsm-green)!important;box-shadow:0 0 0 3px var(--zsm-soft)!important}
html.zsm-video-tool #editor{background:var(--zsm-panel)!important;border-color:var(--zsm-line)!important;box-shadow:var(--zsm-shadow)!important}html.zsm-video-tool #editor textarea{background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border-color:var(--zsm-input)!important;border-radius:8px!important}html.zsm-video-tool #editor :is(#regenerate,#saveText){background:var(--zsm-green)!important;color:var(--zsm-on-green)!important}

/* HR and operator shell, without reaching the iframe's document. */
html.zsm-shell body{background:var(--zsm-paper)!important;color:var(--zsm-ink)!important;font:400 14px/1.5 Inter,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
html.zsm-shell #side{background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border-right:1px solid var(--zsm-line)!important;--ink:var(--zsm-ink);--muted:var(--zsm-muted);--line:var(--zsm-line);--accent:var(--zsm-green);--accent2:var(--zsm-green)}
html.zsm-shell #side::before{display:none!important}html.zsm-shell .brand{min-height:67px!important;height:67px!important;padding:10px 18px!important;flex-wrap:nowrap!important;border-bottom:1px solid var(--zsm-line)!important}html.zsm-shell .brand>div:first-child{flex:1 1 auto!important}
html.zsm-shell .brand .nm,html.zsm-shell .brand .co,html.zsm-shell .brandmark-title{font-family:Inter,"Avenir Next",sans-serif!important;color:var(--zsm-ink)!important}html.zsm-shell .brand .nm{font-size:16px!important;font-weight:750!important;letter-spacing:-.035em!important}html.zsm-shell .brand .co{font-size:11px!important;letter-spacing:0!important;margin-top:2px!important;color:var(--zsm-muted)!important}html.zsm-shell .workspace-logo{width:122px!important;height:auto!important}
html.zsm-shell :is(.help-tg,.theme-tg,.all-tg){width:32px!important;height:32px!important;border:1px solid var(--zsm-line)!important;border-radius:9px!important;background:var(--zsm-panel)!important;color:var(--zsm-muted)!important}html.zsm-shell .nav{padding:12px!important}html.zsm-shell .nsec{color:var(--zsm-muted)!important;font:750 10px/1.4 Inter,"Avenir Next",sans-serif!important;letter-spacing:.12em!important;margin:16px 10px 6px!important}
html.zsm-shell :is(.nit,.subit){font-family:Inter,"Avenir Next",sans-serif!important;color:var(--zsm-secondary)!important;font-size:12px!important;font-weight:500!important;border-radius:9px!important}html.zsm-shell :is(.nit,.subit):hover{background:var(--zsm-secondary-hover)!important;color:var(--zsm-ink)!important}html.zsm-shell :is(.nit,.subit).on{background:var(--zsm-soft)!important;color:var(--zsm-green)!important;font-weight:700!important}
html.zsm-shell :is(.hracct,.opacct,.foot){border-color:var(--zsm-line)!important;color:var(--zsm-muted)!important}html.zsm-shell :is(.hra-av,.opa-av){background:var(--zsm-soft)!important;color:var(--zsm-green)!important}html.zsm-shell .sb-edge{background:var(--zsm-panel)!important;color:var(--zsm-secondary)!important;border:1px solid var(--zsm-line)!important;border-radius:9px!important;box-shadow:var(--zsm-shadow)!important}html.zsm-shell #main,html.zsm-shell #toolframe{background:var(--zsm-paper)!important}
html.zsm-shell :is(.gc,.gate-card){background:var(--zsm-panel);color:var(--zsm-ink);border:1px solid var(--zsm-line);border-radius:14px;padding:22px;box-shadow:var(--zsm-shadow)}html.zsm-shell :is(.gc input,.gate-card input){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border:1px solid var(--zsm-input)!important;border-radius:8px!important}html.zsm-shell :is(.gbtn,.gate-card button[type=submit]){background:var(--zsm-green)!important;color:var(--zsm-on-green)!important;border:1px solid var(--zsm-green)!important;border-radius:9px!important}html.zsm-shell :is(button,a,input,select,textarea,[tabindex]):focus-visible{outline:3px solid var(--zsm-focus)!important;outline-offset:2px!important}
@media(max-width:700px){html[data-zipplee-screen] h1:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){font-size:24px!important}html.zsm-shell .brand{padding-inline:13px!important}}@media(prefers-reduced-motion:reduce){html[data-zipplee-screen] :is(button,a,input,select,textarea):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)),html.zsm-shell :is(button,a,input,select,textarea){scroll-behavior:auto!important;transition-duration:.01ms!important}}

/* Common application tokens. Editing surfaces keep their own semantic tokens. */
html[data-zipplee-screen]:not([data-zipplee-screen=builder],[data-zipplee-screen=app],[data-zipplee-screen=rewards],[data-zipplee-screen=video],[data-zipplee-screen=studio2],[data-zipplee-screen=waypoints-map],[data-zipplee-screen=materials],[data-zipplee-screen=templates],[data-zipplee-screen=infographic]){
 --bg:var(--zsm-paper)!important;--bg2:var(--zsm-paper)!important;--bg-2:var(--zsm-paper)!important;--paper:var(--zsm-paper)!important;--panel:var(--zsm-panel)!important;--card:var(--zsm-panel)!important;--card2:var(--zsm-panel)!important;--card-2:var(--zsm-panel)!important;--surface:var(--zsm-panel)!important;--surface2:var(--zsm-soft)!important;--ink:var(--zsm-ink)!important;--ink-2:var(--zsm-muted)!important;--ink-dim:var(--zsm-muted)!important;--mut:var(--zsm-muted)!important;--muted:var(--zsm-muted)!important;--line:var(--zsm-line)!important;--hair:var(--zsm-line)!important;--accent:var(--zsm-green)!important;--accent2:var(--zsm-green)!important;--accent-ink:var(--zsm-on-green)!important;--btn-ink:var(--zsm-on-green)!important;--on-accent:var(--zsm-on-green)!important;--btn-fill:var(--zsm-green)!important;--teal:var(--zsm-green)!important;--teal-soft:var(--zsm-soft)!important;--cobalt:var(--zsm-green)!important;--cobalt-soft:var(--zsm-soft)!important;--shadow:var(--zsm-shadow)!important;--font:Inter,"Avenir Next",sans-serif!important;--serif:Inter,"Avenir Next",sans-serif!important;
}
html[data-zipplee-screen] :where(p,span,div,a,label,legend,li,summary,small,strong,b,em,option):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *,code,code *,pre,pre *,[class*="icon"],[class*="icon"] *)){font-family:Inter,"Avenir Next",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
html[data-zipplee-screen] button:not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){border-radius:9px}
html[data-zipplee-screen] :is(.sidebar,.side):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){background:var(--zsm-panel);color:var(--zsm-ink);border-color:var(--zsm-line)}
html[data-zipplee-screen] :is(.auth-card,.saved-project,.source-form,.project-product,.production-style-card,.pub):not(:where(#zaBox,#zaBox *,#previewSlot,#previewSlot *,#leStage,#leStage *,#meStage,#meStage *,#tdStage,#tdStage *,#mwStage,#mwStage *,#rgStage,#rgStage *,#matPreview,#matPreview *,#spStage,#spStage *,#phonePreview,#phonePreview *,.phone,.phone *,.statement,.statement *,#statement,#statement *,.pv,.pv *,.preview,.preview *,.slide-canvas,.slide-canvas *,.zrdoc,.zrdoc *,.zrpage,.zrpage *,canvas,canvas *,svg,svg *,.stage,.stage *,[data-zsm-preserve],[data-zsm-preserve] *,[contenteditable=true],[contenteditable=true] *)){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border:1px solid var(--zsm-line)!important;border-radius:14px!important;box-shadow:var(--zsm-shadow)}
/* Keep the familiar branded rail, with room for its logo, company, and utility controls. */
html.zsm-shell #side{--zsm-panel:#315c43;--zsm-ink:#fff;--zsm-muted:#d5e3d3;--zsm-secondary:#e5eee1;--zsm-line:#ffffff26;--zsm-green:#fff;--zsm-soft:#ffffff20;--zsm-secondary-hover:#ffffff12;--zsm-focus:#c9dc85}
html.zsm-shell .brand{height:auto!important;min-height:130px!important;flex-wrap:wrap!important;padding:18px!important;gap:8px!important}
html.zsm-shell .brand>div:first-child{flex:1 0 100%!important}
html.zsm-shell .workspace-logo{width:152px!important;max-width:100%;height:auto!important}
html.zsm-shell #side .brand .co{white-space:normal;overflow-wrap:anywhere;line-height:1.45}
html.zsm-shell :is(.nit,.subit).on{background:#ffffff20!important;color:#fff!important}
html.zsm-shell .hra-out{font-family:Inter,sans-serif;color:#fff}
html.zsm-shell[data-mode=dark] #side{--zsm-panel:#263027;color-scheme:dark;scrollbar-color:#566256 #1b211d}
html.zsm-shell[data-mode=dark] #nav{scrollbar-color:#566256 #1b211d}
html.zsm-shell[data-mode=dark] #nav::-webkit-scrollbar-track{background:#1b211d}
html.zsm-shell[data-mode=dark] #nav::-webkit-scrollbar-thumb{background:#566256;border:2px solid #1b211d;border-radius:8px}
html.zsm-shell[data-mode=dark] :is(.nit,.subit).on{background:#a9c49d!important;color:#19271c!important}
/* Waypoints: replace independent blue/metallic UI surfaces while preserving map art. */
html[data-zipplee-screen=waypoints] :is(#app>aside,.sidebar,.nav){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;--chrome-text:var(--zsm-ink);--chrome-muted:var(--zsm-muted);--chrome-line:var(--zsm-line)}
html[data-zipplee-screen=waypoints] :is(.nav-item,nav button){color:var(--zsm-secondary)!important;border-radius:9px!important;box-shadow:none!important}
html[data-zipplee-screen=waypoints] :is(.nav-item.active,nav button.active,nav button.on){background:var(--zsm-soft)!important;color:var(--zsm-green)!important;border-color:var(--zsm-line)!important}
html[data-zipplee-screen=waypoints] :is(.empty-state,.exp-card,.modal,.modal-content){background:var(--zsm-panel)!important;color:var(--zsm-ink)!important;border-color:var(--zsm-line)!important;border-radius:14px!important}
html[data-zipplee-screen=waypoints] .btn{transform:none!important;filter:none!important}
/* Studio creators are mounted dynamically in both editors. */
html[data-zipplee-screen] #projectPanel{--studio-bg:var(--zsm-paper);--studio-card:var(--zsm-panel);--studio-soft:var(--zsm-soft);--studio-ink:var(--zsm-ink);--studio-muted:var(--zsm-muted);--studio-border:var(--zsm-line);--studio-accent:var(--zsm-green);font-family:Inter,sans-serif!important;color:var(--zsm-ink);background:var(--zsm-paper)}
html[data-zipplee-screen] #projectPanel :is(h1,h2,h3){font-family:Inter,sans-serif!important;font-weight:700!important;letter-spacing:-.035em!important;color:var(--zsm-ink)!important}
html[data-zipplee-screen] #projectPanel h1{font-size:30px!important}html[data-zipplee-screen] #projectPanel h2{font-size:20px!important}html[data-zipplee-screen] #projectPanel h3{font-size:17px!important}
html[data-zipplee-screen] #projectPanel :is(button,input,select,textarea){font-family:Inter,sans-serif!important;border-radius:9px!important}
html[data-zipplee-screen] #projectPanel .primary-action,html[data-zipplee-screen] #projectPanel button[aria-pressed=true]{background:var(--zsm-green)!important;color:var(--zsm-on-green)!important;border-color:var(--zsm-green)!important}
html[data-zipplee-screen] #projectPanel .primary-action:hover:not(:disabled){background:#234631!important;color:white!important;border-color:#234631!important}
html[data-zipplee-screen] #projectPanel .production-style-card[aria-pressed=true]{background:var(--zsm-soft)!important;color:var(--zsm-ink)!important;outline:2px solid var(--zsm-green)!important}
html[data-zipplee-screen] #projectPanel .style-picker-option{background:var(--zsm-panel);color:var(--zsm-ink)}
html[data-zipplee-screen] #projectPanel .style-picker-option:is(:hover,[aria-selected=true]){background:var(--zsm-soft);color:var(--zsm-ink)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark]{--ink:var(--zsm-ink);--muted:var(--zsm-muted);--line:var(--zsm-line);--paper:var(--zsm-paper);--panel:var(--zsm-panel);--green:var(--zsm-green);--soft:var(--zsm-soft)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark]{color-scheme:dark}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-start-card,.v2-project,.v2-button,.v2-workflow-choice,.v2-control,.v2-scene,.v2-chart-series,.v2-chart-setup,.v2-inspector,.v2-inspector-head,.v2-section,.v2-add-actions,.v2-note,.v2-timeline,.v2-toolbar,.v2-library){background:var(--zsm-panel);color:var(--zsm-ink);border-color:var(--zsm-line)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-canvas-wrap,.v2-image-preview-frame){background:#202820}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-inspector h2,.v2-chart-setup h2,.v2-setup-head h2,.v2-field,.v2-chart-labels h3,.v2-chart-row,.v2-chart-series-head){color:var(--zsm-ink)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-eyebrow,.v2-section h3,.v2-field small,.v2-layout-help,.v2-layer-note,.v2-inspector p,.v2-timeline-head small,.v2-scene small,.v2-library-subhead){color:var(--zsm-muted)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-inspector-head,.v2-section,.v2-add-actions,.v2-surface-picker,.v2-layer,.v2-chart-setup){border-color:var(--zsm-line)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-control,.v2-field>input[type=color],.v2-color input[type=color],.v2-icon,.v2-material-option,.v2-paint-option,.v2-chart-series,.v2-image-setup-preview){background-color:var(--zsm-panel);color:var(--zsm-ink);border-color:var(--zsm-input)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-tool,.v2-inspector-tab,.v2-layer button:first-child,.v2-icon){color:var(--zsm-secondary)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-tool.active,.v2-tool:hover,.v2-inspector-tab[aria-selected=true],.v2-section details>summary,.v2-surface-picker>summary,.v2-layer button:first-child:hover){color:var(--zsm-green);background:var(--zsm-soft)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] .v2-scene[aria-current=true]{background:var(--zsm-soft);color:var(--zsm-ink)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] .v2-note{background:var(--zsm-soft);color:var(--zsm-muted)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] .v2-badge{background:var(--zsm-soft);color:var(--zsm-green)}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-delete-tool,.v2-layer-delete){color:#f0a995;border-color:#765247}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] :is(.v2-delete-tool,.v2-layer-delete):hover:not(:disabled){background:#49332d;color:#ffd2c5;border-color:#a66e5a}
html[data-zipplee-screen=studio2][data-atelier-mode=dark] .v2-button.primary{background:var(--zsm-green);color:var(--zsm-on-green);border-color:var(--zsm-green)}

/* Preserve room reserved for inline search icons. */
html[data-zipplee-screen] :is(.search,.csearch):has(svg) input{padding-left:42px!important}
html[data-zipplee-screen] .fchip.on{background:var(--zsm-green)!important;color:var(--zsm-on-green)!important;border-color:var(--zsm-green)!important}

}

@media screen {
html.zsm-shell:is([data-zipplee-appearance=electric],[data-zipplee-accent]:not([data-zipplee-accent=original])) #side{--zsm-panel:inherit;--zsm-ink:inherit;--zsm-muted:inherit;--zsm-secondary:inherit;--zsm-line:inherit;--zsm-green:inherit;--zsm-soft:inherit;--zsm-secondary-hover:inherit;--zsm-focus:inherit;color-scheme:inherit}
html.zsm-shell:is([data-zipplee-appearance=electric],[data-zipplee-accent]:not([data-zipplee-accent=original])) :is(.nit,.subit).on{background:var(--zsm-green)!important;color:var(--zsm-on-green)!important}
html.zsm-shell #appearancePop{background:var(--zsm-panel);color:var(--zsm-ink);border-color:var(--zsm-line);--panel:var(--zsm-panel);--ink:var(--zsm-ink);--muted:var(--zsm-muted);--line:var(--zsm-line);--accent:var(--zsm-green);--accent2:var(--zsm-green)}
html.zsm-shell[data-zipplee-accent]:not([data-zipplee-accent=original]) .hra-out{color:var(--zsm-ink)}
}
/* ONE BACKGROUND BEHIND EVERY SCREEN (workspace-theme.js sets data-zbg-on, --zbg-pic and --zbg-veil). The picture sits on
   the page itself, under a wash of the page colour; cards, tables and panels keep their own surface over it. A page that
   must stay plain carries data-zbg="off"; a view that must stay plain while it is open carries data-zbg-plain. */
@media screen{
html[data-zbg-on]:not([data-zbg=off]):not(:has([data-zbg-plain]:is(.active,.on,.open,[open]))){background:linear-gradient(color-mix(in srgb,var(--zsm-paper,#f5f6f2) var(--zbg-veil,78%),transparent),color-mix(in srgb,var(--zsm-paper,#f5f6f2) var(--zbg-veil,78%),transparent)),var(--zbg-pic) center/cover no-repeat fixed,var(--zsm-paper,#f5f6f2)!important;--bg:transparent!important;--bg2:transparent!important;--bg-2:transparent!important;--paper:transparent!important}
html[data-zbg-on]:not([data-zbg=off]):not(:has([data-zbg-plain]:is(.active,.on,.open,[open]))) body{background:transparent!important}
/* NATIVE CONTROLS FOLLOW THE THEME (Todd, 2026-11-08: the calendar icon in Client renewals' "Renews" date was black on the dark
   theme, and so was every date field). color-scheme tells the browser which way to draw its own parts: the calendar and clock
   icons inside date and time fields, their pop-up pickers, scrollbars. Light theme draws them for light, dark and Electric
   for dark. Date and time fields carry it themselves too, so a page that pins its own color-scheme still gets a light icon on
   dark. The icon is a pointer, because pressing it opens the picker. */
html[data-zipplee-screen],html.zsm-shell{color-scheme:light}
html:is([data-zipplee-screen],.zsm-shell):is([data-mode=dark],[data-atelier-mode=dark]){color-scheme:dark}
html:is([data-zipplee-screen],.zsm-shell):is([data-mode=dark],[data-atelier-mode=dark]) input:is([type=date],[type=time],[type=datetime-local],[type=month],[type=week]):not(:where([data-zsm-preserve] *)){color-scheme:dark!important}
html:is([data-zipplee-screen],.zsm-shell) input::-webkit-calendar-picker-indicator{cursor:pointer;opacity:1}
}