/* Website appearance uses the app's charcoal surfaces and monochrome accents. */
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .page-head .page-tools>button.web-theme-toggle {
 display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 44px;
 width:44px!important;min-width:44px!important;max-width:44px!important;height:44px!important;min-height:44px!important;
 padding:10px!important;margin:0!important;border:1px solid var(--line)!important;border-radius:2px!important;
 background:var(--panel-soft)!important;color:var(--text)!important;box-shadow:none!important;transform:none!important;
 -webkit-tap-highlight-color:transparent;
}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .page-head .web-theme-toggle>.ui-icon {display:block!important;width:22px;height:22px;color:inherit!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .page-head .web-theme-toggle:is(:hover,:focus-visible) {border-color:var(--text)!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .page-head .web-theme-toggle>.web-theme-sun,
html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .page-head .web-theme-toggle>.web-theme-moon {display:none!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth)[data-page="/"] main#main .page-head {flex-wrap:nowrap!important;align-items:center!important;gap:16px!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth)[data-page="/"] main#main .page-head>div:first-child {flex:1 1 0!important;min-width:0;width:auto!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth)[data-page="/"] main#main .page-head>.page-tools {flex:0 0 44px!important;width:44px!important;min-width:44px;margin:0;gap:0}

@media screen {
 html[data-theme=dark]:has(body.web-ui:not(.pwa-view):not(.pwa-auth)) {color-scheme:dark;background:#111}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) {
  --bg:#111!important;--panel:#191919!important;--panel-soft:#222!important;--text:#f5f5f5!important;--muted:#c0c0c0!important;
  --accent:#f5f5f5!important;--line:#444!important;--danger:#f5f5f5!important;--sage:#eee!important;
  --ui-action-text:#f5f5f5;--ui-action-hover:#c0c0c0;--comments-bg:#191919;--comments-text:#f5f5f5;--comments-muted:#c0c0c0;--comments-line:#444;
  --web-control-border:#777;--web-primary:#f5f5f5;--web-primary-text:#111;--web-secondary:#333;
  background:var(--bg)!important;color:var(--text)!important;
 }
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) * {scrollbar-color:#777 #222}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,dialog,.app-notification-drawer) :is(h1,h2,h3,h4,strong,b,label,legend,dt,dd,.field,.saldo,.big-saldo,.totals-bar b,.chart-kpi,.balance-item strong) {color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(p,a:not(.button),.event-list a,.dashboard-upcoming-list a,.cash-action-icon,.cash-action-text strong,.role-explanation strong,.table-cell-value,.calendar-day>span) {color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(small,.muted,.field-hint,.field-error,.eyebrow,.chart-caption,.chart-legend,.auth-kicker,.auth-foot,.auth-section-label,.table-mobile-label,.event-facts dt,.event-facts dd,.event-creator,.weekday,.notification-date,.attendance-deadline,.attendance-status-prefix,.participant-count,.roster-summary,.cash-actions small,.balance-item span,.chart-summary,.chart-summary b,.auth-links a,.role-explanation p,.stats small,.member-card p,.media-card p,.media-card small,.hero-note) {color:var(--muted)!important}

 /* The existing spacing stays with each card; this layer supplies its dark surface. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.panel,.event-detail-layout>#attendance,.personal-account,.personal-balance,.personal-finance-summary,.personal-finance-recent,.website-finance,.dashboard-upcoming,.dashboard-birthday,.dashboard-update,.website-install,.cash-manage-actions,.cash-audit>details,.media-category-grid>a,.report-grid>.panel,.profile-sidebar>.profile-email):not(.website-outlook) {background:var(--panel)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.optional-fields,.advanced-disclosure,.filter-disclosure,.media-filter-panel,.cash-maintenance,.event-admin,.profile-photo-section,.profile-avatar-editor,.role-explanation,.empty-state,.empty,.opening-summary,.penalty-summary,.payment-extra,.penalty-extra,.penalty-review,.penalty-participant,.penalty-row,.feedback-symbol,.feedback-empty-icon) {background:var(--panel-soft)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.event-roster,.finance-disclosure,.cash-period-settings,.dashboard-update,.website-install)>summary {background:var(--panel)!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.stats,.stat,.cash-card,.website-home .website-finance .stats,.profile-photo-section .profile-avatar-editor) {background:transparent!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.stats span,.cash-card>span,.stat>span,.dashboard-upcoming-list time) {color:var(--muted)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.chart-viewport,.finance-chart) {background:var(--panel)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.event-detail-layout,.profile-layout,.section-layout,.cash-manage-columns,.website-outlook) {background:transparent!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.cash-actions>a,.member-card,.media-category-grid>a,.birthday-person) {background:var(--panel-soft)!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.cash-actions>a,.member-card,.media-category-grid>a):is(:hover,:focus-visible) {background:#333!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .birthday-person {background:transparent!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.profile-photo-section,.optional-fields,.advanced-disclosure,.filter-disclosure,.event-admin) .panel {background:var(--panel)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(.avatar,.badge,.calendar-day,.notification-item,fieldset,.form-section,.event-list li,.calendar-list section,.response-counts,.table-wrap,.event-admin,.event-description,.stats>section,.account-menu-divider) {border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(.initials,.badge,.response-counts>span,.feedback-status,.notification-item,.calendar-day,.media-thumbnail,.chart-empty) {background:var(--panel-soft)!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .badge.role-badge {background:#444!important;color:var(--text)!important}

 /* App-style actions, tabs and keyboard focus. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button=primary] {background:var(--web-primary)!important;color:var(--web-primary-text)!important;border-color:var(--web-primary)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button=primary]:is(:hover,:focus-visible) {background:#d7d7d7!important;color:#111!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button=secondary] {background:var(--web-secondary)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button=secondary]:is(:hover,:focus-visible) {background:#444!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button=text] {background:transparent!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button=text]:is(:hover,:focus-visible) {color:var(--muted)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,.web-menu,.footer,dialog,.app-notification-drawer) [data-ui-button]>:is(span,strong,.ui-icon) {color:inherit!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.is-selected [data-ui-button=secondary],[data-ui-button=secondary][aria-pressed=true]) {background:var(--text)!important;color:var(--bg)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.media-submenu,.feedback-tabs,.finance-quick-filters)>a {background:var(--panel-soft)!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.media-submenu,.feedback-tabs,.finance-quick-filters)>a[aria-current=page] {background:var(--text)!important;color:var(--bg)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.media-submenu,.feedback-tabs,.finance-quick-filters)>a:not([aria-current=page]):hover {background:#333!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,.site-header,dialog,.app-notification-drawer) :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible {outline-color:var(--text)!important}

 /* Every writing control, including profile, filters, sign-in and modal forms. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):not(:where([type=hidden],[type=checkbox],[type=radio],[type=range],[type=file],[type=button],[type=submit],[type=reset],[type=image],[type=color])) {background-color:var(--panel-soft)!important;color:var(--text)!important;border-color:var(--web-control-border)!important;caret-color:var(--text);color-scheme:dark}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) select:not([multiple]):not([size]) {background-image:url(select-chevron-dark.svg)!important;background-repeat:no-repeat!important;background-position:right 18px center!important;background-size:12px 8px!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):hover {border-color:#aaa!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):focus {border-color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea)::placeholder {color:#aaa!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog) input:is([type=checkbox],[type=radio]) {accent-color:var(--text)}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog) input[type=file] {color:var(--text)!important;background:transparent!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog) input[type=file]::file-selector-button {background:var(--text)!important;color:var(--bg)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog) input:is(:autofill,:-webkit-autofill) {background-color:var(--panel-soft)!important;-webkit-box-shadow:0 0 0 1000px var(--panel-soft) inset!important;box-shadow:0 0 0 1000px var(--panel-soft) inset!important;-webkit-text-fill-color:var(--text)!important;caret-color:var(--text)!important}

 /* Tables keep their existing responsive layout and dark row separators. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap {background:transparent!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap :is(table,th,td) {color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap th {background:var(--panel-soft)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap tbody tr {background:var(--panel)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap tbody tr:nth-child(even) {background:#202020!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap td {background:transparent!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .table-wrap tr:hover td {background:#292929!important}

 /* Header, navigation, account menu and footer share the app's dark canvas. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .site-header {background:#111111f5!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .site-header :is(.brand,.brand strong,.web-menu-toggle,.notification-bell,.public-switch a,.admin-return) {color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .site-header .brand img {filter:brightness(0) invert(1)}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .site-header .notification-bell>span {background:var(--text)!important;color:var(--bg)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .account-menu-content {background:var(--panel-soft)!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .web-menu {background:var(--panel)!important;color:var(--text)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .web-menu-submenu {background:var(--panel-soft)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .footer {background:var(--panel)!important;color:var(--muted)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(dialog,.app-notification-drawer) {background:var(--panel)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) dialog::backdrop {background:#0009}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) .auth-hero {background:var(--panel)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.auth-intro p,.auth-panel>p,.auth-panel>.muted) {color:var(--muted)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .notice {background:var(--panel-soft)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .feedback-kind-picker label>span {background:var(--panel-soft)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .feedback-kind-picker input:checked+span {background:var(--text)!important;color:var(--bg)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .feedback-kind-picker input:checked+span :is(strong,small,.ui-icon) {color:inherit!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .app-download {background:var(--panel)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .app-download-buttons button {background:var(--panel-soft)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .app-download-buttons button :is(small,.ui-icon) {color:inherit!important}

 /* Calendar accents retain their meaning on the charcoal surface. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-day .calendar-appointment {background:#27362d!important;color:#d2e4d8!important;border-color:#759b83!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-day .calendar-appointment.cancelled {background:#382a2a!important;color:#e8cccc!important;border-color:#a87979!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-day .calendar-birthday {background:#382b32!important;color:#ecd2de!important;border-color:#a77d90!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-regional-item.calendar-holiday {background:#26313e!important;color:#ceddec!important;border-color:#7895b0!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-regional-item.calendar-school-break {background:#363125!important;color:#e7ddbf!important;border-color:#aa9a6b!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-regional-item.calendar-carnival {background:#302938!important;color:#e0d2ed!important;border-color:#9a83ad!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .calendar-day.today {border-color:var(--text)!important}

 /* Monochrome reports use the same plot colors as the app. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .finance-chart text {fill:var(--muted)}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .chart-line {stroke:var(--text)}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .chart-area {fill:#ffffff18}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .chart-point {fill:var(--text);stroke:var(--panel)}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .chart-grid {stroke:var(--line)}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.chart-income,.balance-open) {fill:#ddd}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.chart-expense,.balance-credit) {fill:#888}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .balance-track {fill:#333}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .income-dot {background:#ddd}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .expense-dot {background:#888}
}
@media print {
 html:has(body.web-ui:not(.pwa-view):not(.pwa-auth)) {color-scheme:light}
 html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .page-head .page-tools>button.web-theme-toggle {display:none!important}
}

/* A soft gray next-event card belongs to the light website palette. */
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event {background:#ededed!important;color:#171717!important;--ui-action-text:#171717;--ui-action-hover:#555}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event :is(h2,h2 a,.next-event-meta,.next-event-meta span,.next-event-meta .ui-icon,.next-event-header>span) {color:#171717!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event :is(.eyebrow,.field-hint,.attendance-status-prefix,.attendance-deadline,.next-event-empty-text,small,.muted,.next-event-people-link,.next-event-people-link span) {color:#606060!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event .next-event-people {border-color:#c8c8c8!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event .attendance-status>strong {background:#fff!important;color:#171717!important;border-color:#b5b5b5!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event .initials {background:#e0e0e0!important;color:#333!important;border-color:#b5b5b5!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event :is(button,.button) {background:#d3d3d3!important;color:#171717!important;border-color:#b5b5b5!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event :is(button,.button):is(:hover,:focus-visible) {background:#c4c4c4!important;color:#171717!important;outline-color:#171717!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event .quick-response.is-selected button {background:#353535!important;color:#fff!important;border-color:#353535!important}
html[data-theme=light] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event :is(button,.button)>:is(span,.ui-icon) {color:inherit!important}

/* The finance filter starts at its header; its presets use the same content inset. */
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .panel:has(>details.filter-disclosure) {padding:0!important;min-width:0}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .panel:has(>details.filter-disclosure)>.quick-filters {padding:0 var(--review-card,24px) var(--review-card,24px)!important;margin:0!important;gap:12px!important;max-width:100%;box-sizing:border-box}

@media screen {
 /* Existing borders and separators share a single 1px weight in dark mode. */
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) {--ui-border-width:1px!important;--ui-rule-width:1px!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]),
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) select {border-width:1px!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(fieldset,.feedback-kind-picker label>span,.feedback-kind-picker input:checked+span,.attendance-status>strong,.notice,.notice.error) {border-width:1px!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main :is(.media-toolbar,.media-filter-bar) {background:var(--panel)!important;color:var(--text)!important;border-color:var(--line)!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) select {color-scheme:dark!important}
 html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) select :is(option,optgroup) {background:var(--panel-soft);color:var(--text);color-scheme:dark}
}

/* Quiet form surfaces with one lower edge and a clear focus accent in both modes. */
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) {--website-field-bg:#fafafa;--website-field-hover:#fff;--website-field-focus:#fff;--website-field-line:#a8a8a8;--website-field-line-hover:#727272}
html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) {--website-field-bg:#242424;--website-field-hover:#282828;--website-field-focus:#2c2c2c;--website-field-line:#777;--website-field-line-hover:#aaa}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]):not([type=image]) {
 background-color:var(--website-field-bg)!important;color:var(--text)!important;
 border:0!important;border-bottom:1px solid var(--website-field-line)!important;border-radius:2px 2px 0 0!important;
 outline:none!important;box-shadow:none!important;box-sizing:border-box;
 transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease;
}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]):not([type=image]):hover:not(:disabled):not([readonly]) {background-color:var(--website-field-hover)!important;border-bottom-color:var(--website-field-line-hover)!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]):not([type=image]):focus {background-color:var(--website-field-focus)!important;border-bottom-color:var(--text)!important;box-shadow:inset 0 -1px 0 var(--text)!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) :is(input,textarea,select):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]):not([type=image])[aria-invalid=true] {border-bottom-color:var(--text)!important;box-shadow:inset 0 -1px 0 var(--text)!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) select:not([multiple]):not([size]) {background-repeat:no-repeat!important;background-position:right 16px center!important;background-size:12px 8px!important;padding-right:44px!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]):not([type=image]):is(:autofill,:-webkit-autofill) {box-shadow:0 0 0 1000px var(--website-field-bg) inset!important;-webkit-text-fill-color:var(--text)!important;caret-color:var(--text)!important}
html[data-theme] body.web-ui:not(.pwa-view):not(.pwa-auth) :is(main#main,dialog,.app-notification-drawer) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]):not([type=file]):not([type=color]):not([type=button]):not([type=submit]):not([type=reset]):not([type=image]):is(:autofill,:-webkit-autofill):focus {box-shadow:inset 0 -1px 0 var(--text),0 0 0 1000px var(--website-field-focus) inset!important}

/* Show the saved attendance confirmation directly on the dark event card. */
html[data-theme=dark] body.web-ui:not(.pwa-view):not(.pwa-auth) main#main .website-home .next-event .attendance-feedback>.notice.success {background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;color:var(--text)!important}