/* The studio shell uses Brandfolia colors; generated artwork stays brand-specific. */
:root {
  --paper:#fffaf2; --ink:#24211e; --green:#24211e; --muted:#686057;
  --line:#ddd2c3; --light:#f2ece1; --accent:#e4ed8c; --white:#fffdf8;
  --ui-paper:#fffaf2; --ui-ink:#24211e; --ui-muted:#686057;
  --ui-line:#ddd2c3; --ui-green:#24211e; --ui-lime:#e4ed8c;
  --orange:#f75c3b;
}
body { background:#fffaf2; color:#24211e; }
::selection { background:#e4ed8c; color:#24211e; }
:is(button,a,input,textarea,select,summary):focus-visible { outline-color:#a8341b; }
.ws-top,.vi-top { background:#fffaf2; border-bottom:1px solid #24211e; }
.ws-wordmark,.vi-brand { position:relative; color:#24211e; font-weight:700; letter-spacing:-1px; }
.ws-wordmark::after,.vi-brand::after { content:""; position:absolute; right:-9px; top:.65em; width:6px; height:6px; background:#f75c3b; border-radius:50%; }
.ws-sidebar,.vi-sidebar { background:#f2ece1; border-color:#ddd2c3; }
.ws-nav-button,.vi-nav button { border-radius:2px; }
.vi-nav button { color:#686057; }
.ws-nav-button:hover,.vi-nav button:hover { background:#e7dfd1; }
.ws-nav-button[aria-current=page],.vi-nav button[aria-current=page],.vi-nav button.active { background:#f75c3b; color:#24211e; font-weight:600; }
.ws-button,.vi-button { border-color:#b8aa97; color:#24211e; border-radius:2px; }
.ws-button:hover,.vi-button:hover { background:#f2ece1; }
.ws-button.primary,.vi-button.primary { background:#24211e; border-color:#24211e; color:#fffaf2; }
.ws-button.primary:hover,.vi-button.primary:hover { background:#b7351d; border-color:#b7351d; }
.vi-pricing-link { background:#f75c3b; border-color:#24211e; border-radius:2px; color:#24211e; }
.vi-pricing-link:hover { background:#e4ed8c; border-color:#24211e; }
.vi-pricing-link:focus-visible { outline-color:#a8341b; }
.ws-mode,.ws-mode.cloud,.vi-inline-notice { background:#f2ece1; border-color:#ddd2c3; color:#514a42; }
.ws-heading h1,.vi-heading h1 { font-weight:600; letter-spacing:-.04em; word-spacing:.03em; }
.ws-card,.ws-row,.ws-editor-fields,.vi-form,.vi-editor { border-radius:3px; background:#fffdf8; border-color:#ddd2c3; }
.ws-entry:first-child { background:#f75c3b; color:#24211e; border-color:#24211e; }
.ws-entry:first-child p,.ws-entry:first-child .ws-card-number { color:#24211e; }
.ws-entry:first-child .ws-button { color:#24211e; border-color:#24211e; }
.ws-entry:first-child .ws-button:hover { background:#e4ed8c; }
.ws-entry:nth-child(2),.vi-sample-entry { background:#e4ed8c; border-radius:3px; }
.ws-card-number { font-size:20px; font-weight:600; }
.ws-empty,.vi-assets-empty { background:#f2ece1; border-color:#b8aa97; }
.ws-note:not(.error),.vi-review { background:#f1f4d2; border-color:#9da94b; color:#41482c; }
.ws-badge:not(.warn):not(.muted),.vi-status,.vi-badge { background:#e4ed8c; color:#24211e; }
.ws-preview,.vi-canvas { background:#eae2d6; border-color:#ddd2c3; }
.ws-layout-option[aria-pressed=true] { border-color:#b7351d; box-shadow:0 0 0 1px #b7351d; background:#fff2e8; }
.ws-layout-option:hover { border-color:#b7351d; }
.ws-field input:not([type=checkbox]),.ws-field select,.ws-field textarea { border-color:#c7bbaa; }
.ws-check input { accent-color:#b7351d; }
.vi-direction.selected,.vi-direction[aria-pressed=true] { border-color:#b7351d; }
.vi-direction button,.vi-sample-choice:hover { border-color:#b7351d; }
.vi-top .vi-brand span,.ws-wordmark span { letter-spacing:1.6px; }
/* Older optional editors use the same shell tokens without touching their SVG canvases. */
.studio-header,.studio-shell .panel,.ps-topbar { background:#fffaf2; border-color:#ddd2c3; }
.product-studio-page .ps-primary { background:#24211e; color:#fffaf2; }
#productStudio { --ps-ink:#24211e; --ps-muted:#686057; --ps-line:#ddd2c3; --ps-paper:#fffdf8; --ps-soft:#f2ece1; }
:is(#vi-billing,#productStudio) .ps-billing { --billing-ink:#24211e; --billing-muted:#686057; --billing-blue:#24211e; --billing-blue-hover:#b7351d; --billing-tint:#f1f4d2; --billing-line:#ddd2c3; }
:is(#vi-billing,#productStudio) .ps-billing-card.is-featured { background:#f1f4d2; }
@media(max-width:650px) {
  .ws-sidebar,.vi-sidebar { background:#fffaf2; }
  .vi-top { position:relative; }
  .vi-sidebar { top:0; }
  .ws-heading h1,.vi-heading h1 { font-size:30px; }
}