/* Quiet Luxury Modern: final hierarchy layer. Feature styles keep layout ownership;
   this file owns shared surface, separation, and interaction language. */
body{background:var(--color-background)}
.desktop-sidebar{border-right:0;box-shadow:8px 0 32px rgba(51,51,51,.035)}
.mobile-topbar{border-bottom:0;box-shadow:0 6px 24px rgba(51,51,51,.045)}
.mobile-bottom-nav{box-shadow:0 2px 8px rgba(38,38,38,.08),0 16px 36px rgba(38,38,38,.2)}
.wedding-profile{border:0}
.page-header{margin-bottom:clamp(2rem,5vw,var(--space-xl))}.page-header__content{display:grid;gap:var(--space-sm)}.page-header h1,.page-header p,.page-header__eyebrow{margin:0}
.section-header{padding-bottom:0;border-bottom:0}.section-header>div{display:grid;gap:var(--space-xs)}.section-header h2,.section-header p{margin:0}
.app-card{border:0;box-shadow:var(--shadow-ambient)}.app-card--tonal{background:var(--color-surface-low);box-shadow:none}
.app-icon-button,.filter-button{border-color:transparent;background:var(--color-field)}.app-icon-button:hover,.filter-button:hover,.filter-button[aria-pressed=true]{border-color:transparent;background:var(--color-field-hover)}
.state-panel,.skeleton{border:0;background:var(--color-surface-low);box-shadow:none}
.dialog-shell{border:0;box-shadow:var(--shadow-floating)}.dialog-shell__header{border-bottom:0;background:var(--color-surface-low)}.dialog-shell__footer{border-top:0}
.more-menu-item{border:0;box-shadow:var(--shadow-ambient)}.more-menu-item:hover{border-color:transparent;transform:translateY(-1px)}
.vendor-filter-bar,.payment-filters,.task-toolbar{padding:var(--space-md);background:var(--color-surface-low);border:0;border-radius:var(--radius-container)}
.task-toolbar{border-bottom:0}
.task-quick-add,.task-form-card,.timeline-form-card,.payment-form-card,.payment-detail-main{border:0;box-shadow:var(--shadow-ambient)}
.task-list,.wedding-day-rundown,.budget-category-list{border:0;box-shadow:var(--shadow-ambient)}
.task-row,.wedding-day-row,.payment-card{border-color:color-mix(in srgb,var(--color-border-subtle) 48%,transparent)}
.timeline-calendar section,.timeline-milestone__body,.budget-category-card,.scenario-card,.scenario-summary,.scenario-package-selector,.scenario-category-nav{border:0;box-shadow:var(--shadow-ambient)}

/* Shared KPI stat tiles — plain, no icons: used by Payments, Budget, Tasks, Vendor detail. */
.kpi-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:var(--space-3);margin-bottom:var(--space-6)}
.kpi-tile{container-type:inline-size;display:grid;gap:.25rem;min-height:5.5rem;padding:.9rem 1rem;background:var(--color-surface-lowest);border:0;border-radius:1rem;box-shadow:var(--shadow-ambient)}
.kpi-tile__label{color:var(--color-text-muted);font-size:.6875rem;font-weight:600}
.kpi-tile__value{overflow:hidden;font-size:clamp(.8rem,.5rem + 2.6cqi,1.1rem);font-weight:600;line-height:1.25;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.kpi-tile__hint{color:var(--color-text-muted);font-size:.6875rem}
.kpi-tile.is-danger .kpi-tile__value{color:var(--color-error)}
.kpi-tile__value .money-display{display:flex;min-width:0}
.kpi-tile__value .money-display__prefix,.kpi-tile__value .money-display__value{color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
.kpi-tile__value .money-display__prefix{flex-shrink:0}
.kpi-tile__value .money-display__value{overflow:hidden;min-width:0;flex-shrink:1;text-overflow:ellipsis;white-space:nowrap;overflow-wrap:normal}
button.kpi-tile{width:100%;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background var(--transition-fast)}
button.kpi-tile:hover,button.kpi-tile.is-active{background:var(--color-primary-subtle)}
.timeline-view-nav{border-bottom:0;background:var(--color-surface-low);padding:.25rem;border-radius:var(--radius-control);width:max-content;max-width:100%}.timeline-view-nav a{border:0;border-radius:var(--radius-control)}.timeline-view-nav a.is-active{background:var(--color-surface-lowest);box-shadow:var(--shadow-ambient)}
.payment-tabs button{border:0;background:var(--color-field);border-radius:var(--radius-control)}
.payment-status,.task-priority,.timeline-status{border-radius:var(--radius-control)}
.payment-table--head{background:var(--color-surface-low);border-radius:var(--radius-control)}.payment-card{border-top:0;margin-top:2px;border-radius:var(--radius-control)}
.payment-detail-list>div,.budget-detail-facts{border-color:color-mix(in srgb,var(--color-border-subtle) 45%,transparent)}
.scenario-card__topline,.scenario-card__actions,.scenario-card__budget,.scenario-category-nav__title{border-color:color-mix(in srgb,var(--color-border-subtle) 45%,transparent)}
.pwa-status{border:0;box-shadow:var(--shadow-floating)}
@media(max-width:767px){.app-content{padding-top:var(--space-gutter)}.page-header{align-items:flex-start;flex-direction:column}.page-header__actions{width:100%}.page-header__actions>.app-button{flex:1}.dialog-backdrop{align-items:end;padding:0}.dialog-shell{width:100%;max-height:88dvh;border-radius:var(--radius-container) var(--radius-container) 0 0}.payment-filters,.task-toolbar{padding:var(--space-md)}.kpi-stats{grid-template-columns:1fr;gap:var(--space-2)}.kpi-tile{min-height:auto}}
@media(forced-colors:active){.app-card,.state-panel,.task-list,.wedding-day-rundown,.task-form-card,.timeline-form-card,.payment-form-card{border:1px solid CanvasText}.app-input,.app-select,.app-textarea,.app-content input,.app-content select,.app-content textarea{border:1px solid CanvasText}}

/* Modern SaaS workspace layer — aligned with the WeddingFlow product reference. */
html{font-size:16px}
body{min-width:320px;background:var(--color-background);color:var(--color-text);font-family:var(--font-functional);font-size:.875rem;line-height:1.55}
a{color:inherit}
.app-shell__main{background:var(--color-background)}
.app-content{width:min(100%,var(--container-wide));padding-block:var(--space-8)}
.workspace-topbar{display:none}
.desktop-sidebar{overflow:visible;background:var(--color-surface);border-right:1px solid rgba(15,23,42,.06);box-shadow:none}
.desktop-sidebar__brand-row{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}
.desktop-sidebar__nav-scroll{flex:1 1 auto;min-height:0;overflow-y:auto}
.desktop-sidebar:not(.desktop-sidebar--drawer)::after{content:"";position:absolute;top:calc(var(--space-5) - 7px);right:-23px;width:46px;height:46px;background:var(--color-background);border-radius:50%;pointer-events:none}
.sidebar-collapse{position:absolute;top:var(--space-5);right:-16px;left:auto;z-index:31;display:grid;place-items:center;width:2rem;height:2rem;flex:0 0 auto;padding:0;color:var(--color-text-muted);background:var(--color-surface);border:0;border-radius:50%;box-shadow:0 4px 14px rgba(23,32,24,.12);cursor:pointer;transition:color var(--transition-fast),background-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-standard)}
.sidebar-collapse:hover{color:var(--color-primary);background:var(--color-primary-subtle);box-shadow:0 6px 18px rgba(23,32,24,.16)}
.brand-lockup__mark{width:2.25rem;height:2.25rem;background:var(--color-primary);border-radius:9999px}
.brand-lockup strong{font-size:1.15rem}.brand-lockup small{font-size:.6875rem}
.settings-navigation__label{margin:.75rem .75rem .25rem;color:var(--color-text-muted);font-size:.625rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.nav-item{min-height:2.5rem;padding:.5rem .75rem;border:0;border-radius:9999px;font-size:.8125rem;font-weight:500}
.nav-item:hover{color:var(--color-text);background:var(--color-surface-low)}
.nav-item.is-active{color:var(--color-on-primary);background:var(--color-primary);border:0;font-weight:650}
.wedding-profile{padding:.75rem;background:linear-gradient(145deg,var(--color-surface-low),color-mix(in srgb,var(--color-primary-subtle) 34%,var(--color-surface)));border:0;box-shadow:0 10px 24px -22px rgba(23,32,24,.55)}
.wedding-profile__monogram{width:2.25rem;height:2.25rem;font-family:var(--font-functional);font-size:.75rem}
.wedding-profile h2{font-size:.75rem}.wedding-profile__content p,.wedding-profile__content>span{font-size:.6875rem}

/* Compact page header (all pages except Dashboard). */
.page-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4);margin-bottom:1.75rem}
.page-header__content{display:flex;flex-direction:column;min-width:0;max-width:52rem}
.page-header h1{margin:0;color:var(--color-text);font-family:var(--font-editorial);font-size:1.8125rem;font-weight:700;line-height:1.15;letter-spacing:-.01em}
.page-header p{margin:.375rem 0 0;max-width:44rem;color:var(--color-text-muted);font-size:.875rem;line-height:1.5}
.page-header__eyebrow{display:block;margin:0 0 .25rem;color:var(--color-primary);font-size:.6875rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.page-header__actions{display:flex;align-items:center;gap:var(--space-2);flex:0 0 auto}
.app-page-header__breadcrumbs{margin-bottom:1rem}
.breadcrumbs{margin:0 0 1rem}
.breadcrumbs+.page-header{margin-top:0}
.breadcrumbs ol{gap:.375rem;font-size:.8125rem;font-weight:500;color:var(--color-text-muted)}
.breadcrumbs li{gap:.375rem}
.breadcrumbs li:not(:last-child)::after{color:var(--color-border);font-size:.75rem}
.breadcrumbs a{min-height:auto;padding:.25rem 0;line-height:1.3;color:var(--color-text-muted);font-weight:500;text-decoration:none}
.breadcrumbs a:hover{color:var(--color-primary)}
.breadcrumbs [aria-current=page]{color:var(--color-text);font-weight:500}
.vendor-detail-header .breadcrumbs,.package-header .breadcrumbs{margin-bottom:0}
.app-content:has(.breadcrumbs){padding-top:1.5rem}
.section-header{align-items:center;padding:0;border:0}
.section-header h2{font-family:var(--font-functional);font-size:1rem;line-height:1.4;font-weight:700;letter-spacing:-.01em}
.section-header p{color:var(--color-text-muted);font-size:.8125rem}
.section{margin-block:var(--space-6)}

.app-card,.task-list,.wedding-day-rundown,.budget-category-list,.task-quick-add,.task-form-card,.timeline-form-card,.payment-form-card,.payment-detail-main,.scenario-card,.scenario-summary,.scenario-package-selector,.scenario-category-nav,.timeline-calendar section,.timeline-milestone__body,.budget-category-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-container);box-shadow:var(--shadow-ambient)}
.app-card{padding:var(--space-5)}
.app-card--tonal{background:var(--color-surface-low);border-color:transparent;box-shadow:none}
.auto-grid{gap:var(--space-4)}

.metric-card{display:flex;min-width:0;flex-direction:column;gap:var(--space-2);padding:var(--space-4);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-container);box-shadow:var(--shadow-ambient)}
.metric-card__topline{display:flex;align-items:center;gap:var(--space-2)}
.metric-card__icon{display:grid;place-items:center;width:2rem;height:2rem;color:var(--color-primary);background:var(--color-primary-subtle);border-radius:.5rem}
.metric-card__label{color:var(--color-text-muted);font-size:.75rem;font-weight:600}
.metric-card__value{font-size:1.25rem;line-height:1.25;font-weight:700;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.metric-card__helper{color:var(--color-text-muted);font-size:.75rem}
.metric-card--warning .metric-card__icon{color:#8A5B00;background:var(--color-warning-soft)}
.metric-card--danger .metric-card__icon{color:var(--color-error);background:var(--color-danger-soft)}
.metric-card--info .metric-card__icon{color:#315E8A;background:var(--color-info-soft)}
.stat-card__label{color:var(--color-text-muted);font-size:.75rem;text-transform:none;letter-spacing:0}.stat-card__value{font-size:1.25rem;font-weight:700}

.app-button{min-height:2.625rem;padding:.5rem 1.25rem;border-radius:999px;font-size:.8125rem;font-weight:650;box-shadow:none}
.app-button--primary{color:var(--color-primary);background:#FFFFFF;border:1.5px solid var(--color-primary)}.app-button--primary:hover{background:var(--color-primary-subtle)}
.app-button--secondary{color:var(--color-text);background:#FFFFFF;border:1.5px solid var(--color-border)}.app-button--secondary:hover{background:var(--color-surface-low);border-color:var(--color-surface-dim)}
.app-button--neutral{color:var(--color-text);background:var(--color-surface);border-color:var(--color-border)}.app-button--neutral:hover{background:var(--color-surface-low)}
.app-button--danger{background:var(--color-error)}.app-button--danger:hover{background:#C94A3F}
.app-button:focus-visible,.app-icon-button:focus-visible,.shell-icon-button:focus-visible,.sidebar-collapse:focus-visible,.segmented-control__option:focus-visible,.action-menu summary:focus-visible{outline:0;box-shadow:var(--focus-ring)}
.app-button:disabled,.app-icon-button:disabled,.filter-button:disabled{opacity:.6;color:var(--color-text-muted);background:var(--color-disabled);border-color:var(--color-border)}
.app-button__spinner{width:1rem;height:1rem;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:button-spin .7s linear infinite}
@keyframes button-spin{to{transform:rotate(360deg)}}

.app-input,.app-select,.app-textarea,.app-content input:not([type=checkbox]):not([type=radio]),.app-content select,.app-content textarea{min-height:2.5rem;color:var(--color-text);background:var(--color-field);border:1px solid var(--color-border);border-radius:var(--radius-control);font:inherit}
.app-input:hover,.app-select:hover,.app-textarea:hover{border-color:#C8D0C4}
.app-input:focus,.app-select:focus,.app-textarea:focus,.app-content input:focus,.app-content select:focus,.app-content textarea:focus{outline:0;border-color:var(--color-primary);box-shadow:var(--focus-ring)}
.app-label{margin-bottom:.375rem;color:var(--color-text);font-size:.75rem;font-weight:600}
.app-search__icon{color:var(--color-text-muted)}
.filter-select .app-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.vendor-filter-bar,.payment-filters,.task-toolbar{position:sticky;z-index:10;top:calc(var(--layout-topbar-height) + var(--space-2));padding:var(--space-3);background:color-mix(in srgb,var(--color-background) 94%,transparent);border:1px solid var(--color-border);border-radius:var(--radius-container);box-shadow:0 6px 18px rgba(23,32,24,.035);backdrop-filter:blur(10px)}

.progress__track{height:.375rem;border-radius:999px;background:#EFEFEF}
.progress__track::-webkit-progress-bar{background:#EFEFEF}
.progress__value{border-radius:999px}

.app-badge{padding:.3rem .5rem;border-radius:999px;font-size:.6875rem;line-height:1.1;font-weight:650;letter-spacing:0;text-transform:none}
.status-badge--neutral{color:#556057;background:var(--color-neutral-subtle)}
.status-badge--info{color:#315E8A;background:var(--color-info-soft)}
.status-badge--warning{color:#835A0C;background:var(--color-warning-soft)}
.status-badge--purple{color:#65458A;background:var(--color-purple-soft)}
.status-badge--success{color:#315B23;background:var(--color-success-soft)}
.status-badge--final{color:#fff;background:var(--color-primary-hover)}
.status-badge--error{color:#8B3028;background:var(--color-danger-soft)}

.state-panel{min-height:12rem;background:var(--color-surface);border:1px dashed #CDD4C8;border-radius:var(--radius-container);box-shadow:none}
.state-panel__icon{color:var(--color-primary);background:var(--color-primary-subtle);border-radius:var(--radius-control)}
.state-panel h3{font-size:1rem}.state-panel p{max-width:30rem;color:var(--color-text-muted);font-size:.8125rem}
.skeleton,.skeleton-card{display:grid;gap:var(--space-2);padding:var(--space-5);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-container);box-shadow:var(--shadow-ambient);overflow:hidden}
.skeleton__line{background:linear-gradient(90deg,#EDF0EA,#F7F8F5,#EDF0EA);background-size:200% 100%}
.skeleton-card__media{height:9rem;margin:calc(var(--space-5) * -1) calc(var(--space-5) * -1) var(--space-3);border-radius:0}

.segmented-control{display:inline-flex;padding:.25rem;background:var(--color-surface-low);border:1px solid var(--color-border);border-radius:.625rem}
.segmented-control__option{min-height:2rem;padding:.35rem .7rem;color:var(--color-text-muted);background:transparent;border:0;border-radius:.4rem;font:inherit;font-size:.75rem;font-weight:600;cursor:pointer}
.segmented-control__option.is-active{color:var(--color-text);background:var(--color-surface);box-shadow:0 1px 3px rgba(23,32,24,.08)}
.action-menu{position:relative}.action-menu>summary{list-style:none}.action-menu>summary::-webkit-details-marker{display:none}
.action-menu__popover{position:absolute;z-index:30;top:calc(100% + .375rem);right:0;width:max-content;min-width:11rem;padding:.375rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-control);box-shadow:var(--shadow-floating)}
.action-menu__popover a,.action-menu__popover button{display:flex;width:100%;min-height:2.25rem;align-items:center;padding:.45rem .625rem;color:var(--color-text);background:transparent;border:0;border-radius:.375rem;text-decoration:none;font:inherit;font-size:.8125rem;cursor:pointer}.action-menu__popover a:hover,.action-menu__popover button:hover,.action-menu__popover a:focus-visible,.action-menu__popover button:focus-visible{background:var(--color-surface-low)}.action-menu__popover button:disabled{opacity:.55;cursor:not-allowed}
.responsive-data-table__mobile{display:none}.data-view__desktop{display:block}.data-view__mobile{display:none}
.responsive-data-table table,.data-view table{width:100%;border-collapse:separate;border-spacing:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-container);overflow:hidden}
.responsive-data-table th,.data-view th{padding:.75rem 1rem;color:var(--color-text-muted);background:var(--color-surface-low);font-size:.6875rem;font-weight:650;letter-spacing:.04em;text-align:left;text-transform:uppercase}
.responsive-data-table td,.data-view td{padding:.875rem 1rem;border-top:1px solid var(--color-border);font-size:.8125rem}
.responsive-data-table tr:focus-within,.data-view tr:focus-within{outline:2px solid var(--color-primary);outline-offset:-2px}
.vendor-mini-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.625rem;align-items:center;padding:.625rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-control)}
.vendor-mini-card__icon{display:grid;place-items:center;width:2.25rem;height:2.25rem;color:var(--color-primary);background:var(--color-primary-subtle);border-radius:.375rem}.vendor-mini-card__content{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:0 .5rem;min-width:0}.vendor-mini-card__content .type-label{grid-column:1/-1;color:var(--color-text-muted);font-size:.625rem}.vendor-mini-card__content a{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.75rem;font-weight:650;text-decoration:none}

.toast-container{position:fixed;z-index:100;right:var(--space-4);bottom:var(--space-4);display:grid;gap:var(--space-2);width:min(24rem,calc(100vw - 2rem));pointer-events:none}
.app-toast{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:.75rem;padding:.875rem;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-left:3px solid var(--color-primary);border-radius:var(--radius-control);box-shadow:var(--shadow-floating);pointer-events:auto}.app-toast--error{border-left-color:var(--color-error)}.app-toast__icon{color:var(--color-primary)}.app-toast--error .app-toast__icon{color:var(--color-error)}.app-toast p{margin:0;color:var(--color-text-muted);font-size:.8125rem}.app-toast__close{display:grid;place-items:center;width:1.75rem;height:1.75rem;padding:0;color:var(--color-text-muted);background:transparent;border:0;border-radius:.375rem;cursor:pointer}.app-toast__close:hover{background:var(--color-surface-low)}
.mobile-page-actions{display:none}

@media(max-width:767px){
  .app-content{padding:var(--space-5) var(--space-4) calc(var(--layout-bottom-nav-height) + 6rem + env(safe-area-inset-bottom))}
  .mobile-topbar{background:rgba(255,255,255,.9);border-bottom:0;box-shadow:0 10px 26px -24px rgba(23,32,24,.5);backdrop-filter:blur(12px)}
  .mobile-topbar__brand strong{font-family:var(--font-editorial)}
  .page-header{align-items:flex-start;flex-direction:column;gap:1rem;margin-bottom:1.375rem}.page-header h1{font-size:1.625rem}.page-header__actions{width:100%}.page-header__actions>*{flex:1}.app-content:has(.breadcrumbs){padding-top:1rem}
  .vendor-filter-bar,.payment-filters,.task-toolbar{top:calc(var(--layout-topbar-height) + env(safe-area-inset-top));overflow:visible;backdrop-filter:none}
  .responsive-data-table__desktop,.data-view__desktop{display:none}.responsive-data-table__mobile,.data-view__mobile{display:grid;gap:var(--space-3)}
  .mobile-page-actions{position:sticky;z-index:25;bottom:calc(var(--layout-bottom-nav-height) + env(safe-area-inset-bottom));display:flex;gap:var(--space-2);padding:var(--space-3);margin:0 calc(var(--space-4) * -1) calc(var(--space-4) * -1);background:var(--color-surface);border-top:1px solid var(--color-border);box-shadow:0 -8px 20px rgba(23,32,24,.08)}.mobile-page-actions>*{flex:1}
  .toast-container{bottom:calc(var(--layout-bottom-nav-height) + env(safe-area-inset-bottom) + var(--space-3))}
}

@media(min-width:768px) and (max-width:1199px){.app-content{padding:var(--space-6)}.workspace-topbar{display:none}}

@media(min-width:1200px){
  .page-header h1{font-size:2rem}
  .workspace-topbar{position:sticky;z-index:25;top:0;height:var(--layout-topbar-height);display:grid;grid-template-columns:minmax(10rem,1fr) minmax(20rem,32rem) minmax(10rem,1fr);align-items:center;gap:var(--space-5);padding:0 var(--space-8);background:rgba(255,255,255,.88);border-bottom:1px solid rgba(15,23,42,.06);box-shadow:0 12px 32px -30px rgba(23,32,24,.55);backdrop-filter:blur(14px)}
  .workspace-topbar__context{display:flex;align-items:center;gap:.5rem;color:var(--color-text-muted);font-size:.75rem;font-weight:600}
  .workspace-topbar__actions{display:flex;align-items:center;justify-content:flex-end;gap:.5rem}
  .global-search{position:relative}.global-search>input{width:100%;height:2.5rem;padding:0 2.5rem 0 2.5rem;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:999px;font:inherit;font-size:.8125rem}.global-search>input:focus{outline:0;border-color:var(--color-primary);box-shadow:var(--focus-ring)}.global-search__icon{position:absolute;z-index:1;top:.7rem;left:.8rem;color:var(--color-text-muted)}.global-search kbd{position:absolute;top:.55rem;right:.6rem;padding:.15rem .4rem;color:var(--color-text-muted);background:var(--color-surface-low);border:1px solid var(--color-border);border-radius:.3rem;font:inherit;font-size:.6875rem}.global-search__results{position:absolute;z-index:50;top:calc(100% + .5rem);right:0;left:0;padding:.375rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-control);box-shadow:var(--shadow-floating)}.global-search__results a{display:flex;align-items:center;gap:.65rem;padding:.55rem .65rem;border-radius:.375rem;text-decoration:none}.global-search__results a:hover{background:var(--color-surface-low)}.global-search__results a>span{display:grid}.global-search__results strong{font-size:.8125rem}.global-search__results small{color:var(--color-text-muted);font-size:.6875rem}.global-search__results p{margin:.5rem;color:var(--color-text-muted);font-size:.75rem}
  .app-content{padding:var(--space-8)}
  .app-shell.is-sidebar-collapsed .app-shell__main{margin-left:var(--layout-sidebar-collapsed-width)}
  .app-shell.is-sidebar-collapsed>.desktop-sidebar{width:var(--layout-sidebar-collapsed-width);padding-inline:var(--space-3)}
  .app-shell.is-sidebar-collapsed>.desktop-sidebar .brand-lockup>span:last-child,.app-shell.is-sidebar-collapsed>.desktop-sidebar .settings-navigation__label,.app-shell.is-sidebar-collapsed>.desktop-sidebar .nav-item__label,.app-shell.is-sidebar-collapsed>.desktop-sidebar .wedding-profile__content{display:none}
  .app-shell.is-sidebar-collapsed .sidebar-collapse{transform:rotate(180deg)}.app-shell.is-sidebar-collapsed>.desktop-sidebar .nav-item{justify-content:center;padding-inline:.5rem}.app-shell.is-sidebar-collapsed>.desktop-sidebar .wedding-profile{grid-template-columns:1fr;padding:.5rem}.app-shell.is-sidebar-collapsed>.desktop-sidebar .wedding-profile__monogram{margin:auto}
}

@media(prefers-reduced-motion:reduce){.app-button__spinner{animation-duration:1.4s}}

/* Final responsive invariants: page-level content never scrolls sideways. */
.vendor-category-list,.vendor-table-wrap{overflow:hidden}.vendor-table{min-width:0}
@media(max-width:1199px){.budget-payment-placeholder,.package-detail__aside>.package-price-summary,.scenario-builder-layout__categories,.scenario-builder-layout__summary,.settings-sidebar{position:static}.timeline-view-nav{flex-wrap:wrap;overflow:visible}.timeline-view-nav>*{flex:1 1 auto}}
@media(max-width:767px){.vendor-notes__filters,.active-filter-chips,.vendor-tabs{flex-wrap:wrap;overflow:visible}.vendor-workspace-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;margin-inline:0;padding-inline:0}.vendor-workspace-metrics article{min-width:0}.auto-grid{grid-template-columns:1fr}.toast-container{right:var(--space-md);left:var(--space-md);width:auto}}

/* Modern responsive SaaS shell */
html,body{max-width:100%;overflow-x:clip}
.app-shell,.app-shell__main{width:100%;min-width:0}
.app-shell__main{transition:margin-left var(--transition-standard)}
.desktop-sidebar{transition:width var(--transition-standard),padding var(--transition-standard)}
.primary-navigation[aria-label="Menu utama"]{gap:var(--space-5)}
.primary-navigation[role="group"]{gap:2px}
.settings-navigation__label{padding:0 .75rem .3rem;color:var(--color-text-muted);font-size:.625rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.nav-item{border-left:0}
.nav-item .nav-item__icon{color:#7B8092}
.nav-item.is-active{color:var(--color-on-primary);background:var(--color-primary);font-weight:700}
.nav-item.is-active .nav-item__icon{color:var(--color-primary);background:var(--color-on-primary);width:1.75rem;height:1.75rem;border-radius:var(--radius-control)}
.wedding-profile{box-shadow:none}

.global-search{position:relative;min-width:0}
.global-search>input{width:100%;height:2.5rem;padding:0 5rem 0 2.5rem;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:999px;font:inherit;font-size:.8125rem}
.global-search>input:focus{outline:0;border-color:var(--color-primary);box-shadow:var(--focus-ring)}
.global-search__icon{position:absolute;z-index:1;top:.7rem;left:.8rem;color:var(--color-text-muted)}
.global-search kbd{position:absolute;top:.55rem;right:.55rem;padding:.15rem .35rem;color:var(--color-text-muted);background:var(--color-surface-low);border:1px solid var(--color-border);border-radius:.3rem;font:inherit;font-size:.625rem}
.global-search__results{position:absolute;z-index:60;top:calc(100% + .5rem);right:0;left:0;padding:.375rem;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-control);box-shadow:var(--shadow-floating)}
.global-search__results a{display:flex;align-items:center;gap:.65rem;padding:.6rem .65rem;border-radius:.375rem;text-decoration:none}
.global-search__results a:hover,.global-search__results a:focus-visible{background:var(--color-primary-subtle)}
.global-search__results a>span{display:grid}.global-search__results strong{font-size:.8125rem}.global-search__results small{color:var(--color-text-muted);font-size:.6875rem}.global-search__results p{margin:.5rem;color:var(--color-text-muted);font-size:.75rem}

.mobile-topbar{display:grid;grid-template-columns:2.5rem minmax(0,1fr) auto;gap:.5rem}
.mobile-topbar__brand{justify-content:center;width:2.25rem;height:2.25rem;color:var(--color-on-primary);background:var(--color-primary);border-radius:9999px}
.mobile-topbar__title{overflow:hidden;font-size:.9375rem;text-overflow:ellipsis;white-space:nowrap}
.mobile-topbar__actions{display:flex;align-items:center;gap:.25rem}.mobile-topbar__actions .shell-icon-button{width:2.5rem;height:2.5rem}.mobile-topbar__actions .account-menu__trigger{width:2.5rem;height:2.5rem}
.mobile-search-panel{position:sticky;z-index:29;top:calc(var(--layout-topbar-height) + env(safe-area-inset-top));padding:.75rem max(var(--space-md),env(safe-area-inset-right)) .75rem max(var(--space-md),env(safe-area-inset-left));background:var(--color-surface);border-bottom:1px solid var(--color-border);box-shadow:0 8px 18px rgba(23,32,24,.06)}

@media(min-width:768px) and (max-width:1199px){
  .mobile-topbar__menu{display:grid}
  .app-drawer-layer{position:fixed;z-index:50;inset:0;display:block;visibility:hidden;pointer-events:none}
  .app-drawer-layer.is-open{visibility:visible;pointer-events:auto}
  .app-drawer-backdrop{position:absolute;inset:0;width:100%;height:100%;padding:0;background:rgba(23,32,24,.38);border:0;cursor:pointer;opacity:0;transition:opacity var(--transition-standard)}
  .app-drawer-layer.is-open .app-drawer-backdrop{opacity:1}
  .app-drawer{position:absolute;inset:0 auto 0 0;width:min(18rem,calc(100vw - 2.5rem));padding:var(--space-5);overflow-y:auto;overscroll-behavior:contain;background:var(--color-surface);border-right:0;box-shadow:var(--shadow-floating);transform:translateX(-100%);transition:transform var(--transition-standard)}
  .app-drawer-layer.is-open .app-drawer{transform:translateX(0)}
  .app-drawer__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);margin-bottom:var(--space-6)}
  .desktop-sidebar--drawer{display:flex;width:100%;min-height:calc(100dvh - 6rem);padding:0;overflow:visible;background:transparent;border:0;box-shadow:none}
}

@media(min-width:1200px){
  .mobile-topbar,.mobile-search-panel,.mobile-bottom-nav,.app-drawer-layer{display:none}
  .app-shell__main{width:auto}
  .workspace-topbar,.app-shell.is-sidebar-collapsed .workspace-topbar{display:grid;visibility:visible;opacity:1}
  .desktop-sidebar{gap:var(--space-6);padding:var(--space-5) var(--space-4)}
  .desktop-sidebar__brand-row{min-height:2.5rem}
  .workspace-topbar{grid-template-columns:minmax(8rem,1fr) minmax(20rem,30rem) minmax(10rem,1fr);padding:0 var(--space-6)}
  .app-content{width:min(100%,var(--container-wide));padding:var(--space-8)}
  .app-shell.is-sidebar-collapsed>.desktop-sidebar .desktop-sidebar__brand-row{flex-direction:column;gap:.5rem}
  .app-shell.is-sidebar-collapsed>.desktop-sidebar .brand-lockup__mark{width:2.5rem;height:2.5rem}
  .app-shell.is-sidebar-collapsed>.desktop-sidebar .nav-item{overflow:visible}
  .app-shell.is-sidebar-collapsed>.desktop-sidebar .nav-item::before{left:-.75rem}
}