/* SHORT Creator Studio — Phase 7 unified product foundation
   Shared tokens and safe primitives. Page-specific layouts remain intact. */
:root{
  --short-bg:#f7f1e7;
  --short-surface:#fffdf9;
  --short-surface-2:#f2eadc;
  --short-sidebar:#0d0e10;
  --short-sidebar-2:#17181b;
  --short-text:#191a1d;
  --short-muted:#6f6b64;
  --short-line:#ddd3c4;
  --short-gold:#e2ad35;
  --short-gold-strong:#bd7f0b;
  --short-gold-soft:#faedc9;
  --short-success:#3f8a5b;
  --short-danger:#b84d49;
  --short-info:#4c78a8;
  --short-radius-sm:10px;
  --short-radius-md:14px;
  --short-radius-lg:20px;
  --short-radius-xl:26px;
  --short-shadow-sm:0 8px 20px rgba(48,34,14,.07);
  --short-shadow-md:0 18px 44px rgba(48,34,14,.10);
  --short-shadow-lg:0 28px 80px rgba(26,20,10,.14);
  --short-fast:140ms;
  --short-normal:220ms;
  --short-ease:cubic-bezier(.2,.8,.2,1);
  --short-space-1:8px;
  --short-space-2:16px;
  --short-space-3:24px;
  --short-space-4:32px;
  --short-space-5:48px;
  --short-space-6:64px;
}
:root[data-theme="dark"]{
  --short-bg:#0d0f12;
  --short-surface:#17191d;
  --short-surface-2:#202329;
  --short-text:#f5f1e8;
  --short-muted:#aaa69d;
  --short-line:rgba(255,255,255,.12);
  --short-gold:#e8b94f;
  --short-gold-strong:#f0c76b;
  --short-gold-soft:#332a18;
  --short-shadow-sm:0 8px 22px rgba(0,0,0,.22);
  --short-shadow-md:0 18px 48px rgba(0,0,0,.30);
  --short-shadow-lg:0 28px 90px rgba(0,0,0,.40);
}

html{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
body.short-ui-v7{background:var(--short-bg);color:var(--short-text)}
body.short-ui-v7 button,
body.short-ui-v7 input,
body.short-ui-v7 textarea,
body.short-ui-v7 select{font:inherit}
body.short-ui-v7 :focus-visible{outline:3px solid color-mix(in srgb,var(--short-gold) 55%,transparent);outline-offset:3px}

/* Reusable primitives for new pages and gradual migration. */
.short-button{min-height:42px;border:1px solid var(--short-line);border-radius:var(--short-radius-md);padding:0 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--short-surface);color:var(--short-text);font-weight:750;text-decoration:none;cursor:pointer;transition:transform var(--short-fast) var(--short-ease),box-shadow var(--short-normal) var(--short-ease),background var(--short-fast) var(--short-ease),border-color var(--short-fast) var(--short-ease)}
.short-button:hover{transform:translateY(-1px);box-shadow:var(--short-shadow-sm)}
.short-button--primary{background:linear-gradient(180deg,#f3c65e,var(--short-gold));border-color:#c98c15;color:#17130a}
.short-button--dark{background:var(--short-sidebar);border-color:var(--short-sidebar);color:#fff}
.short-button--ghost{background:transparent}
.short-button--danger{background:var(--short-danger);border-color:var(--short-danger);color:#fff}
.short-icon-button{width:42px;padding:0}
.short-card{background:var(--short-surface);border:1px solid var(--short-line);border-radius:var(--short-radius-lg);box-shadow:var(--short-shadow-sm)}
.short-input{min-height:44px;border:1px solid var(--short-line);border-radius:var(--short-radius-md);background:var(--short-surface);color:var(--short-text);padding:0 14px}
.short-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;background:var(--short-gold-soft);color:var(--short-gold-strong);padding:6px 10px;font-size:12px;font-weight:800}
.short-eyebrow{color:var(--short-gold-strong);letter-spacing:.13em;text-transform:uppercase;font-size:11px;font-weight:850}
.short-muted{color:var(--short-muted)}

/* Shared product marks. */
body.short-ui-v7 .jovi48-brand,
body.short-ui-v7 .jovi-editor-mark,
body.short-ui-v7 .ps-public-brand{letter-spacing:normal}
body.short-ui-v7 .jovi48-brand strong,
body.short-ui-v7 .jovi-editor-mark strong,
body.short-ui-v7 .ps-public-brand strong{font-weight:950;letter-spacing:.07em}
body.short-ui-v7 .jovi48-brand span,
body.short-ui-v7 .jovi-editor-mark span,
body.short-ui-v7 .ps-public-brand small{text-transform:uppercase;letter-spacing:.16em}

/* Dashboard: preserve structure, unify surfaces and controls. */
body.short-ui-v7.jovi-dashboard{background:var(--short-bg)}
body.short-ui-v7 .jovi48-sidebar{background:linear-gradient(180deg,var(--short-sidebar),var(--short-sidebar-2));border-right:1px solid rgba(255,255,255,.08)}
body.short-ui-v7 .jovi48-main{background:radial-gradient(circle at 55% -10%,rgba(226,173,53,.12),transparent 34%),var(--short-bg)}
body.short-ui-v7 .jovi48-new,
body.short-ui-v7 .jovi48-hero-actions button{background:linear-gradient(180deg,#f2c45e,var(--short-gold));color:#17130a;border-color:#c98c15;box-shadow:0 12px 30px rgba(189,127,11,.20)}
body.short-ui-v7 .jovi48-create-hero,
body.short-ui-v7 .jovi48-starting-points>button,
body.short-ui-v7 .jovi48-project-grid>*{border-color:var(--short-line)}
body.short-ui-v7 .jovi48-create-hero,
body.short-ui-v7 .jovi48-starting-points>button{background:color-mix(in srgb,var(--short-surface) 94%,transparent);box-shadow:var(--short-shadow-sm)}
body.short-ui-v7 .jovi48-search,
body.short-ui-v7 .jovi48-project-tools label,
body.short-ui-v7 .jovi48-project-tools select,
body.short-ui-v7 .jovi48-project-tools>div{border-color:var(--short-line);background:var(--short-surface)}

/* Editor: unify chrome only; canvas and editing behavior are untouched. */
body.short-ui-v7.editor-page{background:var(--short-bg)}
body.short-ui-v7 .editor-topbar{background:color-mix(in srgb,var(--short-surface) 94%,transparent);border-bottom:1px solid var(--short-line);backdrop-filter:blur(18px)}
body.short-ui-v7 .editor-topbar .title-input{border-color:var(--short-line);background:var(--short-surface);color:var(--short-text);border-radius:var(--short-radius-md)}
body.short-ui-v7 .editor-topbar .button{border-radius:var(--short-radius-md);transition:transform var(--short-fast) var(--short-ease),box-shadow var(--short-normal) var(--short-ease)}
body.short-ui-v7 .editor-topbar .button:hover{transform:translateY(-1px)}
body.short-ui-v7 .editor-topbar .button.primary,
body.short-ui-v7 #render-project{background:linear-gradient(180deg,#f1c258,var(--short-gold));border-color:#c98c15;color:#17130a}
body.short-ui-v7 .editor-topbar .director-launch{background:var(--short-sidebar);border-color:var(--short-sidebar);color:#fff}
body.short-ui-v7 .toast{border-radius:var(--short-radius-md);box-shadow:var(--short-shadow-md)}

/* Public landing: same family without flattening its marketing identity. */
body.short-ui-v7.ps-landing{background:var(--short-bg)}
body.short-ui-v7 .ps-public-nav{background:color-mix(in srgb,var(--short-surface) 92%,transparent);border-bottom-color:var(--short-line);backdrop-filter:blur(18px)}
body.short-ui-v7 .ps-primary-button,
body.short-ui-v7 .ps-nav-cta,
body.short-ui-v7 .ps-price-button{border-radius:var(--short-radius-md);background:linear-gradient(180deg,#f2c45e,var(--short-gold));color:#17130a}
body.short-ui-v7 .ps-price-card{border-color:var(--short-line);border-radius:var(--short-radius-lg);background:var(--short-surface);box-shadow:var(--short-shadow-sm)}

/* Shared modal language without changing dialog dimensions or JS hooks. */
body.short-ui-v7 dialog{border-color:var(--short-line)}
body.short-ui-v7 dialog>form,
body.short-ui-v7 dialog>div{border-radius:var(--short-radius-lg)}
body.short-ui-v7 .notice,
body.short-ui-v7 .empty-state{border-radius:var(--short-radius-md)}

@media(max-width:820px){
  :root{--short-radius-lg:16px;--short-radius-xl:20px}
  body.short-ui-v7 .editor-topbar{backdrop-filter:none}
}
@media(prefers-reduced-motion:reduce){
  .short-button,body.short-ui-v7 .editor-topbar .button{transition:none!important}
}
