/* Modern owns this entire sheet. Classic and Premium retain their existing rules. */
body[data-experience="modern"]{--app-bg:#f2eee7;--section-bg:#faf7f1;--card-bg:#fffcf7;--card-elevated-bg:#eae2d6;--metric-bg:#e9e0d2;--interactive-bg:#fffcf7;--text-primary:#302a23;--text-secondary:#62574a;--text-muted:#726455;--text-disabled:#978b7e;--border-subtle:#e0d7ca;--border-default:#ccbeab;--accent:#805832;--positive:#426c53;--negative:#b4413e;--warning:#956510;--info:#756441;--theme-shadow:0 12px 32px #3024190b;--blue:#927557;--purple:#aa8c74;--orange:#bc8953;--new-bg:var(--app-bg);--new-panel:var(--card-bg);--new-lime:var(--accent)}
html[data-appearance="dark"] body[data-experience="modern"]{--app-bg:#211d19;--section-bg:#29231e;--card-bg:#302923;--card-elevated-bg:#3b3229;--metric-bg:#40362c;--interactive-bg:#352d25;--text-primary:#f5eee4;--text-secondary:#d4c8b9;--text-muted:#b9aa98;--text-disabled:#8d7d6b;--border-subtle:#493d31;--border-default:#63513f;--accent:#e1be91;--positive:#9bc2a5;--negative:#f29989;--warning:#e0b977;--info:#c5b391;--theme-shadow:0 14px 36px #100a0633;--blue:#aa8764;--purple:#b0967d;--orange:#ca9b69}
body.experience-modern .workspace,body.experience-modern .app-shell,body.experience-modern .author-footer{background:var(--app-bg)!important}
body.experience-modern .sidebar{background:#241c15!important;border-right:1px solid #ffffff12!important}
body.experience-modern .brand{color:#f4e8d8;font-size:24px}body.experience-modern .brand-mark{background:#a8794a!important;color:#fff3df!important;box-shadow:none!important}
body.experience-modern .sidebar .nav-item{grid-template-columns:20px minmax(0,1fr) auto;column-gap:15px;height:41px;border-radius:9px;color:#d5c8b7!important;font-size:16px;font-weight:600;line-height:1.2;white-space:nowrap}
body.experience-modern .sidebar .nav-item>span{display:grid;place-items:center;width:20px;font-size:19px;line-height:1}
body.experience-modern .sidebar .nav-item>b{padding:3px 8px;font-size:13px;font-weight:600;line-height:1.15}
body.experience-modern .sidebar .nav-item.active{background:#634b34!important;color:#fff6e8!important;box-shadow:inset 0 0 0 1px #b48b5944!important;font-weight:700}
body.experience-modern .sidebar .nav-item:hover{background:#ffffff0c!important}
body.experience-modern .workspace-header{border-bottom:1px solid var(--border-subtle)!important}
body.experience-modern :is(.experience-command-trigger,.experience-profile-button,.experience-profile-menu,.experience-command-dialog,.experience-drawer-settings,.global-period-selectors){background:var(--interactive-bg)!important;color:var(--text-primary)!important;border-color:var(--border-default)!important;box-shadow:var(--theme-shadow)!important}
body.experience-modern :is(button,input,select,textarea){accent-color:var(--accent)}
body.experience-modern :is(button,a,input,select,textarea):focus-visible{outline:2px solid var(--accent);outline-offset:3px}
body.experience-modern :is(.primary-button,.modern-primary){background:var(--accent)!important;color:var(--app-bg)!important;border:1px solid transparent;border-radius:28px;padding:12px 22px;font:700 13px "DM Sans",sans-serif;cursor:pointer}
body.experience-modern :is(.secondary-button,.text-button,.text-link){color:var(--accent)!important}
body.experience-modern :is(.panel,.vehicle-card,.expense-vehicle-card,.maintenance-vehicle-card,.decision-card,.breakeven-card,.loan-card){box-shadow:var(--theme-shadow)!important;border:1px solid var(--border-subtle)!important;border-radius:15px!important}
body.experience-modern :is(.mini-metric,.expense-metric,.vehicle-card-facts>div,.maintenance-summary-grid>div,.loan-facts>div,.break-stats>div,.stat-pairs>div){border:0!important;box-shadow:none!important;background:var(--card-elevated-bg)!important}
body.experience-modern :is(.vehicle-card-image,.maintenance-card-media img,.expense-vehicle-image){object-fit:contain!important;background:var(--metric-bg)!important}
body.experience-modern .vehicle-card .fleet-vehicle-image{aspect-ratio:3/2!important;height:auto!important;max-height:280px}
body.experience-modern .maintenance-card-media{min-height:150px}
body.experience-modern :is(.bar.profit,.legend-profit,#goalProgress){background:var(--accent)!important}
body.experience-modern :is(.bar.gross,.legend-gross){background:var(--text-muted)!important}
body.experience-modern :is(.profit-value,.positive){color:var(--positive)!important}
body.experience-modern .negative{color:var(--negative)!important}
body.experience-modern .calendar-event{border-left:3px solid var(--accent)!important;background:var(--metric-bg)!important;color:var(--text-primary)!important}
body.experience-modern :is(.experience-profile-avatar,#experienceProfileInitials){background-color:var(--metric-bg)!important;color:var(--accent)!important}
body.experience-modern :is(#experienceProfileInitials,.experience-profile-avatar).has-photo{background-size:cover!important;background-position:center!important}
body.experience-modern #overviewView.view.active{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);grid-template-areas:"hero hero hero" "kpis kpis kpis" "setup setup setup" "earnings upcoming vehicles" "alerts alerts alerts" "costs goal goal" "banner banner banner";gap:20px}
body.experience-modern #overviewView>.overview-welcome,body.experience-modern #overviewView>.fleet-panel{display:none!important}
body.experience-modern #overviewView .overview-financial-grid,body.experience-modern #overviewView .overview-operations-grid{display:contents}
body.experience-modern #overviewView #metricGrid{grid-area:kpis;position:relative;margin-top:-44px!important;margin-inline:20px!important;z-index:1;max-width:calc(100% - 40px);grid-template-columns:repeat(4,minmax(0,1fr))}
body.experience-modern #overviewView .metric-card{background:var(--card-bg)!important;border:1px solid var(--border-default)!important;box-shadow:var(--theme-shadow)!important;border-radius:14px!important;min-height:140px;color:var(--text-primary)!important;backdrop-filter:blur(12px)}
body.experience-modern #overviewView .metric-card>strong{font-size:clamp(25px,2.5vw,38px)}
body.experience-modern #overviewView .metric-icon{background:var(--metric-bg)!important;color:var(--accent)!important;display:grid;width:32px;height:32px;border-radius:9px;place-items:center}
body.experience-modern #overviewView .revenue-panel{grid-area:earnings;display:flex;flex-direction:column;border-top:1px solid var(--border-subtle)!important}
body.experience-modern #overviewView .revenue-panel>.panel-head{order:0}
body.experience-modern #overviewView .revenue-panel .chart{order:2;height:185px;gap:7px;padding-inline:0}
body.experience-modern #overviewView .revenue-panel .chart-label{font-size:10px}
body.experience-modern #overviewView .revenue-panel .panel-head{flex-wrap:wrap}
body.experience-modern #overviewView .overview-operations-grid>.panel:has(#upcomingList){grid-area:upcoming}
body.experience-modern #modernVehicles{grid-area:vehicles}
body.experience-modern #turoSetupPanel{grid-area:setup;padding:0!important;overflow:hidden;border-radius:13px!important;background:var(--card-bg)!important}
body.experience-modern #turoSetupPanel>summary{min-height:66px;padding:10px 16px!important;display:flex;align-items:center;gap:18px}
body.experience-modern #turoSetupPanel .setup-intro{min-width:0;display:flex;align-items:baseline;gap:12px;flex:1}
body.experience-modern #turoSetupPanel .setup-intro h2{font-size:14px;margin:0;white-space:nowrap}
body.experience-modern #turoSetupPanel .setup-intro p{font-size:12px;margin:0;color:var(--text-secondary);min-width:0}
body.experience-modern #turoSetupPanel .setup-toggle{flex:0 0 auto;color:var(--accent);font-size:12px}
body.experience-modern #turoSetupPanel[data-modern-status="attention"]>summary{box-shadow:inset 3px 0 0 var(--warning)}
body.experience-modern #turoSetupPanel[open]>summary{border-bottom:1px solid var(--border-subtle)}
body.experience-modern #turoSetupPanel .setup-steps{padding:14px!important;gap:12px!important}
body.experience-modern #turoSetupPanel .setup-step{min-width:0!important;max-width:100%!important}
body.experience-modern #overviewView .overview-alerts-panel{grid-area:alerts}
body.experience-modern #overviewView .breakdown-panel{grid-area:costs;border-top:1px solid var(--border-subtle)!important}
body.experience-modern #earningsGoalCard{grid-area:goal}
body.experience-modern #modernHero{grid-area:hero;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.42fr);min-height:310px;border-radius:18px;overflow:hidden;background:linear-gradient(125deg,var(--card-elevated-bg),var(--app-bg));position:relative;isolation:isolate}
body.experience-modern #modernHero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 34%,color-mix(in srgb,var(--accent) 24%,transparent),transparent 32%),linear-gradient(110deg,transparent 55%,color-mix(in srgb,var(--accent) 10%,transparent));z-index:-1}
body.experience-modern .modern-hero-copy{padding:34px 28px 58px;position:relative;z-index:1;align-self:center;max-width:760px}
body.experience-modern .modern-hero-copy h2{font:400 clamp(30px,3.4vw,52px)/1.07 Georgia,"Times New Roman",serif;letter-spacing:-.025em;margin:16px 0 12px}
body.experience-modern .modern-hero-copy p{font-size:14px;line-height:1.6;color:var(--text-secondary);margin:12px 0 20px}
body.experience-modern .modern-hero-copy .modern-hero-earnings{font:400 23px/1.4 Georgia,serif;color:var(--text-primary);margin:12px 0}
body.experience-modern .modern-hero-ambient{position:relative;min-width:0;overflow:hidden;display:grid;place-items:center;color:color-mix(in srgb,var(--accent) 46%,transparent);font-size:10px;letter-spacing:.28em}
body.experience-modern .modern-hero-ambient::before,body.experience-modern .modern-hero-ambient::after{content:"";position:absolute;border:1px solid color-mix(in srgb,var(--accent) 28%,transparent);border-radius:50%;width:250px;aspect-ratio:1;transform:translate(34px,-22px)}
body.experience-modern .modern-hero-ambient::after{width:170px;transform:translate(-28px,54px)}
body.experience-modern .modern-hero-ambient i{width:1px;height:70%;background:linear-gradient(transparent,var(--accent),transparent);opacity:.35;transform:rotate(28deg)}
body.experience-modern .modern-hero-ambient span{position:absolute;right:22px;bottom:24px}
body.experience-modern .modern-earnings-summary{order:1;padding-bottom:18px}
body.experience-modern .modern-earnings-summary>strong{display:block;font-size:32px;letter-spacing:-.04em}
body.experience-modern .modern-earnings-summary>span{font-size:12px;color:var(--text-muted)}
body.experience-modern .modern-earnings-summary dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0 0;border-top:1px solid var(--border-subtle);padding-top:14px}
body.experience-modern .modern-earnings-summary dt{font-size:11px;color:var(--text-muted)}
body.experience-modern .modern-earnings-summary dd{margin:4px 0 0;font-size:16px;font-weight:650}
body.experience-modern #overviewView .panel-head h2{font-size:17px}
body.experience-modern #overviewView .upcoming-booking-row{grid-template-columns:68px minmax(0,1fr)!important;padding:12px 0!important;gap:8px 10px!important}
body.experience-modern #overviewView .upcoming-booking-row>.fleet-vehicle-image{width:68px!important;max-width:68px!important;height:48px!important}
body.experience-modern #overviewView .upcoming-booking-copy{grid-column:2;grid-row:1}
body.experience-modern #overviewView .upcoming-booking-result{grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
body.experience-modern .modern-vehicle-row{display:grid;grid-template-columns:72px minmax(0,1fr);gap:10px;padding:14px 0;border-bottom:1px solid var(--border-subtle)}
body.experience-modern .modern-vehicle-row:last-child{border-bottom:0}
body.experience-modern .modern-vehicle-row .fleet-vehicle-image{width:72px;height:52px;aspect-ratio:3/2;border-radius:9px}
body.experience-modern .modern-vehicle-row img{width:100%;height:100%;object-fit:contain!important}
body.experience-modern .modern-vehicle-row h3{font-size:13px;line-height:1.4;margin:0}
body.experience-modern .modern-vehicle-row p{font-size:11px;line-height:1.5;color:var(--text-muted);margin:6px 0}
body.experience-modern .modern-vehicle-row .vehicle-profile-link{min-width:0;padding:4px 0;min-height:30px;font-size:12px}
body.experience-modern .modern-vehicle-profit{grid-column:2;display:flex;gap:8px;align-items:baseline}
body.experience-modern .modern-vehicle-profit strong{font-size:18px}
body.experience-modern .modern-vehicle-profit small{font-size:11px;color:var(--text-muted)}
body.experience-modern #modernEditorialBanner{grid-area:banner;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:28px 32px;border:1px solid var(--border-default);border-radius:15px;background:linear-gradient(115deg,var(--card-elevated-bg),var(--card-bg))}
body.experience-modern .modern-editorial-banner h2{font:400 27px/1.2 Georgia,serif;margin:0 0 8px}
body.experience-modern .modern-editorial-banner p{font-size:13px;color:var(--text-secondary);margin:0}
@media(min-width:1450px){body.experience-modern .modern-vehicle-row{grid-template-columns:86px minmax(0,1fr) auto}body.experience-modern .modern-vehicle-profit{grid-column:3;grid-row:1;display:grid;gap:4px;text-align:right}body.experience-modern .modern-vehicle-row .fleet-vehicle-image{width:86px;height:60px}}
@media(max-width:1150px) and (min-width:781px){body.experience-modern #overviewView.view.active{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"hero hero" "kpis kpis" "setup setup" "earnings upcoming" "vehicles vehicles" "alerts alerts" "costs goal" "banner banner"}body.experience-modern #overviewView #metricGrid{grid-template-columns:repeat(2,minmax(0,1fr))}body.experience-modern .modern-hero-copy h2{font-size:36px}}
@media(max-width:780px){
body.experience-modern .sidebar .main-nav .nav-item{min-height:44px;height:44px;font-size:16px;font-weight:600}
body.experience-modern .sidebar .main-nav .nav-item.active{font-weight:700}
body.experience-modern #overviewView.view.active{grid-template-columns:minmax(0,1fr);grid-template-areas:"hero" "kpis" "setup" "earnings" "upcoming" "vehicles" "alerts" "costs" "goal" "banner";gap:14px}
body.experience-modern #modernHero{grid-template-columns:minmax(0,1fr);min-height:0;border-radius:14px}
body.experience-modern .modern-hero-copy{padding:24px 18px 28px}
body.experience-modern .modern-hero-copy h2{font-size:32px;margin:10px 0}
body.experience-modern .modern-hero-copy .modern-hero-earnings{font-size:20px}
body.experience-modern .modern-hero-copy p{font-size:13px;margin:10px 0}
body.experience-modern .modern-hero-ambient{position:absolute;inset:0;pointer-events:none;opacity:.55}
body.experience-modern .modern-hero-ambient span{display:none}
body.experience-modern #turoSetupPanel>summary{min-height:0;padding:12px 14px!important;align-items:flex-start;flex-wrap:wrap;gap:6px 12px}
body.experience-modern #turoSetupPanel .setup-intro{display:grid;gap:3px;flex-basis:220px}
body.experience-modern #turoSetupPanel .setup-intro h2{white-space:normal}
body.experience-modern #turoSetupPanel .setup-toggle{margin-left:auto}
body.experience-modern #overviewView #metricGrid{margin:0!important;max-width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
body.experience-modern #overviewView .metric-card{padding:14px;min-height:142px}
body.experience-modern #overviewView .metric-card>strong{font-size:27px}
body.experience-modern #overviewView .metric-icon{display:none}
body.experience-modern #modernEditorialBanner{display:grid;gap:16px;padding:22px}
body.experience-modern .modern-editorial-banner h2{font-size:24px}
body.experience-modern .experience-mobile-nav{background:#2a211a!important;border-color:#766049!important;box-shadow:0 10px 28px #100b0844!important}
body.experience-modern .experience-mobile-nav button{color:#d3c3af!important}
body.experience-modern .experience-mobile-nav button.active{background:#ddbc94!important;color:#302319!important;box-shadow:none!important}
body.experience-modern .experience-profile-menu{background:var(--card-bg)!important;backdrop-filter:none!important}
}
/* Explicit grid placement neutralizes the older shared thumbnail rules. */
body.experience-modern #overviewView .upcoming-booking-copy{grid-column:2!important;grid-row:1!important;min-width:0!important}
body.experience-modern #overviewView .upcoming-booking-copy strong{white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
body.experience-modern #overviewView .upcoming-booking-result{grid-column:2!important;grid-row:2!important;min-width:0!important;margin-top:0!important}
body.experience-modern .modern-vehicle-row>.fleet-vehicle-image{position:relative!important;inset:auto!important;width:72px!important;min-width:0!important;max-width:72px!important;height:52px!important;grid-column:1;grid-row:1;transform:none!important}
body.experience-modern .modern-vehicle-row>div:not(.fleet-vehicle-image){min-width:0}
/* Bridge legacy surface tokens to Modern's semantic palette in both appearances. */
html body.experience-modern[data-experience="modern"]{--background:var(--app-bg);--surface:var(--card-bg);--surface-soft:var(--section-bg);--surface-elevated:var(--card-elevated-bg);--surface-strong:var(--metric-bg);--border:var(--border-default);--border-strong:var(--border-default);--bg-app:var(--app-bg);--bg-section:var(--section-bg);--bg-card:var(--card-bg);--bg-elevated:var(--card-elevated-bg);--bg-interactive:var(--interactive-bg);--accent-soft:var(--metric-bg);--selected:var(--metric-bg);--hover:var(--card-elevated-bg);--chart-grid:var(--border-subtle);--chart-axis:var(--text-muted);--fl-page:var(--app-bg);--fl-surface:var(--card-bg);--fl-surface-soft:var(--section-bg);--fl-surface-strong:var(--metric-bg);--fl-accent:var(--accent);--fl-accent-soft:var(--metric-bg)}
body.experience-modern .experience-mobile-nav button :is(span,b,strong){color:inherit!important}
body.experience-modern #experienceProfileInitials{font-size:16px}
@media(max-width:780px){body.experience-modern #experienceProfileInitials{font-size:12px!important}}
body.experience-modern .fleet-vehicle-image>.vehicle-image-fallback{background:var(--metric-bg)!important;color:var(--text-secondary)!important;border-color:var(--border-default)!important}
body.experience-modern .sidebar .nav-item>b{background:#59432e!important;color:#f1dfc7!important}
