/* PodBulk v4 "Light Studio" layer (2026-10-28). Loaded after the app CSS; everything is scoped to html.pb-v4 so
   removing the <link>/<script> from index.html restores the old look. Design rules: see DESIGN.md (Light Studio). */

/* ---------- tokens (light) ---------- */
html.pb-v4{
  --pb-warm-50:#f6f7f9;--pb-warm-100:#f2f4f7;--pb-warm-200:#e4e7ec;--pb-gray-200:#e4e7ec;--pb-gray-300:#cfd4dc;--pb-gray-500:#8a94a6;--pb-gray-600:#475467;--pb-ink-900:#101828;
  --cream:#f6f7f9;--paper:#ffffff;--ink:#101828;--muted:#475467;--faint:#8a94a6;--line:#e4e7ec;--line-strong:#cfd4dc;--soft:#f2f4f7;
  --radius-sm:10px;--radius-md:14px;--radius-lg:18px;--radius-xl:24px;--radius-card:16px;--radius-button:999px;--radius:12px;
  --shadow-soft:0 1px 2px rgba(16,24,40,.04),0 4px 12px -6px rgba(16,24,40,.10);--shadow-soft-hover:0 6px 18px -6px rgba(16,24,40,.18);
  --font-sans:"Inter","Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--font-display:"Sora","Inter",sans-serif;--font-head:"Sora","Inter",sans-serif;--font-mono:"JetBrains Mono","Geist Mono",ui-monospace,Consolas,monospace;
  --v4-blue:#2563eb;--v4-blue-rgb:37,99,235;--v4-purple:#7c3aed;--v4-green-rgb:31,216,119;
  --v4-grad-green:linear-gradient(120deg,#05301c 0%,#0b7a4b 48%,#1FD877 100%);
  --v4-brand:linear-gradient(90deg,#1FD877,#2563eb 55%,#7c3aed);
  --v4-term:#0d1117;--v4-term-2:#161b22;--v4-term-line:#262c36;--v4-term-text:#c9d1d9;--v4-term-dim:#7d8590;--v4-term-ok:#1FD877;
}
html.pb-v4 body{background:var(--cream);font-family:var(--font-sans)}
html.pb-v4 h1,html.pb-v4 h2,html.pb-v4 h3,html.pb-v4 .home-head__title,html.pb-v4 .tool-hero h1{font-family:var(--font-display);letter-spacing:-.02em}

/* ---------- buttons ---------- */
html.pb-v4 .btn-primary,html.pb-v4 .pbv4-btn{position:relative;overflow:hidden;border-radius:999px!important;background:var(--v4-grad-green)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 22px -10px rgba(5,48,28,.85)!important;font-weight:600;transition:filter .2s,transform .15s,box-shadow .2s}
html.pb-v4 .btn-primary:hover:not(:disabled),html.pb-v4 .pbv4-btn:hover{filter:brightness(1.1);transform:translateY(-1px)}
html.pb-v4 .btn-primary::after,html.pb-v4 .pbv4-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.45) 48%,transparent 66%);transform:translateX(-130%);pointer-events:none}
html.pb-v4 .btn-primary:hover:not(:disabled)::after,html.pb-v4 .pbv4-btn:hover::after{animation:pbv4Shine .8s ease}
@keyframes pbv4Shine{to{transform:translateX(130%)}}
html.pb-v4 .btn-primary:disabled{background:#f2f4f7!important;color:#8a94a6!important;border-color:#e4e7ec!important;box-shadow:none!important;filter:none;transform:none}
html.pb-v4 .btn--secondary,html.pb-v4 .pbv4-btn2,html.pb-v4 .tool-back{border-radius:999px!important;background:linear-gradient(180deg,#fff,#f4f6fa)!important;border:1px solid var(--line)!important;color:var(--ink)!important;box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(16,24,40,.06),0 4px 10px -6px rgba(16,24,40,.12)!important;transition:color .2s,border-color .2s,transform .15s}
html.pb-v4 .btn--secondary:hover,html.pb-v4 .pbv4-btn2:hover,html.pb-v4 .tool-back:hover{color:var(--v4-blue)!important;border-color:rgba(var(--v4-blue-rgb),.4)!important;transform:translateY(-1px)}
html.pb-v4 .tool-back{display:inline-flex;align-items:center;gap:8px;padding:7px 14px;font-weight:600;font-size:13px;text-decoration:none;margin-bottom:12px}
html.pb-v4 .tool-back span{color:var(--v4-blue)}

/* ---------- cards, steps, dropzones ---------- */
html.pb-v4 .card,html.pb-v4 .card--panel{border-radius:16px!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-soft)!important;background:var(--paper)}
html.pb-v4 .step-heading__num{background:var(--ink)!important;color:#fff!important;border-radius:50%}
html.pb-v4 .dropzone{border-radius:14px!important;border:1.5px dashed var(--line-strong)!important;background:#f9fafb!important;transition:border-color .15s,background .15s}
html.pb-v4 .dropzone:hover,html.pb-v4 .dropzone--over{border-color:var(--v4-blue)!important;background:#eef4ff!important}
html.pb-v4 .dropzone__local{display:none}

/* ---------- sidebar ---------- */
html.pb-v4 .sidebar{background:var(--paper);border-right:1px solid var(--line)}
html.pb-v4 .sidebar::before{content:"";display:block;height:3px;background:var(--v4-brand)}
html.pb-v4 .sidebar__nav{display:flex;flex-direction:column}
html.pb-v4 .sidebar__nav-item{border-radius:10px!important;position:relative}
html.pb-v4 .sidebar__nav-item--active{background:var(--soft)!important;box-shadow:none!important}
html.pb-v4 .sidebar__nav-item--active::before{content:"";position:absolute;left:-8px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:#1FD877}
html.pb-v4 .sidebar__nav-item--active .sidebar__nav-label{color:var(--ink)!important;font-weight:600}
html.pb-v4 .sidebar__tool-icon.pbv4-ic{filter:drop-shadow(0 2px 3px rgba(16,24,40,.15));opacity:1!important}
html.pb-v4 .pbv4-grp{font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);padding:14px 12px 6px;list-style:none}
html.pb-v4 .sidebar--collapsed .pbv4-grp{display:none}
html.pb-v4 .sidebar__points{border-radius:16px!important;border:1.5px solid transparent!important;background:linear-gradient(var(--paper),var(--paper)) padding-box,var(--v4-brand) border-box!important}
html.pb-v4 .sidebar__workflow-btn{border-radius:14px!important;background:linear-gradient(120deg,#2e1065,#5b21b6 50%,#7c3aed)!important;color:#fff!important;box-shadow:0 10px 22px -12px rgba(91,33,182,.9)!important}

/* ---------- top bar (injected) ---------- */
html.pb-v4 .pbv4-top{position:sticky;top:0;z-index:45;display:flex;align-items:center;gap:12px;height:64px;padding:0 28px;margin:0 0 4px;background:rgba(255,255,255,.92);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
html.pb-v4 .pbv4-crumb{font-size:13.5px;color:var(--faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
html.pb-v4 .pbv4-crumb b{color:var(--ink);font-weight:600}
html.pb-v4 .pbv4-search{flex:1;max-width:420px;margin-inline:auto;display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:#f9fafb;color:var(--faint);font:inherit;font-size:13.5px;cursor:pointer;text-align:left}
html.pb-v4 .pbv4-search kbd{margin-left:auto;font:600 11px var(--font-sans);border:1px solid var(--line);border-radius:6px;padding:1px 6px;background:var(--paper)}
html.pb-v4 .pbv4-tc{display:inline-flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--v4-term-line);background:var(--v4-term);color:var(--v4-term-text);font:600 13px var(--font-sans);cursor:pointer;white-space:nowrap}
html.pb-v4 .pbv4-tc .pr{font:700 12px var(--font-mono);color:var(--v4-term-ok)}
html.pb-v4 .pbv4-tc .dt{width:7px;height:7px;border-radius:50%;background:var(--v4-term-dim)}
html.pb-v4 .pbv4-tc.new .dt{background:#1FD877;animation:pbv4Ping 1.6s ease-out infinite}
html.pb-v4.pbv4-tc-open .pbv4-tc{box-shadow:0 0 0 3px rgba(var(--v4-green-rgb),.3)}
html.pb-v4.pbv4-tc-open .pbv4-tc .dt{background:#1FD877}
@keyframes pbv4Ping{0%{box-shadow:0 0 0 0 rgba(31,216,119,.7)}100%{box-shadow:0 0 0 8px rgba(31,216,119,0)}}
html.pb-v4 .pbv4-theme{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--muted);display:grid;place-items:center;cursor:pointer;flex:none}
html.pb-v4 .pbv4-theme svg,html.pb-v4 .pbv4-search svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.pb-v4 .pbv4-theme .sun{display:none}html.pb-v4.pbv4-dark .pbv4-theme .sun{display:block}html.pb-v4.pbv4-dark .pbv4-theme .moon{display:none}
html.pb-v4 .signin-bar{position:relative;top:auto}

/* ---------- Terminalcat: closed by default, opens under the top bar ---------- */
html.pb-v4 .assist{display:none!important}
html.pb-v4.pbv4-tc-open .assist{display:flex!important;top:84px!important;right:22px!important;bottom:auto!important;left:auto!important;width:340px!important;max-height:60vh!important}
html.pb-v4 body[data-terminalcat] #app-main{padding-right:0!important}
html.pb-v4 .assist-launcher{display:none!important}

/* ---------- tool search palette ---------- */
html.pb-v4 .pbv4-pal{position:fixed;inset:0;z-index:1000;background:rgba(16,24,40,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;justify-content:center;align-items:flex-start;padding:12vh 16px 16px}
html.pb-v4 .pbv4-pal[hidden]{display:none}
html.pb-v4 .pbv4-pal__box{width:min(560px,100%);background:var(--paper);border-radius:18px;box-shadow:0 24px 54px -18px rgba(16,24,40,.5);overflow:hidden;animation:pbv4Pop .2s ease}
@keyframes pbv4Pop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
html.pb-v4 .pbv4-pal input{width:100%;border:0;border-bottom:1px solid var(--line);padding:16px 18px;font:500 15px var(--font-sans);outline:0;background:transparent;color:var(--ink)}
html.pb-v4 .pbv4-pal ul{list-style:none;margin:0;padding:8px;max-height:50vh;overflow:auto}
html.pb-v4 .pbv4-pal li button{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border:0;border-radius:12px;background:transparent;font:600 14px var(--font-sans);color:var(--ink);cursor:pointer;text-align:left}
html.pb-v4 .pbv4-pal li button:hover,html.pb-v4 .pbv4-pal li button.on{background:var(--soft)}
html.pb-v4 .pbv4-pal li img{width:30px;height:30px}

/* ---------- Home ---------- */
html.pb-v4 .pbv4-home .home-head,html.pb-v4 .pbv4-home .home-category{display:none!important}
html.pb-v4 .pbv4-welcome{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:30px 34px;margin:8px 0 28px;background:var(--paper);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow-soft)}
html.pb-v4 .pbv4-welcome::after{content:"";position:absolute;right:-60px;top:-80px;width:320px;height:320px;border-radius:50%;background:radial-gradient(closest-side,rgba(31,216,119,.16),transparent);pointer-events:none}
html.pb-v4 .pbv4-welcome h2{font:700 32px/1.15 var(--font-display);margin:0;color:var(--ink)}
html.pb-v4 .pbv4-welcome h2 em{font-style:normal;background:var(--v4-brand);-webkit-background-clip:text;background-clip:text;color:transparent}
html.pb-v4 .pbv4-welcome p{margin:10px 0 20px;color:var(--muted);font-size:15.5px;max-width:52ch}
html.pb-v4 .pbv4-welcome .row{display:flex;gap:12px;flex-wrap:wrap}
html.pb-v4 .pbv4-welcome .row button{padding:12px 24px;font-size:15px;cursor:pointer}
html.pb-v4 .pbv4-welcome img{width:170px;height:auto;position:relative;z-index:1}
html.pb-v4 .pbv4-sec{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 12px}
html.pb-v4 .pbv4-sec h2{font:600 19px var(--font-display);margin:0;color:var(--ink)}
html.pb-v4 .pbv4-sec span{font-size:12.5px;color:var(--faint)}
html.pb-v4 .pbv4-mq{overflow:hidden;padding:6px 0 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);margin-bottom:24px}
html.pb-v4 .pbv4-mq__track{display:flex;gap:14px;width:max-content;animation:pbv4Mq 48s linear infinite}
html.pb-v4 .pbv4-mq:hover .pbv4-mq__track,html.pb-v4 .pbv4-mq:focus-within .pbv4-mq__track{animation-play-state:paused}
@keyframes pbv4Mq{from{transform:translateX(calc(-50% - 7px))}to{transform:translateX(0)}}
html.pb-v4 .pbv4-tool{width:300px;flex:none;display:flex;gap:14px;align-items:flex-start;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--paper);box-shadow:var(--shadow-soft);cursor:pointer;text-align:left;font:inherit;color:inherit;transition:border-color .15s,box-shadow .15s}
html.pb-v4 .pbv4-tool:hover{border-color:var(--line-strong);box-shadow:var(--shadow-soft-hover)}
html.pb-v4 .pbv4-tool img{width:52px;height:52px;flex:none;filter:drop-shadow(0 6px 10px rgba(16,24,40,.18));transition:transform .2s}
html.pb-v4 .pbv4-tool:hover img{transform:scale(1.06) rotate(-3deg)}
html.pb-v4 .pbv4-tool b{display:flex;align-items:center;gap:8px;font-size:14.5px;color:var(--ink)}
html.pb-v4 .pbv4-tool span{display:block;font-size:13px;color:var(--muted);margin-top:2px}
html.pb-v4 .pbv4-tool i{font-style:normal;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:999px;background:#e8fbf1;color:#067647}
html.pb-v4 .pbv4-tool i.prem{background:var(--v4-brand);color:#fff}

/* ---------- Run log stays a black terminal ---------- */
html.pb-v4 .terminal{border-radius:16px!important}

@media (max-width:900px){
  html.pb-v4 .pbv4-top{padding:0 14px;gap:8px}html.pb-v4 .pbv4-search{display:none}html.pb-v4 .pbv4-tc .tx{display:none}html.pb-v4 .pbv4-tc{margin-left:auto;padding:0 12px}
  html.pb-v4 .pbv4-welcome{grid-template-columns:minmax(0,1fr);padding:22px}html.pb-v4 .pbv4-welcome img{display:none}html.pb-v4 .pbv4-welcome h2{font-size:25px}
  html.pb-v4.pbv4-tc-open .assist{top:auto!important;bottom:12px!important;left:12px!important;right:12px!important;width:auto!important}
}
@media (prefers-reduced-motion:reduce){html.pb-v4 .pbv4-mq{overflow-x:auto;-webkit-mask-image:none;mask-image:none}html.pb-v4 .pbv4-mq__track{animation:none}html.pb-v4 .pbv4-mq__track [aria-hidden="true"]{display:none}html.pb-v4 .btn-primary::after{display:none}}

/* ===================== DARK MODE (terminals turn white) ===================== */
html.pb-v4.pbv4-dark{color-scheme:dark;
  --pb-warm-50:#0b0f17;--pb-warm-100:#1b2334;--pb-gray-200:#263147;--pb-gray-300:#36425c;--pb-gray-500:#808a9c;--pb-gray-600:#b6becd;--pb-ink-900:#f2f4f7;
  --cream:#0b0f17;--paper:#121826;--ink:#f2f4f7;--muted:#b6becd;--faint:#808a9c;--line:#263147;--line-strong:#36425c;--soft:#1b2334;--text:#f2f4f7;--bg:#0b0f17;--bg-elevated:#121826;--bg-soft:#1b2334;--border:#263147;--border-strong:#36425c;
  --terminal:#ffffff;--terminal-raised:#f4f6fa;--line-dark:#e4e7ec;--terminal-text:#344054;--terminal-muted:#475467;--terminal-dim:#667085;
  --pb-console-bg:#ffffff;--pb-console-raised:#f4f6fa;--pb-console-line:#e4e7ec;--pb-console-text:#344054;--pb-console-muted:#475467;--pb-console-dim:#667085;
  --v4-term:#ffffff;--v4-term-2:#f4f6fa;--v4-term-line:#e4e7ec;--v4-term-text:#101828;--v4-term-dim:#98a2b3;--v4-term-ok:#067647;
  --shadow-soft:0 1px 2px rgba(0,0,0,.4),0 6px 16px -8px rgba(0,0,0,.6)}
html.pb-v4.pbv4-dark .pbv4-top{background:rgba(18,24,38,.9)}
html.pb-v4.pbv4-dark .pbv4-search{background:#161e2d}
html.pb-v4.pbv4-dark .sidebar__logo{background:#fff;border-radius:10px;padding:4px 8px}
html.pb-v4.pbv4-dark .btn--secondary,html.pb-v4.pbv4-dark .pbv4-btn2,html.pb-v4.pbv4-dark .tool-back{background:linear-gradient(180deg,#1d2638,#151c2b)!important;color:var(--ink)!important;box-shadow:0 4px 12px -6px rgba(0,0,0,.6)!important}
html.pb-v4.pbv4-dark .dropzone{background:#161e2d!important}
html.pb-v4.pbv4-dark .dropzone:hover{background:rgba(59,130,246,.12)!important}
html.pb-v4.pbv4-dark .step-heading__num{background:#e4e7ec!important;color:#0b0f17!important}
html.pb-v4.pbv4-dark .signin-bar{background:rgba(18,24,38,.92)}
html.pb-v4.pbv4-dark .pbv4-tool i{background:rgba(31,216,119,.14);color:#4ade80}
html.pb-v4.pbv4-dark .btn-primary:disabled{background:#1b2334!important;color:#808a9c!important;border-color:#263147!important}
html.pb-v4.pbv4-dark input,html.pb-v4.pbv4-dark select,html.pb-v4.pbv4-dark textarea{background:#161e2d;color:var(--ink);border-color:var(--line)}

/* ---------- phase 1 fixes ---------- */
html.pb-v4 .pbv4-home .home-updates{display:none!important}
html.pb-v4 .sidebar__workflow-btn,html.pb-v4 .sidebar__workflow-btn *{color:#fff!important}
html.pb-v4 .tool-terminal-note{display:none!important}
html.pb-v4 .tool-quota{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:2px 0 10px!important}
html.pb-v4 .tool-quota__lines{display:flex;flex-wrap:wrap;gap:4px 14px}
html.pb-v4 .tool-quota__line{font-size:12.5px!important;color:var(--faint)!important;margin:0!important}
html.pb-v4 .tool-hero h1{font-size:30px!important;line-height:1.15}
html.pb-v4 .tool-hero__mascot.pbv4-ic{width:56px!important;height:56px!important;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(16,24,40,.2))}

/* ===================== Mockup Generator (phase 2) ===================== */
/* Quick Smart O retired, engine cards slimmed */
html.pb-v4 .mockup-tab--opti,html.pb-v4 .pb-cube,html.pb-v4 .pb-engine-help{display:none!important}
html.pb-v4 .mockup-shell .tool-hero > p:not(.pbv4-sub){display:none!important}
html.pb-v4 .pbv4-sub{margin:6px 0 0;color:var(--muted);font-size:15px}
html.pb-v4 .mockup-tabs{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
html.pb-v4 .mockup-tab{border-radius:16px!important;border:1px solid var(--line)!important;background:var(--paper)!important;box-shadow:var(--shadow-soft)!important;text-align:left}
html.pb-v4 .mockup-tab.is-active{border:1.5px solid var(--v4-blue)!important;background:rgba(37,99,235,.04)!important}
html.pb-v4 .mockup-tab__ribbon,html.pb-v4 .mockup-tab__num,html.pb-v4 .mockup-tab .pb-ver{display:none!important}
html.pb-v4 .mockup-tab--complex .mockup-tab__title::after{content:"Recommended";margin-left:8px;font:700 10.5px var(--font-sans);padding:2px 8px;border-radius:999px;background:#e8fbf1;color:#067647;vertical-align:middle}
/* hide engine plumbing the user does not need */
html.pb-v4.pbv4-mockup .mockup-col-rail,html.pb-v4.pbv4-mockup .mockup-col-main > .eyebrow,html.pb-v4.pbv4-mockup .mockup-col-main > .guides{display:none!important}
html.pb-v4.pbv4-mockup .mockup-complex-layout{grid-template-columns:minmax(0,1fr)!important;display:block!important}
html.pb-v4.pbv4-mockup .pbv4-set-src:not(.pbv4-in-modal){display:none!important}

/* sister sections */
html.pb-v4 .pbv4-sis{position:relative;border-radius:22px!important;padding:18px!important;color:#c9d8f5;border:0!important}
html.pb-v4 .pbv4-sis--psd{background:radial-gradient(120% 140% at 100% 0%,rgba(49,168,255,.35),transparent 55%),linear-gradient(140deg,#061629 0%,#0b2a5c 55%,#1f6feb 100%)!important;box-shadow:0 18px 40px -22px rgba(31,111,235,.7)!important}
html.pb-v4 .pbv4-sis--img{background:radial-gradient(120% 140% at 100% 0%,rgba(192,132,252,.45),transparent 55%),linear-gradient(140deg,#05301c 0%,#0b6b45 50%,#7c3aed 100%)!important;box-shadow:0 18px 40px -22px rgba(124,58,237,.7)!important}
html.pb-v4 .pbv4-sis > label:first-child{color:#fff!important;font:600 16px var(--font-display)!important}
html.pb-v4 .pbv4-sis .lim{color:#c9d8f5!important}
html.pb-v4 .pbv4-sis .dz-hint{display:none!important}
html.pb-v4 .pbv4-sis .folder-drop{position:relative;display:flex!important;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:4px;padding:18px 16px 22px!important;border-radius:16px!important;border:1px solid #cfe0fb!important;background:linear-gradient(180deg,#fff 0%,#eef5ff 100%)!important;cursor:pointer;min-height:0!important}
html.pb-v4 .pbv4-sis--img .folder-drop{border-color:#d6c8fb!important;background:linear-gradient(180deg,#fff 0%,#f4efff 100%)!important}
html.pb-v4 .pbv4-sis .folder-drop > .folder-drop-title,html.pb-v4 .pbv4-sis .folder-drop > .folder-drop-hint{display:none!important}
html.pb-v4 .pbv4-drop{display:flex;flex-direction:column;align-items:center;gap:4px}
html.pb-v4 .pbv4-file{width:100px;height:100px;filter:drop-shadow(0 12px 16px rgba(11,42,92,.35));transition:transform .25s ease}
html.pb-v4 .pbv4-sis--img .pbv4-file{filter:drop-shadow(0 4px 6px rgba(46,16,101,.25)) drop-shadow(0 16px 22px rgba(124,58,237,.45))}
html.pb-v4 .pbv4-title{display:inline-block;font:800 23px/1.2 var(--font-display);letter-spacing:-.02em;color:#0b2a5c;background:linear-gradient(110deg,#0b2a5c 0%,#0b2a5c 40%,#6fc3ff 50%,#0b2a5c 60%,#0b2a5c 100%);background-size:250% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;transition:transform .25s ease}
html.pb-v4 .pbv4-sis--img .pbv4-title{color:#14532d;background-image:linear-gradient(110deg,#14532d 0%,#14532d 40%,#c084fc 50%,#14532d 60%,#14532d 100%)}
html.pb-v4 .pbv4-sis .folder-drop:hover .pbv4-file{transform:scale(1.12)}
html.pb-v4 .pbv4-sis .folder-drop:hover .pbv4-title{transform:scale(1.08);animation:pbv4Sweep 1.4s ease-in-out infinite}
@keyframes pbv4Sweep{0%{background-position:100% 0}70%,100%{background-position:0 0}}
html.pb-v4 .pbv4-lead{font-size:13.5px;color:#2f4f86;max-width:40ch}
html.pb-v4 .pbv4-sis--img .pbv4-lead{color:#3f5b4b}
html.pb-v4 .pbv4-pick{display:inline-flex;align-items:center;gap:8px;margin-top:8px;padding:10px 22px;border-radius:999px;font-weight:600;font-size:14px;color:#fff;background:linear-gradient(120deg,#061629 0%,#0b2a5c 50%,#1f6feb 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 22px -10px rgba(11,42,92,.9)}
html.pb-v4 .pbv4-sis--img .pbv4-pick{background:linear-gradient(120deg,#05301c 0%,#0b6b45 50%,#7c3aed 100%)}
html.pb-v4 .pbv4-pick svg{width:16px;height:16px;stroke:#86c8ff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.pb-v4 .pbv4-sis--img .pbv4-pick svg{stroke:#86efac}
html.pb-v4 .pbv4-tip{position:absolute;left:50%;top:0;z-index:3;transform:translate(-50%,-70%) scale(.9);opacity:0;pointer-events:none;width:max-content;max-width:min(520px,calc(100vw - 48px));text-align:center;font-size:12.5px;font-weight:600;color:#fff;background:#061629;border:1px solid rgba(49,168,255,.45);border-radius:10px;padding:7px 12px;box-shadow:0 12px 26px -10px rgba(6,22,41,.7);transition:opacity .18s,transform .18s}
html.pb-v4 .pbv4-sis--img .pbv4-tip{background:#2e1065;border-color:rgba(192,132,252,.55)}
html.pb-v4 .pbv4-sis .folder-drop:hover .pbv4-tip{opacity:1;transform:translate(-50%,-100%) scale(1)}
html.pb-v4 .pbv4-sis .folder-file-head{color:#fff}
html.pb-v4 .pbv4-sis #psd-file-count,html.pb-v4 .pbv4-sis #design-file-count{color:#fff;font-weight:600}
html.pb-v4 .pbv4-sis .slot-file-clear{border-radius:999px;background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.25)}
html.pb-v4 .pbv4-sis .slot-file-list{background:rgba(255,255,255,.95);border-radius:12px}
html.pb-v4 .pbv4-sis .slot-file-remove:hover{color:#d92d20}
html.pb-v4 .pbv4-flash{animation:pbv4Flash 1s ease}
@keyframes pbv4Flash{30%{box-shadow:0 0 0 5px rgba(245,158,11,.6)}}

/* settings card + pop-up */
html.pb-v4 .pbv4-setcard{border-radius:22px;padding:18px;margin:6px 0 18px;background:radial-gradient(120% 140% at 100% 0%,rgba(129,140,248,.45),transparent 55%),linear-gradient(140deg,#0b0f19 0%,#1e1b4b 55%,#4f46e5 100%);box-shadow:0 18px 40px -22px rgba(79,70,229,.75)}
html.pb-v4 .pbv4-setcard__h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}
html.pb-v4 .pbv4-setcard__h b{color:#fff;font:600 16px var(--font-display)}
html.pb-v4 .pbv4-set-state{font-size:12.5px;color:#c7d2fe}
html.pb-v4 .pbv4-setcard.done .pbv4-set-state{color:#86efac;font-weight:600}
html.pb-v4 .pbv4-setrow{display:flex;gap:12px;align-items:center}
html.pb-v4 .pbv4-setopen{flex:1;min-width:0;display:flex;align-items:center;gap:14px;text-align:left;border:1px solid #c7d2fe;background:linear-gradient(180deg,#fff,#eef0ff);border-radius:14px;padding:12px 14px;cursor:pointer;font:inherit;color:inherit}
html.pb-v4 .pbv4-setopen:hover{border-color:#818cf8}
html.pb-v4 .pbv4-gear{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none;background:linear-gradient(140deg,#0b0f19,#1e1b4b 55%,#4f46e5);box-shadow:0 8px 16px -8px rgba(79,70,229,.8)}
html.pb-v4 .pbv4-gear.sm{width:36px;height:36px;border-radius:10px}
html.pb-v4 .pbv4-gear svg{width:20px;height:20px;stroke:#c7d2fe;fill:none;stroke-width:2;transition:transform .5s}
html.pb-v4 .pbv4-setopen:hover .pbv4-gear svg{transform:rotate(90deg)}
html.pb-v4 .pbv4-setsum{flex:1;min-width:0;display:flex;flex-direction:column}
html.pb-v4 .pbv4-setsum b{color:#1e1b4b;font-size:14px}
html.pb-v4 .pbv4-setline{font-size:12.5px;color:#667085;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.pb-v4 .pbv4-chev{font-size:22px;color:#98a2b3}
html.pb-v4 .pbv4-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;font:600 15px var(--font-sans);cursor:pointer;white-space:nowrap}
html.pb-v4 .pbv4-btn svg{width:16px;height:16px;stroke:#86efac;fill:none;stroke-width:2.5}
html.pb-v4 .pbv4-shiny::after{animation:pbv4Shine2 2.6s ease-in-out infinite!important}
@keyframes pbv4Shine2{0%{transform:translateX(-130%)}60%,100%{transform:translateX(130%)}}
html.pb-v4 .pbv4-setcard.done .pbv4-save-out{background:rgba(255,255,255,.1)!important;color:#86efac!important;border-color:rgba(134,239,172,.45)!important;box-shadow:none!important}
html.pb-v4 .pbv4-setcard.done .pbv4-save-out::after{display:none}
html.pb-v4 .pbv4-btn2{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;font:600 14px var(--font-sans);cursor:pointer}
html.pb-v4 .pbv4-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;background:rgba(16,24,40,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
html.pb-v4 .pbv4-modal[hidden]{display:none}
html.pb-v4 .pbv4-modal__card{width:min(780px,100%);max-height:calc(100vh - 40px);display:flex;flex-direction:column;background:var(--paper);border-radius:20px;box-shadow:0 24px 54px -18px rgba(16,24,40,.5);animation:pbv4Pop .22s ease}
html.pb-v4 .pbv4-modal__h{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:18px 20px;border-bottom:1px solid var(--line)}
html.pb-v4 .pbv4-modal__h h2{font:600 18px var(--font-display);margin:0;color:var(--ink)}
html.pb-v4 .pbv4-modal__h p{margin:2px 0 0;font-size:12.5px;color:var(--faint)}
html.pb-v4 .pbv4-help{margin-left:auto;display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(120deg,#061629,#0b2a5c 50%,#1f6feb);color:#fff;font:600 13px var(--font-sans);cursor:pointer}
html.pb-v4 .pbv4-help svg{width:15px;height:15px;stroke:#31a8ff;fill:none;stroke-width:2}
html.pb-v4 .pbv4-x{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--paper);font-size:20px;color:var(--muted);cursor:pointer}
html.pb-v4 .pbv4-modal__b{padding:20px;overflow:auto}
html.pb-v4 .pbv4-modal__b .card{box-shadow:none!important;border:0!important;padding:0!important}
html.pb-v4 .pbv4-modal__f{display:flex;justify-content:flex-end;gap:10px;padding:14px 20px;border-top:1px solid var(--line);background:var(--soft);border-radius:0 0 20px 20px}
html.pb-v4 .pbv4-guide{border:1px solid rgba(37,99,235,.25);background:#eef4ff;border-radius:14px;padding:14px 16px;margin-bottom:16px;font-size:13px;color:var(--ink)}
html.pb-v4 .pbv4-guide table{width:100%;border-collapse:collapse;margin:8px 0}
html.pb-v4 .pbv4-guide td{padding:6px 0;border-top:1px solid rgba(37,99,235,.15)}
html.pb-v4 .pbv4-guide td:last-child{text-align:right;padding-left:12px}
html.pb-v4 .pbv4-guide i{font-style:normal;font-size:12px;font-weight:700;color:var(--v4-blue);background:#fff;border:1px solid rgba(37,99,235,.3);border-radius:999px;padding:2px 10px;white-space:nowrap}
html.pb-v4 .pbv4-guide p{margin:0;font-size:12.5px;color:var(--muted)}

/* generate states (text untouched) */
html.pb-v4 #generate-btn{border-radius:999px!important;font-weight:700!important}
html.pb-v4 #generate-btn.pbv4-g-empty{background:#f2f4f7!important;color:#8a94a6!important;border:1px solid #e4e7ec!important;box-shadow:none!important}
html.pb-v4 #generate-btn.pbv4-g-partial{background:#fef3c7!important;color:#92400e!important;border:1px solid #fcd34d!important;box-shadow:none!important}
html.pb-v4 #generate-btn.pbv4-g-ready{background:var(--v4-grad-green)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:0 10px 22px -10px rgba(5,48,28,.85)!important}
html.pb-v4 .pbv4-gen-note{margin:8px 0 0;font-size:13px;color:var(--faint);text-align:center}
html.pb-v4 .pbv4-gen-note.partial{color:#b45309;font-weight:600}
html.pb-v4 .pbv4-gen-note.ready{color:#067647;font-weight:600}
html.pb-v4 .pbv4-probe{margin:10px auto 0;display:flex}

/* dark mode for the mockup parts */
html.pb-v4.pbv4-dark .pbv4-sis .folder-drop{background:linear-gradient(180deg,rgba(6,22,41,.72),rgba(11,42,92,.55))!important;border-color:rgba(49,168,255,.35)!important}
html.pb-v4.pbv4-dark .pbv4-sis--img .folder-drop{background:linear-gradient(180deg,rgba(5,48,28,.7),rgba(46,16,101,.55))!important;border-color:rgba(192,132,252,.4)!important}
html.pb-v4.pbv4-dark .pbv4-title{background-image:linear-gradient(110deg,#eaf3ff 0%,#eaf3ff 40%,#31a8ff 50%,#eaf3ff 60%,#eaf3ff 100%)}
html.pb-v4.pbv4-dark .pbv4-sis--img .pbv4-title{background-image:linear-gradient(110deg,#ecfdf3 0%,#ecfdf3 40%,#c084fc 50%,#ecfdf3 60%,#ecfdf3 100%)}
html.pb-v4.pbv4-dark .pbv4-lead{color:#b7cdf3}
html.pb-v4.pbv4-dark .pbv4-sis--img .pbv4-lead{color:#c7e9d5}
html.pb-v4.pbv4-dark .pbv4-sis .slot-file-list{background:rgba(18,24,38,.9)}
html.pb-v4.pbv4-dark .pbv4-setopen{background:linear-gradient(180deg,rgba(11,15,25,.7),rgba(30,27,75,.6));border-color:rgba(165,180,252,.35)}
html.pb-v4.pbv4-dark .pbv4-setsum b{color:#eef0ff}
html.pb-v4.pbv4-dark .pbv4-guide{background:rgba(59,130,246,.12)}
html.pb-v4.pbv4-dark .pbv4-guide i{background:#121826}
html.pb-v4.pbv4-dark #generate-btn.pbv4-g-empty{background:#1b2334!important;color:#808a9c!important;border-color:#263147!important}
html.pb-v4.pbv4-dark #generate-btn.pbv4-g-partial{background:rgba(245,158,11,.14)!important;color:#fbbf24!important;border-color:rgba(245,158,11,.45)!important}
@media (max-width:760px){html.pb-v4 .mockup-tabs{grid-template-columns:minmax(0,1fr)!important}html.pb-v4 .pbv4-setrow{flex-direction:column;align-items:stretch}html.pb-v4 .pbv4-help{order:3;margin-left:0}}
@media (prefers-reduced-motion:reduce){html.pb-v4 .pbv4-shiny::after{animation:none!important}html.pb-v4 .pbv4-sis .folder-drop:hover .pbv4-title{animation:none}}

/* phase 2 fixes: own drawings win over the legacy dropzone icons; time-limit switch removed */
html.pb-v4 #pb-limit-switch{display:none!important}
html.pb-v4 .pbv4-sis .folder-drop > *:not(.pbv4-drop):not(input){display:none!important}
html.pb-v4 .pbv4-sis .folder-drop svg.pbv4-file{width:104px!important;height:104px!important;max-width:none!important;background:none!important;border:0!important;padding:0!important;border-radius:0!important;box-shadow:none!important;display:block!important}
html.pb-v4 .pbv4-sis .folder-drop .pbv4-pick svg{width:16px!important;height:16px!important;background:none!important;border:0!important;padding:0!important;box-shadow:none!important;border-radius:0!important}
html.pb-v4 .pbv4-setcard__h b{display:none}
html.pb-v4 .pbv4-setcard__h{justify-content:flex-end;margin-top:-6px}

/* ===================== Mockup Generator = approved preview layout (phase 3) ===================== */
/* the engine panel keeps running off-screen (Photopea iframe must stay rendered) */
html.pb-v4.pbv4-m-on .mockup-tab-panel{position:absolute!important;left:-300vw!important;top:0!important;width:1100px!important;opacity:0!important;pointer-events:none!important}
html.pb-v4.pbv4-m-on .mockup-shell{max-width:1500px!important;width:100%!important}
html.pb-v4.pbv4-m-on .tool-faq{max-width:1100px;margin-inline:auto}
html.pb-v4 .pbv4-m{display:grid;grid-template-columns:260px minmax(0,1fr) 330px;gap:22px;align-items:start;margin:20px 0 40px}
html.pb-v4 .pbv4-mid{display:flex;flex-direction:column;gap:18px;min-width:0}
html.pb-v4 .pbv4-step{display:flex;align-items:center;gap:10px;margin-bottom:14px}
html.pb-v4 .pbv4-step h2{font:600 16px var(--font-display);margin:0;color:#fff}
html.pb-v4 .pbv4-n{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;flex:none;background:#31a8ff;color:#061629}
html.pb-v4 .pbv4-sis--img .pbv4-n{background:#86efac;color:#05301c}
html.pb-v4 .pbv4-setcard .pbv4-n{background:#a5b4fc;color:#1e1b4b}
html.pb-v4 .pbv4-n.done{background:#1FD877!important;color:#04260f!important}
html.pb-v4 .pbv4-cnt,html.pb-v4 .pbv4-set-state{margin-left:auto;font-size:12.5px;color:#c9d8f5}
html.pb-v4 .pbv4-setcard.done .pbv4-set-state{color:#86efac;font-weight:600}
html.pb-v4 .pbv4-m .pbv4-setcard{margin:0}
html.pb-v4 .pbv4-dz{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding:18px 16px 22px;border-radius:16px;border:1px solid #cfe0fb;background:linear-gradient(180deg,#fff 0%,#eef5ff 100%);cursor:pointer;box-shadow:0 10px 24px -14px rgba(6,22,41,.6);transition:border-color .15s}
html.pb-v4 .pbv4-sis--img .pbv4-dz{border-color:#d6c8fb;background:linear-gradient(180deg,#fff 0%,#f4efff 100%)}
html.pb-v4 .pbv4-dz:hover,html.pb-v4 .pbv4-dz.over{border-color:#9cc3f5}
html.pb-v4 .pbv4-sis--img .pbv4-dz:hover,html.pb-v4 .pbv4-sis--img .pbv4-dz.over{border-color:#a78bfa}
html.pb-v4 .pbv4-dz:hover .pbv4-file,html.pb-v4 .pbv4-dz:focus-visible .pbv4-file,html.pb-v4 .pbv4-dz.over .pbv4-file{transform:scale(1.12)}
html.pb-v4 .pbv4-dz:hover .pbv4-title,html.pb-v4 .pbv4-dz:focus-visible .pbv4-title,html.pb-v4 .pbv4-dz.over .pbv4-title{transform:scale(1.08);animation:pbv4Sweep 1.4s ease-in-out infinite}
html.pb-v4 .pbv4-dz:hover .pbv4-tip,html.pb-v4 .pbv4-dz:focus-visible .pbv4-tip{opacity:1;transform:translate(-50%,-100%) scale(1)}
html.pb-v4 .pbv4-dz .pbv4-file{width:104px;height:104px}

/* files panel */
html.pb-v4 .pbv4-files{position:sticky;top:84px;padding:14px;display:flex;flex-direction:column;gap:12px;max-height:calc(100vh - 110px);background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-soft)}
html.pb-v4 .pbv4-files__h{display:flex;justify-content:space-between;align-items:baseline}
html.pb-v4 .pbv4-files__h b{font:600 15px var(--font-display);color:var(--ink)}
html.pb-v4 .pbv4-files__h span{font-size:12px;color:var(--faint)}
html.pb-v4 .pbv4-ftabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--soft);border-radius:12px;padding:4px}
html.pb-v4 .pbv4-ftabs button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:38px;border:0;border-radius:9px;background:transparent;font:600 13px var(--font-sans);color:var(--faint);cursor:pointer}
html.pb-v4 .pbv4-ftabs em{font-style:normal;font-size:11px;min-width:20px;padding:1px 6px;border-radius:999px;background:var(--line);color:var(--muted)}
html.pb-v4 .pbv4-ftabs button[aria-selected="true"]{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-soft-hover)}
html.pb-v4 .pbv4-ftabs button[aria-selected="true"][data-ft="psd"] em{background:#1f6feb;color:#fff}
html.pb-v4 .pbv4-ftabs button[aria-selected="true"][data-ft="design"] em{background:#1FD877;color:#04260f}
html.pb-v4 .mini{display:inline-grid;place-items:center;font:800 8.5px/1 var(--font-sans);letter-spacing:.04em;color:#fff;border-radius:4px;padding:3px 4px;flex:none}
html.pb-v4 .mini.psd{background:linear-gradient(135deg,#31a8ff,#1f6feb)}
html.pb-v4 .mini.img{background:linear-gradient(135deg,#7c3aed,#1FD877)}
html.pb-v4 .mini.big{font-size:12px;padding:8px 9px;border-radius:8px}
html.pb-v4 .pbv4-flist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;overflow:auto;min-height:0}
html.pb-v4 .pbv4-flist li{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 10px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
html.pb-v4 .pbv4-flist .th{width:34px;height:34px;border-radius:8px;flex:none;display:grid;place-items:center}
html.pb-v4 .pbv4-flist .th.psd{background:linear-gradient(140deg,#061629,#0b2a5c 55%,#1f6feb)}
html.pb-v4 .pbv4-flist .th.img{background:linear-gradient(140deg,#5b21b6,#8b5cf6 60%,#1FD877)}
html.pb-v4 .pbv4-flist .nm{flex:1;min-width:0}
html.pb-v4 .pbv4-flist .nm b{display:block;font-size:12.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.pb-v4 .pbv4-flist .fx{width:28px;height:28px;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--faint);font-size:17px;line-height:1;cursor:pointer;flex:none}
html.pb-v4 .pbv4-flist .fx:hover{background:#fee4e2;color:#d92d20;border-color:#fecdca}
html.pb-v4 .pbv4-fempty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;padding:22px 8px;border:1px dashed var(--line-strong);border-radius:12px;color:var(--faint);font-size:12.5px}
html.pb-v4 .pbv4-fempty[hidden]{display:none}
html.pb-v4 .pbv4-fempty b{color:var(--ink);font-size:13.5px}
html.pb-v4 .pbv4-fclear{justify-content:center;width:100%}
html.pb-v4 .pbv4-fclear svg,html.pb-v4 .pbv4-btn2 svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.pb-v4 .pbv4-fclear svg{stroke:#d92d20}
html.pb-v4 .pbv4-fclear:hover{color:#d92d20!important;border-color:#fecdca!important}

/* this run */
html.pb-v4 .pbv4-sum{position:sticky;top:84px;display:flex;flex-direction:column;gap:14px}
html.pb-v4 .pbv4-sumcard{display:flex;flex-direction:column;gap:14px;padding:20px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-soft)}
html.pb-v4 .pbv4-cap{font-size:12px;color:var(--faint);margin:0}
html.pb-v4 .pbv4-big{font:700 30px/1 var(--font-display);color:var(--ink);letter-spacing:-.02em;margin-bottom:6px}
html.pb-v4 .pbv4-ready{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;font-size:13px;color:var(--muted)}
html.pb-v4 .pbv4-ready li{display:flex;align-items:center;gap:9px}
html.pb-v4 .pbv4-ready i{width:18px;height:18px;border-radius:50%;border:1.5px dashed var(--line-strong);display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;flex:none}
html.pb-v4 .pbv4-ready li.ok{color:var(--ink);font-weight:600}
html.pb-v4 .pbv4-ready li.ok i{border:0;background:#1FD877;color:#04260f}
html.pb-v4 .pbv4-ready li.ok i::before{content:"✓"}
html.pb-v4 .pbv4-ready li.miss{color:#92400e}
html.pb-v4 .pbv4-ready li.miss i{border-color:#f59e0b}
html.pb-v4 .pbv4-sumcard hr{border:0;border-top:1px solid var(--line);margin:0}
html.pb-v4 .pbv4-sumcard dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 12px;font-size:13px}
html.pb-v4 .pbv4-sumcard dt{color:var(--faint)}
html.pb-v4 .pbv4-sumcard dd{margin:0;text-align:right;color:var(--ink);font-weight:600}
html.pb-v4 .pbv4-gen{position:relative;overflow:hidden;width:100%;min-height:50px;border-radius:999px;border:1px solid var(--line);font:700 15px var(--font-sans);cursor:pointer;transition:filter .2s,transform .15s}
html.pb-v4 .pbv4-gen[data-state="empty"],html.pb-v4 .pbv4-gen[data-state="busy"]{background:var(--soft);color:var(--faint);cursor:not-allowed}
html.pb-v4 .pbv4-gen[data-state="partial"]{background:#fef3c7;color:#92400e;border-color:#fcd34d}
html.pb-v4 .pbv4-gen[data-state="partial"]:hover{background:#fde68a}
html.pb-v4 .pbv4-gen[data-state="ready"]{background:var(--v4-grad-green);color:#fff;border-color:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 22px -10px rgba(5,48,28,.85)}
html.pb-v4 .pbv4-gen[data-state="ready"]:hover{filter:brightness(1.1);transform:translateY(-1px)}
html.pb-v4 .pbv4-gen[data-state="ready"]::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.45) 48%,transparent 66%);transform:translateX(-130%);animation:pbv4Shine2 2.6s ease-in-out infinite}
html.pb-v4 .pbv4-probe{justify-content:center;width:100%}
html.pb-v4 .pbv4-note{margin:0;text-align:center;font-size:12.5px;color:var(--faint)}
html.pb-v4 .pbv4-note[hidden]{display:none}
html.pb-v4 .pbv4-prog{display:flex;flex-direction:column;gap:8px}
html.pb-v4 .pbv4-prog[hidden],html.pb-v4 .pbv4-done[hidden]{display:none}
html.pb-v4 .pbv4-prog__t{display:flex;justify-content:space-between;font-size:13px;color:var(--muted)}
html.pb-v4 .pbv4-bar{height:8px;border-radius:999px;background:var(--soft);overflow:hidden}
html.pb-v4 .pbv4-bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#0b7a4b,#1FD877);transition:width .25s}
html.pb-v4 .pbv4-done{display:flex;flex-direction:column;gap:12px;animation:pbv4Pop .25s ease}
html.pb-v4 .pbv4-done__h{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px;background:#e8fbf1;border:1px solid rgba(31,216,119,.35)}
html.pb-v4 .pbv4-done__ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--v4-grad-green);flex:none}
html.pb-v4 .pbv4-done__ic svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:3}
html.pb-v4 .pbv4-done__h b{display:block;color:var(--ink);font-size:14.5px}
html.pb-v4 .pbv4-done__h span{font-size:12.5px;color:#067647}
html.pb-v4 .pbv4-row{display:flex;gap:8px;flex-wrap:wrap}
html.pb-v4 .pbv4-log{border-radius:16px;overflow:hidden;background:var(--v4-term);border:1px solid var(--v4-term-line)}
html.pb-v4 .pbv4-log__h{display:flex;align-items:center;gap:8px;padding:9px 14px;background:var(--v4-term-2);border-bottom:1px solid var(--v4-term-line);font:600 12px var(--font-sans);color:var(--v4-term-text)}
html.pb-v4 .pbv4-log__h .dt{width:7px;height:7px;border-radius:50%;background:#1FD877}
html.pb-v4 .pbv4-log__h span:last-child{margin-left:auto;font-size:11px;color:var(--v4-term-ok)}
html.pb-v4 .pbv4-log__b{padding:12px 14px 16px;font:500 12px/1.6 var(--font-mono);color:var(--v4-term-text);max-height:220px;overflow:auto}
html.pb-v4 .pbv4-log__b .ok{color:var(--v4-term-ok)}
html.pb-v4 .pbv4-log__b .warn{color:#fbbf24}
html.pb-v4 .pbv4-caret{display:inline-block;width:7px;height:14px;background:var(--v4-term-ok);vertical-align:-2px;animation:pbv4Blink 1s steps(1) infinite}
@keyframes pbv4Blink{50%{opacity:0}}

/* dark */
html.pb-v4.pbv4-dark .pbv4-dz{background:linear-gradient(180deg,rgba(6,22,41,.72),rgba(11,42,92,.55));border-color:rgba(49,168,255,.35)}
html.pb-v4.pbv4-dark .pbv4-sis--img .pbv4-dz{background:linear-gradient(180deg,rgba(5,48,28,.7),rgba(46,16,101,.55));border-color:rgba(192,132,252,.4)}
html.pb-v4.pbv4-dark .pbv4-gen[data-state="partial"]{background:rgba(245,158,11,.14);color:#fbbf24;border-color:rgba(245,158,11,.45)}
html.pb-v4.pbv4-dark .pbv4-ready li.miss{color:#fbbf24}
html.pb-v4.pbv4-dark .pbv4-done__h{background:rgba(31,216,119,.12)}
html.pb-v4.pbv4-dark .pbv4-done__h span{color:#4ade80}
html.pb-v4.pbv4-dark .pbv4-log__b .warn{color:#b45309}

@media (max-width:1400px){html.pb-v4 .pbv4-m{grid-template-columns:minmax(0,1fr) 320px}html.pb-v4 .pbv4-files{grid-column:1/-1;position:static;max-height:none}html.pb-v4 .pbv4-flist{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}
@media (max-width:1100px){html.pb-v4 .pbv4-m{grid-template-columns:minmax(0,1fr)}html.pb-v4 .pbv4-sum{position:static}}

/* engine cards: preview wording */
html.pb-v4 .mockup-tab__head > :not(.mockup-tab__title){display:none!important}
html.pb-v4 .mockup-tab--complex .mockup-tab-desc,html.pb-v4 .mockup-tab--vortex .mockup-tab-desc{font-size:0!important}
html.pb-v4 .mockup-tab--complex .mockup-tab-desc::after{content:"Any PSD, one or many smart objects · in your browser";font-size:13px;color:var(--faint)}
html.pb-v4 .mockup-tab--vortex .mockup-tab-desc::after{content:"Renders on our server · big PSDs, slow PCs";font-size:13px;color:var(--faint)}
html.pb-v4 .mockup-tab--vortex .mockup-tab-desc .pb-vortex-up{display:block;font-size:12.5px!important;margin-top:6px;color:var(--v4-purple)}

/* FAQ removed from the bottom of every page (user request 2026-10-28) */
html.pb-v4 .tool-faq,html.pb-v4 .home-faq{display:none!important}

/* ===================== phase 4: match the preview exactly ===================== */
/* engine = small switch with hover explanations (old cards hidden) */
html.pb-v4 .mockup-tabs,html.pb-v4 .mockup-mode-hint{display:none!important}
html.pb-v4 .pbv4-engt{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:18px 0 4px;padding:12px 16px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-soft);width:max-content;max-width:100%}
html.pb-v4 .pbv4-engt > b{font:600 15px var(--font-display);color:var(--ink);margin-right:6px}
html.pb-v4 .pbv4-tg{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--soft)}
html.pb-v4 .pbv4-tg button{position:relative;display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:6px 16px;border:0;border-radius:999px;background:transparent;font:600 13.5px var(--font-sans);color:var(--faint);cursor:pointer}
html.pb-v4 .pbv4-tg button[aria-pressed="true"]{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-soft-hover)}
html.pb-v4 .pbv4-tg button[aria-pressed="true"][data-e="complex"]{box-shadow:0 0 0 1.5px var(--v4-blue),var(--shadow-soft-hover)}
html.pb-v4 .pbv4-tg button[aria-pressed="true"][data-e="vortex"]{box-shadow:0 0 0 1.5px var(--v4-purple),var(--shadow-soft-hover)}
html.pb-v4 .pbv4-tg i{font-style:normal;font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:999px;background:linear-gradient(90deg,#2563eb,#7c3aed);color:#fff}
html.pb-v4 .pbv4-tg .lk{display:none;font-style:normal;font-size:10px;font-weight:800;padding:2px 6px;border-radius:999px;background:var(--soft);color:var(--faint);border:1px solid var(--line)}
html.pb-v4 .pbv4-tg button.locked .lk{display:inline-block}
html.pb-v4 .pbv4-tg .pop{position:absolute;left:50%;bottom:calc(100% + 10px);transform:translateX(-50%) translateY(4px);opacity:0;pointer-events:none;width:max-content;max-width:260px;white-space:normal;text-align:center;font-size:12.5px;font-weight:600;color:#fff;background:#101828;border-radius:10px;padding:8px 12px;box-shadow:0 12px 26px -10px rgba(16,24,40,.6);transition:opacity .15s,transform .15s;z-index:5}
html.pb-v4 .pbv4-tg .pop::after{content:"";position:absolute;left:50%;top:100%;transform:translateX(-50%);border:6px solid transparent;border-top-color:#101828}
html.pb-v4 .pbv4-tg button:hover .pop,html.pb-v4 .pbv4-tg button:focus-visible .pop{opacity:1;transform:translateX(-50%) translateY(0)}
html.pb-v4 .pbv4-engt .pbv4-n{background:#1FD877;color:#04260f}

/* page header: How it works on the right */
html.pb-v4 .mockup-shell .tool-hero{position:relative}
html.pb-v4 .pbv4-how{position:absolute;right:0;bottom:4px;text-decoration:none;font-size:13px}
html.pb-v4 .pbv4-how svg{width:15px;height:15px;stroke:var(--v4-blue);fill:none;stroke-width:2}

/* settings pop-up controls (preview) */
html.pb-v4 .pbv4-modal__b{display:flex;flex-direction:column;gap:18px}
html.pb-v4 .pbv4-modal__b .pbv4-guide{margin:0}
html.pb-v4 .pbv4-lbl{display:block;font:600 13px var(--font-sans);color:var(--ink);margin-bottom:8px}
html.pb-v4 .pbv4-choices{display:grid;gap:10px}
html.pb-v4 .pbv4-choices.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
html.pb-v4 .pbv4-choices.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
html.pb-v4 .pbv4-choice{position:relative;text-align:left;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:14px 14px 14px 42px;display:flex;flex-direction:column;gap:2px;cursor:pointer;font:inherit;color:inherit;transition:border-color .15s,background .15s}
html.pb-v4 .pbv4-choice::before{content:"";position:absolute;left:14px;top:16px;width:16px;height:16px;border-radius:50%;border:1.5px solid var(--line-strong);background:var(--paper);box-sizing:border-box}
html.pb-v4 .pbv4-choice:hover{border-color:var(--line-strong)}
html.pb-v4 .pbv4-choice b{color:var(--ink);font-size:14px}
html.pb-v4 .pbv4-choice span{font-size:12.5px;color:var(--faint)}
html.pb-v4 .pbv4-choice code{font:500 11px/1.5 var(--font-mono);color:var(--faint);background:var(--soft);border-radius:8px;padding:6px 8px;margin-top:6px;white-space:pre}
html.pb-v4 .pbv4-choice[aria-pressed="true"]{border:1.5px solid var(--v4-blue);background:rgba(37,99,235,.04);padding:13.5px 13.5px 13.5px 41.5px}
html.pb-v4 .pbv4-choice[aria-pressed="true"]::before{border:5px solid var(--v4-blue)}
html.pb-v4 .pbv4-sub2{margin-top:12px;max-width:460px}
html.pb-v4 .pbv4-sub2[hidden]{display:none}
html.pb-v4 .pbv4-inp{width:100%;min-height:40px;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font:inherit;color:var(--ink);background:var(--paper);box-sizing:border-box}
html.pb-v4 .pbv4-hint{font-size:12px;color:var(--faint);margin:6px 0 0}
html.pb-v4 .pbv4-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
html.pb-v4 .pbv4-seg{display:flex;background:var(--soft);border-radius:999px;padding:3px;gap:3px}
html.pb-v4 .pbv4-seg button{flex:1;min-height:36px;border:0;background:transparent;border-radius:999px;padding:6px 12px;font:600 13px var(--font-sans);color:var(--faint);cursor:pointer}
html.pb-v4 .pbv4-seg button:hover{color:var(--ink)}
html.pb-v4 .pbv4-seg button[aria-pressed="true"]{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-soft-hover)}
@media (max-width:760px){html.pb-v4 .pbv4-choices.c4,html.pb-v4 .pbv4-choices.c2,html.pb-v4 .pbv4-two{grid-template-columns:minmax(0,1fr)}html.pb-v4 .pbv4-how{position:static;margin-top:10px}}

/* top bar plan chip */
html.pb-v4 .pbv4-plan{font:600 12px var(--font-sans);padding:6px 12px;border-radius:999px;white-space:nowrap;background:var(--soft);color:var(--muted);border:1px solid var(--line)}
html.pb-v4 .pbv4-plan[hidden]{display:none}
html.pb-v4 .pbv4-plan.prem{background:linear-gradient(var(--paper),var(--paper)) padding-box,var(--v4-brand) border-box;border:1.5px solid transparent;color:var(--ink)}
html.pb-v4 .pbv4-plan.paid{background:#e8fbf1;color:#067647;border-color:rgba(31,216,119,.35)}
@media (max-width:1100px){html.pb-v4 .pbv4-plan{display:none}}

/* sidebar: Home item at the top, plan/account box at the bottom */
html.pb-v4 .pbv4-homelink{display:flex;align-items:center;gap:12px;cursor:pointer}
html.pb-v4 .pbv4-homelink svg{width:22px;height:22px;margin:0 3px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linejoin:round;flex:none}
html.pb-v4 .sidebar__points{order:20;margin:8px 10px 12px!important;padding:10px 12px!important}
html.pb-v4 .sidebar__points-value{font-size:14px!important;font-family:var(--font-display)}
html.pb-v4 .sidebar__points-meta{display:none!important}

/* Home: same as the preview (no long text sections) */
html.pb-v4 .pbv4-home .home-stories{display:none!important}
html.pb-v4.pbv4-dark .pbv4-tg .pop{background:#f2f4f7;color:#101828}
html.pb-v4.pbv4-dark .pbv4-tg .pop::after{border-top-color:#f2f4f7}

/* ===================== phase 5: Vortex in the same layout + one-screen fit ===================== */
html.pb-v4.pbv4-m-on.pbv4-vort #pb-vortex-host{position:absolute!important;left:-300vw!important;top:0!important;width:1100px!important;opacity:0!important;pointer-events:none!important}
html.pb-v4 .pbv4-m.is-vortex .pbv4-probe{display:none}

/* header row: title left, engine switch + How it works right */
html.pb-v4.pbv4-mockup .tool-back{margin-bottom:6px}
html.pb-v4.pbv4-mockup .mockup-shell .tool-hero{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:18px;align-items:end;margin-bottom:0}
html.pb-v4.pbv4-mockup .tool-hero__row,html.pb-v4.pbv4-mockup .pbv4-sub{grid-column:1}
html.pb-v4.pbv4-mockup .tool-hero h1{font-size:26px!important}
html.pb-v4.pbv4-mockup .pbv4-sub{font-size:14px;margin-top:2px}
html.pb-v4.pbv4-mockup .pbv4-engt{grid-column:2;grid-row:1/3;align-self:end;margin:0;padding:8px 10px 8px 14px}
html.pb-v4.pbv4-mockup .pbv4-engt .pbv4-how{position:static;margin-left:6px;padding:8px 14px}

/* compact three-column workspace */
html.pb-v4 .pbv4-m{grid-template-columns:240px minmax(0,1fr) 300px;gap:16px;margin:14px 0 24px}
html.pb-v4 .pbv4-mid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-content:start}
html.pb-v4 .pbv4-mid .pbv4-setcard{grid-column:1/-1}
html.pb-v4 .pbv4-sis{padding:14px!important;border-radius:20px!important}
html.pb-v4 .pbv4-step{margin-bottom:10px}
html.pb-v4 .pbv4-step h2{font-size:15px}
html.pb-v4 .pbv4-dz{padding:12px 12px 16px;gap:3px}
html.pb-v4 .pbv4-dz .pbv4-file{width:72px;height:72px}
html.pb-v4 .pbv4-title{font-size:19px}
html.pb-v4 .pbv4-lead{font-size:12.5px;max-width:30ch}
html.pb-v4 .pbv4-pick{margin-top:6px;padding:8px 16px;font-size:13px}
html.pb-v4 .pbv4-m .pbv4-setcard{padding:14px;border-radius:20px}
html.pb-v4 .pbv4-setopen{padding:10px 12px}
html.pb-v4 .pbv4-gear{width:38px;height:38px}
html.pb-v4 .pbv4-m .pbv4-btn{padding:10px 18px;font-size:14px}
html.pb-v4 .pbv4-files{top:76px;padding:12px;gap:10px;max-height:calc(100vh - 230px)}
html.pb-v4 .pbv4-fempty{padding:16px 8px}
html.pb-v4 .pbv4-sum{top:76px;gap:10px}
html.pb-v4 .pbv4-sumcard{padding:16px;gap:10px}
html.pb-v4 .pbv4-big{font-size:26px;margin-bottom:2px}
html.pb-v4 .pbv4-ready{gap:5px;font-size:12.5px}
html.pb-v4 .pbv4-sumcard dl{gap:5px 10px;font-size:12.5px}
html.pb-v4 .pbv4-gen{min-height:44px;font-size:14.5px}
html.pb-v4 .pbv4-probe{padding:8px 14px}
html.pb-v4 .pbv4-log__b{max-height:110px;padding:10px 12px}
html.pb-v4 .pbv4-log__h{padding:7px 12px}
@media (max-width:1400px){html.pb-v4 .pbv4-m{grid-template-columns:minmax(0,1fr) 300px}}
@media (max-width:1100px){html.pb-v4 .pbv4-m{grid-template-columns:minmax(0,1fr)}html.pb-v4.pbv4-mockup .mockup-shell .tool-hero{grid-template-columns:minmax(0,1fr)}html.pb-v4.pbv4-mockup .pbv4-engt{grid-column:1;grid-row:auto;margin-top:10px}}
@media (max-width:700px){html.pb-v4 .pbv4-mid{grid-template-columns:minmax(0,1fr)}}

html.pb-v4 .pbv4-choices.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){html.pb-v4 .pbv4-choices.c3{grid-template-columns:minmax(0,1fr)}}

/* ===================== phase 6: every pop-up in the new style ===================== */
html.pb-v4 #pb-again,html.pb-v4 #pb-trial,html.pb-v4 #pb-support-toast,html.pb-v4 .pbwf-modal,html.pb-v4 #gate-overlay,html.pb-v4 #pb-addon-quiz-modal{background:rgba(16,24,40,.45)!important;-webkit-backdrop-filter:blur(6px)!important;backdrop-filter:blur(6px)!important}
html.pb-v4 #pb-again .box,html.pb-v4 #pb-trial .box,html.pb-v4 #pb-support-toast > div,html.pb-v4 .pbwf-modal__box,html.pb-v4 #plan-modal-panel,html.pb-v4 #auth-modal-panel,html.pb-v4 #pb-psd-pop .pp,html.pb-v4 #pb-addon-quiz-modal > div{background:var(--paper)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:20px!important;box-shadow:0 24px 54px -18px rgba(16,24,40,.5)!important;font-family:var(--font-sans)!important;animation:pbv4Pop .22s ease}
html.pb-v4 #pb-support-toast > div{border-top:4px solid #f59e0b!important}
html.pb-v4 #pb-again h2,html.pb-v4 #pb-again h3,html.pb-v4 #pb-trial h2,html.pb-v4 #pb-trial h3,html.pb-v4 #pb-support-toast h3,html.pb-v4 .pbwf-modal__head h2,html.pb-v4 .pbwf-modal__head h3,html.pb-v4 #auth-modal-title,html.pb-v4 #gate-plan-title,html.pb-v4 #pb-psd-pop h,html.pb-v4 #pb-psd-pop h3{font-family:var(--font-display)!important;letter-spacing:-.01em;color:var(--ink)!important}
html.pb-v4 #auth-modal-subtitle,html.pb-v4 #gate-plan-subtitle{color:var(--muted)!important}
html.pb-v4 .pbwf-modal__head{border-bottom:1px solid var(--line)!important}
html.pb-v4 .pbwf-modal__foot{background:var(--soft)!important;border-top:1px solid var(--line)!important;border-radius:0 0 20px 20px}
/* primary buttons inside pop-ups */
html.pb-v4 #pb-again .ok,html.pb-v4 #pb-trial .go,html.pb-v4 .pbwf-btn--primary,html.pb-v4 #auth-send-btn,html.pb-v4 .plan-subscribe,html.pb-v4 #pb-psd-pop button.ok{border-radius:999px!important;background:var(--v4-grad-green)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 22px -10px rgba(5,48,28,.85)!important;font-weight:600!important;font-family:var(--font-sans)!important;transition:filter .2s,transform .15s}
html.pb-v4 .pbwf-btn--premium{border-radius:999px!important;background:linear-gradient(120deg,#2e1065,#5b21b6 50%,#7c3aed)!important;color:#fff!important;border:0!important;box-shadow:0 10px 22px -10px rgba(91,33,182,.85)!important}
html.pb-v4 #pb-support-toast [data-send]{border-radius:999px!important;background:linear-gradient(120deg,#78350f,#b45309 55%,#f59e0b)!important}
html.pb-v4 #pb-again .ok:hover,html.pb-v4 #pb-trial .go:hover,html.pb-v4 .pbwf-btn--primary:hover,html.pb-v4 #auth-send-btn:hover,html.pb-v4 .plan-subscribe:hover,html.pb-v4 .pbwf-btn--premium:hover{filter:brightness(1.1);transform:translateY(-1px)}
/* secondary buttons */
html.pb-v4 #pb-again .no,html.pb-v4 #pb-trial .later,html.pb-v4 .pbwf-btn--ghost,html.pb-v4 #gate-upgrade-dismiss,html.pb-v4 #auth-back-btn,html.pb-v4 .pbwf-modal__x{border-radius:999px!important;background:linear-gradient(180deg,#fff,#f4f6fa)!important;color:var(--ink)!important;border:1px solid var(--line)!important;box-shadow:0 4px 10px -6px rgba(16,24,40,.15)!important;font-family:var(--font-sans)!important}
html.pb-v4 .pbwf-btn{border-radius:999px!important;font-family:var(--font-sans)!important}
/* fields */
html.pb-v4 #auth-email-input,html.pb-v4 #pb-trial input[type=text],html.pb-v4 #pb-trial textarea,html.pb-v4 .pbwf-modal input[type=text],html.pb-v4 .pbwf-modal input[type=number],html.pb-v4 .pbwf-modal select{border-radius:12px!important;border:1px solid var(--line)!important;font-family:var(--font-sans)!important}
html.pb-v4 #auth-email-input:focus,html.pb-v4 #pb-trial textarea:focus{outline:0;box-shadow:0 0 0 3px rgba(37,99,235,.25)!important;border-color:rgba(37,99,235,.5)!important}
/* plan cards inside the upgrade pop-up */
html.pb-v4 #gate-plans-grid .plan-card{border-radius:18px!important;border:1px solid var(--line)!important;box-shadow:0 8px 20px -12px rgba(16,24,40,.2)!important}
/* trial pop-up badge */
html.pb-v4 #pb-trial .badge{border-radius:999px!important;background:linear-gradient(90deg,#1FD877,#2563eb 55%,#7c3aed)!important;color:#fff!important}
/* full-page login screen (guests who press Log in) */
html.pb-v4 .login-gate{background:var(--cream)!important;background-image:radial-gradient(1000px 520px at 50% -12%,rgba(31,216,119,.12),transparent 62%),radial-gradient(800px 460px at 90% 0%,rgba(124,58,237,.08),transparent 60%)!important;color:var(--ink)!important;font-family:var(--font-sans)!important}
html.pb-v4 .login-gate__topbar{background:rgba(255,255,255,.9)!important;border-bottom:1px solid var(--line)!important}
html.pb-v4 .login-gate__auth-panel{background:var(--paper)!important;border:1px solid var(--line)!important;border-radius:22px!important;box-shadow:0 24px 54px -18px rgba(16,24,40,.35)!important;color:var(--ink)!important}
html.pb-v4 .login-gate__lead,html.pb-v4 .login-gate__auth-sub{color:var(--muted)!important}
html.pb-v4 .login-gate h1,html.pb-v4 .login-gate h2,html.pb-v4 .login-gate__hero h1{font-family:var(--font-display)!important;color:var(--ink)!important}
html.pb-v4 .login-gate__kicker,html.pb-v4 .login-gate__section-kicker{color:#2563eb!important;font-family:var(--font-sans)!important;letter-spacing:.12em}
html.pb-v4 .login-gate__test-btn{border-radius:999px!important;background:linear-gradient(120deg,#2e1065,#5b21b6 50%,#7c3aed)!important;color:#fff!important;box-shadow:0 10px 22px -10px rgba(91,33,182,.85)!important;font-family:var(--font-sans)!important}
html.pb-v4 .login-gate__browse-btn{border-radius:999px!important;background:var(--v4-grad-green)!important;color:#fff!important;border:0!important;font-family:var(--font-sans)!important}
html.pb-v4 .login-gate__login-btn,html.pb-v4 .login-gate__foot-link{color:#2563eb!important;font-family:var(--font-sans)!important}
html.pb-v4 .gate-auth-form input{border-radius:12px!important;border:1px solid var(--line)!important}
html.pb-v4 .gate-auth-form button{border-radius:999px!important;background:var(--v4-grad-green)!important;color:#fff!important;border:0!important;font-weight:600!important}
/* engine warnings shown under Generate */
html.pb-v4 .pbv4-warn{margin:0;padding:8px 10px;border-radius:10px;background:#fef3f2;border:1px solid #fecdca;color:#b42318;font-size:12.5px}
html.pb-v4 .pbv4-warn[hidden]{display:none}
/* dark mode */
html.pb-v4.pbv4-dark .login-gate__topbar{background:rgba(18,24,38,.9)!important}
html.pb-v4.pbv4-dark #pb-again .no,html.pb-v4.pbv4-dark #pb-trial .later,html.pb-v4.pbv4-dark .pbwf-btn--ghost,html.pb-v4.pbv4-dark #gate-upgrade-dismiss,html.pb-v4.pbv4-dark #auth-back-btn,html.pb-v4.pbv4-dark .pbwf-modal__x{background:linear-gradient(180deg,#1d2638,#151c2b)!important}
html.pb-v4.pbv4-dark .pbv4-warn{background:rgba(217,45,32,.12);border-color:rgba(217,45,32,.4);color:#fda29b}

/* login screen plan cards = pricing page cards */
html.pb-v4 .login-gate__test-cta{border-radius:20px!important;border:1px solid var(--line)!important;background:var(--paper)!important;box-shadow:0 8px 20px -12px rgba(16,24,40,.15)!important}
html.pb-v4 .login-gate .plan-card{border-radius:24px!important;border:1px solid var(--line)!important;background:var(--paper)!important;box-shadow:0 1px 2px rgba(16,24,40,.04),0 10px 26px -14px rgba(16,24,40,.18)!important;transition:transform .2s}
html.pb-v4 .login-gate .plan-card:hover{transform:translateY(-3px)}
html.pb-v4 .login-gate .plan-card.featured{border:1.5px solid transparent!important;background:linear-gradient(var(--paper),var(--paper)) padding-box,var(--v4-brand) border-box!important;box-shadow:0 24px 50px -20px rgba(37,99,235,.35)!important}
html.pb-v4 .login-gate .plan-card.featured::before{display:none!important}
html.pb-v4 .login-gate .plan-card h3,html.pb-v4 .login-gate .plan-price .amt{font-family:var(--font-display)!important;letter-spacing:-.02em}
html.pb-v4 .login-gate .badge{border-radius:999px!important;font-family:var(--font-sans)!important}
html.pb-v4 .login-gate .badge.free{background:#e8fbf1!important;color:#067647!important;border:1px solid rgba(31,216,119,.35)!important}
html.pb-v4 .login-gate .plan-cta{border-radius:999px!important;background:var(--v4-grad-green)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 22px -10px rgba(5,48,28,.85)!important;font-family:var(--font-sans)!important;font-weight:600!important;letter-spacing:0!important}
html.pb-v4 .login-gate .plan-cta:hover{filter:brightness(1.1)}
html.pb-v4 .login-gate__foot,html.pb-v4 .login-gate__foot-link,html.pb-v4 .login-gate__skip{font-family:var(--font-sans)!important}
html.pb-v4 .login-gate__login-btn{border-radius:999px!important;border:1px solid var(--line)!important;padding:8px 16px!important;background:linear-gradient(180deg,#fff,#f4f6fa)!important;text-decoration:none!important}
html.pb-v4.pbv4-dark .login-gate__login-btn{background:linear-gradient(180deg,#1d2638,#151c2b)!important}

/* ===================== phase 7: every tool page on one screen (upload | settings | run) ===================== */
html.pb-v4 .tool-page[data-pbv4grid]{display:grid!important;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr) 300px;column-gap:18px;row-gap:10px;align-items:start;align-content:start;max-width:1400px!important;width:100%!important;grid-auto-rows:min-content}
html.pb-v4 .tool-page[data-pbv4grid] > *{margin-top:0!important;margin-bottom:0!important;min-width:0}
html.pb-v4 .tool-page[data-pbv4grid] > .tool-back{justify-self:start}
html.pb-v4 .tool-page[data-pbv4grid] > .info-accordion{justify-self:start;max-width:520px}
html.pb-v4 .tool-page[data-pbv4grid] .tool-hero h1{font-size:26px!important}
/* upload = green-purple sister section with the IMG drawing */
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a]:has(.dropzone){padding:14px;border-radius:20px;background:radial-gradient(120% 140% at 100% 0%,rgba(192,132,252,.45),transparent 55%),linear-gradient(140deg,#05301c 0%,#0b6b45 50%,#7c3aed 100%);box-shadow:0 18px 40px -22px rgba(124,58,237,.7)}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] > .step-heading{color:#fff!important;margin:0 0 10px!important}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] > .step-heading .step-heading__num{background:#86efac!important;color:#05301c!important}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] .tool-upload-hint{color:#d9f7e8!important;font-size:12px!important;margin-top:8px!important}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone{border:1px solid #d6c8fb!important;background:linear-gradient(180deg,#fff 0%,#f4efff 100%)!important;border-radius:16px!important;padding:14px 12px 16px!important;min-height:0!important}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone:hover,html.pb-v4 .tool-page[data-pbv4grid] .dropzone--over{border-color:#a78bfa!important}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone__icon{width:84px!important;height:84px!important;border:0!important;background:url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMjAgMTIwIj48ZGVmcz48bGluZWFyR3JhZGllbnQgaWQ9InBidjRpcCIgeDE9IjAiIHkxPSIwIiB4Mj0iMCIgeTI9IjEiPjxzdG9wIG9mZnNldD0iMCIgc3RvcC1jb2xvcj0iI2ZmZiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2YxZWNmZiIvPjwvbGluZWFyR3JhZGllbnQ+PGxpbmVhckdyYWRpZW50IGlkPSJwYnY0aXMiIHgxPSIwIiB5MT0iMCIgeDI9IjEiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiM1YjIxYjYiLz48c3RvcCBvZmZzZXQ9Ii41NSIgc3RvcC1jb2xvcj0iIzhiNWNmNiIvPjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iI2Q4YjRmZSIvPjwvbGluZWFyR3JhZGllbnQ+PGxpbmVhckdyYWRpZW50IGlkPSJwYnY0aXQiIHgxPSIwIiB5MT0iMCIgeDI9IjEiIHkyPSIxIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiMxRkQ4NzciLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMwZmE5NjgiLz48L2xpbmVhckdyYWRpZW50PjxyYWRpYWxHcmFkaWVudCBpZD0icGJ2NGlnIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNlOWQ1ZmYiIHN0b3Atb3BhY2l0eT0iLjk1Ii8+PHN0b3Agb2Zmc2V0PSIuNDUiIHN0b3AtY29sb3I9IiNjMDg0ZmMiIHN0b3Atb3BhY2l0eT0iLjciLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNhODU1ZjciIHN0b3Atb3BhY2l0eT0iMCIvPjwvcmFkaWFsR3JhZGllbnQ+PGNsaXBQYXRoIGlkPSJwYnY0aWMiPjxyZWN0IHg9IjMwIiB5PSIzNCIgd2lkdGg9IjUwIiBoZWlnaHQ9IjQwIiByeD0iNSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxyZWN0IHg9IjQwIiB5PSIxNiIgd2lkdGg9IjU2IiBoZWlnaHQ9IjcyIiByeD0iOCIgZmlsbD0iI2M0YjVmZCIgb3BhY2l0eT0iLjU1IiB0cmFuc2Zvcm09InJvdGF0ZSgxMCA2OCA1MikiLz48cmVjdCB4PSIzNCIgeT0iMTgiIHdpZHRoPSI1NiIgaGVpZ2h0PSI3MiIgcng9IjgiIGZpbGw9IiNkZGQ2ZmUiIG9wYWNpdHk9Ii45IiB0cmFuc2Zvcm09InJvdGF0ZSg0IDYyIDU0KSIvPjxwYXRoIGQ9Ik0zMCAxNGg0MGwyMCAyMHY2NmE4IDggMCAwIDEtOCA4SDMwYTggOCAwIDAgMS04LThWMjJhOCA4IDAgMCAxIDgtOHoiIGZpbGw9InVybCgjcGJ2NGlwKSIvPjxwYXRoIGQ9Ik03MCAxNHYxNGE2IDYgMCAwIDAgNiA2aDE0eiIgZmlsbD0iI2Q4Y2NmYiIvPjxnIGNsaXAtcGF0aD0idXJsKCNwYnY0aWMpIj48cmVjdCB4PSIzMCIgeT0iMzQiIHdpZHRoPSI1MCIgaGVpZ2h0PSI0MCIgZmlsbD0idXJsKCNwYnY0aXMpIi8+PGNpcmNsZSBjeD0iNjgiIGN5PSI0NCIgcj0iMTIiIGZpbGw9InVybCgjcGJ2NGlnKSIvPjxjaXJjbGUgY3g9IjY4IiBjeT0iNDUuNSIgcj0iNiIgZmlsbD0iIzNiMDc2NCIgb3BhY2l0eT0iLjM1Ii8+PGNpcmNsZSBjeD0iNjgiIGN5PSI0NCIgcj0iNiIgZmlsbD0iI2ZmZDE2NiIvPjxjaXJjbGUgY3g9IjY2LjMiIGN5PSI0Mi4zIiByPSIyIiBmaWxsPSIjZmZmM2M0Ii8+PHBhdGggZD0iTTMwIDc1bDE0LTE3IDEwIDExIDgtOCAxOCAxNXoiIGZpbGw9IiMyZTEwNjUiIG9wYWNpdHk9Ii4zIi8+PHBhdGggZD0iTTMwIDc0bDE0LTE4IDEwIDExIDgtOCAxOCAxNXoiIGZpbGw9IiMxRkQ4NzciLz48cGF0aCBkPSJNMzAgNzRsMTAtMTAgOSAxMHoiIGZpbGw9IiMwZmE5NjgiLz48L2c+PHJlY3QgeD0iMzAiIHk9IjM0IiB3aWR0aD0iNTAiIGhlaWdodD0iNDAiIHJ4PSI1IiBmaWxsPSJub25lIiBzdHJva2U9IiMyZTEwNjUiIHN0cm9rZS1vcGFjaXR5PSIuMTgiIHN0cm9rZS13aWR0aD0iMS41Ii8+PHJlY3QgeD0iMTQiIHk9Ijc4IiB3aWR0aD0iNTQiIGhlaWdodD0iMjYiIHJ4PSI3IiBmaWxsPSJ1cmwoI3BidjRpdCkiLz48dGV4dCB4PSI0MSIgeT0iOTYiIHRleHQtYW5jaG9yPSJtaWRkbGUiIGZvbnQtZmFtaWx5PSJJbnRlcixBcmlhbCxzYW5zLXNlcmlmIiBmb250LXNpemU9IjE1IiBmb250LXdlaWdodD0iODAwIiBmaWxsPSIjZmZmIiBsZXR0ZXItc3BhY2luZz0iMSI+SU1HPC90ZXh0Pjwvc3ZnPg==') center/contain no-repeat!important;box-shadow:none!important;filter:drop-shadow(0 4px 6px rgba(46,16,101,.25)) drop-shadow(0 14px 18px rgba(124,58,237,.4));transition:transform .25s}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone__icon > *{display:none!important}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone:hover .dropzone__icon{transform:scale(1.1)}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone__title{font:800 20px/1.2 var(--font-display)!important;color:#14532d!important;letter-spacing:-.02em}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone__hint{color:#3f5b4b!important}
html.pb-v4 .tool-page[data-pbv4grid] .dropzone__format{border-radius:999px!important}
/* settings column */
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=b]:not(.step-heading){background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:10px 12px}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=b]:not(.step-heading):empty{display:none}
/* run column */
html.pb-v4 .tool-page[data-pbv4grid] button[data-pbv4=go]{width:100%;min-height:48px;border-radius:999px!important;background:var(--v4-grad-green)!important;color:#fff!important;border:1px solid rgba(255,255,255,.14)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 10px 22px -10px rgba(5,48,28,.85)!important;font:700 15px var(--font-sans)!important;cursor:pointer}
html.pb-v4 .tool-page[data-pbv4grid] button[data-pbv4=go]:disabled{background:var(--soft)!important;color:var(--faint)!important;border-color:var(--line)!important;box-shadow:none!important;cursor:not-allowed}
html.pb-v4 .tool-page[data-pbv4grid] > .terminal{max-height:260px}
html.pb-v4 .tool-page[data-pbv4grid] > .terminal .terminal__log{max-height:190px;overflow:auto}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=c]:not(.step-heading):not(button):not(.terminal){font-size:11.5px;color:var(--faint)}
html.pb-v4.pbv4-dark .tool-page[data-pbv4grid] .dropzone{background:linear-gradient(180deg,rgba(5,48,28,.7),rgba(46,16,101,.55))!important;border-color:rgba(192,132,252,.4)!important}
html.pb-v4.pbv4-dark .tool-page[data-pbv4grid] .dropzone__title{color:#ecfdf3!important}
html.pb-v4.pbv4-dark .tool-page[data-pbv4grid] .dropzone__hint{color:#c7e9d5!important}
@media (max-width:1150px){html.pb-v4 .tool-page[data-pbv4grid]{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=c]{grid-column:1 / -1!important;grid-row:auto!important}}
@media (max-width:760px){html.pb-v4 .tool-page[data-pbv4grid]{display:flex!important;flex-direction:column}html.pb-v4 .tool-page[data-pbv4grid] > *{margin-bottom:10px!important}}

/* ===================== one pricing design: login screen + sign-up/upgrade pop-up ===================== */
html.pb-v4 .pbv4-old-plans{display:none!important}
html.pb-v4 .login-gate__section-kicker{display:none!important}
html.pb-v4 .pbv4-plans{margin:14px 0 6px}
html.pb-v4 .pbv4-plans__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
html.pb-v4 .pbv4-plans__grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
html.pb-v4 .pbv4-pc{display:flex;flex-direction:column;gap:8px;padding:20px;border-radius:22px;border:1px solid var(--line);background:var(--paper);box-shadow:0 10px 26px -14px rgba(16,24,40,.18);text-align:left;color:var(--ink)}
html.pb-v4 .pbv4-pc small{font:700 12px var(--font-sans);letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
html.pb-v4 .pbv4-pc.hot{border:1.5px solid transparent;background:linear-gradient(var(--paper),var(--paper)) padding-box,var(--v4-brand) border-box;box-shadow:0 22px 46px -20px rgba(37,99,235,.35)}
html.pb-v4 .pbv4-pc.prem small{color:#7c3aed}
html.pb-v4 .pbv4-pc__price{font:700 30px/1 var(--font-display);letter-spacing:-.02em}
html.pb-v4 .pbv4-pc__price span{font:500 13px var(--font-sans);color:var(--faint);margin-left:2px}
html.pb-v4 .pbv4-pc__note{margin:0;font-size:12.5px;color:var(--muted)}
html.pb-v4 .pbv4-pc.prem .pbv4-pc__note{color:#7c3aed;font-weight:600}
html.pb-v4 .pbv4-pc ul{list-style:none;margin:4px 0 8px;padding:0;display:flex;flex-direction:column;gap:6px;font-size:13px;color:var(--muted)}
html.pb-v4 .pbv4-pc li{display:flex;gap:8px;align-items:flex-start}
html.pb-v4 .pbv4-pc li svg{width:14px;height:14px;flex:none;margin-top:3px}
html.pb-v4 .pbv4-pc__cta{margin-top:auto;min-height:44px;border-radius:999px;border:1px solid var(--line);background:linear-gradient(180deg,#fff,#f4f6fa);color:var(--ink);font:600 14px var(--font-sans);cursor:pointer;transition:filter .2s,transform .15s}
html.pb-v4 .pbv4-pc.hot .pbv4-pc__cta{background:var(--v4-grad-green);color:#fff;border-color:rgba(255,255,255,.14);box-shadow:0 10px 22px -10px rgba(5,48,28,.85)}
html.pb-v4 .pbv4-pc.prem .pbv4-pc__cta{background:linear-gradient(120deg,#2e1065,#5b21b6 50%,#7c3aed);color:#fff;border:0;box-shadow:0 10px 22px -10px rgba(91,33,182,.85)}
html.pb-v4 .pbv4-pc__cta:hover{transform:translateY(-1px);filter:brightness(1.07)}
html.pb-v4 .pbv4-plans__more{margin:12px 0 0;text-align:center;font-size:12.5px;color:var(--faint)}
html.pb-v4 .pbv4-plans__more a{color:#2563eb;font-weight:600;text-decoration:none}
html.pb-v4.pbv4-dark .pbv4-pc__cta{background:linear-gradient(180deg,#1d2638,#151c2b)}
@media (max-width:760px){html.pb-v4 .pbv4-plans__grid,html.pb-v4 .pbv4-plans__grid.two{grid-template-columns:minmax(0,1fr)}}

html.pb-v4 .tool-page[data-pbv4grid] [data-pbv4col=c] button:not([class]):not([data-pbv4]){width:100%;min-height:48px;border-radius:999px;background:var(--v4-grad-green);color:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 10px 22px -10px rgba(5,48,28,.85);font:700 15px var(--font-sans);cursor:pointer}

/* ===================== pricing cards v2 (shared look: /pricing, login screen, sign-up pop-up) =====================
   Free = light, PAID = hero (brand gradient border + ribbon + glow), Premium = dark purple power card. */
html.pb-v4 .tool-page[data-pbv4grid]{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)!important}
html.pb-v4 .pbv4-plans__grid{align-items:stretch;gap:18px}
html.pb-v4 .pbv4-pc{position:relative;overflow:hidden;padding:24px 22px 22px;border-radius:26px;transition:transform .25s,box-shadow .25s}
html.pb-v4 .pbv4-pc:hover{transform:translateY(-4px)}
html.pb-v4 .pbv4-pc__ic{width:46px;height:46px;filter:drop-shadow(0 8px 12px rgba(16,24,40,.22))}
html.pb-v4 .pbv4-pc small{font-size:12.5px;margin-top:4px}
html.pb-v4 .pbv4-pc__price{font-size:42px}
html.pb-v4 .pbv4-pc li svg{width:16px;height:16px;padding:2px;border-radius:50%;background:#e8fbf1;box-sizing:content-box;margin-top:1px}
html.pb-v4 .pbv4-pc.free{background:linear-gradient(180deg,#f3fdf8 0%,var(--paper) 45%)}
html.pb-v4 .pbv4-pc.hot{transform:translateY(-8px);box-shadow:0 30px 60px -24px rgba(37,99,235,.45),0 0 0 6px rgba(37,99,235,.06)}
html.pb-v4 .pbv4-pc.hot:hover{transform:translateY(-12px)}
html.pb-v4 .pbv4-pc.hot::after{content:"";position:absolute;right:-60px;top:-60px;width:200px;height:200px;border-radius:50%;background:radial-gradient(closest-side,rgba(31,216,119,.22),transparent);pointer-events:none}
html.pb-v4 .pbv4-pc.hot .pbv4-pc__price{background:linear-gradient(90deg,#0b7a4b,#2563eb);-webkit-background-clip:text;background-clip:text;color:transparent}
html.pb-v4 .pbv4-pc.hot .pbv4-pc__price span{-webkit-text-fill-color:var(--faint)}
html.pb-v4 .pbv4-pc__rib{position:absolute;top:18px;right:18px;font:700 11px var(--font-sans);letter-spacing:.04em;padding:5px 11px;border-radius:999px;color:#fff;background:linear-gradient(90deg,#1FD877,#2563eb 55%,#7c3aed);box-shadow:0 6px 14px -6px rgba(37,99,235,.7)}
html.pb-v4 .pbv4-pc.prem{background:radial-gradient(120% 90% at 100% 0%,rgba(168,85,247,.45),transparent 55%),linear-gradient(160deg,#1e1145 0%,#2e1065 45%,#4c1d95 100%);border:0;color:#fff;box-shadow:0 26px 50px -22px rgba(76,29,149,.75)}
html.pb-v4 .pbv4-pc.prem small{color:#d8b4fe}
html.pb-v4 .pbv4-pc.prem .pbv4-pc__price span{color:#c4b5fd}
html.pb-v4 .pbv4-pc.prem .pbv4-pc__note{color:#f0abfc}
html.pb-v4 .pbv4-pc.prem ul{color:#e9d5ff}
html.pb-v4 .pbv4-pc.prem li svg{background:rgba(255,255,255,.14)}
html.pb-v4 .pbv4-pc.prem li svg path{stroke:#86efac}
html.pb-v4 .pbv4-pc.prem .pbv4-pc__cta{background:#fff;color:#2e1065;box-shadow:0 10px 24px -10px rgba(0,0,0,.5)}
html.pb-v4 .pbv4-pc.free .pbv4-pc__cta{border-color:#a7f3d0;color:#067647}
html.pb-v4.pbv4-dark .pbv4-pc.free{background:linear-gradient(180deg,rgba(31,216,119,.08) 0%,var(--paper) 45%)}
@media (prefers-reduced-motion:reduce){html.pb-v4 .pbv4-pc,html.pb-v4 .pbv4-pc.hot{transition:none;transform:none}}

html.pb-v4 .login-gate__shell:has(.login-gate__plans){visibility:hidden}

/* ===================== engine card + real sliding switch ===================== */
html.pb-v4 .pbv4-engt{position:relative;overflow:hidden;gap:12px!important;padding:10px 12px 10px 12px!important;border:0!important;border-radius:20px!important;color:#fff;background:radial-gradient(120% 140% at 100% 0%,rgba(49,168,255,.35),transparent 55%),linear-gradient(130deg,#061629 0%,#0b2a5c 55%,#1f6feb 100%)!important;box-shadow:0 16px 34px -18px rgba(31,111,235,.75)!important;transition:background .35s}
html.pb-v4 .pbv4-engt.is-v{background:radial-gradient(120% 140% at 100% 0%,rgba(192,132,252,.45),transparent 55%),linear-gradient(130deg,#1e1145 0%,#2e1065 55%,#7c3aed 100%)!important;box-shadow:0 16px 34px -18px rgba(124,58,237,.8)!important}
html.pb-v4 .pbv4-engt > .pbv4-n{display:none}
html.pb-v4 .pbv4-engt__ic{width:36px;height:36px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.14);flex:none}
html.pb-v4 .pbv4-engt__ic svg{width:18px;height:18px;fill:#ffd166;stroke:none}
html.pb-v4 .pbv4-engt__t{display:flex;flex-direction:column;line-height:1.2;margin-right:4px}
html.pb-v4 .pbv4-engt__t b{font:700 15px var(--font-display);color:#fff}
html.pb-v4 .pbv4-engt__t small{font-size:11.5px;color:#c9d8f5;white-space:nowrap}
html.pb-v4 .pbv4-engt.is-v .pbv4-engt__t small{color:#e9d5ff}
/* the switch: one track, one sliding thumb */
html.pb-v4 .pbv4-tg{position:relative;display:grid!important;grid-template-columns:1fr 1fr;gap:0!important;padding:4px!important;border-radius:999px!important;background:rgba(0,0,0,.28)!important;box-shadow:inset 0 2px 6px rgba(0,0,0,.35);min-width:260px}
html.pb-v4 .pbv4-tg__thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.3);transition:transform .32s cubic-bezier(.34,1.4,.64,1)}
html.pb-v4 .pbv4-engt.is-v .pbv4-tg__thumb{transform:translateX(100%)}
html.pb-v4 .pbv4-tg button{position:relative;z-index:1;justify-content:center;gap:7px!important;min-height:38px!important;padding:6px 14px!important;background:transparent!important;box-shadow:none!important;color:rgba(255,255,255,.75)!important;font:700 13.5px var(--font-sans)!important;transition:color .25s}
html.pb-v4 .pbv4-tg button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html.pb-v4 .pbv4-tg button[aria-pressed="true"]{color:#0b2a5c!important}
html.pb-v4 .pbv4-engt.is-v .pbv4-tg button[aria-pressed="true"]{color:#4c1d95!important}
html.pb-v4 .pbv4-tg i{background:linear-gradient(90deg,#1FD877,#2563eb 55%,#7c3aed)!important}
html.pb-v4 .pbv4-tg .lk{background:rgba(255,255,255,.18)!important;color:#fff!important;border:0!important}
html.pb-v4 .pbv4-engt .pbv4-how{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;box-shadow:none!important}
html.pb-v4 .pbv4-engt .pbv4-how svg{stroke:#fff!important}
html.pb-v4 .pbv4-engt{overflow:visible}
@media (prefers-reduced-motion:reduce){html.pb-v4 .pbv4-tg__thumb{transition:none}}

/* ===================== phase 8: tool "This run" card, workflow, safety ===================== */
/* safety: original mockup page comes back if the new one can't attach */
html.pb-v4.pbv4-fallback .pbv4-m{display:none!important}
/* tool pages: file list readable inside the coloured upload section */
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] *:not(.dropzone):not(.dropzone *){color:inherit}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a]{color:#ecfdf3}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] button:not(.dropzone *){color:#fff!important;background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.25)!important;border-radius:999px!important}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] li,html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=file-item],html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=file-row]{color:var(--ink)}
/* tool pages: This run card */
html.pb-v4 .pbv4-tsum{display:flex;flex-direction:column;gap:8px;padding:14px 16px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow-soft)}
html.pb-v4 .pbv4-tsum__big{font:700 24px/1 var(--font-display);color:var(--ink);letter-spacing:-.02em}
html.pb-v4 .pbv4-tsum .pbv4-ready{flex-direction:row;gap:14px;flex-wrap:wrap}
html.pb-v4 .pbv4-tsum__line{margin:0;font-size:12px;color:var(--faint)}
html.pb-v4 .pbv4-tsum__line:empty{display:none}
html.pb-v4 .tool-page[data-pbv4grid] button[data-pbv4=go].pbv4-g-empty{background:var(--soft)!important;color:var(--faint)!important;border-color:var(--line)!important;box-shadow:none!important}
html.pb-v4 .tool-page[data-pbv4grid] > .tool-terminal-note{display:none!important}
/* workflow page */
html.pb-v4 .pbwf-pick[data-pick="mockup:opti"]{display:none!important}
html.pb-v4 .pbwf-drop{border:1px solid #d6c8fb!important;border-radius:16px!important;background:linear-gradient(180deg,#fff,#f4efff)!important}
html.pb-v4 .pbwf-main > .card:first-child,html.pb-v4 .pbwf-main > section:first-child{background:radial-gradient(120% 140% at 100% 0%,rgba(192,132,252,.45),transparent 55%),linear-gradient(140deg,#05301c 0%,#0b6b45 50%,#7c3aed 100%)!important;border:0!important;box-shadow:0 18px 40px -22px rgba(124,58,237,.7)!important}
html.pb-v4 .pbwf-main > .card:first-child .pbwf-card__head,html.pb-v4 .pbwf-main > .card:first-child .pbwf-card__head *{color:#fff!important}
html.pb-v4 .pbwf-drop__icon{color:#7c3aed!important}
html.pb-v4 .pbwf-btn--primary:disabled{background:var(--soft)!important;color:var(--faint)!important;box-shadow:none!important;border-color:var(--line)!important}
html.pb-v4 .pbwf-add{border-radius:14px!important}
html.pb-v4 .pbwf-card__head h2,html.pb-v4 .pbwf-card__head h3{font-family:var(--font-display)!important}
/* dark mode: things found while testing */
html.pb-v4.pbv4-dark .pbv4-tsum,html.pb-v4.pbv4-dark .pbv4-files,html.pb-v4.pbv4-dark .pbv4-sumcard{background:var(--paper)}
html.pb-v4.pbv4-dark .pbwf-drop{background:linear-gradient(180deg,rgba(5,48,28,.7),rgba(46,16,101,.55))!important;border-color:rgba(192,132,252,.4)!important}
html.pb-v4.pbv4-dark .pbv4-setopen{color:#eef0ff}
html.pb-v4.pbv4-dark .pbv4-choice[aria-pressed="true"]{background:rgba(59,130,246,.12)}
html.pb-v4.pbv4-dark .pbv4-modal__card{background:#121826}
html.pb-v4.pbv4-dark .pbv4-modal__f{background:#0f1522}
/* phones */
@media (max-width:760px){
  html.pb-v4 .tool-page[data-pbv4grid] .pbv4-tsum{order:50}
  html.pb-v4.pbv4-mockup .pbv4-engt{width:100%;flex-wrap:wrap;justify-content:space-between}
  html.pb-v4 .pbv4-tg{min-width:0;width:100%}
  html.pb-v4 .pbv4-engt__t small{white-space:normal}
  html.pb-v4 .pbv4-sum{order:3}html.pb-v4 .pbv4-files{order:2}
}

/* dark mode fixes (logged-in pages override colours locally) */
html.pb-v4 .mockup-shell{--bg:var(--cream);--card:var(--paper);--soft:var(--pb-warm-100);--line:var(--pb-gray-200);--line-2:var(--pb-gray-300);--ink:var(--pb-ink-900);--muted:var(--pb-gray-600);--faint:var(--pb-gray-500)}
html.pb-v4.pbv4-dark .mockup-shell{--bg:#0b0f17;--card:#121826;--soft:#1b2334;--line:#263147;--line-2:#36425c;--ink:#f2f4f7;--muted:#b6becd;--faint:#808a9c;--mint:rgba(31,216,119,.12)}
html.pb-v4.pbv4-dark .pb-badge--new,html.pb-v4.pbv4-dark .sidebar__workflow-new{background:#1FD877!important;color:#04260f!important;border-color:#1FD877!important}
html.pb-v4.pbv4-dark .pbwf-hero,html.pb-v4.pbv4-dark .pbwf-prof,html.pb-v4.pbv4-dark .pbwf-empty,html.pb-v4.pbv4-dark .pbwf-node,html.pb-v4.pbv4-dark .pbwf-side__guide,html.pb-v4.pbv4-dark .pbwf-zipname,html.pb-v4.pbv4-dark .pbwf-side .pbwf-btn--ghost,html.pb-v4.pbv4-dark .pbwf-side__io button{background:#161e2d!important;color:#f2f4f7!important;border-color:#263147!important}
html.pb-v4.pbv4-dark .pbwf-hero *:not(.pbwf-btn):not(.pbwf-btn *),html.pb-v4.pbv4-dark .pbwf-prof *,html.pb-v4.pbv4-dark .pbwf-empty *,html.pb-v4.pbv4-dark .pbwf-node *,html.pb-v4.pbv4-dark .pbwf-side__guide *{color:inherit}
html.pb-v4.pbv4-dark .pbwf-hero h1 span,html.pb-v4.pbv4-dark .pbwf-hero h1 em{color:#a78bfa!important}
html.pb-v4.pbv4-dark .pbwf-prof.is-active,html.pb-v4.pbv4-dark .pbwf-prof[aria-current]{border-color:#7c3aed!important;box-shadow:0 0 0 2px rgba(124,58,237,.35)!important}
/* tool upload section: file-count line + per-file Remove readable */
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] .slot-file-head,html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=file-head],html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=files-head],html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=file-count]{color:#fff!important;font-weight:600}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] li button,html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=file-item] button,html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] [class*=file-row] button{color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important}
html.pb-v4 .tool-page .pbv4-fhead{color:#fff!important;font-weight:600}
html.pb-v4 .tool-page .pbv4-fclr{color:#fff!important;background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.3)!important;border-radius:999px!important;padding:3px 10px!important}
html.pb-v4 .tool-page .pbv4-frm{color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important;border-radius:999px!important;padding:2px 10px!important}

html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] button.pbv4-frm:not(.dropzone *){color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important}

html.pb-v4:not(.pbv4-m-on) .pbv4-m{display:none!important}

/* lifted engine pop-ups only exist on the mockup page */
html.pb-v4:not(.pbv4-mockup) body > #gate-overlay,html.pb-v4:not(.pbv4-mockup) body > #pb-help-pop{display:none!important}

/* No flash of the old mockup page (2026-10-29): React draws the original page first and the v4 layer rebuilds it ~40 ms later.
   Keep the shell invisible until .pbv4-m exists; the fallback class or a 2.5 s safety reveal always shows the original page. */
@keyframes pbv4reveal{to{visibility:visible}}
html.pb-v4:not(.pbv4-fallback) .mockup-shell:not(:has(.pbv4-m)){visibility:hidden;animation:pbv4reveal 0s 2.5s forwards}

/* Engine card LED bolt (2026-10-29): bigger glass chip, brand gradient ring, green→blue→purple bolt with glow. Static, brighter on hover. */
html.pb-v4 .pbv4-engt__ic{position:relative;width:50px!important;height:50px!important;border-radius:15px!important;background:radial-gradient(circle at 50% 45%,rgba(49,168,255,.28),rgba(6,22,41,.9) 70%)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 18px -4px rgba(49,168,255,.75),0 0 0 1px rgba(255,255,255,.06)}
html.pb-v4 .pbv4-engt__ic::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:linear-gradient(135deg,#1FD877,#31a8ff 50%,#a855f7);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
html.pb-v4 .pbv4-engt__ic svg{width:30px!important;height:30px!important;stroke:none!important;fill:none!important;overflow:visible;filter:drop-shadow(0 0 3px rgba(31,216,119,.9)) drop-shadow(0 0 8px rgba(49,168,255,.7)) drop-shadow(0 0 14px rgba(168,85,247,.55));transition:filter .25s,transform .25s}
html.pb-v4 .pbv4-engt__ic svg .b{fill:url(#pbv4bolt)!important;stroke:rgba(255,255,255,.55)!important;stroke-width:.6!important;stroke-linejoin:round}
html.pb-v4 .pbv4-engt__ic svg .h{fill:none!important;stroke:#fff!important;stroke-width:1.1!important;stroke-linecap:round;stroke-linejoin:round;opacity:.75}
html.pb-v4 .pbv4-engt:hover .pbv4-engt__ic svg{transform:scale(1.06);filter:drop-shadow(0 0 4px rgba(31,216,119,1)) drop-shadow(0 0 12px rgba(49,168,255,.9)) drop-shadow(0 0 20px rgba(168,85,247,.75))}
html.pb-v4 .pbv4-engt__ic svg{width:34px!important;height:34px!important;filter:drop-shadow(0 0 2px rgba(31,216,119,.7)) drop-shadow(0 0 7px rgba(168,85,247,.55))}
html.pb-v4 .pbv4-engt__ic svg .b{stroke:none!important}
html.pb-v4 .pbv4-engt__ic svg .h{opacity:.4;stroke-width:.9!important}
html.pb-v4 .pbv4-engt:hover .pbv4-engt__ic svg{filter:drop-shadow(0 0 3px rgba(31,216,119,.95)) drop-shadow(0 0 10px rgba(168,85,247,.8))}

/* 2026 P + logo. The compiled bundle still points at /img/logotop.png and /logo.php; new file names here beat old cached copies. */
.sidebar__logo,.login-gate__logo{content:url(/img/brand-2026/logo.svg)}
.sidebar__logo--collapsed{content:url(/img/brand-2026/icon.svg);object-fit:contain;width:34px;max-width:34px;height:34px}
html.pb-v4.pbv4-dark .sidebar__logo{content:url(/img/brand-2026/logo-on-dark.svg);background:none;border-radius:0;padding:0}
html.pb-v4.pbv4-dark .sidebar__logo--collapsed{content:url(/img/brand-2026/icon.svg)}
html.pb-v4.pbv4-dark .login-gate__logo{content:url(/img/brand-2026/logo-on-dark.svg)}


/* Cat art is retired. The bundle still names these files, so show the v4 tool icons instead. */
img[src$="/img/tools/mockup.webp"],img[src$="/img/tools/mockup.png"],img[src$="/img/icons/mockup.webp"]{content:url(/img/icons-v4/mockup.webp)}
img[src$="/img/tools/pattern.webp"],img[src$="/img/tools/pattern.png"],img[src$="/img/icons/pattern.webp"]{content:url(/img/icons-v4/pattern.webp)}
img[src$="/img/tools/resize.webp"],img[src$="/img/tools/resize.png"],img[src$="/img/icons/resize.webp"]{content:url(/img/icons-v4/resize.webp)}
img[src$="/img/tools/crop.webp"],img[src$="/img/tools/crop.png"],img[src$="/img/icons/crop.webp"]{content:url(/img/icons-v4/crop.webp)}
img[src$="/img/tools/upscale.webp"],img[src$="/img/tools/upscale.png"],img[src$="/img/icons/upscale.webp"]{content:url(/img/icons-v4/upscale.webp)}
img[src$="/img/tools/convert.webp"],img[src$="/img/tools/convert.png"],img[src$="/img/icons/convert.webp"]{content:url(/img/icons-v4/convert.webp)}
img[src$="/img/tools/rename.webp"],img[src$="/img/tools/rename.png"],img[src$="/img/icons/rename.webp"]{content:url(/img/icons-v4/rename.webp)}
img[src$="/img/tools/watermark.webp"],img[src$="/img/tools/watermark.png"],img[src$="/img/icons/watermark.webp"]{content:url(/img/icons-v4/watermark.webp)}
img[src$="/img/tools/pdf.webp"],img[src$="/img/tools/pdf.png"],img[src$="/img/icons/pdf.webp"]{content:url(/img/icons-v4/pdf.webp)}
img[src$="/img/tools/qrcode-mascot.png"],img[src$="/img/icons/qrcode.png"]{content:url(/img/icons-v4/qrcode.webp)}
img[src$="/img/tools/workflow-mascot.png"],img[src$="/img/icons/workflow.png"]{content:url(/img/icons-v4/workflow.webp)}


/* Bulk Pattern has its own two-pane layout, so it must not take the upload column styles. */
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout){grid-template-columns:minmax(0,1fr)!important}
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout) > [data-pbv4col=a]{grid-column:1 / -1!important;grid-row:auto!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a]{display:grid!important;grid-template-columns:minmax(0,1fr) 420px!important;gap:18px!important;align-items:start;padding:0!important;background:none!important;box-shadow:none!important;border-radius:0!important;color:var(--ink)}
html.pb-v4 .pattern-tool-layout .pattern-tool-main{min-width:0;width:100%}
html.pb-v4 .pattern-tool-layout .pattern-tool-main > .field:first-child{margin:0 0 18px!important;padding:14px;border-radius:20px;color:#ecfdf3!important;background:radial-gradient(120% 140% at 100% 0%,rgba(192,132,252,.45),transparent 55%),linear-gradient(140deg,#05301c 0%,#0b6b45 50%,#7c3aed 100%);box-shadow:0 18px 40px -22px rgba(124,58,237,.7)}
html.pb-v4 .pattern-tool-layout .pattern-tool-main > .field:first-child > .step-heading{color:#fff!important;margin:0 0 10px!important}
html.pb-v4 .pattern-tool-layout .pattern-tool-main > .field:first-child .step-heading__num{background:#86efac!important;color:#05301c!important}
html.pb-v4 .pattern-tool-layout .pattern-tool-main > .step-heading{color:var(--ink)!important;margin:0 0 10px!important}
html.pb-v4 .pattern-tool-layout .card--panel,html.pb-v4 .pattern-tool-layout .card--panel *{color:var(--ink)!important}
html.pb-v4 .pattern-tool-layout .card--panel .label,html.pb-v4 .pattern-tool-layout .pattern-preview-hint,html.pb-v4 .pattern-tool-layout .watermark-slider-unit,html.pb-v4 .pattern-tool-layout .pattern-size-label,html.pb-v4 .pattern-tool-layout .pattern-size-x{color:var(--muted)!important}
html.pb-v4 .pattern-tool-layout .tool-main-card,html.pb-v4 .pattern-tool-main > .card--panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 24px;padding:18px 20px!important}
html.pb-v4 .pattern-tool-main > .card--panel > .field{min-width:0;margin-bottom:12px}
html.pb-v4 .pattern-tool-main > .card--panel > .field:has(.pattern-size-row),html.pb-v4 .pattern-tool-main > .card--panel > .field:has(.watermark-placement-tabs),html.pb-v4 .pattern-tool-main > .card--panel > .field:has(.watermark-pattern-types),html.pb-v4 .pattern-tool-main > .card--panel > .field:has([name=pattern-format]),html.pb-v4 .pattern-tool-main > .card--panel > .step-heading,html.pb-v4 .pattern-tool-main > .card--panel > .pattern-actions{grid-column:1 / -1}
html.pb-v4 .pattern-tool-main > .card--panel > .step-heading{margin:10px 0 10px!important}
html.pb-v4 .pattern-tool-layout .watermark-placement-tabs,html.pb-v4 .pattern-tool-layout .watermark-pattern-types{display:flex!important;flex-wrap:wrap;gap:8px}
html.pb-v4 .pattern-tool-layout .pill-tab{flex:1 1 0;min-width:120px;min-height:40px;justify-content:center;color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:999px!important;font-weight:600}
html.pb-v4 .pattern-tool-layout .pill-tab--active{color:#fff!important;background:var(--v4-grad-green)!important;border-color:transparent!important}
html.pb-v4 .pattern-tool-layout input[type=number],html.pb-v4 .pattern-tool-layout .pattern-hex-input{color:var(--ink)!important;background:var(--paper)!important;border:1px solid var(--line-strong)!important}
html.pb-v4 .pattern-tool-layout .pattern-actions .btn-primary{width:100%;min-height:48px;color:#fff!important;background:var(--v4-grad-green)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important}
html.pb-v4 .pattern-tool-layout .pattern-actions .btn-primary:disabled{color:var(--faint)!important;background:var(--soft)!important;border-color:var(--line)!important;cursor:not-allowed}
html.pb-v4 .pattern-tool-layout .terminal{margin-top:18px}
html.pb-v4 .pattern-tool-layout .pattern-preview-panel{position:sticky;top:76px;width:100%;box-sizing:border-box;margin:0;padding:18px 20px!important;color:var(--ink)!important}
html.pb-v4 .pattern-tool-layout .pattern-preview-panel *{color:inherit}
html.pb-v4 .pattern-tool-layout .pattern-preview-hint{color:var(--muted)!important}
html.pb-v4 .pattern-tool-layout .pattern-preview-frame{width:100%}
html.pb-v4 .pattern-tool-layout .pattern-preview-canvas{display:block;width:100%!important;height:auto!important;max-width:100%}
@media (max-width:1180px){html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a]{grid-template-columns:minmax(0,1fr) 320px!important}html.pb-v4 .pattern-tool-main > .card--panel{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a]{grid-template-columns:minmax(0,1fr)!important}html.pb-v4 .pattern-tool-layout .pattern-preview-panel{position:static}}
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout) > .pattern-tool-layout{grid-row:6!important}
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout) > p[data-pbv4col=a]{grid-row:7!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] button.pill-tab{color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] button.pill-tab.pill-tab--active{color:#fff!important;background:var(--v4-grad-green)!important;border-color:transparent!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .pattern-actions button{width:100%;min-height:48px;color:#fff!important;background:var(--v4-grad-green)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important;font-weight:700}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .pattern-actions button:disabled{color:var(--faint)!important;background:var(--soft)!important;border-color:var(--line)!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .pattern-actions{display:flex;flex-direction:column;gap:10px}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .step-heading__num{color:#fff!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .field:first-child .step-heading__num{color:#05301c!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .terminal,html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .terminal *{color:#e6eaf2!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .terminal__state{color:#1fd877!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .pattern-actions button{height:48px!important;min-height:48px;padding:0 26px!important;flex:0 0 auto}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .terminal,html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .terminal *{color:var(--terminal-text,#e6eaf2)!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .field:first-child > div:last-child > div:first-child > span{color:#fff!important}
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .field:first-child li button{color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important}
html.pb-v4.pbv4-dark .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=a] .step-heading__num{color:#101828!important}
html.pb-v4 .sidebar--collapsed .sidebar__workflow-btn-label,html.pb-v4 .sidebar--collapsed .sidebar__workflow-lock{display:none!important}
html.pb-v4 .sidebar--collapsed .sidebar__workflow-btn{min-height:42px;background:url(/img/icons-v4/workflow.webp) center/32px no-repeat,var(--soft)!important}

/* Bulk QRcode shares the Pattern markup but sits in the top column. */
html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=top]{display:grid!important;grid-template-columns:minmax(0,1fr) 380px!important;gap:18px!important;align-items:start;margin-top:12px!important}
html.pb-v4 .pattern-tool-layout[data-pbv4col=top] .pattern-tool-main > .card--panel{grid-template-columns:minmax(0,1fr)}
html.pb-v4 .pattern-tool-layout[data-pbv4col=top] .pattern-tool-main > .card--panel > *{grid-column:1 / -1;min-width:0}
html.pb-v4 .pattern-tool-layout[data-pbv4col=top] .tool-action-row,html.pb-v4 .pattern-tool-layout[data-pbv4col=top] .tool-action-row__buttons{display:flex;flex-direction:column;gap:10px;width:100%}
html.pb-v4 .pattern-tool-layout[data-pbv4col=top] .tool-action-row button{width:100%;height:48px;min-height:48px;padding:0 26px;color:#fff!important;background:var(--v4-grad-green)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important;font-weight:700}
html.pb-v4 .pattern-tool-layout[data-pbv4col=top] .tool-action-row button:disabled{color:var(--faint)!important;background:var(--soft)!important;border-color:var(--line)!important}
html.pb-v4 .pattern-tool-layout .pattern-preview-frame{border-radius:14px!important;overflow:hidden}
@media (max-width:860px){html.pb-v4 .tool-page[data-pbv4grid] > .pattern-tool-layout[data-pbv4col=top]{grid-template-columns:minmax(0,1fr)!important}}

/* Loose settings blocks read as one card on desktop, like Crop and Convert. */
@media (min-width:761px){
  html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=b]:not(.step-heading):not(button){border-radius:0}
  html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=b]:not(.step-heading):not(button) + [data-pbv4col=b]:not(.step-heading):not(button){margin-top:-11px!important;border-top:0}
  html.pb-v4 .tool-page[data-pbv4grid] > .step-heading[data-pbv4col=b] + [data-pbv4col=b]{border-radius:14px 14px 0 0}
  html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=b]:not(.step-heading):not(button):not(:has(+ [data-pbv4col=b])){border-radius:0 0 14px 14px}
}

/* Phones: every block takes the full width and nothing leaves the screen. */
@media (max-width:760px){
  html.pb-v4 .tool-page[data-pbv4grid]{align-items:stretch!important}
  html.pb-v4 .tool-page[data-pbv4grid] > *{max-width:100%;box-sizing:border-box}
  html.pb-v4 .tool-page[data-pbv4grid] > .tool-back,html.pb-v4 .tool-page[data-pbv4grid] > .info-accordion{align-self:flex-start}
  html.pb-v4 .tool-page[data-pbv4grid] .card--panel div:has(> label > input[type=radio]){flex-wrap:wrap}
}

/* Images to PDF inside the app shell (see podbulk-addons.js). */
html.pb-pdf-on #app-main > :not(.pbv4-top):not(.signin-bar):not(#pb-pdf-frame){display:none!important}
html.pb-pdf-on .sidebar__nav-item--active:not(#pb-addon-pdf-nav){background:none!important}
html.pb-pdf-on .sidebar__nav-item--active:not(#pb-addon-pdf-nav)::before{display:none}
#pb-pdf-frame{display:block;width:100%;min-height:760px;border:0;background:transparent}

/* One control style for the bulk tools. PSD Mockup Generator and Workflow keep their own. */
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout[data-pbv4col=top]){display:flex!important;flex-direction:column;align-items:stretch!important;gap:10px}
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout[data-pbv4col=top]) > .tool-back,html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout[data-pbv4col=top]) > .info-accordion{align-self:flex-start}
html.pb-v4 .tool-page[data-pbv4grid]:has(> .pattern-tool-layout[data-pbv4col=top]) .tool-action-row button{height:48px!important;flex:0 0 auto}

html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) :is(input[type=number],input[type=text],textarea,select){min-height:44px;box-sizing:border-box;padding:10px 12px!important;font:500 14px/1.4 var(--font-body,Inter,sans-serif)!important;color:var(--ink)!important;background:var(--paper)!important;border:1px solid var(--line-strong)!important;border-radius:12px!important;box-shadow:none!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) :is(input[type=number],input[type=text],textarea,select):focus{outline:0!important;border-color:#2563EB!important;box-shadow:0 0 0 3px rgba(37,99,235,.16)!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) input[type=color]{width:44px;height:44px;padding:3px!important;border:1px solid var(--line-strong)!important;border-radius:12px!important;background:var(--paper)!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) :is(button.pill-tab,.seg button){flex:1 1 0;min-width:96px;height:42px;min-height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 14px!important;font:600 13.5px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:999px!important;box-shadow:none!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) :is(button.pill-tab.pill-tab--active,.seg button.active){color:#fff!important;background:var(--v4-grad-green)!important;border-color:transparent!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .seg{display:flex!important;flex-wrap:wrap;gap:8px;padding:0!important;background:none!important;border:0!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .card--panel label:has(> input[type=radio]),html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) label:has(> input[name$=format]){min-height:42px;box-sizing:border-box;padding:0 16px!important;font:600 13.5px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:999px!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .card--panel label:has(> input[type=radio]:checked),html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) label:has(> input[name$=format]:checked){color:#fff!important;background:var(--v4-grad-green)!important;border-color:transparent!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) :is(.watermark-logo-btn,.qr-advanced-toggle,.qr-advanced-cancel){min-height:42px;padding:0 18px!important;font:600 13.5px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--paper)!important;border:1px solid var(--line-strong)!important;border-radius:999px!important;box-shadow:none!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) :is(.pbv4-frm,.field:first-child li button){height:28px;min-height:28px;padding:0 12px!important;font:600 12px/1 var(--font-body,Inter,sans-serif)!important;color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important;border-radius:999px!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) > button:not(.pbv4-g-empty):not(:disabled){font-family:var(--font-display,Sora,sans-serif)!important;font-weight:700!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) > button{font-family:var(--font-display,Sora,sans-serif)!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="padding: 3px"]:has(> button){gap:8px!important;padding:0!important;background:none!important;border:0!important;flex-wrap:wrap}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="padding: 3px"] > button,html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="gap: 8px"] > button[style*="line-strong"],html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="gap: 8px"] > button[style*="green-dark"]{min-height:42px;padding:0 14px!important;font:600 13.5px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:999px!important;box-shadow:none!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="padding: 3px"] > button:not([style*="background: transparent"]),html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="gap: 8px"] > button[style*="green-dark"]{color:#fff!important;background:var(--v4-grad-green)!important;border-color:transparent!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) li button[aria-label^=Remove]{height:28px;min-height:28px;padding:0 12px!important;font:600 12px/1 var(--font-body,Inter,sans-serif)!important;color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important;border-radius:999px!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .watermark-position-btn{border-radius:10px!important;border:1px solid var(--line)!important;background:var(--soft)!important;color:var(--ink)!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .watermark-check{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px!important;font:600 13.5px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:999px!important}
html.pb-v4 .tool-page[data-pbv4grid] > [data-pbv4col=a] div:has(> span + button) > span{color:#fff!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .qr-bulk-list{display:flex;flex-direction:column;gap:8px;width:100%}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .qr-bulk-row{display:flex;align-items:center;gap:8px;width:100%}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .qr-bulk-row input{flex:1 1 0!important;width:auto!important;max-width:none!important;min-width:0}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .qr-bulk-row input + input{flex:0 0 34%!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .qr-bulk-remove{flex:none;width:32px;height:32px;min-height:32px;display:flex;align-items:center;justify-content:center;padding:0!important;font:600 16px/1 var(--font-body,Inter,sans-serif)!important;color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important;border-radius:50%!important;box-shadow:none!important;cursor:pointer}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) .rename-folder-split__remove{height:30px;min-height:30px;padding:0 14px!important;font:600 12px/1 var(--font-body,Inter,sans-serif)!important;color:#b42318!important;background:#fef3f2!important;border:1px solid #fecdca!important;border-radius:999px!important;text-decoration:none!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="flex-wrap: wrap"][style*="gap: 8px"] > button{flex:0 0 auto!important;width:auto!important;min-width:72px;height:42px;min-height:42px;padding:0 16px!important;font:600 13.5px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--soft)!important;border:1px solid var(--line)!important;border-radius:999px!important;box-shadow:none!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="flex-wrap: wrap"][style*="gap: 8px"] > button[style*="green"]{color:#fff!important;background:var(--v4-grad-green)!important;border-color:transparent!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="repeat(3, 44"] > button{width:44px!important;height:44px;min-height:44px;padding:6px!important;background-color:var(--soft)!important;background-image:none!important;border-radius:12px!important;box-shadow:none!important;border:1px solid var(--line)!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="repeat(3, 44"] > button[style*="green"]{border-color:#2563EB!important;background-color:#EFF4FF!important}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="repeat(3, 44"] > button{display:grid!important;place-items:center!important;padding:0!important;text-align:center}
html.pb-v4 .tool-page[data-pbv4grid]:not(:has(.pbwf-main)):not(:has(.mockup-shell)) div[style*="repeat(3, 44"] > button > *{position:static!important;margin:0!important;transform:none!important}

/* Tutorial buttons on the mockup page: engine bar, Focus and multiFocus cards, video pop-up. */
html.pb-v4 .pbv4-engtut svg{fill:none;stroke-width:2}
html.pb-v4 .pbv4-engtut svg path{fill:#fff;stroke:none}
html.pb-v4 .pbv4-cw{position:relative;display:flex;min-width:0}
html.pb-v4 .pbv4-cw .pbv4-choice{width:100%;padding-bottom:46px}
html.pb-v4 .pbv4-cw .pbv4-choice[aria-pressed="true"]{padding-bottom:45.5px}
html.pb-v4 .pbv4-tut{position:absolute;left:42px;bottom:12px;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px 0 7px;font:600 12px/1 var(--font-body,Inter,sans-serif);color:#fff;background:linear-gradient(135deg,#7C3AED,#2563EB);border-radius:999px;text-decoration:none}
html.pb-v4 .pbv4-tut:hover{filter:brightness(1.1)}
html.pb-v4 .pbv4-tut:focus-visible{outline:2px solid var(--v4-blue);outline-offset:2px}
html.pb-v4 .pbv4-tut svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:2}
html.pb-v4 .pbv4-tut svg path{fill:#fff;stroke:none}
#pbv4-tutm{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(16,24,40,.72)}
.pbv4-tutm__card{width:min(960px,100%);background:var(--paper,#fff);border-radius:18px;overflow:hidden;box-shadow:0 24px 70px rgba(0,0,0,.4)}
.pbv4-tutm__h{display:flex;align-items:center;gap:14px;padding:12px 14px 12px 20px}
.pbv4-tutm__h b{flex:1;min-width:0;font:700 16px/1.2 var(--font-display,Sora,sans-serif);color:var(--ink,#101828)}
.pbv4-tutm__h a{font:600 13px/1 var(--font-body,Inter,sans-serif);color:var(--v4-blue,#2563EB)}
#pbv4-tutm iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:#000}

/* Guest bar */
html.pb-v4 .signin-bar{padding:12px 28px;background:linear-gradient(100deg,rgba(124,58,237,.10),rgba(37,99,235,.09) 55%,rgba(31,216,119,.14))!important;border-bottom:1px solid var(--line)!important;box-shadow:none!important}
html.pb-v4 .signin-bar__text{font:500 14px/1.4 var(--font-body,Inter,sans-serif)!important;color:var(--muted)!important}
html.pb-v4 .signin-bar__text b{font:700 14px/1.4 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important}
html.pb-v4 .signin-bar__btn{height:40px;min-height:40px;padding:0 24px!important;font:700 14px/1 var(--font-display,Sora,sans-serif)!important;color:#fff!important;background:linear-gradient(135deg,#7C3AED,#2563EB)!important;border:0!important;border-radius:999px!important;box-shadow:0 8px 20px -8px rgba(37,99,235,.7)!important;cursor:pointer}
html.pb-v4 .signin-bar__btn:hover{filter:brightness(1.1)}

/* Login page: form + brand panel, nothing else */
html.pb-v4 .login-gate:has(.login-gate__auth-panel) .pbv4-plans,html.pb-v4 .login-gate:has(.login-gate__auth-panel) .login-gate__topbar-auth,html.pb-v4 .login-gate__browse-row{display:none!important}
html.pb-v4 .login-gate:has(.login-gate__auth-panel) .login-gate__shell{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:min(1040px,calc(100% - 40px))!important;max-width:none!important;margin:clamp(24px,7vh,72px) auto!important;padding:0!important;background:var(--paper);border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:0 32px 70px -24px rgba(16,24,40,.32)}
html.pb-v4 .login-gate .login-gate__auth-panel{width:auto!important;max-width:none!important;margin:0!important;padding:44px 48px!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:none!important;display:flex;flex-direction:column;justify-content:center}
html.pb-v4 .login-gate__auth-panel h2{font:800 34px/1.1 var(--font-display,Sora,sans-serif)!important;letter-spacing:-.03em;color:var(--ink)!important;margin:10px 0 8px!important}
html.pb-v4 .login-gate__auth-sub{font:500 15px/1.5 var(--font-body,Inter,sans-serif)!important;margin:0 0 24px!important}
html.pb-v4 .login-gate__back{align-self:flex-start;font-size:0!important;color:var(--muted)!important;text-decoration:none!important;background:none!important}
html.pb-v4 .login-gate__back::after{content:"\2190  Back to plans";font:600 13px/1 var(--font-body,Inter,sans-serif)}
html.pb-v4 .login-gate .google-btn{display:flex;align-items:center;justify-content:center;gap:10px;height:50px;font:600 15px/1 var(--font-display,Sora,sans-serif)!important;color:var(--ink)!important;background:var(--paper)!important;border:1px solid var(--line-strong,var(--line))!important;border-radius:999px!important;box-shadow:none!important;text-decoration:none}
html.pb-v4 .login-gate .google-btn:hover{background:var(--soft)!important}
html.pb-v4 .login-gate .gate-auth-form{display:flex;flex-direction:column;gap:12px}
html.pb-v4 .login-gate .gate-auth-form input{width:100%;height:50px;box-sizing:border-box;padding:0 16px!important;font:500 15px/1 var(--font-body,Inter,sans-serif)!important;color:var(--ink);background:var(--paper)!important}
html.pb-v4 .login-gate .gate-auth-form input:focus{outline:0;border-color:#2563EB!important;box-shadow:0 0 0 3px rgba(37,99,235,.16)}
html.pb-v4 .login-gate .gate-auth-form button{width:100%;height:50px;font:700 15px/1 var(--font-display,Sora,sans-serif)!important;color:#fff!important;background:var(--v4-grad-green)!important;border:0!important;border-radius:999px!important;box-shadow:0 12px 24px -12px rgba(6,118,71,.8)!important;cursor:pointer}
.pbv4-la{order:-1;position:relative;display:flex;flex-direction:column;justify-content:center;gap:22px;padding:44px 48px;color:#fff;background:radial-gradient(420px 320px at 90% 0,rgba(31,216,119,.34),transparent 70%),linear-gradient(150deg,#101828,#2E1065 62%,#1E3A8A)}
.pbv4-la img{width:52px;height:52px}
.pbv4-la h2{margin:0;font:800 36px/1.1 var(--font-display,Sora,sans-serif);letter-spacing:-.03em;color:#fff}
.pbv4-la h2 em{font-style:normal;color:#1FD877}
.pbv4-la ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;font:500 15px/1.4 var(--font-body,Inter,sans-serif);color:#D7DCE6}
.pbv4-la li{display:flex;align-items:center;gap:10px}
.pbv4-la li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:#1FD877}
.pbv4-la__t{display:grid;gap:4px;padding:14px 16px;font:500 13px/1.5 var(--font-mono,monospace);color:#B6BECD;background:rgba(0,0,0,.34);border:1px solid rgba(255,255,255,.12);border-radius:14px}
.pbv4-la__t b{font-weight:500;color:#1FD877}
@media (max-width:860px){html.pb-v4 .login-gate:has(.login-gate__auth-panel) .login-gate__shell{grid-template-columns:minmax(0,1fr)}html.pb-v4 .login-gate .login-gate__auth-panel{padding:32px 24px!important}.pbv4-la{display:none}}
html.pb-v4 .login-gate .pbv4-la h2{color:#fff!important;font:800 36px/1.1 var(--font-display,Sora,sans-serif)!important}
html.pb-v4 .login-gate .pbv4-la h2 em{color:#1FD877!important}
html.pb-v4 .login-gate .gate-auth-form input{flex:0 0 50px!important;height:50px!important;min-height:0!important;max-height:50px}
html.pb-v4 .login-gate .gate-auth-form button{flex:0 0 50px!important}

/* Big tutorial button under Settings + pop-up with one or two videos */
html.pb-v4 .pbv4-tutbtn{display:flex;align-items:center;gap:16px;width:100%;min-height:84px;box-sizing:border-box;margin-top:12px;padding:14px 22px 14px 16px;text-align:left;color:#fff;background:radial-gradient(320px 160px at 95% 0,rgba(31,216,119,.4),transparent 70%),linear-gradient(120deg,#7C3AED,#2563EB);border:0;border-radius:20px;box-shadow:0 18px 34px -18px rgba(37,99,235,.8);cursor:pointer;transition:transform .15s ease,filter .15s ease}
html.pb-v4 .pbv4-tutbtn:hover{transform:translateY(-2px);filter:brightness(1.08)}
html.pb-v4 .pbv4-tutbtn:focus-visible{outline:3px solid #1FD877;outline-offset:2px}
html.pb-v4 .pbv4-tutbtn .ic{flex:none;display:flex;align-items:center;justify-content:center;width:54px;height:54px;background:rgba(255,255,255,.18);border-radius:16px}
html.pb-v4 .pbv4-tutbtn .ic svg{width:32px;height:32px;fill:none;stroke:#fff;stroke-width:1.8}
html.pb-v4 .pbv4-tutbtn .ic svg path{fill:#fff;stroke:none}
html.pb-v4 .pbv4-tutbtn .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
html.pb-v4 .pbv4-tutbtn .tx b{font:700 20px/1.2 var(--font-display,Sora,sans-serif);color:#fff}
html.pb-v4 .pbv4-tutbtn .tx small{font:500 14px/1.3 var(--font-body,Inter,sans-serif);color:rgba(255,255,255,.86)}
html.pb-v4 .pbv4-tutbtn .go{font:600 30px/1 var(--font-body,Inter,sans-serif);color:#fff}
.pbv4-tutm__card{width:min(1180px,100%);max-height:calc(100vh - 40px);overflow:auto}
.pbv4-tutm__card.n1{width:min(900px,100%)}
.pbv4-tutm__g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0 16px 16px}
.pbv4-tutm__card.n1 .pbv4-tutm__g{grid-template-columns:minmax(0,1fr)}
.pbv4-tutm__v iframe{border-radius:12px}
.pbv4-tutm__c{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 4px 0}
.pbv4-tutm__c b{font:700 15px/1.2 var(--font-display,Sora,sans-serif);color:var(--ink,#101828)}
.pbv4-tutm__c a{font:600 13px/1 var(--font-body,Inter,sans-serif);color:var(--v4-blue,#2563EB)}
@media (max-width:760px){.pbv4-tutm__g{grid-template-columns:minmax(0,1fr)}html.pb-v4 .pbv4-tutbtn .tx b{font-size:17px}}
html.pb-v4 .pbv4-tutbtn .ic{background:#fff!important;box-shadow:0 6px 16px -6px rgba(16,24,40,.5)}
html.pb-v4 .pbv4-tutbtn .ic svg{width:38px;height:38px;stroke:none!important}
html.pb-v4 .pbv4-tutbtn .ic svg path{stroke:none!important;fill:revert-layer}
html.pb-v4 .pbv4-tutbtn .ic svg path:first-child{fill:#FF0000!important}
html.pb-v4 .pbv4-tutbtn .ic svg path:last-child{fill:#fff!important}
/* Mockup page, 2026-11-01: smart object beside each PSD, engine colours, no Run log */
.pbv4-flist .so{display:block;margin-top:2px;font-size:10.5px;line-height:1.3;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pbv4-flist .so.ok{color:#0C8A4A}
.pbv4-flist .so.bad{color:#DC2626;cursor:help}
.pbv4-flist .so.wait{color:var(--faint)}
html.pbv4-dark .pbv4-flist .so.ok{color:#34D399}
html.pbv4-dark .pbv4-flist .so.bad{color:#F87171}
#pbv4-sotip{position:fixed;z-index:100000;max-width:280px;padding:9px 12px;border-radius:10px;background:#7F1D1D;color:#fff;font:600 12.5px/1.4 Inter,system-ui,sans-serif;box-shadow:0 10px 28px rgba(16,24,40,.28);pointer-events:none;overflow-wrap:anywhere}
#pbv4-sotip[hidden]{display:none}
.pbv4-fsel{width:100%;justify-content:center;margin-bottom:8px}
.pbv4-fsel[hidden]{display:none}
.pbv4-m.is-vortex .pbv4-bar i,.is-vortex .pbv4-bar i{background:linear-gradient(90deg,#5B21B6,#A855F7)}
.pbv4-msg{margin:8px 0 0;font-size:13px;line-height:1.4;font-weight:600;color:#B91C1C;overflow-wrap:anywhere}
.pbv4-msg[hidden]{display:none}