/* Validated theme tokens and responsive layout variants shared by both portals. */
html{--theme-background:#f1f5fa;--theme-surface:#fff;--theme-text:#172538;--theme-muted:#526478;--theme-accent:#155e90;--theme-accent_text:#fff;--theme-navigation:#102b45;--theme-navigation_text:#e0edfa;--theme-border:#cbd7e4;--theme-radius:10px;--theme-spacing:18px;--theme-font:system-ui,sans-serif}
html body,html body.authenticated-app,html body.guest-app{background:var(--theme-background);color:var(--theme-text);font-family:var(--theme-font)}
html a{color:var(--theme-accent)}
html article,html details,html .card,html .rows,html .stat-card,html .calendar-toolbar,html .calendar-legend,html .calendar-scroll,html .calendar-arrow,html .today-link,html .action-dialog,html .action-trigger,html .portal-summary a,html .org-person,html .empty-state{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border);border-radius:var(--theme-radius)}
html article,html .card{padding:var(--theme-spacing)}
html .muted,html .eyebrow,html .stat-card span,html .stat-card small,html .customer-task-grid p,html .current-presence p,html .calendar-zone,html .empty-state p,html .header-context,html .presence-caption span{color:var(--theme-muted)}
html th,html .weekday,html .calendar-day.weekend,html .calendar-day.outside{background:var(--theme-background);color:var(--theme-muted)}
html td,html .stat-card strong,html .day-number{color:var(--theme-text)}
html th,html td,html .calendar-day,html .weekday,html .dialog-heading,html .dialog-footer{border-color:var(--theme-border)}
html input,html select,html textarea{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border);font-family:var(--theme-font)}
html input[type=color]{height:42px;width:100%;padding:4px}
html button,html .button-link{background:var(--theme-accent);color:var(--theme-accent_text);font-family:var(--theme-font);border-radius:var(--theme-radius)}
html button:hover,html .button-link:hover{filter:brightness(.92)}
html button:disabled{opacity:.7;cursor:default}
html .secondary,html .logout-button,html .dialog-close{background:var(--theme-surface);color:var(--theme-text);border:1px solid var(--theme-border)}
html .app-sidebar,html .guest-header{background:var(--theme-navigation);color:var(--theme-navigation_text)}
html .app-brand,html .app-brand small,html .menu-link,html .menu-group,html .sidebar-footer,html .sidebar-footer small,html .guest-header a{color:var(--theme-navigation_text)}
html .menu-link:hover,html .menu-link.active{background:color-mix(in srgb,var(--theme-navigation_text) 14%,transparent);color:var(--theme-navigation_text)}
html .menu-link.active{box-shadow:inset 3px 0 var(--theme-navigation_text)}
html .app-header{background:var(--theme-surface);color:var(--theme-text);border-color:var(--theme-border)}
html .user-avatar,html .calendar-switch,html .calendar-switch .selected{background:var(--theme-background);color:var(--theme-accent)}
html .calendar-day.is-today{background:color-mix(in srgb,var(--theme-accent) 8%,var(--theme-surface));box-shadow:inset 0 0 0 1px var(--theme-accent)}
html .is-today .day-number{background:var(--theme-accent);color:var(--theme-accent_text)}
html .calendar-filters{min-width:0}html .app-main{overflow-wrap:anywhere}
html :focus-visible{outline:3px solid var(--theme-accent);outline-offset:3px}
.theme-gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px;margin:20px 0}
.theme-gallery .theme-card{margin:0;min-width:0;display:flex;flex-direction:column;gap:9px}
.theme-card h3,.theme-card p{margin:0}.theme-card p{font-size:13px;line-height:1.6}.theme-card form{margin-top:auto;padding-top:10px}
.theme-current{outline:2px solid var(--theme-accent);outline-offset:1px}
.theme-preview{height:130px;display:flex;gap:10px;background:var(--theme-background);border:1px solid var(--theme-border);border-radius:var(--theme-radius);padding:10px;overflow:hidden}
.theme-preview .preview-nav{width:24%;background:var(--theme-navigation);border-radius:4px;flex-shrink:0}
.theme-preview .preview-content{display:grid;grid-template-columns:1fr 1fr;gap:7px;flex:1}
.theme-preview i{background:var(--theme-surface);border:1px solid var(--theme-border);border-top:4px solid var(--theme-accent);border-radius:4px}
.theme-preview[data-preview-layout=right]{flex-direction:row-reverse}
.theme-preview[data-preview-layout=top]{flex-direction:column}.theme-preview[data-preview-layout=top] .preview-nav{width:100%;height:20px}
.theme-preview[data-preview-layout=compact] .preview-nav{width:14%}.theme-preview[data-preview-layout=compact] .preview-content{grid-template-columns:repeat(3,1fr);gap:3px}
.theme-preview[data-preview-layout=centered]{padding:10px 24px}.theme-preview[data-preview-layout=centered] .preview-content{grid-template-columns:1fr}
@media(min-width:801px){
 html[data-layout=right] body.authenticated-app{padding-left:0;padding-right:var(--sidebar-width)}
 html[data-layout=right] .app-sidebar{left:auto;right:0}
 html[data-layout=right] .app-header{left:0;right:var(--sidebar-width)}
 html[data-layout=top] body.authenticated-app{padding-left:0;padding-top:0}
 html[data-layout=top] .app-sidebar{position:relative;inset:auto;width:100%;height:auto;display:flex;flex-direction:row;align-items:center;overflow:visible}
 html[data-layout=top] .app-brand{padding:16px;flex-shrink:0}
 html[data-layout=top] .app-navigation{display:flex;align-items:center;flex-wrap:wrap;gap:3px;padding:12px;margin:0;overflow:visible}
 html[data-layout=top] .menu-group,html[data-layout=top] .sidebar-footer{display:none}
 html[data-layout=top] .menu-link{padding:9px;margin:0}
 html[data-layout=top] .app-header{position:sticky;left:0;right:0;top:0}
 html[data-layout=compact]{--sidebar-width:190px;--header-height:52px}
 html[data-layout=compact] .app-main{max-width:none;padding:14px}
 html[data-layout=compact] .menu-link{padding:8px;font-size:11px}
 html[data-layout=compact] article,html[data-layout=compact] .stat-card{padding:12px}
 html[data-layout=compact] th,html[data-layout=compact] td{padding:8px 10px}
 html[data-layout=compact] .calendar-day{min-height:100px}
 html[data-layout=centered]{--sidebar-width:210px}
 html[data-layout=centered] .app-main{max-width:1050px;padding:32px}
 html[data-layout=centered] .calendar-stats{grid-template-columns:repeat(2,1fr)}
 html[data-layout=centered] .settings-responsibilities{grid-template-columns:1fr}
}
@media(max-width:800px){html .theme-gallery{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}html .app-main{padding:16px 12px}html .app-sidebar{left:0;right:auto}html .action-dialog{max-width:calc(100vw - 24px)}html .header-user{gap:8px}html .header-context{max-width:120px}html .theme-card button{width:100%}}
@media(prefers-reduced-motion:reduce){html *{scroll-behavior:auto;transition:none!important}}

html .notice{background:color-mix(in srgb,#19805e 12%,var(--theme-surface));color:var(--theme-text)}
html .notice.error{background:color-mix(in srgb,#c13d3d 12%,var(--theme-surface));color:var(--theme-text)}