@import url('/onboarding-components.css');
/* A reading scale, not a zoom layer. Scoped aliases leave the approved auth
   composition and public profile templates at their existing scale. */
html:has(.workspace){scroll-padding-top:calc(var(--header-height) + 20px)}
.workspace,body:has(.workspace)>dialog,body:has(.workspace)>#toast,body:has(.workspace)>.drag-preview{
  --ui-fine:var(--type-fine);--ui-support:var(--type-support);
  --ui-label:var(--type-label);--ui-interface:var(--type-interface);
  --ui-body:var(--type-body);--ui-section:var(--type-section);
  font-size:var(--ui-body);
}
.workspace{--sidebar-width:var(--nav-width)}
.workspace.collapsed{--sidebar-width:76px}
.workspace .main-content{max-width:var(--workspace-max);padding:40px var(--workspace-gutter);min-height:calc(100dvh - 150px)}
.workspace .workspace-footer{max-width:var(--workspace-max);padding:0 var(--workspace-gutter) 26px;line-height:1.7}
.workspace .page-heading h1{font-size:var(--type-page)}
.workspace .page-subtitle{font-size:var(--ui-body);line-height:1.7}
.workspace .page-heading .eyebrow{letter-spacing:1.3px}
.workspace .panel-heading h2{font-size:var(--ui-section)}
.workspace .panel-heading p{line-height:1.65}
.workspace .panel-heading{flex-wrap:wrap}
.workspace .panel{padding:28px}
.workspace .btn,body:has(.workspace)>dialog .btn{font-size:var(--ui-label);min-height:var(--control-height);padding:11px 18px}
.workspace .btn .icon{width:19px;height:19px}
.workspace .icon-btn,body:has(.workspace)>dialog .icon-btn{width:var(--control-compact);height:var(--control-compact);flex-shrink:0}
.workspace input:not([type=checkbox],[type=radio],[type=file]),.workspace select,.workspace textarea,
body:has(.workspace)>dialog input:not([type=checkbox],[type=radio],[type=file]),body:has(.workspace)>dialog select,body:has(.workspace)>dialog textarea{
  font-size:var(--ui-body);min-height:var(--control-height);padding:12px 14px;line-height:1.5;
}
.workspace textarea{line-height:1.75}
.workspace .field{font-size:var(--ui-label);gap:9px;margin-bottom:22px}
.workspace .field small{font-size:var(--ui-support);letter-spacing:0;line-height:1.6}
.workspace .field>span:first-child{flex-wrap:wrap}
.workspace .small{font-size:var(--ui-support)}
.workspace .badge{line-height:1.5}
.workspace .segmented button{min-height:40px;padding:8px 13px;font-size:var(--ui-support)}

/* Persistent frame: generous labels, fixed icon alignment and measured indicator. */
.workspace .sidebar{padding:24px 16px 14px}
/* One 36px icon rail: the wordmark globe is centred halfway down its 2.1em image. */
.workspace .sidebar-brand{font-size:21px;padding:0 calc(30px - 1.05em) 24px;gap:6px}
.workspace .sidebar-brand>.icon-btn{width:36px;height:40px}
.workspace .sidebar-brand .brand-wordmark{font-size:inherit}
.workspace .sidebar-brand .brand-symbol .brand-mark{width:32px;height:32px}
.workspace .workspace-switch{padding:13px 16px 13px 11px;min-height:70px;margin-bottom:18px}
/* A long workspace name truncates instead of pushing the chevron out of the button. */
.workspace .workspace-switch .nav-label{min-width:0}.workspace .workspace-switch>.icon{flex:none}
.workspace .workspace-switch strong,.workspace .account-control strong{font-size:var(--ui-interface)}
.workspace .workspace-switch small,.workspace .account-control small{font-size:var(--ui-fine)}
.workspace .workspace-initial{width:34px;height:34px;flex:none}
.workspace .side-nav{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:max-content;gap:4px;flex-shrink:0;height:max-content;min-height:max-content}
.workspace .sidebar-brand,.workspace .workspace-switch,.workspace .sidebar-bottom{flex-shrink:0}
.workspace .nav-section{font-size:var(--ui-fine);letter-spacing:.85px;padding:12px 12px 9px}
.workspace .nav-item{font-size:1rem;min-height:48px;padding:12px;gap:10px;line-height:1.5}
.workspace .nav-item>.icon{box-sizing:border-box;flex:none;width:36px;height:21px;padding-inline:7.5px}
/* Match the section menu without changing sidebar spacing or navigation. */
.workspace .nav-item:hover{background:var(--surface-hover);color:var(--text-primary);box-shadow:inset 0 0 0 1px var(--border);transform:none}
.workspace .nav-item.active{background:var(--accent-subtle);color:var(--text-primary);box-shadow:inset 0 0 0 1px var(--accent-glow);transform:none}
.workspace .nav-item.active>.icon{color:var(--accent)}
.workspace .nav-divider{margin:12px 10px 8px}
.workspace .sidebar-bottom{padding-top:22px}
.workspace .sandbox-note{padding:16px}
.workspace .sidebar .sandbox-note .nav-label{white-space:normal;min-width:0;overflow-wrap:anywhere}
.workspace .sandbox-note .btn{padding:10px 0 0;font-size:var(--ui-fine)}
.workspace .sandbox-symbol{margin-bottom:8px}
.workspace .account-control{padding:18px 2px 0;margin-top:18px}
.workspace .avatar{width:40px;height:40px;font-size:var(--ui-support)}
.workspace .avatar.large{width:68px;height:68px;font-size:22px}
.workspace .topbar{height:var(--header-height);padding:0 var(--workspace-gutter)}
.workspace .header-context{font-size:var(--ui-label)}
.workspace .command-trigger{font-size:var(--ui-label);min-height:44px}
.workspace .command-trigger .icon{width:20px}
.workspace .header-tools{gap:14px}
.workspace .header-tools>.btn.primary{min-height:46px;font-size:var(--ui-label)}
.workspace .mode-label{font-size:var(--ui-fine);letter-spacing:.7px}
.workspace.collapsed .sidebar{padding:24px 10px 14px}
.workspace.collapsed .sidebar-brand{padding:0 0 20px}
.workspace.collapsed .workspace-switch{padding:10px 0;justify-content:center}
.workspace.collapsed .nav-item{padding:12px;justify-content:center}

/* Overview and analytics: keep charts and metric values in proportion to labels. */
.workspace .metrics-grid{gap:20px}
.workspace .metric{padding:24px}
.workspace .metric>p{font-size:var(--ui-label)}
.workspace .metric-top .micro{font-size:var(--ui-fine);letter-spacing:.5px}
.workspace .metric-icon{width:38px;height:38px}
.workspace .metric-icon>.icon{width:20px;height:20px}
.workspace .chart{padding-left:34px}
.workspace .chart-plot{height:240px}
.workspace .analytics-chart-panel .chart-plot{height:280px}
.workspace .chart-legend{gap:18px}
.workspace .chart-source{letter-spacing:0}
.workspace .connection-orbit>div>span{font-size:var(--ui-fine);letter-spacing:.4px}
.workspace .connection-bottom{flex-wrap:wrap}
.workspace .post-row-copy strong,.workspace .launch-steps strong,.workspace .activity-row strong{font-size:var(--ui-interface)}
.workspace .post-row-copy small,.workspace .launch-steps small,.workspace .activity-row small{font-size:var(--ui-support)}
.workspace .post-thumb{width:52px;height:58px}
.workspace .inspiration-panel h2{font-size:30px}
.workspace .inspiration-panel>p{font-size:var(--ui-support);max-width:370px}
.workspace .comparison-panel>div:last-child{flex-wrap:wrap;gap:32px}

/* Profile, link builder, account management and working/settings panels. */
.workspace .builder-layout{grid-template-columns:minmax(0,1.55fr) minmax(320px,1fr);gap:var(--workspace-gap)}
.workspace .preview-column{max-width:390px;top:calc(var(--header-height) + 24px)}
.workspace .preview-label>span{font-size:var(--ui-fine);letter-spacing:.8px}
.workspace .link-copy>strong{font-size:var(--ui-interface)}
.workspace .link-copy>small{font-size:var(--ui-support);max-width:360px}
.workspace .link-row{padding:14px 10px;gap:10px;flex-wrap:wrap}
.workspace .row-controls{max-width:none;flex-wrap:nowrap;margin-left:auto}
.workspace .row-controls .icon-btn{width:36px;height:44px}
.workspace .link-copy{min-width:120px}
.workspace .theme-options{gap:14px}
.workspace .theme-choice{font-size:var(--ui-support)}
.workspace .social-editor summary{min-height:44px}
.workspace .bio-description{font-size:var(--ui-label);max-width:320px}
.workspace .bio-avatar{width:76px;height:76px;font-size:26px}
.workspace .preview-link{font-size:var(--ui-label);min-height:50px}
.workspace .profile-form .form-footer{flex-wrap:wrap}
.workspace .account-card>p,.workspace .integration-notice p,.workspace .studio-provider p{font-size:var(--ui-support);line-height:1.7}
.workspace .account-card h2{font-size:22px}
.workspace .account-simulation{flex-wrap:wrap}
.workspace .account-simulation strong{font-size:var(--ui-label)}
.workspace .account-simulation .btn{min-height:44px;padding:10px 12px;font-size:var(--ui-support)}
.workspace .account-simulation .btn .icon{width:16px;height:16px}
.workspace .integration-notice{flex-wrap:wrap}
.workspace .writing-panel>textarea{font-size:var(--ui-body)}
.workspace .writing-panel .form-footer{flex-wrap:wrap}
.workspace .writing-panel .form-footer>.small{max-width:240px}
.workspace .settings-layout{max-width:1320px;gap:28px}
.workspace .preference-row{gap:20px}
.workspace .preference-row small{max-width:320px;line-height:1.7}
.workspace .money-hero{padding:36px 40px}
.workspace .money-hero p{font-size:var(--ui-body);max-width:540px}

/* Calendar keeps seven readable columns; its own scroll region is intentional. */
.workspace .calendar-panel{padding:0}
.workspace .calendar-toolbar{flex-wrap:wrap}
.workspace .calendar-date-nav{flex-wrap:wrap}
.workspace .calendar-date-nav h2{font-size:22px;min-width:160px}
.workspace .calendar-filters{flex-wrap:wrap;gap:12px}
.workspace .calendar-filters select{font-size:var(--ui-support);min-height:44px;padding:10px}
.workspace .calendar-post-top{flex-wrap:wrap}
.workspace .calendar-post-top time{font-size:var(--ui-fine)}
.workspace .calendar-post-open{font-size:var(--ui-support);min-height:44px}
.workspace .calendar-day{min-height:152px;padding:10px}
.workspace .calendar-status{font-size:var(--ui-fine)}
.workspace .calendar-grip.icon-btn{width:24px;height:28px}
.workspace .day-add.icon-btn{width:28px;height:28px}
.workspace .calendar-footer{flex-wrap:wrap}
.workspace .calendar-footer>span:last-child{letter-spacing:.5px;white-space:normal}
.workspace .agenda-row .calendar-post-open{font-size:var(--ui-interface)}

/* Creator studio gets a true 1600px usable area and larger asset/account surfaces. */
.workspace .composer-layout{grid-template-columns:minmax(0,1.75fr) minmax(360px,1fr);gap:var(--workspace-gap)}
.workspace .composer-editor{padding:32px;container-type:inline-size}
.workspace .format-tabs>button{min-height:54px;font-size:var(--ui-interface)}
.workspace .studio-section-head h2{font-size:var(--ui-section)}
.workspace .studio-section-head p{font-size:var(--ui-interface)}
.workspace .upload-label{min-height:180px;padding:28px}
.workspace #media-workflow:has(.studio-media-card) .upload-label{min-height:124px;padding:24px}
.workspace .media-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px}
.workspace .studio-media-card{max-width:280px}
.workspace .media-card-actions .icon-btn{width:40px;height:44px}
.workspace .asset-caption strong{font-size:var(--ui-label)}
.workspace .asset-caption small{font-size:var(--ui-support)}
.workspace .composer-workspace #caption{min-height:200px;font-size:var(--ui-body);padding:20px}
.workspace .channel-chips{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.workspace .channel-chip{padding:16px;min-height:100px;gap:12px}
.workspace .channel-chip strong{font-size:var(--ui-interface)}
.workspace .channel-chip small{font-size:var(--ui-support)}
.workspace .channel-chip .account-state{font-size:var(--ui-fine)}
.workspace .channel-chip .platform-icon{width:36px;height:36px;font-size:21px}
.workspace .channel-chip>.icon{width:18px;height:18px}
.workspace .channel-chips .unavailable{min-height:88px}
.workspace .composer-workspace .post-preview-column{max-width:none;top:calc(var(--header-height) + 24px)}
.workspace .composer-workspace .post-preview-column.preview-tall{position:static}
.workspace .preview-label select{font-size:var(--ui-label);max-width:180px}
.workspace .social-preview-header{padding:22px;gap:14px}
.workspace .social-preview-header .avatar{width:48px;height:48px;font-size:var(--ui-body)}
.workspace .social-preview-header strong{font-size:var(--ui-body)}
.workspace .social-preview-header small{font-size:var(--ui-support)}
.workspace .social-preview-caption{font-size:var(--ui-body);padding:24px;min-height:90px}
.workspace .studio-preview-frame{max-height:none}
.workspace .studio-preview-frame video,.workspace .studio-preview-frame canvas{
  display:block;width:100%;height:auto;max-height:clamp(420px,calc(100dvh - 400px),860px);object-fit:contain;
}
.workspace .studio-drafts{padding:26px 30px}
.workspace .studio-draft-row{padding:18px 0;gap:16px}
.workspace .studio-draft-row strong{font-size:var(--ui-interface)}
.workspace .studio-draft-row small{font-size:var(--ui-support)}
@container (min-width:800px){.workspace .channel-chips{grid-template-columns:repeat(3,minmax(0,1fr))}}

@media(min-width:1920px){.workspace .main-content{padding-block:44px 36px}}
@media(max-width:1279px){
  .workspace{--nav-width:272px;--workspace-gutter:28px}
  .workspace .sidebar{padding-inline:12px}
  .workspace .sidebar-brand{font-size:19px}
  .workspace .nav-item{font-size:var(--ui-interface)}
  .workspace .account-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .workspace .dashboard-grid{grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)}
  .workspace .builder-layout{grid-template-columns:minmax(0,1.4fr) minmax(280px,1fr)}
  .workspace .row-controls{flex-wrap:wrap;max-width:108px}
  .workspace .metric{padding:18px}
  .workspace .metric-top .micro{max-width:85px;text-align:right}
}
@media(max-width:1199px){
  .workspace .composer-layout{grid-template-columns:minmax(0,1fr)}
  .workspace .composer-workspace .post-preview-column{position:static;max-width:640px;margin-inline:auto}
  .workspace .composer-editor{padding:26px}
  .workspace .studio-layout{grid-template-columns:minmax(0,1fr)}
}
@media(min-width:768px) and (max-width:1023px){
  .workspace{--sidebar-width:76px;--header-height:76px;--workspace-gutter:24px}
  .workspace .sidebar{padding-inline:10px}
  .workspace .sidebar-brand{padding:0 10px 22px}
  .workspace .workspace-switch{padding:10px 0;justify-content:center}
  .workspace .nav-item{justify-content:center}
  .workspace .account-control{padding-inline:0}
  .workspace .metrics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .workspace .builder-layout,.workspace .settings-layout{grid-template-columns:1fr}
  .workspace .preview-column{position:static}
  .workspace .dashboard-grid{grid-template-columns:1fr}
}
@media(max-width:767px){
  .workspace,.workspace.collapsed{--sidebar-width:0px;--header-height:68px;--workspace-gutter:18px;--workspace-gap:22px}
  .workspace .main-content{padding:26px 18px}
  .workspace .sidebar{width:268px;padding:24px 16px 16px}
  .workspace .sidebar-brand,.workspace.collapsed .sidebar-brand{flex-direction:row;justify-content:flex-start;padding:0 calc(30px - 1.05em) 24px}
  .workspace .sidebar .workspace-switch{padding:13px 11px;justify-content:flex-start}
  .workspace .sidebar .nav-item{justify-content:flex-start;font-size:var(--ui-interface)}
  .workspace .sidebar .account-control{justify-content:flex-start}
  .workspace .topbar{padding-inline:12px;gap:8px}
  .workspace .header-context{gap:4px;font-size:var(--ui-support)}
  .workspace .header-tools{gap:2px}
  .workspace .header-tools>.btn.primary{width:44px;height:44px;min-height:44px;padding:0;font-size:0}
  .workspace .header-tools>.btn.primary>.icon{width:20px;height:20px}
  .workspace .header-tools>[data-action=notifications]{width:44px}
  .workspace .command-trigger{width:40px;padding:10px}
  .workspace .panel{padding:20px}
  .workspace .page-heading{gap:18px}
  .workspace .heading-actions{flex-wrap:wrap}
  .workspace .page-subtitle{font-size:var(--ui-label)}
  .workspace .metrics-grid{gap:12px}
  .workspace .dashboard-grid{grid-template-columns:1fr}
  .workspace .metric{padding:16px}
  .workspace .metric-top{gap:5px;align-items:flex-start}
  .workspace .metric-top .micro{font-size:var(--ui-fine);max-width:66px}
  .workspace .metric-icon{width:30px;height:30px}
  .workspace .metric>p{font-size:var(--ui-support)}
  .workspace .panel-heading{gap:14px}
  .workspace .chart-panel .panel-heading{flex-wrap:wrap}
  .workspace .chart-panel .panel-heading h2{max-width:none}
  .workspace .chart-plot{height:190px}
  .workspace .chart-legend{gap:12px}
  .workspace .connection-bottom{align-items:flex-start;flex-direction:column}
  .workspace .connection-bottom p{max-width:none}
  .workspace .post-row{flex-wrap:wrap}
  .workspace .post-row-copy{flex-basis:140px}
  .workspace .post-row .badge{margin-left:62px}
  .workspace .builder-layout,.workspace .settings-layout{grid-template-columns:1fr}
  .workspace .preview-column{position:static;max-width:360px}
  .workspace .field-grid{grid-template-columns:1fr}
  .workspace .profile-photo-row{flex-wrap:wrap}
  .workspace .row-controls{width:100%;max-width:none;flex-wrap:wrap;justify-content:flex-end}
  .workspace .row-controls .icon-btn{width:44px;height:44px}
  .workspace .link-editor .panel-heading{align-items:flex-start;flex-direction:column}
  .workspace .link-editor .panel-heading>div{max-width:none}
  .workspace .account-grid{grid-template-columns:1fr}
  .workspace .integration-notice{padding:20px}
  .workspace .integration-notice>.btn{margin-left:0}
  .workspace .calendar-panel{padding:0}
  .workspace .calendar-toolbar{padding:18px 12px}
  .workspace .calendar-date-nav h2{min-width:130px;font-size:18px}
  .workspace .calendar-date-nav{gap:0}
  .workspace .calendar-date-nav .icon-btn{width:36px}
  .workspace .calendar-date-nav>.btn{padding-inline:10px;margin-left:0}
  .workspace .calendar-filters{padding-inline:12px}
  .workspace .calendar-filters select{padding-inline:6px}
  .workspace .calendar-grid{min-width:840px}
  .workspace .calendar-footer{font-size:var(--ui-fine)}
  .workspace .agenda-row{gap:10px}
  .workspace .money-hero{padding:25px}
  .workspace .money-hero p{font-size:var(--ui-label)}
  .workspace .composer-editor{padding:20px 16px}
  .workspace .format-tabs>button{font-size:var(--ui-support);min-height:52px}
  .workspace .studio-section-head{flex-wrap:wrap}
  .workspace .upload-label,.workspace #media-workflow:has(.studio-media-card) .upload-label{padding:20px 14px;min-height:136px}
  .workspace .media-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .workspace .media-card-actions .icon-btn{width:44px;height:44px}
  .workspace .channel-chips{grid-template-columns:1fr}
  .workspace .channel-chip{padding:16px;min-height:94px}
  .workspace .social-preview-header{padding:18px}
  .workspace .social-preview-header .avatar{width:42px;height:42px}
  .workspace .studio-drafts{padding:20px 16px}
}
@media(min-width:768px) and (max-height:1199px){
  .workspace .sandbox-note{display:none}
  .workspace .sidebar-brand{padding-bottom:16px}
  .workspace .workspace-switch{margin-bottom:10px}
}
/* Calendar titles clamp on an inner span, so the button keeps its touch-sized height without revealing a clipped extra line. */
.workspace .calendar-post-open{display:block;-webkit-line-clamp:unset}
.calendar-post-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.agenda-row .calendar-post-text{-webkit-line-clamp:3}
/* Chart lines use a non-scaling stroke, so a lingering one-unit dash covers only part of a wide chart. The dash exists only while the line draws in. */
.chart-line{stroke-dasharray:none;animation-fill-mode:backwards}
@keyframes draw-line{from{stroke-dasharray:1;stroke-dashoffset:1}to{stroke-dasharray:1;stroke-dashoffset:0}}
/* Disabled buttons: readable neutral state instead of faded orange (dark text on dim orange failed contrast). */
.btn:disabled,.btn[aria-disabled=true]{opacity:1;background:var(--surface-raised);border-color:var(--border);color:var(--text-muted);box-shadow:none}
.btn:disabled .icon,.btn[aria-disabled=true] .icon{opacity:.7}

/* Agency integration: reviewed components mounted in the existing app shell. */
.agency-offer-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.85fr);gap:var(--space-6);align-items:stretch;margin:0}
.agency-offer-story,.agency-offer-price{padding:var(--space-8)}
.agency-offer-story h2{font-size:clamp(24px,2vw,30px);line-height:1.2;margin-block:var(--space-4)}
.agency-offer-story>.sb-flow-features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 28px;margin-top:0;padding-top:32px}
.agency-offer-story>.sb-flow-features>li{margin:0;align-items:flex-start}
.agency-offer-story>.sb-flow-features strong{font-size:13px}
.agency-offer-story>.sb-flow-features small{font-size:12px;line-height:1.65}
.agency-offer-start{margin-top:28px;padding-top:24px;border-top:1px solid var(--border)}
.agency-offer-start>h3{font-size:13px;margin-bottom:16px}
.agency-offer-start .agency-steps{gap:12px;padding:0}
.agency-offer-start .ambassador-step{padding:16px;min-height:0;border-radius:12px}
.agency-offer-start .ambassador-step-top{margin-bottom:12px}
.agency-offer-start .ambassador-step-emoji{width:32px;height:32px;border-radius:9px}
.agency-offer-start .ambassador-step-emoji>.icon{width:18px;height:18px}
.agency-offer-start h4{font-size:12px;line-height:1.5}
.agency-offer-price{display:flex;flex-direction:column;gap:16px;min-width:0}
.agency-offer-price>h2,.agency-offer-price>p{margin:0}
.agency-offer-price>h2{font-size:24px}
.agency-offer-price>.sb-flow-price{margin:0}
.agency-offer-price>.btn.full{margin-top:auto;min-height:48px}
.agency-included{display:flex;gap:10px;align-items:center;color:var(--text);font-weight:600}
.agency-included>.icon{color:var(--accent)}
.agency-offer-footnote{font-size:11px;line-height:1.6;color:var(--text-muted)}
.agency-verify-step{display:flex;align-items:flex-start;gap:12px;padding:18px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.agency-verify-step h3{font-size:13px;line-height:1.5;margin:0 0 8px}
.agency-verify-step p{font-size:12px;line-height:1.7;margin:0 0 12px;color:var(--text-secondary)}
.agency-verify-step .btn{min-height:40px}
.agency-offer-price .agency-actions{margin-top:var(--space-5);flex-wrap:wrap}
.agency-offer-price .sb-flow-price{margin-top:var(--space-5)}
.agency-billing-summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);margin-block:var(--space-6)}
.agency-billing-summary h2{font-size:24px;margin-block:var(--space-2)}
.agency-team-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-4);border-bottom:1px solid var(--border)}
.agency-team-row:last-child{border:0}
.agency-team-row small{display:block;color:var(--text-secondary)}
@media(max-width:800px){.agency-offer-grid{grid-template-columns:1fr}.agency-offer-price{order:-1}.agency-billing-summary{align-items:flex-start;flex-direction:column}.agency-offer-story,.agency-offer-price{padding:var(--space-5)}}
@media(min-width:801px) and (max-width:1150px){.agency-offer-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr)}.agency-offer-story>.sb-flow-features{grid-template-columns:1fr;gap:18px}.agency-offer-start .agency-steps{grid-template-columns:1fr}.agency-offer-start .ambassador-step{display:flex;align-items:center;gap:14px}.agency-offer-start .ambassador-step-top{margin:0}.agency-offer-start .ambassador-step-number{display:none}}
@media(max-width:540px){.agency-offer-story>.sb-flow-features{grid-template-columns:1fr;gap:20px}.agency-offer-start .agency-steps{grid-template-columns:1fr}.agency-offer-start .ambassador-step{display:flex;align-items:center;gap:14px}.agency-offer-start .ambassador-step-top{margin:0}.agency-offer-start .ambassador-step-number{display:none}}

.agency-offer-price .feature-navigation{display:flex;width:100%;margin:0;gap:6px}
.agency-offer-price .feature-navigation button{flex:1;min-width:0;padding:10px;gap:8px}
.agency-offer-price .feature-navigation small{display:block}
.agency-payment-options{border-top:1px solid var(--border);padding-top:16px}
.agency-payment-options summary{cursor:pointer;color:var(--text-secondary);font-size:var(--type-label)}
.agency-payment-options .agency-actions{display:grid;grid-template-columns:1fr;gap:8px;margin-top:12px}
.agency-discard-setup{border-top:1px solid var(--border);padding-top:16px;display:grid;gap:8px}
.agency-discard-setup small{color:var(--text-muted);line-height:1.6}
.agency-discard-setup .btn{justify-self:start}

/* Agency adaptation of the approved product card. Product component remains unchanged. */
.agency-offer-price{position:relative;overflow:hidden}
.agency-plan-actions{margin-top:auto;padding-top:18px}
.agency-plan-menu{position:static;margin-left:auto}
#agency-root .agency-plan-menu>summary{box-sizing:border-box;display:grid;place-items:center;flex:none;width:42px;height:42px;min-height:42px;max-height:42px;padding:0;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-primary);cursor:pointer}
#agency-root .agency-plan-menu>summary:hover{background:var(--surface-hover);border-color:var(--border-strong)}
.agency-plan-menu>summary::marker{content:''}
.agency-plan-actions>.btn{min-height:48px}
.agency-plan-actions .agency-plan-menu>.course-actions-options{height:auto;min-height:268px;max-height:80%}
.agency-plan-actions .product-action-row{width:100%;border:0;background:transparent;color:var(--text-primary);font:inherit;text-align:left;cursor:pointer}
.agency-plan-actions .product-action-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.agency-plan-actions .agency-note{margin:12px 9px 0}
.agency-offer-price:has(.agency-plan-menu[open]) .agency-plan-actions>.btn{visibility:hidden}
.agency-offer-price:has(.agency-plan-menu[data-closing]) .agency-plan-actions>.btn{visibility:visible;pointer-events:none}

.agency-plan-actions .product-action-row.course-delete-action{color:var(--danger,#ff8181)}

/* Premium Agency dashboard; reuses Digital Products' orbit and motion unchanged. */
#agency-root .agency-premium-hero{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;padding:32px;min-height:280px;border-color:#72513c;background:radial-gradient(ellipse at 90% 80%,#21372e80,transparent 60%),linear-gradient(120deg,#281b16,#151418 60%)}
#agency-root .agency-premium-hero h2{font-size:clamp(26px,2.6vw,38px);line-height:1.15;overflow-wrap:anywhere}
.agency-premium-hero h2 em{display:inline-block;margin-top:8px;font-size:.8em;font-family:Georgia,serif;font-weight:400}
.agency-premium-hero .digital-parcel>.icon{width:38px;height:38px;color:#65d6ad}
.agency-premium-hero .digital-float>.icon{width:28px;height:28px;color:#c6b7db}
#agency-root .agency-toolbar{align-items:end;gap:14px;padding:18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
#agency-root .agency-toolbar>.field{margin:0;flex:0 1 340px}
#agency-root .agency-toolbar>.btn{height:48px;margin:0}
#agency-root .agency-toolbar .agency-role{align-self:center;margin-left:auto}
#agency-root select[name=agencyPicker]{height:48px;background:var(--surface-raised);color:var(--text-primary);border:1px solid var(--border-strong);border-radius:10px;color-scheme:dark;padding:0 14px;font:inherit}
#agency-root select[name=agencyPicker] option{background:var(--surface-raised);color:var(--text-primary)}
@media(max-width:700px){#agency-root .agency-premium-hero{grid-template-columns:1fr;padding:24px;gap:16px}#agency-root .agency-toolbar{display:flex;flex-wrap:wrap}#agency-root .agency-toolbar>.field{flex-basis:100%}#agency-root .agency-toolbar .agency-role{margin-left:0}}

/* Agency dashboard hierarchy and aligned roster search. */
#agency-root>.agency-premium-hero{margin-bottom:0}
#agency-root>.feature-navigation{margin:0;justify-self:start}
#agency-root #agency-search-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin:0 0 22px}
#agency-root #agency-search-form>.field{display:block;min-width:0;margin:0}
#agency-root #agency-search-form input,#agency-root #agency-search-form>.btn{box-sizing:border-box;height:48px;min-height:48px;margin:0}
#agency-root #agency-search-form>.btn{align-self:center;padding:0 20px;white-space:nowrap}
@media(max-width:600px){#agency-root #agency-search-form{gap:8px}#agency-root #agency-search-form>.btn{width:auto;padding:0 14px}}
#agency-root #agency-search-form input{width:100%;min-width:0}

#agency-root .agency-toolbar>.feature-navigation{margin:0;align-self:end}
#agency-root .agency-toolbar{align-items:center}
@media(max-width:900px){#agency-root .agency-toolbar>.feature-navigation{flex-basis:100%;width:100%}}

/* Agency identity left, section navigation right. */
#agency-root .agency-toolbar>.field{order:0}
#agency-root .agency-toolbar>.agency-role{order:1;margin-left:0}
#agency-root .agency-toolbar>.feature-navigation{order:2;margin-left:auto}
@media(max-width:900px){#agency-root .agency-toolbar>.feature-navigation{margin-left:0}}

/* Agency controls: shared baseline, branded role and a fully themed picker. */
#agency-root .agency-identity{display:flex;align-items:flex-end;gap:14px;min-width:0;flex:0 1 500px}
.agency-picker{position:relative;display:grid;gap:8px;min-width:0;max-width:340px;flex:1;font-size:var(--type-label,13px)}
.agency-picker>span{color:var(--text-secondary);font-weight:600}
.agency-picker-trigger{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;height:48px;padding:0 14px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-raised);color:var(--text-primary);font:inherit;text-align:left;cursor:pointer}
.agency-picker-trigger>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.agency-picker-trigger>.icon{flex:none;width:16px;height:16px;color:var(--text-muted);transition:transform .2s}
.agency-picker-trigger[aria-expanded=true]>.icon{transform:rotate(180deg)}
.agency-picker-trigger:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.agency-picker-trigger[aria-expanded=true]{border-color:var(--accent)}
.agency-picker-options{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:30;max-height:240px;overflow:auto;overscroll-behavior:contain;padding:6px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-raised);box-shadow:0 16px 40px #0008}
.agency-picker-options[hidden]{display:none}
.agency-picker-options>[role=option]{display:flex;align-items:center;gap:10px;min-height:46px;padding:10px;border-radius:8px;color:var(--text-primary);cursor:pointer}
.agency-picker-options>[role=option]>span{min-width:0;overflow-wrap:anywhere;flex:1}
.agency-picker-options .icon{width:18px;height:18px;flex:none;color:var(--text-muted)}
.agency-picker-options>[role=option]>.icon:last-child{visibility:hidden;color:var(--accent)}
.agency-picker-options>[aria-selected=true]{background:color-mix(in srgb,var(--accent) 12%,var(--surface-raised))}
.agency-picker-options>[aria-selected=true]>.icon:last-child{visibility:visible}
.agency-picker-options>[role=option]:hover,.agency-picker-options>.is-highlighted{background:var(--surface-hover);outline:1px solid var(--border-strong);outline-offset:-1px}
#agency-root .agency-identity>.agency-role{align-self:auto;display:inline-flex;align-items:center;gap:7px;flex:none;margin:0 0 7px;min-height:34px;padding:6px 12px;border-radius:999px;white-space:nowrap}
#agency-root .agency-identity>.agency-owner-badge{position:relative;isolation:isolate;overflow:hidden;border-color:#ff7a3659;color:#ffb080;background:linear-gradient(120deg,#ff5b121f,#ff92301a);font-weight:600}
.agency-owner-badge>.icon{width:15px;height:15px;color:var(--accent)}
.agency-owner-badge::after{content:'';position:absolute;inset:-20% -50%;z-index:-1;background:linear-gradient(110deg,transparent 38%,#ffb36b30 50%,transparent 62%);transform:translateX(-65%);animation:agency-badge-sheen 7s ease-in-out infinite;pointer-events:none}
@keyframes agency-badge-sheen{0%,60%{transform:translateX(-65%)}90%,100%{transform:translateX(65%)}}
#agency-root .agency-report-filters{align-items:flex-end;gap:12px}
#agency-root .agency-report-filters>.field{margin:0;display:grid;gap:8px}
#agency-root .agency-report-filters input{box-sizing:border-box;width:100%;height:48px;min-height:48px;margin:0}
#agency-root .agency-report-filters>.btn{box-sizing:border-box;align-self:flex-end;height:48px;min-height:48px;margin:0}
@media(max-width:900px){#agency-root .agency-identity{flex-basis:100%;max-width:100%}}
@media(max-width:480px){#agency-root .agency-identity{gap:10px}#agency-root .agency-identity>.agency-role{font-size:10px;padding:6px 9px}#agency-root .agency-report-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#agency-root .agency-report-filters>.field{min-width:0;max-width:none}#agency-root .agency-report-filters>.btn{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.agency-owner-badge::after{animation:none;display:none}.agency-picker-trigger>.icon{transition:none}}

#agency-root{grid-template-columns:minmax(0,1fr)}
#agency-root .agency-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;min-width:0;gap:18px}
#agency-root .agency-toolbar>.feature-navigation{min-width:0}
@media(max-width:1100px){#agency-root .agency-toolbar{grid-template-columns:minmax(0,1fr)}#agency-root .agency-toolbar>.feature-navigation{justify-self:start;margin-left:0;max-width:100%}}
/* The shared profile canvas is narrower when embedded in an Agency workspace. */
[data-shared-profile-editor] .profile-editor-bar{grid-template-columns:minmax(0,1fr) auto}
[data-shared-profile-editor] .editor-bar-start{flex-wrap:wrap}
[data-shared-profile-editor] .profile-link-chip{grid-column:1/-1;grid-row:2;justify-self:center}
[data-shared-profile-editor] .profile-editor-bar .autosave-state{white-space:normal;overflow-wrap:anywhere}
.profile-editor-bar:has([data-action=profile-reload]) .editor-bar-start{flex-wrap:wrap}
.profile-editor-bar:has([data-action=profile-reload]){grid-template-columns:minmax(0,1fr) auto}
.profile-editor-bar:has([data-action=profile-reload]) .profile-link-chip{grid-column:1/-1;grid-row:2;justify-self:center}

/* Wrap by available card width, including the persistent desktop sidebar. */
#agency-root .agency-toolbar{display:flex;flex-wrap:wrap}
#agency-root .agency-identity{flex:1 1 430px;flex-wrap:wrap}
#agency-root .agency-identity .agency-picker{flex:1 1 220px;min-width:0}
#agency-root .agency-picker-trigger{min-width:0}
#agency-root .agency-toolbar>.feature-navigation{flex:0 1 auto;max-width:100%}
@media(max-width:600px){#agency-root .agency-toolbar>.feature-navigation{flex-basis:100%;width:100%}}

/* Sidebar sections fold independently; chevrons point up when open and down when closed. */
.workspace .nav-section{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:40px;border:0;background:none;color:var(--text-muted);text-align:start;cursor:pointer}
.workspace .nav-section:hover{color:var(--text-primary)}
.workspace .nav-section>span{white-space:nowrap}
.workspace .nav-section>.icon{width:14px;height:14px;flex:none;transform:rotate(180deg);transition:transform var(--motion-standard) var(--ease-standard)}
.workspace .nav-group.is-closed .nav-section>.icon{transform:rotate(0deg)}
.workspace .nav-group-body{display:grid;grid-template-rows:1fr;visibility:visible;transition:grid-template-rows var(--motion-standard) var(--ease-standard),visibility 0s}
.workspace .nav-group.is-closed>.nav-group-body{grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows var(--motion-standard) var(--ease-standard),visibility 0s var(--motion-standard)}
.workspace .nav-group-items{display:grid;grid-template-columns:minmax(0,1fr);gap:4px;min-height:0;overflow:hidden}
.workspace.collapsed .nav-section{display:none}
@media(min-width:768px) and (max-width:1023px){.workspace .nav-section{display:none}}
@media(max-width:767px){.workspace .sidebar .nav-section{display:flex}}
@media(prefers-reduced-motion:reduce){.workspace .nav-group-body,.workspace .nav-group.is-closed>.nav-group-body,.workspace .nav-section>.icon{transition:none}}
.workspace .nav-group-items .nav-item:focus-visible{outline-offset:-3px}