/*
 * Mobile contract: fixed chrome reserves real content clearance.
 */

@media (max-width: 768px) {
    :root {
        --omni-mobile-shell-bottom-clearance: calc(var(--omni-mobile-bottomnav-h) + var(--omni-mobile-safe-bottom) + 40px);
        --omni-mobile-page-x: 6px;
        --omni-mobile-section-gap: 12px;
        --omni-mobile-card-gap: 8px;
        --omni-mobile-card-pad: 10px;
        --omni-mobile-control-h: 42px;
        --omni-mobile-control-radius: 13px;
    }

    body {
        min-width: 0;
        overflow-x: hidden;
    }

    .app-shell,
    .mud-layout,
    .mud-main-content,
    main {
        max-width: 100vw;
        overflow-x: hidden;
    }

    .mud-layout .mud-main-content.app-main-content {
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
        padding-left: var(--omni-mobile-page-x) !important;
        padding-right: var(--omni-mobile-page-x) !important;
        box-sizing: border-box !important;
        min-height: 100dvh;
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
        scroll-padding-bottom: var(--omni-mobile-shell-bottom-clearance);
    }

    html body .mud-layout > .mud-main-content.app-main-content {
        --omni-mobile-page-x: 6px;
        padding: calc(var(--omni-mobile-topbar-h) + var(--omni-mobile-householdbar-h) + env(safe-area-inset-top, 0px)) var(--omni-mobile-page-x) var(--omni-mobile-shell-bottom-clearance) !important;
        padding-inline-start: var(--omni-mobile-page-x) !important;
        padding-inline-end: var(--omni-mobile-page-x) !important;
    }

    .app-content-canvas {
        width: 100% !important;
        max-width: none !important;
        margin-inline: 0 !important;
        box-sizing: border-box !important;
        min-height: 100dvh;
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
        scroll-padding-bottom: var(--omni-mobile-shell-bottom-clearance);
    }

    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .shopping-ios-page,
    .notes-page,
    .directory-page,
    .maintenance-page,
    .transport-page,
    .profile-page {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: auto !important;
        padding-inline: 0 !important;
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
        overflow-x: clip;
        scroll-padding-bottom: var(--omni-mobile-shell-bottom-clearance);
        gap: var(--omni-mobile-section-gap);
    }

    .dayplan-page,
    .contacts-page,
    .ios-contacts-page,
    .network-page,
    .procurement-page,
    .shopping-page,
    .schoolrunsweek-page {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
        padding-inline: 0 !important;
        box-sizing: border-box !important;
    }

    .shopping-ios-page,
    .notes-page,
    .directory-page,
    .maintenance-page,
    .transport-page,
    .profile-page {
        min-height: calc(100dvh - var(--omni-mobile-topbar-h));
    }

    .notes-workspace,
    .notes-shell,
    .notes-editor-pane,
    .notes-editor-canvas,
    .maintenance-page-content,
    .shopping-list-shell,
    .shopping-section-card,
    .directory-grid,
    .contacts-grid {
        min-width: 0;
        max-width: 100%;
    }

    .notes-briefing-actions,
    .notes-editor-pane,
    .notes-editor-canvas {
        margin-bottom: max(16px, env(safe-area-inset-bottom, 0px));
    }

    .dayplan-list,
    .shopping-store-group,
    .shopping-list-shell,
    .ios-contact-list,
    .directory-grid,
    .contacts-grid,
    .maintenance-list,
    .maintenance-page-content,
    .schoolrunsweek-grid,
    .profile-section-grid,
    .notes-workspace {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
    }

    .app-page-shell-header,
    .app-page-header,
    .page-header,
    .ios-calendar-header,
    .shopping-ios-header,
    .ios-contacts-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header,
    .profile-hero,
    .profile-toolbar,
    .ios-calendar-toolbar,
    .dayplan-toolbar-row {
        max-width: 100%;
        min-width: 0;
    }

    .app-page-shell-header,
    .app-page-header,
    .ios-calendar-header,
    .shopping-ios-header,
    .ios-contacts-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        margin: 0 0 12px;
        padding: 0;
        border-bottom: 0;
        box-shadow: none;
    }

    .app-page-shell-header::after,
    .app-page-header::after,
    .shopping-ios-header::after,
    .ios-contacts-header::after,
    .maintenance-header::after,
    .notes-header::after,
    .schoolrunsweek-header::after,
    .dayplan-page-header::after {
        content: none !important;
        display: none !important;
    }

    .app-page-shell-title-block,
    .app-page-header > *,
    .page-header > * {
        min-width: 0;
        max-width: 100%;
    }

    .app-page-title,
    .app-page-shell-title,
    .app-page h1,
    .ios-calendar-month-label,
    .notes-title,
    .schoolrunsweek-title,
    .shopping-title,
    .shopping-ios-title,
    .settings-title {
        margin: 0;
        max-width: 100%;
        color: rgba(245, 246, 250, 0.95);
        font-size: clamp(1.5rem, 6vw, 1.9rem);
        font-weight: 850;
        line-height: 1.08;
        letter-spacing: 0;
        overflow-wrap: normal;
        word-break: normal;
    }

    .app-page-subtitle,
    .app-page-shell-subtitle,
    .app-page-context,
    .ios-page-subtitle,
    .ios-calendar-date-label,
    .shopping-subtitle,
    .notes-subtitle,
    .schoolrunsweek-subtitle,
    .maintenance-page-subtitle {
        display: block;
        max-width: 100%;
        color: rgba(203, 208, 220, 0.72);
        font-size: 0.92rem;
        line-height: 1.38;
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .app-page-eyebrow,
    .app-page-shell-kicker,
    .section-eyebrow,
    .ios-calendar-date-label,
    .notes-eyebrow,
    .schoolrunsweek-eyebrow,
    .shopping-eyebrow,
    .directory-section-title,
    .maintenance-section-eyebrow {
        color: rgba(196, 201, 214, 0.62);
        font-size: 0.62rem;
        font-weight: 820;
        letter-spacing: 0.145em;
        line-height: 1.1;
        text-transform: uppercase;
    }

    .mud-input-control,
    .mud-input,
    .mud-select,
    .mud-select-input,
    .mud-select-root,
    .mud-picker,
    .mud-card,
    .lux-card,
    .mobile-card {
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .mud-input-slot,
    .mud-select-input,
    .mud-list-item-text {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .app-action-row,
    .profile-actions,
    .shopping-item-actions,
    .directory-card-actions {
        gap: 8px;
    }

    .shopping-section-card {
        padding-inline: 8px !important;
    }

    .shopping-store-group {
        padding-inline: 0 !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        width: 100% !important;
        padding-inline: 10px !important;
    }

    .dayplan-date-control {
        position: relative !important;
        min-width: 0 !important;
        padding-inline: 0 !important;
    }

    .dayplan-date-native {
        box-sizing: border-box !important;
        padding-inline: 10px 56px !important;
        font-size: 0.86rem !important;
        font-weight: 700 !important;
        text-overflow: clip !important;
    }

    .dayplan-date-icon {
        position: absolute !important;
        inset-block: 0 !important;
        inset-inline-end: 0 !important;
        flex: 0 0 48px !important;
        width: 48px !important;
        height: 100% !important;
        margin-left: 0 !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .dayplan-date-icon .mud-icon-root,
    .dayplan-date-icon svg {
        width: 24px !important;
        height: 24px !important;
        min-width: 24px !important;
        min-height: 24px !important;
        max-width: 24px !important;
        max-height: 24px !important;
    }
}

/* Migrated legacy mobile blueprint composition. Source retired: omnisant.mobile.blueprint.css. */
:root,
[data-theme="dark"] {
    --omni-mobile-space-1: 4px;
    --omni-mobile-space-2: 8px;
    --omni-mobile-space-3: 12px;
    --omni-mobile-space-4: 16px;
    --omni-mobile-space-5: 20px;
    --omni-mobile-space-6: 24px;
    --omni-mobile-space-8: 32px;
    --omni-mobile-page-x: max(16px, env(safe-area-inset-left));
    --omni-mobile-control-h: 46px;
    --omni-mobile-control-radius: 14px;
    --omni-mobile-card-radius: 18px;
    --omni-mobile-section-radius: 22px;
    --omni-mobile-primary-radius: 26px;
    --omni-mobile-sheet-radius: 28px;
    --omni-mobile-border: rgba(255,255,255,0.075);
    --omni-mobile-border-strong: rgba(145,160,224,0.26);
    --omni-mobile-utility: linear-gradient(180deg, rgba(16,20,29,0.90), rgba(8,11,17,0.94));
    --omni-mobile-section: linear-gradient(180deg, rgba(22,27,39,0.92), rgba(11,15,23,0.96));
    --omni-mobile-primary: linear-gradient(180deg, rgba(27,33,48,0.96), rgba(12,16,25,0.98));
    --omni-mobile-shadow-1: 0 8px 22px rgba(0,0,0,0.22);
    --omni-mobile-shadow-2: 0 16px 40px rgba(0,0,0,0.32);
    --omni-mobile-shadow-3: 0 24px 60px rgba(0,0,0,0.42);
}

@media (max-width: 1023.98px) {
    html,
    body {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden !important;
        background: #05070c;
    }

    /* Shell geometry is owned by foundation/app.shell.css and foundation/app.mobile*.css. */

    .shopping-filter-chips::-webkit-scrollbar {
        display: none;
    }

    .ios-month-mobile-list,
    .ios-week-mobile-agenda,
    .ios-day-view {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--omni-mobile-space-4) !important;
    }

    /* Procurement: item identity first, actions second */
    .shopping-filter-card,
    .shopping-section-card {
        padding: var(--omni-mobile-space-4) !important;
        margin-bottom: var(--omni-mobile-space-4) !important;
    }

    .shopping-ios-page .app-page-shell-header {
        margin-bottom: 12px !important;
    }

    .shopping-ios-page .app-page-shell-toolbar {
        margin-bottom: 10px !important;
    }

    .shopping-ios-page .app-page-header {
        margin-bottom: var(--omni-mobile-space-4) !important;
    }

    .shopping-ios-page .house-context-card,
    .shopping-ios-page .current-house-card {
        padding: var(--omni-mobile-space-4) !important;
        margin-bottom: var(--omni-mobile-space-4) !important;
    }

    .shopping-filter-chips {
        display: flex !important;
        gap: 10px !important;
        overflow-x: auto !important;
        padding: 2px 16px 2px 0 !important;
    }

    .shopping-store-group {
        padding: var(--omni-mobile-space-4) !important;
        margin-bottom: var(--omni-mobile-space-5) !important;
    }

    .shopping-item-row {
        display: grid !important;
        grid-template-columns: minmax(0,1fr) !important;
        gap: var(--omni-mobile-space-4) !important;
        padding: var(--omni-mobile-space-4) !important;
    }

    .shopping-item-main {
        min-width: 0 !important;
        width: 100% !important;
    }

    .shopping-item-name {
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
        line-height: 1.25 !important;
    }

    .shopping-item-actions {
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .shopping-item-bought-button.mud-button-root {
        min-height: 38px !important;
        padding-inline: 16px !important;
        border-radius: 13px !important;
    }

    /* Transport: mobile structural cleanup without desktop redesign */
    .schoolrunsweek-toolbar,
    .schoolrunsweek-days {
        display: flex !important;
        flex-direction: column !important;
        gap: var(--omni-mobile-space-5) !important;
    }

    .schoolrunsweek-toolbar {
        align-items: stretch !important;
    }

    .schoolrunsweek-toolbar > * {
        min-width: 0 !important;
        width: 100% !important;
    }

    .schoolrunsweek-toolbar .mud-button-root,
    .schoolrunsweek-toolbar .mud-icon-button-root {
        min-width: 0 !important;
    }

    .schoolrunsweek-toolbar .mud-input-slot,
    .schoolrunsweek-toolbar .mud-input > input {
        font-size: clamp(0.92rem, 4vw, 1.05rem) !important;
    }

    .schoolrunsweek-day-card {
        padding: 0 !important;
        overflow: hidden !important;
        margin-bottom: var(--omni-mobile-space-6) !important;
    }

    .schoolrunsweek-day-header {
        padding: var(--omni-mobile-space-5) !important;
        background: rgba(255,255,255,0.026) !important;
        border-bottom: 0 !important;
    }

    .schoolrunsweek-slot,
    .schoolrunsweek-section {
        margin: var(--omni-mobile-space-4) !important;
        padding: var(--omni-mobile-space-4) !important;
    }

    .schoolrunsweek-slot-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        gap: var(--omni-mobile-space-3) !important;
    }

    .schoolrunsweek-slot-header .mud-button-root {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 40px !important;
        justify-content: center !important;
        padding-inline: 12px !important;
        font-size: 0.9rem !important;
    }

    .schoolrunsweek-slot-title,
    .schoolrunsweek-slot-label {
        letter-spacing: 0.12em !important;
        line-height: 1.18 !important;
    }

    .schoolrunsweek-assignment-card {
        padding: var(--omni-mobile-space-4) !important;
        display: grid !important;
        grid-template-columns: minmax(0,1fr) auto !important;
        gap: var(--omni-mobile-space-3) !important;
    }

    /* Notes: focused mobile workspace */
    .notes-toolbar,
    .notes-filter-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: var(--omni-mobile-space-3) !important;
    }

    .notes-editor-shell {
        padding: var(--omni-mobile-space-5) !important;
    }

    /* Today itinerary rail */
    .dayplan-list {
        position: relative !important;
        gap: 12px !important;
    }

    .dayplan-card-timeline {
        display: grid !important;
        grid-template-columns: 58px 22px minmax(0, 1fr) !important;
        gap: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .dayplan-card-timeline .dayplan-rail-time {
        align-self: start !important;
        padding-top: 16px !important;
        text-align: right !important;
        font-size: 0.72rem !important;
        font-weight: 850 !important;
        color: rgba(208,216,242,0.68) !important;
    }

    .dayplan-card-timeline .dayplan-rail-track {
        position: relative !important;
        width: 22px !important;
        min-width: 22px !important;
        background: transparent !important;
    }

    .dayplan-card-timeline .dayplan-rail-track::before,
    .dayplan-card-timeline .dayplan-rail-track::after {
        content: none !important;
        display: none !important;
    }

    .dayplan-card-timeline .dayplan-rail-dot {
        position: absolute !important;
        top: 20px !important;
        left: 50% !important;
        width: 7px !important;
        height: 7px !important;
        transform: translateX(-50%) !important;
        border-radius: 999px !important;
        background: rgba(165,178,238,0.84) !important;
        box-shadow: 0 0 0 4px rgba(117,132,200,0.12) !important;
    }

    .dayplan-card-timeline .dayplan-card-shell {
        min-width: 0 !important;
        border-radius: var(--omni-mobile-card-radius) !important;
        background: var(--omni-mobile-utility) !important;
        border: 1px solid rgba(255,255,255,0.062) !important;
        box-shadow: none !important;
    }

    .dayplan-card-timeline .dayplan-card-title {
        font-size: 0.98rem !important;
        letter-spacing: -0.012em !important;
    }

    /* Audit control rail */
    .audit-log-toolbar {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        align-items: stretch !important;
        padding: 12px !important;
        margin-bottom: 14px !important;
        border-radius: 18px !important;
        background: rgba(255,255,255,0.018) !important;
        border: 1px solid rgba(255,255,255,0.052) !important;
        box-shadow: none !important;
    }

    .audit-log-search .mud-input-adornment-start {
        width: 42px !important;
        min-width: 42px !important;
        border-left: 0 !important;
        border-right: 1px solid rgba(255,255,255,0.052) !important;
    }

    .audit-log-search .mud-input-slot,
    .audit-log-search input {
        padding-left: 10px !important;
    }

    /* Household roster cards */
    .kids-roster-card {
        gap: 14px !important;
        min-height: auto !important;
    }

    .kids-roster-heading,
    .settings-mobile-card-header {
        align-items: flex-start !important;
        gap: 12px !important;
    }

    .kids-roster-name {
        line-height: 1.08 !important;
        letter-spacing: -0.018em !important;
    }

    .kids-roster-status {
        opacity: 0.82 !important;
        flex: 0 0 auto !important;
    }

    .kids-roster-meta-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        margin-top: 12px !important;
    }

    .kids-roster-meta {
        padding: 10px 12px !important;
        border-radius: 12px !important;
        background: rgba(255,255,255,0.026) !important;
        border: 1px solid rgba(255,255,255,0.050) !important;
    }

    .kids-archive-action {
        opacity: 0.62 !important;
    }

    #blazor-error-ui {
        display: none !important;
    }
}
/* Ruthless mobile blueprint corrections: single-owner controls, itinerary rail, roster density. */
@media (max-width: 768px) {
    .dayplan-toolbar-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 12px !important;
        padding: 14px !important;
        margin: 22px 0 28px !important;
        border-radius: 22px !important;
        background: rgba(16, 19, 29, 0.82) !important;
        border: 1px solid rgba(170, 180, 218, 0.16) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 18px 40px rgba(0, 0, 0, 0.24) !important;
    }

    .dayplan-date-wrap,
    .dayplan-today-wrap,
    .dayplan-user-wrap {
        min-width: 0 !important;
    }

    .dayplan-user-wrap {
        grid-column: 1 / -1 !important;
    }

    .dayplan-toolbar-row .mud-input-label,
    .dayplan-toolbar-row .mud-input-label.mud-shrink,
    .dayplan-toolbar-row .mud-input-label.mud-input-label-animate {
        display: none !important;
    }

    .dayplan-date-picker .mud-input-slot input,
    .dayplan-date-picker input {
        font-size: 1.05rem !important;
        letter-spacing: 0 !important;
    }

    .dayplan-today-button {
        height: 48px !important;
        min-height: 48px !important;
        border-radius: 14px !important;
        padding: 0 18px !important;
        box-shadow: none !important;
    }

    .dayplan-section-title {
        margin-bottom: 16px !important;
    }

    .dayplan-card-timeline {
        position: relative !important;
        display: grid !important;
        grid-template-columns: 76px minmax(0, 1fr) !important;
        gap: 14px !important;
        align-items: stretch !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    .dayplan-card.dayplan-card-timeline,
    .dayplan-card-timeline.mud-paper {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .dayplan-card-timeline .dayplan-rail-time {
        grid-column: 1 !important;
        grid-row: 1 !important;
        padding-top: 18px !important;
        text-align: right !important;
        font-size: 0.82rem !important;
        line-height: 1.05 !important;
        letter-spacing: 0.01em !important;
        color: rgba(205, 211, 232, 0.64) !important;
    }

    .dayplan-card-timeline .dayplan-rail-track {
        grid-column: 2 !important;
        grid-row: 1 !important;
        position: absolute !important;
        left: 84px !important;
        top: 18px !important;
        bottom: -22px !important;
        width: 1px !important;
        min-width: 1px !important;
        background: linear-gradient(180deg, rgba(169, 180, 229, 0.32), rgba(169, 180, 229, 0.06)) !important;
        border: 0 !important;
        box-shadow: none !important;
        pointer-events: none !important;
    }

    .dayplan-card-timeline .dayplan-rail-track::before,
    .dayplan-card-timeline .dayplan-rail-track::after {
        content: none !important;
        display: none !important;
    }

    .dayplan-card-timeline .dayplan-rail-dot {
        position: absolute !important;
        left: 50% !important;
        top: 0 !important;
        width: 9px !important;
        height: 9px !important;
        transform: translate(-50%, 0) !important;
        border-radius: 999px !important;
        background: #aab5ee !important;
        box-shadow: 0 0 0 4px rgba(112, 125, 181, 0.13) !important;
    }

    .dayplan-card-timeline .dayplan-card-shell {
        grid-column: 2 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 18px !important;
        border-radius: 22px !important;
        background: linear-gradient(180deg, rgba(24, 28, 39, 0.98), rgba(14, 18, 27, 0.98)) !important;
        border: 1px solid rgba(170, 180, 218, 0.14) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 18px 36px rgba(0, 0, 0, 0.24) !important;
    }

    .dayplan-card-timeline .dayplan-card-title {
        max-width: 100% !important;
        font-size: clamp(1.12rem, 5vw, 1.42rem) !important;
        line-height: 1.12 !important;
        overflow-wrap: anywhere !important;
    }

    .shopping-ios-page .app-page-shell-header {
        margin-bottom: 12px !important;
        padding-bottom: 0 !important;
    }

    .shopping-ios-page .app-page-shell-toolbar {
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .shopping-ios-page .app-page-context-chip-row {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        opacity: 0.82 !important;
    }

    .shopping-ios-page .app-page-context-chip-label,
    .shopping-ios-page .app-page-context-chip-value {
        display: inline !important;
        width: auto !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        font-size: 0.78rem !important;
        letter-spacing: 0.12em !important;
        line-height: 1.25 !important;
    }

    .shopping-filter-card {
        margin-top: 0 !important;
        margin-bottom: 20px !important;
        padding: 16px !important;
        border-radius: 22px !important;
    }

    .shopping-filter-shell,
    .shopping-filter-header {
        gap: 12px !important;
        min-width: 0 !important;
    }

    .shopping-filter-chips {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 9px !important;
        overflow: visible !important;
        padding-bottom: 0 !important;
    }

    .shopping-filter-chips::-webkit-scrollbar {
        display: none !important;
    }

    .shopping-filter-chips .mud-chip {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .shopping-filter-chips .mud-chip-content {
        max-width: min(100%, 260px) !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .kids-roster-card {
        padding: 18px !important;
        border-radius: 22px !important;
        min-height: 0 !important;
    }

    .kids-roster-card .settings-mobile-card-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
        align-items: start !important;
    }

    .kids-roster-name {
        font-size: clamp(1.24rem, 6.1vw, 1.54rem) !important;
        line-height: 1.05 !important;
        letter-spacing: 0 !important;
        overflow-wrap: anywhere !important;
    }

    .kids-roster-status {
        justify-self: start !important;
        width: auto !important;
        opacity: 0.78 !important;
    }

    .kids-roster-card .settings-mobile-card-actions {
        width: 100% !important;
        justify-content: flex-end !important;
        gap: 10px !important;
        margin-top: 14px !important;
        padding-top: 12px !important;
        border-top: 1px solid rgba(170, 180, 218, 0.1) !important;
    }

    .kids-roster-card .settings-mobile-card-actions .mud-button-root {
        min-height: 38px !important;
        height: 38px !important;
        border-radius: 12px !important;
        padding: 0 14px !important;
        font-size: 0.88rem !important;
    }

    .notes-toolbar,
    .notes-command-select {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 !important;
    }

    .notes-command-select .mud-input-label,
    .notes-command-select .mud-input-label.mud-shrink,
    .notes-command-select .mud-input-label.mud-input-label-animate {
        display: none !important;
    }

    .notes-command-select .mud-input,
    .notes-command-select .mud-input-root {
        min-height: 48px !important;
        height: 48px !important;
        border-radius: 14px !important;
    }

    .notes-command-select .mud-input-slot,
    .notes-command-select .mud-select-input {
        height: 48px !important;
        min-height: 48px !important;
        padding: 0 14px !important;
        line-height: 48px !important;
    }
}

/* Migrated legacy mobile contract. Source retired: omnisant.mobile.contract.css. */
/*
  Omnisant mobile contract
  Loaded last. Mobile-only stabilization for shell clearance, form density,
  canonical control anatomy, and bottom-nav/modal safe areas.
*/

@media (max-width: 768px) {
    :root {
        --omni-mobile-topbar-h: 48px;
        --omni-mobile-householdbar-h: 0px;
        --omni-mobile-bottomnav-h: 50px;
        --omni-mobile-page-x: 16px;
        --omni-mobile-section-gap: 20px;
        --omni-mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
        --omni-mobile-content-w: 560px;
        --omni-mobile-field-h: 48px;
        --omni-mobile-field-radius: 14px;
        --omni-mobile-panel-radius: 20px;
        --omni-mobile-sheet-radius: 24px;
        --omni-mobile-modal-footer-h: 74px;
        --omni-mobile-border: rgba(180, 190, 226, 0.17);
        --omni-mobile-border-strong: rgba(194, 204, 242, 0.26);
        --omni-mobile-surface: rgba(17, 20, 29, 0.94);
        --omni-mobile-field-bg: rgba(7, 9, 15, 0.72);
        --omni-mobile-field-bg-focus: rgba(10, 13, 22, 0.86);
        --omni-mobile-text: rgba(245, 246, 252, 0.92);
        --omni-mobile-muted: rgba(191, 198, 219, 0.68);
    }

    html,
    body,
    .mud-layout {
        min-height: 100dvh !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    body {
        overscroll-behavior-x: none;
    }

    /* Shell geometry is owned by foundation/app.shell.css and foundation/app.mobile*.css. */

    .mud-drawer,
    .mud-drawer-content {
        max-width: 100vw !important;
    }

    .mud-popover {
        max-width: calc(100vw - 24px) !important;
        z-index: 1500 !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row,
    .dayplan-toolbar-row,
    .schoolrunsweek-toolbar {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .dayplan-page .dayplan-toolbar-row,
    .dayplan-toolbar-card .dayplan-toolbar-row,
    .dayplan-toolbar-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
            "date"
            "today"
            "user" !important;
        gap: 10px !important;
    }

    .dayplan-date-wrap,
    .dayplan-today-wrap,
    .dayplan-user-wrap {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .dayplan-date-wrap {
        grid-area: date !important;
        height: var(--omni-mobile-field-h) !important;
    }

    .dayplan-today-wrap {
        grid-area: today !important;
    }

    .dayplan-user-wrap {
        grid-area: user !important;
    }

    .dayplan-date-control {
        height: var(--omni-mobile-field-h) !important;
        min-height: var(--omni-mobile-field-h) !important;
    }

    .dayplan-today-button.mud-button-root {
        width: 100% !important;
        height: var(--omni-mobile-field-h) !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row {
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) 48px !important;
        grid-template-areas:
            "date date date"
            "prev today next" !important;
        gap: 10px !important;
        align-items: center !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-date-control,
    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-picker,
    .ios-calendar-page .ios-calendar-date-picker-shell {
        grid-area: date !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-nav-button:first-child {
        grid-area: prev !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-nav-button:nth-child(3) {
        grid-area: next !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-today-button {
        grid-area: today !important;
        width: 100% !important;
        height: var(--omni-mobile-field-h) !important;
    }

    .ios-calendar-page .ios-calendar-nav-button {
        width: 48px !important;
        min-width: 48px !important;
        height: var(--omni-mobile-field-h) !important;
        border-radius: 14px !important;
    }

    .ios-calendar-page .ios-calendar-user-picker,
    .dayplan-user-picker {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .ios-calendar-page .ios-calendar-mode-tabs {
        width: 100% !important;
        max-width: 100% !important;
    }

    .shopping-item-row {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
        padding: 16px !important;
    }

    .shopping-item-main {
        min-width: 0 !important;
    }

    .shopping-item-name,
    .shopping-item-title {
        max-width: 100% !important;
        overflow: visible !important;
        text-overflow: clip !important;
        white-space: normal !important;
        line-height: 1.24 !important;
    }

    .shopping-item-actions {
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 10px !important;
    }

    .shopping-item-bought-button.mud-button-root {
        min-height: 38px !important;
        height: 38px !important;
        flex: 1 1 auto !important;
        border-radius: 12px !important;
    }

    .shopping-item-actions .mud-icon-button-root,
    .shopping-item-actions .mud-menu-button-root {
        width: 38px !important;
        min-width: 38px !important;
        height: 38px !important;
        border-radius: 12px !important;
    }

    .maintenance-quick-filter-bar,
    .maintenance-quick-filter-chips {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .maintenance-quick-filter-bar::-webkit-scrollbar,
    .maintenance-quick-filter-chips::-webkit-scrollbar {
        display: none;
    }

    .maintenance-quick-filter-chips .mud-chip {
        flex: 0 0 auto !important;
    }

    .notes-editor-shell,
    .notes-editor-pane.notes-editor-canvas,
    .notes-editor-card {
        min-height: min(520px, calc(100dvh - 160px)) !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }

    .notes-editor-pane.notes-editor-canvas {
        padding-bottom: calc(var(--omni-mobile-safe-bottom) + 28px) !important;
    }

    .notes-editor-toolbar {
        min-height: 52px !important;
        gap: 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
    }

    .mud-button-root {
        max-width: 100%;
    }

    .mud-button-root.mud-button-filled,
    .mud-button-root.mud-button-outlined,
    .mud-button-root.mud-button-text {
        border-radius: 13px !important;
    }

    /* Final mobile-safe control contract: no field may escape its card, and
       MudBlazor select text/adornments keep a single owner for width. */
    .mud-card,
    .mud-paper,
    .ios-contact-card {
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
            "item"
            "actions" !important;
        min-height: auto !important;
        padding-top: 13px !important;
        padding-bottom: 13px !important;
        gap: 12px !important;
        align-items: stretch !important;
    }

    .shopping-item-main {
        grid-area: item !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .shopping-item-name,
    .shopping-item-title {
        width: 100% !important;
        max-width: 100% !important;
        white-space: normal !important;
        overflow: visible !important;
        text-overflow: clip !important;
    }

    .shopping-item-actions {
        grid-area: actions !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
    }

    .shopping-item-primary-action {
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    .shopping-item-bought-button.mud-button-root {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 132px !important;
        height: 36px !important;
        min-height: 36px !important;
    }

    .ios-contacts-page .network-contact-card,
    .ios-contacts-page .network-contact-card.ios-contact-row {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        grid-template-areas:
            "avatar body"
            "actions actions" !important;
        row-gap: 10px !important;
        align-items: start !important;
    }

    .ios-contacts-page .network-contact-card .ios-contact-actions {
        width: 100% !important;
        justify-content: flex-end !important;
        flex-direction: row !important;
        gap: 7px !important;
    }

    .ios-contacts-page .network-contact-card .ios-contact-actions .mud-icon-button,
    .ios-contacts-page .network-contact-card .ios-contact-actions .mud-menu-button-root {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
    }
}

@media (min-width: 430px) and (max-width: 768px) {
    .ios-calendar-page .ios-calendar-date-nav-row {
        grid-template-columns: 48px minmax(180px, 1fr) 48px auto !important;
        grid-template-areas: "prev date next today" !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-today-button {
        width: auto !important;
        min-width: 86px !important;
    }
}


/* Migrated legacy mobile repair composition. Source retired: omnisant.mobile.repair.css. */
/* OMNISANT mobile repair pass.
   Loaded last to make 360-430px layouts sharp, readable, and operational. */

@media (max-width: 767px) {
    :root {
        --omni-mobile-page-x: 18px;
        --omni-mobile-card-radius: 18px;
        --omni-mobile-card-pad: 14px;
        --omni-mobile-field-h: 50px;
        --omni-mobile-chip-height: 30px;
        --omni-mobile-border: rgba(255, 255, 255, 0.075);
        --omni-mobile-surface: linear-gradient(180deg, rgba(22, 26, 36, 0.94), rgba(11, 14, 21, 0.92));
        --omni-mobile-surface-soft: rgba(17, 21, 30, 0.82);
    }

    html,
    body,
    .mud-layout {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    /* Shell geometry is owned by foundation/app.shell.css and foundation/app.mobile*.css. */

    .mud-button-root {
        min-height: 42px !important;
        height: auto !important;
        padding-inline: 14px !important;
        font-size: 0.9rem !important;
    }

    .mud-icon-button,
    .mud-menu-button-root {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
    }

    /* Daily operations timeline: prevent one-letter vertical title wraps. */
    .dayplan-toolbar-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        grid-template-areas:
            "date today"
            "user user" !important;
        gap: 10px !important;
        align-items: center !important;
        padding: 10px !important;
        border-radius: 18px !important;
        background: rgba(17, 21, 30, 0.76) !important;
        border: 1px solid rgba(255, 255, 255, 0.06) !important;
    }

    .dayplan-date-wrap {
        grid-area: date !important;
        min-width: 0 !important;
    }

    .dayplan-today-wrap {
        grid-area: today !important;
    }

    .dayplan-user-wrap {
        grid-area: user !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .dayplan-date-picker,
    .dayplan-user-picker {
        width: 100% !important;
    }

    .dayplan-section {
        margin-top: 20px !important;
    }

    .dayplan-section-title {
        margin-bottom: 10px !important;
        font-size: 1.15rem !important;
        letter-spacing: -0.02em !important;
    }

    .dayplan-list {
        display: grid !important;
        gap: 12px !important;
    }

    .dayplan-card-timeline {
        display: grid !important;
        grid-template-columns: 54px minmax(0, 1fr) !important;
        grid-template-areas: "time body" !important;
        gap: 10px !important;
        min-width: 0 !important;
        padding: 12px !important;
    }

    .dayplan-card-timeline .dayplan-rail-time {
        grid-area: time !important;
        width: 54px !important;
        min-width: 54px !important;
        font-size: 0.9rem !important;
        line-height: 1.1 !important;
        text-align: left !important;
    }

    .dayplan-card-timeline .dayplan-rail-track {
        display: none !important;
    }

    .dayplan-card-shell {
        grid-area: body !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    .dayplan-card-main,
    .dayplan-card-title,
    .dayplan-card-meta,
    .dayplan-card-notes {
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .dayplan-card-title {
        display: block !important;
        width: 100% !important;
        white-space: normal !important;
        font-size: 1.08rem !important;
        line-height: 1.18 !important;
        letter-spacing: -0.02em !important;
    }

    .dayplan-card-kicker {
        font-size: 0.62rem !important;
        letter-spacing: 0.14em !important;
        margin-bottom: 4px !important;
    }

    .dayplan-status-row,
    .dayplan-chip-row {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        min-width: 0 !important;
    }

    .dayplan-card-actions {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 10px !important;
        min-width: 0 !important;
    }

    .dayplan-primary-action {
        min-height: 38px !important;
        height: 38px !important;
        padding-inline: 14px !important;
    }

    .dayplan-empty-card {
        min-height: 92px !important;
        padding: 18px !important;
        display: grid !important;
        place-items: center !important;
        text-align: center !important;
    }

    /* Schedule mobile control system. */
    .ios-calendar-page .ios-calendar-header {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        align-items: start !important;
    }

    .ios-calendar-page .ios-calendar-toolbar {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-areas:
            "date"
            "user"
            "mode" !important;
        gap: 10px !important;
        padding: 10px !important;
        border-radius: 18px !important;
        background: rgba(17, 21, 30, 0.76) !important;
        border: 1px solid rgba(255, 255, 255, 0.06) !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) 40px auto !important;
        gap: 8px !important;
        min-width: 0 !important;
    }

    .ios-calendar-page .ios-calendar-date-control,
    .ios-calendar-page .ios-calendar-user-picker {
        min-width: 0 !important;
        width: 100% !important;
    }

    .ios-calendar-page .ios-calendar-date-control .mud-input-root,
    .ios-calendar-page .ios-calendar-user-picker .mud-input-root {
        height: 48px !important;
        min-height: 48px !important;
    }

    .ios-calendar-page .ios-calendar-nav-button {
        width: 40px !important;
        height: 48px !important;
        min-width: 40px !important;
    }

    .ios-calendar-page .ios-calendar-today-button {
        height: 48px !important;
        min-height: 48px !important;
        padding-inline: 12px !important;
        min-width: 70px !important;
    }

    .ios-calendar-page .ios-calendar-viewing-row {
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
    }

    .ios-calendar-page .ios-calendar-mode-row {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .ios-calendar-page .ios-calendar-view-switch {
        width: 100% !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    .ios-calendar-page .ios-calendar-view-button {
        height: 36px !important;
        min-height: 36px !important;
        font-size: 0.86rem !important;
    }

    .ios-calendar-page .ios-calendar-generate-button {
        width: 100% !important;
        height: 42px !important;
        min-height: 42px !important;
    }

    .ios-day-view {
        margin-top: 12px !important;
    }

    .ios-calendar-empty {
        min-height: 116px !important;
        padding: 18px !important;
    }

    .ios-week-mobile-strip {
        display: grid !important;
        grid-template-columns: repeat(7, minmax(42px, 1fr)) !important;
        gap: 6px !important;
        overflow: visible !important;
    }

    .ios-week-mobile-day {
        min-width: 0 !important;
        height: 56px !important;
        border-radius: 14px !important;
        padding: 6px 4px !important;
    }

    .ios-week-mobile-agenda {
        margin-top: 12px !important;
    }

    .ios-week-mobile-card {
        display: grid !important;
        grid-template-columns: 58px minmax(0, 1fr) !important;
        gap: 10px !important;
        padding: 12px !important;
    }

    .ios-month-view-desktop {
        display: block !important;
    }

    .ios-month-mobile-list {
        display: grid !important;
        margin-top: 12px !important;
        gap: 10px !important;
    }

    .ios-month-weekdays {
        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        gap: 4px !important;
        margin-bottom: 6px !important;
    }

    .ios-month-weekday {
        font-size: 0.64rem !important;
        letter-spacing: 0.08em !important;
        text-align: center !important;
    }

    .ios-month-grid {
        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        gap: 4px !important;
    }

    .ios-month-cell {
        min-height: 48px !important;
        height: 48px !important;
        padding: 5px !important;
        border-radius: 10px !important;
        overflow: hidden !important;
    }

    .ios-month-cell-number {
        font-size: 0.78rem !important;
        line-height: 1 !important;
    }

    .ios-month-cell-events {
        display: flex !important;
        gap: 3px !important;
        margin-top: 5px !important;
        overflow: hidden !important;
    }

    .ios-month-event-pill {
        width: 5px !important;
        height: 5px !important;
        min-width: 5px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        color: transparent !important;
        overflow: hidden !important;
    }

    .ios-month-more {
        display: none !important;
    }

    .ios-month-mobile-card {
        padding: 12px !important;
    }

    .ios-month-mobile-event {
        display: grid !important;
        grid-template-columns: 54px minmax(0, 1fr) !important;
        gap: 8px !important;
        min-width: 0 !important;
        width: 100% !important;
    }

    .ios-month-mobile-event-title {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* Directory mobile. */
    .ios-contacts-page .network-filter-bar {
        padding: 6px !important;
        gap: 6px !important;
    }

    .ios-contacts-page .network-contact-card {
        grid-template-columns: 42px minmax(0, 1fr) auto !important;
        min-height: 94px !important;
    }

    .ios-contacts-page .network-contact-card .ios-contact-actions {
        flex-direction: row !important;
        align-self: start !important;
    }

    .ios-contacts-page .network-contact-card .ios-contact-actions .mud-icon-button,
    .ios-contacts-page .network-contact-card .ios-contact-actions .mud-menu-button-root {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
    }

    .ios-contacts-page .network-contact-card .ios-contact-name {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* Service mobile. */
    .maintenance-page .app-page-shell-header {
        gap: 12px !important;
    }

    .maintenance-quick-filter-bar {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        padding: 8px !important;
        border-radius: 18px !important;
    }

    .maintenance-quick-filter-chips {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 7px !important;
        overflow-x: auto !important;
        padding-bottom: 2px !important;
        scrollbar-width: none !important;
    }

    .maintenance-quick-filter-chips::-webkit-scrollbar {
        display: none !important;
    }

    .maintenance-quick-filter-chips .mud-chip,
    .maintenance-quick-filter-actions .mud-button-root {
        flex: 0 0 auto !important;
        height: 36px !important;
        min-height: 36px !important;
        white-space: nowrap !important;
    }

    .maintenance-quick-filter-actions {
        justify-content: flex-start !important;
    }

    .maintenance-section-card {
        min-height: 88px !important;
    }

    /* Weekly planning. */
    .schoolrunsweek-toolbar {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        padding: 8px !important;
        border-radius: 18px !important;
    }

    .schoolrunsweek-nav-wrap {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) 42px !important;
        gap: 7px !important;
    }

    .schoolrunsweek-date-wrap,
    .schoolrunsweek-date-picker {
        width: 100% !important;
        min-width: 0 !important;
    }

    .schoolrunsweek-days {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        overflow: visible !important;
    }

    .schoolrunsweek-day-card {
        min-width: 0 !important;
        min-height: 0 !important;
        padding: 0 !important;
    }

    .schoolrunsweek-day-header {
        padding: 12px 14px !important;
    }

    .schoolrunsweek-slot-content {
        padding: 12px !important;
    }

    .schoolrunsweek-slot-title {
        font-size: 0.72rem !important;
        letter-spacing: 0.12em !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        min-height: 32px !important;
        height: 32px !important;
        padding-inline: 10px !important;
        font-size: 0.78rem !important;
    }

    .schoolrunsweek-assignment-grid {
        grid-template-columns: 32px minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px !important;
    }

    .schoolrunsweek-assignment-name {
        white-space: normal !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
        line-height: 1.18 !important;
    }

    .schoolrunsweek-chip-row {
        flex-wrap: wrap !important;
        gap: 5px !important;
    }

    .schoolrunsweek-delete-button.mud-icon-button,
    .schoolrunsweek-inline-edit.mud-icon-button {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        min-height: 30px !important;
    }

    .schoolrunsweek-delete-button.mud-icon-button {
        color: rgba(231, 116, 116, 0.7) !important;
    }

    /* Notepad. */
    .notes-command-bar {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 10px !important;
        border-radius: 18px !important;
    }

    .notes-command-left {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
    }

    .notes-command-select .mud-input,
    .notes-command-chip {
        height: 48px !important;
        min-height: 48px !important;
    }

    .notes-command-right {
        justify-content: flex-start !important;
        gap: 8px !important;
    }

    .notes-command-right .mud-icon-button {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
    }

    .notes-briefing-card {
        min-height: 0 !important;
        padding: 14px !important;
    }

    .notes-writing-surface,
    .notes-body-input textarea,
    .notes-body-input {
        min-height: 260px !important;
        height: clamp(260px, 43dvh, 500px) !important;
    }

    .notes-briefing-footer {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .notes-briefing-actions {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
    }

    /* Shopping. */
    .shopping-page-header {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .shopping-filter-card {
        padding: 10px !important;
    }

    .shopping-filter-chips {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 7px !important;
        overflow-x: auto !important;
        padding-bottom: 2px !important;
        scrollbar-width: none !important;
    }

    .shopping-filter-chips::-webkit-scrollbar {
        display: none !important;
    }

    .shopping-filter-chips .mud-chip {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    .shopping-section-card {
        padding: 14px !important;
    }

    .shopping-store-header {
        margin-top: 14px !important;
        margin-bottom: 8px !important;
    }

    .shopping-item-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 10px !important;
        align-items: center !important;
        padding: 12px !important;
    }

    .shopping-item-title,
    .shopping-item-name {
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .shopping-item-actions {
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
    }

    .shopping-item-bought-button {
        min-height: 36px !important;
        height: 36px !important;
        padding-inline: 12px !important;
        font-size: 0.82rem !important;
    }

    .shopping-item-actions .mud-icon-button,
    .shopping-item-actions .mud-menu-button-root {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        min-height: 36px !important;
    }

    /* Generic setup/admin cards. */
    .house-card,
    .kids-card,
    .store-card,
    .location-card,
    .vehicle-card,
    .user-card,
    .settings-mobile-card {
        min-height: 0 !important;
        padding: 14px !important;
    }

    .house-actions,
    .kids-card-actions,
    .store-card-actions,
    .location-card-actions,
    .vehicle-card-actions,
    .user-card-actions {
        justify-content: flex-start !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .settings-filter-chips,
    .stores-filter-chips {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        scrollbar-width: none !important;
    }
}

@media (max-width: 380px) {
    :root {
        --omni-mobile-page-x: 14px;
    }

    .dayplan-card-timeline {
        grid-template-columns: 48px minmax(0, 1fr) !important;
    }

    .dayplan-card-timeline .dayplan-rail-time {
        width: 48px !important;
        min-width: 48px !important;
        font-size: 0.82rem !important;
    }
}

/* ==========================================================================
   OMNISANT mobile native surface
   Phones and compact tablets are their own product surface, not compressed
   desktop. Keep this block after the repair rules so it wins at <=768px.
   ========================================================================== */

@media (max-width: 768px) {
    :root {
        --omni-mobile-page-x: 16px;
        --omni-mobile-topbar-h: 58px;
        --omni-mobile-safe-bottom: max(env(safe-area-inset-bottom), 12px);
        --omni-mobile-card-radius: 16px;
        --omni-mobile-card-pad: 14px;
        --omni-mobile-control-h: 46px;
        --omni-mobile-compact-control-h: 40px;
        --omni-mobile-sheet-radius: 22px;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box;
    }

    html,
    body {
        width: 100% !important;
        max-width: 100vw !important;
        overflow-x: hidden !important;
        background: #05070d !important;
    }

    body {
        overscroll-behavior-x: none;
    }

    .mud-layout {
        width: 100% !important;
        max-width: 100vw !important;
        min-width: 0 !important;
        overflow-x: clip !important;
    }

    /* Shell geometry is owned by foundation/app.shell.css and foundation/app.mobile*.css. */

    .app-drawer .mud-navmenu {
        display: grid !important;
        gap: 6px !important;
        max-width: 430px !important;
        margin-inline: auto !important;
    }

    .app-drawer .mud-nav-link,
    .app-drawer .mud-nav-group .mud-nav-link,
    .app-drawer .mud-nav-group .mud-nav-group-button {
        min-height: 48px !important;
        border-radius: 16px !important;
        padding-inline: 16px !important;
        font-size: 0.98rem !important;
    }

    .app-nav-section {
        margin: 14px 10px 6px !important;
        font-size: 0.66rem !important;
        letter-spacing: 0.17em !important;
    }

    /* Touch controls and forms. */
    .mud-button-root {
        min-height: 44px !important;
        border-radius: 14px !important;
        padding-inline: 14px !important;
        white-space: nowrap !important;
    }

    .mud-icon-button,
    .mud-menu-button-root {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        border-radius: 13px !important;
    }

    /* Schedule: use native mobile views, not desktop grids. */
    .ios-calendar-page .ios-calendar-toolbar {
        grid-template-columns: 1fr !important;
        grid-template-areas: "date" "user" "mode" !important;
        gap: 9px !important;
        padding: 10px !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row {
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
        grid-template-areas:
            "prev date next"
            "today today today" !important;
        gap: 8px !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-nav-button:first-of-type {
        grid-area: prev !important;
    }

    .ios-calendar-page .ios-calendar-date-control {
        grid-area: date !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-nav-button:last-of-type {
        grid-area: next !important;
    }

    .ios-calendar-page .ios-calendar-today-button {
        grid-area: today !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 40px !important;
        min-height: 40px !important;
    }

    .ios-calendar-page .ios-calendar-mode-row {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
    }

    .ios-calendar-page .ios-calendar-view-switch {
        width: 100% !important;
        max-width: 100% !important;
    }

    .ios-calendar-page .ios-week-view-desktop {
        display: none !important;
    }

    .ios-calendar-page .ios-week-view-mobile {
        display: grid !important;
        gap: 12px !important;
    }

    .ios-week-mobile-strip {
        display: flex !important;
        gap: 8px !important;
        overflow-x: auto !important;
        padding-bottom: 4px !important;
        scrollbar-width: none !important;
    }

    .ios-week-mobile-strip::-webkit-scrollbar {
        display: none !important;
    }

    .ios-week-mobile-day {
        flex: 0 0 52px !important;
        min-width: 52px !important;
    }

    .ios-calendar-page .ios-month-view-desktop {
        display: grid !important;
        gap: 6px !important;
    }

    .ios-calendar-page .ios-month-mobile-list {
        display: grid !important;
        gap: 10px !important;
    }

    .ios-month-weekdays,
    .ios-month-grid {
        width: 100% !important;
        max-width: 100% !important;
        gap: 4px !important;
    }

    .ios-month-cell {
        min-height: 44px !important;
        height: 44px !important;
        padding: 5px !important;
        border-radius: 10px !important;
    }

    .ios-month-event-pill {
        width: 5px !important;
        min-width: 5px !important;
        height: 5px !important;
        color: transparent !important;
        padding: 0 !important;
        border-radius: 999px !important;
    }

    /* Transport: vertical day cards. */
    .schoolrunsweek-toolbar {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        margin-bottom: 12px !important;
    }

    .schoolrunsweek-days {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
        width: 100% !important;
    }

    .schoolrunsweek-slot-stack {
        display: grid !important;
        grid-template-columns: 1fr !important;
        grid-template-rows: auto auto !important;
    }

    .schoolrunsweek-slot-content {
        min-height: 0 !important;
        padding: 12px !important;
    }

    .schoolrunsweek-assignment-grid {
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 8px !important;
        padding: 10px !important;
    }

    .schoolrunsweek-assignment-actions {
        min-width: max-content !important;
        justify-content: flex-end !important;
    }

    /* Shopping/store sections and horizontal chips. */
    .shopping-filter-chips,
    .maintenance-quick-filter-chips,
    .network-filter-bar,
    .settings-filter-chips,
    .stores-filter-chips {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 7px !important;
        padding-bottom: 4px !important;
        scrollbar-width: none !important;
    }

    .shopping-filter-chips::-webkit-scrollbar,
    .maintenance-quick-filter-chips::-webkit-scrollbar,
    .network-filter-bar::-webkit-scrollbar,
    .settings-filter-chips::-webkit-scrollbar,
    .stores-filter-chips::-webkit-scrollbar {
        display: none !important;
    }

    .shopping-filter-chips .mud-chip,
    .maintenance-quick-filter-chips .mud-chip,
    .network-filter-bar .mud-chip {
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    .shopping-item-row {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }

    .shopping-item-actions {
        justify-content: flex-end !important;
    }

    /* Identity/list cards. */
    .network-contact-card {
        grid-template-columns: 42px minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .network-contact-card .ios-contact-actions,
    .house-actions,
    .kids-card-actions,
    .store-card-actions,
    .location-card-actions,
    .vehicle-card-actions,
    .user-card-actions {
        grid-column: 1 / -1 !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        margin-top: 8px !important;
    }

    .ios-contact-name,
    .shopping-item-title,
    .shopping-item-name,
    .vehicle-card-title,
    .location-card-title,
    .store-card-title,
    .user-card-name,
    .kids-card-name {
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }
}

@media (min-width: 769px) {
    .ios-calendar-page .ios-week-view-mobile {
        display: none !important;
    }

    .ios-calendar-page .ios-month-mobile-list {
        display: none !important;
    }
}
/* ========================================================================== 
   Migrated mobile containment and compatibility rules
   Source retired: app.mobile-hardening.css. Keep this at the end of app.mobile.css
   so the mobile contract wins over broad desktop compatibility selectors.
   ========================================================================== */
/*
 * Mobile hardening layer.
 * -----------------------
 * Loaded last and scoped to mobile so the phone experience has one final
 * contract for width, chrome clearance, controls, modals, cards, and dense
 * operational pages.
 */

@media (max-width: 768px) {
    :root {
        --omni-mobile-topbar-h: 48px;
        --omni-mobile-householdbar-h: 0px;
        --omni-mobile-bottomnav-h: 50px;
        --omni-mobile-page-x: clamp(10px, 3vw, 14px);
        --omni-mobile-section-gap: 12px;
        --omni-mobile-card-gap: 10px;
        --omni-mobile-card-pad: 12px;
        --omni-mobile-toolbar-gap: 8px;
        --omni-mobile-control-h: 42px;
        --omni-mobile-control-radius: 13px;
        --omni-mobile-shell-bottom-clearance: calc(var(--omni-mobile-bottomnav-h) + env(safe-area-inset-bottom, 0px) + 24px);
        --app-label-size: 0.66rem;
        --app-label-tracking: 0.075em;
        --app-control-h-mobile: var(--omni-mobile-control-h);
        --app-control-icon-w: 46px;
        --app-control-pad-x: 12px;
        --app-control-radius: var(--omni-mobile-control-radius);
    }

    html,
    body,
    #app,
    .mud-layout {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden !important;
        overscroll-behavior-x: none;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box;
        min-width: 0;
    }

    img,
    svg,
    canvas,
    video,
    table,
    form,
    fieldset {
        max-width: 100%;
    }

    .mud-layout .mud-main-content.app-main-content,
    html body .mud-layout > .mud-main-content.app-main-content {
        width: 100% !important;
        max-width: 100vw !important;
        margin: 0 !important;
        padding: calc(var(--omni-mobile-topbar-h) + var(--omni-mobile-householdbar-h) + env(safe-area-inset-top, 0px) + 12px)
                 var(--omni-mobile-page-x)
                 var(--omni-mobile-shell-bottom-clearance) !important;
        overflow-x: clip !important;
        scroll-padding-bottom: var(--omni-mobile-shell-bottom-clearance);
    }

    .app-content-canvas,
    .app-content-canvas > *,
    .app-page,
    .page-shell,
    .app-page-shell,
    .app-page-shell-body,
    .content-wide,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .shopping-page,
    .procurement-page,
    .directory-page,
    .contacts-page,
    .ios-contacts-page,
    .maintenance-page,
    .notes-page,
    .transport-page,
    .schoolrunsweek-page,
    .household-profile-page,
    .profile-page,
    .settings-page,
    .preferences-page {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
        padding-inline: 0 !important;
        overflow-x: clip !important;
    }

    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .directory-page,
    .maintenance-page,
    .notes-page,
    .schoolrunsweek-page,
    .household-profile-page {
        display: grid;
        gap: var(--omni-mobile-section-gap);
        padding-bottom: 14px !important;
    }

    html body .mud-layout .app-topbar.mud-appbar,
    html body .mud-layout .app-topbar.mud-appbar.mud-appbar-dense,
    html body .mud-layout .app-topbar.mud-appbar.mud-appbar-fixed-top {
        --omni-mobile-topbar-h: 48px !important;
        min-height: 48px !important;
        height: 48px !important;
        max-height: 48px !important;
        padding-inline: var(--omni-mobile-page-x) !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.075);
        background: rgba(5, 7, 12, 0.94) !important;
        backdrop-filter: blur(18px);
    }

    html body .mud-layout .app-topbar .mud-toolbar,
    html body .mud-layout .app-topbar .mud-toolbar.mud-toolbar-dense,
    html body .mud-layout .app-topbar .mud-toolbar.mud-toolbar-appbar {
        --omni-mobile-topbar-h: 48px !important;
        min-height: 48px !important;
        height: 48px !important;
        max-height: 48px !important;
        position: relative !important;
        align-items: center !important;
        padding: 0 var(--omni-mobile-page-x) !important;
        gap: 8px;
    }

    html body .mud-layout .app-topbar-left,
    html body .mud-layout .app-topbar-actions {
        display: flex !important;
        align-items: center !important;
        --omni-mobile-topbar-h: 48px !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        min-width: 0;
        gap: 8px;
    }

    html body .mud-layout .app-topbar-actions {
        position: absolute !important;
        right: var(--omni-mobile-page-x) !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 2 !important;
    }

    html body .mud-layout .app-topbar-logo,
    html body .mud-layout .app-topbar-logo[role="img"] {
        position: absolute !important;
        left: 50% !important;
        top: 50% !important;
        transform: translate(-50%, -50%) !important;
        font-size: clamp(0.88rem, 4vw, 1.02rem) !important;
        letter-spacing: 0.28em !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    html body .mud-layout .app-topbar-menu.mud-icon-button,
    html body .mud-layout .app-topbar-add-trigger.mud-icon-button-root,
    html body .mud-layout .app-topbar .mud-icon-button {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 12px !important;
    }

    .app-topbar-context-chip {
        position: fixed !important;
        top: calc(var(--omni-mobile-topbar-h) + 4px) !important;
        left: 50% !important;
        z-index: 1150 !important;
        transform: translateX(-50%) !important;
        max-width: calc(100vw - 44px) !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 12px !important;
        border-radius: 999px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .app-drawer.mud-drawer,
    .mud-drawer.app-drawer {
        top: 0 !important;
        bottom: 0 !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        width: min(88vw, 330px) !important;
        padding: max(6px, env(safe-area-inset-top, 0px)) 10px calc(12px + env(safe-area-inset-bottom, 0px)) !important;
        background: rgba(5, 7, 12, 0.98) !important;
        overflow-y: auto !important;
    }

    .app-drawer-mobile-header {
        min-height: 38px !important;
        padding: 0 0 8px !important;
        margin: 0 0 6px !important;
        align-items: center !important;
    }

    .app-drawer .mud-navmenu {
        padding-top: 0 !important;
    }

    .app-topbar-context-chip span {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    html body .mud-layout .mobile-bottom-nav,
    html body nav.mobile-bottom-nav {
        --omni-mobile-bottomnav-h: 50px !important;
        position: fixed !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: center !important;
        gap: 4px !important;
        left: 50% !important;
        right: auto !important;
        bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
        z-index: 1200 !important;
        width: min(calc(100vw - 22px), 396px) !important;
        max-width: calc(100vw - 22px) !important;
        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;
        padding: 4px !important;
        transform: translateX(-50%) !important;
        border-radius: 18px !important;
        background: rgba(7, 9, 14, 0.94) !important;
        border: 1px solid rgba(198, 210, 255, 0.10) !important;
        box-shadow: 0 14px 34px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
        backdrop-filter: blur(18px);
    }

    .mobile-bottom-nav-item {
        min-width: 0 !important;
        min-height: 40px !important;
        height: 40px !important;
        max-height: 40px !important;
        border-radius: 13px !important;
        padding: 3px 5px !important;
        gap: 1px !important;
        font-size: 0.61rem !important;
        line-height: 1 !important;
    }

    .mobile-bottom-nav-item .mud-icon-root {
        width: 18px !important;
        height: 18px !important;
    }

    .app-page-header,
    .app-page-shell-header,
    .ios-calendar-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header,
    .profile-hero,
    .profile-command-rail,
    .profile-category-rail,
    .shopping-toolbar,
    .notes-toolbar,
    .directory-toolbar,
    .maintenance-toolbar,
    .schoolrunsweek-toolbar,
    .ios-calendar-toolbar,
    .dayplan-toolbar-row {
        width: 100% !important;
        max-width: 100% !important;
        margin-inline: 0 !important;
    }

    .app-page-header,
    .app-page-shell-header,
    .ios-calendar-header,
    .dayplan-page-header,
    .schoolrunsweek-header {
        display: grid !important;
        gap: 8px !important;
        margin-bottom: 4px !important;
        padding: 0 !important;
    }

    .app-page-eyebrow,
    .app-page-shell-kicker,
    .page-kicker,
    .profile-card-kicker,
    .profile-panel-kicker {
        font-size: 0.64rem !important;
        letter-spacing: 0.105em !important;
        line-height: 1.1 !important;
    }

    .app-page-title,
    .app-page-shell-title,
    .page-title,
    .ios-calendar-month-label {
        font-size: clamp(1.72rem, 8.4vw, 2.12rem) !important;
        line-height: 1.05 !important;
        letter-spacing: 0 !important;
    }

    .app-page-subtitle,
    .app-page-shell-subtitle,
    .page-subtitle,
    .ios-calendar-date-label {
        margin-top: 4px !important;
        font-size: 0.91rem !important;
        line-height: 1.36 !important;
    }

    .app-section,
    .profile-section,
    .maintenance-section,
    .shopping-section,
    .notes-section {
        gap: 10px !important;
    }

    .app-section + .app-section,
    .profile-section + .profile-section {
        margin-top: 18px !important;
    }

    .app-card,
    .lux-card,
    .mobile-card,
    .omni-operational-card,
    .omni-surface-card,
    .profile-memory-card,
    .profile-panel,
    .profile-attention-card,
    .shopping-store-group,
    .shopping-section-card,
    .maintenance-section-card,
    .maintenance-group-card,
    .directory-card,
    .contact-card,
    .ios-day-event-card,
    .ios-week-mobile-card,
    .ios-month-mobile-card,
    .schoolrunsweek-day-card,
    .schoolrunsweek-slot-card,
    .notes-editor-shell,
    .notes-list-card {
        max-width: 100% !important;
        border-radius: 18px !important;
        border-color: rgba(198, 210, 255, 0.105) !important;
        padding: var(--omni-mobile-card-pad) !important;
    }

    .app-empty-state-card,
    .ios-calendar-empty,
    .profile-inline-empty,
    .schoolrunsweek-empty,
    .empty-state {
        min-height: 0 !important;
        padding: 14px !important;
        border-radius: 16px !important;
        text-align: left !important;
    }

    .app-empty-title,
    .empty-title {
        font-size: 0.94rem !important;
        line-height: 1.15 !important;
    }

    .app-empty-copy,
    .empty-copy {
        font-size: 0.82rem !important;
        line-height: 1.35 !important;
    }

    .mud-button-root,
    .app-button,
    .omni-primary-command,
    .omni-secondary-command,
    .omni-quiet-action,
    .omni-execution-action {
        min-height: 42px !important;
        border-radius: 13px !important;
        padding-inline: 13px !important;
        font-size: 0.86rem !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .mud-icon-button,
    .mud-icon-button-root,
    .omni-icon-utility,
    .app-icon-button {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
        border-radius: 13px !important;
        padding: 0 !important;
    }

    .mud-chip,
    .mud-chip-root,
    .profile-pill,
    .shopping-chip,
    .schoolrunsweek-chip,
    .status-chip,
    .app-chip {
        max-width: 100%;
        min-height: 24px !important;
        height: auto !important;
        padding: 4px 8px !important;
        border-radius: 999px !important;
        font-size: 0.72rem !important;
        line-height: 1.08 !important;
    }

    .mud-input-control,
    .mud-select,
    .mud-picker,
    .mud-input,
    .mud-field,
    .mud-input-control-input-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body .mud-input-control:has(.mud-input-label) > .mud-input-control-input-container {
        min-height: calc(var(--omni-mobile-control-h) + 20px) !important;
        padding-top: 20px !important;
    }

    html body .mud-input-control .mud-input-label,
    html body .mud-input-control .mud-input-label.mud-shrink,
    html body .mud-input-control .mud-input-label.mud-input-label-animate {
        height: 13px !important;
        line-height: 13px !important;
        font-size: var(--app-label-size) !important;
        letter-spacing: var(--app-label-tracking) !important;
    }

    html body .mud-input-control .mud-input.mud-input-outlined,
    html body .mud-input-control .mud-input.mud-input-outlined.mud-select-input,
    html body .mud-input-control .mud-field,
    html body .mud-input-control .mud-input > input.mud-input-slot,
    html body .mud-input-control .mud-input > div.mud-input-slot.mud-select-input,
    html body .mud-input-control .mud-select-input {
        height: var(--omni-mobile-control-h) !important;
        min-height: var(--omni-mobile-control-h) !important;
        max-height: var(--omni-mobile-control-h) !important;
        line-height: var(--omni-mobile-control-h) !important;
        font-size: 0.91rem !important;
    }

    html body .mud-input-control .mud-input > input.mud-input-slot,
    html body .mud-input-control .mud-input > div.mud-input-slot.mud-select-input,
    html body .mud-input-control .mud-select-input {
        padding-inline: 11px calc(var(--app-control-icon-w) + 10px) !important;
    }

    html body .mud-input-control .mud-input > div.mud-input-slot.mud-select-input {
        display: flex !important;
        flex: 1 1 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        align-items: center !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body .notes-command-select .mud-input-label,
    html body .notes-command-select .mud-input-label.mud-shrink,
    html body .notes-command-select .mud-input-label.mud-input-label-animate {
        display: block !important;
        position: absolute !important;
        inset-inline-start: 14px !important;
        top: 6px !important;
        transform: none !important;
        max-width: calc(100% - 54px) !important;
        height: 13px !important;
        color: rgba(196, 201, 214, 0.68) !important;
        font-size: 0.58rem !important;
        font-weight: 780 !important;
        line-height: 13px !important;
        letter-spacing: 0.12em !important;
        text-transform: uppercase !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        pointer-events: none !important;
    }

    html body .mud-input-control:not(:has(.mud-input-adornment)) .mud-input > input.mud-input-slot,
    html body .mud-input-control:not(:has(.mud-input-adornment)) .mud-input > div.mud-input-slot.mud-select-input {
        padding-inline: 11px !important;
    }

    html body .mud-input-control textarea.mud-input-slot,
    html body .mud-input-control textarea.mud-input-root,
    html body .mud-input-control:has(textarea) .mud-input,
    html body .mud-input-control:has(textarea) .mud-field {
        min-height: 94px !important;
        max-height: none !important;
        line-height: 1.34 !important;
    }

    html body .mud-input-control textarea.mud-input-slot,
    html body .mud-input-control textarea.mud-input-root {
        padding: 12px !important;
    }

    .shopping-bulk-item-list {
        grid-template-columns: minmax(0, 1fr) !important;
        row-gap: 13px !important;
        column-gap: 0 !important;
    }

    .config-dialog-checkbox-row,
    .app-flag-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .config-dialog-checkbox,
    .profile-dialog-shell .config-dialog-checkbox,
    .contact-edit-dialog-shell .config-dialog-checkbox,
    .maintenance-inline-switch,
    .app-flag {
        width: 100% !important;
        min-height: 40px !important;
        padding: 0 11px 0 7px !important;
        justify-content: flex-start !important;
    }

    .config-dialog-checkbox .mud-typography,
    .app-flag .mud-typography {
        font-size: 0.84rem !important;
        line-height: 1.18 !important;
    }

    .dayplan-toolbar-row,
    .ios-calendar-toolbar.schedule-control-surface,
    .schoolrunsweek-toolbar,
    .profile-command-rail,
    .notes-toolbar,
    .directory-toolbar,
    .shopping-toolbar,
    .maintenance-toolbar {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: stretch !important;
        gap: var(--omni-mobile-toolbar-gap) !important;
        padding: 10px !important;
        border-radius: 18px !important;
    }

    .dayplan-toolbar-row > *,
    .ios-calendar-toolbar.schedule-control-surface > *,
    .schoolrunsweek-toolbar > *,
    .profile-command-rail > *,
    .notes-toolbar > *,
    .directory-toolbar > *,
    .shopping-toolbar > *,
    .maintenance-toolbar > * {
        min-width: 0 !important;
    }

    .dayplan-toolbar-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
    }

    .dayplan-date-wrap {
        grid-column: 1 / -1 !important;
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) 42px !important;
        gap: 7px !important;
        width: 100% !important;
    }

    .dayplan-today-wrap {
        grid-column: 1 !important;
    }

    .dayplan-user-wrap {
        grid-column: 2 !important;
        width: min(52vw, 220px) !important;
    }

    .dayplan-date-control,
    .dayplan-date-native {
        width: 100% !important;
    }

    .dayplan-date-control {
        position: relative !important;
        height: var(--omni-mobile-control-h) !important;
        min-height: var(--omni-mobile-control-h) !important;
        overflow: hidden !important;
        border-radius: var(--omni-mobile-control-radius) !important;
    }

    .dayplan-date-native {
        height: var(--omni-mobile-control-h) !important;
        min-height: var(--omni-mobile-control-h) !important;
        max-height: var(--omni-mobile-control-h) !important;
        padding-inline: 12px 52px !important;
        line-height: var(--omni-mobile-control-h) !important;
        appearance: none;
        -webkit-appearance: none;
    }

    .dayplan-date-native::-webkit-calendar-picker-indicator {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: pointer;
    }

    .dayplan-date-icon,
    .dayplan-date-icon.mud-icon-root {
        position: absolute !important;
        top: 50% !important;
        right: 14px !important;
        bottom: auto !important;
        width: 22px !important;
        height: 22px !important;
        min-width: 22px !important;
        max-width: 22px !important;
        transform: translateY(-50%) !important;
        pointer-events: none !important;
        opacity: 0.82 !important;
    }

    .dayplan-date-icon svg,
    .dayplan-date-icon .mud-icon-root {
        width: 21px !important;
        height: 21px !important;
        max-width: 21px !important;
        max-height: 21px !important;
    }

    .ios-calendar-toolbar.schedule-control-surface {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .ios-calendar-date-nav-row {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) 42px auto !important;
        gap: 7px !important;
        width: 100% !important;
    }

    .ios-calendar-date-picker-shell {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .ios-calendar-viewing-row,
    .ios-calendar-mode-row,
    .ios-calendar-view-switch {
        width: 100% !important;
        max-width: 100% !important;
    }

    .ios-calendar-mode-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .ios-calendar-view-switch {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        min-height: 42px !important;
    }

    .ios-calendar-generate-button {
        width: 100% !important;
        min-height: 42px !important;
    }

    .ios-day-view,
    .ios-week-view-mobile,
    .ios-month-mobile-list {
        display: grid !important;
        gap: 10px !important;
    }

    .ios-day-event-card {
        display: grid !important;
        grid-template-columns: 64px minmax(0, 1fr) !important;
        gap: 10px !important;
        min-height: 0 !important;
        padding: 12px !important;
    }

    .ios-day-event-time {
        width: auto !important;
        padding-right: 8px !important;
        font-size: 0.82rem !important;
    }

    .ios-day-event-title,
    .ios-week-mobile-title,
    .ios-month-mobile-event-title {
        font-size: 0.94rem !important;
        line-height: 1.18 !important;
    }

    .ios-day-event-meta,
    .ios-week-mobile-meta {
        font-size: 0.78rem !important;
        line-height: 1.22 !important;
    }

    .ios-week-mobile-strip,
    .ios-month-mobile-strip,
    .profile-category-rail,
    .maintenance-filter-row,
    .service-filter-row,
    .shopping-filter-row {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        max-width: 100% !important;
        padding-bottom: 4px !important;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
    }

    .ios-week-mobile-day,
    .ios-month-mobile-day,
    .profile-category-rail button,
    .profile-category-rail .mud-button-root {
        flex: 0 0 auto !important;
        scroll-snap-align: start;
    }

    .ios-month-grid,
    .schedule-month-grid {
        min-width: 0 !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
    }

    .ios-month-cell {
        min-width: 0 !important;
        min-height: 72px !important;
        padding: 7px !important;
    }

    .ios-month-event-pill,
    .schedule-event-chip {
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .shopping-store-group {
        padding: 12px !important;
        gap: 10px !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px 10px !important;
        min-height: 72px !important;
        padding: 11px !important;
    }

    .shopping-item-main,
    .shopping-item-copy,
    .shopping-item-meta {
        min-width: 0 !important;
    }

    .shopping-item-main {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 5px !important;
        width: 100% !important;
    }

    .shopping-item-topline,
    .shopping-item-detail,
    .shopping-item-badges,
    .shopping-item-meta {
        grid-column: auto !important;
        grid-row: auto !important;
        justify-self: stretch !important;
        align-self: auto !important;
    }

    .shopping-item-name {
        font-size: 0.95rem !important;
        line-height: 1.18 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: normal !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .shopping-item-detail {
        font-size: 0.76rem !important;
        line-height: 1.22 !important;
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }

    .shopping-item-meta,
    .shopping-item-chip-row {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 5px !important;
        font-size: 0.72rem !important;
        line-height: 1.1 !important;
        white-space: normal !important;
    }

    .shopping-item-badges {
        justify-content: flex-start !important;
        margin-top: 1px !important;
    }

    .shopping-item-actions {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 6px !important;
        width: 100% !important;
    }

    .shopping-item-bought-button.mud-button-root {
        min-width: 94px !important;
        min-height: 38px !important;
        padding-inline: 10px !important;
        font-size: 0.8rem !important;
    }

    .directory-grid,
    .contacts-grid,
    .profile-card-grid,
    .profile-attention-grid,
    .maintenance-grid,
    .settings-card-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .contact-card,
    .directory-card {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) auto !important;
        gap: 10px !important;
        align-items: center !important;
        min-height: 78px !important;
        padding: 12px !important;
    }

    .contact-card-avatar,
    .directory-card-avatar {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
    }

    .contact-card-title,
    .directory-card-title,
    .contact-card-name {
        font-size: 0.96rem !important;
        line-height: 1.14 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    .contact-card-meta,
    .directory-card-meta {
        font-size: 0.78rem !important;
        line-height: 1.22 !important;
    }

    .contact-card-actions,
    .directory-card-actions {
        display: inline-flex !important;
        gap: 5px !important;
    }

    .notes-workspace {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .notes-editor-pane,
    .notes-editor-canvas,
    .notes-editor-shell {
        min-height: min(54dvh, 520px) !important;
        padding-bottom: calc(var(--omni-mobile-shell-bottom-clearance) / 2) !important;
    }

    .notes-toolbar,
    .notes-filter-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .schoolrunsweek-toolbar {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .schoolrunsweek-nav-wrap,
    .schoolrunsweek-date-wrap {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) 42px !important;
        gap: 7px !important;
    }

    .schoolrunsweek-days {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 10px !important;
    }

    .schoolrunsweek-day-card {
        padding: 12px !important;
        gap: 9px !important;
    }

    .schoolrunsweek-day-header {
        min-height: 0 !important;
        padding-bottom: 8px !important;
    }

    .schoolrunsweek-slot-stack {
        gap: 8px !important;
    }

    .schoolrunsweek-slot-card,
    .schoolrunsweek-slot-content {
        min-height: 0 !important;
        padding: 10px !important;
    }

    .schoolrunsweek-slot-header {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 8px !important;
        margin-bottom: 6px !important;
    }

    .schoolrunsweek-slot-title {
        font-size: 0.78rem !important;
        letter-spacing: 0.09em !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        min-height: 34px !important;
        padding-inline: 9px !important;
        font-size: 0.74rem !important;
    }

    .schoolrunsweek-empty {
        padding: 8px !important;
        font-size: 0.78rem !important;
    }

    .schoolrunsweek-assignment-card {
        padding: 10px !important;
    }

    .schoolrunsweek-assignment-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 7px !important;
    }

    .schoolrunsweek-assignment-children,
    .schoolrunsweek-assignment-actions {
        grid-column: 1 / -1 !important;
    }

    .schoolrunsweek-assignment-editor {
        padding: 10px !important;
        gap: 9px !important;
    }

    .schoolrunsweek-editor-control,
    .schoolrunsweek-editor-select {
        width: 100% !important;
    }

    .schoolrunsweek-editor-child-options {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
    }

    .schoolrunsweek-editor-child-option {
        min-height: 36px !important;
        padding: 7px 9px !important;
        flex: 1 1 calc(50% - 7px) !important;
    }

    .profile-command-rail {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .profile-command-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        justify-content: flex-start !important;
    }

    .profile-command-actions .mud-button-root {
        flex: 1 1 auto !important;
    }

    .profile-layout,
    .profile-main-column,
    .profile-side-column {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
    }

    .profile-memory-card {
        min-height: 0 !important;
        gap: 8px !important;
    }

    .profile-card-topline,
    .profile-meta-row,
    .profile-tag-row {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    .maintenance-card,
    .maintenance-item-card,
    .maintenance-group-card {
        min-height: 0 !important;
        padding: 12px !important;
    }

    .settings-mobile-card,
    .settings-card,
    .feature-card {
        padding: 12px !important;
        min-height: 0 !important;
    }

    /* Final mobile refinement pass: compress the phone shell and remove
       desktop-derived vertical bulk while preserving the desktop system. */
    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .directory-page,
    .maintenance-page,
    .notes-page,
    .schoolrunsweek-page,
    .household-profile-page,
    .settings-page,
    .preferences-page {
        gap: 12px !important;
        padding-bottom: 4px !important;
    }

    .app-page-header,
    .app-page-shell-header,
    .ios-calendar-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header,
    .profile-hero {
        gap: 6px !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        min-height: 0 !important;
    }

    .schedule-hero-panel,
    .ios-calendar-page .ios-calendar-header.schedule-hero-panel {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 12px !important;
        margin: 0 0 8px !important;
        padding: 0 !important;
        min-height: 0 !important;
    }

    .page-title,
    .app-page-shell-title,
    .ios-calendar-month-label {
        font-size: clamp(1.42rem, 7vw, 1.82rem) !important;
        line-height: 1.04 !important;
    }

    .page-subtitle,
    .app-page-shell-subtitle,
    .ios-calendar-date-label {
        margin-top: 2px !important;
        font-size: 0.84rem !important;
        line-height: 1.28 !important;
    }

    .ios-calendar-toolbar.schedule-control-surface,
    .dayplan-toolbar-row,
    .shopping-toolbar,
    .directory-toolbar,
    .maintenance-toolbar,
    .notes-toolbar,
    .schoolrunsweek-toolbar,
    .profile-command-rail {
        padding: 8px !important;
        gap: 7px !important;
        border-radius: 16px !important;
    }

    .ios-calendar-toolbar.schedule-control-surface {
        grid-template-areas: none !important;
        grid-auto-rows: auto !important;
        align-items: stretch !important;
        min-height: 0 !important;
    }

    .ios-calendar-date-nav-row,
    .ios-calendar-viewing-row,
    .ios-calendar-mode-row {
        grid-area: auto !important;
    }

    .ios-calendar-date-nav-row {
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
        gap: 7px !important;
    }

    .ios-calendar-date-nav-row > .ios-calendar-today-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }

    .ios-calendar-date-picker-shell .mud-input,
    .ios-calendar-user-picker .mud-input,
    .dayplan-date-control,
    .dayplan-date-native,
    .schoolrunsweek-date-picker .mud-input {
        height: var(--omni-mobile-control-h) !important;
        min-height: var(--omni-mobile-control-h) !important;
    }

    .ios-calendar-mode-row,
    .ios-calendar-view-switch {
        min-height: 38px !important;
    }

    .ios-calendar-view-button.mud-button-root,
    .ios-calendar-generate-button.mud-button-root {
        min-height: 38px !important;
        font-size: 0.79rem !important;
    }

    .app-empty-state-card,
    .ios-calendar-empty,
    .profile-inline-empty,
    .schoolrunsweek-empty,
    .empty-state {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 12px !important;
        min-height: 0 !important;
    }

    .app-empty-state-card .mud-icon-root,
    .empty-state .mud-icon-root,
    .ios-calendar-empty .mud-icon-root {
        width: 26px !important;
        height: 26px !important;
    }

    .app-empty-title,
    .empty-title {
        font-size: 0.9rem !important;
        line-height: 1.12 !important;
    }

    .app-empty-copy,
    .empty-copy {
        margin-top: 2px !important;
        font-size: 0.78rem !important;
        line-height: 1.28 !important;
    }

    .shopping-store-group,
    .shopping-section-card,
    .maintenance-section-card,
    .maintenance-group-card,
    .settings-mobile-card,
    .settings-card,
    .feature-card,
    .schoolrunsweek-day-card {
        padding: 10px !important;
        border-radius: 16px !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        padding: 10px !important;
        border-radius: 14px !important;
        gap: 8px !important;
    }

    .shopping-item-actions {
        width: 100% !important;
        justify-content: space-between !important;
    }

    .shopping-item-bought-button.mud-button-root {
        flex: 1 1 auto !important;
        min-height: 36px !important;
    }

    .schoolrunsweek-day-card {
        gap: 7px !important;
    }

    .schoolrunsweek-slot-card,
    .schoolrunsweek-slot-content,
    .schoolrunsweek-assignment-card {
        padding: 8px !important;
        border-radius: 14px !important;
    }

    .schoolrunsweek-slot-header {
        gap: 6px !important;
    }

    .schoolrunsweek-slot-title {
        font-size: 0.7rem !important;
        letter-spacing: 0.075em !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        min-height: 30px !important;
        padding-inline: 8px !important;
        font-size: 0.68rem !important;
    }

    .schoolrunsweek-empty {
        grid-template-columns: auto minmax(0, 1fr) !important;
        padding: 8px !important;
    }

    .settings-mobile-card .mud-button-root,
    .settings-card .mud-button-root,
    .feature-card .mud-button-root {
        min-height: 38px !important;
    }

}

@media (max-width: 380px) {
    :root {
        --omni-mobile-page-x: 7px;
        --omni-mobile-card-pad: 12px;
    }

    .app-topbar-logo,
    .app-topbar-logo[role="img"] {
        letter-spacing: 0.22em !important;
        font-size: 1rem !important;
    }

    .ios-calendar-date-nav-row {
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
    }

    .ios-calendar-date-nav-row > .ios-calendar-today-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }

    .dayplan-user-wrap {
        width: min(48vw, 180px) !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .shopping-item-actions {
        justify-content: flex-start !important;
    }

    /* Final mobile refinement pass: compress the phone shell and remove
       desktop-derived vertical bulk while preserving the desktop system. */
    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .directory-page,
    .maintenance-page,
    .notes-page,
    .schoolrunsweek-page,
    .household-profile-page,
    .settings-page,
    .preferences-page {
        gap: 12px !important;
        padding-bottom: 4px !important;
    }

    .app-page-header,
    .app-page-shell-header,
    .ios-calendar-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header,
    .profile-hero {
        gap: 6px !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        min-height: 0 !important;
    }

    .schedule-hero-panel,
    .ios-calendar-page .ios-calendar-header.schedule-hero-panel {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch !important;
        gap: 12px !important;
        margin: 0 0 8px !important;
        padding: 0 !important;
        min-height: 0 !important;
    }

    .page-title,
    .app-page-shell-title,
    .ios-calendar-month-label {
        font-size: clamp(1.42rem, 7vw, 1.82rem) !important;
        line-height: 1.04 !important;
    }

    .page-subtitle,
    .app-page-shell-subtitle,
    .ios-calendar-date-label {
        margin-top: 2px !important;
        font-size: 0.84rem !important;
        line-height: 1.28 !important;
    }

    .ios-calendar-toolbar.schedule-control-surface,
    .dayplan-toolbar-row,
    .shopping-toolbar,
    .directory-toolbar,
    .maintenance-toolbar,
    .notes-toolbar,
    .schoolrunsweek-toolbar,
    .profile-command-rail {
        padding: 8px !important;
        gap: 7px !important;
        border-radius: 16px !important;
    }

    .ios-calendar-date-nav-row {
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
        gap: 7px !important;
    }

    .ios-calendar-date-nav-row > .ios-calendar-today-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }

    .ios-calendar-date-picker-shell .mud-input,
    .ios-calendar-user-picker .mud-input,
    .dayplan-date-control,
    .dayplan-date-native,
    .schoolrunsweek-date-picker .mud-input {
        height: var(--omni-mobile-control-h) !important;
        min-height: var(--omni-mobile-control-h) !important;
    }

    .ios-calendar-mode-row,
    .ios-calendar-view-switch {
        min-height: 38px !important;
    }

    .ios-calendar-view-button.mud-button-root,
    .ios-calendar-generate-button.mud-button-root {
        min-height: 38px !important;
        font-size: 0.79rem !important;
    }

    .app-empty-state-card,
    .ios-calendar-empty,
    .profile-inline-empty,
    .schoolrunsweek-empty,
    .empty-state {
        display: grid !important;
        grid-template-columns: auto minmax(0, 1fr) !important;
        align-items: center !important;
        gap: 10px !important;
        padding: 12px !important;
        min-height: 0 !important;
    }

    .app-empty-state-card .mud-icon-root,
    .empty-state .mud-icon-root,
    .ios-calendar-empty .mud-icon-root {
        width: 26px !important;
        height: 26px !important;
    }

    .app-empty-title,
    .empty-title {
        font-size: 0.9rem !important;
        line-height: 1.12 !important;
    }

    .app-empty-copy,
    .empty-copy {
        margin-top: 2px !important;
        font-size: 0.78rem !important;
        line-height: 1.28 !important;
    }

    .shopping-store-group,
    .shopping-section-card,
    .maintenance-section-card,
    .maintenance-group-card,
    .settings-mobile-card,
    .settings-card,
    .feature-card,
    .schoolrunsweek-day-card {
        padding: 10px !important;
        border-radius: 16px !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        padding: 10px !important;
        border-radius: 14px !important;
        gap: 8px !important;
    }

    .shopping-item-actions {
        width: 100% !important;
        justify-content: space-between !important;
    }

    .shopping-item-bought-button.mud-button-root {
        flex: 1 1 auto !important;
        min-height: 36px !important;
    }

    .schoolrunsweek-day-card {
        gap: 7px !important;
    }

    .schoolrunsweek-slot-card,
    .schoolrunsweek-slot-content,
    .schoolrunsweek-assignment-card {
        padding: 8px !important;
        border-radius: 14px !important;
    }

    .schoolrunsweek-slot-header {
        gap: 6px !important;
    }

    .schoolrunsweek-slot-title {
        font-size: 0.7rem !important;
        letter-spacing: 0.075em !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        min-height: 30px !important;
        padding-inline: 8px !important;
        font-size: 0.68rem !important;
    }

    .schoolrunsweek-empty {
        grid-template-columns: auto minmax(0, 1fr) !important;
        padding: 8px !important;
    }

    .settings-mobile-card .mud-button-root,
    .settings-card .mud-button-root,
    .feature-card .mud-button-root {
        min-height: 38px !important;
    }

}

@media (max-width: 768px) {
    /* Exact late overrides for mobile surfaces with older page-specific rules. */
    html body .ios-calendar-page .ios-calendar-header,
    html body .ios-calendar-page .ios-calendar-header.schedule-hero-panel {
        gap: 5px !important;
        margin-bottom: 0 !important;
    }

    html body .ios-calendar-page .ios-calendar-month-label {
        font-size: clamp(1.34rem, 6.2vw, 1.58rem) !important;
        line-height: 1.04 !important;
    }

    html body .ios-calendar-page .ios-calendar-date-label {
        font-size: 0.8rem !important;
        line-height: 1.18 !important;
    }

    html body .ios-calendar-page .app-page-context-chip-row {
        margin-top: 4px !important;
        min-height: 24px !important;
    }

    html body .dayplan-page .dayplan-toolbar-row,
    html body .schoolrunsweek-page .schoolrunsweek-toolbar {
        margin-top: -18px !important;
    }

    html body .ios-calendar-page .ios-calendar-toolbar.schedule-control-surface {
        margin-top: 4px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-date-wrap {
        display: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-toolbar {
        gap: 0 !important;
        padding-bottom: 6px !important;
    }
}

@media (max-width: 768px) {
    html body .ios-calendar-page .ios-calendar-toolbar.schedule-control-surface {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: none !important;
        grid-auto-flow: row !important;
        grid-auto-rows: auto !important;
        align-items: stretch !important;
        height: auto !important;
        min-height: 0 !important;
        gap: 7px !important;
        padding: 8px !important;
    }

    html body .ios-calendar-page .ios-calendar-date-nav-row,
    html body .ios-calendar-page .ios-calendar-viewing-row,
    html body .ios-calendar-page .ios-calendar-mode-row {
        grid-area: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        transform: none !important;
    }

    html body .ios-calendar-page .ios-calendar-viewing-row,
    html body .ios-calendar-page .dayplan-user-wrap.ios-calendar-viewing-row {
        display: block !important;
        width: 100% !important;
    }

    html body .ios-calendar-page .ios-calendar-mode-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas: none !important;
        gap: 7px !important;
    }

    html body .ios-calendar-page .ios-calendar-view-switch {
        width: 100% !important;
        max-width: 100% !important;
    }

    html body .ios-calendar-page .ios-calendar-date-nav-row {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
        grid-template-areas:
            "date date date"
            "prev today next" !important;
        gap: 7px !important;
    }

    html body .ios-calendar-page .ios-calendar-date-picker-shell {
        grid-area: date !important;
        grid-column: 1 / -1 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}

@media (max-width: 768px) {
    /* Elite mobile finish: compact chrome, cards, forms, and repeated operational empty states. */
    :root {
        --omni-mobile-topbar-h: 48px;
        --omni-mobile-bottomnav-h: 50px;
        --omni-mobile-page-x: clamp(6px, 2vw, 9px);
        --omni-mobile-section-gap: 9px;
        --omni-mobile-card-gap: 8px;
        --omni-mobile-card-pad: 10px;
        --omni-mobile-toolbar-gap: 6px;
        --omni-mobile-control-h: 38px;
        --app-control-pad-x: 10px;
        --app-label-size: 0.62rem;
        --app-label-tracking: 0.07em;
    }

    html body .mud-layout > .mud-main-content.app-main-content {
        padding-top: calc(var(--omni-mobile-topbar-h) + env(safe-area-inset-top, 0px) + 3px) !important;
        padding-inline: var(--omni-mobile-page-x) !important;
    }

    html body .app-content-canvas {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .app-topbar.mud-appbar,
    .app-topbar .mud-toolbar {
        --omni-mobile-topbar-h: 48px !important;
        min-height: 48px !important;
        height: 48px !important;
        max-height: 48px !important;
    }

    .app-topbar-menu.mud-icon-button,
    .app-topbar-add-trigger.mud-icon-button-root,
    .app-topbar .mud-icon-button {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
        border-radius: 11px !important;
    }

    .app-topbar-logo,
    .app-topbar-logo[role="img"] {
        font-size: clamp(0.95rem, 4.7vw, 1.12rem) !important;
        letter-spacing: 0.24em !important;
    }

    .mobile-bottom-nav {
        --omni-mobile-bottomnav-h: 50px !important;
        position: fixed !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: center !important;
        gap: 4px !important;
        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;
        padding: 4px !important;
        border-radius: 18px !important;
    }

    .mobile-bottom-nav-item {
        min-height: 40px !important;
        height: 40px !important;
        max-height: 40px !important;
        padding: 3px 5px !important;
        border-radius: 13px !important;
        font-size: 0.61rem !important;
    }

    .mobile-bottom-nav-item .mud-icon-root {
        width: 18px !important;
        height: 18px !important;
    }

    .page-title,
    .app-page-shell-title,
    .ios-calendar-month-label {
        font-size: clamp(1.2rem, 6vw, 1.55rem) !important;
        line-height: 1.04 !important;
    }

    .page-subtitle,
    .app-page-shell-subtitle,
    .ios-calendar-date-label {
        font-size: 0.78rem !important;
        line-height: 1.22 !important;
    }

    .app-page-kicker,
    .app-page-shell-kicker,
    .schoolrunsweek-page-context {
        letter-spacing: 0.12em !important;
    }

    .ios-calendar-toolbar.schedule-control-surface,
    .dayplan-toolbar-row,
    .shopping-toolbar,
    .directory-toolbar,
    .maintenance-toolbar,
    .notes-toolbar,
    .schoolrunsweek-toolbar,
    .profile-command-rail {
        padding: 6px !important;
        gap: 6px !important;
        border-radius: 15px !important;
    }

    html body .ios-calendar-page .ios-calendar-date-nav-row,
    .schoolrunsweek-nav-wrap,
    .schoolrunsweek-date-wrap {
        grid-template-columns: 36px minmax(0, 1fr) 36px !important;
        gap: 6px !important;
    }

    html body .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-today-button {
        min-height: 36px !important;
    }

    .ios-calendar-date-picker-shell .mud-input,
    .ios-calendar-user-picker .mud-input,
    .dayplan-date-control,
    .dayplan-date-native,
    .schoolrunsweek-date-picker .mud-input,
    .ios-calendar-view-button.mud-button-root,
    .ios-calendar-generate-button.mud-button-root {
        height: var(--omni-mobile-control-h) !important;
        min-height: var(--omni-mobile-control-h) !important;
        max-height: var(--omni-mobile-control-h) !important;
        font-size: 0.75rem !important;
    }

    .ios-calendar-view-switch,
    .ios-calendar-mode-row {
        min-height: 36px !important;
    }

    .app-empty-state-card,
    .ios-calendar-empty,
    .profile-inline-empty,
    .schoolrunsweek-empty,
    .empty-state {
        grid-template-columns: auto minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 9px !important;
        border-radius: 14px !important;
    }

    .app-empty-state-card .mud-icon-root,
    .empty-state .mud-icon-root,
    .ios-calendar-empty .mud-icon-root,
    .schoolrunsweek-empty .mud-icon-root {
        width: 20px !important;
        height: 20px !important;
        opacity: 0.62 !important;
    }

    .app-empty-title,
    .empty-title,
    .schoolrunsweek-empty-title {
        font-size: 0.82rem !important;
        line-height: 1.12 !important;
    }

    .app-empty-copy,
    .empty-copy,
    .app-empty-state-message,
    .schoolrunsweek-empty-message {
        font-size: 0.72rem !important;
        line-height: 1.22 !important;
    }

    .schoolrunsweek-empty .app-empty-state-message,
    .schoolrunsweek-empty-message {
        display: none !important;
    }

    .schoolrunsweek-day-card {
        padding: 8px !important;
        gap: 6px !important;
        border-radius: 15px !important;
    }

    .schoolrunsweek-day-header {
        padding: 7px 8px !important;
    }

    .schoolrunsweek-day-name {
        font-size: 0.84rem !important;
        letter-spacing: 0.13em !important;
    }

    .schoolrunsweek-day-date {
        font-size: 0.68rem !important;
    }

    .schoolrunsweek-slot-stack {
        gap: 6px !important;
    }

    .schoolrunsweek-slot-card,
    .schoolrunsweek-slot-content,
    .schoolrunsweek-assignment-card {
        padding: 7px !important;
        border-radius: 13px !important;
    }

    .schoolrunsweek-slot-header {
        margin-bottom: 5px !important;
    }

    .schoolrunsweek-slot-title {
        max-width: 44% !important;
        font-size: 0.66rem !important;
        letter-spacing: 0.065em !important;
        line-height: 1.1 !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        min-height: 28px !important;
        padding-inline: 7px !important;
        font-size: 0.66rem !important;
    }

    .schoolrunsweek-assignment-name {
        font-size: 0.82rem !important;
        line-height: 1.12 !important;
    }

    .schoolrunsweek-chip {
        min-height: 20px !important;
        padding: 0 6px !important;
        font-size: 0.62rem !important;
    }

    .maintenance-dialog-helper {
        display: none !important;
    }

    .mud-dialog .mud-input-control:has(.mud-input-label),
    .mud-dialog .maintenance-field .mud-input-control:has(.mud-input-label) {
        padding-top: 20px !important;
    }

    .mud-dialog .mud-input-label,
    .mud-dialog .maintenance-field .mud-input-label,
    .mud-dialog .mud-input-label.mud-shrink,
    .mud-dialog .maintenance-field .mud-input-label.mud-shrink {
        top: 0 !important;
        left: var(--omni-form-label-inset) !important;
        transform: none !important;
        height: 14px !important;
        padding: 0 !important;
        background: transparent !important;
        color: rgba(218, 224, 246, 0.82) !important;
        font-size: 0.64rem !important;
        line-height: 14px !important;
        letter-spacing: 0.075em !important;
        z-index: 3 !important;
    }

    .mud-dialog .mud-input.mud-input-outlined,
    .mud-dialog .mud-input.mud-input-outlined.mud-select-input,
    .mud-dialog .mud-input-slot,
    .mud-dialog .mud-select-input {
        height: 38px !important;
        min-height: 38px !important;
        max-height: 38px !important;
        line-height: 38px !important;
    }

    .mud-dialog textarea.mud-input-slot,
    .mud-dialog textarea.mud-input-root {
        min-height: 72px !important;
        line-height: 1.3 !important;
    }

    .maintenance-inline-switch,
    .config-dialog-checkbox,
    .contact-edit-toggle-row {
        min-height: 38px !important;
        padding: 6px 8px !important;
        border-radius: 13px !important;
    }

    .maintenance-inline-switch span,
    .config-dialog-checkbox .mud-typography {
        font-size: 0.8rem !important;
        line-height: 1.16 !important;
    }
}

@media (max-width: 380px) {
    .app-topbar-logo,
    .app-topbar-logo[role="img"] {
        font-size: 0.94rem !important;
        letter-spacing: 0.2em !important;
    }

    .schoolrunsweek-slot-title {
        max-width: 40% !important;
    }

    .mobile-bottom-nav-item {
        font-size: 0.62rem !important;
    }
}

@media (max-width: 768px) {
    /* Final elite mobile trim: exact page chrome, operational density, and
       sheet rhythm after authenticated screenshot inspection. */
    :root {
        --omni-mobile-topbar-h: 48px;
        --omni-mobile-bottomnav-h: 50px;
        --omni-mobile-section-gap: 8px;
        --omni-mobile-card-gap: 7px;
        --omni-mobile-card-pad: 9px;
        --omni-mobile-toolbar-gap: 5px;
        --omni-mobile-control-h: 36px;
        --app-control-icon-w: 40px;
    }

    html body .mud-layout > .mud-main-content.app-main-content {
        padding-top: calc(var(--omni-mobile-topbar-h) + env(safe-area-inset-top, 0px) + 12px) !important;
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
    }

    .app-topbar.mud-appbar,
    .app-topbar .mud-toolbar {
        --omni-mobile-topbar-h: 48px !important;
        min-height: 48px !important;
        height: 48px !important;
        max-height: 48px !important;
    }

    .app-topbar-menu.mud-icon-button,
    .app-topbar-add-trigger.mud-icon-button-root,
    .app-topbar .mud-icon-button {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        min-height: 32px !important;
    }

    .app-topbar-logo,
    .app-topbar-logo[role="img"] {
        font-size: clamp(0.92rem, 4.4vw, 1.04rem) !important;
        letter-spacing: 0.22em !important;
    }

    .mobile-bottom-nav {
        --omni-mobile-bottomnav-h: 50px !important;
        position: fixed !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        align-items: center !important;
        gap: 4px !important;
        height: 50px !important;
        min-height: 50px !important;
        max-height: 50px !important;
        padding: 4px !important;
        border-radius: 18px !important;
    }

    .mobile-bottom-nav-item {
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
        padding: 3px 5px !important;
        border-radius: 13px !important;
        font-size: 0.61rem !important;
    }

    .mobile-bottom-nav-item .mud-icon-root {
        width: 17px !important;
        height: 17px !important;
    }

    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .directory-page,
    .maintenance-page,
    .notes-page,
    .schoolrunsweek-page,
    .household-profile-page,
    .settings-page,
    .preferences-page {
        gap: 8px !important;
        margin-top: 0 !important;
    }

    .app-page-header,
    .app-page-shell-header,
    .ios-calendar-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header,
    .profile-hero {
        gap: 4px !important;
    }

    .app-page-title,
    .app-page h1,
    .page-title,
    .app-page-shell-title,
    .ios-calendar-month-label {
        font-size: clamp(1.22rem, 5.8vw, 1.52rem) !important;
        line-height: 1.04 !important;
        letter-spacing: 0 !important;
    }

    .dayplan-page-context,
    .schoolrunsweek-page-context,
    .app-page-subtitle,
    .app-page-shell-subtitle,
    .page-subtitle,
    .ios-calendar-date-label {
        margin-top: 1px !important;
        font-size: 0.78rem !important;
        line-height: 1.22 !important;
        letter-spacing: 0.02em !important;
    }

    .app-page-eyebrow,
    .app-page-shell-kicker,
    .page-kicker {
        font-size: 0.58rem !important;
        line-height: 1.05 !important;
        letter-spacing: 0.095em !important;
    }

    .app-page-context-chip-row {
        margin-top: 5px !important;
        gap: 4px !important;
    }

    .app-page-context-chip,
    .app-page-context-chip-row {
        min-height: 26px !important;
    }

    .app-page-context-chip-label,
    .app-page-context-chip-value {
        font-size: 0.7rem !important;
        line-height: 1 !important;
        letter-spacing: 0.075em !important;
    }

    .ios-calendar-toolbar.schedule-control-surface,
    .dayplan-toolbar-row,
    .shopping-toolbar,
    .directory-toolbar,
    .maintenance-toolbar,
    .notes-toolbar,
    .schoolrunsweek-toolbar,
    .profile-command-rail {
        padding: 6px !important;
        gap: 5px !important;
        border-radius: 14px !important;
    }

    .dayplan-toolbar-row {
        grid-template-columns: minmax(0, 1fr) minmax(112px, auto) !important;
    }

    .dayplan-date-wrap,
    html body .ios-calendar-page .ios-calendar-date-nav-row,
    .schoolrunsweek-nav-wrap {
        grid-template-columns: 34px minmax(0, 1fr) 34px !important;
        gap: 5px !important;
    }

    .schoolrunsweek-date-wrap {
        display: block !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .dayplan-date-nav-button.mud-icon-button,
    .schoolrunsweek-nav-wrap .mud-icon-button,
    .ios-calendar-nav-button.mud-icon-button {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
        min-height: 34px !important;
    }

    .dayplan-today-button.mud-button-root,
    .schoolrunsweek-today-button.mud-button-root,
    .ios-calendar-today-button.mud-button-root,
    .ios-calendar-view-button.mud-button-root,
    .ios-calendar-generate-button.mud-button-root {
        min-height: 34px !important;
        height: 34px !important;
        font-size: 0.74rem !important;
    }

    .dayplan-user-wrap {
        width: 100% !important;
    }

    .dayplan-user-picker .mud-input-control:has(.mud-input-label) > .mud-input-control-input-container,
    .ios-calendar-user-picker .mud-input-control:has(.mud-input-label) > .mud-input-control-input-container {
        min-height: 36px !important;
        padding-top: 0 !important;
    }

    .dayplan-user-picker .mud-input-label,
    .ios-calendar-user-picker .mud-input-label {
        display: none !important;
    }

    .dayplan-section {
        margin-top: 6px !important;
    }

    .dayplan-section-title {
        margin-bottom: 5px !important;
        font-size: 1.04rem !important;
        line-height: 1.05 !important;
    }

    .app-empty-state-card,
    .dayplan-empty-card,
    .ios-calendar-empty,
    .profile-inline-empty,
    .schoolrunsweek-empty,
    .empty-state {
        gap: 8px !important;
        padding: 9px !important;
        border-radius: 14px !important;
    }

    .app-empty-state-icon {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
        border-radius: 12px !important;
    }

    .app-empty-state-icon .mud-icon-root,
    .app-empty-state-card .mud-icon-root,
    .empty-state .mud-icon-root,
    .ios-calendar-empty .mud-icon-root {
        width: 18px !important;
        height: 18px !important;
    }

    .app-empty-state-eyebrow {
        font-size: 0.56rem !important;
        letter-spacing: 0.12em !important;
        line-height: 1.05 !important;
    }

    .app-empty-state-title,
    .app-empty-title,
    .empty-title {
        font-size: 0.82rem !important;
        line-height: 1.12 !important;
    }

    .app-empty-state-message,
    .app-empty-copy,
    .empty-copy {
        margin-top: 1px !important;
        font-size: 0.7rem !important;
        line-height: 1.2 !important;
    }

    .ios-calendar-empty {
        text-align: left !important;
    }

    .ios-calendar-empty .app-empty-state-title,
    .ios-calendar-empty-title {
        font-size: 0.92rem !important;
        line-height: 1.14 !important;
    }

    .schoolrunsweek-day-card {
        padding: 7px !important;
        gap: 5px !important;
        border-radius: 14px !important;
    }

    .schoolrunsweek-day-header {
        padding: 6px 7px !important;
    }

    .schoolrunsweek-day-name {
        font-size: 0.74rem !important;
        line-height: 1.08 !important;
    }

    .schoolrunsweek-day-date {
        font-size: 0.62rem !important;
        line-height: 1.08 !important;
    }

    .schoolrunsweek-slot-stack {
        gap: 5px !important;
    }

    .schoolrunsweek-slot-card,
    .schoolrunsweek-slot-content,
    .schoolrunsweek-assignment-card {
        padding: 7px !important;
        border-radius: 12px !important;
    }

    .schoolrunsweek-slot-header {
        gap: 5px !important;
        margin-bottom: 5px !important;
    }

    .schoolrunsweek-slot-title {
        font-size: 0.62rem !important;
        line-height: 1.05 !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        min-height: 28px !important;
        height: 28px !important;
        padding-inline: 7px !important;
        font-size: 0.62rem !important;
    }

    .schoolrunsweek-empty {
        display: flex !important;
        align-items: center !important;
        padding: 7px 8px !important;
    }

    .schoolrunsweek-empty .app-empty-state-icon {
        display: none !important;
    }

    .schoolrunsweek-empty .app-empty-state-eyebrow,
    .schoolrunsweek-empty .app-empty-state-message {
        display: none !important;
    }

    .schoolrunsweek-empty .app-empty-state-title {
        font-size: 0.74rem !important;
        line-height: 1.1 !important;
        color: rgba(232, 235, 244, 0.74) !important;
    }

    .mud-dialog .mud-input-control:has(.mud-input-label),
    .mud-dialog .maintenance-field .mud-input-control:has(.mud-input-label) {
        padding-top: 18px !important;
    }

    .mud-dialog .mud-input.mud-input-outlined,
    .mud-dialog .mud-input.mud-input-outlined.mud-select-input,
    .mud-dialog .mud-input-slot,
    .mud-dialog .mud-select-input {
        height: 34px !important;
        min-height: 34px !important;
        max-height: 34px !important;
        line-height: 34px !important;
        font-size: 0.82rem !important;
    }

    .mud-dialog textarea.mud-input-slot,
    .mud-dialog textarea.mud-input-root {
        min-height: 60px !important;
    }

    .maintenance-inline-switch,
    .config-dialog-checkbox,
    .contact-edit-toggle-row {
        min-height: 34px !important;
        padding: 5px 7px !important;
    }

    .shopping-ios-page .shopping-item-actions {
        display: grid !important;
        grid-template-columns: minmax(72px, max-content) 34px !important;
        align-items: center !important;
        justify-content: end !important;
        justify-items: end !important;
        column-gap: 10px !important;
        width: auto !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    .shopping-ios-page .shopping-item-primary-action {
        grid-column: 1 !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        display: inline-flex !important;
        justify-content: flex-end !important;
    }

    .shopping-ios-page .shopping-item-bought-button,
    .shopping-ios-page .shopping-item-bought-button.mud-button-root {
        width: auto !important;
        min-width: 72px !important;
        max-width: 118px !important;
        padding-inline: 10px !important;
        white-space: nowrap !important;
    }

    .shopping-ios-page .shopping-item-actions .mud-menu,
    .shopping-ios-page .shopping-item-actions .mud-menu-button,
    .shopping-ios-page .shopping-item-actions .mud-menu-button-root,
    .shopping-ios-page .shopping-item-actions .mud-icon-button {
        grid-column: 2 !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        justify-self: end !important;
    }
}

@media (max-width: 380px) {
    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .directory-page,
    .maintenance-page,
    .notes-page,
    .schoolrunsweek-page,
    .household-profile-page,
    .settings-page,
    .preferences-page {
        margin-top: -14px !important;
    }

    .app-topbar-logo,
    .app-topbar-logo[role="img"] {
        font-size: 0.9rem !important;
        letter-spacing: 0.19em !important;
    }
}

/* Migrated late mobile rescue hardening. Source retired: omnisant.mobile-rescue.css. */
/*
 * Omnisant mobile rescue layer.
 * Mobile-only corrections loaded after the final desktop polish layer.
 * Keep this scoped: it is intentionally a phone contract, not a redesign.
 */

.dayplan-mobile-controls {
    display: contents;
}

.dayplan-mobile-controls-summary {
    display: none;
}

@media (max-width: 768px) {
    :root {
        --omni-mobile-topbar-h: 48px;
        --omni-mobile-bottomnav-h: 50px;
        --omni-mobile-page-x: clamp(10px, 3vw, 14px);
        --omni-mobile-section-gap: 12px;
        --omni-mobile-card-gap: 8px;
        --omni-mobile-card-pad: 10px;
        --omni-mobile-control-h: 42px;
        --omni-mobile-control-radius: 13px;
        --omni-mobile-shell-bottom-clearance: calc(var(--omni-mobile-bottomnav-h) + env(safe-area-inset-bottom, 0px) + 24px);
    }

    .dayplan-mobile-controls {
        display: contents;
    }

    .dayplan-mobile-controls-summary {
        display: none;
    }

    html,
    body,
    #app,
    .mud-layout,
    .mud-main-content,
    .app-content-canvas,
    .app-content-canvas > *,
    .app-page,
    .page-shell,
    .app-page-shell,
    .app-page-shell-body {
        max-width: 100vw !important;
        min-width: 0 !important;
        overflow-x: clip !important;
    }

    .app-page,
    .page-shell,
    .app-page-shell,
    .ios-calendar-page,
    .dayplan-page,
    .shopping-ios-page,
    .ios-contacts-page,
    .maintenance-page,
    .notes-page,
    .schoolrunsweek-page,
    .household-profile-page,
    .settings-page,
    .preferences-page {
        gap: var(--omni-mobile-section-gap) !important;
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
    }


    .app-page-header,
    .app-page-shell-header,
    .ios-calendar-header,
    .dayplan-page-header,
    .maintenance-header,
    .notes-header,
    .schoolrunsweek-header,
    .profile-hero {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 7px !important;
        margin: 0 !important;
        padding: 0 !important;
        min-height: 0 !important;
    }

    .app-page-shell-title-block,
    .app-page-header > *,
    .ios-calendar-header > *,
    .maintenance-header > *,
    .notes-header > * {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .app-page-title,
    .app-page-shell-title,
    .page-title,
    .ios-calendar-month-label {
        font-size: clamp(1.28rem, 6.25vw, 1.68rem) !important;
        line-height: 1.08 !important;
        letter-spacing: 0 !important;
    }

    .app-page-subtitle,
    .app-page-shell-subtitle,
    .page-subtitle,
    .ios-calendar-date-label,
    .dayplan-page-context {
        font-size: 0.82rem !important;
        line-height: 1.28 !important;
    }

    .app-page-eyebrow,
    .app-page-shell-kicker,
    .page-kicker,
    .config-dialog-section-title,
    .config-dialog-section-kicker,
    .profile-dialog-section-title {
        font-size: 0.62rem !important;
        letter-spacing: 0.10em !important;
    }

    .app-page-context-chip-row,
    .maintenance-page .app-page-context-chip-row {
        width: fit-content !important;
        max-width: 100% !important;
        justify-self: start !important;
        align-self: start !important;
        min-height: 30px !important;
        height: auto !important;
        padding: 6px 10px !important;
        border-radius: 999px !important;
        white-space: normal !important;
    }

    .dayplan-toolbar-row,
    .ios-calendar-toolbar.schedule-control-surface,
    .shopping-toolbar,
    .directory-toolbar,
    .maintenance-toolbar,
    .notes-toolbar,
    .schoolrunsweek-toolbar,
    .profile-command-rail {
        gap: 7px !important;
        padding: 8px !important;
        border-radius: 16px !important;
        margin: 0 !important;
        max-width: 100% !important;
    }

    .mud-button-root,
    .app-button,
    .omni-primary-command,
    .omni-secondary-command {
        min-height: 40px !important;
        border-radius: 13px !important;
        padding-inline: 12px !important;
        font-size: 0.82rem !important;
    }

    .mud-icon-button,
    .mud-icon-button-root,
    .app-icon-button {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        min-height: 40px !important;
        border-radius: 13px !important;
    }

    .mud-input-control,
    .mud-select,
    .mud-picker,
    .mud-input-control-input-container,
    .mud-input {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body .mud-input-control .mud-input.mud-input-outlined,
    html body .mud-input-control .mud-input.mud-input-outlined.mud-select-input,
    html body .mud-input-control .mud-field,
    html body .mud-input-control .mud-select-input,
    html body .mud-input-control input.mud-input-slot {
        min-height: var(--omni-mobile-control-h) !important;
        height: var(--omni-mobile-control-h) !important;
        max-height: var(--omni-mobile-control-h) !important;
    }

    html body .mud-input-control .mud-input-adornment,
    html body .mud-input-control .mud-input-adornment-end,
    html body .mud-input-control .mud-input-adornment .mud-icon-root {
        align-items: center !important;
        align-self: center !important;
        justify-content: center !important;
    }

    .mud-chip,
    .mud-chip-root,
    .app-chip,
    .shopping-chip,
    .status-chip,
    .schoolrunsweek-chip {
        max-width: 100% !important;
        min-height: 23px !important;
        padding: 4px 8px !important;
        font-size: 0.70rem !important;
        line-height: 1.12 !important;
        white-space: normal !important;
    }

    .ios-calendar-page .schedule-hero-panel {
        gap: 10px !important;
        margin: 0 !important;
    }

    .ios-calendar-page .ios-calendar-toolbar.schedule-control-surface {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row {
        display: grid !important;
        grid-template-columns: 40px minmax(0, 1fr) 40px !important;
        gap: 7px !important;
        width: 100% !important;
    }

    .ios-calendar-page .ios-calendar-date-nav-row > .ios-calendar-today-button {
        grid-column: 1 / -1 !important;
        width: 100% !important;
        min-height: 38px !important;
    }

    .ios-calendar-page .ios-calendar-view-switch {
        min-height: 38px !important;
        height: 38px !important;
    }

    .ios-calendar-page .ios-calendar-view-button.mud-button-root,
    .ios-calendar-page .ios-calendar-generate-button.mud-button-root {
        min-height: 38px !important;
        height: 38px !important;
        font-size: 0.78rem !important;
    }

    html body .ios-calendar-page .ios-month-view.ios-month-view-desktop,
    html body .ios-calendar-page .ios-month-view-desktop {
        display: none !important;
    }

    .ios-month-mobile-list {
        display: grid !important;
        gap: 10px !important;
    }

    .ios-month-mobile-strip {
        display: flex !important;
        gap: 8px !important;
        overflow-x: auto !important;
        padding-bottom: 3px !important;
        scrollbar-width: none !important;
    }

    .ios-month-mobile-strip::-webkit-scrollbar {
        display: none !important;
    }

    .ios-month-mobile-day {
        flex: 0 0 48px !important;
        width: 48px !important;
        min-width: 48px !important;
        min-height: 54px !important;
        border-radius: 14px !important;
        padding: 6px !important;
    }

    .ios-month-mobile-card,
    .ios-week-mobile-card,
    .ios-day-event-card {
        border-radius: 16px !important;
        padding: 11px !important;
    }

    .ios-day-event-card {
        grid-template-columns: 52px minmax(0, 1fr) !important;
        gap: 9px !important;
    }

    .ios-day-event-time {
        font-size: 0.78rem !important;
        padding-right: 6px !important;
    }

    .dayplan-list {
        display: grid !important;
        gap: 8px !important;
    }

    .dayplan-page {
        padding-top: 0 !important;
        margin-top: 0 !important;
    }

    .dayplan-page .app-page-context-chip-row {
        display: none !important;
    }

    html body .dayplan-page > .dayplan-page-header,
    html body .dayplan-page .dayplan-page-header,
    html body .app-page.dayplan-page > .app-page-header.dayplan-page-header {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    .dayplan-page .app-page-eyebrow {
        display: none !important;
    }

    .dayplan-mobile-controls {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        border: 1px solid rgba(198, 210, 255, 0.105) !important;
        border-radius: 16px !important;
        background: linear-gradient(180deg, rgba(17, 20, 30, 0.78), rgba(8, 11, 17, 0.78)) !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035) !important;
        overflow: hidden !important;
    }

    .dayplan-mobile-controls-summary {
        display: grid !important;
        grid-template-columns: auto auto minmax(0, 1fr) 20px !important;
        align-items: center !important;
        gap: 6px !important;
        min-height: 48px !important;
        height: 48px !important;
        padding: 0 12px !important;
        list-style: none !important;
        cursor: pointer !important;
        color: rgba(238, 236, 229, 0.90) !important;
    }

    .dayplan-mobile-controls-summary::-webkit-details-marker {
        display: none !important;
    }

    .dayplan-mobile-controls-label {
        color: rgba(172, 181, 212, 0.72) !important;
        font-size: 0.64rem !important;
        font-weight: 820 !important;
        letter-spacing: 0.10em !important;
        text-transform: uppercase !important;
    }

    .dayplan-mobile-controls-value {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.86rem !important;
        font-weight: 760 !important;
    }

    .dayplan-mobile-controls-date {
        color: rgba(226, 229, 239, 0.84) !important;
        font-weight: 650 !important;
    }

    .dayplan-mobile-controls-separator {
        color: rgba(172, 181, 212, 0.54) !important;
        font-size: 0.86rem !important;
        line-height: 1 !important;
    }

    .dayplan-mobile-controls-person {
        color: rgba(246, 244, 237, 0.92) !important;
        font-weight: 780 !important;
    }

    .dayplan-mobile-controls-icon {
        width: 20px !important;
        height: 20px !important;
        color: rgba(202, 207, 222, 0.68) !important;
        transition: transform 140ms ease-out !important;
    }

    .dayplan-mobile-controls[open] .dayplan-mobile-controls-icon {
        transform: rotate(180deg) !important;
    }

    .dayplan-mobile-controls .dayplan-toolbar-row {
        margin: 0 !important;
        border-width: 1px 0 0 !important;
        border-radius: 0 !important;
        background: rgba(5, 7, 12, 0.18) !important;
        box-shadow: none !important;
    }

    .dayplan-mobile-controls:not([open]) .dayplan-toolbar-row {
        display: none !important;
    }

    .dayplan-section {
        margin-top: 0 !important;
    }

    .dayplan-mobile-controls + .dayplan-section {
        margin-top: 0 !important;
    }

    .dayplan-section-title {
        margin: 0 0 8px !important;
        font-size: 0.98rem !important;
        line-height: 1.1 !important;
    }

    html body .dayplan-page .dayplan-card.dayplan-card-timeline {
        display: grid !important;
        grid-template-columns: 72px minmax(0, 1fr) !important;
        align-items: start !important;
        column-gap: 10px !important;
        row-gap: 0 !important;
        position: relative !important;
        padding: 0 !important;
        min-height: 0 !important;
        overflow: visible !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-rail-time {
        position: relative !important;
        z-index: 2 !important;
        top: auto !important;
        left: auto !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: start !important;
        width: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        height: 24px !important;
        margin: 12px 0 0 0 !important;
        padding: 0 6px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 999px !important;
        background: rgba(126, 142, 201, 0.11) !important;
        border: 1px solid rgba(172, 185, 238, 0.12) !important;
        color: rgba(178, 190, 244, 0.90) !important;
        font-size: 0.69rem !important;
        font-weight: 820 !important;
        line-height: 1 !important;
        text-align: center !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: clip !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-rail-track {
        display: none !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-card-shell {
        grid-column: 2 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
        width: 100% !important;
        min-height: 72px !important;
        padding: 11px 12px !important;
        border-radius: 15px !important;
    }

    html body .dayplan-page .dayplan-card-timeline-collapsed .dayplan-card-shell {
        min-height: 72px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 24px !important;
        align-items: start !important;
        column-gap: 8px !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-card-main {
        min-width: 0 !important;
        display: grid !important;
        gap: 5px !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-card-title {
        font-size: 0.93rem !important;
        line-height: 1.15 !important;
        margin-top: 0 !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-wrap: normal !important;
        word-break: normal !important;
    }

    .dayplan-card-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        margin-top: 8px !important;
    }

    .dayplan-card-actions .mud-button-root,
    .dayplan-card-actions .mud-icon-button {
        min-height: 34px !important;
        height: 34px !important;
    }

    html body .dayplan-page .dayplan-empty-card,
    html body .dayplan-page .app-empty-state,
    html body .dayplan-page .dayplan-card-anytime,
    html body .dayplan-page .dayplan-card-done {
        display: block !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
        padding: 10px 12px !important;
        min-height: 0 !important;
    }

    html body .dayplan-page .dayplan-empty-card {
        display: grid !important;
        grid-template-columns: 34px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 10px !important;
        row-gap: 2px !important;
        border-radius: 16px !important;
    }

    html body .dayplan-page .app-empty-state-icon,
    html body .dayplan-page .dayplan-card-icon {
        width: 34px !important;
        height: 34px !important;
        min-width: 34px !important;
    }

    html body .dayplan-page .dayplan-card-anytime-inner {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;
    }

    html body .dayplan-page .dayplan-card-anytime .dayplan-card-main,
    html body .dayplan-page .dayplan-card-done .dayplan-card-main {
        display: grid !important;
        gap: 4px !important;
        min-width: 0 !important;
        width: 100% !important;
        padding: 0 !important;
    }

    html body .dayplan-page .dayplan-card-anytime .dayplan-card-actions,
    html body .dayplan-page .dayplan-card-done .dayplan-card-actions {
        grid-column: 1 !important;
        justify-content: flex-start !important;
        margin-top: 8px !important;
    }

    html body .dayplan-page .dayplan-card-kicker {
        margin: 0 !important;
        line-height: 1 !important;
    }

    html body .dayplan-page .app-empty-state-title,
    html body .dayplan-page .dayplan-card-anytime .dayplan-card-title,
    html body .dayplan-page .dayplan-card-done .dayplan-card-title {
        line-height: 1.12 !important;
    }

    html body .dayplan-page .app-empty-state-message,
    html body .dayplan-page .dayplan-card-notes,
    html body .dayplan-page .dayplan-card-meta {
        line-height: 1.22 !important;
    }

    html body .dayplan-page .dayplan-done-panel,
    html body .dayplan-page .dayplan-done-panel .mud-expand-panel,
    html body .dayplan-page .dayplan-done-panel .mud-paper {
        border-radius: 16px !important;
        min-height: 0 !important;
    }

    html body .dayplan-page .dayplan-done-panel .mud-expand-panel-header {
        min-height: 48px !important;
        padding: 0 12px !important;
    }

    html body .dayplan-page .dayplan-done-header {
        min-height: 48px !important;
        display: flex !important;
        align-items: center !important;
        gap: 6px !important;
        line-height: 1 !important;
    }

    html body .dayplan-page .dayplan-done-panel .mud-expand-panel-content {
        padding: 0 12px 12px !important;
    }

    .maintenance-page {
        margin-inline: 0 !important;
    }

    .maintenance-page .app-page-shell-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: start !important;
        gap: 8px !important;
    }

    .maintenance-page .app-page-shell-toolbar,
    .maintenance-page .app-page-context-chip-row {
        justify-self: start !important;
        max-width: 100% !important;
    }

    .maintenance-page-content,
    .maintenance-section-stack,
    .maintenance-scheduled-panels {
        gap: 10px !important;
    }

    .maintenance-quick-filter-bar {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 7px !important;
        padding: 7px !important;
        border-radius: 16px !important;
    }

    .maintenance-quick-filter-chips {
        overflow-x: auto !important;
        scrollbar-width: none !important;
    }

    .maintenance-quick-filter-chips::-webkit-scrollbar {
        display: none !important;
    }

    .maintenance-section-card,
    .maintenance-group-card,
    .maintenance-scheduled-panels .mud-expand-panel {
        padding: 10px !important;
        border-radius: 16px !important;
    }

    .maintenance-page .maintenance-item-card {
        padding: 0 !important;
        border-radius: 14px !important;
    }

    .maintenance-page .maintenance-item-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        padding: 10px !important;
    }

    .maintenance-page .maintenance-item-main,
    .maintenance-page .maintenance-item-top,
    .maintenance-page .maintenance-item-tags {
        min-width: 0 !important;
        width: 100% !important;
    }

    .maintenance-page .maintenance-item-top {
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: flex-start !important;
    }

    .maintenance-page .maintenance-item-title {
        width: 100% !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        font-size: 0.92rem !important;
        line-height: 1.18 !important;
    }

    .maintenance-page .maintenance-item-actions {
        grid-column: 1 !important;
        grid-row: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        justify-content: space-between !important;
        gap: 7px !important;
    }

    .maintenance-page .maintenance-item-primary-actions {
        flex: 1 1 auto !important;
    }

    .maintenance-page .maintenance-item-primary-actions .mud-button-root {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 34px !important;
        height: 34px !important;
    }

    .maintenance-page .maintenance-item-secondary-actions .mud-icon-button-root,
    .maintenance-page .maintenance-item-secondary-actions .mud-menu-button-root,
    .maintenance-page .maintenance-item-secondary-actions .mud-icon-button,
    .maintenance-page .maintenance-item-secondary-actions .mud-menu-button {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
    }

    .ios-contacts-page .network-contact-grid,
    .ios-contacts-page .network-contact-grid-emergency {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 9px !important;
    }

    .ios-contacts-page .network-contact-card {
        display: grid !important;
        grid-template-columns: 44px minmax(0, 1fr) auto !important;
        gap: 9px !important;
        min-height: 74px !important;
        padding: 10px !important;
    }

    .ios-contacts-page .network-contact-avatar {
        width: 44px !important;
        min-width: 44px !important;
        height: 44px !important;
    }

    .ios-contacts-page .network-contact-title,
    .ios-contacts-page .network-contact-meta {
        min-width: 0 !important;
        overflow-wrap: anywhere !important;
    }

    .ios-contacts-page .network-contact-actions {
        gap: 5px !important;
    }

    .ios-contacts-page .network-contact-actions .mud-icon-button {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
    }

    .shopping-store-group,
    .shopping-section-card,
    .shopping-filter-card {
        padding: 10px !important;
        border-radius: 16px !important;
    }

    .shopping-item-row,
    .shopping-item-row.bought {
        min-height: 0 !important;
        padding: 10px !important;
        border-radius: 14px !important;
    }

    .shopping-item-actions {
        position: static !important;
        width: 100% !important;
    }

    .schoolrunsweek-day-card {
        padding: 10px !important;
        border-radius: 16px !important;
        gap: 8px !important;
    }

    .schoolrunsweek-slot-card,
    .schoolrunsweek-slot-content,
    .schoolrunsweek-assignment-card {
        padding: 8px !important;
        border-radius: 14px !important;
    }

    .schoolrunsweek-slot-add-button.mud-button-root {
        width: auto !important;
        min-height: 32px !important;
        padding-inline: 9px !important;
        font-size: 0.72rem !important;
    }

    .schoolrunsweek-empty {
        display: block !important;
        padding: 8px 9px !important;
        min-height: 0 !important;
        font-size: 0.76rem !important;
    }

    .notes-command-bar,
    .notes-filter-panel {
        padding: 9px !important;
        border-radius: 16px !important;
    }

    .notes-command-left,
    .notes-filter-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    .notes-command-select .mud-input,
    .notes-command-select .mud-input-slot,
    .notes-search-field .mud-input,
    .notes-search-field .mud-input-slot {
        min-height: 42px !important;
        height: 42px !important;
        color: rgba(237, 233, 225, 0.92) !important;
    }

    .notes-editor-pane.notes-editor-canvas,
    .notes-editor-shell {
        min-height: 0 !important;
        padding: 12px !important;
        border-radius: 18px !important;
    }

    .notes-notepad {
        min-height: 210px !important;
        height: clamp(210px, 34dvh, 360px) !important;
    }

    .notes-action-row,
    .notes-briefing-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
    }

    .notes-action-button.mud-button-root {
        flex: 1 1 calc(50% - 7px) !important;
        min-width: 0 !important;
    }

    .profile-command-rail,
    .profile-category-rail {
        padding: 8px !important;
    }

    .profile-category-rail {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scrollbar-width: none !important;
    }

    .profile-category-rail::-webkit-scrollbar {
        display: none !important;
    }

    .settings-card,
    .settings-mobile-card,
    .feature-card,
    .profile-memory-card,
    .profile-panel {
        padding: 10px !important;
        border-radius: 16px !important;
        min-height: 0 !important;
    }

    .preferences-page,
    .settings-page {
        overflow-wrap: anywhere !important;
    }

    .preferences-page .mud-button-root,
    .settings-page .mud-button-root {
        white-space: normal !important;
    }

    html body .mud-dialog-container {
        align-items: flex-start !important;
        padding: 6px !important;
        overflow: hidden !important;
    }

    html body .mud-dialog-container .mud-dialog:not(.mud-dialog-fullscreen) {
        width: calc(100vw - 12px) !important;
        max-width: calc(100vw - 12px) !important;
        height: calc(100dvh - 12px) !important;
        max-height: calc(100dvh - 12px) !important;
        min-height: 0 !important;
        margin: 0 !important;
        border-radius: 20px !important;
        overflow: hidden !important;
    }

    html body .mud-dialog-container .mud-dialog-title {
        min-height: 48px !important;
        padding: 11px 13px !important;
    }

    html body .mud-dialog-container .mud-dialog-title .mud-typography {
        font-size: 1.02rem !important;
        line-height: 1.1 !important;
    }

    html body .mud-dialog-container .mud-dialog-content {
        padding: 9px 9px 12px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    html body .mud-dialog-container .mud-dialog-actions {
        min-height: 58px !important;
        padding: 8px 9px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
        gap: 8px !important;
    }

    html body .mud-dialog-container .config-dialog-shell,
    html body .mud-dialog-container .event-edit-dialog-shell,
    html body .mud-dialog-container .shopping-dialog-shell,
    html body .mud-dialog-container .maintenance-dialog-shell,
    html body .mud-dialog-container .dayplan-edit-dialog-shell,
    html body .mud-dialog-container .profile-dialog-shell {
        gap: 9px !important;
    }

    html body .mud-dialog-container .config-dialog-section,
    html body .mud-dialog-container .event-edit-section,
    html body .mud-dialog-container .shopping-dialog-section,
    html body .mud-dialog-container .maintenance-dialog-section,
    html body .mud-dialog-container .dayplan-edit-section,
    html body .mud-dialog-container .profile-dialog-section {
        padding: 10px !important;
        border-radius: 15px !important;
    }

    html body .mud-dialog-container .config-dialog-section-header,
    html body .mud-dialog-container .profile-dialog-section-header {
        margin-bottom: 8px !important;
    }

    html body .mud-dialog-container .config-dialog-grid,
    html body .mud-dialog-container .config-dialog-grid-two,
    html body .mud-dialog-container .maintenance-form-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 9px !important;
    }

    html body .mud-dialog-container .event-edit-dialog-shell .config-dialog-grid-two {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    html body .mud-dialog-container .event-schedule-picker {
        min-width: 0 !important;
    }

    html body .mud-dialog-container .event-schedule-picker .mud-input-control-input-container,
    html body .mud-dialog-container .event-schedule-picker .mud-input {
        min-height: 48px !important;
        height: 48px !important;
        max-height: 48px !important;
    }

    html body .mud-dialog-container .event-schedule-picker .mud-input-slot {
        min-height: 48px !important;
        height: 48px !important;
        line-height: 48px !important;
        padding: 14px 38px 4px 10px !important;
        font-size: 0.82rem !important;
    }

    html body .mud-dialog-container .event-schedule-picker .mud-input-label,
    html body .mud-dialog-container .event-schedule-picker .mud-input-label.mud-shrink,
    html body .mud-dialog-container .event-schedule-picker .mud-input-label.mud-input-label-animate {
        max-width: calc(100% - 18px) !important;
        transform: translate(10px, 4px) scale(0.78) !important;
        transform-origin: top left !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        letter-spacing: 0.08em !important;
    }

    html body .mud-dialog-container .event-schedule-picker .mud-input-adornment {
        width: 34px !important;
        min-width: 34px !important;
    }

    html body .mud-dialog-container textarea.mud-input-slot,
    html body .mud-dialog-container .mud-input-control:has(textarea) .mud-input {
        min-height: 82px !important;
    }

    html body .mud-dialog-container .mud-numeric-field,
    html body .mud-dialog-container .mud-numeric-field .mud-input {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body .mud-dialog-container .mud-input-number-control .mud-input-numeric-spin,
    html body .mud-dialog-container .dayplan-edit-section .mud-input-numeric-spin {
        display: none !important;
    }

    html body .mud-dialog-container .mud-input-number-control input.mud-input-slot {
        padding-right: 12px !important;
    }

    html body .mud-dialog-container .mud-picker.mud-picker-inline,
    html body .mud-dialog-container .mud-picker.mud-picker-input-button,
    html body .mud-dialog-container .event-schedule-picker.mud-picker {
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
    }

    html body .mud-dialog-container .mud-picker.mud-picker-inline .mud-input-control,
    html body .mud-dialog-container .mud-picker.mud-picker-input-button .mud-input-control,
    html body .mud-dialog-container .mud-picker.mud-picker-inline .mud-input-control-input-container,
    html body .mud-dialog-container .mud-picker.mud-picker-input-button .mud-input-control-input-container,
    html body .mud-dialog-container .mud-picker.mud-picker-inline .mud-input,
    html body .mud-dialog-container .mud-picker.mud-picker-input-button .mud-input {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body .mud-popover,
    html body .mud-menu {
        max-width: calc(100vw - 16px) !important;
        min-width: min(260px, calc(100vw - 16px)) !important;
        box-sizing: border-box !important;
        z-index: 1900 !important;
    }

    html body .mud-popover.mud-popover-open {
        left: max(8px, env(safe-area-inset-left, 0px)) !important;
        right: max(8px, env(safe-area-inset-right, 0px)) !important;
        width: auto !important;
        transform: none !important;
    }

    html body .mud-popover .mud-list,
    html body .mud-menu .mud-list {
        max-height: min(52dvh, 390px) !important;
        overflow-y: auto !important;
        padding: 6px !important;
    }

    html body .mud-list-item,
    html body .mud-list-item-gutters {
        min-height: 42px !important;
        padding: 9px 11px !important;
        border-radius: 12px !important;
    }

    html body .mud-picker-container,
    html body .mud-picker {
        max-width: calc(100vw - 16px) !important;
        max-height: min(78dvh, 620px) !important;
        overflow-y: auto !important;
    }

    html body .mud-picker .mud-picker-toolbar {
        min-height: 52px !important;
        padding: 8px 12px !important;
    }

    html body .mud-picker-calendar,
    html body .mud-picker-calendar-content {
        max-width: calc(100vw - 24px) !important;
    }

    html body .mud-picker-calendar .mud-button-root,
    html body .mud-picker-calendar .mud-picker-calendar-day {
        min-width: 38px !important;
        width: 38px !important;
        height: 38px !important;
        min-height: 38px !important;
        font-size: 0.86rem !important;
    }

    html body .mud-picker-calendar-header,
    html body .mud-picker-calendar-transition {
        max-width: 100% !important;
    }

    html body .mud-picker-clock {
        transform: scale(0.86) !important;
        transform-origin: top center !important;
        margin-bottom: -24px !important;
    }
}

@media (max-width: 380px) {
    .dayplan-card.dayplan-card-timeline {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 0 !important;
    }

    .dayplan-rail-time {
        min-width: 42px !important;
        max-width: 54px !important;
        font-size: 0.66rem !important;
    }

    .dayplan-card-shell {
        padding-left: 66px !important;
    }

    html body .mud-dialog-container .event-edit-dialog-shell .config-dialog-grid-two {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    html body .mud-dialog-container .event-schedule-picker .mud-input-slot {
        padding-inline: 8px 34px !important;
        font-size: 0.78rem !important;
    }

    .ios-contacts-page .network-contact-card {
        grid-template-columns: 40px minmax(0, 1fr) auto !important;
    }

    .ios-contacts-page .network-contact-avatar {
        width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
    }
}

/* Mobile recovery owner: restore dense operational layouts without broad page overrides. */
@media (max-width: 640px) {
    :root {
        --omni-mobile-bottomnav-h: 50px;
        --omni-mobile-shell-bottom-clearance: calc(var(--omni-mobile-bottomnav-h) + env(safe-area-inset-bottom, 0px) + 34px);
    }

    html body .mud-layout > .mud-main-content.app-main-content {
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
    }

    html body .app-page,
    html body .app-page-shell,
    html body .dayplan-page,
    html body .shopping-ios-page,
    html body .ios-contacts-page,
    html body .schoolrunsweek-page {
        padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
        scroll-padding-bottom: var(--omni-mobile-shell-bottom-clearance) !important;
    }

    html body nav.mobile-bottom-nav {
        left: 12px !important;
        right: 12px !important;
        bottom: max(8px, env(safe-area-inset-bottom, 0px)) !important;
        width: auto !important;
        height: var(--omni-mobile-bottomnav-h) !important;
        min-height: var(--omni-mobile-bottomnav-h) !important;
        max-height: var(--omni-mobile-bottomnav-h) !important;
        padding: 4px !important;
        border-radius: 18px !important;
    }

    html body .mobile-bottom-nav-item {
        min-height: 40px !important;
        height: 40px !important;
        padding: 3px 4px !important;
        border-radius: 13px !important;
        font-size: 0.66rem !important;
        line-height: 1 !important;
    }

    html body .mobile-bottom-nav-item .mud-icon-root {
        width: 18px !important;
        height: 18px !important;
        font-size: 18px !important;
    }

    html body .dayplan-page .dayplan-toolbar-row-desktop {
        display: none !important;
    }

    html body .dayplan-page .dayplan-mobile-controls {
        display: block !important;
        margin: 0 0 14px !important;
        border-radius: 16px !important;
    }

    html body .dayplan-page .dayplan-mobile-controls-summary {
        display: grid !important;
        grid-template-columns: minmax(0, auto) auto minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 6px !important;
        min-height: 48px !important;
        height: 48px !important;
        padding: 0 14px !important;
        font-size: 0.9rem !important;
        line-height: 1 !important;
    }

    html body .dayplan-page .dayplan-mobile-controls-value {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body .dayplan-page .dayplan-mobile-controls-person {
        font-weight: 760 !important;
    }

    html body .dayplan-page .dayplan-section-title {
        margin: 0 0 8px !important;
        font-size: 0.98rem !important;
        line-height: 1.08 !important;
    }

    html body .dayplan-page .dayplan-list:has(.dayplan-card-timeline) {
        display: grid !important;
        gap: 8px !important;
    }

    html body .dayplan-page .dayplan-card.dayplan-card-timeline,
    html body .dayplan-page .dayplan-card-timeline.mud-paper {
        display: grid !important;
        grid-template-columns: 56px minmax(0, 1fr) !important;
        column-gap: 8px !important;
        min-height: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-rail-time {
        grid-column: 1 !important;
        justify-self: end !important;
        align-self: start !important;
        width: 56px !important;
        min-width: 56px !important;
        max-width: 56px !important;
        height: 24px !important;
        margin: 8px 0 0 !important;
        padding: 0 6px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 999px !important;
        font-size: 0.66rem !important;
        line-height: 1 !important;
        font-variant-numeric: tabular-nums !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-rail-track,
    html body .dayplan-page .dayplan-card-timeline .dayplan-rail-dot {
        display: none !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-card-shell {
        grid-column: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 58px !important;
        padding: 10px 12px !important;
        border-radius: 15px !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-card-main {
        display: grid !important;
        gap: 3px !important;
        min-width: 0 !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-card-title {
        margin: 0 !important;
        font-size: 0.92rem !important;
        line-height: 1.14 !important;
    }

    html body .dayplan-page .dayplan-card-timeline-collapsed .dayplan-card-shell,
    html body .dayplan-page .dayplan-card-title-only .dayplan-card-shell {
        min-height: 52px !important;
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
    }

    html body .dayplan-page .dayplan-card-timeline .dayplan-collapsed-expand-icon {
        justify-self: end !important;
        align-self: center !important;
        width: 18px !important;
        height: 18px !important;
        font-size: 18px !important;
    }

    html body .dayplan-page .dayplan-empty-card,
    html body .dayplan-page .app-empty-state.dayplan-empty-card {
        min-height: 0 !important;
        padding: 11px 13px !important;
        border-radius: 16px !important;
    }

    html body .ios-contacts-page .app-page-title,
    html body .shopping-ios-page .app-page-title {
        font-size: 1.45rem !important;
        line-height: 1.04 !important;
        margin-bottom: 4px !important;
    }

    html body .ios-contacts-page .app-page-context,
    html body .shopping-ios-page .app-page-context {
        display: none !important;
    }

    html body .ios-contacts-page .network-filter-bar,
    html body .shopping-ios-page .shopping-filter-card {
        margin-bottom: 10px !important;
        padding: 5px !important;
        border-radius: 15px !important;
    }

    html body .ios-contacts-page .network-filter-bar {
        display: flex !important;
        flex-wrap: nowrap !important;
        gap: 6px !important;
        overflow-x: auto !important;
        scrollbar-width: none !important;
    }

    html body .ios-contacts-page .network-filter-bar::-webkit-scrollbar {
        display: none !important;
    }

    html body .ios-contacts-page .network-filter-bar .mud-chip,
    html body .shopping-ios-page .shopping-filter-chips .mud-chip {
        flex: 0 0 auto !important;
        min-height: 32px !important;
        height: 32px !important;
        padding-inline: 11px !important;
        font-size: 0.74rem !important;
    }

    html body .ios-contacts-page .ios-contact-group {
        margin-top: 12px !important;
    }

    html body .ios-contacts-page .ios-contact-group-title {
        margin: 0 0 7px !important;
        font-size: 0.7rem !important;
        line-height: 1 !important;
        letter-spacing: 0.16em !important;
    }

    html body .ios-contacts-page .network-contact-grid,
    html body .ios-contacts-page .network-contact-grid-emergency {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 7px !important;
    }

    html body .ios-contacts-page .network-contact-card,
    html body .ios-contacts-page .network-contact-card.ios-contact-row {
        display: grid !important;
        grid-template-columns: 42px minmax(0, 1fr) auto !important;
        grid-template-areas: "avatar body actions" !important;
        align-items: center !important;
        gap: 8px !important;
        min-height: 70px !important;
        padding: 8px 9px !important;
        border-radius: 15px !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-avatar {
        grid-area: avatar !important;
        width: 42px !important;
        min-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        font-size: 0.72rem !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-main {
        grid-area: body !important;
        display: grid !important;
        gap: 2px !important;
        min-width: 0 !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-name-row {
        display: flex !important;
        align-items: center !important;
        min-width: 0 !important;
        gap: 5px !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-name {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.92rem !important;
        line-height: 1.08 !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-badge,
    html body .ios-contacts-page .network-contact-card .ios-contact-meta {
        display: none !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-subtitle {
        display: flex !important;
        gap: 4px !important;
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.74rem !important;
        line-height: 1.15 !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-role {
        min-width: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-phone {
        flex: 0 0 auto !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-actions {
        grid-area: actions !important;
        display: flex !important;
        gap: 4px !important;
        min-width: max-content !important;
    }

    html body .ios-contacts-page .network-contact-card .ios-contact-actions .mud-icon-button,
    html body .ios-contacts-page .network-contact-card .ios-contact-actions .mud-icon-button-root,
    html body .ios-contacts-page .network-contact-card .ios-contact-actions .mud-menu-button-root,
    html body .ios-contacts-page .network-contact-card .contact-card-menu-trigger {
        width: 34px !important;
        min-width: 34px !important;
        height: 34px !important;
        min-height: 34px !important;
        padding: 0 !important;
        border-radius: 11px !important;
    }

    html body .shopping-ios-page .shopping-section-card,
    html body .shopping-ios-page .mud-paper.shopping-section-card {
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body .shopping-ios-page .shopping-store-group {
        display: grid !important;
        gap: 0 !important;
        margin: 0 0 10px !important;
        padding: 9px 10px 2px !important;
        border-radius: 16px !important;
        overflow: hidden !important;
    }

    html body .shopping-ios-page .shopping-store-header {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        gap: 4px 8px !important;
        padding-bottom: 7px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
    }

    html body .shopping-ios-page .shopping-store-header .mud-typography {
        font-size: 0.9rem !important;
        line-height: 1.08 !important;
    }

    html body .shopping-ios-page .shopping-store-meta {
        font-size: 0.68rem !important;
        line-height: 1 !important;
    }

    html body .shopping-ios-page .shopping-item-row,
    html body .shopping-ios-page .shopping-item-row.bought,
    html body .shopping-ios-page .shopping-item-row.shopping-item-row-important {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 104px !important;
        grid-template-areas:
            "main actions"
            "store actions" !important;
        align-items: center !important;
        gap: 4px 8px !important;
        min-height: 62px !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        border: 0 !important;
        border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body .shopping-ios-page .shopping-item-main {
        grid-area: main !important;
        display: grid !important;
        gap: 2px !important;
        min-width: 0 !important;
    }

    html body .shopping-ios-page .shopping-item-name,
    html body .shopping-ios-page .shopping-item-title {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.88rem !important;
        line-height: 1.1 !important;
    }

    html body .shopping-ios-page .shopping-item-detail {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.72rem !important;
        line-height: 1.1 !important;
    }

    html body .shopping-ios-page .shopping-item-badges,
    html body .shopping-ios-page .shopping-item-meta,
    html body .shopping-ios-page .shopping-item-note,
    html body .shopping-ios-page .shopping-item-detail-separator {
        display: none !important;
    }

    html body .shopping-ios-page .shopping-item-row::after {
        content: attr(data-store);
        grid-area: store;
        justify-self: start;
        max-width: min(160px, 100%);
        height: 21px;
        padding: 0 8px;
        display: inline-flex;
        align-items: center;
        border: 1px solid rgba(145, 160, 224, 0.22);
        border-radius: 999px;
        color: rgba(207, 213, 235, 0.78);
        background: rgba(120, 134, 190, 0.10);
        font-size: 0.62rem;
        font-weight: 760;
        line-height: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    html body .shopping-ios-page .shopping-item-actions {
        grid-area: actions !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 5px !important;
        width: 104px !important;
        min-width: 104px !important;
        position: static !important;
        overflow: visible !important;
    }

    html body .shopping-ios-page .shopping-item-actions > *,
    html body .shopping-ios-page .shopping-item-actions .mud-button-root,
    html body .shopping-ios-page .shopping-item-actions .mud-menu,
    html body .shopping-ios-page .shopping-item-actions .mud-menu-button,
    html body .shopping-ios-page .shopping-item-actions .mud-menu-button-root,
    html body .shopping-ios-page .shopping-item-actions .mud-icon-button-root {
        position: static !important;
        inset: auto !important;
        transform: none !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    html body .shopping-ios-page .shopping-item-bought-button.mud-button-root {
        min-width: 68px !important;
        width: auto !important;
        height: 34px !important;
        min-height: 34px !important;
        padding-inline: 10px !important;
        border-radius: 11px !important;
        font-size: 0.72rem !important;
        flex: 0 0 auto !important;
    }

    html body .shopping-ios-page .shopping-item-actions .mud-menu,
    html body .shopping-ios-page .shopping-item-actions .mud-menu-button,
    html body .shopping-ios-page .shopping-item-actions .mud-menu-button-root {
        width: 32px !important;
        min-width: 32px !important;
        max-width: 32px !important;
        flex: 0 0 32px !important;
    }

    html body .shopping-ios-page .shopping-item-actions .mud-icon-button-root,
    html body .shopping-ios-page .shopping-item-actions .mud-menu-button-root {
        width: 32px !important;
        min-width: 32px !important;
        height: 32px !important;
        min-height: 32px !important;
        border-radius: 10px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-toolbar {
        margin-bottom: 10px !important;
        padding: 6px !important;
        border-radius: 15px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-days {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-day-card {
        gap: 6px !important;
        padding: 9px 10px !important;
        border-radius: 16px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-day-header {
        padding: 0 0 6px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
        background: transparent !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-stack {
        display: grid !important;
        gap: 0 !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-card,
    html body .schoolrunsweek-page .mud-paper.schoolrunsweek-slot-card {
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-card + .schoolrunsweek-slot-card {
        border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-content {
        display: grid !important;
        grid-template-columns: 112px minmax(0, 1fr) auto !important;
        grid-template-areas: "label body add" !important;
        align-items: center !important;
        gap: 6px !important;
        min-height: 46px !important;
        padding: 8px 0 !important;
        border: 0 !important;
        background: transparent !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-header {
        display: contents !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-title {
        grid-area: label !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.74rem !important;
        line-height: 1 !important;
        letter-spacing: 0 !important;
        text-transform: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-add-button.mud-button-root {
        grid-area: add !important;
        width: 34px !important;
        min-width: 34px !important;
        height: 32px !important;
        min-height: 32px !important;
        padding: 0 !important;
        border-radius: 11px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-add-button .mud-button-label {
        font-size: 0 !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-slot-add-button .mud-icon-root {
        margin: 0 !important;
        font-size: 18px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-empty,
    html body .schoolrunsweek-page .app-empty-state-inline.schoolrunsweek-empty {
        grid-area: body !important;
        min-height: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-empty .app-empty-state-icon,
    html body .schoolrunsweek-page .schoolrunsweek-empty .app-empty-state-eyebrow,
    html body .schoolrunsweek-page .schoolrunsweek-empty .app-empty-state-message,
    html body .schoolrunsweek-page .schoolrunsweek-empty .mud-icon-root {
        display: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-empty .app-empty-state-title,
    html body .schoolrunsweek-page .schoolrunsweek-empty-title {
        margin: 0 !important;
        color: rgba(203, 207, 221, 0.66) !important;
        font-size: 0.7rem !important;
        line-height: 1.1 !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-assignment-card,
    html body .schoolrunsweek-page .mud-paper.schoolrunsweek-assignment-card {
        grid-area: body !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-assignment-grid {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        gap: 5px !important;
        min-height: 32px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-assignment-name {
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        font-size: 0.76rem !important;
        line-height: 1.05 !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-assignment-meta,
    html body .schoolrunsweek-page .schoolrunsweek-chip-row,
    html body .schoolrunsweek-page .schoolrunsweek-assignment-blank {
        display: none !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-assignment-actions {
        display: flex !important;
        align-items: center !important;
        gap: 3px !important;
    }

    html body .schoolrunsweek-page .schoolrunsweek-inline-edit.mud-icon-button,
    html body .schoolrunsweek-page .schoolrunsweek-delete-button.mud-icon-button {
        width: 26px !important;
        min-width: 26px !important;
        height: 26px !important;
        min-height: 26px !important;
        padding: 0 !important;
        border-radius: 9px !important;
    }
}

@media (max-width: 767px) {
    html body .ios-calendar-page .ios-calendar-mode-row.schedule-view-action-row {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 8px 0 0 !important;
        padding: 0 !important;
    }

    html body .ios-calendar-page .ios-calendar-mode-row.schedule-view-action-row > .ios-calendar-view-switch,
    html body .ios-calendar-page .ios-calendar-mode-row.schedule-view-action-row .ios-calendar-view-switch {
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        justify-self: stretch !important;
    }

    html body .ios-calendar-page .ios-calendar-mode-row.schedule-view-action-row > .ios-calendar-generate-button,
    html body .ios-calendar-page .ios-calendar-mode-row.schedule-view-action-row .ios-calendar-generate-button {
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        justify-self: stretch !important;
    }
}