/* Imara Studio Phase 19 — premium, consistent application UI */
:root{
  --ui-bg:#f5f7fb;
  --ui-surface:#ffffff;
  --ui-surface-soft:#f8f9fc;
  --ui-surface-tint:#f2efff;
  --ui-text:#171a24;
  --ui-muted:#667085;
  --ui-subtle:#98a2b3;
  --ui-border:#e4e7ec;
  --ui-border-strong:#d0d5dd;
  --ui-primary:#6d3df2;
  --ui-primary-hover:#5c2ed8;
  --ui-primary-soft:#eee9ff;
  --ui-success:#128a5b;
  --ui-success-soft:#eaf8f1;
  --ui-warning:#b15c00;
  --ui-warning-soft:#fff4e5;
  --ui-danger:#c4324a;
  --ui-danger-soft:#fff0f2;
  --ui-shadow-sm:0 1px 2px rgba(16,24,40,.05),0 1px 3px rgba(16,24,40,.08);
  --ui-shadow:0 10px 30px rgba(22,26,43,.08);
  --ui-shadow-lg:0 24px 64px rgba(22,26,43,.14);
  --ui-radius-sm:10px;
  --ui-radius:16px;
  --ui-radius-lg:24px;
  --ui-focus:0 0 0 4px rgba(109,61,242,.14);
}

/* Application canvas */
body:has(.studio-sidebar){background:var(--ui-bg);color:var(--ui-text);font-family:"DM Sans","Avenir Next","Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body:has(.studio-sidebar) h1,body:has(.studio-sidebar) h2,body:has(.studio-sidebar) h3,body:has(.studio-sidebar) h4{font-family:"Manrope","Avenir Next","Segoe UI",Arial,sans-serif;color:var(--ui-text);letter-spacing:-.025em}
body:has(.studio-sidebar) p{color:var(--ui-muted)}
body:has(.studio-sidebar) main{min-height:calc(100vh - 72px)}
body:has(.studio-sidebar) ::selection{background:#dcd2ff;color:#2d176d}

/* Sidebar and topbar refinements */
.studio-sidebar{background:#11121a!important;border-right:1px solid rgba(255,255,255,.08)!important;box-shadow:8px 0 30px rgba(15,16,25,.08)}
.sidebar-brand{font-weight:800!important;letter-spacing:-.02em}
.sidebar-brand-mark{background:linear-gradient(145deg,#8d66ff,#35d7b2)!important;box-shadow:0 8px 24px rgba(109,61,242,.35)}
.workspace-switcher-trigger,.sidebar-more summary,.sidebar-account button{transition:background .18s ease,border-color .18s ease,transform .18s ease}
.workspace-switcher-trigger:hover,.sidebar-more summary:hover,.sidebar-account button:hover{background:rgba(255,255,255,.07)!important}
.sidebar-create-button{background:linear-gradient(135deg,#7b4dff,#6031df)!important;box-shadow:0 12px 28px rgba(109,61,242,.32)!important;transition:transform .18s ease,box-shadow .18s ease!important}
.sidebar-create-button:hover{transform:translateY(-1px);box-shadow:0 16px 34px rgba(109,61,242,.4)!important}
.sidebar-groups a{border-radius:11px!important;transition:background .16s ease,color .16s ease,transform .16s ease}
.sidebar-groups a:hover{transform:translateX(2px)}
.sidebar-groups a.active,.sidebar-groups a[aria-current="page"]{background:rgba(137,102,255,.16)!important;color:#fff!important;box-shadow:inset 3px 0 #9a78ff}
.studio-topbar{background:rgba(255,255,255,.88)!important;border-bottom:1px solid rgba(217,221,229,.9)!important;backdrop-filter:blur(18px) saturate(140%);box-shadow:0 1px 0 rgba(16,24,40,.03)}
.topbar-title strong{color:var(--ui-text)!important}.topbar-title span{color:var(--ui-muted)!important}
.topbar-command,.topbar-icon,.profile-chip,.topbar-credits{border-color:var(--ui-border)!important;background:#fff!important;color:var(--ui-text)!important;box-shadow:var(--ui-shadow-sm)}
.topbar-command:hover,.topbar-icon:hover,.profile-chip:hover,.topbar-credits:hover{border-color:#c9baff!important;box-shadow:0 0 0 3px rgba(109,61,242,.08)}

/* Uniform page spacing and headers */
:is(.dashboard,.page-wrap,.studio-page,.pricing-page,.growth-page,.phase18-page,.premium-brand-page,.simple-assets,.simple-campaign,.simple-campaign-builder,.campaign-wizard,.app-main){color:var(--ui-text)}
:is(.dashboard,.page-wrap,.studio-page,.pricing-page,.growth-page,.phase18-page,.premium-brand-page,.app-main){width:100%;max-width:1380px;margin-inline:auto;padding-left:clamp(16px,3vw,36px);padding-right:clamp(16px,3vw,36px)}
.page-head,.welcome,.history-header{align-items:flex-start!important;margin-bottom:28px!important}
.page-head h1,.welcome h1,.history-header h1{font-size:clamp(2rem,4vw,3.15rem)!important;margin-bottom:8px!important}
.page-head p,.welcome p,.history-header p{font-size:1rem;max-width:760px;margin:0}
.eyebrow{color:#6941c6!important;letter-spacing:.14em!important;font-weight:800!important;margin-bottom:10px!important}

/* Cards and panels */
body:has(.studio-sidebar) :is(.panel,.calm-panel,.phase18-panel,.phase18-wizard,.growth-card,.phase6-card,.hero-card,.review-create-card,.recent-work-panel,.premium-card){background:var(--ui-surface)!important;color:var(--ui-text)!important;border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius-lg)!important;box-shadow:var(--ui-shadow-sm)!important}
body:has(.studio-sidebar) :is(.panel,.calm-panel,.phase18-panel,.growth-card,.phase6-card){transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
body:has(.studio-sidebar) :is(.panel,.calm-panel,.phase18-panel,.growth-card,.phase6-card):hover{border-color:#d9d2ed!important;box-shadow:var(--ui-shadow)!important}
.panel-head,.calm-panel-head{gap:16px}.panel-head h2,.calm-panel-head h2{margin-bottom:0!important;font-size:1.3rem!important}

/* Global form system: fixes browser-default controls on older pages */
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) label{color:#344054;font-weight:650;gap:7px}
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea){width:100%;min-height:46px;border:1px solid var(--ui-border-strong)!important;border-radius:12px!important;background:#fff!important;color:var(--ui-text)!important;padding:11px 13px!important;font:inherit!important;line-height:1.4;box-shadow:0 1px 2px rgba(16,24,40,.03);outline:none;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) textarea{min-height:112px;resize:vertical}
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,#667085 50%),linear-gradient(135deg,#667085 50%,transparent 50%)!important;background-position:calc(100% - 18px) 19px,calc(100% - 13px) 19px!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important;padding-right:38px!important}
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) :is(input,select,textarea):hover{border-color:#b9afda!important}
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) :is(input,select,textarea):focus{border-color:var(--ui-primary)!important;box-shadow:var(--ui-focus)!important}
body:has(.studio-sidebar) :is(main,.create-command-modal,.command-palette,.media-preview-drawer) :is(input,textarea)::placeholder{color:#98a2b3;opacity:1}
body:has(.studio-sidebar) input[type="checkbox"],body:has(.studio-sidebar) input[type="radio"]{accent-color:var(--ui-primary)}
body:has(.studio-sidebar) input[type="file"]{padding:8px!important}
body:has(.studio-sidebar) input[type="file"]::file-selector-button{border:0;border-radius:9px;background:var(--ui-primary-soft);color:#5b2cc8;padding:9px 12px;margin-right:10px;font-weight:700;cursor:pointer}
body:has(.studio-sidebar) fieldset{min-width:0;border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius)!important;padding:18px!important;background:var(--ui-surface-soft)}
body:has(.studio-sidebar) legend{padding:0 7px;color:#344054;font-weight:800}
body:has(.studio-sidebar) .form-grid{gap:18px!important}
body:has(.studio-sidebar) .form-grid>button,body:has(.studio-sidebar) .form-grid>.button{justify-self:start}

/* Universal buttons, including pages using btn-* names */
body:has(.studio-sidebar) :is(.button,.btn,button.btn-primary,a.btn-primary){min-height:44px;border:1px solid transparent;border-radius:12px;padding:11px 18px;font:700 14px/1.2 "DM Sans",sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease,border-color .16s ease}
body:has(.studio-sidebar) :is(.button:not(.ghost):not(.light),.btn-primary){background:linear-gradient(135deg,#7748f8,#5f31df)!important;color:#fff!important;box-shadow:0 8px 20px rgba(109,61,242,.22)!important}
body:has(.studio-sidebar) :is(.button:not(.ghost):not(.light),.btn-primary):hover{transform:translateY(-1px);background:linear-gradient(135deg,#6e3eee,#5427cf)!important;box-shadow:0 12px 24px rgba(109,61,242,.3)!important}
body:has(.studio-sidebar) :is(.button.ghost,.btn-secondary){background:#fff!important;color:#344054!important;border-color:var(--ui-border-strong)!important;box-shadow:var(--ui-shadow-sm)!important}
body:has(.studio-sidebar) :is(.button.ghost,.btn-secondary):hover{background:#f9fafb!important;border-color:#b9afda!important;color:#4d2bb0!important}
body:has(.studio-sidebar) :is(.btn-danger,.button.danger){background:var(--ui-danger-soft)!important;color:var(--ui-danger)!important;border-color:#ffd0d6!important;box-shadow:none!important}
body:has(.studio-sidebar) :is(button,.button,.btn):focus-visible{outline:none;box-shadow:var(--ui-focus)!important}
body:has(.studio-sidebar) :is(button,.button,.btn)[disabled]{opacity:.55;cursor:not-allowed;transform:none!important}
body:has(.studio-sidebar) .button.full{width:100%}

/* Tables: fixes plain browser tables */
body:has(.studio-sidebar) table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:1px solid var(--ui-border);border-radius:14px;overflow:hidden;font-size:.92rem}
body:has(.studio-sidebar) thead th{background:#f8f9fc;color:#475467;text-align:left;font-size:.76rem;text-transform:uppercase;letter-spacing:.055em;padding:12px 14px;border-bottom:1px solid var(--ui-border);white-space:nowrap}
body:has(.studio-sidebar) tbody td{padding:14px;border-bottom:1px solid #edf0f4;color:#344054;vertical-align:middle}
body:has(.studio-sidebar) tbody tr:last-child td{border-bottom:0}
body:has(.studio-sidebar) tbody tr:hover td{background:#faf9ff}
body:has(.studio-sidebar) .ui-table-wrap{width:100%;overflow:auto;border-radius:14px}

/* Lists, statuses, badges */
body:has(.studio-sidebar) :is(.status,.badge,.tag,.pill){font-weight:750;letter-spacing:.02em}
body:has(.studio-sidebar) .status.completed{background:var(--ui-success-soft)!important;color:var(--ui-success)!important}
body:has(.studio-sidebar) :is(.status.processing,.status.queued){background:var(--ui-warning-soft)!important;color:var(--ui-warning)!important}
body:has(.studio-sidebar) .status.failed{background:var(--ui-danger-soft)!important;color:var(--ui-danger)!important}
.list-row,.approval-card,.growth-row{border-color:var(--ui-border)!important}

/* Campaign wizard */
.phase18-hero,.phase18-command-hero,.calm-dashboard-hero{position:relative;overflow:hidden;border-color:#ddd5f6!important;background:radial-gradient(circle at 92% 8%,rgba(78,197,171,.16),transparent 28%),radial-gradient(circle at 65% 0%,rgba(109,61,242,.16),transparent 35%),linear-gradient(135deg,#fff 0%,#faf8ff 58%,#f3fbfa 100%)!important;box-shadow:0 16px 50px rgba(64,42,126,.08)!important}
.phase18-hero:after,.phase18-command-hero:after,.calm-dashboard-hero:after{content:"";position:absolute;right:-70px;bottom:-110px;width:260px;height:260px;border:42px solid rgba(109,61,242,.05);border-radius:50%;pointer-events:none}
.phase18-step:not(.active)[hidden]{display:none!important}.phase18-step.active{animation:uiFadeUp .28s ease both}
.phase18-step-head>span{box-shadow:0 9px 22px rgba(109,61,242,.26)}
.phase18-mode-grid label div{background:#fff!important;box-shadow:var(--ui-shadow-sm);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.phase18-mode-grid label div:hover{transform:translateY(-2px);border-color:#bcaef0!important;box-shadow:var(--ui-shadow)}
.phase18-review-card{border:1px solid var(--ui-border);background:#f8f9fc!important}
.phase18-review-card span{box-shadow:var(--ui-shadow-sm)}
.phase18-choice-group{background:transparent!important;border:0!important;padding:0!important}
.phase18-choice-group label span{background:#fff;box-shadow:var(--ui-shadow-sm);transition:.16s ease}
.phase18-choice-group label span:hover{border-color:#bcaef0}
.phase18-assistant{background:linear-gradient(145deg,#16131f,#29203f)!important;box-shadow:0 18px 40px rgba(25,18,45,.2)}

/* Dashboard */
.calm-dashboard{max-width:1380px!important}
.calm-dashboard-hero{border-radius:28px!important;padding:clamp(24px,4vw,44px)!important}
.calm-dashboard-hero h1{font-size:clamp(2.2rem,4.5vw,4rem)!important;max-width:850px}
.dashboard-campaign-composer{border-color:#d9d2ef!important;box-shadow:0 16px 36px rgba(57,36,115,.09)!important;max-width:820px}
.dashboard-campaign-composer:focus-within{border-color:var(--ui-primary)!important;box-shadow:var(--ui-focus),0 16px 36px rgba(57,36,115,.09)!important}
.dashboard-campaign-composer input{min-height:44px!important;box-shadow:none!important;border:0!important}
.calm-create-grid>a{background:#fff!important;border:1px solid var(--ui-border)!important;box-shadow:var(--ui-shadow-sm)!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.calm-create-grid>a:hover{transform:translateY(-3px);border-color:#cdbff8!important;box-shadow:var(--ui-shadow)!important}
.calm-create-grid>a>span{background:var(--ui-primary-soft)!important;color:#6131d9!important}
.daily-summary-card article{box-shadow:var(--ui-shadow-sm);transition:transform .18s ease,box-shadow .18s ease}
.daily-summary-card article:hover{transform:translateY(-2px);box-shadow:var(--ui-shadow)}
.daily-summary-card strong{color:#271755}

/* Templates and asset cards */
.template-card,.clean-asset-card,.creation,.history-card{background:#fff!important;border:1px solid var(--ui-border)!important;color:var(--ui-text)!important;box-shadow:var(--ui-shadow-sm)!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.template-card:hover,.clean-asset-card:hover,.creation:hover,.history-card:hover{transform:translateY(-3px);border-color:#cdbff8!important;box-shadow:var(--ui-shadow)!important}
.template-preview-button img,.clean-asset-card img,.clean-asset-card video{background:#eef1f6}
.template-filter-panel,.asset-filter-bar{background:#fff!important;border:1px solid var(--ui-border)!important;border-radius:18px!important;padding:14px!important;box-shadow:var(--ui-shadow-sm)}
.template-filter-panel{display:grid!important;grid-template-columns:minmax(220px,1.5fr) repeat(5,minmax(130px,1fr)) auto;gap:10px;align-items:center}
.template-card-copy h3{color:var(--ui-text)!important}.template-card-copy p{color:var(--ui-muted)!important}

/* Modals, popovers, menus */
.create-command-panel,.command-palette-panel,.notification-panel,.workspace-switcher-menu,.template-preview-modal section{background:#fff!important;color:var(--ui-text)!important;border:1px solid var(--ui-border)!important;box-shadow:var(--ui-shadow-lg)!important}
.command-grid a,.command-results a,.workspace-switcher-menu button,.notification-list-mini a{border-radius:12px!important;transition:background .15s ease,transform .15s ease}
.command-grid a:hover,.command-results a:hover,.workspace-switcher-menu button:hover,.notification-list-mini a:hover{background:#f6f3ff!important;transform:translateY(-1px)}
.command-grid strong,.command-results strong,.workspace-switcher-menu strong,.notification-panel h3{color:var(--ui-text)!important}
.command-grid small,.command-results small,.workspace-switcher-menu small,.notification-panel p,.notification-panel small{color:var(--ui-muted)!important}
.create-command-modal,.command-palette,.template-preview-modal{backdrop-filter:blur(8px)}

/* Auth, errors, public shares */
.auth-wrap{background:radial-gradient(circle at 75% 15%,rgba(109,61,242,.2),transparent 30%),linear-gradient(140deg,#11131e,#191428)!important}
.auth-card{background:rgba(255,255,255,.98)!important;color:var(--ui-text)!important;border-color:rgba(255,255,255,.7)!important;box-shadow:0 28px 80px rgba(0,0,0,.28)!important}
.auth-card h1{color:var(--ui-text)!important}.auth-card p,.auth-card label{color:var(--ui-muted)!important}.auth-card input{background:#fff!important;color:var(--ui-text)!important;border-color:var(--ui-border-strong)!important}
.error-page,.share-page{min-height:100vh;padding:40px 18px;background:radial-gradient(circle at top right,rgba(109,61,242,.14),transparent 35%),var(--ui-bg);color:var(--ui-text)}
.share-page>.panel,.error-page>.panel{width:min(760px,100%);margin:8vh auto;background:#fff!important;color:var(--ui-text)!important;border:1px solid var(--ui-border)!important;box-shadow:var(--ui-shadow-lg)!important}
.share-preview{min-height:260px;border:1px dashed #cfd4dc;border-radius:16px;background:#f8f9fc;display:grid;place-items:center;color:var(--ui-muted);padding:24px;text-align:center}

/* Footer */
.app-footer{color:#667085!important;border-color:var(--ui-border)!important;background:transparent!important}
.app-footer a:hover{color:var(--ui-primary)}

/* Loading and interaction polish */
.ui-submit-loading{pointer-events:none;opacity:.72}
.ui-submit-loading:after{content:"";width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:uiSpin .7s linear infinite}
.ui-file-name{font-size:.8rem;color:var(--ui-muted);margin-top:5px}
@keyframes uiSpin{to{transform:rotate(360deg)}}
@keyframes uiFadeUp{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Responsive */
@media(max-width:1180px){.template-filter-panel{grid-template-columns:repeat(3,1fr)}.template-filter-panel>input{grid-column:span 2}.template-filter-panel .button{width:100%}}
@media(max-width:900px){.studio-topbar{padding-inline:14px!important}.topbar-title span,.topbar-command strong,.topbar-command kbd{display:none!important}.topbar-command{width:44px!important;padding:0!important}.daily-summary-card{grid-template-columns:repeat(2,1fr)!important}.phase18-business-metrics{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:680px){body:has(.studio-sidebar) :is(.dashboard,.page-wrap,.studio-page,.pricing-page,.growth-page,.phase18-page,.premium-brand-page,.app-main){padding-left:14px;padding-right:14px}.page-head{flex-direction:column;gap:14px}.template-filter-panel{grid-template-columns:1fr}.template-filter-panel>input{grid-column:auto}.dashboard-campaign-composer{flex-direction:column}.dashboard-campaign-composer .button{width:100%}.phase18-step-actions{position:sticky;bottom:10px;z-index:3;padding:10px;background:rgba(255,255,255,.94);border:1px solid var(--ui-border);border-radius:14px;box-shadow:var(--ui-shadow)}.phase18-step-actions>*{flex:1}.daily-summary-card{grid-template-columns:1fr 1fr!important}body:has(.studio-sidebar) table{min-width:680px}}
@media(max-width:420px){.daily-summary-card{grid-template-columns:1fr!important}.topbar-credits span{display:none}.phase18-mode-grid{gap:10px!important}}