@layer legacy, hilaac;
    @layer legacy {
    :root { color-scheme: light; font-family: Inter, ui-sans-serif, system-ui, sans-serif; color: var(--mi-ink-cool); background: #f4f7f9; }
    * { box-sizing: border-box; }
    body { margin: 0; }
    a { color: var(--mi-accent-blue-3); }
    .topbar { min-height: 64px; padding: 12px 5vw; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; background: #0e3854; color: #fff; }
    .app-shell { min-height: 100vh; display: grid; grid-template-columns: 216px minmax(0, 1fr); background: #eef3f4; }
    .sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 26px 14px 18px; background: #103f4e; color: var(--mi-text-ice-2); }
    .sidebar-brand { padding: 0 12px 28px; }
    .sidebar-brand .brand { display: block; color: #fff; font-size: 1.05rem; text-decoration: none; }
    .sidebar-brand span { display: block; margin-top: 3px; color: #9cc8ca; font-size: .72rem; }
    .sidebar-section-label { padding: 0 12px 14px; color: #71d4cc; font-size: .68rem; font-weight: 800; letter-spacing: .16em; }
    .sidebar-nav { display: grid; gap: 5px; flex: 1; }
    .sidebar-nav a { display: block; padding: 11px 12px; border-radius: 10px; color: var(--mi-text-ice-2); text-decoration: none; font-size: .88rem; font-weight: 650; }
    .sidebar-nav a:hover, .sidebar-nav a:focus-visible { background: #205f68; color: #fff; }
    .sidebar-nav .divider { display: none; }
    .sidebar-status { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 7px; padding: 14px 12px 0; color: var(--mi-text-ice-2); font-size: .76rem; }
    .sidebar-status small { grid-column: 2; color: #9cc8ca; font-size: .7rem; }
    .status-dot { width: 7px; height: 7px; border-radius: 50%; background: #57e09e; }
    .app-main { min-width: 0; }
    .page-header { min-height: 80px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 28px; background: #fff; border: 1px solid #d9e4e5; border-top: 0; }
    .page-title { color: var(--mi-ink-cool); font-size: 1.3rem; font-weight: 750; }
    .page-header .tenant { color: #6b8190; }
    .page-header .account-menu { margin-left: auto; }
    .page-header .account-actions { background: #f1f7f7; border-color: #d9e4e5; }
    .page-header .account-action { color: var(--mi-text-teal-deep); }
    .page-header .account-action:hover { background: #dcefee; color: #103f4e; }
    .page-header .language-picker select { background: #fff; border-color: #b9d3d4; color: var(--mi-text-teal-deep); }
    .page-header .account-identity { color: var(--mi-text-teal-deep); }
    .page-header .account-role { color: #6b8190; }
    .app-main > main { width: min(1680px, calc(100% - 48px)); padding: 34px 28px 64px; }
    .topbar a { color: var(--mi-text-ice); text-decoration: none; }
    .brand { font-weight: 800; font-size: 1.1rem; }
    .tenant { display: block; color: #a9c9da; font-size: .8rem; margin-top: 3px; }
    nav { flex: 1; }
    .divider { color: #6f9ab2; margin: 0 6px; }
    .account-menu { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: .9rem; }
    .account-identity { color: var(--mi-text-ice); white-space: nowrap; }
    .account-role { color: #a9c9da; }
    .account-actions { display: flex; align-items: center; gap: 2px; padding: 3px; background: #174b69; border: 1px solid #2f6681; border-radius: 8px; }
    .account-action { border: 0; border-radius: 5px; padding: 5px 8px; background: transparent; color: var(--mi-text-ice); font-size: .82rem; font-weight: 650; cursor: pointer; text-decoration: none; white-space: nowrap; }
    .account-action:hover { background: #28617f; color: #fff; }
    .language-picker { display: inline-flex; gap: 0; align-items: center; }
    .language-picker select { width: auto; min-width: 92px; padding: 5px 7px; border: 1px solid #2f6681; border-radius: 5px; background: #174b69; color: var(--mi-text-ice); font-size: .82rem; cursor: pointer; }
    .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
    .link-button { border: 0; padding: 0; background: transparent; color: var(--mi-text-ice); cursor: pointer; text-decoration: underline; font: inherit; }
    main { width: min(1480px, calc(100% - 48px)); margin: 0 auto; padding: 36px 24px 72px; }
    h1 { margin: 0 0 8px; font-size: clamp(1.7rem, 3vw, 2.4rem); }
    h2 { margin-top: 0; }
    .muted { color: var(--mi-text-cool); }
    .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 18px; }
    .stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 18px 0; }
    .stat-card { background: linear-gradient(145deg, #fff, #f0f7fa); border: 1px solid var(--mi-edge-cool); border-radius: 10px; padding: 14px; min-width: 0; }
    .stat-card strong { display: block; font-size: clamp(1.4rem, 2.2vw, 1.65rem); line-height: 1.15; color: var(--mi-accent-blue); margin-top: 4px; overflow-wrap: anywhere; }
    .dashboard-page { display: grid; gap: 22px; }
    .dashboard-hero { display: flex; justify-content: space-between; align-items: end; gap: 28px; padding: clamp(24px, 4vw, 44px); border-radius: 22px; background: radial-gradient(circle at 85% 20%, #3e8ba733, transparent 32%), linear-gradient(120deg, #0d3855, #0c6176 62%, #168b87); color: #fff; box-shadow: 0 16px 34px #0e385426; }
    .dashboard-hero h1 { margin: 5px 0 10px; color: #fff; font-size: clamp(2rem, 4vw, 3.25rem); letter-spacing: -.04em; }
    .dashboard-hero p { max-width: 640px; margin: 0; color: #d8f0f4; font-size: 1.05rem; }
    .eyebrow { color: #8fd5d4; font-size: .73rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
    .dashboard-hero .eyebrow { color: #a8e9e5; }
    .dashboard-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
    .dashboard-actions .button { padding: 10px 15px; }
    .dashboard-actions .button.secondary { background: #ffffff1f; color: #fff; border: 1px solid #ffffff4d; }
    .dashboard-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; }
    .dashboard-stats .stat-card { padding: 20px; border-radius: 14px; box-shadow: 0 5px 18px #143b520a; }
    .dashboard-stats .stat-card strong { font-size: clamp(1.8rem, 3vw, 2.4rem); }
    .dashboard-action-card { display: flex; flex-direction: column; justify-content: center; min-height: 132px; }
    .dashboard-action-card strong { font-size: 1.25rem !important; }
    .dashboard-action-card .action-arrow { margin-top: 10px; color: var(--mi-accent-blue-3); font-size: .86rem; font-weight: 700; }
    .workspace-switcher { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    .workspace-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 116px; padding: 22px 24px; border: 1px solid #cddde5; border-radius: 16px; background: linear-gradient(135deg, #fff, var(--mi-surface-ice)); color: #123b55; text-decoration: none; box-shadow: 0 7px 20px #143b5210; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
    .workspace-card:hover { transform: translateY(-2px); border-color: var(--mi-accent-blue-2); box-shadow: 0 10px 26px #143b5220; }
    .workspace-card:focus-visible { outline: 3px solid var(--mi-edge-gold); outline-offset: 3px; }
    .workspace-card.pos { background: linear-gradient(135deg, #0d3855, #0f7882); color: #fff; border-color: transparent; }
    .workspace-card.pos .eyebrow, .workspace-card.pos .workspace-arrow { color: #a8e9e5; }
    .workspace-card h2 { margin: 5px 0 5px; font-size: 1.45rem; }
    .workspace-card p { margin: 0; color: var(--mi-text-cool); }
    .workspace-card.pos p { color: #d8f0f4; }
    .workspace-arrow { color: var(--mi-accent-blue-3); font-size: 1.5rem; font-weight: 700; }
    .dashboard-quick-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 15px; border: 1px solid var(--mi-edge-cool); border-radius: 12px; background: #ffffffb8; box-shadow: 0 5px 18px #143b520a; }
    .dashboard-quick-actions .eyebrow { margin-right: 4px; }
    .dashboard-quick-actions .mi-btn { display: inline-flex; align-items: center; gap: 5px; }
    @media (max-width: 650px) { .dashboard-quick-actions { align-items: stretch; flex-direction: column; } .dashboard-quick-actions .eyebrow { margin-right: 0; } .dashboard-quick-actions .mi-btn { justify-content: center; width: 100%; } }
    .dashboard-stat-card { display: block; color: inherit; text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
    .dashboard-stat-card:hover { border-color: var(--mi-accent-blue-2); box-shadow: 0 8px 20px #143b5220; transform: translateY(-2px); }
    .dashboard-stat-card:focus-visible { outline: 3px solid var(--mi-edge-gold); outline-offset: 3px; }
    .dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; align-items: start; }
    .dashboard-panel { min-width: 0; padding: 24px; border: 1px solid var(--mi-edge-cool); border-radius: 16px; background: #ffffffb8; box-shadow: 0 5px 18px #143b520a; }
    .dashboard-panel h2 { margin: 4px 0 5px; font-size: 1.45rem; }
    .dashboard-panel > .section-heading { margin-bottom: 18px; }
    .branch-overview { background: linear-gradient(145deg, #f8fcfd, var(--mi-surface-ice)); }
    .branch-overview-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
    .branch-overview-card { display: grid; gap: 12px; padding: 18px; border: 1px solid var(--mi-edge-cool); border-radius: 14px; background: #fff; color: var(--mi-ink-cool); text-decoration: none; box-shadow: 0 7px 18px #143b520d; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
    .branch-overview-card:hover { border-color: var(--mi-accent-blue-2); box-shadow: 0 8px 20px #143b5220; transform: translateY(-1px); }
    .branch-overview-card h3 { margin: 4px 0 5px; font-size: 1.2rem; }
    .branch-card-metrics { display: flex; flex-wrap: wrap; gap: 8px; }
    .branch-card-metrics span { padding: 8px 10px; border-radius: 9px; background: #eef5f7; color: var(--mi-text-cool); font-size: .82rem; }
    .branch-card-metrics strong { color: var(--mi-accent-blue); }
    .branch-card-link { color: var(--mi-accent-blue-3); font-weight: 700; }
    .branch-scope-notice { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
    .branch-scope-notice span { flex: 1; min-width: 240px; }

    .dashboard-activity { min-width: 0; order: 2; }
    .dashboard-activity .section-heading { margin-bottom: 10px; }
    .dashboard-activity h2 { margin-bottom: 4px; }
    .dashboard-financial-overview { display: grid; gap: 18px; }
    .dashboard-financial-overview > .section-heading { align-items: start; }
    .dashboard-financial-overview h2 { margin: 4px 0 4px; }
    .period-filter { display: grid; grid-template-columns: minmax(150px, 1fr) repeat(2, minmax(145px, 1fr)) auto; gap: 8px; align-items: end; padding: 12px; border: 1px solid var(--mi-edge-cool); border-radius: 10px; background: var(--mi-surface-cool); }
    .period-filter label { font-size: .78rem; }
    .period-filter button { white-space: nowrap; }
    .financial-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
    .financial-block { min-width: 0; padding: 16px; border: 1px solid var(--mi-edge-cool); border-radius: 12px; background: linear-gradient(145deg, #fff, #f4f9fa); }
    .financial-block h3 { margin: 5px 0 4px; font-size: 1.15rem; }
    .financial-block > .muted { display: block; min-height: 2.4em; font-size: .82rem; }
    .financial-amount-list, .receivable-list { display: grid; gap: 8px; margin-top: 14px; }
    .financial-amount, .receivable-row { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; padding: 10px 11px; border-radius: 8px; background: #eef5f7; }
    .financial-amount strong, .receivable-row strong { overflow-wrap: anywhere; }
    .financial-amount.income strong { color: var(--mi-success); }
    .financial-amount.expense strong { color: var(--mi-danger); }
    .receivable-row { color: var(--mi-ink-cool); text-decoration: none; border-left: 3px solid var(--mi-danger); }
    .receivable-row:hover { background: #fceeee; }
    .receivable-row small { display: block; color: var(--mi-text-cool); }
    .finance-empty { margin: 14px 0 0; font-size: .86rem; }
    .expense-entry { display: grid; gap: 14px; }
    .expense-entry h2 { margin: 0; }
    .expense-form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
    .expense-form-grid .wide { grid-column: span 2; }
    .activity-table th, .activity-table td { padding-left: 0; padding-right: 0; }
    .activity-table th:last-child, .activity-table td:last-child { text-align: right; }
    .currency-summaries { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 15px; margin: 0; }
    .currency-card { display: block; padding: 18px; border: 1px solid var(--mi-edge-cool); border-radius: 14px; background: #fff; color: var(--mi-ink-cool); text-decoration: none; box-shadow: 0 7px 18px #143b520d; transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
    .currency-card:hover { border-color: var(--mi-accent-blue-2); box-shadow: 0 6px 16px #143b5220; transform: translateY(-1px); }
    .currency-card-heading { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; color: var(--mi-text-cool); font-size: .82rem; }
    .currency-card-heading strong { color: var(--mi-accent-blue); font-size: 1.4rem; letter-spacing: .04em; }
     .currency-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
    .currency-metric { min-width: 0; padding: 10px; border-radius: 9px; background: #f4f8fa; }
    .currency-metric span { display: block; min-height: 2.2em; color: var(--mi-text-cool); font-size: .74rem; line-height: 1.15; }
    .currency-metric strong { display: block; margin-top: 6px; font-size: 1rem; overflow-wrap: anywhere; }
    .currency-metric.receivable strong, .receivable-value { color: var(--mi-danger); }
    .currency-metric.credit strong, .credit-value { color: var(--mi-success); }
    .currency-metric.net strong { color: var(--mi-accent-blue); }
    .currency-card-hint { display: block; margin-top: 11px; color: var(--mi-accent-blue-3); font-size: .8rem; }
    .currency-detail-page { display: grid; gap: 14px; }
    .currency-detail-toolbar { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; padding: 4px 0 2px; }
    .currency-detail-toolbar > div { min-width: 0; }
    .currency-detail-toolbar h2 { margin: 4px 0 5px; font-size: clamp(1.45rem, 2.8vw, 2.15rem); letter-spacing: -.035em; }
    .currency-detail-toolbar p:last-child { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; line-height: 1.45; }
    .currency-detail-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
    .currency-detail-code { display: inline-flex; align-items: center; min-height: 27px; padding: 4px 9px; border-radius: 999px; background: var(--mi-mint); color: var(--mi-teal); font-size: .68rem; font-weight: 850; letter-spacing: .08em; }
    .currency-detail-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
    .currency-detail-summary-card { min-width: 0; min-height: 116px; display: grid; align-content: space-between; gap: 10px; padding: 15px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 14px 9px 14px 9px; background: var(--mi-blue); box-shadow: none; }
    .currency-detail-summary-card.mint { background: var(--mi-mint); border-left-color: #4ba989; }
    .currency-detail-summary-card.sand { background: var(--mi-sand); border-left-color: var(--mi-gold); }
    .currency-detail-summary-card.lilac { background: var(--mi-lilac); border-left-color: #8d78c4; }
    .currency-detail-summary-card span { color: var(--mi-muted); font-size: .72rem; font-weight: 700; }
    .currency-detail-summary-card strong { display: block; color: var(--mi-ink); font-size: clamp(1.15rem, 2vw, 1.55rem); line-height: 1.12; overflow-wrap: anywhere; }
    .currency-detail-summary-card small { color: var(--mi-muted); font-size: .68rem; line-height: 1.25; }
    .currency-detail-panel { min-width: 0; padding: 17px; border: 1px solid var(--mi-line); border-radius: 16px; background: var(--mi-blue); box-shadow: none; }
    .currency-detail-panel-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; margin-bottom: 13px; }
    .currency-detail-panel-head h2 { margin: 4px 0 4px; font-size: 1.2rem; }
    .currency-detail-panel-head p:last-child { max-width: 720px; margin: 0; color: var(--mi-muted); font-size: .75rem; line-height: 1.4; }
    .currency-detail-count { flex: 0 0 auto; }
    .currency-detail-table-wrap { overflow-x: auto; border: 1px solid #b9dedf; border-radius: 11px; background: var(--mi-paper); }
    .currency-detail-table { width: 100%; min-width: 660px; border-collapse: collapse; }
    .currency-detail-table th, .currency-detail-table td { padding: 11px 12px; vertical-align: middle; }
    .currency-detail-table th { background: #e3f3f5; color: var(--mi-muted); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
    .currency-detail-table td { border-bottom: 1px solid var(--mi-line); font-size: .76rem; }
    .currency-detail-table tbody tr:last-child td { border-bottom: 0; }
    .currency-detail-table tbody tr:hover { background: #f8fcfb; }
    .currency-detail-table a { color: var(--mi-teal); text-decoration: none; }
    .currency-detail-table a:hover { text-decoration: underline; }
    .currency-detail-table td small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .66rem; }
    .currency-detail-table td.number { white-space: nowrap; font-weight: 750; }
    .currency-detail-status { display: inline-flex; align-items: center; min-height: 23px; padding: 4px 8px; border-radius: 999px; font-size: .64rem; font-weight: 800; white-space: nowrap; }
    .currency-detail-status.receivable { background: #f8dfda; color: #a13e35; }
    .currency-detail-status.credit { background: #d8f1e5; color: #19745d; }
    .currency-detail-status.settled { background: #e6eef0; color: var(--mi-muted); }
    .currency-detail-empty { margin: 0; padding: 20px; border: 1px dashed var(--mi-edge-aqua); border-radius: 10px; background: var(--mi-paper); color: var(--mi-muted); text-align: center; }
    .receivable-card { border-left: 4px solid var(--mi-danger); }
    .credit-card { border-left: 4px solid var(--mi-success); }
    .section-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
    .section-action { color: var(--mi-accent-blue-3); font-weight: 700; text-decoration: none; white-space: nowrap; }
    .section-action:hover { text-decoration: underline; }
    .customer-account-overview { padding: 24px; border: 1px solid var(--mi-edge-cool); border-radius: 16px; background: linear-gradient(145deg, #ffffff, #f3f9fa); box-shadow: 0 5px 18px #143b520a; }
    .customer-account-overview h2 { margin: 4px 0 5px; font-size: 1.45rem; }
    .customer-balance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 14px; margin-top: 18px; }
    .customer-balance-card { min-width: 0; padding: 17px; border: 1px solid var(--mi-edge-cool); border-left: 5px solid var(--mi-accent-blue); border-radius: 12px; background: #fff; }
    .customer-balance-card.balance-positive { border-left-color: var(--mi-danger); }
    .customer-balance-card.balance-negative { border-left-color: var(--mi-success); }
    .customer-balance-card.balance-settled { border-left-color: var(--mi-accent-blue); }
    .customer-balance-heading { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; color: var(--mi-text-cool); }
    .customer-balance-heading strong { color: var(--mi-accent-blue); font-size: 1.35rem; letter-spacing: .04em; }
    .customer-balance-amount { display: block; margin-top: 12px; font-size: 1.35rem; overflow-wrap: anywhere; }
    /* A positive balance means the customer owes us (a receivable, needs
       follow-up) and a negative balance is customer credit (no action
       needed) — see the copy above this card. Text color must match that,
       not the unrelated meaning these class names carry in other contexts. */
    .customer-balance-card.balance-positive { color: var(--mi-danger); }
    .customer-balance-card.balance-negative { color: var(--mi-success); }
    .customer-balance-card.balance-settled { color: var(--mi-accent-blue); }
    .customer-balance-status { display: block; margin-top: 4px; color: var(--mi-text-cool); font-size: .86rem; }
    .empty-state { display: grid; gap: 4px; padding: 16px; border: 1px dashed #b7c9d4; border-radius: 10px; background: var(--mi-surface-cool); }
    .history-filters { display: grid; grid-template-columns: minmax(220px, 2fr) repeat(3, minmax(130px, 1fr)) auto; align-items: end; gap: 10px; margin: 18px 0; padding: 14px; border: 1px solid #e0e9ed; border-radius: 10px; background: var(--mi-surface-cool); }
    .history-filters .actions { padding-bottom: 1px; }
     .pos-shell { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 390px); gap: 18px; align-items: start; }
     .pos-page { width: 100%; }
     .pos-mobile-tabs { display: none; }
     .pos-manual-panel > summary { cursor: pointer; list-style: none; pointer-events: auto; }
     .pos-manual-panel > summary::-webkit-details-marker { display: none; }
     .pos-manual-content { display: grid; gap: 7px; }
     .pos-manual-toggle { display: none; }
    .pos-toolbar { display: flex; justify-content: space-between; align-items: end; gap: 20px; flex-wrap: wrap; margin: 8px 0 22px; }
    .pos-toolbar-actions { display: flex; gap: 8px; flex-wrap: wrap; }
    .pos-main { display: grid; gap: 16px; min-width: 0; }
    .pos-context-row { display: grid; grid-template-columns: minmax(180px, 1.2fr) minmax(180px, 1fr) 160px; gap: 10px; padding: 14px; border: 1px solid #cfe2ec; border-radius: 14px; background: #eef8fb; }
    .pos-panel { padding: 20px; border: 1px solid var(--mi-edge-cool); border-radius: 16px; box-shadow: 0 5px 16px #143b5210; }
    .pos-catalog-panel { background: #f1f8fb; border-color: #cfe4ed; }
    .pos-manual-panel { background: #e9f7ef; border-color: #c7e6d4; }
     .pos-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
     .pos-search-label { display: grid; gap: 5px; }
     .pos-barcode-controls { display: grid; grid-template-columns: minmax(0, 3fr) minmax(130px, 1fr); gap: 7px; align-items: end; }
     .pos-barcode-controls button { width: 100%; }
     .pos-category-row { display: flex; gap: 8px; flex-wrap: wrap; margin: 14px 0 16px; }
    .pos-category { border: 1px solid #c4d8e1; border-radius: 999px; padding: 7px 12px; background: #fff; color: #17516d; font-size: .82rem; }
    .pos-category.active, .pos-category:hover { background: var(--mi-accent-blue-2); border-color: var(--mi-accent-blue-2); color: #fff; }
    .pos-product-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
    .pos-product-tile { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 10px; align-items: center; min-height: 78px; padding: 10px; border: 1px solid #d1e2e9; border-radius: 12px; background: #fff; color: var(--mi-ink-cool); text-align: left; box-shadow: 0 2px 8px #143b5208; }
    .pos-product-tile:hover { border-color: var(--mi-accent-blue-2); transform: translateY(-1px); box-shadow: 0 5px 14px #0b78ae1c; }
    .pos-product-tile.is-unavailable, .pos-product-tile.is-unavailable:hover { opacity: .62; filter: saturate(.45); cursor: not-allowed; transform: none; box-shadow: none; }
    .pos-product-tile.is-unavailable .pos-product-copy small { color: #a04b3f; font-weight: 700; }
    .pos-product-tile[hidden] { display: none; }
    .pos-product-copy { min-width: 0; display: grid; gap: 3px; }
    .pos-product-copy strong, .pos-product-copy small, .pos-product-copy b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .pos-product-copy small { color: var(--mi-text-cool); font-size: .78rem; }
    .pos-product-copy b { color: var(--mi-accent-blue); font-size: .9rem; }
    .pos-lines { display: grid; gap: 9px; }
    .pos-line.extra-line { display: none; }
    .pos-line-product { min-width: 0; }
    .pos-cart { position: sticky; top: 14px; display: grid; gap: 14px; padding: 20px; border: 1px solid #efd7aa; border-radius: 16px; background: #fff8e9; box-shadow: 0 8px 24px #9b68151c; }
    .cart-heading { display: flex; justify-content: space-between; gap: 12px; align-items: start; }
    .pos-cart-items { display: grid; gap: 8px; min-height: 50px; max-height: min(42vh, 460px); overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; }
    .pos-cart-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 9px 0; border-bottom: 1px solid #efdfc2; }
    .pos-cart-row span { min-width: 0; overflow-wrap: anywhere; }
    .pos-cart-row small { display: block; margin-top: 2px; color: #8a7355; }
    .pos-cart-row strong { white-space: nowrap; color: var(--mi-text-sand-deep); }
    .pos-cart-row .pos-cart-row-copy { min-width: 0; }
    .pos-cart-row .pos-cart-row-details { display: flex; align-items: center; gap: 6px; }
    .pos-cart-row-actions { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
    .pos-cart-remove { display: inline-grid; place-items: center; width: 26px; min-width: 26px; min-height: 26px; padding: 0; border: 1px solid #e7c5b8; border-radius: 7px; background: #fff8f5; color: #a33b2b; font-size: 1rem; line-height: 1; }
    .pos-cart-remove:hover { border-color: #c65b47; background: #fff0eb; color: #8e271b; }
    .pos-cart-remove:focus-visible { outline: 3px solid #c65b4780; outline-offset: 2px; }
    .pos-cart-quantity { width: 66px; min-width: 56px; min-height: 28px; padding: 3px 4px; text-align: center; font: inherit; font-size: .82rem; }
    .discount-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: end; }
    .pos-readonly { display: block; padding: 10px 11px; border: 1px solid #ecd9b8; border-radius: 7px; background: var(--mi-paper-3); color: #805c1c; }
    .cart-total { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 13px 0; border-top: 1px solid var(--mi-edge-sand-2); border-bottom: 1px solid var(--mi-edge-sand-2); color: var(--mi-text-sand-deep); }
    .cart-total strong { font-size: 1.7rem; color: var(--mi-ink-cool); }
    .pos-currency-totals { display: grid; gap: 5px; padding: 9px 0; border-top: 1px solid var(--mi-edge-sand-2); border-bottom: 1px solid var(--mi-edge-sand-2); }
    .pos-currency-total-row { display: flex; justify-content: space-between; gap: 10px; color: var(--mi-text-sand-deep); }
    .pos-currency-total-row strong { color: var(--mi-ink-cool); }
    .pos-exchange-fields { display: grid; gap: 8px; margin-top: 4px; }
    .pos-exchange-fields label { display: grid; gap: 4px; }
    .pos-exchange-fields small { color: #8a7355; }
    .pos-conversion-note { margin: 0; color: var(--mi-text-sand-deep); font-size: .8rem; }
    .pos-customer-box, .pos-payment-box { display: grid; gap: 9px; padding: 13px; border: 1px solid #ead8b8; border-radius: 11px; background: var(--mi-paper-3); }
    .pos-customer-status { margin: 0; padding: 9px 10px; border: 1px solid #e4c77c; border-radius: 8px; background: #fff5d8; color: #725112; font-weight: 600; }
    .pos-customer-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
    .pos-customer-choice { min-width: 0; min-height: 36px; padding: 7px 9px; }
    .pos-customer-choice[aria-pressed="true"] { border-color: #087f75; background: #dff3ed; color: #10444d; font-weight: 700; }
     .pos-customer-box h3, .pos-payment-box h3 { margin: 0; font-size: 1rem; }
     .payment-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
     .pos-payment-box .payment-currency-row { display: none; }
    .payment-choice { padding: 8px 6px; background: #f5ebd9; color: #634e2b; font-size: .78rem; }
    .payment-choice.selected { background: var(--mi-accent-blue-2); color: #fff; }
    .cart-actions { display: grid; gap: 8px; }
    .cart-actions button { width: 100%; padding: 12px; }
    .pos-secondary-grid { display: grid; gap: 18px; margin-top: 18px; }
    .pos-secondary-card { min-width: 0; }
    .product-management-row { border: 1px solid var(--mi-edge-cool); border-radius: 10px; background: var(--mi-surface-cool); }
    .product-management-row + .product-management-row { margin-top: 8px; }
    .product-management-row summary { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 14px; cursor: pointer; list-style: none; }
    .product-management-row summary::-webkit-details-marker { display: none; }
    .product-management-identity { display: flex; align-items: center; gap: 10px; min-width: 0; }
    .product-management-identity > span:last-child { display: grid; gap: 2px; min-width: 0; }
    .product-management-identity small { color: var(--mi-text-cool); }
    .product-edit-form { padding: 0 14px 14px; }
    .product-manager-search { min-width: 240px; }
    @media (max-width: 1200px) { .pos-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media (max-width: 980px) { .pos-shell { grid-template-columns: 1fr; } .pos-cart { position: static; } .pos-product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
    @media (max-width: 700px) { .pos-context-row, .pos-line { grid-template-columns: 1fr 1fr; } .pos-line .pos-line-product { grid-column: 1 / -1; } .pos-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pos-search-row, .pos-barcode-controls { grid-template-columns: 1fr; } .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .product-manager-search { min-width: 100%; } }
    .pos-catalog { display: grid; gap: 14px; }
    .product-picker-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 10px; }
    .product-picker { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px; border: 1px solid var(--mi-edge-cool); border-radius: 10px; background: var(--mi-surface-cool); color: var(--mi-ink-cool); text-align: left; cursor: pointer; }
    .product-picker:hover { border-color: var(--mi-accent-blue-2); background: var(--mi-surface-ice); }
    .product-picker small { display: block; margin-top: 3px; color: var(--mi-text-cool); }
    .product-visual { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; overflow: hidden; border-radius: 9px; background: #e8f1f4; color: var(--mi-accent-blue); font-size: 1.25rem; }
    .product-visual img { width: 100%; height: 100%; object-fit: cover; }
    .pos-lines { display: grid; gap: 10px; }
    .pos-line { display: grid; grid-template-columns: minmax(150px, 1.25fr) minmax(72px, .55fr) minmax(92px, .7fr) minmax(102px, .75fr) minmax(104px, .7fr); gap: 10px; align-items: end; padding: 12px; border: 1px solid var(--mi-edge-cool); border-radius: 10px; background: var(--mi-surface-cool); }
    .pos-line-advanced { grid-column: 1 / -1; min-width: 0; border-top: 1px solid var(--mi-edge-cool); padding-top: 8px; }
    .pos-line-advanced > summary { color: #0a6c75; cursor: pointer; font-size: .72rem; font-weight: 700; list-style: none; }
    .pos-line-advanced > summary::-webkit-details-marker { display: none; }
    .pos-line-advanced > summary::before { content: "+"; display: inline-grid; width: 18px; height: 18px; margin-right: 5px; place-items: center; border: 1px solid var(--mi-edge-aqua); border-radius: 50%; font-size: .86rem; line-height: 1; }
    .pos-line-advanced[open] > summary::before { content: "−"; }
    .pos-line-advanced-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-top: 9px; }
    .pos-line-advanced-grid .pos-line-description { grid-column: 1 / -1; }
    .pos-manual-actions { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
    .pos-manual-done { min-width: 120px; }
    .pos-manual-status { padding: 9px 11px; border: 1px solid var(--mi-edge-mint); border-radius: 9px; background: #f4fff9; color: #0a6c75; font-size: .78rem; }
    .pos-total { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; padding: 14px 0 4px; border-top: 1px solid var(--mi-edge-cool); margin-top: 14px; }
    .pos-total strong { color: var(--mi-accent-blue); font-size: 1.35rem; }
    .pos-note { padding: 12px 14px; border-left: 4px solid var(--mi-accent-blue); border-radius: 8px; background: #edf7fb; color: #34576c; }
    .inventory-entry { display: grid; gap: 14px; }
    .inventory-entry hr { width: 100%; border: 0; border-top: 1px solid var(--mi-edge-cool); }
    .checkbox-label { display: flex; align-items: center; gap: 8px; }
    .checkbox-label input { width: auto; }
    .stock-increase { color: var(--mi-success); }
    .stock-decrease { color: var(--mi-danger); }
    .sale-status-paid { color: var(--mi-success); font-weight: 700; }
    .sale-status-partial { color: #b06b0d; font-weight: 700; }
    .sale-status-open { color: #a23b32; font-weight: 700; }
    .sales-return-items { display: grid; gap: 6px; margin: 8px 0; }
    .sales-return-item { display: grid; grid-template-columns: auto minmax(0, 1fr) 92px; gap: 8px; align-items: center; padding: 7px 8px; border: 1px solid rgba(16,63,77,.14); border-radius: 9px; background: #fff; }
    .sales-return-item span { display: grid; gap: 2px; }
    .sales-return-item small { color: var(--mi-muted); font-size: .62rem; }
    .sales-return-item.disabled { opacity: .6; grid-template-columns: minmax(0, 1fr); }
    .sales-refund-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
    .customer-history .table-wrap { max-height: 620px; overflow: auto; }
    .card { background: #fff; border: 1px solid var(--mi-edge-cool); border-radius: 12px; padding: 20px; box-shadow: 0 5px 16px #143b5210; }
    .card + .card { margin-top: 18px; }
    .toolbar { display: flex; justify-content: space-between; align-items: end; gap: 16px; flex-wrap: wrap; margin: 24px 0; }
    form { display: grid; gap: 10px; }
    form.inline { display: inline-flex; align-items: center; gap: 8px; }
    .form-details { margin: 4px 0 2px; padding: 10px 12px; border: 1px solid #e0e9ed; border-radius: 8px; background: var(--mi-surface-cool); }
    .form-details summary { font-weight: 700; }
    .form-details[open] summary { margin-bottom: 12px; }
    label { display: grid; gap: 5px; font-weight: 650; font-size: .9rem; }
    input, select, button, textarea { font: inherit; }
    input, select, textarea { width: 100%; border: 1px solid #b7c9d4; border-radius: 7px; padding: 10px 11px; background: #fff; color: var(--mi-ink-cool); }
    textarea { min-height: 84px; resize: vertical; }
    button, .button { border: 0; border-radius: 7px; padding: 8px 11px; font-size: .9rem; background: #0879b5; color: #fff; font-weight: 700; cursor: pointer; text-decoration: none; display: inline-block; }
    button.secondary, .button.secondary { background: #e8f0f4; color: #17425b; }
    .button.disabled { opacity: .55; cursor: not-allowed; }
    button.danger { background: #b23c3c; }
    .actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
    .alert { border-radius: 8px; padding: 12px 14px; margin: 16px 0; }
    .alert.error { background: #fde8e8; color: #8d2020; border: 1px solid #f0b9b9; }
    .alert.success { background: #e8f7ed; color: #146b35; border: 1px solid #b9e2c6; }
    .table-wrap { overflow-x: auto; }
    table { width: 100%; border-collapse: collapse; }
    th, td { padding: 12px 10px; border-bottom: 1px solid #e3ebef; text-align: left; vertical-align: top; }
    th { color: var(--mi-text-cool); font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
    .number { text-align: right; white-space: nowrap; }
    .badge { display: inline-block; padding: 3px 8px; border-radius: 999px; background: #e7f2f8; color: #0b5d85; font-size: .78rem; font-weight: 700; }
    .badge.inactive { background: var(--mi-edge-grey); color: #68747b; }
    .balance { font-size: 2rem; font-weight: 800; color: var(--mi-accent-blue); }
    .login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
    .login-card { width: min(430px, 100%); }
    .login-card .brand { color: #0e3854; display: block; margin-bottom: 24px; font-size: 1.5rem; }
    details summary { cursor: pointer; color: var(--mi-accent-blue-3); }
    .meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 20px 0; }
    .meta div { background: #f4f8fa; border-radius: 8px; padding: 12px; }
    .meta strong { display: block; font-size: 1.15rem; margin-top: 4px; }
    .pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 18px; }
    :focus-visible { outline: 3px solid var(--mi-edge-gold); outline-offset: 2px; }
    @media (max-width: 1100px) { .dashboard-grid { grid-template-columns: 1fr; } .dashboard-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .financial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pos-shell { grid-template-columns: 1fr; } }
    @media (max-width: 900px) { main { width: min(100% - 32px, 760px); padding: 28px 16px 56px; } .stats { grid-template-columns: repeat(auto-fit, minmax(175px, 1fr)); } .currency-summaries { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); } .history-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } .period-filter { grid-template-columns: 1fr 1fr; } .expense-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 900px) { .app-shell { grid-template-columns: 76px minmax(0, 1fr); } .sidebar { padding-left: 8px; padding-right: 8px; } .sidebar-brand { padding-left: 10px; } .sidebar-brand .brand { font-size: 0; } .sidebar-brand .brand::first-letter { font-size: 1.1rem; } .sidebar-brand span, .sidebar-section-label, .sidebar-nav a, .sidebar-status { font-size: 0; } .sidebar-nav a { min-height: 42px; } .sidebar-status small { display: none; } .app-main > main { width: calc(100% - 20px); padding: 24px 10px 48px; } .page-header { padding: 14px 18px; } }
    @media (max-width: 700px) { .app-shell { display: block; } .sidebar { position: static; height: auto; min-height: 0; display: block; padding: 12px 14px; } .sidebar-brand { display: inline-block; padding: 0; } .sidebar-brand .brand { font-size: 1rem; } .sidebar-brand span, .sidebar-section-label, .sidebar-status { display: none; } .sidebar-nav { display: flex; gap: 4px; overflow-x: auto; margin-top: 10px; } .sidebar-nav a { min-height: 0; padding: 8px 10px; font-size: .76rem; white-space: nowrap; } .page-header { align-items: flex-start; flex-direction: column; gap: 10px; } .page-header .account-menu { width: 100%; margin-left: 0; flex-wrap: wrap; } .page-header .account-actions { max-width: 100%; overflow-x: auto; } .app-main > main { width: calc(100% - 20px); padding: 20px 10px 44px; } .workspace-switcher { grid-template-columns: 1fr; } .workspace-card { min-height: 96px; padding: 18px; } .dashboard-hero { align-items: start; flex-direction: column; padding: 24px; } .dashboard-actions { justify-content: flex-start; } .dashboard-stats { grid-template-columns: 1fr; } .dashboard-panel, .customer-account-overview { padding: 18px; } .history-filters { grid-template-columns: 1fr; } .pos-line { grid-template-columns: 1fr 1fr; } th, td { padding: 9px 7px; } .toolbar form.inline { width: 100%; } .toolbar form.inline label { flex: 1; } }

    }

    @layer hilaac {
    /* Hilaac-Kante: the application-wide visual language. The route renderers
       keep their domain markup and actions, while this layer gives every
       workspace one consistent Miisaan surface. */
    :root {
      --mi-bg: #f2f5f2;
      --mi-paper: #fffdfa;
      --mi-ink: #103f4d;
      --mi-muted: #536a70;
      --mi-line: #d8e5e2;
      --mi-teal: #0b6b63;
      --mi-deep: #103f4d;
      --mi-auth-bg: #10181a;
      --mi-blue: #e4f4f8;
      --mi-mint: #def4eb;
      --mi-sand: #f7e9c7;
      --mi-lilac: #eeeafa;
      --mi-coral: #f4e1dc;
      --mi-gold: #875515;
      --mi-good: #238a72;
      --mi-warm: #875515;
      --mi-canvas: #f2f5f2;
      --mi-edge-aqua: #a9d7d4;
      --mi-edge-aqua-2: #a6d7d3;
      --mi-edge-cool: #d8e2e8;
      --mi-edge-sand: #e2c780;
      --mi-edge-mint: #b9dfce;
      --mi-edge-mint-strong: #9bd7c3;
      --mi-accent-blue: #0b6d9c;
      --mi-accent-blue-2: #0b78ae;
      --mi-accent-blue-3: #0a6cae;
      --mi-danger: #b42318;
      --mi-text-cool: #617485;
      --mi-success: #16804b;
      --mi-ink-cool: #17324d;
      --mi-surface-cool: #f8fbfc;
      --mi-teal-text: #146e69;
      --mi-text-ice: #d9f0ff;
      --mi-deep-teal: #1b5b62;
      --mi-text-aqua: #9de1d7;
      --mi-success-deep: #14735a;
      --mi-surface-grey: #d4dfdf;
      --mi-edge-teal: #3a8e8c;
      --mi-text-sand-deep: #6b4a0d;
      --mi-edge-sand-2: #e6cfa4;
      --mi-paper-2: #fffefd;
      --mi-edge-sand-3: #e0c892;
      --mi-edge-sand-4: #ead9b8;
      --mi-paper-3: #fffdf8;
      --mi-surface-warm: #f7f7f1;
      --mi-text-sand: #94651c;
      --mi-edge-sand-5: #dfc477;
      --mi-text-sand-2: #6e572a;
      --mi-edge-grey: #eeeeee;
      --mi-text-ice-2: #d8eff0;
      --mi-text-teal-deep: #174b5a;
      --mi-surface-ice: #eef7fa;
      --mi-edge-gold: #f5b942;
      --mi-teal-text-2: #1a6468;
      --mi-radius-control: 8px;
      --mi-radius-card: 12px;
      --mi-radius-panel: 16px;
      --mi-radius-shell: 22px;
      --mi-space-1: 4px;
      --mi-space-2: 8px;
      --mi-space-3: 12px;
      --mi-space-4: 16px;
      --mi-space-5: 20px;
      --mi-space-6: 24px;
      --mi-space-7: 32px;
      --mi-shadow-card: 0 6px 16px #103f4d12;
      --mi-shadow-shell: 0 8px 24px #103f4d24;
      --mi-text-meta: .75rem;
      --mi-weight-title: 700;
      --mi-weight-section: 650;
      --mi-weight-value: 750;
    }
    html { background: var(--mi-bg); }
    body { background: var(--mi-bg); color: var(--mi-ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
    a { color: var(--mi-teal); }
    h1, h2, h3, h4, p { overflow-wrap: anywhere; }
    h1 { color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.55rem); letter-spacing: -.045em; line-height: 1.05; }
    h2 { color: var(--mi-ink); letter-spacing: -.02em; }
    h3 { color: var(--mi-ink); }
    .mi-shell { min-height: 100vh; display: grid; grid-template-columns: 218px minmax(0, 1fr); gap: 16px; padding: 8px 16px; background: var(--mi-bg); }
    .mi-side { position: sticky; top: var(--mi-space-2); z-index: 3; height: calc(100vh - var(--mi-space-4)); display: flex; flex-direction: column; justify-content: space-between; gap: 22px; padding: 28px 16px 22px; overflow-y: auto; background: var(--mi-deep); color: #e7f6f1; border-radius: var(--mi-radius-shell); box-shadow: var(--mi-shadow-shell); }
    .mi-side::after { content: "M"; position: absolute; right: 14px; bottom: 20px; color: var(--mi-teal-text-2); font-size: 11rem; font-weight: 900; line-height: .8; opacity: .34; pointer-events: none; }
    .mi-side > * { position: relative; z-index: 1; }
    .mi-brand { display: flex; align-items: center; gap: 10px; padding: 0 0 18px; }
    .mi-brand .brand { display: block; color: #fff; text-decoration: none; font-size: 1.14rem; font-weight: 800; letter-spacing: -.02em; }
    .mi-brand small { display: block; margin-top: 2px; color: #a8d3ce; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
    .mi-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 10px; background: var(--mi-teal); color: var(--mi-deep); font-size: 1.15rem; font-weight: 900; }
    .mi-side-label { margin: 4px 9px 12px; color: #79d4c9; font-size: .64rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
    .mi-nav { display: grid; gap: 4px; }
    .mi-nav-link { position: relative; display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 10px 12px; border-radius: 12px 16px 16px 12px; color: #e0f2ef; text-decoration: none; font-size: .83rem; font-weight: 650; transition: background .16s ease, color .16s ease, transform .16s ease; }
    .mi-nav-link:hover, .mi-nav-link:focus-visible { background: var(--mi-deep-teal); color: #fff; transform: translateX(2px); }
    .mi-nav-link.active { background: var(--mi-teal); color: #fff; box-shadow: 4px 4px 0 #084c48; }
    .mi-nav-icon { display: grid; place-items: center; width: 18px; flex: 0 0 18px; color: #9edbd5; font-size: 1.05rem; line-height: 1; }
    .mi-nav-link.active .mi-nav-icon { color: #fff; }
    .mi-side-foot { display: grid; gap: 5px; margin: 0 8px; padding-top: 16px; border-top: 1px solid #77aaa529; color: #a8d3ce; font-size: .7rem; }
    .mi-status::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: #67e3a6; }
    .mi-main { min-width: 0; }
    .mi-top { min-height: 106px; display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 18px clamp(20px, 3vw, 46px); background: var(--mi-paper); border: 1px solid var(--mi-line); border-top: 0; }
    .mi-top-left, .mi-top-right, .mi-top-tools { display: flex; align-items: center; gap: 10px; }
    .mi-top-left { min-width: 0; }
    .mi-top-right { justify-content: flex-end; flex-wrap: wrap; color: var(--mi-muted); font-size: .73rem; }
    .mi-top-right > span { max-width: 180px; }
    .mi-avatar { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 50%; background: var(--mi-mint); color: var(--mi-teal); font-size: .76rem; font-weight: 800; }
    .mi-top-title { max-width: 240px; margin: 3px 0 0; color: var(--mi-ink); font-size: 1rem; font-weight: 750; line-height: 1.12; }
    .mi-eyebrow, .eyebrow { margin: 0; color: var(--mi-teal); font-size: .64rem; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; }
    .mi-top-tools { gap: 5px; }
    .mi-top-tools a, .mi-top-tools select, .mi-top-tools button, .mi-logout { min-height: 30px; padding: 7px 9px; border: 1px solid var(--mi-line); border-radius: 8px; background: var(--mi-paper); color: var(--mi-ink); font-size: .7rem; text-decoration: none; white-space: nowrap; }
    .mi-top-tools a:hover, .mi-top-tools select:hover, .mi-logout:hover { border-color: var(--mi-teal); background: var(--mi-mint); }
    .mi-top-tools .language-picker { display: inline-flex; }
    .mi-top-tools .language-picker select { min-width: 82px; padding-right: 7px; }
    .mi-top-tools .inline { display: inline-flex; }
    .mi-top-tools .inline input { display: none; }
    .mi-logout { cursor: pointer; background: var(--mi-mint); }
    .mi-body { width: min(1120px, 100%); margin: 0 auto; padding: 26px clamp(18px, 3vw, 34px) 60px; }
    .mi-global-toolbar { display: flex; justify-content: space-between; align-items: end; gap: 18px; margin-bottom: 12px; }
    .mi-global-toolbar h1 { margin: 5px 0 5px; }
    .mi-global-toolbar > div:first-child > p:last-child { margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .mi-actions, .actions, .pos-toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
    .mi-btn, button, .button { min-height: 38px; border: 1px solid var(--mi-teal); border-radius: var(--mi-radius-control); padding: 9px 13px; background: var(--mi-deep); color: #fff; font-size: .78rem; font-weight: 750; text-decoration: none; cursor: pointer; }
    .mi-btn:hover, button:hover, .button:hover { filter: brightness(1.05); }
    .mi-btn.primary, button:not(.secondary), .button:not(.secondary) { background: var(--mi-deep); color: #fff; }
    .mi-btn:not(.primary), button.secondary, .button.secondary { background: var(--mi-paper); color: var(--mi-ink); border-color: var(--mi-line); }
    .alert { margin: 14px 0; border-radius: 11px; padding: 12px 14px; border: 1px solid var(--mi-line); }
    .alert.success { background: var(--mi-mint); color: var(--mi-ink); border-color: var(--mi-edge-mint-strong); }
    .alert.error { background: var(--mi-coral); color: #7d332d; border-color: #e5aaa0; }
    .toolbar { display: flex; justify-content: space-between; align-items: end; gap: 18px; flex-wrap: wrap; margin: 4px 0 20px; padding: 0; }
    .toolbar h1, .pos-toolbar h1 { margin: 5px 0; }
    .toolbar p, .pos-toolbar p { margin: 0; color: var(--mi-muted); }
    /* The global content header owns the single visible route title. Keep the
       route toolbar for its eyebrow, description, and page actions. */
    .security-toolbar > div > h2,
    .currency-settings-toolbar > div > h2,
    .customers-toolbar > div > h1,
    .branches-toolbar > div > h2,
    .warehouse-toolbar > div > h2,
    .sales-history-toolbar > div > h2,
    .pos-toolbar > div > h1,
    .products-toolbar > div > h2,
    .members-toolbar > div > h2,
    .module-settings-toolbar > div > h2,
    .documents-toolbar > div > h2,
    .audit-toolbar > div > h2,
    .cash-register-toolbar > div > h1 { display: none; }
    .card, .dashboard-panel, .customer-account-overview, .dashboard-activity, .pos-panel, .pos-cart, .branch-overview { border: 1px solid var(--mi-line); border-radius: 16px; background: var(--mi-paper); box-shadow: 0 8px 20px #103f4d0b; }
    .card { padding: 18px; }
    .card + .card { margin-top: 16px; }
    .dashboard-page, .pos-page { display: grid; gap: 16px; }
    .dashboard-page > .card, .dashboard-page > .dashboard-panel { box-shadow: none; }
    .dashboard-hero { display: flex; justify-content: space-between; align-items: end; gap: 20px; padding: 24px; border-radius: 16px; background: linear-gradient(115deg, var(--mi-deep), #167e83); color: #fff; box-shadow: none; }
    .dashboard-hero h1 { color: #fff; font-size: clamp(1.85rem, 3.5vw, 2.7rem); }
    .dashboard-hero p { color: #d9f3ef; }
    .dashboard-hero .eyebrow { color: #91e1d5; }
    .dashboard-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
    .dashboard-actions .button { background: #ffffff1c; border-color: #ffffff55; color: #fff; }
    .workspace-switcher { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .workspace-card { min-height: 100px; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 18px; border: 1px solid #c8e0e1; border-radius: 15px; background: var(--mi-blue); color: var(--mi-ink); text-decoration: none; box-shadow: none; }
    .workspace-card:hover { border-color: var(--mi-teal); transform: translateY(-1px); }
    .workspace-card.pos { background: var(--mi-deep); border-color: var(--mi-deep); color: #fff; }
    .workspace-card.pos p { color: #d9f3ef; }
    .workspace-card h2 { margin: 4px 0; font-size: 1.2rem; }
    .workspace-card p { margin: 0; color: var(--mi-muted); font-size: .76rem; }
    .workspace-card.pos h2 { color: #fff; }
    .workspace-card.pos .eyebrow, .workspace-card.pos .workspace-arrow { color: var(--mi-text-aqua); }
    .workspace-arrow { color: var(--mi-teal); font-size: 1.35rem; font-weight: 800; }
    .stats { gap: 10px; margin: 0; }
    .stat-card { min-height: 116px; padding: 16px; border: 1px solid var(--mi-line); border-radius: 14px; background: var(--mi-paper); box-shadow: none; }
    .stat-card strong { color: var(--mi-ink); }
    .dashboard-stats .stat-card:nth-child(1) { background: var(--mi-blue); border-left: 4px solid var(--mi-teal); }
    .dashboard-stats .stat-card:nth-child(2) { background: var(--mi-sand); border-left: 4px solid var(--mi-gold); }
    .dashboard-stats .stat-card:nth-child(3) { background: var(--mi-lilac); border-left: 4px solid var(--mi-teal); }
    .dashboard-stats .stat-card:nth-child(4) { background: var(--mi-paper); border-left: 4px solid var(--mi-teal); }
    .dashboard-stat-card:hover { border-color: var(--mi-teal); box-shadow: 0 7px 17px #103f4d13; }
    .branch-overview { padding: 18px; background: var(--mi-blue); }
    .branch-overview-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
    .branch-overview-card { gap: 9px; padding: 14px; border: 1px solid var(--mi-line); border-radius: 12px; background: var(--mi-paper); box-shadow: none; }
    .branch-overview-card h3 { font-size: 1rem; }
    .branch-card-metrics span { padding: 6px 8px; background: var(--mi-mint); color: var(--mi-ink); }
    .branch-card-metrics strong, .branch-card-link, .section-action { color: var(--mi-teal); }
    .branch-scope-notice { background: var(--mi-mint); }
    .dashboard-financial-overview { background: var(--mi-paper); }
    .period-filter, .history-filters { border-color: var(--mi-edge-aqua); background: var(--mi-blue); }
    .financial-grid { gap: 10px; }
    .financial-block { padding: 14px; border-radius: 12px; border-color: var(--mi-line); background: var(--mi-paper); }
    .financial-amount, .receivable-row { background: var(--mi-blue); }
    .dashboard-grid { gap: 14px; }
    .dashboard-page > .dashboard-hero { display: none; }
    .dashboard-page > .workspace-switcher { order: 1; }
    .dashboard-page > .branch-scope-notice { order: 2; }
    .dashboard-page > .branch-overview { order: 3; }
    .dashboard-page > .dashboard-stats { order: 4; }
    .dashboard-page > .dashboard-financial-overview { order: 5; }
    .dashboard-page > .expense-entry { order: 6; }
    .dashboard-page > .dashboard-grid { order: 7; }
    .dashboard-page > .dashboard-activity { order: 8; }
    .currency-card { border-color: var(--mi-line); box-shadow: none; }
    .currency-card-heading strong, .currency-card-hint { color: var(--mi-teal); }
    .customer-account-overview { background: var(--mi-blue); }
    .customer-page { display: grid; gap: 14px; }
    .customer-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; padding: 18px 20px; border: 1px solid var(--mi-edge-aqua); border-radius: 8px 18px 8px 18px; background: linear-gradient(120deg, var(--mi-blue), #e9f6f1); }
    .customer-hero h2 { margin: 8px 0 4px; color: var(--mi-ink); font-size: clamp(1.45rem, 2.6vw, 2.15rem); font-weight: 550; letter-spacing: -.035em; }
    .customer-hero p:not(.mi-eyebrow) { margin: 0; color: var(--mi-muted); font-size: .76rem; }
    .customer-hero .mi-link { display: inline-flex; margin-bottom: 3px; color: var(--mi-teal); font-size: .72rem; font-weight: 650; }
    .customer-hero-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
    .customer-balance-overview { padding: 17px; border: 1px solid var(--mi-edge-aqua); border-radius: 8px 17px 8px 17px; background: var(--mi-blue); }
    .customer-balance-overview .account-panel-head { margin-bottom: 10px; }
    .customer-balance-grid { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; margin-top: 0; }
    .customer-balance-card { min-height: 98px; padding: 13px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 8px 15px 8px 15px; background: var(--mi-paper); }
    .customer-balance-card.balance-positive { border-left-color: var(--mi-danger); background: #f8dfda; }
    .customer-balance-card.balance-negative { border-left-color: var(--mi-success); background: var(--mi-mint); }
    .customer-balance-card.balance-settled { border-left-color: var(--mi-teal); background: #f7fbfb; }
    .customer-balance-heading strong { color: var(--mi-ink); font-size: 1rem; }
    .customer-balance-amount { margin-top: 8px; font-size: 1rem; font-weight: 700; }
    .customer-balance-card.balance-positive .customer-balance-amount { color: var(--mi-danger); }
    .customer-balance-card.balance-negative .customer-balance-amount { color: var(--mi-success); }
    .customer-balance-status { margin-top: 3px; font-size: .66rem; }
    .customer-metric-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .customer-metric-card { min-width: 0; min-height: 82px; padding: 13px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 8px 15px 8px 15px; background: var(--mi-paper); }
    .customer-metric-card.mint { background: var(--mi-mint); border-left-color: #15957f; }
    .customer-metric-card.sand { background: var(--mi-sand); border-left-color: var(--mi-warm); }
    .customer-metric-card.lilac { background: var(--mi-lilac); }
    .customer-metric-card span, .customer-metric-card small { display: block; color: var(--mi-muted); font-size: .64rem; }
    .customer-metric-card strong { display: block; margin: 7px 0 2px; color: var(--mi-ink); font-size: .95rem; font-weight: 650; overflow-wrap: anywhere; }
    .customer-quick-actions { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px; border: 1px solid var(--mi-edge-aqua); border-radius: 8px 17px 8px 17px; background: var(--mi-mint); }
    .customer-quick-actions > .mi-eyebrow { flex: 0 0 100%; margin: 0 2px -2px; }
    .customer-quick-action { display: flex; flex: 1 1 190px; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; padding: 12px 13px; border: 1px solid var(--mi-line); border-radius: 8px 14px 8px 14px; background: var(--mi-paper); color: var(--mi-ink); text-decoration: none; }
    .customer-quick-action:hover { border-color: var(--mi-teal); background: #f7fffb; }
    .customer-quick-action strong, .customer-quick-action small { display: block; }
    .customer-quick-action strong { font-size: .76rem; font-weight: 650; }
    .customer-quick-action small { margin-top: 3px; color: var(--mi-muted); font-size: .64rem; line-height: 1.25; }
    .customer-quick-action > span:last-child { flex: 0 0 auto; color: var(--mi-teal); font-size: 1rem; }
    .customer-collapsible { border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .customer-collapsible > summary { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 17px; cursor: pointer; list-style: none; }
    .customer-collapsible > summary::-webkit-details-marker { display: none; }
    .customer-collapsible > summary::before { content: "+"; display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 22px; border: 1px solid var(--mi-edge-aqua); border-radius: 50%; color: var(--mi-teal); font-size: .95rem; font-weight: 700; }
    .customer-collapsible[open] > summary::before { content: "−"; }
    .customer-collapsible-summary { display: grid; gap: 3px; min-width: 0; flex: 1 1 auto; }
    .customer-collapsible-summary strong { color: var(--mi-ink); font-size: .84rem; font-weight: 650; }
    .customer-collapsible-summary small { color: var(--mi-muted); font-size: .67rem; line-height: 1.35; }
    .customer-collapsible-summary .mi-eyebrow { margin: 0; }
    .customer-collapsible-content { padding: 0 17px 17px; }
    .customer-collapsible-content > .account-panel { padding: 14px 0 0; border: 0; border-top: 1px solid var(--mi-line); border-radius: 0; background: transparent; box-shadow: none; }
    .customer-collapsible-content > .account-panel .account-panel-head { display: none; }
    .customer-collapsible-content > .customer-panel-grid { padding-top: 14px; border-top: 1px solid var(--mi-line); }
    .customer-balance-meta { margin: 0; color: var(--mi-muted); font-size: .67rem; }
    .customer-panel-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .customer-profile-panel form, .customer-add-account-panel form, .customer-settlement-panel form, .customer-entry-panel form { display: grid; gap: 10px; }
    .customer-profile-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
    .customer-profile-grid > div { display: grid; gap: 3px; padding: 9px 10px; border: 1px solid var(--mi-line); border-radius: 8px 12px 8px 12px; background: #ffffff99; }
    .customer-profile-grid span { color: var(--mi-muted); font-size: .62rem; }
    .customer-profile-grid strong { color: var(--mi-ink); font-size: .7rem; font-weight: 600; overflow-wrap: anywhere; }
    .customer-history-panel .history-filters { margin: 0 0 12px; }
    .customer-history-panel .account-history-table { min-width: 760px; }
    .customer-history-panel .account-history-table td:nth-child(3) { min-width: 230px; }
    .customer-history-card-view { display: none; }
    .customer-history-card { display: grid; grid-template-columns: minmax(72px, .7fr) minmax(0, 1.35fr) auto; gap: 8px 10px; padding: 11px 0; border-top: 1px solid var(--mi-line); }
    .customer-history-card:first-child { border-top: 0; }
    .customer-history-card-date, .customer-history-card-copy, .customer-history-card-values { min-width: 0; }
    .customer-history-card-date { display: grid; align-content: start; gap: 4px; }
    .customer-history-card-date strong { color: var(--mi-ink); font-size: .68rem; font-weight: 650; }
    .customer-history-card-date small { color: var(--mi-muted); font-size: .62rem; }
    .customer-history-card-copy strong, .customer-history-card-copy small, .customer-history-card-values strong, .customer-history-card-values small { display: block; }
    .customer-history-card-copy strong { color: var(--mi-ink); font-size: .72rem; font-weight: 650; overflow-wrap: anywhere; }
    .customer-history-card-copy small { margin-top: 3px; color: var(--mi-muted); font-size: .62rem; line-height: 1.35; overflow-wrap: anywhere; }
    .customer-history-card-values { text-align: right; white-space: nowrap; }
    .customer-history-card-values strong { font-size: .74rem; font-weight: 700; }
    .customer-history-card-values small { margin-top: 4px; color: var(--mi-muted); font-size: .61rem; }
    .customer-history-card-values .receivable-value { color: #a04435; }
    .customer-history-card-values .credit-value { color: var(--mi-success-deep); }
    .customer-history-card-meta { grid-column: 1 / -1; color: var(--mi-muted); font-size: .61rem; line-height: 1.4; overflow-wrap: anywhere; }
    .customer-history-card-actions { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-height: 30px; }
    .customer-history-card-actions .account-row-action { margin: 0; }
    .customer-history-card-actions .account-row-action form { margin-left: auto; }
    .customer-history-card-actions .mi-btn { min-height: 30px; padding: 6px 9px; font-size: .63rem; }
    @media (max-width: 980px) { .customer-metric-grid, .customer-panel-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 650px) { .customer-hero { align-items: flex-start; flex-direction: column; } .customer-hero-actions { justify-content: flex-start; } .customer-metric-grid, .customer-panel-grid, .customer-profile-grid { grid-template-columns: 1fr; } .customer-quick-action { flex-basis: 100%; } .customer-panel-grid .account-panel { padding: 13px; } .customer-collapsible > summary { padding: 13px; } .customer-collapsible-content { padding: 0 13px 13px; } .customer-history-table-view { display: none; } .customer-history-card-view { display: grid; } }
    .account-page { display: grid; gap: 14px; }
    .account-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; padding: 18px 20px; border: 1px solid var(--mi-edge-aqua); border-radius: 8px 18px 8px 18px; background: linear-gradient(120deg, var(--mi-blue), #e9f6f1); }
    .account-hero h2 { margin: 8px 0 4px; color: var(--mi-ink); font-size: clamp(1.4rem, 2.5vw, 2rem); font-weight: 550; letter-spacing: -.035em; }
    .account-hero p:not(.mi-eyebrow) { margin: 0; color: var(--mi-muted); font-size: .76rem; }
    .account-hero .mi-link { display: inline-flex; margin-bottom: 3px; color: var(--mi-teal); font-size: .72rem; font-weight: 650; }
    .account-hero-balance { min-width: 180px; padding: 11px 14px; border: 1px solid var(--mi-edge-mint-strong); border-radius: 8px 14px 8px 14px; background: var(--mi-mint); text-align: right; }
    .account-hero-balance small, .account-hero-balance span { display: block; color: var(--mi-muted); font-size: .64rem; }
    .account-hero-balance strong { display: block; margin: 3px 0; color: var(--mi-deep); font-size: 1.35rem; font-weight: 650; letter-spacing: -.035em; overflow-wrap: anywhere; }
    .account-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
    .account-summary-card { min-width: 0; min-height: 94px; padding: 13px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 8px 15px 8px 15px; background: var(--mi-paper); }
    .account-summary-card.blue { background: var(--mi-blue); }
    .account-summary-card.mint { background: var(--mi-mint); border-left-color: #15957f; }
    .account-summary-card.sand { background: var(--mi-sand); border-left-color: var(--mi-warm); }
    .account-summary-card.lilac { background: var(--mi-lilac); }
    .account-summary-card span, .account-summary-card small { display: block; color: var(--mi-muted); font-size: .64rem; }
    .account-summary-card strong { display: block; margin: 8px 0 3px; color: var(--mi-ink); font-size: .93rem; font-weight: 650; overflow-wrap: anywhere; }
    .account-panel { min-width: 0; padding: 17px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .account-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .account-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
    .account-panel.sand { background: var(--mi-sand); border-color: #e1c27e; }
    .account-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
    .account-panel-head h2 { margin: 3px 0 4px; color: var(--mi-ink); font-size: 1rem; font-weight: 550; }
    .account-panel-head p:not(.mi-eyebrow) { margin: 0; color: var(--mi-muted); font-size: .68rem; }
    .account-post-panel form, .account-tool-panel form, .account-notes-panel form { display: grid; gap: 10px; }
    .account-form-grid, .account-date-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
    .account-date-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .account-form-grid label, .account-date-grid label, .account-post-panel > form > label, .account-notes-panel form label { display: grid; gap: 5px; color: var(--mi-ink); font-size: .66rem; font-weight: 650; }
    .account-form-grid input, .account-form-grid select, .account-date-grid input, .account-post-panel textarea, .account-notes-panel textarea, .account-row-action input { width: 100%; }
    .account-form-details { margin-top: 1px; padding: 9px 10px; border: 1px solid var(--mi-edge-mint); border-radius: 9px; background: #f3fbf6; }
    .account-form-details summary { cursor: pointer; color: var(--mi-teal); font-size: .7rem; font-weight: 700; }
    .account-form-details[open] { display: grid; gap: 10px; }
    .account-form-note { margin: 0; color: var(--mi-muted); font-size: .64rem; }
    .account-tools-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
    .account-tool-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: var(--mi-teal); background: #ffffff88; }
    .account-tool-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
    .account-tool-panel > form > .mi-btn { justify-self: start; }
    .account-export-actions { display: flex; flex-wrap: wrap; gap: 8px; }
    .account-export-actions form { display: block; }
    .account-history-panel { background: var(--mi-paper); }
    .account-table-wrap { overflow-x: auto; }
    .account-history-table { width: 100%; border-collapse: collapse; font-size: .69rem; }
    .account-history-table th { padding: 0 7px 8px; color: var(--mi-muted); font-size: .57rem; font-weight: 650; text-align: left; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
    .account-history-table td { padding: 10px 7px; border-top: 1px solid var(--mi-line); vertical-align: middle; }
    .account-history-table th:first-child, .account-history-table td:first-child { padding-left: 0; }
    .account-history-table th:last-child, .account-history-table td:last-child { padding-right: 0; }
    .account-history-table td strong { display: block; color: var(--mi-ink); font-size: .72rem; font-weight: 550; }
    .account-history-table td small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .account-history-table .receivable-value { color: #a04435; font-weight: 650; }
    .account-history-table .credit-value { color: var(--mi-success-deep); font-weight: 650; }
    .account-history-actions { min-width: 124px; text-align: right; }
    .account-history-actions > * { margin: 2px 0 2px 5px; }
    .account-history-actions .mi-btn { min-height: 30px; padding: 6px 9px; font-size: .63rem; }
    .account-row-action { display: inline-block; }
    .account-row-action summary { cursor: pointer; color: var(--mi-teal); font-size: .63rem; font-weight: 700; }
    .account-row-action form { display: grid; gap: 6px; min-width: 160px; margin-top: 6px; padding: 8px; border: 1px solid var(--mi-line); border-radius: 8px; background: var(--mi-blue); text-align: left; }
    .account-row-action label { display: grid; gap: 4px; font-size: .62rem; }
    .account-notes-list { display: grid; gap: 6px; margin: 0 0 12px; padding: 0; list-style: none; }
    .account-notes-list li { display: flex; justify-content: space-between; gap: 12px; padding: 9px 10px; border: 1px solid #e1c27e; border-radius: 8px 12px 8px 12px; background: #fff9e9; color: var(--mi-ink); font-size: .7rem; }
    .account-notes-list li small { flex: 0 0 auto; color: var(--mi-muted); font-size: .6rem; }
    @media (max-width: 980px) { .account-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .account-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 650px) { .account-hero { align-items: flex-start; flex-direction: column; } .account-hero-balance { width: 100%; text-align: left; } .account-summary-grid, .account-tools-grid, .account-form-grid, .account-date-grid { grid-template-columns: 1fr; } .account-panel { padding: 13px; } .account-history-table { min-width: 650px; } .account-notes-list li { align-items: flex-start; flex-direction: column; gap: 4px; } }
    .empty-state { border-color: var(--mi-edge-aqua); background: var(--mi-blue); }
    input, select, textarea { min-height: 38px; border-color: #cbdedb; border-radius: 8px; background: var(--mi-paper); color: var(--mi-ink); }
    textarea { min-height: 82px; }
    label { color: var(--mi-ink); font-size: .72rem; }
    th { color: var(--mi-muted); }
    th, td { border-bottom-color: var(--mi-line); }
    .badge { background: var(--mi-mint); color: var(--mi-teal); }
    .badge.inactive { background: #eef0ee; color: var(--mi-muted); }
    .table-wrap { border-radius: 9px; }
    .pos-toolbar { margin: 2px 0 4px; }
    .pos-shell { grid-template-columns: minmax(0, 1.45fr) minmax(295px, .68fr); gap: 12px; }
    .pos-main { gap: 12px; }
    .pos-manual-panel { order: 1; }
    .pos-catalog-panel { order: 2; }
    .mi-pos-currency-bar { display: none; }
    .mi-pos-currency-copy { display: grid; gap: 3px; }
    .mi-pos-currency-copy strong { font-size: .78rem; }
    .mi-pos-currency-copy small { color: var(--mi-muted); font-size: .66rem; }
    .mi-currency-buttons, .payment-currency-row { display: flex; flex-wrap: wrap; gap: 5px; align-items: center; }
    .mi-currency-buttons button, .payment-currency-row button { min-width: 38px; min-height: 30px; padding: 5px 8px; border: 1px solid var(--mi-teal); border-radius: 8px; background: var(--mi-paper); color: var(--mi-teal); font-size: .67rem; }
    .mi-currency-buttons button[aria-pressed="true"], .payment-currency-row button[aria-pressed="true"] { background: var(--mi-mint); color: var(--mi-deep); }
    .pos-context-row { padding: 10px; border-color: var(--mi-edge-aqua); border-radius: 12px; background: var(--mi-blue); }
    .pos-panel { padding: 14px; box-shadow: none; }
    .pos-catalog-panel { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .pos-manual-panel { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
    .pos-search-row { gap: 7px; }
    .pos-category-row { margin: 10px 0; }
    .pos-category { padding: 6px 10px; border-color: var(--mi-line); background: var(--mi-paper); color: var(--mi-ink); }
    .pos-category.active, .pos-category:hover { background: var(--mi-teal); border-color: var(--mi-teal); color: #fff; }
    .pos-product-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
    .pos-product-tile { display: block; min-height: 0; padding: 0; overflow: hidden; border-color: var(--mi-line); border-radius: 11px; background: var(--mi-paper); text-align: left; box-shadow: none; }
    .pos-product-tile:hover { border-color: var(--mi-teal); transform: translateY(-1px); box-shadow: 0 5px 12px #103f4d12; }
    .pos-product-tile:nth-child(4n+1) .product-visual { background: #dff2f5; }
    .pos-product-tile:nth-child(4n+2) .product-visual { background: #f8eac6; }
    .pos-product-tile:nth-child(4n+3) .product-visual { background: #eae7f8; }
    .pos-product-tile:nth-child(4n) .product-visual { background: #ddf2e8; }
    .product-visual { width: 100%; height: 56px; border-radius: 0; background: #dff2f5; color: var(--mi-deep); font-size: 1.45rem; }
    .product-visual img { object-fit: cover; }
    .pos-product-copy { gap: 2px; padding: 8px 8px 9px; text-align: left; }
    .pos-product-copy strong { color: var(--mi-ink); font-size: .72rem; }
    .pos-product-copy small { color: var(--mi-muted); font-size: .61rem; }
    .pos-product-copy b { color: var(--mi-ink); font-size: .74rem; }
    .pos-lines { gap: 7px; }
    .pos-line { grid-template-columns: minmax(130px, 1.2fr) minmax(68px, .55fr) minmax(86px, .7fr) minmax(94px, .75fr) minmax(96px, .7fr); gap: 7px; padding: 9px; border-color: var(--mi-edge-mint); border-radius: 10px; background: var(--mi-paper); }
    .pos-line-advanced { border-top-color: var(--mi-edge-mint); padding-top: 7px; }
    .pos-line-advanced-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; margin-top: 7px; }
    .pos-line-advanced-grid .pos-line-description { grid-column: 1 / -1; }
    .pos-manual-actions { justify-content: flex-end; }
    .pos-manual-status { border-color: var(--mi-edge-mint-strong); background: #f4fff9; color: var(--mi-teal); }
    .pos-manual-panel > #show-more-lines { margin-top: 6px; }
    .pos-cart { position: sticky; top: 14px; gap: 11px; padding: 14px; border-color: #e1b85c; border-radius: 15px; background: var(--mi-sand); box-shadow: 0 8px 18px #ab70291c; }
    .pos-cart h2 { margin: 3px 0; font-size: 1.1rem; }
    .pos-cart-items { gap: 5px; }
    .pos-cart-row { padding: 7px 0; border-bottom-color: #e6cf99; }
    .pos-cart-row strong { color: var(--mi-ink); }
    .pos-customer-box, .pos-payment-box { gap: 7px; padding: 11px; border-color: var(--mi-edge-sand-3); border-radius: 11px; background: #fff8e9; }
    .pos-customer-box h3, .pos-payment-box h3 { font-size: .9rem; }
    .payment-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
    .payment-choice { min-height: 31px; padding: 6px 4px; border-color: var(--mi-edge-sand-4); border-radius: 7px; background: var(--mi-paper); color: var(--mi-ink); font-size: .66rem; }
    .payment-choice.selected { background: var(--mi-teal); color: #fff; }
    .payment-currency-row { justify-content: flex-start; font-size: .66rem; color: var(--mi-muted); }
    .payment-currency-row span { margin-right: 2px; }
    .discount-row { gap: 7px; }
    .pos-readonly { padding: 9px 10px; border-color: var(--mi-edge-sand-3); background: var(--mi-paper); color: var(--mi-ink); }
    .cart-total { padding: 10px 0; border-color: var(--mi-edge-sand-3); }
    .cart-total strong { font-size: 1.45rem; color: var(--mi-ink); }
    .cart-actions { grid-template-columns: 1.45fr 1fr; gap: 6px; }
    .cart-actions button { min-height: 43px; padding: 10px 8px; }
    .cart-actions button:first-child { background: var(--mi-deep); }
    .pos-secondary-grid { gap: 14px; }
    .pos-secondary-area { display: grid; gap: 16px; }
    .pos-toolbar { align-items: flex-start; margin: 0 0 12px; }
    .pos-toolbar h1 { font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .pos-toolbar p { max-width: 720px; font-size: .78rem; }
    .pos-toolbar-actions { align-self: center; }
    .pos-toolbar-actions .button { display: inline-flex; align-items: center; gap: 5px; }
    .pos-toolbar-actions .button:first-child { border-color: #cbe9dd; background: var(--mi-mint); color: var(--mi-teal); }
    .pos-toolbar-actions .button:first-child:hover { border-color: var(--mi-teal); }
    .pos-main { gap: 10px; }
    .pos-manual-panel { order: 1; }
    .pos-catalog-panel { order: 2; }
    .pos-products-panel { order: 3; }
    .pos-catalog-panel, .pos-manual-panel, .pos-products-panel { border-radius: 8px 17px 8px 17px; }
    .pos-catalog-panel { padding: 14px; }
    .pos-catalog-panel .section-heading, .pos-products-panel .section-heading, .pos-manual-panel .section-heading { margin-bottom: 10px; }
    .pos-catalog-panel .section-heading h2, .pos-products-panel .section-heading h2, .pos-manual-panel .section-heading h2 { font-size: .95rem; font-weight: 550; }
    .pos-catalog-panel .section-heading p, .pos-manual-panel .section-heading p { margin: 4px 0 0; font-size: .69rem; }
    .pos-catalog-panel .badge, .pos-manual-panel .badge { white-space: nowrap; }
    .pos-scan-button { display: inline-flex; min-width: 70px; flex-direction: column; align-items: center; justify-content: center; gap: 1px; line-height: 1.1; }
    .pos-scan-button span { font-size: .62rem; }
    .pos-barcode-panel { display: grid; gap: 9px; margin-top: 10px; padding: 10px; border: 1px solid var(--mi-edge-mint-strong); border-radius: 11px; background: var(--mi-mint); }
    .pos-barcode-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; align-items: end; }
    .pos-barcode-controls label { display: grid; gap: 4px; }
    .pos-barcode-controls label span, .pos-barcode-status { color: var(--mi-muted); font-size: .66rem; }
    .pos-barcode-video { width: 100%; max-height: 190px; border-radius: 9px; background: var(--mi-deep); object-fit: cover; }
    .pos-barcode-status.success { color: #08735f; }
    .pos-barcode-status.error { color: #9b4436; }
    .pos-manual-panel { padding: 14px; }
    .pos-line { background: var(--mi-paper); }
    .pos-products-panel { background: var(--mi-lilac); border-color: #d4c9f0; }
    .pos-products-panel .section-heading { align-items: center; }
    .pos-products-panel .section-heading .muted { font-size: .67rem; }
    button.pos-category { border-color: var(--mi-line); background: var(--mi-paper); color: var(--mi-ink); font-weight: 500; }
    button.pos-category.active, button.pos-category:hover { background: var(--mi-mint); border-color: var(--mi-teal); color: var(--mi-teal); }
    button.pos-product-tile { display: block; width: 100%; min-height: 0; padding: 0; overflow: hidden; border-color: var(--mi-line); border-radius: 10px 14px 10px 14px; background: var(--mi-paper); color: var(--mi-ink); text-align: center; box-shadow: none; }
    button.pos-product-tile:hover { border-color: var(--mi-teal); background: var(--mi-paper); transform: translateY(-1px); box-shadow: 0 5px 12px #103f4d12; }
    .pos-product-copy { justify-items: center; padding: 8px 7px 9px; background: var(--mi-paper); text-align: center; }
    .pos-product-copy strong, .pos-product-copy small, .pos-product-copy b { max-width: 100%; }
    .pos-product-copy strong { color: var(--mi-ink); font-size: .72rem; font-weight: 550; }
    .pos-product-copy small { color: var(--mi-muted); font-size: .61rem; }
    .pos-product-copy b { color: var(--mi-ink); font-size: .74rem; font-weight: 650; }
    .product-visual svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
    .payment-methods-block { display: grid; gap: 5px; color: var(--mi-muted); font-size: .66rem; }
    button.payment-choice { min-height: 31px; padding: 6px 4px; border-color: var(--mi-edge-sand-4); border-radius: 7px; background: var(--mi-paper); color: var(--mi-ink); font-size: .66rem; font-weight: 500; }
    button.payment-choice.selected { background: var(--mi-teal); border-color: var(--mi-teal); color: #fff; }
    .pos-manual-payment-confirmation { display: grid; gap: 6px; margin-top: 7px; padding: 8px; border: 1px solid #d9c38e; border-radius: 8px; background: #fff8e8; color: var(--mi-ink); }
    .pos-manual-payment-confirmation strong { font-size: .72rem; }
    .pos-manual-payment-confirmation p { margin: 0; color: var(--mi-muted); font-size: .65rem; line-height: 1.35; }
    .pos-manual-payment-confirmation button { justify-self: start; }
    .pos-manual-payment-confirmation [hidden] { display: none !important; }
    .pos-customer-box { display: block; padding: 0; overflow: hidden; }
    .pos-customer-box summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; cursor: pointer; list-style: none; }
    .pos-customer-box summary::-webkit-details-marker { display: none; }
    .pos-customer-box summary strong { display: block; margin-top: 3px; color: var(--mi-ink); font-size: .83rem; font-weight: 550; }
    .pos-customer-content { display: grid; gap: 7px; padding: 0 10px 10px; }
    .pos-customer-content [hidden] { display: none !important; }
    .pos-inline-customer-action { display: inline-flex; align-items: center; justify-self: start; gap: 5px; min-height: 32px; padding: 6px 9px; font-size: .66rem; }
    .pos-customer-content p { margin: 0; font-size: .66rem; }
    .pos-customer-content .grid { gap: 7px; }
    .pos-extra-details { display: grid; gap: 8px; padding-top: 2px; }
    .pos-extra-details summary { color: var(--mi-teal); cursor: pointer; font-size: .67rem; }
    .pos-extra-details[open] { padding-bottom: 2px; }
    .payment-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    @media (min-width: 651px) {
      .pos-barcode-controls { grid-template-columns: minmax(0, 3fr) minmax(130px, 1fr); }
      .pos-barcode-controls button { width: 100%; }
      .pos-line { grid-template-columns: repeat(5, minmax(0, 1fr)); }
      .pos-line-advanced-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      button.pos-product-tile { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; width: 100%; height: 70px; min-height: auto; padding: 8px 12px; gap: 12px; border: 1px solid #dbe7e7; border-radius: 8px; background: var(--mi-paper-2); text-align: left; }
      button.pos-product-tile .product-visual { flex: 0 0 40px; width: 40px; height: 40px; border-radius: 8px; }
      button.pos-product-tile .product-visual img { width: 100%; height: 100%; object-fit: contain; }
      button.pos-product-tile .pos-product-copy { display: flex; flex: 1 1 auto; min-width: 0; min-height: 0; flex-direction: column; align-items: flex-start; justify-content: space-between; align-self: stretch; gap: 2px; padding: 0; text-align: left; }
      button.pos-product-tile .pos-product-copy strong { color: var(--mi-ink); font-size: .73rem; font-weight: 650; }
      button.pos-product-tile .pos-product-copy small { color: #6c757d; font-size: 10px; }
      button.pos-product-tile .pos-product-copy b { margin-top: auto; color: var(--mi-ink); font-size: .74rem; font-weight: 700; }
    }
    .product-management-row { border-color: var(--mi-line); background: var(--mi-blue); }
    .product-management-row summary { padding: 11px 13px; }
    .product-manager-create { background: var(--mi-mint); }
    .inventory-entry { background: var(--mi-sand); }
    .pos-note { background: var(--mi-blue); border-left-color: var(--mi-teal); }
    .login-shell { background: var(--mi-bg); }
    .login-card { background: var(--mi-paper); border: 1px solid var(--mi-line); border-radius: 16px; }
    /* Hilaac dashboard primitives. These mirror the reference composition while
       keeping the existing route-specific forms and data tables intact. */
     html, body { background: #fff; }
     .mi-shell { overflow: visible; min-height: 0; align-items: stretch; gap: 0; padding: 20px 16px 0; margin: 0; background: #fff; border: 0; border-radius: 0; }
     .mi-side { position: relative; top: auto; height: auto; min-height: 100%; align-self: stretch; gap: 26px; padding: 23px 16px 17px; overflow: hidden; border-radius: 22px; box-shadow: 0 8px 24px #103f4d24; }
     .mi-main { background: var(--mi-bg); border: 1px solid var(--mi-line); border-radius: 0 22px 22px 22px; overflow: hidden; }
    .mi-brand { gap: 10px; padding: 0; }
    .mi-brand .brand { font-size: 20px; font-weight: 500; letter-spacing: -.04em; }
    .mi-brand small { margin-top: 3px; font-size: 10px; letter-spacing: .1em; }
    .mi-mark { width: 38px; height: 38px; border: 2px solid var(--mi-teal); border-radius: 7px 16px 7px 16px; font-size: 20px; font-weight: 500; }
    .mi-side-label { margin: 0 9px 8px; font-size: 10px; font-weight: 500; letter-spacing: .16em; }
    .mi-nav { gap: 5px; }
    .mi-nav-link { min-height: 43px; padding: 0 11px; border-radius: 7px 13px 7px 13px; font-size: 13px; font-weight: 400; }
    .mi-nav-link:hover, .mi-nav-link:focus-visible { transform: none; }
    .mi-nav-icon { width: 18px; flex: 0 0 18px; color: #9bd3c9; font-size: inherit; }
    .mi-nav-icon svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .mi-side-foot { margin-top: auto; margin-right: 0; margin-left: 0; padding: 13px 10px 3px; border-top: 1px solid #ffffff2e; font-size: 11px; }
    .mi-status { display: flex; align-items: center; gap: 7px; margin-bottom: 6px; }
    .mi-status::before { width: 7px; height: 7px; margin-right: 0; flex: 0 0 7px; }
    .mi-side::after { right: -18px; bottom: 35px; color: var(--mi-teal-text-2); font-size: 180px; font-weight: 500; opacity: .34; }
    .mi-nav-link.active { box-shadow: none; }
     .mi-top { min-height: 76px; padding: 16px 28px; border: 0; border-bottom: 1px solid var(--mi-line); }
    .mi-body { width: min(1420px, 100%); max-width: 1420px; padding: 26px 28px 34px; }
    .mi-global-toolbar { margin-bottom: 18px; }
    .mi-global-toolbar h1 { font-size: clamp(25px, 3vw, 36px); font-weight: 500; }
    .mi-global-toolbar > div:first-child > p:last-child { max-width: 700px; font-size: .8rem; }
    .dashboard-page { display: grid; gap: 15px; }
    .dashboard-page > .dashboard-hero { display: none; }
    .mi-entry-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
    .dashboard-primary-actions { gap: 9px; }
    .dashboard-primary-actions .mi-entry-card { padding: 12px 15px; }
    .dashboard-primary-actions .mi-entry-card strong { font-size: .93rem; }
    .dashboard-primary-actions .mi-entry-card small { margin-top: 3px; }
    .mi-entry-card { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-width: 0; padding: 16px 18px; border: 1px solid var(--mi-line); border-radius: 9px 18px 9px 18px; color: var(--mi-ink); background: var(--mi-paper); text-decoration: none; }
    .mi-entry-card.pos { border-color: #4eaaa1; background: var(--mi-deep); color: #fff; }
    .mi-entry-card.accounting { background: var(--mi-blue); }
    .mi-entry-card:hover { border-color: var(--mi-teal); transform: translateY(-1px); }
    .mi-entry-card-content { min-width: 0; }
    .mi-entry-card .mi-eyebrow { color: var(--mi-teal); }
    .mi-entry-card.pos .mi-eyebrow, .mi-entry-card.pos .mi-entry-arrow { color: #a8e2d7; }
    .mi-entry-card strong { display: block; margin-top: 4px; font-size: 1.05rem; font-weight: 550; }
    .mi-entry-card small { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .69rem; }
    .mi-entry-card.pos small { color: #c7ebe4; }
    .mi-entry-arrow { display: grid; place-items: center; flex: 0 0 auto; color: var(--mi-teal); }
    .mi-entry-arrow svg, .mi-btn-icon svg, .mi-stat-icon svg, .mi-branch-icon svg, .mi-quick-icon svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .mi-entry-arrow svg { width: 18px; height: 18px; }
    .mi-btn-icon { display: inline-grid; place-items: center; margin-right: 6px; vertical-align: -3px; }
    .mi-branch-strip { margin-bottom: 0; padding: 17px; border: 1px solid var(--mi-edge-aqua-2); border-radius: 8px 18px 8px 18px; background: var(--mi-blue); }
    .mi-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
    .mi-panel-head h2, .mi-panel-head h3 { margin: 0; font-size: .95rem; font-weight: 550; }
    .mi-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .mi-branch-summary { display: grid; grid-template-columns: minmax(180px, 1.2fr) repeat(3, minmax(0, .8fr)); gap: 8px; margin-bottom: 11px; }
    .mi-summary-item { min-width: 0; padding: 11px 12px; border: 1px solid #b8ddda; border-radius: 6px 12px 6px 12px; background: #ffffffb8; }
    .mi-summary-item.primary { color: #fff; border-color: var(--mi-deep); background: var(--mi-deep); }
    .mi-summary-item span { display: block; color: var(--mi-muted); font-size: .62rem; }
    .mi-summary-item.primary span { color: #a8d8d1; }
    .mi-summary-item strong { display: block; margin-top: 4px; font-size: .85rem; font-weight: 550; overflow-wrap: anywhere; }
    .mi-branch-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; }
    .mi-branch-card { min-width: 0; padding: 12px; border: 1px solid var(--mi-line); border-radius: 6px 13px 6px 13px; color: var(--mi-ink); background: var(--mi-paper); text-align: left; text-decoration: none; }
    .mi-branch-card:hover, .mi-branch-card.active { border-color: var(--mi-teal); box-shadow: 0 0 0 2px #1389802e; }
    .mi-branch-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .mi-branch-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: var(--mi-teal-text); background: var(--mi-mint); }
    .mi-branch-card small { display: block; margin-top: 8px; color: var(--mi-muted); font-size: .62rem; }
    .mi-branch-card strong { display: block; margin-top: 3px; font-size: .75rem; font-weight: 550; }
    .mi-branch-card em { display: block; margin-top: 6px; color: var(--mi-teal); font-size: .63rem; font-style: normal; }
    .mi-branch-detail { display: flex; flex-wrap: wrap; gap: 5px 10px; margin-top: 7px; color: var(--mi-muted); font-size: .62rem; }
    .mi-branch-detail span + span::before { content: "·"; margin-right: 10px; color: var(--mi-teal); }
    .mi-branch-detail-panel { display: grid; grid-template-columns: minmax(0, 1.25fr) repeat(3, minmax(0, .75fr)); gap: 8px; padding: 13px; border: 1px solid var(--mi-edge-aqua-2); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .mi-detail-main { padding-right: 10px; border-right: 1px solid var(--mi-line); }
    .mi-detail-main strong { display: block; font-size: .95rem; font-weight: 550; }
    .mi-detail-main small { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .62rem; }
    .mi-detail-item { min-width: 0; padding: 4px 9px; border-left: 1px solid var(--mi-line); }
    .mi-detail-item span { display: block; color: var(--mi-muted); font-size: .62rem; }
    .mi-detail-item strong { display: block; margin-top: 5px; font-size: .8rem; font-weight: 550; overflow-wrap: anywhere; }
    .dashboard-currency-overview { min-width: 0; padding: 15px; border: 1px solid var(--mi-edge-aqua-2); border-radius: 8px 17px 8px 17px; background: var(--mi-blue); }
    .dashboard-currency-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; align-items: stretch; }
    .dashboard-currency-card { display: grid; gap: 11px; min-width: 0; padding: 14px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 8px 17px 8px 17px; color: var(--mi-ink); background: var(--mi-paper); text-decoration: none; }
    .dashboard-currency-card:hover, .dashboard-currency-card:focus-visible { border-color: var(--mi-teal); box-shadow: 0 0 0 2px #1389802e; }
    .dashboard-currency-card.blue { background: var(--mi-blue); }
    .dashboard-currency-card.mint { background: var(--mi-mint); }
    .dashboard-currency-card.sand { background: var(--mi-sand); border-left-color: var(--mi-warm); }
    .dashboard-currency-card.lilac { background: var(--mi-lilac); }
    .dashboard-currency-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
    .dashboard-currency-head small { display: block; color: var(--mi-muted); font-size: .62rem; }
    .dashboard-currency-code { display: block; margin-top: 3px; color: var(--mi-ink); font-size: 1.08rem; font-weight: 650; letter-spacing: .02em; }
    .dashboard-currency-icon { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 9px; color: #136e68; background: #ffffffa8; }
    .dashboard-currency-icon svg { display: block; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .dashboard-currency-metrics { display: grid; gap: 5px; }
    .dashboard-currency-metric { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding-top: 6px; border-top: 1px solid #ffffff99; }
    .dashboard-currency-metric:first-child { padding-top: 0; border-top: 0; }
    .dashboard-currency-metric span { min-width: 0; color: var(--mi-muted); font-size: .65rem; }
    .dashboard-currency-metric strong { min-width: 0; color: var(--mi-ink); font-size: .88rem; font-weight: 650; text-align: right; overflow-wrap: anywhere; }
    .dashboard-currency-metric strong.empty { color: var(--mi-muted); font-weight: 500; }
    .dashboard-currency-footer { color: var(--mi-teal); font-size: .63rem; font-weight: 650; }
    .mi-good { color: var(--mi-good); font-weight: 550; }
    .mi-grid-2 { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr); gap: 15px; }
    .mi-panel { min-width: 0; padding: 18px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .dashboard-priority-panel, .dashboard-movement-panel { box-shadow: none; }
    .dashboard-priority-panel.receivables { border-color: var(--mi-edge-aqua-2); background: var(--mi-blue); }
    .dashboard-priority-panel.sales { border-color: #b9d8c9; background: var(--mi-mint); }
    .dashboard-movement-panel { border-color: #e4ce98; background: var(--mi-sand); }
    .dashboard-priority-panel .mi-link, .dashboard-movement-panel .mi-link { color: var(--mi-teal); }
    .dashboard-receivable-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 11px 12px; border: 1px solid var(--mi-line); border-left: 3px solid var(--mi-danger); border-radius: 9px 16px 9px 16px; color: var(--mi-ink); background: var(--mi-paper); text-decoration: none; }
    .dashboard-receivable-row:hover, .dashboard-receivable-row:focus-visible { border-color: var(--mi-teal); background: var(--mi-paper-3); }
    .dashboard-receivable-row > span { min-width: 0; }
    .dashboard-receivable-row > span > strong { display: block; font-size: .82rem; }
    .dashboard-receivable-row small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .64rem; }
    .dashboard-receivable-row > strong { color: #a13e35; text-align: right; white-space: nowrap; font-size: .82rem; }
    .dashboard-sales-table, .dashboard-movement-table { border-collapse: collapse; width: 100%; }
    .dashboard-sales-table th, .dashboard-movement-table th { padding-top: 8px; padding-bottom: 8px; color: var(--mi-muted); background: #ffffff66; font-size: .61rem; }
    .dashboard-sales-table td, .dashboard-movement-table td { padding-top: 10px; padding-bottom: 10px; border-bottom-color: #ffffffb8; }
    .dashboard-sales-table tbody tr:last-child td, .dashboard-movement-table tbody tr:last-child td { border-bottom: 0; }
    .dashboard-sales-table tbody tr:hover, .dashboard-movement-table tbody tr:hover { background: #ffffff66; }
    .dashboard-clickable-row { cursor: pointer; }
    .dashboard-clickable-row:focus-visible { outline: 2px solid var(--mi-teal); outline-offset: -2px; }
    .dashboard-sales-table td.number, .dashboard-movement-table td.number { color: var(--mi-ink); font-weight: 650; white-space: nowrap; }
    .dashboard-movement-table td:nth-child(3) { color: var(--mi-teal); font-weight: 550; }
    .dashboard-page-tools { display: flex; align-items: flex-start; justify-content: flex-end; gap: 14px; }
    .dashboard-page-tools-copy { display: grid; gap: 3px; align-content: center; min-height: 42px; color: var(--mi-muted); font-size: .68rem; text-align: right; }
    .dashboard-page-tools-copy .mi-eyebrow { color: var(--mi-teal); }
    .dashboard-page-tools .period-filter { width: min(100%, 700px); margin: 0; padding: 8px; grid-template-columns: minmax(145px, 1.15fr) repeat(2, minmax(135px, 1fr)) auto; background: var(--mi-blue); }
    .dashboard-page-tools .period-filter label { font-size: .68rem; }
    .dashboard-branch-overview.has-many-branches { padding: 13px; }
    .dashboard-branch-overview.has-many-branches .mi-panel-head { margin-bottom: 9px; }
    .dashboard-branch-overview.has-many-branches .mi-branch-summary { margin-bottom: 8px; }
    .dashboard-branch-overview.has-one-branch { padding: 13px; background: var(--mi-mint); }
    .dashboard-branch-overview.has-one-branch .mi-panel-head { margin-bottom: 9px; }
    .dashboard-branch-overview.has-one-branch .mi-branch-grid { grid-template-columns: minmax(240px, 1fr); }
    .dashboard-page.has-one-currency .dashboard-currency-grid { grid-template-columns: minmax(260px, 1fr); justify-content: start; }
    .dashboard-page.has-no-currencies .dashboard-currency-overview { padding-bottom: 13px; }
    .dashboard-lower-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .8fr); gap: 15px; align-items: start; }
    .dashboard-lower-grid .dashboard-movement-panel { order: 1; }
    .dashboard-lower-grid .dashboard-lower-side { order: 2; }
    .dashboard-lower-side { display: grid; gap: 15px; align-content: start; min-width: 0; }
    .dashboard-lower-grid.has-no-receivables .dashboard-receivables-panel { display: none; }
    .dashboard-lower-grid.has-no-recent-sales .dashboard-sales-panel { display: none; }
    .dashboard-lower-grid.has-no-side { grid-template-columns: 1fr; }
    .mi-link { color: var(--mi-teal); font-size: .68rem; font-weight: 550; white-space: nowrap; }
    .mi-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px; margin-bottom: 13px; padding: 11px; border: 1px solid var(--mi-edge-aqua); border-radius: 7px 13px 7px 13px; background: var(--mi-blue); }
    .mi-field { display: grid; flex: 1; gap: 4px; min-width: 130px; }
    .mi-field label { color: var(--mi-muted); font-size: .62rem; }
    .mi-field input, .mi-field select { width: 100%; min-height: 35px; padding: 0 10px; }
    .mi-total { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
    .mi-total strong { display: block; margin-top: 4px; font-size: 1.55rem; font-weight: 500; }
    .mi-bars { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); align-items: end; gap: 10px; height: 145px; border-bottom: 1px solid var(--mi-line); }
    .mi-bar-day { display: grid; align-content: end; justify-items: center; gap: 6px; height: 100%; color: var(--mi-muted); font-size: .62rem; }
    .mi-bar { width: min(27px, 70%); min-height: 14px; border-radius: 8px 8px 2px 2px; background: var(--mi-teal); }
    .mi-bar.alt { background: #9ad7d2; }
    .mi-quick { display: grid; gap: 8px; }
    .mi-quick a { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px; border: 1px solid var(--mi-line); border-radius: 9px; color: var(--mi-ink); background: var(--mi-surface-warm); text-decoration: none; }
    .mi-quick a:hover { border-color: var(--mi-teal); }
    .mi-quick-icon { display: grid; place-items: center; color: var(--mi-teal-text); }
    .mi-quick strong { display: block; font-size: .75rem; font-weight: 550; }
    .mi-quick small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .62rem; }
    .mi-list { display: grid; gap: 8px; }
    .mi-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 10px 0; border-top: 1px solid var(--mi-line); }
    .mi-row:first-child { padding-top: 0; border-top: 0; }
    .mi-row strong { display: block; font-size: .75rem; font-weight: 550; }
    .mi-row small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .62rem; }
    .mi-row > b { white-space: nowrap; font-size: .7rem; font-weight: 550; }
    .mi-money { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .dashboard-money-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .mi-money-card { padding: 11px; border: 1px solid var(--mi-line); border-radius: 6px 12px 6px 12px; background: var(--mi-surface-warm); }
    .mi-money-card b { color: var(--mi-teal); font-size: .68rem; font-weight: 550; }
    .mi-money-card strong { display: block; margin-top: 7px; font-size: .85rem; font-weight: 550; }
    .mi-money-card small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .62rem; }
    .accounting-page { display: grid; gap: 15px; }
    .accounting-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
    .accounting-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .accounting-title-branch { display: block; margin-top: 5px; color: var(--mi-muted); font-size: .42em; font-weight: 550; letter-spacing: 0; }
    .accounting-toolbar p:not(.mi-eyebrow) { max-width: 720px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .accounting-toolbar-actions { display: flex; flex-wrap: wrap; gap: 8px; align-self: center; }
    .accounting-toolbar-actions .mi-btn { display: inline-flex; align-items: center; gap: 5px; }
    .accounting-branch-panel { padding: 16px; border: 1px solid var(--mi-edge-aqua-2); border-radius: 8px 18px 8px 18px; background: var(--mi-blue); }
    .accounting-branch-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
    .accounting-branch-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .accounting-branch-panel p { margin: 4px 0 0; color: var(--mi-muted); font-size: .68rem; }
    .accounting-branch-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px; }
    .accounting-branch-mobile { display: none; }
    .accounting-branch-mobile label { display: grid; gap: 5px; color: var(--mi-muted); font-size: .64rem; font-weight: 550; }
    .accounting-branch-mobile select { width: 100%; min-height: 40px; }
    .accounting-branch-card { min-width: 0; padding: 12px; border: 1px solid var(--mi-line); border-radius: 7px 13px 7px 13px; color: var(--mi-ink); background: var(--mi-paper); text-decoration: none; }
    .accounting-branch-card:hover, .accounting-branch-card.active { border-color: var(--mi-teal); box-shadow: 0 0 0 2px #1389802e; }
    .accounting-branch-card strong { display: block; font-size: .73rem; font-weight: 550; }
    .accounting-branch-card small { display: block; margin-top: 5px; color: var(--mi-muted); font-size: .61rem; }
    .accounting-branch-card.active strong { color: var(--mi-teal); }
    .accounting-filter { display: grid; grid-template-columns: minmax(150px, .75fr) minmax(150px, 1fr) minmax(150px, 1fr) minmax(150px, 1fr) auto; align-items: end; gap: 8px; margin: 0; padding: 11px; border: 1px solid var(--mi-edge-aqua); border-radius: 7px 13px 7px 13px; background: var(--mi-blue); }
    .accounting-filter .mi-field { min-width: 0; }
    .accounting-filter .mi-field input, .accounting-filter .mi-field select { min-height: 35px; }
    .accounting-filter .mi-btn { min-height: 35px; }
    .accounting-stat-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
    .accounting-stat { min-width: 0; padding: 15px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .accounting-stat.blue { background: var(--mi-blue); }
    .accounting-stat.sand { background: var(--mi-sand); border-left-color: var(--mi-warm); }
    .accounting-stat.lilac { background: var(--mi-lilac); }
    .accounting-stat-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--mi-muted); font-size: .67rem; }
    .accounting-stat-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 9px; color: #136e68; background: var(--mi-mint); }
    .accounting-stat-icon svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .accounting-stat strong { display: block; margin-top: 11px; font-size: 1.32rem; font-weight: 500; letter-spacing: -.035em; overflow-wrap: anywhere; }
    .accounting-stat small { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .64rem; }
    .accounting-finance-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .8fr); gap: 15px; align-items: stretch; }
    .accounting-panel { min-width: 0; padding: 17px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .accounting-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 12px; }
    .accounting-panel h2 { margin: 0; color: var(--mi-ink); font-size: .96rem; font-weight: 550; }
    .accounting-panel-head p, .accounting-panel > p { margin: 4px 0 0; color: var(--mi-muted); font-size: .68rem; }
    .accounting-flow-list { display: grid; }
    .accounting-flow-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 0; border-top: 1px solid var(--mi-line); }
    .accounting-flow-row:first-child { padding-top: 0; border-top: 0; }
    .accounting-flow-row strong { display: block; font-size: .74rem; font-weight: 550; }
    .accounting-flow-row small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .accounting-flow-amounts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px 12px; text-align: right; }
    .accounting-flow-amounts span { color: var(--mi-ink); font-size: .71rem; font-weight: 550; white-space: nowrap; }
    .accounting-flow-amounts span.good { color: var(--mi-good); }
    .accounting-flow-amounts span.open { color: var(--mi-warm); }
    .accounting-currency-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .accounting-currency-card { min-width: 0; padding: 11px; border: 1px solid var(--mi-line); border-radius: 7px 12px 7px 12px; color: var(--mi-ink); background: var(--mi-surface-warm); text-decoration: none; }
    .accounting-currency-card:hover { border-color: var(--mi-teal); }
    .accounting-currency-card b { color: var(--mi-teal); font-size: .68rem; font-weight: 550; }
    .accounting-currency-card strong { display: block; margin-top: 7px; font-size: .84rem; font-weight: 550; }
    .accounting-currency-card small { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .6rem; }
    .accounting-movements { background: var(--mi-paper); }
    .accounting-movements .table-wrap { margin-top: 2px; }
    .accounting-movements table { width: 100%; border-collapse: collapse; font-size: .68rem; }
    .accounting-movements th { padding: 0 7px 8px; color: var(--mi-muted); font-size: .56rem; font-weight: 550; text-align: left; text-transform: uppercase; letter-spacing: .06em; }
    .accounting-movements td { padding: 9px 7px; border-top: 1px solid var(--mi-line); vertical-align: middle; }
    .accounting-movements th:first-child, .accounting-movements td:first-child { padding-left: 0; }
    .accounting-movements th:last-child, .accounting-movements td:last-child { padding-right: 0; text-align: right; }
    .accounting-movements td strong { font-size: .72rem; font-weight: 550; }
    .accounting-movements td small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .6rem; }
    .accounting-expense { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
    .accounting-expense[open] { padding-bottom: 17px; }
    .accounting-expense > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer; list-style: none; color: var(--mi-ink); }
    .accounting-expense > summary::-webkit-details-marker { display: none; }
    .accounting-expense > summary strong { font-size: .95rem; font-weight: 550; }
    .accounting-expense > summary small { color: var(--mi-muted); font-size: .67rem; }
    .accounting-expense > form { margin-top: 13px; }
    @media (max-width: 980px) { .accounting-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); } .accounting-filter .mi-btn { width: 100%; } .accounting-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .accounting-finance-grid { grid-template-columns: 1fr; } }
    @media (max-width: 650px) { .accounting-toolbar { align-items: flex-start; flex-direction: column; } .accounting-toolbar-actions { align-self: flex-start; } .accounting-branch-grid { display: none; } .accounting-branch-mobile { display: block; } .accounting-filter, .accounting-stat-grid, .accounting-currency-grid { grid-template-columns: 1fr; } .accounting-stat { padding: 12px; } .accounting-stat strong { margin-top: 8px; font-size: 1.18rem; } .accounting-flow-row { grid-template-columns: 1fr; gap: 6px; } .accounting-flow-amounts { justify-content: flex-start; text-align: left; } .accounting-movements { overflow: visible; } .accounting-movements .table-wrap { overflow: visible; } .accounting-movements table { display: none; } }
    .accounting-movement-cards { display: none; }
    .accounting-movement-card { display: grid; gap: 8px; padding: 11px; border: 1px solid var(--mi-line); border-radius: 8px 13px 8px 13px; background: var(--mi-paper-2); }
    .accounting-movement-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
    .accounting-movement-card-copy { min-width: 0; }
    .accounting-movement-card-copy strong { display: block; overflow-wrap: anywhere; font-size: .78rem; font-weight: 550; }
    .accounting-movement-card-copy small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .64rem; overflow-wrap: anywhere; }
    .accounting-movement-card-amount { flex: 0 0 auto; font-size: .8rem; font-weight: 650; text-align: right; white-space: nowrap; }
    .accounting-movement-card-amount.receivable-value { color: var(--mi-text-sand); }
    .accounting-movement-card-amount.credit-value { color: var(--mi-success-deep); }
    .accounting-movement-card-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; color: var(--mi-muted); font-size: .62rem; }
    .accounting-movement-card-empty { margin: 0; color: var(--mi-muted); font-size: .7rem; }
    @media (max-width: 650px) { .accounting-movement-cards { display: grid; gap: 8px; } }
    .mi-page-panel { padding: 18px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .warehouse-page { display: grid; gap: 15px; }
    .warehouse-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .warehouse-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .warehouse-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .warehouse-toolbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; align-self: center; }
    .warehouse-toolbar-actions .mi-btn { display: inline-flex; align-items: center; gap: 5px; }
    .warehouse-filter { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.15fr) minmax(170px, 1fr) auto; align-items: end; margin-bottom: 0; }
    .warehouse-filter .mi-field { min-width: 0; }
    .warehouse-filter .mi-btn { min-height: 35px; }
    .warehouse-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; align-items: stretch; }
    .warehouse-page .mi-page-panel { min-width: 0; }
    .warehouse-page .mi-page-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .warehouse-page .mi-page-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
    .warehouse-page .mi-page-panel.sand { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .warehouse-page .mi-page-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .warehouse-page .mi-page-panel > p { margin: 5px 0 13px; color: var(--mi-muted); font-size: .69rem; }
    .warehouse-stock-list { display: grid; gap: 7px; margin-top: 13px; }
    .warehouse-stock-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; padding: 9px 10px; border-radius: 8px; background: rgba(255,255,255,.65); color: var(--mi-ink); font-size: .67rem; }
    .warehouse-stock-bar.low { background: var(--mi-sand); }
    .warehouse-stock-bar.empty { background: var(--mi-coral); }
    .warehouse-stock-main { display: flex; align-items: center; gap: 8px; min-width: 0; }
    .warehouse-stock-icon { display: grid; flex: 0 0 29px; width: 29px; height: 29px; place-items: center; border-radius: 8px; color: var(--mi-teal); background: var(--mi-mint); }
    .warehouse-stock-icon svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .warehouse-stock-copy { min-width: 0; }
    .warehouse-stock-copy strong { display: block; overflow: hidden; font-size: .68rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
    .warehouse-stock-copy small { display: block; margin-top: 2px; color: var(--mi-muted); font-size: .6rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .warehouse-stock-quantity { flex: 0 0 auto; color: var(--mi-ink); font-size: .66rem; font-weight: 700; text-align: right; white-space: nowrap; }
    .warehouse-more-stock { margin-top: 8px; color: var(--mi-muted); font-size: .66rem; }
    .warehouse-more-stock summary { cursor: pointer; color: var(--mi-teal); }
    .warehouse-more-stock .warehouse-stock-list { margin-top: 8px; }
    .warehouse-operation-note { padding: 10px; border: 1px solid var(--mi-edge-mint); border-radius: 8px; background: rgba(255,255,255,.52); color: var(--mi-muted); font-size: .66rem; }
    .warehouse-operation-note strong { display: block; color: var(--mi-ink); font-size: .68rem; }
    .warehouse-operation-note span { display: block; margin-top: 4px; }
    .warehouse-operation-action { display: inline-flex; align-items: center; gap: 5px; margin-top: 11px; }
    .warehouse-transfer-card { display: grid; gap: 3px; margin-top: 7px; padding: 10px; border: 1px solid var(--mi-line); border-radius: 8px; background: var(--mi-paper); color: var(--mi-ink); text-decoration: none; }
    .warehouse-transfer-card:first-of-type { margin-top: 13px; }
    .warehouse-transfer-card:hover { border-color: var(--mi-teal); }
    .warehouse-transfer-card strong { font-size: .7rem; }
    .warehouse-transfer-card small { color: var(--mi-muted); font-size: .61rem; }
    .warehouse-transfer-card b { margin-top: 3px; color: var(--mi-teal); font-size: .65rem; font-weight: 550; }
    .warehouse-search-results { background: var(--mi-paper); }
    .warehouse-search-results .section-heading, .warehouse-visibility .section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
    .warehouse-search-results h2, .warehouse-visibility h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .warehouse-search-results p, .warehouse-visibility p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .warehouse-data-table { width: 100%; border-collapse: collapse; color: var(--mi-ink); font-size: .69rem; }
    .warehouse-data-table th { padding: 0 7px 8px; color: var(--mi-muted); font-size: .56rem; font-weight: 550; text-align: left; text-transform: uppercase; letter-spacing: .06em; }
    .warehouse-data-table td { padding: 9px 7px; border-top: 1px solid var(--mi-line); vertical-align: middle; }
    .warehouse-data-table th:first-child, .warehouse-data-table td:first-child { padding-left: 0; }
    .warehouse-data-table th:last-child, .warehouse-data-table td:last-child { padding-right: 0; text-align: right; }
    .warehouse-data-table td strong { font-size: .73rem; font-weight: 550; }
    .warehouse-data-table td small { display: inline-block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .warehouse-secondary { padding: 12px 14px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .warehouse-secondary > summary { cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 550; }
    .warehouse-secondary[open] > summary { margin-bottom: 12px; }
    .warehouse-secondary .warehouse-visibility-copy { margin-bottom: 10px; }
    .warehouse-secondary .warehouse-visibility-copy p { margin: 4px 0 0; color: var(--mi-muted); font-size: .68rem; }
    .warehouse-secondary button { min-height: 31px; padding: 6px 9px; font-size: .65rem; }
    .warehouse-action-card { margin-top: 12px; padding: 0; border: 1px solid rgba(16,63,77,.15); border-radius: 8px 14px 8px 14px; background: rgba(255,255,255,.52); overflow: hidden; }
    .warehouse-action-card summary { display: flex; min-height: 44px; align-items: center; gap: 7px; padding: 10px 12px; cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 650; }
    .warehouse-action-card[open] summary { margin-bottom: 0; border-bottom: 1px solid rgba(16,63,77,.12); }
    .warehouse-action-card form { gap: 8px; padding: 10px; }
    .warehouse-product-field { display: grid; gap: 5px; }
    .warehouse-product-field > .mi-link { justify-self: start; }
    .warehouse-action-card label { color: var(--mi-muted); font-size: .62rem; }
    .warehouse-action-card input, .warehouse-action-card select { min-height: 31px; padding: 6px 8px; font-size: .68rem; }
    .warehouse-action-card textarea { min-height: 52px; padding: 6px 8px; font-size: .68rem; }
    .warehouse-action-card .grid { gap: 8px; }
    .warehouse-action-card .mi-btn { min-height: 31px; padding: 6px 9px; font-size: .65rem; }
    .warehouse-transfer-card.action { cursor: pointer; }
    .warehouse-distribution-summary { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; list-style: none; }
    .warehouse-distribution-summary::-webkit-details-marker { display: none; }
    .warehouse-distribution-summary h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .warehouse-distribution-summary p { margin: 5px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .warehouse-distribution-toggle { display: none; flex: 0 0 25px; width: 25px; height: 25px; place-items: center; border: 1px solid var(--mi-edge-sand); border-radius: 50%; color: var(--mi-text-sand); background: rgba(255,255,255,.6); font-size: 1rem; font-weight: 800; line-height: 1; }
    .warehouse-distribution-content { display: grid; gap: 0; }
    .sales-history-page { display: grid; gap: 15px; }
    .sales-history-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
    .sales-history-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .sales-history-toolbar p:not(.mi-eyebrow) { max-width: 720px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .sales-history-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
    .sales-history-filter { display: grid; grid-template-columns: minmax(180px, 1.5fr) minmax(130px, .8fr) minmax(130px, .8fr) minmax(130px, .8fr) auto; align-items: end; gap: 8px; margin: 0; padding: 11px; border: 1px solid var(--mi-edge-aqua); border-radius: 7px 13px 7px 13px; background: var(--mi-blue); }
    .sales-history-filter .mi-field { min-width: 0; }
    .sales-history-filter .mi-field input, .sales-history-filter .mi-field select { min-height: 35px; }
    .sales-history-filter-extra { display: grid; grid-template-columns: repeat(2, minmax(120px, 1fr)); gap: 8px; grid-column: 1 / -1; }
    .sales-history-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr); gap: 15px; align-items: start; }
    .sales-history-panel { min-width: 0; padding: 18px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .sales-history-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .sales-history-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
    .sales-history-panel.sand { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .sales-history-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
    .sales-history-panel h2 { margin: 0; color: var(--mi-ink); font-size: .98rem; font-weight: 550; }
    .sales-history-panel p { margin: 4px 0 0; color: var(--mi-muted); font-size: .68rem; }
    .sales-history-list { display: grid; gap: 7px; }
    .sales-history-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 11px 12px; border: 1px solid rgba(16,63,77,.12); border-radius: 7px 13px 7px 13px; background: rgba(255,255,255,.68); color: var(--mi-ink); text-decoration: none; }
    .sales-history-row:hover, .sales-history-row.selected { border-color: var(--mi-teal); background: var(--mi-paper); }
    .sales-history-row-main { min-width: 0; }
    .sales-history-row-title { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
    .sales-history-row-title strong { font-size: .75rem; font-weight: 650; }
    .sales-history-row-title b { white-space: nowrap; color: var(--mi-ink); font-size: .74rem; font-weight: 600; }
    .sales-history-row small { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .63rem; }
    .sales-history-row-meta { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 6px; }
    .sales-history-row-meta span { color: var(--mi-muted); font-size: .6rem; }
    .sales-history-status { justify-self: end; text-align: right; }
    .sales-history-status .mi-badge { display: inline-block; }
    .sales-history-detail { display: grid; gap: 12px; }
    .sales-history-detail-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
    .sales-history-detail h2 { margin: 3px 0 0; font-size: 1.12rem; }
    .sales-history-detail-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
    .sales-history-detail-summary div { padding: 9px; border: 1px solid rgba(16,63,77,.12); border-radius: 6px 11px 6px 11px; background: rgba(255,255,255,.58); }
    .sales-history-detail-summary span { display: block; color: var(--mi-muted); font-size: .6rem; }
    .sales-history-detail-summary strong { display: block; margin-top: 3px; font-size: .72rem; }
    .sales-history-items, .sales-history-payments { display: grid; gap: 6px; }
    .sales-history-item, .sales-history-payment { display: flex; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid rgba(16,63,77,.12); font-size: .68rem; }
    .sales-history-item small, .sales-history-payment small { display: block; margin-top: 2px; color: var(--mi-muted); font-size: .59rem; }
    .sales-history-item strong, .sales-history-payment strong { white-space: nowrap; font-size: .68rem; }
    .sales-history-detail .mi-actions { margin-top: 2px; }
    .sales-history-adjust { display: grid; gap: 7px; padding-top: 10px; border-top: 1px solid rgba(16,63,77,.14); }
    .sales-history-adjust form { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr) auto; gap: 7px; align-items: end; }
    .sales-history-adjust label { color: var(--mi-muted); font-size: .6rem; }
    .sales-history-adjust input, .sales-history-adjust select { min-height: 31px; padding: 6px 8px; font-size: .66rem; }
    .sales-history-empty { padding: 28px 14px; border: 1px dashed rgba(16,63,77,.25); border-radius: 8px 17px 8px 17px; color: var(--mi-muted); text-align: center; font-size: .72rem; }
    .sales-history-footer { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 11px; color: var(--mi-muted); font-size: .65rem; }
    @media (max-width: 980px) { .sales-history-layout { grid-template-columns: 1fr; } .sales-history-detail { position: static; } .sales-history-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 650px) { .sales-history-toolbar { align-items: flex-start; flex-direction: column; } .sales-history-filter { grid-template-columns: 1fr; } .sales-history-filter-extra { grid-template-columns: 1fr; } .sales-history-row-title { display: grid; gap: 3px; } .sales-history-row-title b { justify-self: start; } .sales-history-adjust form { grid-template-columns: 1fr; } .sales-return-item { grid-template-columns: auto minmax(0, 1fr); } .sales-return-item input[name^="returnQuantity"] { grid-column: 2; } .sales-refund-fields { grid-template-columns: 1fr; } }
    @media (max-width: 980px) { .warehouse-grid { grid-template-columns: 1fr; align-items: stretch; } .warehouse-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 650px) { .warehouse-toolbar { align-items: flex-start; flex-direction: column; } .warehouse-toolbar-actions.mi-actions { display: grid; grid-template-columns: 1fr; align-self: stretch; width: 100%; } .warehouse-toolbar-actions .mi-btn { width: 100%; justify-content: center; } .warehouse-filter { grid-template-columns: 1fr; } .warehouse-filter .mi-btn { width: 100%; } .warehouse-stock-bar { gap: 8px; padding: 8px 9px; } .warehouse-stock-icon { flex-basis: 30px; width: 30px; height: 30px; } .warehouse-stock-quantity { font-size: .7rem; } .warehouse-distribution-summary { cursor: pointer; } .warehouse-distribution-toggle { display: inline-grid; } .warehouse-distribution[open] .warehouse-distribution-toggle { transform: rotate(180deg); } .warehouse-data-table { min-width: 560px; } .warehouse-search-results { overflow-x: auto; } }
    .branches-page { display: grid; gap: 15px; }
    .branches-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .branches-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .branches-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .branches-toolbar > .mi-btn { align-self: center; }
    .branches-mobile-back { display: none; }
    .branches-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 15px; align-items: stretch; }
    .branches-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .branches-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .branches-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint); }
    .branches-panel.sand { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .branches-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
    .branches-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .branches-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .branches-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px; }
    .branches-card { display: grid; gap: 8px; min-width: 0; padding: 11px; border: 1px solid var(--mi-line); border-radius: 7px 13px 7px 13px; color: var(--mi-ink); background: var(--mi-paper); }
    .branches-card:hover, .branches-card.active { border-color: var(--mi-teal); box-shadow: 0 0 0 2px #1389802e; }
    .branches-card.archived { opacity: .78; }
    .branches-card-top, .branches-card-status, .branches-card-actions { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .branches-icon { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; color: var(--mi-teal-text); background: var(--mi-mint); }
    .branches-icon svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .branches-card-link { display: block; color: inherit; text-decoration: none; }
    .branches-card small { display: block; color: var(--mi-muted); font-size: .62rem; }
    .branches-card strong { display: block; margin-top: 3px; font-size: .75rem; font-weight: 550; }
    .branches-card em { display: block; margin-top: 6px; color: var(--mi-teal); font-size: .63rem; font-style: normal; }
    .branches-card-detail { display: block; margin-top: 7px; color: var(--mi-muted); font-size: .61rem; overflow-wrap: anywhere; }
    .branches-card-actions form, .branches-control form, .branches-archive-control form { margin: 0; }
    .branches-card-actions button, .branches-archive-control button { min-height: 30px; padding: 6px 10px; font-size: .63rem; }
    .branches-protected-note { color: var(--mi-muted); font-size: .61rem; }
    .branches-merge-panel { padding: 14px; border: 1px solid var(--mi-edge-sand); border-radius: 8px 17px 8px 17px; background: var(--mi-sand); }
    .branches-merge-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 11px; }
    .branches-merge-stats > div { display: grid; gap: 3px; padding: 9px 10px; border: 1px solid var(--mi-edge-sand); border-radius: 8px; background: rgba(255,255,255,.58); }
    .branches-merge-stats span, .branches-merge-stats small { color: var(--mi-muted); font-size: .61rem; }
    .branches-merge-stats strong { color: var(--mi-ink); font-size: 1rem; font-weight: 650; }
    .branches-merge-origin { margin: 10px 0 0; padding: 9px 10px; border: 1px solid var(--mi-edge-mint); border-radius: 8px; background: var(--mi-mint); color: var(--mi-muted); font-size: .65rem; line-height: 1.4; }
    .branches-merge-form { display: grid; gap: 9px; margin-top: 11px; padding-top: 11px; border-top: 1px solid var(--mi-edge-sand); }
    .branches-merge-form label { display: grid; gap: 4px; color: var(--mi-muted); font-size: .64rem; }
    .branches-merge-form label input:not([type="checkbox"]) { min-height: 34px; }
    .branches-merge-form .branches-merge-confirm { display: flex; align-items: center; gap: 7px; line-height: 1.35; }
    .branches-merge-form .branches-merge-confirm input[type="checkbox"] { width: 16px; min-width: 16px; height: 16px; min-height: 16px; margin: 0; }
    .branches-merge-form button { justify-self: start; min-height: 34px; margin-top: 0; padding: 7px 10px; font-size: .66rem; }
    .branches-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .branches-form-grid label { display: grid; gap: 4px; color: var(--mi-muted); font-size: .62rem; }
    .branches-form-grid label.wide { grid-column: 1 / -1; }
    .branches-form-grid input, .branches-form-grid select { width: 100%; min-height: 34px; padding: 0 9px; }
    .branches-form-grid input[readonly] { color: var(--mi-muted); background: rgba(255,255,255,.58); }
    .branches-panel form button, .branches-form-details button { min-height: 33px; margin-top: 10px; padding: 7px 10px; font-size: .66rem; }
    .branches-transfer-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .branches-transfer-card { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 3px 8px; min-width: 0; padding: 11px; border: 1px solid var(--mi-line); border-radius: 8px; color: var(--mi-ink); background: var(--mi-paper); text-decoration: none; }
    .branches-transfer-card:hover { border-color: var(--mi-teal); }
    .branches-transfer-icon { display: grid; place-items: center; grid-row: 1 / span 2; width: 28px; height: 28px; border-radius: 8px; color: var(--mi-teal-text); background: var(--mi-mint); }
    .branches-transfer-icon svg { display: block; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .branches-transfer-copy { min-width: 0; }
    .branches-transfer-card strong { display: block; font-size: .7rem; overflow-wrap: anywhere; }
    .branches-transfer-card small { color: var(--mi-muted); font-size: .61rem; }
    .branches-transfer-meta { display: flex; grid-column: 2; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; }
    .branches-transfer-meta b { color: var(--mi-teal); font-size: .65rem; font-weight: 550; white-space: nowrap; }
    .branches-empty { padding: 12px 0 2px; color: var(--mi-muted); font-size: .68rem; }
    .branches-form-details { padding: 12px 14px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .branches-form-details > summary, .branches-nested-details > summary, .branches-secondary > summary { cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 550; }
    .branches-form-details[open] > summary, .branches-nested-details[open] > summary { margin-bottom: 12px; }
    .branches-form-details form { display: grid; gap: 9px; }
    .branches-nested-details { margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--mi-line); }
    .branches-nested-details p { margin: 8px 0 0; color: var(--mi-muted); font-size: .66rem; }
    .branches-secondary { padding: 12px 14px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .branches-secondary[open] > summary { margin-bottom: 12px; }
    .branches-disable-panel { padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .branches-warning { margin: 0 0 10px; padding: 9px 10px; border: 1px solid var(--mi-edge-sand); border-radius: 8px; color: var(--mi-muted); background: var(--mi-sand); font-size: .65rem; }
    .branches-availability { border-top: 1px solid var(--mi-line); padding-top: 10px; }
    .branches-availability > summary { cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 550; }
    .branches-availability[open] > summary { margin-bottom: 10px; }
    .branches-controls { display: grid; gap: 0; }
    .branches-control, .branches-archive-control { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--mi-line); }
    .branches-control strong, .branches-control small, .branches-archive-control strong, .branches-archive-control small { display: block; }
    .branches-control strong, .branches-archive-control strong { color: var(--mi-ink); font-size: .68rem; font-weight: 600; }
    .branches-control small, .branches-archive-control small { margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .branches-archive-panel { display: grid; gap: 10px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--mi-line); }
    .branches-archive-panel h3 { margin: 0; color: var(--mi-ink); font-size: .82rem; font-weight: 650; }
    .branches-archive-panel p { margin: 4px 0 0; color: var(--mi-muted); font-size: .65rem; line-height: 1.4; }
    .branches-archive-controls { display: grid; gap: 0; }
    .branches-archive-control:first-child { border-top: 0; }
    @media (max-width: 980px) { .branches-grid { grid-template-columns: 1fr; } .branches-transfer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 650px) {
      .branches-toolbar { align-items: flex-start; flex-direction: column; }
      .branches-toolbar > .mi-btn { align-self: flex-start; }
      .branches-page[data-mobile-view="editor"] .branches-toolbar > .mi-btn { display: none; }
      .branches-page[data-mobile-view="editor"] .branches-mobile-back { display: inline-flex; align-items: center; margin: -4px 0 1px; font-size: .7rem; }
      .branches-page[data-mobile-view="list"] .branches-grid > #branch-edit-form,
      .branches-page[data-mobile-view="list"] .branches-create-panel,
      .branches-page[data-mobile-view="list"] .branches-merge-panel,
      .branches-page[data-mobile-view="list"] .branches-disable-panel,
      .branches-page[data-mobile-view="list"] .branches-secondary,
      .branches-page[data-mobile-view="editor"] .branches-mobile-list-panel,
      .branches-page[data-mobile-view="editor"] .branches-secondary,
      .branches-page[data-mobile-view="editor"]:not([data-mobile-create="true"]) .branches-create-panel,
      .branches-page[data-mobile-view="editor"][data-mobile-create="true"] .branches-grid > #branch-edit-form { display: none; }
      .branches-grid { display: block; }
      .branches-form-grid, .branches-merge-stats { grid-template-columns: 1fr; }
      .branches-form-grid label.wide { grid-column: auto; }
      .branches-control, .branches-archive-control { align-items: flex-start; flex-direction: column; }
      .branches-transfer-grid { grid-template-columns: 1fr; gap: 6px; }
      .branches-transfer-card { grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; padding: 9px; }
      .branches-transfer-icon { grid-row: auto; }
      .branches-transfer-meta { display: grid; grid-column: 3; justify-items: end; align-items: end; gap: 2px; }
      .branches-transfer-meta small { text-align: right; white-space: nowrap; }
      .branches-merge-form button { width: 100%; }
    }
    .members-page { display: grid; gap: 15px; }
    .members-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .members-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .members-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .members-toolbar-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; align-self: center; }
    .members-scope-badge { color: var(--mi-teal); background: var(--mi-mint); }
    .members-scope-link { color: var(--mi-teal); font-size: .66rem; font-weight: 550; text-decoration: none; }
    .members-scope-link:hover { text-decoration: underline; }
    .members-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 15px; align-items: start; }
    .members-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .members-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .members-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint); }
    .members-panel.sand { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .members-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
    .members-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .members-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .members-list { display: grid; gap: 8px; }
    .members-card { min-width: 0; padding: 11px; border: 1px solid var(--mi-line); border-radius: 7px 13px 7px 13px; background: var(--mi-paper); }
    .members-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
    .members-person { display: flex; align-items: center; min-width: 0; gap: 9px; }
    .members-avatar { display: grid; place-items: center; flex: 0 0 31px; width: 31px; height: 31px; border-radius: 9px; color: var(--mi-teal); background: var(--mi-mint); font-size: .68rem; font-weight: 650; }
    .members-person strong { display: block; color: var(--mi-ink); font-size: .74rem; font-weight: 550; }
    .members-person small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; overflow-wrap: anywhere; }
    .members-card-meta { display: flex; flex-wrap: wrap; gap: 5px 10px; margin: 9px 0 0 40px; color: var(--mi-muted); font-size: .62rem; }
    .members-card-meta span + span::before { content: "·"; margin-right: 10px; color: var(--mi-teal); }
    .members-card-details { margin-top: 9px; padding-top: 8px; border-top: 1px solid var(--mi-line); }
    .members-card-details > summary, .members-details > summary { cursor: pointer; color: var(--mi-teal); font-size: .66rem; font-weight: 550; }
    .members-card-details[open] > summary, .members-details[open] > summary { margin-bottom: 9px; }
    .members-card-content { display: grid; gap: 9px; }
    .members-role-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: end; }
    .members-role-form label, .members-details label, .members-form-grid label { display: grid; gap: 4px; color: var(--mi-muted); font-size: .62rem; }
    .members-role-form select, .members-details input, .members-form-grid input, .members-form-grid select { width: 100%; min-height: 34px; padding: 0 9px; }
    .members-role-form button { grid-column: 1 / -1; justify-self: start; min-height: 31px; padding: 6px 10px; font-size: .64rem; }
    .members-owner-note { display: block; padding: 8px 9px; border: 1px solid var(--mi-line); border-radius: 7px; color: var(--mi-ink); background: rgba(255,255,255,.54); font-size: .66rem; }
    .members-details { padding-top: 8px; border-top: 1px solid var(--mi-line); }
    .members-details form { display: grid; gap: 8px; }
    .members-details form button { justify-self: start; min-height: 31px; padding: 6px 10px; font-size: .64rem; }
    .members-details p { margin: 7px 0 0; color: var(--mi-muted); font-size: .62rem; line-height: 1.45; }
    .members-permission-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; max-height: 280px; overflow: auto; padding-right: 3px; }
    .members-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .members-form-note { margin: 9px 0 0; color: var(--mi-muted); font-size: .65rem; }
    .members-panel form > button, .members-form-grid + .members-form-note + button { min-height: 33px; margin-top: 10px; padding: 7px 10px; font-size: .66rem; }
    .members-policy-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .members-policy-grid > div { padding: 10px; border: 1px solid var(--mi-line); border-radius: 8px; background: rgba(255,255,255,.56); }
    .members-policy-grid strong { display: block; color: var(--mi-ink); font-size: .68rem; }
    .members-policy-grid span { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .62rem; line-height: 1.4; }
    .members-empty { padding: 15px 0 3px; color: var(--mi-muted); font-size: .7rem; }
    @media (max-width: 980px) { .members-grid { grid-template-columns: 1fr; } }
    @media (max-width: 650px) { .members-toolbar { align-items: flex-start; flex-direction: column; } .members-toolbar-actions { justify-content: flex-start; align-self: flex-start; } .members-role-form, .members-form-grid, .members-permission-grid, .members-policy-grid { grid-template-columns: 1fr; } }
    .members-grid { align-items: stretch; }
    .members-table { display: grid; gap: 0; border: 1px solid var(--mi-line); border-radius: 8px; overflow: hidden; background: rgba(255,255,255,.26); }
    .members-table-head { display: grid; grid-template-columns: minmax(210px, 1.45fr) minmax(145px, 1fr) minmax(105px, .75fr) auto; gap: 12px; align-items: center; }
    .members-table-head { padding: 8px 11px; color: var(--mi-muted); background: rgba(255,255,255,.3); font-size: .58rem; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
    .members-table-row { border-top: 1px solid var(--mi-line); background: rgba(255,255,255,.52); }
    .members-table-row:first-of-type { border-top: 0; }
    .members-table-row > summary { min-height: 55px; padding: 0; cursor: default; list-style: none; color: var(--mi-ink); font-size: .65rem; }
    .members-table-row > summary::-webkit-details-marker { display: none; }
    .members-table-card-link { display: grid; width: 100%; box-sizing: border-box; grid-template-columns: minmax(210px, 1.45fr) minmax(145px, 1fr) minmax(105px, .75fr) auto; gap: 12px; align-items: center; min-height: 55px; padding: 8px 11px; color: var(--mi-ink); text-decoration: none; }
    .members-table-card-link::after { content: "›"; color: var(--mi-teal); font-size: 1rem; line-height: 1; }
    .members-table-card-link:hover { background: rgba(255,255,255,.56); }
    .members-table-card-link:hover strong { color: var(--mi-teal); }
    .members-table-row[open] > summary { background: rgba(255,255,255,.72); }
    .members-table-row[open] .members-table-card-link::after { content: "⌄"; }
    .members-table-person { display: flex; align-items: center; min-width: 0; gap: 8px; }
    .members-table-person > span:last-child { min-width: 0; }
    .members-table-person strong, .members-table-person small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .members-table-person strong { font-size: .68rem; font-weight: 600; }
    .members-table-person small { margin-top: 2px; color: var(--mi-muted); font-size: .58rem; }
    .members-row-editor { display: grid; gap: 9px; padding: 11px; border-top: 1px solid var(--mi-line); background: rgba(255,255,255,.62); }
    .members-row-editor .members-card-content { display: grid; gap: 9px; }
    .members-panel.mint { display: flex; flex-direction: column; }
    .members-panel.mint > form { display: grid; gap: 9px; height: 100%; }
    .members-assignment-field { display: grid; gap: 4px; color: var(--mi-muted); font-size: .62rem; }
    .members-assignment-field select { width: 100%; min-height: 34px; padding: 0 9px; }
    .members-assignment-field select:disabled { color: var(--mi-ink); opacity: 1; }
    .members-permission-rows { display: grid; gap: 0; margin-top: 2px; border-top: 1px solid var(--mi-line); }
    .members-permission-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 54px; padding: 8px 0; border-bottom: 1px solid var(--mi-line); cursor: pointer; }
    .members-permission-row > span:first-child { min-width: 0; }
    .members-permission-row strong, .members-permission-row small { display: block; }
    .members-permission-row strong { color: var(--mi-ink); font-size: .68rem; font-weight: 600; }
    .members-permission-row small { margin-top: 3px; color: var(--mi-muted); font-size: .59rem; }
    .members-table-row.selected > summary { box-shadow: inset 3px 0 0 var(--mi-teal); }
    .members-selected-user { display: grid; gap: 8px; padding: 10px; border: 1px solid var(--mi-line); border-radius: 8px; background: rgba(255,255,255,.56); }
    .members-selected-user-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .members-selected-user-head strong, .members-selected-user-head small { display: block; }
    .members-selected-user-head strong { color: var(--mi-ink); font-size: .72rem; font-weight: 650; }
    .members-selected-user-head small { margin-top: 2px; color: var(--mi-muted); font-size: .59rem; }
    .members-selected-user-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
    .members-selected-user-meta > div { min-width: 0; padding: 6px 7px; border-radius: 6px; background: rgba(255,255,255,.5); }
    .members-selected-user-meta span, .members-selected-user-meta strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .members-selected-user-meta span { color: var(--mi-muted); font-size: .55rem; }
    .members-selected-user-meta strong { margin-top: 2px; color: var(--mi-ink); font-size: .61rem; font-weight: 550; }
    .members-rights-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .members-rights-summary > div { min-width: 0; padding: 7px; border: 1px solid var(--mi-line); border-radius: 7px; background: rgba(255,255,255,.38); }
    .members-rights-summary small, .members-rights-summary strong { display: block; }
    .members-rights-summary small { color: var(--mi-muted); font-size: .55rem; line-height: 1.25; }
    .members-rights-summary strong { margin-top: 3px; color: var(--mi-ink); font-size: .8rem; font-weight: 650; }
    .members-rights-overview { display: grid; gap: 5px; margin-top: 2px; }
    .members-rights-overview > p { margin: 0; color: var(--mi-muted); font-size: .6rem; }
    .members-rights-group { border: 1px solid var(--mi-line); border-radius: 7px; background: rgba(255,255,255,.34); overflow: hidden; }
    .members-rights-group > summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 7px 8px; cursor: pointer; list-style: none; color: var(--mi-ink); font-size: .64rem; font-weight: 600; }
    .members-rights-group > summary::-webkit-details-marker { display: none; }
    .members-rights-group > summary::after { content: "›"; color: var(--mi-teal); font-size: .95rem; }
    .members-rights-group[open] > summary { border-bottom: 1px solid var(--mi-line); }
    .members-rights-group[open] > summary::after { content: "⌄"; }
    .members-rights-group-list { display: grid; gap: 0; padding: 0 8px; }
    .members-right-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; padding: 6px 0; border-bottom: 1px solid rgba(163,193,193,.45); }
    .members-right-row:last-child { border-bottom: 0; }
    .members-right-row > span:first-child { min-width: 0; }
    .members-right-row strong, .members-right-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .members-right-row strong { color: var(--mi-ink); font-size: .6rem; font-weight: 550; }
    .members-right-row small { margin-top: 2px; color: var(--mi-muted); font-size: .53rem; }
    .members-right-state { flex: 0 0 auto; padding: 3px 5px; border-radius: 999px; color: #087d6b; background: #d9f2e7; font-size: .52rem; font-weight: 650; }
    .members-right-state.off { color: #7b5e26; background: #f7e9c4; }
    .members-toggle { position: relative; display: block; flex: 0 0 31px; width: 31px; height: 17px; border-radius: 999px; background: var(--mi-surface-grey); transition: background .15s ease; }
    .members-toggle::after { content: ""; position: absolute; top: 3px; left: 3px; width: 11px; height: 11px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px #17324d26; transition: transform .15s ease; }
    .members-toggle.on { background: var(--mi-teal); }
    .members-toggle.on::after { transform: translateX(14px); }
    .members-toggle select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
    .members-save-permissions { justify-self: start; min-height: 32px; margin-top: 1px; padding: 7px 11px; font-size: .65rem; }
    .members-assignment-empty { margin: 0; padding: 10px; border: 1px solid var(--mi-line); border-radius: 7px; color: var(--mi-muted); background: rgba(255,255,255,.5); font-size: .67rem; }
    .members-role-note { display: flex; align-items: center; gap: 8px; margin: 0; padding: 9px 11px; border: 1px solid var(--mi-line); border-radius: 7px; color: var(--mi-muted); background: rgba(255,255,255,.56); font-size: .62rem; line-height: 1.45; }
    .members-role-note svg { flex: 0 0 16px; width: 16px; height: 16px; color: var(--mi-teal); fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
    .members-add-details { padding: 12px 14px; border: 1px solid var(--mi-edge-mint); border-radius: 8px 17px 8px 17px; background: var(--mi-mint); }
    .members-add-details > summary { cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 600; }
    .members-add-details[open] > summary { margin-bottom: 12px; }
    .members-add-details form { display: grid; gap: 9px; }
    .members-add-details form > button { justify-self: start; min-height: 33px; margin-top: 1px; padding: 7px 10px; font-size: .66rem; }
    @media (max-width: 980px) { .members-table-head, .members-table-card-link { grid-template-columns: minmax(180px, 1.3fr) minmax(120px, 1fr) minmax(90px, .8fr) auto; gap: 8px; } }
    .members-mobile-back, .members-mobile-identity-editor { display: none; }
    @media (max-width: 650px) {
      .members-table-head { display: none; }
      .members-table-card-link { grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
      .members-table-card-link > span:not(.members-table-person):not(.mi-badge) { display: none; }
      .members-table-card-link > .mi-badge { grid-column: 2; grid-row: 1; }
      .members-table-card-link::after { grid-column: 2; grid-row: 2; justify-self: end; }
      .members-selected-user-meta, .members-rights-summary { grid-template-columns: 1fr 1fr; }
      .members-page:not(:has(.members-table-row.selected)) .members-panel.mint { display: none; }
      .members-page:has(.members-table-row.selected) .members-panel.blue,
      .members-page:has(.members-table-row.selected) > .members-panel.sand,
      .members-page:has(.members-table-row.selected) > .members-add-details,
      .members-page:has(.members-table-row.selected) .members-toolbar-actions { display: none; }
      .members-page:has(.members-table-row.selected) .members-mobile-back {
        display: flex; align-items: center; justify-content: center; min-height: 44px; margin-bottom: 12px;
        padding: 8px 10px; border: 1px solid var(--mi-line); border-radius: 8px 13px 8px 13px;
        color: var(--mi-teal); background: var(--mi-paper); font-size: .72rem; font-weight: 650; text-decoration: none;
      }
      .members-page:has(.members-table-row.selected) .members-mobile-identity-editor {
        display: grid; gap: 9px; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--mi-line);
      }
      .members-page:has(.members-table-row.selected) .members-mobile-identity-editor .members-details > summary,
      .members-page:has(.members-table-row.selected) .members-details > summary { display: flex; align-items: center; min-height: 44px; padding: 8px 0; }
      .members-page:has(.members-table-row.selected) .members-rights-group > summary { min-height: 44px; padding: 8px 10px; }
    }
    .currency-settings-page { display: grid; gap: 15px; }
    .currency-settings-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .currency-settings-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .currency-settings-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .currency-settings-toolbar .mi-btn { align-self: center; }
    .currency-settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
    .currency-settings-card { min-width: 0; padding: 15px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .currency-settings-card.blue { border-color: var(--mi-edge-aqua); background: var(--mi-blue); }
    .currency-settings-card.mint { border-color: var(--mi-edge-mint); background: var(--mi-mint); }
    .currency-settings-card.sand { border-color: var(--mi-edge-sand); background: var(--mi-sand); }
    .currency-settings-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 9px; min-height: 34px; }
    .currency-settings-card-head strong { display: block; color: var(--mi-ink); font-size: .86rem; font-weight: 600; }
    .currency-settings-card-head small { display: block; margin-top: 4px; color: var(--mi-muted); font-size: .62rem; }
    .currency-settings-metric { display: grid; gap: 4px; margin: 12px 0 10px; padding: 10px; border: 1px solid var(--mi-line); border-radius: 8px; background: rgba(255,255,255,.58); }
    .currency-settings-metric span { color: var(--mi-muted); font-size: .61rem; }
    .currency-settings-metric strong { color: var(--mi-ink); font-size: 1.05rem; font-weight: 600; }
    .currency-settings-card .mi-btn { display: inline-flex; min-height: 30px; align-items: center; padding: 6px 10px; font-size: .63rem; }
    .currency-settings-card-actions { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
    .currency-settings-card-actions form { margin: 0; }
    .currency-settings-card-actions button { min-height: 30px; padding: 6px 10px; font-size: .63rem; }
    .currency-settings-card-actions .module-settings-toggle, .currency-settings-control .module-settings-toggle { width: 31px; min-width: 31px; height: 17px; min-height: 17px; padding: 0 !important; font-size: 0; line-height: 17px; }
    .currency-settings-card.archived { opacity: .78; }
    .currency-settings-card.archived .currency-settings-metric { background: rgba(255,255,255,.38); }
    .currency-settings-card-archived-note { color: var(--mi-muted); font-size: .63rem; }
    .currency-disable-panel { padding: 15px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .currency-settings-panel-head h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .currency-settings-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .68rem; }
    .currency-warning { margin: 11px 0 0; padding: 9px 10px; border: 1px solid var(--mi-edge-sand); border-radius: 8px; color: var(--mi-muted); background: var(--mi-sand); font-size: .62rem; line-height: 1.4; }
    .currency-availability { margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--mi-line); }
    .currency-availability > summary { cursor: pointer; color: var(--mi-teal); font-size: .68rem; font-weight: 600; }
    .currency-availability[open] > summary { margin-bottom: 9px; }
    .currency-settings-controls { display: grid; gap: 0; }
    .currency-settings-control { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--mi-line); }
    .currency-settings-control strong, .currency-settings-control small { display: block; }
    .currency-settings-control strong { color: var(--mi-ink); font-size: .68rem; font-weight: 600; }
    .currency-settings-control small { margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .currency-settings-control form { flex: 0 0 auto; }
    .currency-settings-control button { min-height: 30px; padding: 6px 10px; font-size: .63rem; }
    .currency-settings-archive-panel { display: grid; gap: 10px; margin-top: 14px; padding-top: 13px; border-top: 1px solid var(--mi-line); }
    .currency-settings-archive-panel h3 { margin: 0; color: var(--mi-ink); font-size: .82rem; font-weight: 650; }
    .currency-settings-archive-panel p { margin: 4px 0 0; color: var(--mi-muted); font-size: .65rem; line-height: 1.4; }
    .currency-settings-archive-controls { display: grid; gap: 0; }
    .currency-settings-archive-control { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 0; border-top: 1px solid var(--mi-line); }
    .currency-settings-archive-control strong, .currency-settings-archive-control small { display: block; }
    .currency-settings-archive-control strong { color: var(--mi-ink); font-size: .68rem; font-weight: 600; }
    .currency-settings-archive-control small { margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .currency-settings-archive-control form { flex: 0 0 auto; }
    .currency-settings-archive-control button { min-height: 30px; padding: 6px 10px; font-size: .63rem; }
    .currency-settings-empty { margin: 0; color: var(--mi-muted); font-size: .68rem; }
    .currency-card-mobile-manage, .currency-settings-mobile-detail, .currency-settings-mobile-back { display: none; }
    .currency-settings-mobile-tabs { display: none; }
    .currency-settings-mobile-tab { min-width: 0; text-decoration: none; }
    .currency-settings-mobile-detail-card { display: grid; gap: 10px; }
    .currency-settings-mobile-detail-note { margin: 0; color: var(--mi-muted); font-size: .7rem; line-height: 1.45; }
    .currency-settings-mobile-detail-actions { display: grid; gap: 8px; }
    .currency-settings-mobile-detail-actions form { margin: 0; }
    @media (max-width: 980px) { .currency-settings-grid { grid-template-columns: 1fr; } }
    @media (max-width: 650px) { .currency-settings-toolbar { align-items: flex-start; flex-direction: column; } .currency-settings-toolbar .mi-btn { align-self: flex-start; } .currency-settings-control, .currency-settings-archive-control { align-items: flex-start; flex-direction: column; } }
    @media (max-width: 650px) {
      .currency-settings-page[data-mobile-view="overview"] .currency-disable-panel,
      .currency-settings-page[data-mobile-view="detail"] .currency-settings-grid,
      .currency-settings-page[data-mobile-view="detail"] .currency-disable-panel,
      .currency-settings-page[data-mobile-view="detail"] .currency-settings-toolbar > .mi-btn { display: none; }
      .currency-settings-mobile-tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 4px; border: 1px solid var(--mi-line); border-radius: 10px 15px 10px 15px; background: var(--mi-paper); }
      .currency-settings-mobile-tab { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 9px 10px; border: 1px solid transparent; border-radius: 7px 11px 7px 11px; color: var(--mi-muted); font-size: .72rem; font-weight: 700; text-align: center; }
      .currency-settings-mobile-tab.active { border-color: var(--mi-teal); background: var(--mi-deep); color: #fff; }
      .currency-settings-mobile-tab.is-disabled { cursor: not-allowed; opacity: .55; }
      .currency-settings-page[data-mobile-view="detail"] .currency-settings-mobile-detail { display: grid; gap: 12px; }
      .currency-settings-mobile-back { display: inline-flex; align-items: center; min-height: 44px; padding: 9px 10px; border: 1px solid var(--mi-line); border-radius: 8px 13px 8px 13px; color: var(--mi-teal); background: var(--mi-paper); font-size: .72rem; font-weight: 650; text-decoration: none; }
      .currency-settings-card-actions { display: grid; grid-template-columns: 1fr; align-items: stretch; gap: 8px; }
      .currency-settings-card-actions > a,
      .currency-settings-card-actions > form,
      .currency-settings-card-actions > form button { width: 100%; min-height: 44px; }
      .currency-settings-card-actions > a { align-items: center; justify-content: center; }
      .currency-settings-card-actions .currency-card-desktop-archive { display: none; }
      .currency-settings-card-actions .currency-card-mobile-manage { display: flex; }
      .currency-settings-card-actions .currency-card-restore { display: block; }
      .currency-settings-card-actions .currency-card-restore button { width: 100%; min-height: 44px; }
      .currency-settings-mobile-detail-actions button { width: 100%; min-height: 44px; }
      /* Keep archived information quiet while leaving the restore action fully readable. */
      .currency-settings-card.archived { opacity: 1; }
      .currency-settings-card.archived > .currency-settings-card-head,
      .currency-settings-card.archived > .currency-settings-metric,
      .currency-settings-card.archived > .currency-settings-card-actions > .currency-settings-card-archived-note { opacity: .6; }
      .currency-settings-card-head .module-settings-toggle-form { display: flex; align-items: center; justify-content: center; width: 44px; min-width: 44px; height: 44px; }
      .currency-settings-card-head .module-settings-toggle { width: 44px !important; min-width: 44px !important; height: 44px !important; min-height: 44px !important; background: transparent !important; }
      .currency-settings-card-head .module-settings-toggle::before { content: ""; position: absolute; top: 13.5px; left: 6.5px; width: 31px; height: 17px; border-radius: 999px; background: var(--mi-surface-grey); }
      .currency-settings-card-head .module-settings-toggle.on::before { background: var(--mi-teal); }
      .currency-settings-card-head .module-settings-toggle::after { top: 16.5px !important; left: 9.5px !important; }
    }
    .module-settings-page { display: grid; gap: 15px; }
    .module-settings-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .module-settings-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .module-settings-toolbar p:not(.mi-eyebrow) { max-width: 720px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .module-settings-toolbar .mi-btn { align-self: center; }
    .module-settings-grid-panel { padding: 14px; border: 1px solid var(--mi-edge-aqua); border-radius: 8px 17px 8px 17px; background: var(--mi-blue); }
    .module-settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .module-settings-card { min-width: 0; min-height: 76px; padding: 10px; border: 1px solid var(--mi-line); border-radius: 8px; background: var(--mi-paper); }
    .module-settings-card-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 22px; }
    .module-settings-icon { display: grid; place-items: center; color: var(--mi-teal-text); }
    .module-settings-icon svg { display: block; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
    .module-settings-card > strong { display: block; margin-top: 7px; color: var(--mi-ink); font-size: .68rem; font-weight: 600; }
    .module-settings-card > small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .58rem; line-height: 1.35; }
    .module-settings-toggle-form { margin: 0; }
    .module-settings-toggle { position: relative; display: block; width: 31px; min-width: 31px; height: 17px; min-height: 17px; padding: 0 !important; border: 0; border-radius: 999px; background: var(--mi-surface-grey); cursor: pointer; box-shadow: none; font-size: 0; line-height: 17px; }
    .module-settings-toggle::after { content: ""; position: absolute; top: 3px; left: 3px; width: 11px; height: 11px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px #17324d26; transition: transform .15s ease; }
    .module-settings-toggle.on { background: var(--mi-teal); }
    .module-settings-toggle.on::after { transform: translateX(14px); }
    .module-settings-toggle span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .branches-card-status .module-settings-toggle, .branches-control .module-settings-toggle { appearance: none; -webkit-appearance: none; flex: 0 0 31px; width: 31px !important; min-width: 31px !important; height: 17px !important; min-height: 17px !important; margin: 0; padding: 0 !important; border: 0 !important; border-radius: 999px !important; box-shadow: none !important; font-size: 0 !important; line-height: 17px !important; }
    .branches-card-status .module-settings-toggle::after, .branches-control .module-settings-toggle::after { top: 3px; left: 3px; width: 11px; height: 11px; }
    .module-settings-basic { color: var(--mi-muted); font-size: .54rem; }
    .module-settings-static { background: rgba(255,255,255,.7); }
    .module-settings-packages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
    .module-settings-package { min-width: 0; padding: 13px 14px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .module-settings-package.paper { background: var(--mi-paper); }
    .module-settings-package.mint { border-color: var(--mi-edge-mint); background: var(--mi-mint); }
    .module-settings-package.sand { border-color: var(--mi-edge-sand); background: var(--mi-sand); }
    .module-settings-package h2 { margin: 0; color: var(--mi-ink); font-size: .84rem; font-weight: 600; }
    .module-settings-package p { min-height: 2.4em; margin: 4px 0 9px; color: var(--mi-muted); font-size: .61rem; }
    .module-settings-package .mi-btn { display: inline-flex; min-height: 30px; align-items: center; padding: 6px 10px; font-size: .62rem; }
    .module-settings-note { display: flex; align-items: center; gap: 7px; margin: 0; padding: 9px 11px; border: 1px solid var(--mi-line); border-radius: 8px; color: var(--mi-muted); background: var(--mi-paper); font-size: .6rem; line-height: 1.4; }
    .module-settings-note svg { flex: 0 0 15px; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
    .module-settings-tabs { display: none; }
    @media (max-width: 980px) { .module-settings-grid, .module-settings-packages { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 650px) {
      .module-settings-toolbar { align-items: flex-start; flex-direction: column; }
      .module-settings-toolbar .mi-btn { align-self: flex-start; }
      .module-settings-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 5px; padding: 5px; border: 1px solid var(--mi-line); border-radius: 10px 14px 10px 14px; background: var(--mi-paper); }
      .module-settings-tab { min-width: 0; min-height: 44px; padding: 8px 5px; border: 1px solid transparent; border-radius: 7px 10px 7px 10px; color: var(--mi-muted); background: transparent; font: inherit; font-size: .64rem; font-weight: 650; line-height: 1.15; cursor: pointer; }
      .module-settings-tab.is-active, .module-settings-tab[aria-selected="true"] { border-color: var(--mi-edge-aqua); color: var(--mi-ink); background: var(--mi-blue); }
      .module-settings-page[data-mobile-tab="module-grid"] #product-types,
      .module-settings-page[data-mobile-tab="module-grid"] #module-packages,
      .module-settings-page[data-mobile-tab="product-types"] #module-grid,
      .module-settings-page[data-mobile-tab="product-types"] #module-packages,
      .module-settings-page[data-mobile-tab="module-packages"] #module-grid,
      .module-settings-page[data-mobile-tab="module-packages"] #product-types { display: none; }
      .module-settings-card-top { min-height: 44px; }
      .module-settings-toggle-form,
      .module-settings-card-top > .module-settings-toggle { display: flex; width: 44px; min-width: 44px; height: 44px; min-height: 44px; align-items: center; justify-content: center; }
      .module-settings-toggle-form .module-settings-toggle,
      .module-settings-card-top > .module-settings-toggle { width: 44px; min-width: 44px; height: 44px; min-height: 44px; background: transparent; }
      .module-settings-toggle-form .module-settings-toggle::before,
      .module-settings-card-top > .module-settings-toggle::before { content: ""; position: absolute; top: 13.5px; left: 6.5px; width: 31px; height: 17px; border-radius: 999px; background: var(--mi-surface-grey); }
      .module-settings-toggle-form .module-settings-toggle.on::before,
      .module-settings-card-top > .module-settings-toggle.on::before { background: var(--mi-teal); }
      .module-settings-toggle-form .module-settings-toggle::after,
      .module-settings-card-top > .module-settings-toggle::after { top: 16.5px; left: 9.5px; }
      .module-settings-package .mi-btn { width: 100%; min-height: 44px; align-items: center; justify-content: center; }
      .module-settings-grid, .module-settings-packages { grid-template-columns: 1fr; }
    }
    .documents-page { display: grid; gap: 15px; }
    .documents-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .documents-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .documents-toolbar p:not(.mi-eyebrow) { max-width: 760px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .documents-action-form { margin: 0; }
    .documents-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr); gap: 15px; align-items: stretch; }
    .documents-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .documents-panel.blue { border-color: var(--mi-edge-aqua); background: var(--mi-blue); }
    .documents-panel.mint { border-color: var(--mi-edge-mint); background: var(--mi-mint); }
    .documents-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
    .documents-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .documents-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .documents-paper { min-height: 260px; padding: 17px; border: 1px solid #dfe7e2; background: var(--mi-paper); box-shadow: 0 7px 16px #17324d0d; }
    .documents-paper-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; color: var(--mi-ink); font-size: .68rem; }
    .documents-paper-head strong { font-size: .82rem; letter-spacing: .02em; }
    .documents-paper-head span { color: var(--mi-muted); font-size: .59rem; line-height: 1.5; text-align: right; }
    .documents-paper-rule { height: 1px; margin: 12px 0; background: var(--mi-line); }
    .documents-receipt-items { display: grid; gap: 0; }
    .documents-receipt-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid #e6ece9; color: var(--mi-ink); font-size: .68rem; }
    .documents-receipt-row:last-child { border-bottom: 0; }
    .documents-receipt-row span { min-width: 0; }
    .documents-receipt-row small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .59rem; }
    .documents-receipt-row strong { white-space: nowrap; font-size: .68rem; font-weight: 600; }
    .documents-receipt-total { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-top: 9px; color: var(--mi-ink); font-size: .74rem; }
    .documents-receipt-total strong { font-size: .94rem; font-weight: 600; }
    .documents-paper-footer { display: block; margin-top: 17px; color: var(--mi-muted); font-size: .59rem; }
    .documents-format-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .documents-format-buttons .documents-action-form,
    .documents-format-buttons .mi-btn { width: 100%; min-width: 0; }
    .documents-format-buttons .mi-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 33px; padding: 7px 11px; font-size: .64rem; }
    .documents-format-disabled { display: inline-flex; width: 100%; flex-direction: column; align-items: flex-start !important; gap: 2px; text-align: left; }
    .documents-format-disabled small { color: var(--mi-muted); font-size: .54rem; }
    .documents-warning { margin: 14px 0 0; padding: 10px; border: 1px solid var(--mi-edge-sand-5); border-radius: 7px 13px 7px 13px; color: var(--mi-text-sand-2); background: var(--mi-sand); font-size: .64rem; line-height: 1.45; }
    .documents-empty, .documents-empty-state { color: var(--mi-muted); font-size: .68rem; }
    .documents-empty-state { display: grid; min-height: 220px; place-content: center; gap: 10px; text-align: center; }
    .documents-empty-state strong { color: var(--mi-ink); font-size: .9rem; }
    .documents-empty-state span { max-width: 330px; }
    .documents-empty-state .mi-btn { justify-self: center; }
    @media (max-width: 980px) { .documents-grid { grid-template-columns: 1fr; } }
    @media (max-width: 650px) { .documents-toolbar { align-items: flex-start; flex-direction: column; } .documents-paper-head { flex-direction: column; } .documents-paper-head span { text-align: left; } .documents-format-buttons .mi-btn { min-height: 44px; } }
    .audit-page { display: grid; gap: 15px; }
    .audit-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .audit-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .audit-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .audit-toolbar-actions { display: flex; align-items: center; gap: 8px; align-self: center; }
    .audit-toolbar-actions .mi-btn { display: inline-flex; align-items: center; gap: 5px; }
    .audit-filter { display: grid; grid-template-columns: minmax(220px, 1.2fr) minmax(150px, .75fr) minmax(150px, .75fr) auto; gap: 8px; align-items: end; padding: 11px; border: 1px solid var(--mi-edge-aqua); border-radius: 8px 17px 8px 17px; background: var(--mi-blue); }
    .audit-filter label { display: grid; gap: 4px; color: var(--mi-muted); font-size: .62rem; }
    .audit-filter input, .audit-filter select { width: 100%; min-height: 35px; padding: 0 10px; }
    .audit-filter button { min-height: 35px; padding: 8px 13px; }
    .audit-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(290px, .75fr); gap: 15px; align-items: stretch; }
    .audit-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .audit-panel.blue { border-color: var(--mi-edge-aqua); background: var(--mi-blue); }
    .audit-panel.sand { border-color: var(--mi-edge-sand); background: var(--mi-sand); }
    .audit-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
    .audit-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .audit-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .audit-event-list { display: grid; gap: 0; max-height: 360px; overflow-y: auto; padding-right: 4px; }
    .audit-event { border-top: 1px solid var(--mi-line); }
    .audit-event:first-child { border-top: 0; }
    .audit-event > summary { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto 12px; gap: 9px; align-items: center; padding: 11px 0; cursor: pointer; list-style: none; }
    .audit-event > summary::-webkit-details-marker { display: none; }
    .audit-event > summary::after { content: "›"; color: var(--mi-teal); font-size: 1rem; line-height: 1; }
    .audit-event[open] > summary::after { content: "⌄"; }
    .audit-event-icon { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 8px; color: var(--mi-teal); background: var(--mi-mint); }
    .audit-event-icon svg { display: block; width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
    .audit-event-copy { min-width: 0; }
    .audit-event-copy strong { display: block; color: var(--mi-ink); font-size: .7rem; font-weight: 550; overflow-wrap: anywhere; }
    .audit-event-copy small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; overflow-wrap: anywhere; }
    .audit-event-time { color: var(--mi-muted); font-size: .61rem; white-space: nowrap; }
    .audit-event-mobile-time, .audit-mobile-back { display: none; }
    .audit-event-detail { display: grid; gap: 8px; margin: -1px 0 10px 36px; padding: 10px; border: 1px solid var(--mi-line); border-radius: 7px 13px 7px 13px; background: rgba(255,255,255,.52); }
    .audit-event-detail p { margin: 0; color: var(--mi-muted); font-size: .62rem; }
    .audit-event-detail pre { max-height: 190px; margin: 0; overflow: auto; color: var(--mi-ink); font: inherit; font-size: .61rem; line-height: 1.45; white-space: pre-wrap; overflow-wrap: anywhere; }
    .audit-detail-note { margin: 0 0 10px; padding: 10px; border: 1px solid var(--mi-edge-sand-5); border-radius: 7px 13px 7px 13px; color: var(--mi-text-sand-2); background: rgba(255,255,255,.4); font-size: .64rem; line-height: 1.45; }
    .audit-detail-list { display: grid; gap: 7px; }
    .audit-detail-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding: 9px 10px; border: 1px solid var(--mi-edge-sand-4); border-radius: 7px 13px 7px 13px; color: var(--mi-muted); background: rgba(255,255,255,.58); font-size: .63rem; }
    .audit-detail-row strong { color: var(--mi-ink); font-size: .65rem; font-weight: 550; text-align: right; overflow-wrap: anywhere; }
    .audit-empty { padding: 14px 0 4px; color: var(--mi-muted); font-size: .7rem; }
    .audit-pagination { margin-top: 10px; }
    @media (max-width: 980px) { .audit-grid { grid-template-columns: 1fr; } }
    @media (max-width: 760px) { .audit-filter { grid-template-columns: 1fr 1fr; } .audit-filter label:first-child { grid-column: 1 / -1; } .audit-filter button { justify-self: start; } }
    @media (max-width: 650px) {
      .audit-toolbar { align-items: flex-start; flex-direction: column; }
      .audit-toolbar-actions { align-self: flex-start; }
      .audit-filter { grid-template-columns: 1fr; }
      .audit-filter label:first-child { grid-column: auto; }
      .audit-event-list { max-height: none; overflow: visible; padding-right: 0; }
      .audit-event { border: 1px solid var(--mi-line); border-radius: 8px 13px 8px 13px; background: rgba(255,255,255,.52); }
      .audit-event > summary { grid-template-columns: 28px minmax(0, 1fr) 12px; gap: 8px; padding: 10px; }
      .audit-event-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
      .audit-event-copy small { line-height: 1.35; }
      .audit-event-time { display: none; }
      .audit-event-mobile-time { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .59rem; white-space: nowrap; }
      .audit-event > summary::after { grid-column: 3; grid-row: 1; justify-self: end; }
      .audit-event-detail { margin: 0 10px 10px; }
      .audit-page:not(:has(.audit-event.selected)) .audit-panel.sand { display: none; }
      .audit-page:has(.audit-event.selected) .audit-filter,
      .audit-page:has(.audit-event.selected) .audit-panel.blue,
      .audit-page:has(.audit-event.selected) .audit-toolbar-actions { display: none; }
      .audit-page:has(.audit-event.selected) .audit-panel.sand { grid-column: 1; }
      .audit-page:has(.audit-event.selected) .audit-mobile-back {
        display: flex; align-items: center; justify-content: center; min-height: 44px; margin-bottom: 12px;
        padding: 8px 10px; border: 1px solid var(--mi-line); border-radius: 8px 13px 8px 13px;
        color: var(--mi-teal); background: var(--mi-paper); font-size: .72rem; font-weight: 650; text-decoration: none;
      }
    }
    .security-page { display: grid; gap: 15px; }
    .security-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
    .security-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .security-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .security-toolbar-actions { align-self: center; }
    .security-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); gap: 15px; align-items: stretch; }
    .security-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .security-panel.blue { border-color: var(--mi-edge-aqua); background: var(--mi-blue); }
    .security-panel.mint { border-color: var(--mi-edge-mint); background: var(--mi-mint); }
    .security-panel.sand { border-color: var(--mi-edge-sand); background: var(--mi-sand); }
    .security-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
    .security-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
    .security-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
    .security-list { display: grid; gap: 0; }
    .security-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 11px 0; border-top: 1px solid var(--mi-line); }
    .security-row:first-child { border-top: 0; }
    .security-row strong { display: block; color: var(--mi-ink); font-size: .7rem; font-weight: 550; }
    .security-row small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
    .security-row-value { display: flex; align-items: center; gap: 8px; color: var(--mi-muted); font-size: .63rem; text-align: right; }
    .security-row-value .mi-btn { min-height: 30px; padding: 6px 10px; font-size: .63rem; }
    .security-session-list { display: grid; gap: 8px; }
    .security-session { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border: 1px solid var(--mi-line); border-radius: 7px 13px 7px 13px; background: rgba(255,255,255,.58); color: var(--mi-ink); font-size: .65rem; }
    .security-session strong { font-weight: 550; }
    .security-session span { color: var(--mi-teal); font-size: .62rem; font-weight: 550; }
    .security-session-note { margin: 10px 0 0; color: var(--mi-muted); font-size: .63rem; line-height: 1.45; }
    .security-rules { padding: 12px 14px; }
    .security-rules .security-panel-head { margin-bottom: 8px; }
    .security-rule-note { margin: 0; padding: 10px; border: 1px solid var(--mi-edge-sand-5); border-radius: 7px 13px 7px 13px; color: var(--mi-text-sand-2); background: rgba(255,255,255,.4); font-size: .64rem; line-height: 1.45; }
    .security-password-details { margin-top: 15px; padding: 12px 14px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; background: var(--mi-paper); }
    .security-password-details:not([open]) { margin: 0; padding: 0; border: 0; background: transparent; }
    .security-password-details > summary { cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 550; }
    .security-password-details:not([open]) > summary { display: none; }
    .security-password-details[open] > summary { margin-bottom: 12px; }
    .security-password-details form { display: grid; gap: 9px; max-width: 560px; }
    .security-password-details label { display: grid; gap: 4px; color: var(--mi-muted); font-size: .62rem; }
    .security-password-details input { width: 100%; min-height: 35px; padding: 0 9px; }
    .security-password-details p { margin: 0; color: var(--mi-muted); font-size: .65rem; line-height: 1.45; }
    .security-password-details button { justify-self: start; min-height: 33px; padding: 7px 10px; font-size: .66rem; }
    @media (max-width: 980px) { .security-grid { grid-template-columns: 1fr; } }
    @media (max-width: 650px) { .security-toolbar { align-items: flex-start; flex-direction: column; } .security-toolbar-actions { align-self: flex-start; } .security-row { grid-template-columns: 1fr; gap: 7px; } .security-row-value { justify-content: flex-start; text-align: left; } }
    .mi-positive { color: var(--mi-good); font-weight: 550; }
    .mi-negative { color: #b34f49; font-weight: 550; }
    .dashboard-page .expense-entry { background: var(--mi-mint); }
    @media (max-width: 1100px) { .mi-shell { grid-template-columns: 184px minmax(0, 1fr); } .mi-top { align-items: flex-start; flex-direction: column; } .mi-top-right { width: 100%; justify-content: space-between; } .pos-product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
    @media (max-width: 860px) { .mi-shell { display: block; } .mi-side { position: static; height: auto; min-height: 0; display: block; padding: 13px 14px 10px; border-radius: 0 0 18px 18px; } .mi-brand { display: inline-flex; padding: 0; } .mi-side > div:nth-child(2) { overflow-x: auto; } .mi-side-label, .mi-side-foot { display: none; } .mi-nav { display: flex; gap: 5px; margin-top: 10px; overflow-x: auto; padding-bottom: 2px; } .mi-nav-link { min-height: 36px; padding: 8px 10px; white-space: nowrap; font-size: .72rem; } .mi-main { width: 100%; } .mi-top { min-height: 0; padding: 14px 18px; } .mi-body { padding-top: 20px; } .pos-shell { grid-template-columns: 1fr; } .pos-cart { position: static; } }
    @media (max-width: 650px) { .mi-global-toolbar { align-items: flex-start; flex-direction: column; } .mi-actions { width: 100%; } .mi-actions .mi-btn { flex: 1; text-align: center; } .mi-top-left, .mi-top-right { width: 100%; } .mi-top-right { align-items: flex-start; flex-direction: column; } .mi-top-tools { width: 100%; overflow-x: auto; } .mi-top-tools a, .mi-top-tools select, .mi-logout { flex: 0 0 auto; } .workspace-switcher { grid-template-columns: 1fr; } .dashboard-hero { align-items: flex-start; flex-direction: column; } .dashboard-actions { justify-content: flex-start; } .dashboard-stats, .financial-grid { grid-template-columns: 1fr; } .period-filter { grid-template-columns: 1fr; } .pos-context-row { grid-template-columns: 1fr; } .pos-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .pos-line { grid-template-columns: 1fr 1fr; } .pos-line-product, .pos-line-description { grid-column: 1 / -1; } .pos-line-advanced { grid-column: 1 / -1; } .pos-line-advanced-grid { grid-template-columns: 1fr 1fr; } .pos-line-advanced-grid .pos-line-description { grid-column: 1 / -1; } .cart-actions { grid-template-columns: 1fr; } }
    @media (max-width: 430px) { .mi-body { padding: 16px 10px 42px; } .mi-top-tools { flex-wrap: wrap; overflow: visible; } .pos-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pos-line { grid-template-columns: 1fr; } .pos-line-product, .pos-line-description { grid-column: auto; } }
    @media (max-width: 980px) { .mi-branch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mi-branch-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mi-summary-item.primary { grid-column: 1 / -1; } .dashboard-currency-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .mi-grid-2 { grid-template-columns: 1fr; } .dashboard-lower-grid { grid-template-columns: 1fr; } .dashboard-lower-side { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dashboard-page-tools { justify-content: stretch; } .dashboard-page-tools .period-filter { flex: 1; } }
    @media (max-width: 650px) { .mi-entry-cards { grid-template-columns: 1fr; } .mi-branch-detail-panel { grid-template-columns: 1fr 1fr; } .mi-detail-main { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--mi-line); padding: 0 0 9px; } .dashboard-currency-grid, .dashboard-money-grid { grid-template-columns: 1fr; } .dashboard-page-tools { align-items: stretch; flex-direction: column; gap: 8px; } .dashboard-page-tools-copy { min-height: 0; text-align: left; } .dashboard-page-tools .period-filter { width: 100%; grid-template-columns: 1fr; } .dashboard-lower-side { grid-template-columns: 1fr; } .dashboard-lower-grid { gap: 12px; } .dashboard-page.has-one-currency .dashboard-currency-grid { grid-template-columns: 1fr; } .mi-filter { display: grid; grid-template-columns: 1fr; } .mi-field { min-width: 0; } .mi-total { align-items: flex-start; flex-direction: column; } .mi-row { grid-template-columns: 1fr auto; } .mi-row > b { grid-column: 2; grid-row: 1; } }
     @media (max-width: 430px) { .mi-body { padding-left: 12px; padding-right: 12px; } .mi-branch-grid, .mi-branch-summary, .mi-branch-detail-panel { grid-template-columns: 1fr; } .mi-summary-item.primary { grid-column: auto; } .mi-money { grid-template-columns: 1fr; } }
     .products-page { display: grid; gap: 15px; }
     .products-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 1px; }
     .products-toolbar h2 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
     .products-toolbar p:not(.mi-eyebrow) { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
     .products-toolbar-actions { align-self: center; }
     .products-toolbar-actions .mi-btn { display: inline-flex; align-items: center; gap: 5px; }
     .product-page-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); gap: 15px; align-items: start; }
     .product-page-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
     .product-page-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
     .product-page-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
     .product-page-panel h2 { margin: 0; color: var(--mi-ink); font-size: .95rem; font-weight: 550; }
     .product-page-panel > p { margin: 5px 0 13px; color: var(--mi-muted); font-size: .69rem; }
     .product-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
     .product-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
     .product-count { flex: 0 0 auto; }
     .product-searchbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; margin-bottom: 12px; }
     .product-searchbar input { min-width: 0; }
     .product-searchbar .mi-btn { min-height: 35px; }
     .product-data-table { width: 100%; border-collapse: collapse; color: var(--mi-ink); font-size: .69rem; }
     .product-data-table th { padding: 0 7px 8px; color: var(--mi-muted); font-size: .56rem; font-weight: 550; text-align: left; text-transform: uppercase; letter-spacing: .06em; }
     .product-data-table td { padding: 9px 7px; border-top: 1px solid var(--mi-line); vertical-align: middle; }
     .product-data-table th:first-child, .product-data-table td:first-child { padding-left: 0; }
     .product-data-table th:last-child, .product-data-table td:last-child { padding-right: 0; text-align: right; white-space: nowrap; }
     .product-data-table td strong { font-size: .73rem; font-weight: 550; }
     .product-data-table td small { display: inline-block; margin-top: 3px; color: var(--mi-muted); font-size: .61rem; }
     .product-data-table td a { color: inherit; text-decoration: none; }
     .product-data-table td a:hover { color: var(--mi-teal); }
     .product-data-table tr[data-product-row] { cursor: pointer; }
     .product-data-table tr[data-product-row]:hover td { background: rgba(255,255,255,.24); }
     .product-data-table tr[data-product-row]:focus-visible { outline: 2px solid var(--mi-teal); outline-offset: -2px; }
     .product-data-table tr[data-product-row].selected td { background: rgba(255,255,255,.34); }
     .product-mobile-list { display: none; }
     .product-mobile-back { display: none; }
     .product-mobile-media { display: grid; flex: 0 0 38px; width: 38px; height: 38px; place-items: center; overflow: hidden; border-radius: 10px; color: var(--mi-teal); background: var(--mi-mint); font-size: 1.25rem; }
     .product-mobile-media img { width: 100%; height: 100%; object-fit: cover; }
     .product-mobile-media svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
     .product-mobile-card { display: flex; min-width: 0; width: 100%; align-items: center; justify-content: space-between; gap: 10px; padding: 10px; border-bottom: 1px solid var(--mi-edge-grey); color: var(--mi-ink); background: var(--mi-paper); text-decoration: none; }
     .product-mobile-card:hover, .product-mobile-card:focus-visible { border-color: var(--mi-teal); box-shadow: 0 0 0 2px #1389802e; outline: 0; }
     .product-mobile-copy { min-width: 0; }
     .product-mobile-copy strong { display: block; overflow: hidden; font-size: .78rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
     .product-mobile-copy small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .63rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
     .product-mobile-meta { display: grid; flex: 0 0 auto; gap: 3px; margin-left: auto; text-align: right; }
     .product-mobile-meta strong { font-size: .72rem; font-weight: 700; white-space: nowrap; }
     .product-mobile-meta small { color: var(--mi-muted); font-size: .6rem; white-space: nowrap; }
     .product-empty { padding: 18px 0 4px; color: var(--mi-muted); font-size: .72rem; }
     .product-edit-panel form { display: grid; gap: 11px; }
     .product-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; align-items: start; }
     .product-form-grid label { display: grid; gap: 4px; align-content: start; color: var(--mi-muted); font-size: .62rem; }
     .product-form-grid label.full { grid-column: 1 / -1; }
     .product-form-grid input, .product-form-grid select, .product-form-grid textarea { width: 100%; min-height: 35px; padding: 0 10px; border: 1px solid var(--mi-line); border-radius: 8px; background: var(--mi-paper); color: var(--mi-ink); font: inherit; }
     .product-form-grid textarea { min-height: 67px; padding-top: 8px; resize: vertical; }
     .product-form-grid input[readonly] { color: var(--mi-muted); background: rgba(255,255,255,.58); }
     .product-form-grid .checkbox-label { display: flex; align-items: center; gap: 7px; align-self: end; min-height: 35px; color: var(--mi-ink); }
     .product-form-grid .checkbox-label input { width: 15px; min-height: 15px; padding: 0; }
     .product-details { display: block; border-top: 1px solid rgba(16,63,77,.16); padding-top: 10px; }
     .product-details summary { cursor: pointer; color: var(--mi-teal); font-size: .72rem; font-weight: 650; }
     .product-details[open] summary { margin-bottom: 9px; }
     .product-action-row { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 1px; }
     .product-action-row .mi-btn { min-height: 34px; display: inline-flex; align-items: center; gap: 5px; }
     .product-action-row .product-save-button { margin-left: auto; }
     .product-stock-panel { margin-top: 14px; padding: 13px; border: 1px solid #8bd6c4; border-radius: 12px 17px 12px 17px; background: #effaf5; }
     .product-stock-panel-head { display: grid; gap: 3px; }
     .product-stock-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
     .product-stock-title-row h3 { margin: 2px 0 4px; font-size: .92rem; }
     .product-stock-panel-head p:not(.mi-eyebrow) { margin: 0; color: var(--mi-muted); font-size: .68rem; line-height: 1.4; }
     .product-stock-badge { flex: 0 0 auto; padding: 4px 8px; border: 1px solid #b8e4d4; border-radius: 999px; color: var(--mi-teal); background: #daf4e9; font-size: .75rem; font-weight: 750; line-height: 1.1; text-align: right; white-space: nowrap; }
     .product-stock-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 11px; }
     .product-stock-actions form { display: grid; align-content: start; gap: 8px; min-width: 0; padding: 10px; border: 1px solid var(--mi-line); border-radius: 8px 12px 8px 12px; background: var(--mi-paper); }
     .product-stock-actions .product-stock-receive-form { border-color: #b7dfca; background: #f2fbf6; }
     .product-stock-actions .product-stock-adjust-form { border-color: #ddd1d3; background: #fbf7f7; }
     .product-stock-actions .mi-btn { width: 100%; min-height: 44px; justify-content: center; }
     .product-stock-actions .product-stock-receive-button { border-color: #9ed4b4; color: #135b47; background: #d5f0df; }
     .product-stock-actions .product-stock-receive-button:hover { background: #c1e7d0; }
     .product-stock-actions .product-stock-adjust-button { border-color: #cc9790; color: #71342f; background: var(--mi-coral); }
     .product-stock-actions .product-stock-adjust-button:hover { background: #ecd1cd; }
     .product-stock-link { display: inline-flex; margin-top: 12px; color: var(--mi-teal); font-size: .75rem; font-weight: 700; }
     .product-type-settings { margin-top: 15px; }
     .product-type-settings .module-settings-note { margin-bottom: 0; }
     .module-settings-panel-heading { margin-bottom: 12px; }
     .module-settings-panel-heading h2 { margin: 2px 0 4px; font-size: 1.02rem; }
     .module-settings-panel-heading p:not(.mi-eyebrow) { margin: 0; color: var(--mi-muted); font-size: .72rem; line-height: 1.45; }
     .product-file-button { cursor: pointer; }
     .product-file-button input { display: none; }
     .product-icon-field { min-width: 150px; }
     .product-icon-field input { min-height: 32px; }
     .product-symbol-icon { width: 15px; height: 15px; display: block; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
     @media (max-width: 980px) { .product-page-grid { grid-template-columns: 1fr; } }
     @media (max-width: 650px) { .products-page.product-mobile-editing .products-toolbar-actions { display: none; } .products-page:not(.product-mobile-editing) .product-edit-panel { display: none; } .products-page.product-mobile-editing .product-page-panel.blue { display: none; } .product-page-grid { display: block; } .product-searchbar, .product-form-grid { grid-template-columns: 1fr; } .product-form-grid label.full { grid-column: auto; } .product-data-table, .product-data-table thead, .product-data-table tbody, .product-data-table tr, .product-data-table th, .product-data-table td { display: none !important; } .product-mobile-list { display: flex; flex-direction: column; gap: 0; } .product-mobile-card { display: flex; align-items: center; justify-content: space-between; padding: 10px; border-bottom: 1px solid var(--mi-edge-grey); } .product-mobile-back { display: inline-flex; width: 100%; min-height: 42px; align-items: center; justify-content: center; margin-bottom: 12px; border: 1px solid var(--mi-line); border-radius: 8px 13px 8px 13px; color: var(--mi-teal); background: var(--mi-paper); font-size: .72rem; font-weight: 650; text-decoration: none; } .product-action-row { display: grid; grid-template-columns: 1fr; gap: 8px; } .product-action-row .mi-btn, .product-action-row .product-file-button { width: 100%; min-height: 44px; align-items: center; justify-content: center; margin-left: 0; } .product-edit-panel form { gap: 12px; } .product-stock-actions { grid-template-columns: 1fr; } .product-stock-title-row { align-items: flex-start; gap: 8px; } }
     .customers-page { display: grid; gap: 12px; }
     .customers-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin: 0 0 4px; }
     .customers-toolbar h1 { margin: 4px 0; font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
     .customers-toolbar p { max-width: 700px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
     .customers-toolbar-actions { align-self: center; }
     .customers-toolbar-actions .mi-btn { display: inline-flex; align-items: center; gap: 5px; }
     .customer-content-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(330px, .8fr); gap: 12px; align-items: start; }
     .customer-content-grid.single { grid-template-columns: 1fr; }
     .customer-list-panel, .customer-create-panel { min-width: 0; padding: 14px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; box-shadow: none; }
     .customer-list-panel { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
     .customer-create-panel { background: var(--mi-mint); border-color: var(--mi-edge-mint-strong); }
     .customer-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
     .customer-panel-head h2 { margin: 0; font-size: .95rem; font-weight: 550; }
     .customer-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .69rem; }
     .customer-search-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 7px; align-items: end; }
     .customer-search-row label { display: grid; gap: 5px; }
     .customer-search-row label span { color: var(--mi-muted); font-size: .62rem; }
     .customer-search-row button { display: inline-flex; align-items: center; gap: 5px; }
     .customer-search-row button svg { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
     .customer-list { display: grid; gap: 0; }
     a.customer-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--mi-line); color: var(--mi-ink); text-decoration: none; }
     a.customer-row:first-child { border-top: 0; }
     a.customer-row:hover { color: var(--mi-teal); }
     .customer-row-main { min-width: 0; }
     .customer-row-main strong { display: block; font-size: .75rem; font-weight: 550; }
     .customer-row-main small { display: block; margin-top: 3px; color: var(--mi-muted); font-size: .62rem; overflow-wrap: anywhere; }
     .customer-row-meta { display: flex; align-items: center; gap: 8px; flex: 0 0 auto; }
     .customer-row-meta b { color: var(--mi-ink); font-size: .72rem; font-weight: 550; white-space: nowrap; }
     .customer-list-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--mi-line); color: var(--mi-muted); font-size: .62rem; }
     .customer-list-footer .mi-btn { min-height: 32px; padding: 6px 9px; }
     .customer-pagination { display: flex; align-items: center; gap: 6px; }
     .customer-pagination .mi-btn[aria-disabled="true"] { opacity: .5; pointer-events: none; }
     .customer-create-panel form { display: grid; gap: 8px; }
     .customer-create-panel .grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
     .customer-create-panel label { display: grid; gap: 4px; }
     .customer-create-panel details { border: 1px solid var(--mi-edge-mint); border-radius: 7px 13px 7px 13px; background: #ffffff80; }
     .customer-create-panel summary { padding: 8px 10px; color: var(--mi-teal); cursor: pointer; font-size: .67rem; }
     .customer-create-panel details .grid { padding: 0 10px 10px; }
     .customer-create-panel .form-note { margin: 0; color: var(--mi-muted); font-size: .64rem; }
     .customer-create-panel form > button { width: max-content; }
     .customer-create-panel .customer-number { color: var(--mi-muted); }
     @media (max-width: 980px) { .customer-content-grid { grid-template-columns: 1fr; } }
     @media (max-width: 650px) { .customers-toolbar { align-items: flex-start; flex-direction: column; } .customers-toolbar-actions { align-self: flex-start; } .customer-search-row, .customer-create-panel .grid { grid-template-columns: 1fr; } a.customer-row { align-items: flex-start; flex-direction: column; } .customer-row-meta { width: 100%; justify-content: space-between; } }
    .cash-register-page { display: grid; gap: 15px; }
    .cash-register-toolbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
    .cash-register-toolbar h1 { margin: 4px 0; color: var(--mi-ink); font-size: clamp(1.8rem, 3vw, 2.45rem); font-weight: 500; letter-spacing: -.045em; }
    .cash-register-toolbar p:not(.mi-eyebrow) { max-width: 720px; margin: 0; color: var(--mi-muted); font-size: .78rem; }
    .cash-register-toolbar > .mi-btn { align-self: center; }
    .cash-register-top-grid { display: grid; grid-template-columns: minmax(270px, .7fr) minmax(0, 1.3fr); gap: 15px; align-items: stretch; }
    .cash-register-panel { min-width: 0; padding: 16px; border: 1px solid var(--mi-line); border-radius: 8px 17px 8px 17px; }
    .cash-register-panel.blue { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .cash-register-panel.mint { background: var(--mi-mint); border-color: var(--mi-edge-mint); }
    .cash-register-panel.sand { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .cash-register-panel.paper { background: var(--mi-paper); }
    .cash-register-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 11px; }
    .cash-register-panel h2 { margin: 0; color: var(--mi-ink); font-size: .98rem; font-weight: 550; }
    .cash-register-panel-head p { margin: 4px 0 0; color: var(--mi-muted); font-size: .68rem; line-height: 1.45; }
    .cash-register-form { display: grid; gap: 9px; }
    .cash-register-form label { display: grid; gap: 4px; color: var(--mi-muted); font-size: .62rem; }
    .cash-register-form input, .cash-register-form select { width: 100%; min-height: 35px; padding: 0 9px; }
    .cash-register-form .mi-btn { justify-self: start; min-height: 33px; padding: 7px 11px; font-size: .66rem; }
    .cash-register-open-list { display: grid; gap: 10px; }
    .cash-register-empty { padding: 16px; border: 1px dashed rgba(16,63,77,.25); border-radius: 8px 15px 8px 15px; color: var(--mi-muted); background: rgba(255,255,255,.55); font-size: .7rem; }
    .cash-register-session-card { display: grid; gap: 11px; padding: 13px; border: 1px solid rgba(16,63,77,.16); border-radius: 8px 15px 8px 15px; background: var(--mi-paper); }
    .cash-register-session-head { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
    .cash-register-session-head h2 { margin: 3px 0; font-size: .9rem; }
    .cash-register-session-head p { margin: 0; color: var(--mi-muted); font-size: .62rem; }
    .cash-register-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
    .cash-register-stats div { min-width: 0; padding: 8px; border-radius: 6px 11px 6px 11px; background: rgba(226,245,244,.65); }
    .cash-register-stats div.expected { background: var(--mi-sand); }
    .cash-register-stats span { display: block; color: var(--mi-muted); font-size: .57rem; line-height: 1.25; }
    .cash-register-stats strong { display: block; margin-top: 4px; color: var(--mi-ink); font-size: .68rem; overflow-wrap: anywhere; }
    .cash-register-note { margin: 0; padding: 8px 9px; border-left: 3px solid var(--mi-teal); color: var(--mi-muted); background: rgba(255,255,255,.58); font-size: .65rem; }
    .cash-register-actions-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; padding-top: 2px; }
    .cash-register-movement-form { padding: 10px; border: 1px solid var(--mi-edge-aqua); border-radius: 7px 13px 7px 13px; background: var(--mi-blue); }
    .cash-register-close-form { padding: 10px; border: 1px solid var(--mi-edge-sand); border-radius: 7px 13px 7px 13px; background: var(--mi-sand); }
    .cash-register-close-copy { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; color: var(--mi-ink); font-size: .68rem; }
    .cash-register-close-copy span { color: var(--mi-muted); font-size: .62rem; }
    .cash-register-table { width: 100%; border-collapse: collapse; color: var(--mi-ink); font-size: .67rem; }
    .cash-register-table th { padding: 0 7px 8px; color: var(--mi-muted); font-size: .56rem; font-weight: 550; text-align: left; text-transform: uppercase; letter-spacing: .06em; }
    .cash-register-table td { padding: 9px 7px; border-top: 1px solid rgba(16,63,77,.12); vertical-align: middle; }
    .cash-register-table th:first-child, .cash-register-table td:first-child { padding-left: 0; }
    .cash-register-table th:last-child, .cash-register-table td:last-child { padding-right: 0; }
    .cash-register-table td small { display: inline-block; margin-top: 3px; color: var(--mi-muted); font-size: .59rem; }
    .cash-register-movement { display: inline-flex; min-height: 20px; align-items: center; padding: 4px 7px; border-radius: 999px; font-size: .57rem; white-space: nowrap; }
    .cash-register-movement.cash-in { color: var(--mi-success-deep); background: var(--mi-mint); }
    .cash-register-movement.cash-out { color: var(--mi-text-sand); background: var(--mi-sand); }
    .cash-register-difference { display: block; font-size: .69rem; }
    .cash-register-difference.positive { color: var(--mi-success); }
    .cash-register-difference.negative { color: var(--mi-danger); }
    .cash-register-difference.balanced { color: var(--mi-teal); }
    @media (max-width: 1080px) { .cash-register-top-grid { grid-template-columns: 1fr; } .cash-register-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media (max-width: 720px) { .cash-register-actions-grid { grid-template-columns: 1fr; } .cash-register-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .cash-register-table { min-width: 720px; } .cash-register-panel .table-wrap { overflow-x: auto; } }
    /* Mobile shell: keep navigation reachable without making the page wider
       than the device, and give the most-used controls comfortable targets. */
    @media (max-width: 860px) {
      html, body { overflow-x: hidden; }
      .mi-shell { display: block; min-height: 100vh; padding: 0; background: var(--mi-bg); }
      .mi-side { position: sticky; top: 0; z-index: 20; display: block; height: auto; min-height: 0; padding: 10px 12px 8px; border-radius: 0 0 16px 16px; box-shadow: 0 5px 16px #103f4d26; }
      .mi-side::after { display: none; }
      .mi-side > div:nth-child(2) { overflow: hidden; }
      .mi-brand { gap: 8px; }
      .mi-brand .brand { font-size: 18px; }
      .mi-mark { width: 34px; height: 34px; font-size: 17px; }
      .mi-nav { display: flex; gap: 6px; margin-top: 8px; padding: 0 0 2px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: none; }
      .mi-nav::-webkit-scrollbar { display: none; }
      .mi-nav-link { flex: 0 0 auto; min-height: 34px; padding: 8px 10px; scroll-snap-align: start; font-size: .7rem; }
      .mi-main { width: 100%; min-width: 0; border: 0; border-radius: 0; overflow-x: clip; }
      .mi-body { width: auto; max-width: none; padding: 20px 14px 42px; }
      .mi-global-toolbar { gap: 10px; }
      .mi-global-toolbar > div:first-child { min-width: 0; }
      .mi-global-toolbar > div:first-child > p:last-child { font-size: .73rem; }
      .mi-actions { min-width: 0; }
      .mi-btn, button, .button { min-height: 40px; }
      .mi-panel, .mi-page-panel, .members-panel, .branches-panel, .sales-history-panel, .cash-register-panel, .product-page-panel, .security-panel, .documents-panel { padding: 14px; }
      .mi-field, .mi-filter, .accounting-filter, .sales-history-filter, .warehouse-filter, .audit-filter { min-width: 0; }
      input, select, textarea { max-width: 100%; }
      .table-wrap { max-width: 100%; }
    }
    @media (max-width: 650px) {
      .mi-top { gap: 8px; padding: 11px 14px; }
      .mi-top-left { width: 100%; }
      .mi-top-right { width: 100%; align-items: center; flex-direction: row; flex-wrap: wrap; gap: 7px; }
      .mi-top-right > span { order: 1; flex: 1 1 150px; min-width: 0; max-width: none; line-height: 1.3; }
      .mi-top-tools { order: 2; flex: 1 1 190px; width: auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
      .mi-top-tools::-webkit-scrollbar { display: none; }
      .mi-top-right > .mi-avatar { order: 3; }
      .mi-top-tools a, .mi-top-tools select, .mi-top-tools button, .mi-logout { min-height: 34px; padding: 7px 8px; }
      .mi-global-toolbar { align-items: flex-start; flex-direction: column; margin-bottom: 12px; }
      .mi-global-toolbar h1 { font-size: clamp(1.7rem, 7vw, 2.25rem); }
      .mi-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); width: 100%; gap: 7px; }
      .mi-actions .mi-btn { width: 100%; min-width: 0; flex: none; text-align: center; }
      .pos-toolbar-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
      .pos-toolbar-actions .button { min-width: 0; text-align: center; }
      .mi-panel-head, .members-panel-head, .branches-panel-head, .sales-history-panel-head, .cash-register-panel-head, .product-panel-head { gap: 8px; }
      .mi-panel-head p, .members-panel-head p, .branches-panel-head p, .sales-history-panel-head p, .cash-register-panel-head p, .product-panel-head p { overflow-wrap: anywhere; }
      .mi-filter, .accounting-filter, .sales-history-filter, .warehouse-filter, .audit-filter { grid-template-columns: 1fr; }
      .mi-filter .mi-btn, .accounting-filter .mi-btn, .sales-history-filter .mi-btn, .warehouse-filter .mi-btn, .audit-filter .mi-btn { width: 100%; }
      .mi-pos-currency-bar { gap: 9px; }
      .pos-search-row, .pos-barcode-controls { grid-template-columns: minmax(0, 1fr) auto; }
      .pos-line { gap: 7px; }
      .product-action-row .mi-btn { flex: 1 1 145px; justify-content: center; }
      .product-action-row .product-save-button { margin-left: 0; }
    }
    @media (max-width: 430px) {
      .mi-body { padding: 16px 12px 38px; }
      .mi-brand .brand { font-size: 17px; }
      .mi-brand small { font-size: 9px; }
      .mi-top-title { font-size: .9rem; }
      .mi-top-right > span { flex-basis: calc(100% - 42px); }
      .mi-top-tools { flex-basis: 100%; flex-wrap: nowrap; overflow-x: auto; }
      .mi-top-tools a, .mi-top-tools select, .mi-top-tools button, .mi-logout { flex: 0 0 auto; }
      .mi-nav-link { padding-right: 9px; padding-left: 9px; font-size: .68rem; }
      .mi-panel, .mi-page-panel, .members-panel, .branches-panel, .sales-history-panel, .cash-register-panel, .product-page-panel, .security-panel, .documents-panel { padding: 12px; }
      .pos-toolbar-actions { grid-template-columns: 1fr; }
      .pos-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .pos-line { grid-template-columns: 1fr 1fr; }
      .pos-line-product { grid-column: 1 / -1; }
      .pos-line-advanced { grid-column: 1 / -1; }
      .pos-line-advanced-grid { grid-template-columns: 1fr 1fr; }
      .pos-line-advanced-grid .pos-line-description { grid-column: 1 / -1; }
      .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .mi-summary-item, .dashboard-currency-card, .accounting-stat { padding: 12px; }
    }
    @media (max-width: 650px) {
      .mi-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 10px 12px; }
      .mi-top-left { grid-column: 1; grid-row: 1; width: auto; min-width: 0; }
      .mi-top-right { grid-column: 2; grid-row: 1; width: auto; min-width: 0; flex-wrap: nowrap; gap: 6px; }
      .mi-top-right > span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
      .mi-top-tools { order: 1; flex: 0 0 auto; width: min(160px, 38vw); max-width: 160px; overflow-x: auto; flex-wrap: nowrap; }
      .mi-top-right > .mi-avatar { order: 2; flex: 0 0 34px; }
    }
    @media (max-width: 430px) {
      .mi-top { padding-right: 10px; padding-left: 10px; }
      .mi-top-tools { width: min(142px, 38vw); }
      .mi-top-title { max-width: 150px; font-size: .86rem; }
      .mi-top-left > .mi-avatar { width: 30px; height: 30px; flex-basis: 30px; }
    }
    /* Schritt 2: Dashboard cards remain scannable without making the first
       screen unnecessarily long on a phone. */
    @media (max-width: 650px) {
      .dashboard-page { gap: 12px; }
      .mi-branch-strip { padding: 13px; }
      .mi-branch-summary { gap: 7px; }
      .mi-summary-item { padding: 10px; }
      .mi-branch-grid { gap: 7px; }
      .mi-branch-card { padding: 11px; }
      .mi-branch-detail-panel { padding: 11px; }
      .dashboard-currency-grid, .dashboard-money-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
      .dashboard-currency-card { padding: 12px; }
      .mi-grid-2 { gap: 12px; }
    }
    @media (max-width: 430px) {
      .mi-branch-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .mi-summary-item.primary { grid-column: 1 / -1; }
      .mi-branch-detail-panel { grid-template-columns: 1fr; }
    }
    /* Schritt 3: POS flow for a narrow screen. */
     @media (max-width: 650px) {
       .pos-mobile-tabs { position: sticky; top: 0; z-index: 12; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; margin: 0 0 10px; padding: 4px; border: 1px solid var(--mi-line); border-radius: 10px 15px 10px 15px; background: var(--mi-paper); box-shadow: 0 5px 14px #103f4d18; }
       .pos-mobile-tab { display: inline-flex; min-width: 0; min-height: 44px; align-items: center; justify-content: center; gap: 6px; padding: 8px 10px; border: 1px solid transparent; border-radius: 7px 11px 7px 11px; background: transparent; color: var(--mi-muted); font-size: .72rem; font-weight: 650; }
       .pos-mobile-tab svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
       .pos-mobile-tab.active, .pos-mobile-tab[aria-selected="true"] { border-color: var(--mi-teal); background: var(--mi-deep); color: #fff; }
       .pos-tab-count { display: inline-grid; min-width: 21px; min-height: 21px; place-items: center; padding: 2px 5px; border-radius: 999px; background: var(--mi-mint); color: var(--mi-teal); font-size: .64rem; line-height: 1; }
       .pos-mobile-tab.active .pos-tab-count, .pos-mobile-tab[aria-selected="true"] .pos-tab-count { background: #fff; color: var(--mi-deep); }
       .pos-shell[data-mobile-view="products"] .pos-cart { display: none; }
       .pos-shell[data-mobile-view="cart"] .pos-main { display: none; }
       .pos-shell[data-mobile-view="cart"] .pos-cart { display: grid; }
       .pos-manual-panel > summary { cursor: pointer; pointer-events: auto; align-items: flex-start; }
       .pos-manual-panel > summary .pos-manual-toggle { display: inline-grid; flex: 0 0 25px; width: 25px; height: 25px; place-items: center; border: 1px solid var(--mi-edge-mint-strong); border-radius: 50%; background: var(--mi-paper); color: var(--mi-teal); font-size: 1rem; font-weight: 800; line-height: 1; transition: transform .15s ease; }
       .pos-manual-panel[open] > summary .pos-manual-toggle { transform: rotate(45deg); }
       .pos-manual-panel:not([open]) > summary { background: #dff3e9; }
       .pos-manual-panel:not([open]) > summary h2 { font-weight: 700; }
       .pos-manual-panel:not([open]) > summary { margin-bottom: 0; }
       .pos-manual-panel > summary + .pos-manual-content { margin-top: 0; }
       .pos-shell[data-mobile-view="cart"] .pos-cart { order: 1; }
       .pos-payment-box .payment-currency-row { display: none; }
       .pos-toolbar > div:first-child { display: none; }
       .pos-toolbar { gap: 8px; margin-bottom: 8px; }
       .pos-toolbar-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 6px; }
       .pos-toolbar-actions .button { width: 100%; min-width: 0; min-height: 40px; justify-content: center; padding: 8px 6px; font-size: .68rem; text-align: center; }
      .pos-manual-panel { order: 1; }
      .pos-catalog-panel { order: 2; }
      .pos-products-panel { order: 3; }
       .pos-product-tile { min-height: 0; }
       .product-visual { height: 48px; }
       .pos-product-copy { padding: 6px 6px 7px; }
       .pos-product-copy strong { font-size: .68rem; }
       .pos-product-copy small { font-size: .56rem; }
       .pos-product-copy b { font-size: .69rem; }
       .payment-choice { min-height: 42px; }
     }
     @media (min-width: 480px) and (max-width: 650px) {
       .payment-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
     }
     @media (max-width: 430px) {
       .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
       .product-visual { height: 42px; }
       .pos-product-copy { padding: 5px 5px 6px; }
       .pos-product-copy strong { font-size: .65rem; }
       .pos-product-copy small { font-size: .53rem; }
       .pos-product-copy b { font-size: .67rem; }
     }
     @media (max-width: 650px) {
       .pos-page { gap: 12px; }
      .pos-toolbar { gap: 10px; margin-bottom: 2px; }
      .pos-shell { gap: 10px; }
      .pos-main { min-width: 0; gap: 10px; }
      .pos-panel, .pos-cart { padding: 12px; }
      .pos-catalog-panel, .pos-manual-panel, .pos-products-panel, .pos-cart { border-radius: 10px 15px 10px 15px; }
      .pos-product-grid { gap: 6px; }
      .pos-product-tile { min-width: 0; }
       .pos-product-copy { padding: 6px 6px 7px; }
       .pos-product-copy strong { font-size: .68rem; }
       .pos-product-copy small { font-size: .56rem; }
       .pos-product-copy b { font-size: .69rem; }
      .pos-cart { order: 2; box-shadow: 0 5px 14px #ab70291c; }
      .pos-cart h2 { font-size: 1rem; }
      .pos-cart-items { gap: 4px; max-height: min(38vh, 360px); }
      .pos-cart-row { gap: 8px; padding: 8px 0; }
      .cart-actions button { min-height: 44px; }
    }
     @media (max-width: 430px) {
       .pos-catalog-panel .section-heading, .pos-manual-panel .section-heading, .pos-products-panel .section-heading { align-items: flex-start; }
       .pos-catalog-panel .badge, .pos-manual-panel .badge { max-width: 42%; white-space: normal; text-align: right; }
       .pos-scan-button { min-width: 64px; }
       .pos-cart { border-radius: 10px 15px 10px 15px; }
       .pos-product-grid { gap: 5px; }
       .product-visual { height: 40px; }
       .pos-product-copy { padding: 4px 5px 5px; }
       .pos-product-copy strong { font-size: .65rem; }
       .pos-product-copy small { font-size: .53rem; }
       .pos-product-copy b { font-size: .67rem; }
    }
     /* Mobile product cards: keep the two-column catalog compact and readable. */
     @media (max-width: 650px) {
       .pos-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
       button.pos-product-tile { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; width: 100%; height: 64px; min-height: 64px; padding: 6px 8px; gap: 8px; border-radius: 8px; background: var(--mi-paper-2); text-align: left; }
       button.pos-product-tile .product-visual { flex: 0 0 32px; width: 32px; height: 32px; border-radius: 6px; }
       button.pos-product-tile .product-visual img { width: 100%; height: 100%; object-fit: contain; }
       button.pos-product-tile .pos-product-copy { display: flex; flex: 1 1 auto; min-width: 0; min-height: 0; flex-direction: column; align-items: flex-start; justify-content: space-between; align-self: stretch; gap: 1px; padding: 0; text-align: left; }
       button.pos-product-tile .pos-product-copy strong { color: var(--mi-ink); font-size: 12px; font-weight: 650; }
       button.pos-product-tile .pos-product-copy small { color: #6c757d; font-size: 10px; }
       button.pos-product-tile .pos-product-copy b { margin-top: auto; color: var(--mi-ink); font-size: 12px; font-weight: 700; }
     }
     @media (max-width: 430px) {
       button.pos-product-tile { height: 60px; min-height: 60px; }
     }
     /* Schritt 4: remaining routes keep their controls usable on phones. */
    @media (max-width: 650px) {
      .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
      .currency-detail-toolbar { flex-direction: column; }
      .currency-detail-toolbar .mi-btn { width: 100%; text-align: center; }
      .currency-detail-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .currency-detail-panel { padding: 13px; }
      .currency-detail-panel-head { flex-direction: column; }
      .currency-detail-count { align-self: flex-start; }
      .customers-toolbar-actions, .products-toolbar-actions, .audit-toolbar-actions { width: 100%; align-self: stretch; }
      .customers-toolbar-actions .mi-btn, .products-toolbar-actions .mi-btn { width: 100%; }
      .audit-toolbar-actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); }
      .audit-toolbar-actions .mi-btn { width: 100%; min-width: 0; }
      .members-table, .members-row-editor, .customer-content-grid, .product-page-grid { min-width: 0; }
      .members-row-editor form, .customer-create-panel form, .product-edit-panel form { min-width: 0; }
      .pagination { flex-wrap: wrap; }
    }
    @media (max-width: 430px) {
      .currency-detail-summary-grid { grid-template-columns: 1fr; }
      .customer-list-footer, .sales-history-footer { align-items: stretch; flex-direction: column; }
      .customer-list-footer .mi-btn { width: 100%; }
      .pagination .button { flex: 1 1 120px; text-align: center; }
    }
    /* Schritt 5: mobile workspace navigation becomes a compact menu instead
       of a second horizontal row that pushes the page content downward. */
    .mi-mobile-menu > summary { display: none; }
    .mi-mobile-menu > .mi-nav { display: grid; }
    @media (max-width: 860px) {
      .mi-side { position: sticky; display: flex; flex-direction: row; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; overflow: visible; }
      .mi-side-navigation { position: relative; display: flex; align-items: center; min-width: 0; }
      .mi-mobile-menu { position: relative; }
      .mi-mobile-menu > summary { display: flex; align-items: center; gap: 7px; min-height: 38px; padding: 8px 11px; border: 1px solid var(--mi-edge-teal); border-radius: 10px; background: var(--mi-deep-teal); color: #fff; cursor: pointer; font-size: .76rem; font-weight: 650; list-style: none; }
      .mi-mobile-menu > summary::-webkit-details-marker { display: none; }
      .mi-menu-icon { color: var(--mi-text-aqua); font-size: 1rem; line-height: 1; }
      .mi-mobile-menu[open] { position: relative; }
      .mi-mobile-menu[open] > .mi-nav { position: absolute; top: calc(100% + 6px); right: 0; left: auto; z-index: 30; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; width: min(238px, calc(100vw - 20px)); min-width: 0; max-width: calc(100vw - 20px); margin: 0; padding: 8px; overflow: visible; border: 1px solid #2c7478; border-radius: 12px; background: var(--mi-deep); box-shadow: 0 10px 24px #103f4d40; box-sizing: border-box; }
      .mi-mobile-menu[open] .mi-nav-link { min-height: 42px; padding: 10px; font-size: .78rem; }
      .mi-side > div:nth-child(2) { overflow: visible; }
      .mi-side-foot { display: none; }
      .mi-brand { min-width: 0; }
      .mi-brand > div { min-width: 0; }
    }
    @media (max-width: 430px) {
      .mi-mobile-menu[open] > .mi-nav { width: min(206px, calc(100vw - 20px)); grid-template-columns: 1fr; }
    }
    /* Schritt 6: reduce card padding while increasing the information users
       need to read at a glance on a narrow screen. */
    @media (max-width: 650px) {
      .mi-body { padding-top: 14px; }
      .mi-global-toolbar h1 { font-size: clamp(1.85rem, 8vw, 2.35rem); line-height: 1.08; }
      .mi-global-toolbar > div:first-child > p:last-child { font-size: .79rem; line-height: 1.42; }
      .mi-branch-strip { padding: 11px; }
      .mi-panel-head h2, .mi-panel-head h3 { font-size: 1rem; }
      .mi-panel-head p { font-size: .72rem; line-height: 1.38; }
      .mi-summary-item { padding: 9px 10px; }
      .mi-summary-item span { font-size: .68rem; }
      .mi-summary-item strong { margin-top: 5px; font-size: .94rem; line-height: 1.25; }
      .mi-branch-card { padding: 9px 10px; }
      .mi-branch-card small { margin-top: 6px; font-size: .68rem; }
      .mi-branch-card strong { margin-top: 4px; font-size: .85rem; line-height: 1.22; }
      .mi-branch-card em { margin-top: 5px; font-size: .69rem; }
      .mi-branch-detail { margin-top: 5px; font-size: .68rem; }
    }
    @media (max-width: 430px) {
      .mi-branch-card { padding: 8px 9px; }
      .mi-summary-item.primary { padding: 10px 11px; }
      .mi-branch-detail { gap: 4px 8px; }
    }
    /* Schritt 7: the mobile menu button sits before the logo and opens a
       left-side navigation sheet instead of a small clipped popover. */
    .mi-side-header { display: flex; flex-direction: column; gap: 26px; min-width: 0; }
    .mi-side-header .mi-brand { order: 1; }
    .mi-side-header .mi-mobile-menu { order: 2; min-width: 0; }
    .mi-menu-content { display: block; min-width: 0; }
    .mi-menu-content .mi-nav { display: grid; }
    @media (max-width: 860px) {
      .mi-side { display: block; padding: 8px 10px; }
      .mi-side-header { display: flex; flex-direction: row; align-items: center; gap: 8px; width: 100%; }
      .mi-side-header .mi-mobile-menu { order: -1; flex: 0 0 auto; width: auto; }
      .mi-side-header .mi-brand { order: 0; flex: 1 1 auto; }
      .mi-mobile-menu > summary { position: relative; z-index: 42; display: grid; place-items: center; width: 40px; height: 40px; min-height: 40px; padding: 0; border: 1px solid var(--mi-edge-teal); border-radius: 10px; background: var(--mi-deep-teal); color: #fff; cursor: pointer; list-style: none; }
      .mi-mobile-menu > summary::-webkit-details-marker { display: none; }
      .mi-menu-icon { color: var(--mi-text-aqua); font-size: 1.2rem; line-height: 1; }
      .mi-mobile-menu:not([open]) > .mi-menu-content { display: none; }
      .mi-mobile-menu[open] > .mi-menu-content { position: fixed; inset: 0 auto 0 0; z-index: 40; display: block; width: min(320px, 85vw); max-width: 100vw; padding: 84px 14px 26px; overflow-y: auto; background: var(--mi-deep); border-right: 1px solid var(--mi-edge-teal); border-radius: 0 18px 18px 0; box-shadow: 9px 0 24px #103f4d40; box-sizing: border-box; transform: translateX(0); animation: mi-menu-slide-in .22s ease-out; }
      .mi-menu-content .mi-side-label { display: block; margin: 0 9px 12px; }
      .mi-mobile-menu[open] > .mi-menu-content .mi-nav { display: grid; gap: 6px; margin: 0; }
      .mi-mobile-menu[open] > .mi-menu-content .mi-nav-link { min-height: 46px; padding: 11px 12px; white-space: normal; font-size: .88rem; }
    }
    @keyframes mi-menu-slide-in { from { opacity: .65; transform: translateX(-100%); } to { opacity: 1; transform: translateX(0); } }
    /* Schritt 8: dashboard cards stay readable on phones by using one full-width
       column. The total/owner view remains the first item in the visual order. */
    @media (max-width: 650px) {
      .dashboard-page .mi-branch-summary,
      .dashboard-page .mi-branch-grid,
      .dashboard-page .mi-entry-cards,
      .dashboard-page .dashboard-currency-grid,
      .dashboard-page .mi-grid-2,
      .dashboard-page .mi-branch-detail-panel {
        grid-template-columns: 1fr;
      }
      .dashboard-page .mi-summary-item.primary {
        grid-column: auto;
        order: -1;
      }
      .dashboard-page .mi-branch-summary > *,
      .dashboard-page .mi-branch-grid > *,
      .dashboard-page .mi-entry-cards > *,
      .dashboard-page .dashboard-currency-grid > *,
      .dashboard-page .mi-grid-2 > *,
      .dashboard-page .mi-branch-detail-panel > * {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
      }
    }
    /* Schritt 9: the date range form becomes a clean vertical stack on phones. */
    @media (max-width: 650px) {
      .dashboard-page .period-filter {
        grid-template-columns: 1fr;
        align-items: stretch;
      }
      .dashboard-page .period-filter label,
      .dashboard-page .period-filter button {
        width: 100%;
        min-width: 0;
        box-sizing: border-box;
      }
      .dashboard-page .period-filter button {
        margin-top: 2px;
      }
    }
    /* Schritt 10: recent sales and receivables become compact mobile cards
       instead of forcing a narrow table or a horizontal scroll. */
    .sales-card-meta { display: none; }
    @media (max-width: 650px) {
      .dashboard-page .sales-table-wrap { overflow: visible; }
      .dashboard-page .sales-activity-table {
        display: block;
        width: 100%;
        min-width: 0;
      }
      .dashboard-page .sales-activity-table thead { display: none; }
      .dashboard-page .sales-activity-table tbody {
        display: grid;
        gap: 8px;
      }
      .dashboard-page .sales-activity-table tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 3px 12px;
        padding: 11px 12px;
        border: 1px solid var(--mi-line);
        border-radius: 9px 16px 9px 16px;
        background: var(--mi-paper);
      }
      .dashboard-page .sales-activity-table td {
        display: block;
        padding: 0;
        border: 0;
        text-align: left;
      }
      .dashboard-page .sales-activity-table td.sales-date,
      .dashboard-page .sales-activity-table td.sales-status {
        display: none;
      }
      .dashboard-page .sales-activity-table td.sales-customer {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
      }
      .dashboard-page .sales-activity-table td.sales-customer strong {
        display: block;
        font-size: .86rem;
        line-height: 1.2;
      }
      .dashboard-page .sales-activity-table .sales-number { display: none; }
      .dashboard-page .sales-activity-table .sales-card-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 2px 7px;
        margin-top: 4px;
        color: var(--mi-muted);
        font-size: .67rem;
        line-height: 1.3;
      }
      .dashboard-page .sales-activity-table .sales-card-channel {
        color: var(--mi-teal);
        font-weight: 650;
      }
      .dashboard-page .sales-activity-table .sales-card-status {
        display: inline-flex;
        align-items: center;
        padding: 3px 7px;
        border-radius: 999px;
        font-size: .62rem;
        font-weight: 750;
        line-height: 1.1;
      }
      .dashboard-page .sales-activity-table .sales-card-status.paid {
        color: #147764;
        background: #dff5ed;
      }
      .dashboard-page .sales-activity-table .sales-card-status.open {
        color: #8a5a16;
        background: #fff0cc;
      }
      .dashboard-page .sales-activity-table .sales-card-status.cancelled {
        color: #9a4038;
        background: #f7e1df;
      }
      .dashboard-page .sales-activity-table td.number {
        grid-column: 2;
        grid-row: 1;
        align-self: center;
        text-align: right;
        color: var(--mi-ink);
        font-size: .98rem;
        font-weight: 750;
        white-space: nowrap;
      }
      .dashboard-page .sales-activity-table td[colspan] {
        grid-column: 1 / -1;
      }
      .dashboard-page .mi-grid-2 > section:first-child .receivable-row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 10px;
        padding: 11px 12px;
        border: 1px solid var(--mi-line);
        border-left: 3px solid var(--mi-danger);
        border-radius: 9px 16px 9px 16px;
        background: var(--mi-paper);
      }
      .dashboard-page .mi-grid-2 > section:first-child .receivable-row > span {
        min-width: 0;
      }
      .dashboard-page .mi-grid-2 > section:first-child .receivable-row > span > strong {
        font-size: .86rem;
      }
      .dashboard-page .mi-grid-2 > section:first-child .receivable-row > strong {
        text-align: right;
        font-size: .96rem;
        white-space: nowrap;
      }
    }
    /* Schritt 11: keep the POS entry point available as a thumb-friendly
       bottom tab while the dashboard is scrolled. */
    @media (max-width: 650px) {
      .dashboard-page {
        padding-bottom: 88px;
      }
      .dashboard-page > .dashboard-primary-actions .mi-entry-card.pos {
        position: fixed;
        left: max(12px, env(safe-area-inset-left));
        right: max(12px, env(safe-area-inset-right));
        bottom: max(12px, env(safe-area-inset-bottom));
        z-index: 35;
        min-height: 54px;
        padding: 11px 14px;
        border-radius: 12px;
        box-shadow: 0 10px 25px #103f4d45;
      }
      .dashboard-page > .dashboard-primary-actions .mi-entry-card.pos small {
        display: none;
      }
      .dashboard-page > .dashboard-primary-actions .mi-entry-card.pos strong {
        font-size: .98rem;
      }
    }
    /* Schritt 12: move the white system toolbar into the mobile drawer. */
    .mi-mobile-system-tools { display: none; }
    @media (max-width: 860px) {
      .mi-top { display: none; }
      .mi-mobile-menu > .mi-menu-content > .mi-nav > .mi-nav-link[href="/security"],
      .mi-mobile-menu > .mi-menu-content > .mi-nav > .mi-nav-link[href="/members"],
      .mi-mobile-menu > .mi-menu-content > .mi-nav > .mi-nav-link[href="/settings/currencies"],
      .mi-mobile-menu > .mi-menu-content > .mi-nav > .mi-nav-link[href="/settings/modules"] {
        display: none;
      }
      .mi-mobile-system-tools {
        display: block;
        margin-top: 12px;
        padding-top: 8px;
        border-top: 1px solid #ffffff2e;
      }
      .mi-mobile-system-tools > summary {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        min-height: 46px;
        padding: 11px 12px;
        border: 1px solid var(--mi-edge-teal);
        border-radius: 9px 14px 9px 14px;
        color: #fff;
        background: var(--mi-deep-teal);
        cursor: pointer;
        list-style: none;
        font-size: .82rem;
        font-weight: 700;
      }
      .mi-mobile-system-tools > summary::-webkit-details-marker { display: none; }
      .mi-mobile-system-tools > summary::after {
        content: "⌄";
        color: var(--mi-text-aqua);
        font-size: 1.1rem;
        line-height: 1;
      }
      .mi-mobile-system-tools[open] > summary::after { content: "⌃"; }
      .mi-mobile-system-panel { display: grid; gap: 8px; padding-top: 8px; }
      .mi-mobile-system-links { display: grid; gap: 6px; }
      .mi-mobile-system-link { min-height: 46px; }
      .mi-mobile-system-actions {
        display: grid;
        gap: 8px;
        padding-top: 10px;
        border-top: 1px solid #ffffff2e;
      }
      .mi-mobile-system-actions .language-picker,
      .mi-mobile-system-actions .inline {
        display: grid;
        gap: 5px;
        margin: 0;
      }
      .mi-mobile-system-actions label {
        color: #b9ded9;
        font-size: .68rem;
      }
      .mi-mobile-system-actions select,
      .mi-mobile-system-actions button {
        width: 100%;
        min-height: 42px;
        box-sizing: border-box;
      }
    }

    /* Shared type hierarchy and numeric alignment. Compact table headers and
       status pills keep their local sizing; readable supporting copy does not
       fall below 12px. */
    .mi-body h1 { font-weight: var(--mi-weight-title); }
    .mi-body h2, .mi-body h3 { font-weight: var(--mi-weight-section); }
    .mi-body small,
    .mi-body .muted,
    .mi-body label,
    .mi-body .mi-global-toolbar > div:first-child > p:last-child {
      font-size: max(var(--mi-text-meta), .7em);
    }
    .number,
    .balance,
    .cart-total strong,
    .pos-total strong,
    .mi-total strong,
    .account-hero-balance strong,
    .customer-balance-amount,
    .accounting-stat strong,
    .dashboard-currency-metric strong,
    .dashboard-receivable-row > strong,
    .product-mobile-meta strong,
    .product-stock-badge,
    .warehouse-stock-quantity,
    .cash-register-stats strong {
      font-variant-numeric: tabular-nums;
    }
    .cart-total strong,
    .pos-total strong,
    .mi-total strong,
    .account-hero-balance strong,
    .customer-balance-amount,
    .accounting-stat strong,
    .dashboard-receivable-row > strong,
    .cash-register-stats strong {
      font-weight: var(--mi-weight-value);
    }

    /* Touch targets: keep dense desktop tables compact, but make the controls
       comfortable on phones, tablets, and coarse-pointer devices. */
    @media (max-width: 1024px), (pointer: coarse) {
      .mi-btn, button, .button,
      input:not([type="hidden"]):not(.sr-only), select:not(.sr-only), textarea,
      .mi-nav-link,
      .mi-top-tools a, .mi-top-tools select, .mi-top-tools button, .mi-logout,
      .mi-mobile-menu > summary,
      .mi-mobile-system-tools > summary,
      .mi-currency-buttons button, .payment-currency-row button,
      button.payment-choice,
      .pos-inline-customer-action,
      .product-mobile-back {
        min-height: 44px;
      }
      .mi-btn, button, .button { padding-top: 10px; padding-bottom: 10px; }
      .mi-nav-link { padding-top: 10px; padding-bottom: 10px; }
      .product-mobile-card { min-height: 56px; }
    }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
      }
    }
    /* Wiederverwendbare Bausteine (src/web/components.ts). Nur Tokens, keine festen
       Farben außer Weiß auf dunklem Grund; wirkt damit in allen Themes. */
    .mi-btn.danger { background: var(--mi-danger); border-color: var(--mi-danger); color: #fff; }
    .mi-btn.ghost { background: transparent; border-color: transparent; color: var(--mi-ink); }
    .mi-btn.ghost:hover { background: var(--mi-bg); filter: none; }
    .mi-btn[aria-disabled="true"], .mi-btn:disabled { opacity: .55; pointer-events: none; }

    .ui-card { background: var(--mi-paper); border: 1px solid var(--mi-line); border-radius: var(--mi-radius-card); padding: var(--mi-space-5); box-shadow: var(--mi-shadow-card); }
    .ui-card.tone-info { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .ui-card.tone-success { background: var(--mi-mint); border-color: var(--mi-edge-mint); }
    .ui-card.tone-warning { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .ui-card.tone-danger { background: var(--mi-coral); border-color: var(--mi-danger); }
    .ui-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--mi-space-3); margin-bottom: var(--mi-space-3); }
    .ui-card-head h3 { margin: 0; font-size: 1.02rem; }
    .ui-card-body { color: var(--mi-ink); font-size: .86rem; line-height: 1.5; }
    .ui-card-foot { margin-top: var(--mi-space-4); display: flex; flex-wrap: wrap; gap: var(--mi-space-2); }
    .ui-eyebrow { margin: 0 0 4px; color: var(--mi-muted); font-size: .68rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

    .ui-badge { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: .72rem; font-weight: 700; line-height: 1.3; background: var(--mi-bg); color: var(--mi-muted); }
    .ui-badge.tone-success { background: var(--mi-mint); color: var(--mi-success-deep); }
    .ui-badge.tone-info { background: var(--mi-blue); color: var(--mi-ink); }
    .ui-badge.tone-warning { background: var(--mi-sand); color: var(--mi-gold); }
    .ui-badge.tone-danger { background: var(--mi-coral); color: var(--mi-danger); }

    .ui-field { display: grid; gap: 5px; }
    .ui-field { align-content: start; }
    .ui-field > label { display: block; color: var(--mi-ink); font-size: .74rem; font-weight: 700; }
    .ui-field .ui-hint { color: var(--mi-muted); font-size: .72rem; }
    .ui-field .ui-error { color: var(--mi-danger); font-size: .74rem; font-weight: 600; }
    .ui-field.has-error input, .ui-field.has-error select, .ui-field.has-error textarea { border-color: var(--mi-danger); }
    .ui-field .ui-required { color: var(--mi-danger); }

    .ui-table-wrap { overflow-x: auto; border: 1px solid var(--mi-line); border-radius: var(--mi-radius-card); background: var(--mi-paper); }
    .ui-table { width: 100%; border-collapse: collapse; font-size: .82rem; }
    .ui-table caption { padding: var(--mi-space-3) var(--mi-space-4); text-align: left; color: var(--mi-muted); font-size: .74rem; }
    .ui-table th { padding: 10px var(--mi-space-4); text-align: left; color: var(--mi-muted); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; border-bottom: 1px solid var(--mi-line); background: var(--mi-bg); }
    .ui-table td { padding: 11px var(--mi-space-4); border-bottom: 1px solid var(--mi-line); vertical-align: middle; }
    .ui-table tr:last-child td { border-bottom: 0; }
    .ui-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
    .ui-table .ui-empty { padding: var(--mi-space-6); text-align: center; color: var(--mi-muted); }

    .ui-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--mi-space-3); padding: var(--mi-space-3) var(--mi-space-4); border: 1px solid var(--mi-line); border-radius: var(--mi-radius-card); background: var(--mi-paper); }
    .ui-banner .ui-banner-text { display: grid; gap: 2px; min-width: 0; }
    .ui-banner .ui-banner-title { font-weight: 700; font-size: .88rem; }
    .ui-banner .ui-banner-hint { color: var(--mi-muted); font-size: .78rem; }
    .ui-banner .ui-banner-days { font-family: var(--mi-font-head, inherit); font-weight: 800; font-size: 1.15rem; font-variant-numeric: tabular-nums; }
    .ui-banner.status-trial { background: var(--mi-blue); border-color: var(--mi-edge-aqua); }
    .ui-banner.status-active { background: var(--mi-mint); border-color: var(--mi-edge-mint); }
    .ui-banner.status-renewal, .ui-banner.status-grace { background: var(--mi-sand); border-color: var(--mi-edge-sand); }
    .ui-banner.status-locked { background: var(--mi-coral); border-color: var(--mi-danger); }

    .ui-styleguide { display: grid; gap: var(--mi-space-6); max-width: 1100px; margin: 0 auto; padding: var(--mi-space-6) var(--mi-space-4) 60px; }
    .ui-styleguide h2 { margin: 0 0 var(--mi-space-3); }
    .ui-styleguide .ui-row { display: flex; flex-wrap: wrap; gap: var(--mi-space-3); align-items: center; }
    .ui-styleguide .ui-grid { display: grid; gap: var(--mi-space-4); grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
    .ui-styleguide .ui-swatches { display: grid; gap: var(--mi-space-2); grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
    .ui-styleguide .ui-swatch { border: 1px solid var(--mi-line); border-radius: var(--mi-radius-control); overflow: hidden; font-size: .7rem; background: var(--mi-paper); }
    .ui-styleguide .ui-swatch i { display: block; height: 34px; }
    .ui-styleguide .ui-swatch span { display: block; padding: 5px 7px; color: var(--mi-muted); }

    /* Öffentliche Seiten (Anmeldung, Passwort): Kopfzeile, getönte Karte, Fußzeile.
       Alle Maße sind in em und hängen an der Schriftgröße von .ui-public, die mit der
       Bildschirmbreite wächst (16 px auf Handy und Tablet bis 20 px auf sehr großen
       Bildschirmen). So bleibt die Karte auf jedem Gerät gut lesbar und angemessen groß. */
    body:has(.ui-public) { background: var(--mi-auth-bg); }
    body:has(.ui-public) > main { width: 100%; max-width: none; margin: 0; padding: 0; }
    .ui-public { font-size: clamp(16px, calc(9.5px + .45vw), 20px); min-height: 100vh; display: flex; flex-direction: column; background: var(--mi-auth-bg); }
    .ui-public-header { display: flex; align-items: center; justify-content: space-between; gap: 1em; padding: .85em 1.5em; background: transparent; border-bottom: 1px solid rgba(255, 255, 255, .12); }
    .ui-brand { color: var(--mi-mint); font-family: var(--mi-font-head, inherit); font-size: 1.2em; font-weight: 800; letter-spacing: .02em; white-space: nowrap; }
    .ui-brand small { color: rgba(255, 255, 255, .72); font-size: .72em; font-weight: 600; letter-spacing: 0; }
    .ui-lang { display: inline-flex; gap: 2px; padding: 3px; background: rgba(255, 255, 255, .14); border-radius: var(--mi-radius-control); }
    .ui-lang button { min-height: 2.1em; padding: .25em .85em; border: 0; border-radius: 6px; background: transparent; color: rgba(255, 255, 255, .82); font-size: .8em; font-weight: 700; }
    .ui-lang button.is-active { background: var(--mi-paper); color: var(--mi-deep); }
    .ui-public-main { flex: 1; display: grid; align-content: center; justify-items: center; padding: 2em 1em 3em; }
    .ui-auth-stack { width: 100%; max-width: 37em; }
    .ui-auth-card { box-sizing: border-box; width: 100%; padding: 2.1em 2.4em; background: var(--mi-paper); border: 0; border-radius: var(--mi-radius-card); box-shadow: 0 1.4em 3.4em rgba(0, 0, 0, .38), 0 0 0 1px rgba(255, 255, 255, .06); }
    .ui-auth-card h1 { margin: 0 0 .25em; font-size: 1.8em; letter-spacing: -.02em; line-height: 1.15; }
    .ui-auth-lead { margin: 0; color: var(--mi-muted); font-size: .95em; line-height: 1.45; }
    .ui-auth-card form { display: grid; gap: 1.1em; margin-top: 1.5em; }
    .ui-auth-card .ui-field { gap: .4em; }
    .ui-auth-card .ui-field > label { font-size: .85em; }
    .ui-auth-card input { min-height: 2.9em; font-size: .95em; }
    .ui-auth-card form .mi-btn { width: 100%; min-height: 2.9em; justify-content: center; font-size: .92em; }
    .ui-auth-links { margin: 1.1em 0 0; font-size: .9em; text-align: center; }
    .ui-auth-card .alert { margin: 0 0 1em; font-size: .9em; }
    .ui-auth-footer { display: flex; justify-content: center; text-align: center; gap: .75em; margin-top: 1.4em; color: rgba(255, 255, 255, .7); font-size: .8em; }
    @media (max-width: 640px) { .ui-public-header { padding: .75em 1em; } .ui-public-main { padding: 1.6em .8em 1.6em; } .ui-auth-card { padding: 1.6em 1.3em; } }
    /* Abrechnung: Plan, Zahlungsweg, Nachweisformular und Verlauf */
    .ui-billing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; margin-top: 16px; }
    .ui-billing-grid > :last-child { grid-column: 1 / -1; }
    .ui-facts { display: grid; gap: 12px; margin: 0; }
    .ui-facts > div { display: grid; gap: 2px; }
    .ui-facts dt { color: var(--mi-muted); font-size: .8em; }
    .ui-facts dd { margin: 0; }
    .ui-facts-list { display: grid; gap: 6px; margin: 10px 0; padding: 0; list-style: none; }
    /* Öffentliche Seiten (Startseite, Preise, Rechtstexte, Registrierung): gleiche graue Hülle wie die App und die Anmeldung, ohne Skript. Klassen mit ps-. Größen in em, Grundgröße .9rem. */
    html:has(.ps-site) { background: #e2e3e1; }
    body:has(.ps-site) { background: linear-gradient(180deg, #ececea 0%, #dcddda 100%) fixed; }
    body:has(.ps-site) > main { width: 100%; max-width: none; margin: 0; padding: 0; }
    .ps-site {
      box-sizing: border-box; width: calc(100% - 2 * var(--mi-gap-x)); min-height: calc(100vh - 2 * var(--mi-gap-y)); margin: var(--mi-gap-y) auto; padding: 1.25rem;
      display: flex; flex-direction: column; gap: .9rem; border-radius: 2.25rem; background: #fff; box-shadow: 0 .75rem 2.5rem #14201a14;
      color: var(--mi-ink); font-family: inherit; font-size: .9rem;
    }
    .ps-site > main { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; gap: 3.2em; padding: 1.8em; border-radius: 1.6rem; background: var(--mi-shell-panel, #f7f7f6); }
    .ps-site > main > * { width: 100%; max-width: 78rem; margin-inline: auto; }
    .ps-wrap { width: 100%; }
    .ps-header { display: block; border: 0; border-radius: 1.6rem; background: var(--mi-shell-panel, #f7f7f6); }
    .ps-header-row { display: flex; align-items: center; gap: 1.6em; padding: .85em 1.6em; flex-wrap: wrap; }
    .ps-brand { color: var(--mi-ink); font-family: var(--mi-font-head, inherit); font-size: 1.15em; font-weight: 800; letter-spacing: .02em; text-decoration: none; white-space: nowrap; }
    .ps-brand small { color: var(--mi-muted); font-size: .85em; font-weight: 600; letter-spacing: 0; }
    .ps-nav { display: flex; gap: 1.6em; margin-right: auto; }
    .ps-nav a { color: var(--mi-ink); font-weight: 600; text-decoration: none; }
    .ps-nav a:hover { color: var(--mi-teal-text); }
    .ps-header-actions { display: flex; align-items: center; gap: 1em; }
    .ps-site .ui-lang { background: #fff; }
    .ps-site .ui-lang button { color: var(--mi-muted); }
    .ps-site .ui-lang button.is-active { background: var(--mi-teal); color: #fff; }
    .ps-link { color: var(--mi-ink); font-weight: 700; text-decoration: none; }
    .ps-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 2.8em; padding: .7em 1.6em; border: 1px solid var(--mi-teal); border-radius: 999px; background: var(--mi-teal); color: #fff; font-size: .95em; font-weight: 700; text-decoration: none; cursor: pointer; }
    .ps-btn:hover { background: var(--mi-deep); border-color: var(--mi-deep); }
    .ps-btn-quiet { background: #fff; border-color: var(--mi-line); color: var(--mi-ink); }
    .ps-btn-quiet:hover { background: var(--mi-panel); border-color: var(--mi-line); }
    .ps-btn-white { background: #fff; border-color: #fff; color: var(--mi-deep); }
    .ps-btn-white:hover { background: var(--mi-mint); border-color: var(--mi-mint); }
    .ps-btn-ghost { background: transparent; border-color: #ffffff80; color: #fff; }
    .ps-btn-ghost:hover { background: #ffffff1f; border-color: #fff; }
    .ps-btn-lg { min-height: 3.2em; padding: .85em 2em; font-size: 1.02em; }
    .ps-site h1 { margin: .45em 0; font-family: var(--mi-font-head, inherit); font-size: clamp(2rem, 3.4vw, 3.1rem); font-weight: 700; line-height: 1.08; letter-spacing: -.035em; }
    .ps-site h2 { margin: .3em 0 .25em; font-family: var(--mi-font-head, inherit); font-size: clamp(1.5rem, 2.2vw, 2rem); font-weight: 700; letter-spacing: -.025em; line-height: 1.15; }
    .ps-site h3 { margin: 0 0 .35em; font-family: var(--mi-font-head, inherit); font-size: 1.1em; font-weight: 700; }
    .ps-lead { max-width: 46em; margin: 0 0 1em; color: var(--mi-muted); font-size: 1.08em; line-height: 1.6; }
    .ps-tag { display: inline-block; padding: .3em .85em; border-radius: 99px; background: var(--mi-mint); color: var(--mi-teal-text); font-size: .85em; font-weight: 700; }
    .ps-actions { display: flex; gap: .8em; flex-wrap: wrap; margin-top: 1.4em; }
    .ps-card { padding: 1.3em 1.5em; border: 0; border-radius: 1.3rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-card p { margin: 0 0 .6em; color: var(--mi-muted); line-height: 1.5; }
    .ps-panel { padding: 1.7em; border-radius: 1.6rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-section { padding: 0; }
    .ps-grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9em; margin-top: 1.1em; }
    .ps-grid-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .9em; margin-top: 1.1em; }
    .ps-ico { display: grid; place-items: center; width: 2.6em; height: 2.6em; margin-bottom: .7em; border-radius: .9em; background: var(--mi-mint); color: var(--mi-teal); font-size: 1.1em; font-weight: 800; transition: transform .25s; }
    .ps-card:hover .ps-ico { transform: scale(1.12) rotate(-5deg); }
    .ps-who { text-align: center; }
    .ps-who .ps-ico { margin-inline: auto; border-radius: 50%; font-size: 1.5em; }
    .ps-badge { display: inline-block; margin-bottom: .5em; padding: .25em .7em; border-radius: 99px; background: var(--mi-mint); color: var(--mi-teal-text); font-size: .8em; font-weight: 700; }
    .ps-badge-soft { background: var(--mi-mint); color: var(--mi-teal-text); }

    /* Startseite: Kopf mit bewegtem Programmbild */
    .ps-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 1.4em; align-items: center; }
    .ps-hero-text { padding: .8em .6em .8em .8em; }
    .ps-proof { display: flex; flex-wrap: wrap; gap: 1.4em; margin-top: 1.6em; color: var(--mi-muted); font-size: .9em; }
    .ps-proof b { display: block; color: var(--mi-ink); font-size: 1.4em; }
    .ps-stage { position: relative; min-height: 28em; overflow: hidden; border-radius: 2rem; background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); }
    .ps-stage::before { content: ""; position: absolute; top: -7em; right: -6em; width: 22em; height: 22em; border-radius: 50%; background: #ffffff12; }
    .ps-win { position: absolute; left: 2.2em; top: 2.6em; width: 25em; max-width: calc(100% - 4em); padding: 1.1em; border-radius: 1.4em; background: #fff; box-shadow: 0 1.4em 3em #0008; }
    .ps-win h4 { margin: 0 0 .6em; color: var(--mi-muted); font-size: .9em; font-weight: 600; }
    .ps-win-k { display: grid; grid-template-columns: 1fr 1fr; gap: .45em; margin-bottom: .8em; }
    .ps-win-k div { padding: .55em .7em; border-radius: .8em; background: var(--mi-panel); color: var(--mi-muted); font-size: .78em; }
    .ps-win-k b { display: block; color: var(--mi-ink); font-size: 1.4em; }
    .ps-bars { display: flex; align-items: flex-end; gap: .5em; height: 6.4em; }
    .ps-bars-small { height: 5em; margin-top: .8em; }
    .ps-bars i { flex: 1; height: var(--h); border-radius: .4em .4em 0 0; background: var(--mi-teal); transform-origin: bottom; animation: ps-grow 3.6s ease-in-out infinite; }
    .ps-bars i:nth-child(even) { background: #9fd2b6; }
    .ps-bars i:nth-child(2) { animation-delay: .15s; } .ps-bars i:nth-child(3) { animation-delay: .3s; } .ps-bars i:nth-child(4) { animation-delay: .45s; } .ps-bars i:nth-child(5) { animation-delay: .6s; } .ps-bars i:nth-child(6) { animation-delay: .75s; }
    @keyframes ps-grow { 0% { transform: scaleY(.15); } 30%, 85% { transform: scaleY(1); } 100% { transform: scaleY(.15); } }
    .ps-float { position: absolute; padding: .75em 1em; border-radius: 1.1em; background: #fff; box-shadow: 0 .9em 2.2em #0006; color: var(--mi-muted); font-size: .85em; animation: ps-bob 5s ease-in-out infinite; }
    .ps-float b { display: block; color: var(--mi-ink); font-size: 1.25em; }
    .ps-f1 { top: 4.6em; right: 1.6em; } .ps-f2 { top: 13em; right: 3.4em; animation-delay: 1.2s; }
    .ps-ok { color: var(--mi-teal) !important; }
    @keyframes ps-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.7em); } }
    .ps-sale { position: absolute; right: 2em; bottom: 2.2em; width: 13.5em; padding: .85em 1em; border-radius: 1.1em; background: #fff; box-shadow: 0 .9em 2.2em #0006; font-size: .85em; }
    .ps-sale > div { display: flex; justify-content: space-between; padding: .25em 0; border-bottom: 1px dashed var(--mi-line); }
    .ps-sale > .ps-sale-pay { justify-content: center; margin-top: .6em; padding: .5em; border: 0; border-radius: 99px; background: var(--mi-teal); color: #fff; font-weight: 700; animation: ps-pulse 2.4s ease-in-out infinite; }
    @keyframes ps-pulse { 0%, 100% { box-shadow: 0 0 0 0 #176b4666; } 50% { box-shadow: 0 0 0 .6em #176b4600; } }

    /* Warum Miisaan: vorher und nachher */
    .ps-pain { display: grid; grid-template-columns: minmax(0, 1fr) 3em minmax(0, 1fr); gap: .6em; align-items: center; margin-top: 1.2em; }
    .ps-pain h3 { margin: 0 0 .7em; font-size: 1.15em; }
    .ps-before, .ps-after { padding: 1.5em 1.7em; border-radius: 1.5rem; }
    .ps-before { background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-after { background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-after h3 { color: #fff; }
    .ps-pain-arrow { text-align: center; color: var(--mi-teal); font-size: 2em; font-weight: 800; }
    .ps-site ul { margin: 0; padding: 0; list-style: none; display: grid; gap: .6em; }
    .ps-site li { position: relative; padding-left: 1.5em; line-height: 1.45; }
    .ps-site li::before { content: ""; position: absolute; left: 0; top: .5em; width: .6em; height: .6em; border-radius: 50%; background: var(--mi-teal); }
    .ps-before li::before { background: var(--mi-danger); }
    .ps-after li::before { background: var(--mi-lime, #b8f46e); }

    /* Pakete mit Bild und Beispielen */
    .ps-pkgs { display: grid; gap: 1em; margin-top: 1.2em; }
    .ps-pkg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 1.6em; align-items: center; padding: 1.7em 1.9em; border-radius: 1.8rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-pkg.is-rev .ps-pkg-text { order: 2; }
    .ps-pkg h3 { margin: .5em 0 .25em; font-size: 1.5em; letter-spacing: -.02em; }
    .ps-pkg-for { margin: 0 0 .9em; color: var(--mi-muted); line-height: 1.5; }
    .ps-use { margin-top: .5em; padding: .6em .85em; border-radius: .9em; background: var(--mi-panel); line-height: 1.45; }
    .ps-use b { color: var(--mi-teal); }
    .ps-pkg-price { margin: 1em 0 0; color: var(--mi-muted); }
    .ps-pkg-price strong { color: var(--mi-ink); font-size: 1.7em; font-weight: 800; }
    .ps-tag-accounting { background: #e4e7f6; color: #3d4fa0; }
    .ps-tag-agriculture { background: #fdf0d5; color: #9a6a12; }
    .ps-pkg-complete { background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-pkg-complete h3 { color: #fff; }
    .ps-pkg-complete .ps-pkg-for { color: #d4efe0; }
    .ps-pkg-complete .ps-tag { background: #ffffff26; color: #fff; }
    .ps-complete-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: .6em; }
    .ps-complete-tiles div { padding: 1.1em; border-radius: 1em; background: #ffffff1f; color: #fff; font-weight: 700; text-align: center; }
    .ps-mock { position: relative; min-height: 15em; overflow: hidden; padding: 1.1em; border-radius: 1.4rem; background: var(--mi-panel); }
    .ps-mock-row { display: flex; justify-content: space-between; align-items: center; gap: .6em; margin-bottom: .4em; padding: .55em .8em; border-radius: .8em; background: #fff; font-size: .88em; }
    .ps-mock-gap { margin-top: .9em; }
    .ps-mock-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4em; margin-bottom: .6em; }
    .ps-mock-tiles div { padding: .5em .7em; border-radius: .8em; background: #fff; color: var(--mi-muted); font-size: .78em; }
    .ps-mock-tiles b { display: block; color: var(--mi-ink); font-size: 1.4em; }
    .ps-mock-tiles .is-main { background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-mock-tiles .is-main b { color: #fff; }
    .ps-chip { padding: .15em .65em; border-radius: 99px; background: var(--mi-mint); color: var(--mi-teal); font-size: .85em; font-weight: 700; white-space: nowrap; }
    .ps-chip-red { background: #f9dada; color: #c0392b; } .ps-chip-amber { background: #fff1cf; color: #9a6a12; }
    .ps-scan { position: absolute; left: 1em; right: 1em; height: 2px; background: var(--mi-danger); box-shadow: 0 0 .7em var(--mi-danger); animation: ps-scan 3s ease-in-out infinite; z-index: 1; }
    @keyframes ps-scan { 0%, 100% { top: 1.3em; } 50% { top: 8.4em; } }
    .ps-slide { animation: ps-slide 4s ease-in-out infinite; } .ps-slide:nth-of-type(3) { animation-delay: .6s; } .ps-slide:nth-of-type(4) { animation-delay: 1.2s; }
    @keyframes ps-slide { 0%, 10% { opacity: 0; transform: translateX(1em); } 25%, 90% { opacity: 1; transform: none; } 100% { opacity: 0; } }
    .ps-crops { display: grid; grid-template-columns: repeat(4, 1fr); gap: .35em; margin-bottom: .6em; }
    .ps-crops i { height: 2.3em; border-radius: .5em; background: #9fd2b6; animation: ps-sway 4s ease-in-out infinite; }
    .ps-crops i:nth-child(3n) { background: #c8e6a8; } .ps-crops i:nth-child(2n) { background: #7fbf9c; animation-delay: .5s; }
    @keyframes ps-sway { 50% { transform: translateY(-.3em); } }

    /* Vergleichstabelle */
    .ps-table-wrap { margin-top: 1em; overflow-x: auto; border-radius: 1.3rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-table { width: 100%; border-collapse: collapse; }
    .ps-table th, .ps-table td { padding: .75em 1em; border-bottom: 1px solid var(--mi-line); text-align: center; background: transparent; }
    .ps-table th { font-size: 1em; letter-spacing: 0; text-transform: none; }
    .ps-table tbody th { text-align: left; font-weight: 600; }
    .ps-table thead th small { display: block; color: var(--mi-muted); font-weight: 500; }
    .ps-table tr:last-child th, .ps-table tr:last-child td { border-bottom: 0; }
    .ps-table .is-yes { color: var(--mi-teal); font-weight: 800; } .ps-table .is-no { color: #b9bdb9; }
    .ps-table .is-hl { background: var(--mi-mint); }

    /* So geht es, Abschlussband, Fragen */
    .ps-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .9em; margin: 1.1em 0 0; padding: 0; list-style: none; }
    .ps-site .ps-step::before { display: none; }
    .ps-step { display: block; padding: 1.1em 1.2em; border-radius: 1.2rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-step p { margin: .3em 0 0; color: var(--mi-muted); line-height: 1.45; }
    .ps-step-no { display: grid; place-items: center; width: 2.2em; height: 2.2em; margin-bottom: .6em; border-radius: 50%; background: var(--mi-teal); color: #fff; font-weight: 800; }
    .ps-cta { position: relative; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 1.6em; align-items: center; overflow: hidden; padding: 2.4em 2.6em; border-radius: 2rem; background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-cta::after { content: ""; position: absolute; right: -4em; bottom: -8em; width: 20em; height: 20em; border-radius: 50%; background: #ffffff10; }
    .ps-cta h2 { color: #fff; font-size: 2.1em; }
    .ps-cta p { margin: 0; line-height: 1.55; }
    .ps-cta .ps-tag { background: #ffffff26; color: #fff; }
    .ps-cta-text, .ps-cta-points { position: relative; z-index: 1; }
    .ps-cta-points { display: grid; gap: .6em; }
    .ps-cta-points div { padding: .8em 1.1em; border-radius: 1em; background: #ffffff1f; color: #fff; font-weight: 600; }
    .ps-faqs { display: grid; gap: .6em; margin-top: 1em; }
    .ps-faq { padding: 1em 1.3em; border-radius: 1.1rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-faq summary { cursor: pointer; font-weight: 700; }
    .ps-faq p { margin: .6em 0 0; color: var(--mi-muted); line-height: 1.55; }

    /* Preise */
    .ps-trial-banner { display: inline-block; margin: 0 0 .3em; padding: .6em 1.1em; border-radius: .9em; background: var(--mi-mint); color: var(--mi-teal-text); font-weight: 600; }
    .ps-tabs { display: flex; gap: .6em; flex-wrap: wrap; margin: 1.3em 0 .3em; }
    .ps-tab { display: grid; gap: 2px; padding: .7em 1.2em; border: 0; border-radius: 1rem; background: #fff; box-shadow: var(--mi-shadow-card); color: var(--mi-ink); text-decoration: none; }
    .ps-tab small { color: var(--mi-muted); font-size: .85em; }
    .ps-tab.is-active { background: var(--mi-mint); box-shadow: 0 0 0 2px var(--mi-teal); }
    .ps-price { display: flex; flex-direction: column; }
    .ps-price-featured { background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-price-featured h3, .ps-price-featured .ps-amount strong { color: #fff; }
    .ps-price-featured p, .ps-price-featured .ps-amount span, .ps-price-featured .ps-meta, .ps-price-featured .ps-save { color: #d4efe0; }
    .ps-price-featured .ps-badge { background: #ffffff26; color: #fff; }
    .ps-price-featured .ps-btn { background: #fff; border-color: #fff; color: var(--mi-deep); }
    .ps-price { position: relative; }
    .ps-price-featured { box-shadow: 0 .9em 2.2em #176b4655; transform: translateY(-.4em); }
    .ps-ribbon { position: absolute; top: -.8em; left: 50%; transform: translateX(-50%); padding: .3em .9em; border-radius: 99px; background: var(--mi-lime, #b8f46e); color: var(--mi-deep); font-size: .78em; font-weight: 800; white-space: nowrap; }
    .ps-save-badge { display: inline-block; margin-left: .35em; padding: .1em .6em; border-radius: 99px; background: var(--mi-lime, #b8f46e); color: var(--mi-deep); font-size: .78em; font-weight: 800; }
    .ps-bestfor { margin: .2em 0 .8em; padding: .55em .8em; border-radius: .8em; background: var(--mi-panel); color: var(--mi-muted); font-size: .92em; line-height: 1.4; }
    .ps-bestfor b { color: var(--mi-ink); }
    .ps-price-featured .ps-bestfor { background: #ffffff1f; color: #fff; }
    .ps-price-featured .ps-bestfor b { color: #fff; }
    .ps-site .ps-features { margin: 0 0 1.1em; }
    .ps-trust { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7em; margin-top: 1.4em; }
    .ps-trust div { display: grid; gap: .15em; padding: .85em 1em; border-radius: 1.1rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-trust span { color: var(--mi-muted); font-size: .92em; }
    .ps-amount { margin: .5em 0 0; }
    .ps-amount strong { font-family: var(--mi-font-head, inherit); font-size: 2.2em; font-weight: 800; color: var(--mi-ink); }
    .ps-amount span { color: var(--mi-muted); }
    .ps-price .ps-unit { min-height: 0; margin: 0 0 .6em; padding: 0; border: 0; background: transparent; color: var(--mi-muted); }
    .ps-price-featured .ps-unit { color: #d4efe0; }
    .ps-meta { margin: 0 0 1em; padding: 0; list-style: none; display: grid; gap: .3em; color: var(--mi-muted); }
    .ps-meta li { padding-left: 0; } .ps-meta li::before { display: none; }
    .ps-price .ps-btn { margin-top: auto; }
    .ps-save { color: var(--mi-good); font-weight: 700; }
    .ps-build { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 1.6em; align-items: start; }
    .ps-checks { display: flex; gap: .6em; flex-wrap: wrap; margin-bottom: 1em; }
    .ps-check { display: inline-flex; align-items: center; gap: .6em; padding: .65em 1em; border-radius: .9em; background: var(--mi-panel); font-weight: 600; cursor: pointer; }
    .ps-check input { width: 1.2em; height: 1.2em; accent-color: var(--mi-teal); }
    .ps-result { margin-top: 1.1em; }
    .ps-plan { margin: 0 0 .6em; padding: 0; list-style: none; display: grid; gap: .45em; }
    .ps-plan li { display: flex; justify-content: space-between; gap: .8em; padding: .7em .9em; border-radius: .9em; background: var(--mi-panel); }
    .ps-plan li::before { display: none; }
    .ps-plan-total { margin: .7em 0 0; font-family: var(--mi-font-head, inherit); font-size: 1.4em; font-weight: 800; color: var(--mi-ink); }
    .ps-note, .ps-foot-note { color: var(--mi-muted); }
    .ps-legal { max-width: 46rem; }
    .ps-legal-section { margin-top: 1.6em; }
    .ps-legal-section h2 { margin: 0 0 .4em; }
    .ps-legal-section p, .ps-legal-section li { line-height: 1.65; overflow-wrap: anywhere; }
    .ps-legal-section ul { margin: .4em 0 0; padding-left: 1.2em; display: grid; gap: .5em; }
    .ps-footer { display: block; background: transparent; color: var(--mi-muted); font-size: .9em; }
    .ps-footer-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5em 1.6em; padding: .2em .8em .4em; }
    .ps-footer-links { display: flex; flex-wrap: wrap; gap: .5em 1.3em; }
    .ps-footer a { color: inherit; text-decoration: underline; }
    @media (max-width: 960px) {
      .ps-hero, .ps-build, .ps-pkg, .ps-cta { grid-template-columns: 1fr; }
      .ps-pkg.is-rev .ps-pkg-text { order: 0; }
      .ps-grid-4, .ps-steps, .ps-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .ps-grid-3 { grid-template-columns: 1fr; }
      .ps-pain { grid-template-columns: 1fr; } .ps-pain-arrow { transform: rotate(90deg); }
    }
    @media (max-width: 600px) {
      .ps-site { width: auto; margin: .5rem; padding: .5rem; border-radius: 1.5rem; }
      .ps-site > main { padding: 1em; }
      .ps-grid-4, .ps-steps, .ps-trust { grid-template-columns: 1fr; }
      .ps-price-featured { transform: none; }
      .ps-nav { display: none; }
      .ps-header-row { gap: .7em; padding: .7em 1em; }
      .ps-header-actions { margin-left: auto; gap: .6em; }
      .ps-stage { min-height: 24em; } .ps-win { left: 1em; width: calc(100% - 2em); } .ps-f1, .ps-f2 { display: none; }
      .ps-pkg, .ps-cta { padding: 1.2em; }
    }
    @media (prefers-reduced-motion: reduce) { .ps-site * { animation: none !important; transition: none !important; } }
    /* Registrierung, Einrichtungsassistent und Bereichswahl (gleiche Seitenhülle wie die Startseite) */
    .ps-crumb { padding-left: 14px; border-left: 1px solid var(--mi-line); color: var(--mi-muted); font-size: 12px; }
    .ps-onboard { padding: 36px 16px 64px; }
    .ps-auth { width: min(560px, 100%); margin: 0 auto; padding: 32px; border: 1px solid var(--mi-line); border-radius: 16px; background: var(--mi-paper); }
    .ps-auth h1 { margin: 0 0 10px; font-size: 24px; }
    .ps-selected { display: inline-block; margin: 0 0 16px; padding: 5px 12px; border-radius: 20px; background: var(--mi-mint); color: var(--mi-teal-text); font-size: 12px; font-weight: 700; }
    .ps-selected a { color: inherit; }
    .ps-field { display: grid; gap: 6px; margin-bottom: 14px; font-size: 13px; font-weight: 600; }
    .ps-field small { color: var(--mi-muted); font-weight: 500; }
    .ps-field input, .ps-field select { min-height: 42px; padding: 9px 12px; border: 1px solid var(--mi-line); border-radius: 9px; background: var(--mi-paper); color: var(--mi-ink); font: inherit; font-weight: 400; }
    .ps-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
    .ps-note-box { display: grid; gap: 2px; margin: 4px 0 14px; padding: 12px 14px; border-radius: 10px; background: var(--mi-bg); font-size: 13px; }
    .ps-note-box small { color: var(--mi-muted); }
    .ps-terms { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; font-size: 13px; }
    .ps-terms input { width: 18px; height: 18px; accent-color: var(--mi-teal); }
    .ps-btn-block { width: 100%; }
    .ps-auth-foot { margin: 14px 0 0; text-align: center; color: var(--mi-muted); font-size: 13px; }
    .ps-wizard { width: min(620px, 100%); margin: 0 auto; }
    .ps-eyebrow { margin: 0 0 8px; color: var(--mi-teal-text); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
    .ps-wizard h1 { margin-top: 0; font-size: 28px; }
    .ps-h2 { margin: 22px 0 8px; font-size: 16px; }
    .ps-choices { display: grid; gap: 10px; margin-bottom: 20px; }
    .ps-choice { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--mi-line); border-radius: 12px; background: var(--mi-paper); cursor: pointer; }
    .ps-choice input { position: absolute; opacity: 0; pointer-events: none; }
    .ps-choice.is-selected, .ps-choice:has(input:checked) { border: 2px solid var(--mi-teal); background: var(--mi-mint); }
    .ps-choice-badge { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 9px; background: var(--mi-bg); font-family: var(--mi-font-head, inherit); font-size: 12px; font-weight: 800; }
    .ps-choice:has(input:checked) .ps-choice-badge { background: var(--mi-teal); color: #fff; }
    .ps-choice strong, .ps-choice small { display: block; }
    .ps-choice small { margin-top: 2px; color: var(--mi-muted); font-size: 12.5px; }
    .ps-plan-line { display: flex; justify-content: space-between; gap: 10px; margin: 6px 0 12px; font-size: 12.5px; font-weight: 600; color: var(--mi-muted); }
    .ps-plan-line a { color: var(--mi-teal-text); font-weight: 700; }
    .ps-wizard-nav { display: flex; gap: 10px; margin-top: 8px; }
    .ps-wizard-nav .ps-btn { flex: 1; }
    .ps-plan-card h3 { margin-bottom: 4px; }
    .ps-check-pill { margin: 0 8px 8px 0; border-radius: 20px; }
    .ps-check-pill:has(input:checked) { border-color: var(--mi-teal); background: var(--mi-mint); }
    .ps-list { margin: 0 0 12px; padding: 0; list-style: none; display: grid; gap: 8px; }
    .ps-list li { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 12px 14px; border: 1px solid var(--mi-line); border-radius: 12px; background: var(--mi-paper); }
    .ps-list li small { flex: 1 1 100%; color: var(--mi-muted); }
    .ps-pill { padding: 2px 9px; border-radius: 20px; background: var(--mi-bg); font-size: 11px; font-weight: 700; }
    .ps-pill-good { margin-left: auto; background: var(--mi-mint); color: var(--mi-teal-text); }
    .ps-inline-form { display: grid; gap: 10px; margin-bottom: 18px; }
    .ps-area-tiles { display: grid; gap: 14px; margin: 22px 0; }
    .ps-area-tile { position: relative; display: grid; gap: 4px; padding: 20px 56px 20px 22px; border-radius: 16px; color: #fff; text-decoration: none; }
    .ps-area-tile strong { font-family: var(--mi-font-head, inherit); font-size: 18px; }
    .ps-area-tile span { font-size: 13px; opacity: .9; }
    .ps-area-tile small { margin-top: 6px; font-size: 12px; opacity: .75; }
    .ps-area-tile em { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); font-size: 22px; font-style: normal; }
    .ps-area-tile-ops { background: var(--mi-teal); }
    .ps-area-tile-acct { background: #3d4fa0; }
    @media (max-width: 600px) { .ps-field-grid { grid-template-columns: 1fr; } .ps-auth { padding: 22px; } }
    /* Testphase gleich am Anfang: Banner auf Pricing, Kasten in der Registrierung, Leiste im Assistenten */
    .ps-trial-banner { display: inline-block; margin: 0 0 4px; padding: 8px 14px; border-radius: 10px; background: var(--mi-mint); color: var(--mi-teal-text); font-size: 14px; font-weight: 600; }
    .ps-trial-box { display: grid; gap: 2px; margin: 0 0 14px; padding: 14px 16px; border: 1px solid var(--mi-teal); border-radius: 12px; background: var(--mi-mint); }
    .ps-trial-box strong { font-family: var(--mi-font-head, inherit); font-size: 17px; color: var(--mi-teal-text); }
    .ps-trial-box span { font-size: 14px; }
    .ps-trial-box small { color: var(--mi-muted); font-size: 12.5px; }
    .ps-trial-strip { margin: 0 0 14px; padding: 8px 14px; border-radius: 9px; background: var(--mi-mint); color: var(--mi-teal-text); font-size: 12.5px; font-weight: 700; letter-spacing: .02em; }
    .ps-selected a { margin-left: 6px; font-weight: 700; text-decoration: underline; }
    .ps-change { margin: 14px 0; }
    .ps-change summary { cursor: pointer; font-weight: 700; }
    .ps-change .ps-checks { margin: 10px 0; }
    .ps-features li::before { content: "✓"; top: 0; width: auto; height: auto; background: none; color: var(--mi-teal); font-weight: 800; }
    .ps-price-featured .ps-features li::before { color: var(--mi-lime, #b8f46e); }

    /* Registrierung, Einrichtung und Bereichswahl im neuen Aufbau: grüne Seitenkarte links, weiße Karte mit dem Inhalt rechts */
    .ps-site > main.ps-onboard { padding: 1.8em; }
    .ps-reg { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1em; max-width: 72rem; }
    .ps-reg.has-plan { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: stretch; }
    .ps-reg .ps-auth { width: 100%; margin: 0; padding: 2em 2.2em; border: 0; border-radius: 1.6rem; box-shadow: var(--mi-shadow-card); }
    .ps-reg:not(.has-plan) .ps-auth { max-width: 36rem; margin-inline: auto; }
    .ps-reg-plan { display: flex; flex-direction: column; gap: 1em; padding: 2em; border-radius: 1.6rem; background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-reg-plan h2 { margin: .2em 0 0; color: #fff; font-size: 1.9em; }
    .ps-reg-tag { align-self: flex-start; padding: .3em .85em; border-radius: 99px; background: #ffffff26; color: #fff; font-size: .85em; font-weight: 700; }
    .ps-reg-price { margin: 0; }
    .ps-reg-price strong { color: #fff; font-size: 2.6em; font-weight: 800; letter-spacing: -.03em; }
    .ps-reg-price small { color: #d4efe0; font-size: .95em; }
    .ps-reg-period { display: flex; justify-content: space-between; align-items: center; margin: 0; padding: .8em 1em; border-radius: 1em; background: #ffffff1f; color: #fff; }
    .ps-reg-period a { color: #fff; font-weight: 700; text-decoration: underline; }
    .ps-site .ps-reg-list li::before { content: "✓"; top: 0; width: auto; height: auto; background: none; color: var(--mi-lime, #b8f46e); font-weight: 800; }
    .ps-reg-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5em; margin-top: auto; }
    .ps-reg-tiles div { padding: .7em .8em; border-radius: 1em; background: #ffffff1f; font-size: .9em; }
    .ps-reg-tiles strong { display: block; color: #fff; }
    .ps-reg .ps-selected { display: none; }
    .ps-wiz { display: grid; grid-template-columns: 17em minmax(0, 1fr); gap: 1em; align-items: start; max-width: 72rem; }
    .ps-wiz .ps-wizard { width: 100%; margin: 0; padding: 1.8em 2em; border-radius: 1.6rem; background: #fff; box-shadow: var(--mi-shadow-card); }
    .ps-stepnav { display: flex; flex-direction: column; gap: .5em; padding: 1.6em 1.3em; border-radius: 1.6rem; background: var(--mi-grad-green, linear-gradient(135deg, #176B46, #0D4A30)); color: #d4efe0; }
    .ps-stepnav h2 { margin: 0 0 .3em; color: #fff; font-size: 1.2em; }
    .ps-stepnav-bar { height: .4em; margin-bottom: .6em; border-radius: 9px; background: #ffffff26; }
    .ps-stepnav-bar i { display: block; height: 100%; border-radius: 9px; background: var(--mi-lime, #b8f46e); }
    .ps-stepnav ol { display: grid; gap: .3em; margin: 0; padding: 0; list-style: none; }
    .ps-stepnav-item, .ps-stepnav-item a { display: flex; align-items: center; gap: .7em; padding: .55em .65em; border-radius: .9em; color: #d4efe0; text-decoration: none; }
    .ps-stepnav-item a { padding: 0; }
    .ps-stepnav-item i { display: grid; place-items: center; flex: 0 0 1.8em; height: 1.8em; border-radius: 50%; background: #ffffff26; color: #fff; font-style: normal; font-weight: 800; }
    .ps-stepnav-item.is-current { background: #ffffff26; color: #fff; font-weight: 700; }
    .ps-stepnav-item.is-current i { background: #fff; color: var(--mi-deep); }
    .ps-stepnav-item.is-done i { background: var(--mi-lime, #b8f46e); color: var(--mi-deep); }
    .ps-stepnav .ps-trial-strip { margin: 1em 0 0; background: #ffffff1f; color: #fff; }
    .ps-onboard > .ps-wizard { width: 100%; max-width: 60rem; }
    .ps-area-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ps-area-tile { min-height: 10em; align-content: end; background-image: linear-gradient(135deg, #176B46, #0D4A30); }
    .ps-area-tile-acct { background-image: linear-gradient(135deg, #4a5bb8, #2c3a85); }
    .ps-area-tile em { transition: transform .3s; }
    .ps-area-tile:hover em { transform: translateY(-50%) translateX(.4em); }
    @media (max-width: 960px) {
      .ps-reg.has-plan, .ps-wiz { grid-template-columns: 1fr; }
      .ps-area-tiles { grid-template-columns: 1fr; }
    }
    @media (max-width: 600px) { .ps-reg .ps-auth, .ps-wiz .ps-wizard { padding: 1.2em; } .ps-reg-tiles { grid-template-columns: 1fr; } }

    .ps-site .ps-stepnav-item::before { display: none; }
    .ps-site .ps-stepnav-item { padding-left: .65em; }

    /* Einrichtung Schritt 3: Währungen, Einheiten und Zahlungsarten nebeneinander */
    .ps-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4em; margin-bottom: 1.2em; }
    .ps-group { min-width: 0; padding: 1.1em 1.2em; border-radius: 1.2rem; background: var(--mi-panel); }
    .ps-group .ps-unit-title { margin-top: 0; font-size: 1.05em; }
    .ps-group .ps-checks { flex-direction: column; align-items: stretch; margin-bottom: 0; }
    .ps-group .ps-check-pill { margin: 0; }
    .ps-group .ps-units { flex-direction: column; flex-wrap: nowrap; }
    @media (max-width: 1100px) { .ps-groups { grid-template-columns: 1fr; } }
    /* Einheitlicher Stil der Auswahlkacheln in den drei Gruppen: weiß mit Rand, angehakt grün */
    .ps-group .ps-check-pill, .ps-group .ps-unit { display: flex; align-items: center; gap: .6em; padding: .55em .8em; border: 1px solid var(--mi-line); border-radius: .9em; background: #fff; font-weight: 600; }
    .ps-group .ps-check-pill:has(input:checked), .ps-group .ps-unit:has(input[type="checkbox"]:checked) { border-color: var(--mi-teal); background: var(--mi-mint); }
    .ps-group .ps-unit input[type="text"] { flex: 1; width: auto; min-width: 0; }
    .ps-group .ps-units { gap: .45em; margin-bottom: .8em; }
    .ps-unit-sub { margin: 1em 0 .4em; color: var(--mi-muted); font-size: .85em; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
    .ps-group .ps-unit-title + .ps-note + .ps-unit-sub { margin-top: .4em; }

    /* Einrichtung: Bereiche in Schritt 2 als Pillen, Listen in Schritt 4 ohne Listenpunkt (der Punkt gehört nur zu den Listen der Startseite) */
    .ps-site .ps-chips { display: flex; flex-wrap: wrap; gap: .5em; margin: .6em 0 .8em; }
    .ps-site .ps-chips li { padding: .45em 1em; border-radius: 99px; background: var(--mi-mint); color: var(--mi-teal-text); font-weight: 700; }
    .ps-site .ps-chips li::before, .ps-site .ps-list li::before { display: none; }
    .ps-site .ps-chips li, .ps-site .ps-list li { padding-left: 1em; }
    .ps-site .ps-list li { padding-left: .9em; }

    /* Registrierung auf dem Handy: Paketkarte kompakt, damit das Formular ohne langes Scrollen sichtbar ist. */
    @media (max-width: 600px) {
      .ps-reg-plan { gap: .6em; padding: 1.1em 1.2em; }
      .ps-reg-plan h2 { font-size: 1.35em; }
      .ps-reg-price strong { font-size: 1.8em; }
      .ps-reg-period { padding: .55em .9em; }
      .ps-site .ps-reg-list, .ps-reg .ps-reg-tiles { display: none; }
    }
    /* Plattformadmin: Kopfzeile, Navigation, schmale Anmeldung, Kennzahlen. Klassen mit pa-. */
    .pa-shell { min-height: 100vh; background: var(--mi-bg); }
    .pa-header { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding: 10px 24px; background: var(--mi-paper); border-bottom: 1px solid var(--mi-line); }
    .pa-brand { font-family: var(--mi-font-head, inherit); font-size: 14px; font-weight: 800; letter-spacing: .04em; }
    .pa-nav { display: flex; gap: 4px; margin-right: auto; flex-wrap: wrap; }
    .pa-nav-link { padding: 7px 12px; border-radius: 8px; color: var(--mi-ink); font-size: 13px; font-weight: 600; text-decoration: none; }
    .pa-nav-link:hover { background: var(--mi-bg); }
    .pa-nav-link.active { background: var(--mi-teal); color: #fff; }
    .pa-tools { display: flex; align-items: center; gap: 10px; }
    .pa-tools form { margin: 0; }
    .pa-main { width: min(1200px, 100% - 32px); margin: 0 auto; padding: 24px 0 48px; display: grid; gap: 16px; }
    .pa-narrow { width: min(440px, 100%); margin: 40px auto; display: grid; gap: 14px; }
    .pa-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
    .pa-figure { margin: 0; font-family: var(--mi-font-head, inherit); font-size: 34px; font-weight: 800; }
    .pa-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 4px 0; }
    .pa-inline input { min-width: 0; flex: 1 1 140px; }
    .pa-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
    .pa-secret { display: inline-block; padding: 8px 12px; border-radius: 8px; background: var(--mi-bg); font-size: 1.1em; letter-spacing: .08em; }
    /* Konto aktiviert (Abrechnungsseite) */
    .ui-activated { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 18px 20px; border: 1px solid var(--mi-edge-mint-strong, var(--mi-line)); border-radius: 14px; background: var(--mi-mint); }
    .ui-activated h2 { margin: 0; font-size: 18px; }
    .ui-activated p { margin: 2px 0 0; }
    .ui-activated > div { flex: 1 1 240px; }
    .ui-activated-mark { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--mi-teal); color: #fff; font-size: 22px; }
    /* Einheiten und Kapazitäten: Einstellungen (ui-) und Einrichtungsassistent (ps-) */
    .ui-unit-title { margin: 16px 0 8px; font-size: .9rem; }
    .ui-units { display: flex; flex-wrap: wrap; gap: 8px; }
    .ui-unit { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--mi-line); border-radius: 10px; background: var(--mi-paper); }
    .ui-unit.is-on { border-color: var(--mi-teal); background: var(--mi-mint); }
    .ui-unit input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--mi-teal); }
    .ui-unit-label { width: 120px; min-height: 32px; padding: 4px 8px; }
    .ui-unit small { color: var(--mi-muted); }
    .ps-unit-title { margin: 20px 0 8px; font-size: 14px; font-weight: 700; }
    .ps-units { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
    .ps-unit { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--mi-line); border-radius: 10px; background: var(--mi-paper); }
    .ps-unit:has(input[type="checkbox"]:checked) { border-color: var(--mi-teal); background: var(--mi-mint); }
    .ps-unit input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--mi-teal); }
    .ps-unit input[type="text"] { width: 110px; min-height: 32px; padding: 4px 8px; border: 1px solid var(--mi-line); border-radius: 7px; background: var(--mi-paper); font: inherit; }
    /* Theme "claude-v2": Design-Export vom 01.10.2026 (docs/design/claude-design-v2).
       Wird nur geladen, wenn MIISAAN_THEME=claude-v2 gesetzt ist. Es überschreibt die
       Tokens und die Schrift; feste Farbwerte in core/mobile/legacy.css folgen
       schrittweise (siehe docs/DESIGN_SYSTEM.md). */
    @font-face { font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 500; src: url(/assets/fonts/manrope-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 600; src: url(/assets/fonts/manrope-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 700; src: url(/assets/fonts/manrope-latin-700-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "Manrope"; font-style: normal; font-display: swap; font-weight: 800; src: url(/assets/fonts/manrope-latin-800-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "IBM Plex Sans"; font-style: normal; font-display: swap; font-weight: 400; src: url(/assets/fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "IBM Plex Sans"; font-style: normal; font-display: swap; font-weight: 500; src: url(/assets/fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "IBM Plex Sans"; font-style: normal; font-display: swap; font-weight: 600; src: url(/assets/fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    :root {
      --mi-font-body: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
      --mi-font-head: "Manrope", "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif;
      --mi-bg: #f1eee8;
      --mi-paper: #ffffff;
      --mi-ink: #1c2420;
      --mi-muted: #54615b;
      --mi-line: #e3dfd6;
      --mi-teal: #0e7c66;
      --mi-deep: #1c2420;
      --mi-auth-bg: #0f1512;
      --mi-blue: #e6eaf6;
      --mi-mint: #e3f2ea;
      --mi-sand: #f4e2c4;
      --mi-lilac: #eceaf6;
      --mi-coral: #f6e1e1;
      --mi-gold: #7a4109;
      --mi-good: #1e8f5e;
      --mi-warm: #7a4109;
      --mi-canvas: #fafaf8;
      --mi-edge-aqua: #c9d0ea;
      --mi-edge-aqua-2: #c9d0ea;
      --mi-edge-cool: #e3dfd6;
      --mi-edge-sand: #e0c892;
      --mi-edge-mint: #bfdccf;
      --mi-edge-mint-strong: #a6cfbd;
      --mi-accent-blue: #0e7c66;
      --mi-accent-blue-2: #0a5d4c;
      --mi-accent-blue-3: #0e7c66;
      --mi-danger: #b23a3a;
      --mi-text-cool: #54615b;
      --mi-success: #1e8f5e;
      --mi-ink-cool: #1c2420;
      --mi-surface-cool: #faf8f4;
      --mi-teal-text: #0a5d4c;
      --mi-text-ice: #e3f2ed;
      --mi-deep-teal: #0a5d4c;
      --mi-text-aqua: #bfe3d6;
      --mi-success-deep: #1e8f5e;
      --mi-surface-grey: #e9e5dc;
      --mi-edge-teal: #2a8f7a;
      --mi-text-sand-deep: #7a4109;
      --mi-edge-sand-2: #e0c892;
      --mi-paper-2: #fffefb;
      --mi-edge-sand-3: #e0c892;
      --mi-edge-sand-4: #e6d3ad;
      --mi-paper-3: #fffefb;
      --mi-surface-warm: #f4f1ea;
      --mi-text-sand: #7a4109;
      --mi-edge-sand-5: #e0c892;
      --mi-text-sand-2: #7a4109;
      --mi-edge-grey: #e3dfd6;
      --mi-text-ice-2: #e3f2ed;
      --mi-text-teal-deep: #0a5d4c;
      --mi-surface-ice: #eaf4f0;
      --mi-edge-gold: #d9a441;
      --mi-teal-text-2: #0a5d4c;
      --mi-radius-control: 9px;
      --mi-radius-card: 16px;
      --mi-radius-panel: 16px;
      --mi-radius-shell: 20px;
      --mi-shadow-card: 0 1px 2px #1c24200d;
      --mi-shadow-shell: 0 8px 24px #1c242021;
    }
    body { font-family: var(--mi-font-body); }
    h1, h2, h3, h4, .brand, .mi-top-title { font-family: var(--mi-font-head); }
    /* Hauptschaltflächen sind im neuen Design grün */
    .mi-btn.primary, button:not(.secondary):not(.ghost):not(.danger):not(.ui-lang-option):not(.pos-category):not(.pos-product-tile):not(.payment-choice), .button:not(.secondary) { background: var(--mi-teal); border-color: var(--mi-teal); }
    .mi-btn.primary:hover, button:not(.secondary):not(.ghost):not(.danger):not(.ui-lang-option):not(.pos-category):not(.pos-product-tile):not(.payment-choice):hover { background: var(--mi-accent-blue-2); border-color: var(--mi-accent-blue-2); filter: none; }

    /* App-Rahmen nach dem Design: helle Seitenleiste, Symbol-Chips, ruhige Kopfzeile (Desktop) */
    @media (min-width: 861px) {
      .mi-shell { grid-template-columns: 236px minmax(0, 1fr); gap: 0; padding: 0; background: var(--mi-bg); }
      .mi-side { top: 0; height: 100vh; gap: 16px; padding: 18px 12px 14px; overflow-y: auto; background: var(--mi-paper); color: var(--mi-ink); border-right: 1px solid var(--mi-line); border-radius: 0; box-shadow: none; }
      .mi-side::after { display: none; }
      .mi-brand { padding: 0 10px 6px; }
      .mi-brand .brand { color: var(--mi-ink); font-size: 14px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
      .mi-brand small { margin-top: 2px; color: var(--mi-muted); font-size: 11px; letter-spacing: 0; text-transform: none; }
      .mi-mark { width: 30px; height: 30px; border: 0; border-radius: 8px; background: var(--mi-teal); color: #fff; font-size: 15px; font-weight: 800; }
      .mi-side-label { margin: 6px 10px 8px; color: var(--mi-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .1em; }
      .mi-nav { gap: 2px; }
      .mi-nav-link { min-height: 0; padding: 7px 10px; border-radius: 8px; color: var(--mi-ink); font-size: 13px; font-weight: 500; }
      .mi-nav-link:hover, .mi-nav-link:focus-visible { background: var(--mi-bg); color: var(--mi-ink); transform: none; }
      .mi-nav-link.active { background: var(--mi-bg); color: var(--mi-teal-text); font-weight: 700; box-shadow: none; }
      .mi-nav-icon { width: 26px; height: 26px; flex: 0 0 26px; border-radius: 7px; background: var(--mi-bg); color: var(--mi-muted); }
      .mi-nav-link:hover .mi-nav-icon { background: var(--mi-line); }
      .mi-nav-link.active .mi-nav-icon { background: var(--mi-teal); color: #fff; }
      .mi-side-foot { border-top: 1px solid var(--mi-line); color: var(--mi-muted); }
      .mi-status::before { background: var(--mi-good); }
      .mi-main { background: transparent; border: 0; border-radius: 0; overflow: visible; }
      .mi-top { min-height: 60px; padding: 10px 28px; background: var(--mi-paper); border: 0; border-bottom: 1px solid var(--mi-line); }
    }

    /* Inhaltsflächen nach dem Design: weiße Karten mit feiner Linie statt farbiger Flächen */
    .pos-manual-panel, .pos-catalog-panel, .pos-products-panel, .pos-cart, .pos-payment-box, .pos-customer-box,
    .pos-manual-payment-confirmation, .customer-list-panel, .customer-create-panel {
      background: var(--mi-paper); border: 1px solid var(--mi-line); border-radius: 12px; box-shadow: none;
    }
    .pos-barcode-panel, .pos-manual-status { background: var(--mi-bg); border: 1px solid var(--mi-line); border-radius: 10px; }
    .pos-cart { border-color: var(--mi-line); }
    .pos-cart-row { border-bottom-color: var(--mi-line); }
    .pos-line { border-color: var(--mi-line); background: var(--mi-paper); }
    .pos-line-advanced { border-top-color: var(--mi-line); }
    /* Kategorien als Pillen */
    .pos-category, button.pos-category { border: 1px solid var(--mi-line); border-radius: 20px; background: var(--mi-paper); color: var(--mi-ink); font-weight: 600; }
    .pos-category.active, .pos-category:hover, button.pos-category.active, button.pos-category:hover { background: var(--mi-teal); border-color: var(--mi-teal); color: #fff; }
    /* Produktkacheln: weiß, Name und Preis */
    .pos-product-grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px; }
    .pos-product-tile, button.pos-product-tile { border: 1px solid var(--mi-line); border-radius: 12px; background: var(--mi-paper); color: var(--mi-ink); box-shadow: none; }
    .pos-product-tile:hover, button.pos-product-tile:hover { border-color: var(--mi-teal); background: var(--mi-paper); transform: none; box-shadow: none; }
    .pos-product-tile .product-visual, .pos-product-tile:nth-child(n) .product-visual { height: 64px; background: var(--mi-bg); }
    .pos-product-copy { padding: 10px 10px 12px; text-align: center; }
    .pos-product-copy strong { font-size: 13px; font-weight: 700; }
    .pos-product-copy small { font-size: 11px; }
    .pos-product-copy b { color: var(--mi-teal-text); font-size: 13px; font-weight: 700; }
    /* Zahlungsarten: Umriss, gewählt = mint */
    .payment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .payment-choice, button.payment-choice { min-height: 40px; padding: 8px 10px; border: 1px solid var(--mi-line); border-radius: 9px; background: var(--mi-paper); color: var(--mi-ink); font-size: 13px; font-weight: 600; }
    .payment-choice.selected, button.payment-choice.selected { border-color: var(--mi-teal); background: var(--mi-mint); color: var(--mi-teal-text); }
    #sale-form button[type="submit"]:not(.secondary):not(.ghost) { min-height: 48px; border-radius: 10px; font-size: 15px; }

    /* Alle Seiten: getönte Flächen werden weiße Karten mit feiner Linie; Farbe bleibt nur als Akzent */
    .branch-overview, .mi-branch-strip, .dashboard-branch-overview, .dashboard-branch-overview.has-one-branch,
    .dashboard-currency-overview, .dashboard-priority-panel.receivables, .dashboard-priority-panel.sales,
    .dashboard-movement-panel, .dashboard-activity, .period-filter, .history-filters, .dashboard-page-tools .period-filter,
    .mi-filter, .accounting-branch-panel, .accounting-filter, .sales-history-filter, .customer-account-overview,
    .customer-balance-overview, .customer-quick-actions, .account-panel.blue, .account-panel.mint, .account-panel.sand,
    .warehouse-page .mi-page-panel.blue, .warehouse-page .mi-page-panel.mint, .warehouse-page .mi-page-panel.sand,
    .sales-history-panel.blue, .sales-history-panel.mint, .sales-history-panel.sand,
    .branches-panel.blue, .branches-panel.mint, .branches-panel.sand, .branches-merge-panel,
    .pos-context-row, .empty-state, .product-management-row, .product-manager-create, .inventory-entry, .pos-note,
    .accounting-expense, .mi-entry-card.accounting, .financial-amount, .receivable-row, .account-hero-balance,
    .account-row-action form, .accounting-currency-card, .accounting-movement-card, .mi-money-card, .workspace-card {
      background: var(--mi-paper); border-color: var(--mi-line); box-shadow: none;
    }
    .branch-overview, .mi-branch-strip, .dashboard-branch-overview, .dashboard-currency-overview, .dashboard-activity,
    .accounting-branch-panel, .customer-account-overview, .customer-balance-overview, .branches-panel.blue, .branches-panel.mint,
    .branches-panel.sand, .sales-history-panel.blue, .sales-history-panel.mint, .sales-history-panel.sand { border-radius: 14px; }
    /* Kennzahlenkarten: weiß mit farbigem Streifen links */
    .dashboard-stats .stat-card:nth-child(n), .customer-metric-card.mint, .customer-metric-card.sand, .customer-metric-card.lilac,
    .account-summary-card.blue, .account-summary-card.mint, .account-summary-card.sand, .account-summary-card.lilac,
    .dashboard-currency-card.blue, .dashboard-currency-card.mint, .dashboard-currency-card.sand, .dashboard-currency-card.lilac,
    .accounting-stat.blue, .accounting-stat.sand, .accounting-stat.lilac, .customer-balance-card.balance-negative,
    .warehouse-stock-bar.low { background: var(--mi-paper); border: 1px solid var(--mi-line); border-left-width: 4px; border-radius: 12px; box-shadow: none; }
    .dashboard-stats .stat-card:nth-child(1), .accounting-stat.blue, .account-summary-card.blue, .dashboard-currency-card.blue { border-left-color: var(--mi-teal); }
    .dashboard-stats .stat-card:nth-child(2), .customer-metric-card.sand, .account-summary-card.sand, .dashboard-currency-card.sand, .accounting-stat.sand { border-left-color: var(--mi-warm); }
    .dashboard-stats .stat-card:nth-child(3), .customer-metric-card.lilac, .account-summary-card.lilac, .dashboard-currency-card.lilac, .accounting-stat.lilac { border-left-color: #3d4fa0; }
    .customer-metric-card.mint, .account-summary-card.mint, .dashboard-currency-card.mint { border-left-color: var(--mi-good); }
    .warehouse-stock-bar.low { border-left-color: var(--mi-warm); }

    /* App-Rahmen auf Tablet und Handy: weiße Kopfzeile mit Linie wie im Design */
    @media (max-width: 860px) {
      .mi-side { background: var(--mi-paper); color: var(--mi-ink); border-bottom: 1px solid var(--mi-line); border-radius: 0; box-shadow: none; }
      .mi-brand .brand { color: var(--mi-ink); font-size: 14px; font-weight: 800; letter-spacing: .02em; text-transform: uppercase; }
      .mi-brand small { color: var(--mi-muted); text-transform: none; letter-spacing: 0; }
      .mi-mark { border: 0; border-radius: 8px; background: var(--mi-teal); color: #fff; }
      .mi-mobile-menu > summary { border: 1px solid var(--mi-line); background: var(--mi-paper); color: var(--mi-ink); }
      .mi-menu-icon { color: var(--mi-ink); }
      .mi-nav-link { color: var(--mi-ink); }
      .mi-nav-icon { color: var(--mi-muted); }
      .mi-nav-link.active { background: var(--mi-bg); color: var(--mi-teal-text); }
      .mi-nav-link.active .mi-nav-icon { color: var(--mi-teal-text); }
      .mi-side-label { color: var(--mi-muted); }
      .mi-mobile-menu[open] > .mi-nav, .mi-mobile-menu[open] > .mi-menu-content { background: var(--mi-paper); border: 1px solid var(--mi-line); border-radius: 12px; box-shadow: 0 8px 24px #1c242021; }
    }

    /* Gefahraktionen: rot auf zartrosa wie im Design */
    button.danger, .button.danger, .mi-btn.danger { background: var(--mi-coral); border-color: var(--mi-edge-coral, #e8bcbc); color: var(--mi-danger); }
    button.danger:hover, .button.danger:hover, .mi-btn.danger:hover { background: var(--mi-danger); border-color: var(--mi-danger); color: #fff; filter: none; }

    /* Farbvarianten von Panels (xyz-panel.blue/mint/sand/lilac) in allen Bereichen */
    [class*="panel"].blue, [class*="panel"].mint, [class*="panel"].sand, [class*="panel"].lilac,
    .members-add-details, details[class*="-add"] { background: var(--mi-paper); border-color: var(--mi-line); box-shadow: none; }

    /* Restliche getönte Flächen einzelner Seiten */
    .audit-filter, .currency-settings-card.blue, .currency-settings-card.mint, .currency-settings-card.sand,
    .module-settings-grid-panel, .module-settings-grid-panel.product-type-settings, .module-settings-package.mint, .module-settings-package.sand,
    .product-stock-panel, .product-stock-action-form, .account-form-details { background: var(--mi-paper); border: 1px solid var(--mi-line); border-radius: 12px; box-shadow: none; }
    .customer-balance-card.balance-positive { background: var(--mi-paper); border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-danger); border-radius: 12px; box-shadow: none; }
    /* Hinweise: warmes Beige mit braunem Text wie im Design */
    .currency-warning, .documents-warning, .branches-warning { background: #f7e9da; border: 1px solid #ecd2b5; color: var(--mi-warm); border-radius: 10px; }
    /* Kopfbereiche von Kunde, Konto und Dashboard: weiße Karte statt Farbverlauf */
    .dashboard-hero, .customer-hero, .account-hero { background: var(--mi-paper); border: 1px solid var(--mi-line); border-radius: 14px; box-shadow: none; }

    /* Bereichs-Umschalter und Gruppenüberschrift in der Seitenleiste */
    .mi-area-switch { display: flex; gap: 2px; margin: 0 0 12px; padding: 3px; background: var(--mi-bg); border-radius: 9px; }
    .mi-area-switch a { flex: 1; padding: 7px 8px; border-radius: 7px; color: var(--mi-muted); font-size: 12.5px; font-weight: 700; text-align: center; text-decoration: none; }
    .mi-area-switch a.active { background: var(--mi-teal); color: #fff; }
    .mi-nav-group { margin: 14px 10px 4px; color: var(--mi-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

    /* Erste Schritte auf dem Dashboard neuer Konten */
    .ui-start { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin-bottom: 14px; padding: 16px 20px; border: 1px solid var(--mi-line); border-left: 4px solid var(--mi-teal); border-radius: 12px; background: var(--mi-paper); }
    .ui-start p { margin: 2px 0 0; font-size: 13px; }
    .ui-start ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: start; }
    .ui-start li { counter-increment: start; }
    .ui-start li a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--mi-line); border-radius: 20px; background: var(--mi-bg); color: var(--mi-ink); font-size: 13px; font-weight: 600; text-decoration: none; }
    .ui-start li a::before { content: counter(start); display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--mi-teal); color: #fff; font-size: 11px; }
    @media (max-width: 860px) { .ui-start { grid-template-columns: 1fr; } }
    /* Overlay "donezo": Farb- und Kartenstil nach dem Donezo-Vorbild (01.10.2026).
       Liegt nach claude-v2.css und ändert Tokens, Karten-Ebenen und Kennzahlenkarten:
       grauer Seitenhintergrund, weiße Karten mit weichem Schatten, Hauptgrün und ein
       grüner Verlauf als einzige kräftige Fläche. Schriftart: Plus Jakarta Sans (SIL OFL,
       lokal gehostet) für Titel, Zahlen und Text. */
    @font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-display: swap; font-weight: 400; src: url(/assets/fonts/plus-jakarta-sans-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-display: swap; font-weight: 500; src: url(/assets/fonts/plus-jakarta-sans-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-display: swap; font-weight: 600; src: url(/assets/fonts/plus-jakarta-sans-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    @font-face { font-family: "Plus Jakarta Sans"; font-style: normal; font-display: swap; font-weight: 700; src: url(/assets/fonts/plus-jakarta-sans-latin-700-normal.woff2) format("woff2"); unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
    :root { --mi-font-body: "Plus Jakarta Sans", "IBM Plex Sans", ui-sans-serif, system-ui, sans-serif; --mi-font-head: "Plus Jakarta Sans", "Manrope", ui-sans-serif, system-ui, sans-serif; }
    :root {
      --mi-bg: #e6e7e5;
      --mi-canvas: #e6e7e5;
      --mi-paper: #ffffff;
      --mi-paper-2: #ffffff;
      --mi-paper-3: #ffffff;
      --mi-panel: #f4f5f3;
      --mi-ink: #111614;
      --mi-ink-cool: #111614;
      --mi-muted: #6b726e;
      --mi-text-cool: #6b726e;
      --mi-line: #e9eae7;
      --mi-edge-cool: #e9eae7;
      --mi-edge-grey: #e9eae7;
      --mi-teal: #176b46;
      --mi-teal-text: #176b46;
      --mi-teal-text-2: #176b46;
      --mi-text-teal-deep: #0d4a30;
      --mi-deep: #0d4a30;
      --mi-deep-teal: #0d4a30;
      --mi-accent-blue: #176b46;
      --mi-accent-blue-2: #0d4a30;
      --mi-accent-blue-3: #176b46;
      --mi-good: #218358;
      --mi-success: #176b46;
      --mi-success-deep: #176b46;
      --mi-mint: #e3f1e8;
      --mi-surface-ice: #e3f1e8;
      --mi-edge-mint: #cfe5d8;
      --mi-edge-mint-strong: #a9d3bd;
      --mi-danger: #d93f3b;
      --mi-lime: #b8f46e;
      --mi-grad-green: linear-gradient(135deg, #0d4a30 0%, #218358 100%);
      --mi-radius-control: 10px;
      --mi-radius-card: 16px;
      --mi-radius-panel: 16px;
      --mi-radius-shell: 20px;
      --mi-shadow-card: 0 2px 12px #14201a0f;
    }
    body { font-family: var(--mi-font-body); font-weight: 500; letter-spacing: -.01em; }
    h1, h2, h3, h4, .brand, .mi-top-title { font-weight: 600; letter-spacing: -.02em; }
    .mi-body h1 { font-size: clamp(1.4rem, 2.4vw, 1.75rem); font-weight: 600; letter-spacing: -.03em; }
    .mi-body h2, .mi-body h3 { font-weight: 600; }

    /* Karten-Ebene: weiße Karte mit weichem Schatten auf grauem Grund, Kacheln in der Karte hellgrau */
    .card, .dashboard-panel, .customer-account-overview, .dashboard-activity, .pos-panel, .pos-cart, .branch-overview,
    .dashboard-branch-overview, .dashboard-currency-overview, .dashboard-financial-overview, .accounting-branch-panel,
    .account-panel, .customer-list-panel, .customer-create-panel, .pos-manual-panel, .pos-catalog-panel, .pos-products-panel,
    .dashboard-hero, .customer-hero, .account-hero, .mi-top {
      border: 1px solid var(--mi-line); border-radius: 16px; background: var(--mi-paper); box-shadow: var(--mi-shadow-card);
    }
    .branch-overview-card, .financial-block, .pos-barcode-panel, .pos-manual-status, .receivable-row, .dashboard-receivable-row {
      background: var(--mi-panel); border-color: transparent; border-radius: 12px; box-shadow: none;
    }
    .branch-overview-card.active, .branch-overview-card[aria-current="true"], .branch-overview-card.selected {
      background: var(--mi-paper); border: 2px solid var(--mi-good);
    }
    .mi-side { box-shadow: none; }
    .mi-top { border-radius: 0; box-shadow: none; }

    /* Kennzahlenkarten: weiß, Zahl groß; die erste ist die grüne Hauptkarte */
    .dashboard-stats .stat-card:nth-child(n), .accounting-stat.blue, .accounting-stat.sand, .accounting-stat.lilac,
    .account-summary-card.blue, .account-summary-card.mint, .account-summary-card.sand, .account-summary-card.lilac,
    .dashboard-currency-card.blue, .dashboard-currency-card.mint, .dashboard-currency-card.sand, .dashboard-currency-card.lilac {
      border: 1px solid var(--mi-line); border-radius: 16px; background: var(--mi-paper); box-shadow: var(--mi-shadow-card);
    }
    .dashboard-stats .stat-card:nth-child(1) {
      border-color: transparent; background: var(--mi-grad-green); color: #fff;
    }
    .dashboard-stats .stat-card:nth-child(1) strong,
    .dashboard-stats .stat-card:nth-child(1) span { color: #fff; }
    .dashboard-stats .stat-card:nth-child(1) small { color: var(--mi-lime); }
    .stat-card strong, .accounting-stat strong, .account-summary-card strong { font-weight: 600; letter-spacing: -.03em; }
    .dashboard-stat-card:hover { border-color: var(--mi-good); box-shadow: 0 6px 18px #14201a14; }

    /* Hauptschaltflächen: Pille in Hauptgrün; Zweitschaltfläche mit grünem Umriss */
    .mi-btn.primary, button:not(.secondary):not(.ghost):not(.danger):not(.ui-lang-option):not(.pos-category):not(.pos-product-tile):not(.payment-choice), .button:not(.secondary) {
      border-radius: 999px; background: var(--mi-teal); border-color: var(--mi-teal); font-weight: 600;
    }
    .mi-btn:not(.primary), button.secondary, .button.secondary {
      border-radius: 999px; border: 1.5px solid var(--mi-teal); background: transparent; color: var(--mi-ink);
    }
    .pos-category.active, .pos-category:hover, button.pos-category.active, button.pos-category:hover { background: var(--mi-teal); border-color: var(--mi-teal); }
    .payment-choice.selected, button.payment-choice.selected { border-color: var(--mi-teal); background: var(--mi-mint); color: var(--mi-teal-text); }

    /* Status-Chips: zart grün mit dunkelgrünem Text */
    .mi-pill, .pill, .badge, .status-pill, .status { border-radius: 999px; }

    /* Navigation: aktiver Punkt wie im Vorbild (grünes Symbol-Chip, zarter Grund) */
    @media (min-width: 861px) {
      .mi-main { background: transparent; }
      .mi-nav-link.active { background: var(--mi-mint); color: var(--mi-teal-text); }
      .mi-nav-link.active .mi-nav-icon { background: var(--mi-teal); color: #fff; }
      .mi-nav-link:hover, .mi-nav-link:focus-visible { background: var(--mi-panel); }
    }
    @media (max-width: 860px) {
      .mi-nav-link.active { background: var(--mi-mint); color: var(--mi-teal-text); }
    }

    /* Dashboard-Kacheln nach dem Vorbild: Kennzahl groß, Kachel hellgrau ohne Linie, Hauptkachel als grüner Verlauf */
    .mi-summary-item { padding: 14px 16px; border: 0; border-radius: 14px; background: var(--mi-panel); }
    .mi-summary-item span { color: var(--mi-muted); font-size: .72rem; font-weight: 500; }
    .mi-summary-item strong { margin-top: 6px; font-size: 1.05rem; font-weight: 600; letter-spacing: -.02em; }
    .mi-summary-item.primary { background: var(--mi-grad-green); color: #fff; }
    .mi-summary-item.primary span { color: var(--mi-lime); }
    .mi-summary-item.primary strong { font-size: 1.2rem; }
    .mi-branch-card { padding: 14px; border: 2px solid transparent; border-radius: 14px; background: var(--mi-panel); }
    .mi-branch-card:hover, .mi-branch-card.active { border-color: var(--mi-good); background: var(--mi-paper); box-shadow: none; }
    .mi-branch-card strong { font-size: .9rem; font-weight: 600; }
    .mi-branch-card em { color: var(--mi-teal-text); font-weight: 500; }
    .dashboard-currency-card { padding: 16px; border: 0; border-radius: 16px; background: var(--mi-panel); }
    .dashboard-currency-card:hover, .dashboard-currency-card:focus-visible { box-shadow: 0 0 0 2px var(--mi-good); }
    .dashboard-currency-metric { border-top-color: var(--mi-line); }
    .dashboard-currency-metric strong { font-size: 1rem; font-weight: 600; }
    .mi-panel-head h2, .mi-panel-head h3 { font-size: 1.05rem; font-weight: 600; }

    /* Schnellzugriffe: Kasse als grüner Verlauf, Buchhaltung weiß */
    .mi-entry-card { border: 1px solid var(--mi-line); border-radius: 18px; background: var(--mi-paper); box-shadow: var(--mi-shadow-card); }
    .mi-entry-card.pos { border-color: transparent; background: var(--mi-grad-green); color: #fff; }
    .mi-entry-card.accounting { background: var(--mi-paper); }
    .mi-entry-card:hover { border-color: var(--mi-good); }
    .mi-entry-arrow { display: grid; flex: 0 0 30px; width: 30px; height: 30px; place-items: center; border: 1.3px solid currentColor; border-radius: 50%; }
    .mi-quick a { border: 0; border-radius: 12px; background: var(--mi-panel); }
    .mi-quick a:hover { box-shadow: 0 0 0 2px var(--mi-good); }

    /* Handy: die Kasse liegt wieder normal im Seitenfluss statt als feste Leiste unten (Entscheidung des Nutzers 02.10.2026) */
    @media (max-width: 650px) {
      .dashboard-page { padding-bottom: 0; }
      .dashboard-page > .dashboard-primary-actions .mi-entry-card.pos {
        position: static; min-height: 0; padding: 14px 16px; border-radius: 18px; box-shadow: var(--mi-shadow-card);
      }
      .dashboard-page > .dashboard-primary-actions .mi-entry-card.pos small { display: block; }
    }

    /* Feinschliff: Währungskarten (Financial snapshot) grau ohne Linie, leere Kassen-Statuszeile ausblenden */
    .dashboard-currency-card.blue, .dashboard-currency-card.mint, .dashboard-currency-card.sand, .dashboard-currency-card.lilac {
      border: 0; border-radius: 16px; background: var(--mi-panel); box-shadow: none;
    }
    .pos-customer-status:empty { display: none; }
    /* Status-Chips ohne eigenen Stil (mi-badge, z. B. Filialen): gleiche Optik wie .badge, "inactive" bleibt grau */
    .mi-badge { display: inline-block; padding: 3px 8px; border-radius: 999px; background: var(--mi-mint); color: var(--mi-teal); font-size: .78rem; font-weight: 700; }
    .mi-badge.inactive { background: #eef0ee; color: var(--mi-muted); }

    /* Seitengerüst nach der Vorlage (Desktop): grauer Verlauf, weiße Hülle mit großen Ecken, darin
       Seitenleiste, Kopfzeile und Inhalt als weiche Felder. Gilt für alle Seiten mit .mi-shell. */
    @media (min-width: 861px) {
      :root { --mi-shell-panel: #f7f7f6; --mi-nav-muted: #858c88; }
      html { background: #e2e3e1; }
      body { background: linear-gradient(180deg, #ececea 0%, #dcddda 100%) fixed; }
      .mi-shell {
        grid-template-columns: 15.75rem minmax(0, 1fr); gap: 1rem; width: calc(100% - 2 * var(--mi-gap-x)); max-width: none; min-height: calc(100vh - 2 * var(--mi-gap-y));
        margin: var(--mi-gap-y) auto; padding: 1.25rem; border-radius: 2.25rem; background: #fff; box-shadow: 0 0.75rem 2.5rem #14201a14;
      }
      .mi-side {
        top: 2.5rem; height: calc(100vh - 5rem); gap: 0.875rem; padding: 1.375rem 0.875rem 0.875rem; border: 0; border-radius: 1.625rem;
        background: var(--mi-shell-panel); box-shadow: none;
      }
      .mi-brand { padding: 0 0.375rem 0.625rem; }
      .mi-brand .brand { font-size: 1.0625rem; font-weight: 700; letter-spacing: -.01em; text-transform: none; }
      .mi-mark { width: 2.125rem; height: 2.125rem; border-radius: 50%; background: var(--mi-grad-green); font-size: 0.9375rem; }
      .mi-side-label, .mi-nav-group { margin: 0.75rem 0.5rem 0.375rem; color: var(--mi-nav-muted); font-size: 0.7188rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; }
      .mi-nav { gap: 0.125rem; }
      .mi-nav-link { position: relative; padding: 0.625rem 0.875rem; border-radius: 0.75rem; background: transparent; color: var(--mi-nav-muted); font-size: 0.9375rem; font-weight: 500; }
      .mi-nav-link:hover, .mi-nav-link:focus-visible { background: #ececea; color: var(--mi-ink); }
      .mi-nav-icon, .mi-nav-link:hover .mi-nav-icon { width: 1.375rem; height: 1.375rem; flex: 0 0 1.375rem; border-radius: 0; background: transparent; color: var(--mi-nav-muted); }
      .mi-nav-link.active { background: transparent; color: var(--mi-ink); font-weight: 700; }
      .mi-nav-link.active .mi-nav-icon { background: transparent; color: var(--mi-teal); }
      .mi-nav-link.active::before { content: ""; position: absolute; left: -0.875rem; top: 0.375rem; bottom: 0.375rem; width: 0.3125rem; border-radius: 0 0.375rem 0.375rem 0; background: var(--mi-teal); }
      .mi-area-switch { background: #ececea; }
      .mi-side-foot { padding: 1rem; border: 0; border-radius: 1.25rem; background: radial-gradient(120% 120% at 100% 0%, #2a8c5b 0%, #0d4a30 60%, #07281b 100%); color: #bfe3d0; font-size: 0.8438rem; }
      .mi-side-foot .mi-status { color: #fff; font-weight: 600; }
      .mi-main { display: flex; flex-direction: column; gap: 1rem; min-width: 0; }
      .mi-top {
        min-height: 0; padding: 0.75rem 1.25rem; border: 0; border-radius: 1.625rem; background: var(--mi-shell-panel); box-shadow: none;
      }
      .mi-top-title { font-size: 1rem; font-weight: 600; }
      .mi-top-tools a, .mi-top-tools select, .mi-top-tools button, .mi-logout {
        min-height: 2.25rem; padding: 0.5rem 0.875rem; border: 0; border-radius: 999px; background: #fff; color: var(--mi-ink); font-size: 0.8438rem; font-weight: 500;
      }
      .mi-top-tools a:hover, .mi-top-tools select:hover { background: #ececea; }
      .mi-logout, .mi-top-tools button.mi-logout { background: var(--mi-teal); color: #fff; font-weight: 600; }
      .mi-top-right { gap: 0.75rem; }
      .mi-top-right .mi-avatar { order: 2; width: 2.625rem; height: 2.625rem; flex-basis: 2.625rem; background: var(--mi-grad-green); color: #fff; font-size: 0.8125rem; }
      .mi-top-right > span { order: 3; max-width: 11.875rem; color: var(--mi-muted); font-size: 0.8125rem; line-height: 1.35; }
      .mi-top-left .mi-avatar { width: 2.375rem; height: 2.375rem; flex-basis: 2.375rem; background: #fff; color: var(--mi-teal); }
      .mi-body {
        width: auto; max-width: none; margin: 0; flex: 1; padding: 1.5rem; border-radius: 1.625rem; background: var(--mi-shell-panel);
      }
    }
    @media (min-width: 861px) {
      .mi-top { gap: 1rem; }
      .mi-top-left { flex: 1 1 0; min-width: 0; }
      .mi-top-right { flex: 0 1 auto; flex-wrap: nowrap; }
      .mi-top-tools { flex-wrap: nowrap; }
      .mi-top-right > span { max-width: 9.375rem; }
      .mi-top-title { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    }
    /* Schmale Desktops und Tablets quer: Seitenleiste schmaler, Kopfzeile darf umbrechen */
    @media (min-width: 861px) and (max-width: 1180px) {
      .mi-shell { grid-template-columns: 13rem minmax(0, 1fr); width: auto; max-width: none; margin: 0.75rem; padding: 0.75rem; border-radius: 1.75rem; }
      .mi-side { top: 1.5rem; height: calc(100vh - 48px); }
      .mi-top { flex-direction: column; align-items: stretch; }
      .mi-top-right { flex-wrap: wrap; justify-content: space-between; }
      .mi-top-tools { flex-wrap: wrap; }
      .mi-body { padding: 1rem; }
    }

    /* Große Bildschirme: alles in rem, daher wächst die Oberfläche mit. Die Hülle darf breiter werden. */
    @media (min-width: 1720px) { html { font-size: 100%; } }
    @media (min-width: 2200px) { html { font-size: 112.5%; } }
    @media (min-width: 2800px) { html { font-size: 131.25%; } }

    /* Fester App-Rahmen wie in der Vorlage: Seitenleiste und Kopfzeile bleiben stehen, nur der Inhalt scrollt.
       So beginnen und enden Seitenleiste, Kopfzeile und Inhaltsfeld immer auf gleicher Höhe. */
    @media (min-width: 861px) {
      .mi-shell { height: calc(100vh - 2.5rem); min-height: 0; grid-template-rows: minmax(0, 1fr); align-items: stretch; overflow: hidden; }
      .mi-side { position: static; top: auto; height: 100%; min-height: 0; }
      .mi-main { height: 100%; min-height: 0; overflow: hidden; }
      .mi-top { flex: 0 0 auto; }
      .mi-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
    }
    @media (min-width: 861px) and (max-width: 1180px) {
      .mi-shell { height: calc(100vh - 24px); }
      .mi-side { top: auto; height: 100%; }
    }

    /* Einheitliche Karten wie in der Vorlage: große weiße Karte ohne Linie mit weichem Schatten; Kacheln darin
       hellgrau mit kleinerem Radius; die erste Kennzahl einer Reihe als grüner Verlauf. Gilt für alle Seiten. */
    :root { --mi-radius-card: 1.375rem; --mi-radius-tile: 1rem; }
    .card, .ui-card, .ui-table-wrap, .mi-page-panel, .mi-panel, .mi-filter, .period-filter, .dashboard-quick-actions,
    .accounting-panel, .accounting-filter, .accounting-branch-panel,
    .warehouse-secondary, .warehouse-transfer-card,
    .module-settings-grid-panel, .module-settings-note,
    .product-page-panel, .product-stock-panel,
    .pos-panel, .pos-cart, .customer-list-panel, .customer-create-panel,
    .dashboard-panel, .dashboard-branch-overview, .dashboard-currency-overview, .dashboard-financial-overview, .dashboard-activity {
      border: 0; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card);
    }
    .module-settings-card, .accounting-branch-card, .accounting-currency-card, .warehouse-action-card, .warehouse-stock-bar,
    .pos-line, .pos-payment-box, .pos-customer-box, .pos-manual-payment-confirmation, .pos-product-tile, .pos-barcode-panel,
    .product-details, .branch-overview-card, .financial-block {
      border: 0; border-radius: var(--mi-radius-tile); background: var(--mi-panel); box-shadow: none;
    }
    .accounting-branch-card.active, .pos-product-tile:hover, .module-settings-card:hover { background: var(--mi-paper); box-shadow: 0 0 0 2px var(--mi-good); }
    .module-settings-card.module-settings-static { background: var(--mi-panel); }
    .accounting-stat-grid > .accounting-stat:first-child, .account-summary-grid > .account-summary-card:first-child {
      border-color: transparent; background: var(--mi-grad-green); color: #fff;
    }
    .accounting-stat-grid > .accounting-stat:first-child *, .account-summary-grid > .account-summary-card:first-child * { color: #fff; }
    .accounting-stat strong, .account-summary-card strong, .stat-card strong { font-size: clamp(1.2rem, 1.5vw, 1.6rem); }
    .mi-summary-item strong { font-size: 1.3rem; }
    .mi-summary-item.primary strong { font-size: 1.6rem; }

    /* Alle übrigen Karten und Felder (Benutzer, Sicherheit, Einstellungen, Landwirtschaft, Kapazität …): gleiche Regel über den Klassennamen.
       Erste Ebene = weiße Karte, Karten darin = hellgraue Kachel. */
    .mi-body [class$="-panel"], .mi-body [class*="-panel "], .mi-body [class$="-card"], .mi-body [class*="-card "] {
      border: 0; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card);
    }
    .mi-body [class*="-panel"] [class$="-panel"], .mi-body [class*="-panel"] [class*="-panel "],
    .mi-body [class*="-panel"] [class$="-card"], .mi-body [class*="-panel"] [class*="-card "],
    .mi-body [class*="-card"] [class$="-card"] {
      border: 0; border-radius: var(--mi-radius-tile); background: var(--mi-panel); box-shadow: none;
    }

    /* Seiten füllen die Fläche: der Seiteninhalt wächst bis zum Ende des Inhaltsfelds (Raster streckt die Karten),
       es bleibt nur der normale Kartenabstand wie in der Vorlage. */
    @media (min-width: 861px) {
      .mi-body { display: flex; flex-direction: column; gap: 1rem; }
      .mi-body > [class$="-page"], .mi-body > [class*="-page "] { flex: 1 0 auto; align-content: stretch; }
    }

    /* Anmeldung und öffentliche Formularseiten: gleicher grauer Grund und weiße Hülle wie die App */
    body:has(.ui-public) { background: linear-gradient(180deg, #ececea 0%, #dcddda 100%) fixed; }
    .ui-public {
      width: calc(100% - 2 * var(--mi-gap-x)); max-width: none; min-height: calc(100vh - 2 * var(--mi-gap-y)); margin: var(--mi-gap-y) auto; padding: 1.25rem;
      border-radius: 2.25rem; background: #fff; box-shadow: 0 0.75rem 2.5rem #14201a14;
    }
    .ui-public-header { padding: .85em 1.5em; border: 0; border-radius: 1.6em; background: var(--mi-shell-panel, #f7f7f6); }
    .ui-brand { color: var(--mi-ink); }
    .ui-brand small { color: var(--mi-muted); }
    .ui-lang { background: #fff; }
    .ui-lang button { color: var(--mi-muted); }
    .ui-lang button.is-active { background: var(--mi-teal); color: #fff; }
    .ui-public-main { margin-top: 1em; border-radius: 1.6em; background: var(--mi-shell-panel, #f7f7f6); }
    .ui-auth-card { border-radius: 1.6em; box-shadow: var(--mi-shadow-card); }
    .ui-auth-footer { color: var(--mi-muted); }
    @media (max-width: 640px) { .ui-public { width: auto; margin: .5rem; padding: .5rem; border-radius: 1.5rem; } }

    /* Anmeldeseite: Hülle rechnet Innenabstand mit (kein Scrollbalken), Karte wächst auf großen Bildschirmen mit */
    .ui-public { box-sizing: border-box; font-size: clamp(16px, calc(9.5px + .6vw), 26px); }
    .ui-auth-stack { max-width: 40em; }
    .ui-public-main { margin-top: 1em; }

    /* Kasse (Desktop): füllt die ganze Höhe, Reiter Produkte / Manuell / Barcode, größere Kacheln, Warenkorb mit festen Knöpfen.
       Gilt nur ab 861 px; auf dem Handy bleibt die Kasse wie bisher. */
    .pos-tabs { display: none; }
    @media (min-width: 861px) {
      .mi-body:has(.pos-page) { overflow: hidden; }
      .mi-body > .pos-page { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; gap: .75rem; }
      .pos-toolbar { flex: 0 0 auto; justify-content: flex-end; margin: 0; }
      .pos-toolbar > div:first-child { display: none; }
      .pos-toolbar-actions .button { min-height: 2.5rem; padding: .5rem 1.1rem; font-size: .9rem; }
      #sale-form { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; gap: .75rem; }
      .pos-shell { flex: 1 1 0; min-height: 0; grid-template-columns: minmax(0, 1fr) 25rem; gap: 1rem; align-items: stretch; }
      .pos-main { min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: .75rem; padding: 0 .25rem 0 0; }
      .pos-tabs { display: flex; gap: .25rem; width: max-content; padding: .25rem; border-radius: 999px; background: #fff; box-shadow: var(--mi-shadow-card); }
      .pos-tab, button.pos-tab { min-height: 2.5rem; padding: .5rem 1.6rem; border: 0; border-radius: 999px; background: transparent; color: var(--mi-muted); font-size: .95rem; font-weight: 600; }
      .pos-tab.active, button.pos-tab.active { background: var(--mi-teal); color: #fff; }
      .pos-catalog-panel > .section-heading, .pos-products-panel > .section-heading, .pos-manual-panel > summary { display: none; }
      .pos-catalog-panel, .pos-manual-panel { padding: 1rem; }
      .pos-search-row .pos-product-search { min-height: 3rem; font-size: 1rem; }
      .pos-search-row .pos-search-label > span { display: none; }
      .pos-manual-panel .pos-line { grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap: .6rem; }
      .pos-manual-panel input, .pos-manual-panel select { min-height: 2.75rem; font-size: .95rem; }
      .pos-category-row button, .pos-category { min-height: 2.4rem; padding: .45rem 1.1rem; font-size: .9rem; }
      .pos-products-panel { flex: 1 1 auto; }
      .pos-product-grid { grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr)); gap: .85rem; }
      button.pos-product-tile, .pos-product-tile { display: flex; flex-direction: column; align-items: flex-start; height: auto; min-height: 7.5rem; padding: .9rem; gap: .5rem; border: 0; border-radius: var(--mi-radius-tile); background: #fff; box-shadow: var(--mi-shadow-card); text-align: left; }
      button.pos-product-tile .product-visual { flex: 0 0 auto; width: 2.6rem; height: 2.6rem; border-radius: .7rem; }
      button.pos-product-tile .pos-product-copy { align-items: flex-start; gap: .25rem; }
      button.pos-product-tile .pos-product-copy strong { font-size: .95rem; }
      button.pos-product-tile .pos-product-copy small { font-size: .78rem; }
      button.pos-product-tile .pos-product-copy b { font-size: 1rem; color: var(--mi-teal); }
      button.pos-product-tile:hover { box-shadow: 0 0 0 2px var(--mi-good), var(--mi-shadow-card); }
      .pos-cart { position: static; display: flex; flex-direction: column; gap: .75rem; height: 100%; min-height: 0; overflow-y: auto; padding: 1.1rem; }
      .pos-cart h2 { font-size: 1.15rem; }
      .pos-cart-items { flex: 1 1 auto; min-height: 6rem; overflow-y: auto; }
      .pos-cart-row { padding: .8rem .9rem; border: 0; border-radius: .9rem; background: var(--mi-panel); font-size: .95rem; }
      .pos-cart .pos-payment-box, .pos-cart .pos-customer-box { padding: .75rem; }
      .pos-cart .payment-grid button { min-height: 2.6rem; font-size: .88rem; }
      .pos-cart .discount-row input { min-height: 2.6rem; font-size: .95rem; }
      .pos-cart .cart-total { font-size: 1rem; }
      .pos-cart .cart-total strong { font-size: 1.9rem; letter-spacing: -.03em; }
      .pos-cart .cart-actions { position: sticky; bottom: -1.1rem; margin: auto -1.1rem -1.1rem; padding: .85rem 1.1rem 1.1rem; background: var(--mi-paper); display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; border-radius: 0 0 var(--mi-radius-card) var(--mi-radius-card); }
      .pos-cart .cart-actions button { min-height: 3.2rem; font-size: 1rem; font-weight: 700; }
    }
    @media (min-width: 861px) {
      .mi-body:has(.pos-page) { position: relative; }
      .mi-body:has(.pos-page) > .mi-global-toolbar { margin: 0 0 .75rem; min-height: 2.5rem; }
      .mi-body:has(.pos-page) > .mi-global-toolbar p, .mi-body:has(.pos-page) > .mi-global-toolbar .mi-eyebrow { display: none; }
      .mi-body:has(.pos-page) > .mi-global-toolbar h1 { margin: 0; font-size: 1.5rem; }
      .pos-toolbar { position: absolute; top: 1.5rem; right: 1.5rem; z-index: 2; }
    }

    /* Warenkorb kompakt: so wenig Höhe wie möglich, damit er auf normalen Bildschirmen ohne Scrollen auskommt */
    @media (min-width: 861px) {
      .pos-cart { gap: .55rem; padding: 1rem; }
      .pos-cart .cart-heading h2 { margin: 0; font-size: 1.05rem; }
      .pos-cart .payment-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .4rem; }
      .pos-cart .payment-grid button { min-height: 2.3rem; padding: .3rem .2rem; font-size: .8rem; }
      .pos-cart .pos-payment-box { display: grid; gap: .4rem; padding: .65rem; }
      .pos-cart .pos-payment-box .section-heading { margin: 0; }
      .pos-cart .pos-payment-box h3 { margin: 0; font-size: .9rem; }
      .pos-cart .pos-payment-box > p.muted { margin: 0; font-size: .74rem; line-height: 1.3; }
      .pos-cart .payment-currency-row { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; }
      .pos-cart .discount-row { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
      .pos-cart .discount-row label { font-size: .78rem; }
      .pos-cart .discount-row input { min-height: 2.3rem; }
      .pos-cart .cart-total { margin: 0; }
      .pos-cart .cart-total strong { font-size: 1.6rem; }
      .pos-cart .pos-customer-box { padding: .55rem .75rem; }
      .pos-cart .cart-actions button { min-height: 2.9rem; }
    }

    /* Eine Scroll-Leiste für die ganze Seite (Entscheidung des Nutzers 03.10.2026): kein Bereich scrollt einzeln.
       Seitenleiste, Kopfzeile und Inhalt scrollen zusammen als ein Block (Rückmeldung des Nutzers 03.10.2026: nichts getrennt). Ist die Seite kürzer
       als der Bildschirm, füllt der Inhalt bis unten. Diese Regeln ersetzen den festen App-Rahmen weiter oben. */
    @media (min-width: 861px) {
      .mi-shell { height: auto; min-height: calc(100vh - 2 * var(--mi-gap-y)); overflow: visible; grid-template-rows: auto; align-items: stretch; }
      .mi-side { position: static; top: auto; height: auto; min-height: 0; align-self: stretch; overflow: visible; }
      .mi-main { height: auto; min-height: 0; overflow: visible; }
      .mi-top { position: static; z-index: auto; box-shadow: none; }
      .mi-body { flex: 1 0 auto; min-height: 0; overflow: visible; }
      .mi-body:has(.pos-page) { overflow: visible; }
      .mi-body > .pos-page { flex: 1 0 auto; }
      #sale-form { flex: 1 0 auto; }
      .pos-shell { flex: 1 0 auto; }
      .pos-main { overflow: visible; min-height: 0; }
      .pos-cart { height: auto; overflow: visible; align-self: stretch; }
      .pos-cart-items { overflow: visible; }
      .pos-cart .cart-actions { position: static; margin: auto 0 0; padding: .5rem 0 0; border-radius: 0; }
    }
    @media (min-width: 861px) and (max-width: 1180px) {
      .mi-shell { height: auto; min-height: calc(100vh - 1.5rem); }
    }

    /* Kasse, Feinschliff: inaktive Reiter hell, Warenkorb etwas niedriger, damit die Seite auf einen Bildschirm passt */
    @media (min-width: 861px) {
      .pos-tabs button.pos-tab:not(.active) { background: transparent !important; color: var(--mi-muted) !important; border: 0 !important; box-shadow: none !important; }
      .pos-tabs button.pos-tab.active { background: var(--mi-teal) !important; color: #fff !important; }
      .pos-cart-items { min-height: 3rem; }
      .pos-cart { gap: .45rem; }
      .pos-cart .pos-customer-box { margin: 0; }
      .pos-cart .pos-payment-box > .muted { margin: 0; }
    }
    /* Buchhaltung kompakt: schmaler Kopf, Filial-Chips und Filter in einer Leiste, fünf Kennzahlen in einer Reihe */
    .accounting-page { gap: .75rem; }
    .accounting-toolbar { padding: 0; border: 0; background: transparent; box-shadow: none; align-items: center; }
    .accounting-toolbar h2 { margin: 0; font-size: 1.5rem; }
    .accounting-toolbar p { margin: .15rem 0 0; color: var(--mi-muted); font-size: .85rem; }
    .accounting-branch-panel { padding: .75rem 1rem; }
    .accounting-branch-panel-head p, .accounting-branch-panel-head .badge { display: none; }
    .accounting-branch-panel-head h2 { margin: 0 0 .5rem; font-size: .95rem; }
    .accounting-branch-grid { display: flex; flex-wrap: wrap; gap: .5rem; }
    .accounting-branch-card { display: inline-flex; align-items: baseline; gap: .5rem; padding: .45rem .9rem; border-radius: 999px; }
    .accounting-branch-card small { font-size: .75rem; color: var(--mi-muted); }
    .accounting-filter { padding: .6rem 1rem; }
    .accounting-stat-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .75rem; }
    .accounting-stat { min-height: 0; padding: 1rem 1.1rem; }
    .accounting-stat strong { white-space: pre-line; line-height: 1.15; }
    .accounting-stat small { font-size: .75rem; }
    .accounting-stat.net.positive strong { color: var(--mi-good); }
    .accounting-stat.net.negative strong { color: var(--mi-danger); }
    .accounting-stat-grid > .accounting-stat:first-child strong { color: #fff; }
    @media (max-width: 1399px) { .accounting-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .accounting-stat-grid > .accounting-stat:first-child { grid-column: 1 / -1; } }
    @media (max-width: 650px) { .accounting-stat-grid { grid-template-columns: 1fr; } }

    /* Kasse: Elemente mit hidden bleiben wirklich versteckt (Mobile-Prüfung, Barcode-Feld, Wechselkurs); die Seite passt dadurch auf den Bildschirm */
    .pos-page [hidden] { display: none !important; }
    @media (min-width: 861px) {
      .pos-shell { grid-template-columns: minmax(0, 1fr) clamp(25rem, 21vw, 34rem); }
      .pos-cart { padding: .8rem; gap: .35rem; }
      .pos-cart-items { min-height: 0; }
      .pos-cart .pos-payment-box { gap: .3rem; padding: .55rem; }
      .pos-cart .cart-heading { margin: 0; }
      .pos-cart .pos-manual-payment-confirmation { padding: .5rem .65rem; }
    }
    /* Buchhaltung: der Seitentitel steht schon im schmalen Kopf der Seite, nicht doppelt */
    .mi-body:has(.accounting-page) > .mi-global-toolbar { display: none; }

    /* Rand um die Hülle wie in der Vorlage: etwa 5 % der Breite links und rechts, oben und unten ein schmaler Streifen */
    :root { --mi-gap-x: clamp(1.25rem, 5vw, 9rem); --mi-gap-y: clamp(1.1rem, 2.6vh, 3rem); }

    /* Buchhaltung: Diagramm Umsatz gegen Ausgaben (letzte 6 Monate) */
    .accounting-trend { padding: 1rem 1.25rem; }
    .accounting-chart { display: flex; align-items: flex-end; gap: 1.25rem; height: 11rem; padding: .5rem .25rem 0; }
    .accounting-chart-month { flex: 1; display: flex; flex-direction: column; align-items: center; gap: .35rem; height: 100%; }
    .accounting-chart-bars { flex: 1; display: flex; align-items: flex-end; gap: .3rem; width: 100%; justify-content: center; }
    .accounting-chart-bars i, .accounting-chart-legend i { display: block; border-radius: .45rem; }
    .accounting-chart-bars i { width: clamp(.9rem, 2.2vw, 1.8rem); }
    .accounting-chart i.revenue, .accounting-chart-legend i.revenue { background: var(--mi-teal); }
    .accounting-chart i.expenses, .accounting-chart-legend i.expenses { background: #cfd3cd; }
    .accounting-chart-month > span { font-size: .78rem; color: var(--mi-muted); }
    .accounting-chart-legend { display: flex; gap: 1.25rem; padding-top: .5rem; font-size: .8rem; color: var(--mi-muted); }
    .accounting-chart-legend span { display: inline-flex; align-items: center; gap: .4rem; }
    .accounting-chart-legend i { width: .7rem; height: .7rem; }

    /* Seiteninhalt als Spalte: freier Platz geht nur an das letzte Element, schmale Kopfzeilen werden nicht aufgeblasen */
    @media (min-width: 861px) {
      .mi-body > [class$="-page"], .mi-body > [class*="-page "] { display: flex; flex-direction: column; align-content: normal; }
      .mi-body > [class$="-page"] > :last-child, .mi-body > [class*="-page "] > :last-child { flex: 1 1 auto; }
    }

    /* Module-Seite: kleinere Karten mit fester Breite statt drei sehr breiter Kacheln; Hinweise gut lesbar */
    @media (min-width: 861px) {
      .module-settings-grid { grid-template-columns: repeat(auto-fill, minmax(17rem, 20rem)); justify-content: start; gap: .75rem; }
      .module-settings-card { min-height: 0; padding: .85rem .95rem; }
      .module-settings-note { font-size: .85rem; padding: .7rem .9rem; }
    }

    /* Einstellungen: eine Übersichtsseite mit Karten statt langer Liste in der Seitenleiste */
    .settings-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 22rem)); gap: .9rem; justify-content: start; margin-top: .75rem; }
    .settings-card { display: flex; flex-direction: column; gap: .35rem; padding: 1.1rem 1.2rem; border: 0; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); color: var(--mi-ink); text-decoration: none; }
    .settings-card:hover, .settings-card:focus-visible { box-shadow: 0 0 0 2px var(--mi-good), var(--mi-shadow-card); }
    .settings-card-icon { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; margin-bottom: .35rem; border-radius: .7rem; background: var(--mi-mint); color: var(--mi-teal); }
    .settings-card-icon svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
    .settings-card strong { font-size: 1.05rem; }
    .settings-card small { color: var(--mi-muted); font-size: .85rem; line-height: 1.4; }

    /* Module-Seite: der letzte Hinweis bleibt ein schmaler Streifen und wird nicht aufgeblasen */
    @media (min-width: 861px) {
      .module-settings-page > :last-child { flex: 0 0 auto; }
    }

    /* Einstellungen: Karten behalten ihre eigene Höhe, der freie Platz bleibt unten leer */
    .settings-grid { align-content: start; grid-auto-rows: max-content; }
    @media (min-width: 861px) { .settings-page > .settings-grid { flex: 0 0 auto; } }

    /* Einstellungen als eigene Gruppe mit Überschrift und deutlichem Abstand zu den Menüs darüber */
    @media (min-width: 861px) {
      .mi-nav > .mi-nav-group, .mi-side .mi-nav-group { margin-top: 1.9rem; }
    }

    /* Einstellungen: Reiterleiste auf den Unterseiten statt Chips im Header */
    .settings-tabs { display: flex; flex-wrap: wrap; gap: .25rem; width: max-content; max-width: 100%; margin: 0 0 .9rem; padding: .25rem; border-radius: 999px; background: #fff; box-shadow: var(--mi-shadow-card); }
    .settings-tab { padding: .5rem 1.25rem; border-radius: 999px; color: var(--mi-muted); font-size: .9rem; font-weight: 600; text-decoration: none; }
    .settings-tab:hover, .settings-tab:focus-visible { background: var(--mi-panel); color: var(--mi-ink); }
    .settings-tab.active, .settings-tab.active:hover { background: var(--mi-teal); color: #fff; }
    @media (max-width: 860px) { .settings-tabs { display: none; } }

    /* Kasse: die Reiterleiste ersetzt die Titelzeile; die Aktionen der Kasse stehen rechts daneben */
    @media (min-width: 861px) {
      .mi-body:has(.pos-page) > .mi-global-toolbar { display: none; }
    }

    /* Reiterleisten behalten ihre eigene Höhe (die allgemeine nav-Regel streckte sie in der Spalte) */
    .settings-tabs { flex: 0 0 auto; align-items: center; }
    .settings-tab { display: inline-flex; align-items: center; }

    /* Kasse in einer Ansicht: Suchfeld (mit Barcode), direkt darunter die manuelle Eingabe, dann Kategorien und Produktkacheln */
    @media (min-width: 861px) {
      .pos-catalog-panel { display: contents; }
      .pos-catalog-panel > .pos-search-row { order: 1; padding: .75rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); }
      .pos-catalog-panel > .pos-barcode-panel { order: 2; }
      .pos-main > #manual { order: 3; display: block; }
      .pos-catalog-panel > .pos-category-row { order: 4; }
      .pos-main > .pos-products-panel { order: 5; }
      .pos-manual-panel { padding: .85rem 1rem; }
      .pos-manual-panel .pos-manual-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: .5rem; }
    }

    /* Produktseite: Liste links, Details rechts in Karten, Bestand als aufklappbare Kacheln */
    .product-status-chip { display: inline-block; padding: .2rem .7rem; border-radius: 999px; background: var(--mi-mint); color: var(--mi-teal); font-size: .75rem; font-weight: 700; }
    .product-status-chip.off { background: #eef0ee; color: var(--mi-muted); }
    .product-stock-chip { display: inline-block; justify-self: end; padding: .1rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 700; background: var(--mi-mint); color: var(--mi-teal); }
    .product-stock-chip.low { background: #fdecc8; color: #8a5a12; }
    .product-stock-chip.out { background: #f9dada; color: #a33; }
    .product-stock-chip.none { background: #eef0ee; color: var(--mi-muted); }
    .product-detail-symbol { display: grid; flex: 0 0 auto; place-items: center; width: 2.75rem; height: 2.75rem; overflow: hidden; border-radius: .8rem; background: var(--mi-mint); font-size: 1.35rem; }
    .product-detail-symbol.big { width: 4rem; height: 4rem; border-radius: 1rem; font-size: 1.9rem; }
    .product-detail-symbol img { width: 100%; height: 100%; object-fit: cover; }
    .product-detail-head { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
    .product-detail-head h3 { margin: 0; font-size: 1.3rem; }
    .product-detail-spacer { flex: 1; }
    .product-deactivate-button { border: 1.5px solid #e0b4b4; background: transparent; color: #a33; }
    .product-media-row { display: flex; align-items: center; gap: .9rem; margin-bottom: .75rem; }
    .product-section-title { margin: 0 0 .65rem; color: var(--mi-muted); font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    .product-stock-fold { margin-bottom: .5rem; border-radius: 1rem; background: var(--mi-panel); }
    .product-stock-fold > summary { cursor: pointer; padding: .7rem .9rem; font-weight: 700; color: var(--mi-teal); }
    .product-stock-fold > form { margin: 0; padding: 0 .9rem .9rem; border: 0; background: transparent; }
    .product-stock-action-form.product-stock-receive-form, .product-stock-action-form.product-stock-adjust-form { border: 0; background: transparent; border-radius: 0; }
    @media (min-width: 861px) {
      .mi-body:has(.products-page) { position: relative; }
      .mi-body:has(.products-page) > .mi-global-toolbar { display: none; }
      .products-toolbar { position: absolute; top: 1.5rem; right: 1.5rem; z-index: 2; margin: 0; }
      .products-toolbar > div:first-child { display: none; }
      .product-page-grid { display: grid; grid-template-columns: minmax(18rem, 23rem) minmax(0, 1fr); gap: 1rem; align-items: start; }
      .product-page-panel .product-panel-head p { display: none; }
      .product-data-table { display: none !important; }
      .product-mobile-list { display: flex !important; flex-direction: column; gap: .3rem; }
      .product-mobile-card { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr) auto; align-items: center; gap: .7rem; padding: .55rem .65rem; border: 0; border-radius: .9rem; background: transparent; color: var(--mi-ink); text-decoration: none; }
      .product-mobile-card:hover { background: var(--mi-panel); }
      .product-mobile-card.selected { background: var(--mi-mint); box-shadow: 0 0 0 2px var(--mi-good); }
      .product-mobile-media { display: grid; place-items: center; width: 2.4rem; height: 2.4rem; overflow: hidden; border-radius: .7rem; background: var(--mi-panel); font-size: 1.1rem; }
      .product-mobile-media img { width: 100%; height: 100%; object-fit: cover; }
      .product-mobile-copy, .product-mobile-meta { display: grid; gap: .1rem; min-width: 0; }
      .product-mobile-meta { text-align: right; justify-items: end; }
      .product-mobile-copy small, .product-mobile-meta small { color: var(--mi-muted); font-size: .75rem; }
      .product-mobile-meta .product-stock-chip { color: inherit; }
      .product-mobile-meta .product-stock-chip.ok { color: var(--mi-teal); }
      .product-edit-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: start; padding: 0; background: transparent !important; box-shadow: none !important; }
      .product-edit-panel > h2, .product-edit-panel > p, .product-edit-panel > .product-mobile-back { display: none; }
      .product-edit-panel > form { display: contents; }
      .product-detail-head { grid-column: 1 / -1; padding: .25rem .25rem 0; }
      .product-section, .product-edit-panel .product-stock-panel, .product-edit-panel .product-initial-stock-panel { padding: 1rem 1.1rem; border: 0; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); }
      .product-edit-panel .product-form-grid { gap: .6rem; }
    }

    /* Produktseite, Feinschliff: leichtes Symbol, beide Medien-Knöpfe gleich */
    .product-detail-symbol svg { width: 55%; height: 55%; fill: none; stroke: var(--mi-teal); stroke-width: 1.7; color: var(--mi-teal); }
    .product-media-row .mi-btn, .product-media-row .product-file-button { border: 1.5px solid var(--mi-teal) !important; background: transparent !important; color: var(--mi-ink) !important; }

    /* Produktseite: Bestand je Filiale als Kacheln mit Menge; Plus-Zeichen per CSS statt im Text */
    .product-branch-tiles { display: grid; gap: .6rem; margin-top: .6rem; }
    .product-branch-tile { padding: .75rem .85rem; border-radius: 1rem; background: var(--mi-panel); }
    .product-branch-head { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .5rem; }
    .product-stock-folds { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; }
    .product-stock-fold { margin: 0; border-radius: 999px; background: var(--mi-paper); }
    .product-stock-fold[open] { grid-column: 1 / -1; border-radius: 1rem; }
    .product-stock-fold > summary { list-style: none; padding: .45rem .8rem; text-align: center; font-size: .85rem; font-weight: 700; color: var(--mi-teal); }
    .product-stock-fold > summary::-webkit-details-marker { display: none; }
    .product-stock-receive-fold > summary::before { content: "＋ "; }
    .product-stock-fold > form { display: grid; gap: .5rem; padding: .25rem .85rem .85rem; }
    .product-stock-fold:not([open]) { box-shadow: 0 0 0 1.5px var(--mi-teal) inset; }

    /* Produktseite wie im Entwurf: Felder als graue Kacheln (Beschriftung klein oben, Wert fett), Schalter statt Checkbox,
       Wareneingang als gefüllte Schaltfläche, Bestandskarte weiß */
    @media (min-width: 861px) {
      .product-edit-panel .product-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
      .product-edit-panel .product-form-grid label { display: grid; align-content: center; gap: .1rem; margin: 0; padding: .5rem .8rem; border-radius: .8rem; background: var(--mi-panel); color: var(--mi-muted); font-size: .7rem; font-weight: 500; }
      .product-edit-panel .product-form-grid label.full { grid-column: 1 / -1; }
      .product-edit-panel .product-form-grid label input:not([type="checkbox"]),
      .product-edit-panel .product-form-grid label select,
      .product-edit-panel .product-form-grid label textarea { min-height: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--mi-ink) !important; font-size: .92rem; font-weight: 700; }
      .product-edit-panel .product-form-grid label textarea { min-height: 3rem !important; resize: vertical; }
      .product-edit-panel .product-form-grid label small { color: var(--mi-muted); font-size: .66rem; font-weight: 500; line-height: 1.3; }
      .product-edit-panel .product-form-grid label.checkbox-label { grid-column: 1 / -1; display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; }
      .product-edit-panel input[type="checkbox"] { appearance: none; -webkit-appearance: none; position: relative; flex: 0 0 auto; width: 2.6rem; height: 1.45rem; margin: 0; border: 0; border-radius: 999px; background: #cfd3cd; cursor: pointer; transition: background .15s; }
      .product-edit-panel input[type="checkbox"]::after { content: ""; position: absolute; top: .2rem; left: .2rem; width: 1.05rem; height: 1.05rem; border-radius: 50%; background: #fff; transition: transform .15s; }
      .product-edit-panel input[type="checkbox"]:checked { background: var(--mi-teal); }
      .product-edit-panel input[type="checkbox"]:checked::after { transform: translateX(1.15rem); }
      .product-edit-panel .product-stock-panel { background: var(--mi-paper) !important; box-shadow: var(--mi-shadow-card) !important; }
      .product-branch-head .product-stock-chip.ok, .product-branch-head .product-stock-chip.none { padding: 0; background: transparent; color: var(--mi-ink); font-size: .85rem; font-weight: 500; }
      .product-stock-receive-fold:not([open]) { background: var(--mi-teal); box-shadow: none; }
      .product-stock-receive-fold:not([open]) > summary { color: #fff; }
    }

    /* Produktseite: Karten einer Reihe sind gleich hoch (wie im Entwurf) */
    @media (min-width: 861px) {
      .product-edit-panel { align-items: stretch; }
      .product-detail-head { align-self: center; }
    }

    /* Dashboard: Karten, die einen eigenen Stil haben, behalten ihn (die allgemeine Kartenregel überschrieb sie) */
    .mi-body .mi-entry-card.pos { border: 0; background: var(--mi-grad-green); color: #fff; box-shadow: none; }
    .mi-body .mi-entry-card.pos * { color: inherit; }
    .mi-body .mi-branch-card { border: 2px solid transparent; border-radius: 14px; background: var(--mi-panel); box-shadow: none; }
    .mi-body .mi-branch-card:hover, .mi-body .mi-branch-card.active { border-color: var(--mi-good); background: var(--mi-paper); }
    .mi-body .dashboard-currency-card { border: 0; border-radius: 16px; background: var(--mi-panel); box-shadow: none; }

    /* Dashboard "Bericht": Kopf mit Zeitraum und Aktionen, Abschnitte Heute / Zeitraum / Entwicklung / Filialen / Bestand / Aktivitäten */
    .mi-body:has(.dash-head) > .mi-global-toolbar { display: none; }
    .dash { gap: .75rem; }
    .dash-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; }
    .dash-head h2 { margin: 0; font-size: 1.5rem; }
    .dash-head p { margin: .15rem 0 0; color: var(--mi-muted); font-size: .85rem; }
    .dash-head-tools { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
    .dash-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
    .dash-period { display: inline-flex; padding: .2rem; border-radius: 999px; background: #fff; box-shadow: var(--mi-shadow-card); }
    .dash-period a, .dash-custom > summary { padding: .4rem 1rem; border-radius: 999px; color: var(--mi-muted); font-size: .85rem; font-weight: 600; text-decoration: none; cursor: pointer; list-style: none; }
    .dash-period a.on, .dash-custom > summary.on { background: var(--mi-teal); color: #fff; }
    .dash-custom { position: relative; }
    .dash-custom > summary { background: #fff; box-shadow: var(--mi-shadow-card); }
    .dash-custom > summary::-webkit-details-marker { display: none; }
    .dash-custom form { position: absolute; right: 0; top: calc(100% + .4rem); z-index: 6; display: flex; flex-wrap: wrap; gap: .6rem; align-items: end; padding: .8rem; border-radius: 1rem; background: #fff; box-shadow: 0 8px 28px #14201a26; }
    .dash-custom label { display: grid; gap: .2rem; font-size: .75rem; color: var(--mi-muted); }
    .dash-sec { margin: .6rem .25rem 0; color: var(--mi-muted); font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
    .dash-today, .dash-kpis { display: grid; gap: .75rem; }
    .dash-today { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .dash-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .dash-kpi { display: grid; align-content: start; gap: .2rem; padding: .9rem 1.1rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); color: var(--mi-muted); font-size: .8rem; }
    .dash-kpi b { color: var(--mi-ink); font-size: 1.4rem; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; }
    .dash-kpi b.warn { color: #8a5a12; }
    .dash-kpi b.pos { color: var(--mi-good); }
    .dash-kpi b.neg { color: var(--mi-danger); }
    .dash-kpi small { font-size: .75rem; }
    .dash-kpi.hero { background: var(--mi-grad-green); color: #cfeedd; }
    .dash-kpi.hero b, .dash-kpi.hero small { color: #fff; }
    .dash-kpi.hero small:last-child { color: var(--mi-lime); }
    .dash-amounts { display: grid; gap: .05rem; }
    .dash-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
    .dash-grid-auto { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: .75rem; align-items: start; }
    .dash-card { padding: 1rem 1.15rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); }
    .dash-card-head { display: flex; align-items: center; gap: .6rem; margin-bottom: .6rem; }
    .dash-card-head h3 { flex: 1; margin: 0; font-size: 1rem; }
    .dash-card-head-sub { margin-top: 1rem; }
    .dash-hint { color: var(--mi-muted); font-size: .75rem; }
    .dash-bar { display: grid; grid-template-columns: minmax(5rem, 9rem) 1fr auto; align-items: center; gap: .6rem; margin-bottom: .45rem; font-size: .85rem; }
    .dash-bar-track { height: .6rem; border-radius: 999px; background: var(--mi-panel); }
    .dash-bar-track i { display: block; height: 100%; border-radius: 999px; background: var(--mi-teal); }
    .dash-ages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-bottom: .6rem; }
    .dash-ages div { display: grid; gap: .1rem; padding: .55rem .7rem; border-radius: .8rem; background: var(--mi-panel); color: var(--mi-muted); font-size: .72rem; }
    .dash-ages strong { color: var(--mi-ink); font-size: .95rem; }
    .dash-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
    .dash-facts div { display: grid; gap: .1rem; padding: .55rem .7rem; border-radius: .8rem; background: var(--mi-panel); color: var(--mi-muted); font-size: .72rem; }
    .dash-facts strong { color: var(--mi-ink); font-size: .95rem; }
    .dash-warn { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-bottom: .45rem; padding: .55rem .8rem; border-radius: .8rem; background: #fdecc8; }
    .dash-warn.out { background: #f9dada; }
    .dash-warn span { display: grid; }
    .dash-warn small { color: var(--mi-muted); font-size: .72rem; }
    .dash .table-wrap { overflow-x: auto; }
    @media (max-width: 1100px) { .dash-today { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dash-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .dash-grid2 { grid-template-columns: 1fr; } }
    @media (max-width: 650px) { .dash-today, .dash-kpis { grid-template-columns: 1fr; } .dash-ages { grid-template-columns: 1fr; } }

    /* Kein Bereich scrollt einzeln: Audit-Liste, Audit-Blöcke und Rechte-Raster wachsen mit der Seite */
    .audit-event-list { max-height: none; overflow: visible; padding-right: 0; }
    .audit-event-detail pre { max-height: none; overflow: visible; }
    .members-permission-grid { max-height: none; overflow: visible; padding-right: 0; }

    /* Handy (unter 861 px): Seitenraster und Dashboard-Karten dürfen nicht breiter werden als der Bildschirm; Tabellen scrollen in ihrem Rahmen */
    @media (max-width: 860px) {
      .warehouse-page { grid-template-columns: minmax(0, 1fr); }
      .dash > * { min-width: 0; max-width: 100%; }
      .dash-head-tools { width: 100%; }
      .dash-card { min-width: 0; }
      .dash-grid2, .dash-grid-auto { grid-template-columns: minmax(0, 1fr); }
    }

    /* Handy: Buchhaltungs-Titel linksbündig; Reiterleiste bleibt sichtbar und scrollt seitlich in einer Zeile */
    @media (max-width: 860px) {
      .accounting-toolbar { align-items: flex-start; }
      .settings-tabs { display: flex; flex-wrap: nowrap; width: 100%; overflow-x: auto; border-radius: 999px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
      .settings-tabs::-webkit-scrollbar { display: none; }
      .settings-tab { flex: 0 0 auto; padding: .45rem 1rem; font-size: .85rem; white-space: nowrap; }
    }

    /* Dashboard: Währungskarten wie in Vorlage B (weiße Karte, lesbare Zeilen) */
    .mi-body .dash .dashboard-currency-card { display: block; padding: 1rem 1.15rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); }
    .mi-body .dash .dashboard-currency-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: .6rem; }
    .mi-body .dash .dashboard-currency-head small { display: none; }
    .mi-body .dash .dashboard-currency-code { font-size: 1rem; font-weight: 700; }
    .mi-body .dash .dashboard-currency-metrics { display: grid; gap: .5rem; padding: .55rem .8rem; border-radius: .8rem; background: var(--mi-panel); }
    .mi-body .dash .dashboard-currency-metric { display: flex; justify-content: space-between; gap: .6rem; font-size: .85rem; color: var(--mi-muted); }
    .mi-body .dash .dashboard-currency-metric strong { font-size: .95rem; color: var(--mi-ink); }
    .mi-body .dash .dashboard-currency-footer { display: block; margin-top: .6rem; font-size: .8rem; font-weight: 600; color: var(--mi-teal); }

    /* Dashboard Vorlage B: Beträge in einer Zeile, "Details" oben rechts in der Währungskarte */
    .dash-amounts { display: flex; flex-wrap: wrap; gap: 0 .5rem; }
    .dash-amounts > span + span::before { content: "·"; margin-right: .5rem; }
    .mi-body .dash .dashboard-currency-card { position: relative; }
    .mi-body .dash .dashboard-currency-footer { position: absolute; top: 1rem; right: 1.15rem; margin: 0; }

    /* Dashboard: Wallet-Symbol ausblenden, "Details" steht oben rechts */
    .mi-body .dash .dashboard-currency-icon { display: none; }

    /* Dashboard Vorlage B: Schriftgrößen und Abstände kompakt wie im Entwurf (Tabellen 12 px statt 16 px) */
    .dash .dash-card { padding: .9rem 1rem; font-size: .8rem; }
    .dash .dash-card-head h3 { font-size: .9rem; }
    .dash .activity-table td { padding: .45rem .2rem; font-size: .76rem; }
    .dash .activity-table td strong { font-size: inherit; }
    .dash .activity-table td small, .dash .activity-table td .muted { font-size: .66rem; }
    .dash .activity-table th { padding: .35rem .2rem; font-size: .66rem; }
    .dash .dash-bar { font-size: .78rem; margin-bottom: .35rem; }
    .dash .dash-kpi { padding: .75rem .95rem; }
    .dash .dash-kpi b { font-size: 1.25rem; }
    .dash .dash-ages b, .dash .dash-ages strong { font-size: .9rem; }
    .dash .dashboard-currency-metric { font-size: .76rem; }
    .dash .dashboard-currency-metric strong { font-size: .85rem; }
    .dash .dash-warn { padding: .45rem .7rem; font-size: .8rem; }
    .dash .dash-head h2 { font-size: 1.5rem; }

    /* Gesamte Oberfläche etwa 10 % kleiner (Desktop), damit Schrift und Karten zur Vorlage passen. Handy bleibt unverändert. */
    @media (min-width: 861px) { html { font-size: 90%; } }
    @media (min-width: 2200px) { html { font-size: 101.25%; } }
    @media (min-width: 2800px) { html { font-size: 118%; } }

    /* Dashboard: Werte an die neue Grundgröße angepasst (Ziel wie Vorlage B: Tabellen ca. 12 px, Kartentitel 14 px) */
    .dash .dash-card { font-size: .85rem; }
    .dash .dash-card-head h3 { font-size: .97rem; }
    .dash .activity-table td { font-size: .85rem; }
    .dash .activity-table td small, .dash .activity-table td .muted { font-size: .72rem; }
    .dash .activity-table th { font-size: .72rem; }
    .dash .dash-bar { font-size: .85rem; }
    .dash .dash-kpi b { font-size: 1.4rem; }
    .dash .dash-ages b, .dash .dash-ages strong { font-size: 1rem; }
    .mi-body .dash .dashboard-currency-metric, .mi-body .dash .dashboard-currency-metric > span { font-size: .85rem; }
    .mi-body .dash .dashboard-currency-metric strong { font-size: .9rem; }
    .dash .dash-warn { font-size: .85rem; }
    .dash .dash-head h2 { font-size: 1.65rem; }
    /* Kapazität: Kennzahlen, Formulare nebeneinander (je zwei Felder pro Zeile), unten Verlauf breit und Verwaltung daneben */
    .cap-page { gap: .75rem; }
    .cap-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
    .cap-kpi { display: grid; gap: .2rem; padding: .9rem 1.1rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); color: var(--mi-muted); font-size: .8rem; }
    .cap-kpi b { color: var(--mi-ink); font-size: 1.4rem; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; }
    .cap-kpi.hero { background: var(--mi-grad-green); color: #cfeedd; }
    .cap-kpi.hero b { color: #fff; }
    .cap-forms { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; align-items: start; }
    .cap-forms form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
    .cap-forms form > .wide, .cap-forms form > .muted, .cap-forms form > button, .cap-forms form > label.ui-field { grid-column: 1 / -1; }
    .cap-forms form > button { justify-self: start; }
    .cap-forms .ui-field { min-width: 0; }
    .cap-forms input:not([type="checkbox"]), .cap-forms select { width: 100%; min-width: 0; }
    .cap-forms form > label.ui-field { display: flex; align-items: center; gap: .5rem; }
    .cap-forms input[type="checkbox"] { flex: 0 0 auto; width: auto; margin: 0; }
    .cap-lower { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .75rem; align-items: start; }
    .cap-side { display: grid; gap: .75rem; min-width: 0; }
    .cap-side .ui-field + .ui-field { margin-top: .6rem; }
    @media (max-width: 1500px) { .cap-forms { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
    @media (max-width: 1180px) { .cap-lower { grid-template-columns: minmax(0, 1fr); } }
    @media (max-width: 860px) {
      .cap-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .cap-forms { grid-template-columns: minmax(0, 1fr); }
    }

    /* Wie Vorlage B: auf großen Bildschirmen nicht mehr mitwachsen (Tabellen ca. 12 px, Kartentitel 14 px), nur noch mehr Platz */
    @media (min-width: 2200px) { html { font-size: 90%; } }
    @media (min-width: 2800px) { html { font-size: 100%; } }

    /* Kennzahlen-Kacheln (kpiTiles) und Listenseiten: Liste links, Formular rechts als schmale Karte (Herden, Felder, Kunden) */
    .mi-kpis { display: grid; grid-template-columns: repeat(var(--kpi-count, 4), minmax(0, 1fr)); gap: .75rem; }
    .mi-kpi { display: grid; gap: .2rem; padding: .9rem 1.1rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); color: var(--mi-muted); font-size: .8rem; }
    .mi-kpi b { color: var(--mi-ink); font-size: 1.4rem; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; }
    .mi-kpi.hero { background: var(--mi-grad-green); color: #cfeedd; }
    .mi-kpi.hero b { color: #fff; }
    .list-split { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .75rem; align-items: start; }
    .list-main, .list-side { display: grid; gap: .5rem; min-width: 0; }
    .list-side form { display: grid; gap: .6rem; }
    .list-side .ui-field input, .list-side .ui-field select { width: 100%; }
    .list-side form > button { justify-self: start; }
    @media (max-width: 1180px) { .list-split { grid-template-columns: minmax(0, 1fr); } }
    @media (max-width: 860px) { .mi-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

    /* Normaler Text wie in den Entwürfen (ca. 12 px statt 14,4 px); gilt für alle Seiten, die nichts anderes festlegen */
    @media (min-width: 861px) { .mi-body { font-size: .85rem; } }

    /* Kunden: Initialen-Symbol in der Liste, Suche als Pille, Liste breiter als das Formular, Felder als graue Kacheln */
    .customer-avatar { display: grid; place-items: center; flex: 0 0 auto; width: 2.1rem; height: 2.1rem; border-radius: 50%; background: var(--mi-mint); color: var(--mi-teal); font-size: .75rem; font-weight: 700; }
    a.customer-row { justify-content: flex-start; }
    .customer-row-main { flex: 1 1 auto; }
    .customer-row-meta { margin-left: auto; }
    .customer-search-row input { border-radius: 999px; padding-inline: 1rem; }
    .customer-search-row button { border-radius: 999px; }
    @media (min-width: 981px) {
      .customer-content-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
      .customer-content-grid.single { grid-template-columns: minmax(0, 1fr); }
    }
    @media (min-width: 861px) {
      .customer-create-panel .grid { grid-template-columns: 1fr 1fr; gap: .6rem; }
      .customer-create-panel label { display: grid; gap: .1rem; padding: .45rem .8rem; border-radius: .85rem; background: var(--mi-panel); color: var(--mi-muted); font-size: .66rem; font-weight: 500; }
      .customer-create-panel label input { min-height: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--mi-ink) !important; font-size: .92rem; font-weight: 700; }
    }

    /* Seitenrand wie Vorlage B: etwa 1,5 % links und rechts (mindestens 1 rem, höchstens 2,5 rem) */
    :root { --mi-gap-x: clamp(1rem, 1.5vw, 2.5rem); }

    /* Einstellungen: Karten füllen die Breite (3 pro Zeile, darunter 2) statt links zu enden */
    @media (min-width: 1181px) { .settings-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    @media (min-width: 861px) and (max-width: 1180px) { .settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

    /* Belege: nur "Thermodruck" ist grün (über die ganze Breite), die übrigen Formate weiß mit Rand; Hinweis als ruhige Kachel */
    .documents-format-buttons > .documents-action-form:first-child, .documents-format-buttons > .mi-btn:first-child { grid-column: 1 / -1; }
    .documents-format-buttons > :last-child:nth-child(even) { grid-column: 1 / -1; }
    .documents-format-buttons .mi-btn:not(.primary):not(:disabled) { border: 1.5px solid var(--mi-line); background: var(--mi-paper); color: var(--mi-ink); box-shadow: none; }
    .documents-format-buttons .mi-btn:not(.primary):not(:disabled):hover { border-color: var(--mi-good); }
    .documents-format-buttons .mi-btn:disabled { background: var(--mi-panel); color: var(--mi-muted); border: 0; }
    .mi-body .documents-warning { border: 0; border-radius: 12px; background: #fff8e6; color: #7a5a12; }

    /* Filialen: Währungen und letzte Verkäufe nebeneinander, "Deaktivieren/Archivieren" als ruhige Karte unten mit leicht rotem Rand */
    .branches-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; align-items: start; }
    .branches-duo > * { min-width: 0; }
    .mi-body .branches-disable-panel { box-shadow: 0 0 0 1.5px #f0c9c8, var(--mi-shadow-card); }
    @media (max-width: 1180px) { .branches-duo { grid-template-columns: minmax(0, 1fr); } }
    @media (max-width: 860px) { .branches-page[data-mobile-view="editor"] .branches-kpis { display: none; } }

    /* Kunden auf dem Handy: Symbol, Name und Status bleiben in einer Zeile */
    @media (max-width: 650px) {
      a.customer-row { flex-direction: row; align-items: center; }
      .customer-row-meta { width: auto; margin-left: auto; }
    }

    /* Zahlungsarten der Firma (Einstellungen): Kacheln im gleichen Stil wie bei den Einheiten */
    .ui-paymethods { display: grid; grid-template-columns: repeat(auto-fill, minmax(13em, 1fr)); gap: .5em; margin-bottom: 1.2em; }
    .ui-paymethod { display: flex; align-items: center; gap: .6em; padding: .65em .9em; border: 1px solid var(--mi-line); border-radius: .9em; background: #fff; font-weight: 600; cursor: pointer; }
    .ui-paymethod.is-on, .ui-paymethod:has(input:checked) { border-color: var(--mi-teal); background: var(--mi-mint); }
    .ui-paymethod input { width: 1.1em; height: 1.1em; accent-color: var(--mi-teal); }

    /* Anmeldung: nur eine Karte; der Hinweis "Neu hier?" erscheint nur, wenn die Registrierung offen ist */
    .ui-auth-new { margin-top: .6em; color: var(--mi-muted); }

    /* Mitsehen (Support-Team): Streifen oben, solange eine Firma nur gelesen wird */
    .support-view-banner { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 0 0 .75rem; padding: .65rem 1rem; border-radius: var(--mi-radius-card); background: #fff3d6; color: #6f4e0e; font-size: .85rem; box-shadow: var(--mi-shadow-card); }
    .support-view-banner form { margin: 0; }

    /* Plattformadmin im Donezo-Stil: grauer Grund, weiße Hülle mit Rand, Kopfzeile mit Reiter-Pille, erste Kennzahl grün */
    .pa-shell { box-sizing: border-box; min-height: 100vh; padding: 1.2rem var(--mi-gap-x, 1.5%); background: var(--mi-bg); }
    .pa-header { display: flex; align-items: center; flex-wrap: wrap; gap: 1rem; margin-bottom: .75rem; padding: .7rem 1.1rem; border: 0; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); }
    .pa-brand { display: inline-flex; align-items: center; gap: .6rem; font-size: .9rem; font-weight: 800; letter-spacing: .02em; }
    .pa-brand::before { content: "M"; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: .6rem; background: var(--mi-teal); color: #fff; font-size: .9rem; }
    .pa-nav { margin-right: auto; padding: .25rem; border-radius: 999px; background: var(--mi-panel); gap: .15rem; }
    .pa-nav-link { padding: .4rem 1rem; border-radius: 999px; color: var(--mi-muted); font-size: .85rem; }
    .pa-nav-link:hover { background: var(--mi-paper); color: var(--mi-ink); }
    .pa-nav-link.active { background: var(--mi-teal); color: #fff; }
    .pa-main { width: auto; margin: 0; padding: 0; gap: .75rem; }
    .pa-main > h1 { margin: .4rem .25rem 0; font-size: 1.5rem; }
    .pa-main > h1 + p.muted { margin: 0 .25rem; }
    .pa-grid { grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: .75rem; }
    .pa-grid > .ui-card { display: grid; align-content: start; gap: .2rem; padding: .9rem 1.1rem; }
    .pa-grid > .ui-card .ui-card-head { margin-bottom: 0; }
    .pa-grid > .ui-card .ui-card-head h3 { color: var(--mi-muted); font-size: .8rem; font-weight: 500; }
    .pa-figure { font-size: 1.6rem; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; }
    .pa-grid > .ui-card:first-child { border: 0; background: var(--mi-grad-green); color: #cfeedd; }
    .pa-grid > .ui-card:first-child .ui-card-head h3, .pa-grid > .ui-card:first-child a { color: #cfeedd; }
    .pa-grid > .ui-card:first-child .pa-figure { color: #fff; }
    .pa-tabs { padding: .25rem; border-radius: 999px; background: #fff; box-shadow: var(--mi-shadow-card); width: max-content; max-width: 100%; }
    .pa-tabs .pa-nav-link, .pa-main > nav.pa-tabs .pa-nav-link { padding: .4rem 1rem; }
    .pa-narrow { margin-top: 3rem; }
    @media (max-width: 860px) { .pa-shell { padding: .6rem; } .pa-header { padding: .6rem .8rem; } .pa-nav { width: 100%; overflow-x: auto; flex-wrap: nowrap; } .pa-nav-link { flex: 0 0 auto; white-space: nowrap; } }

    /* Kundenakte im Plattformadmin: Liste der gefundenen Probleme */
    .pa-findings { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; }
    .pa-finding { padding: .55rem .8rem; border-radius: .8rem; background: var(--mi-panel); }
    .pa-finding.high { background: #f9dada; }
    .pa-finding.medium { background: #fdecc8; }
    .pa-sev { margin-right: .4rem; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
    .support-view-banner.edit { background: #fbdcdc; color: #7a1f1c; }

    /* Plattformadmin: Rechte-Auswahl */
    .pa-check { display: flex; align-items: center; gap: .45rem; margin: .2rem 0; font-size: .85rem; }
    .pa-rights { display: grid; gap: .1rem; min-width: 14rem; }

    /* Hilfe-Knopf der Kunden: große Kacheln, Hilfe-Code, Streifen "Support ist verbunden" */
    .help-page { display: grid; gap: .9rem; max-width: 46rem; }
    .help-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
    .help-tile { margin: 0; }
    .help-tile button { display: grid; justify-items: center; gap: .4rem; width: 100%; padding: 1.1rem .6rem; border: 0; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); color: var(--mi-ink); font-size: .95rem; font-weight: 600; cursor: pointer; }
    .help-tile button:hover, .help-tile button:focus-visible { box-shadow: 0 0 0 2px var(--mi-good), var(--mi-shadow-card); }
    .help-icon { font-size: 1.8rem; line-height: 1; }
    .help-note { color: var(--mi-muted); font-size: .8rem; }
    .help-code-card { display: grid; gap: .3rem; padding: 1rem 1.2rem; border-radius: var(--mi-radius-card); background: var(--mi-paper); box-shadow: var(--mi-shadow-card); text-align: center; }
    .help-code { padding: .6rem; border-radius: 1rem; background: var(--mi-mint); color: var(--mi-teal); font-size: 2.2rem; font-weight: 800; letter-spacing: .25em; }
    .help-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
    .help-button { margin-right: .4rem; }
    .support-status-banner { margin: 0 0 .75rem; padding: .6rem 1rem; border-radius: var(--mi-radius-card); background: #e1f1e8; color: var(--mi-teal); font-size: .85rem; box-shadow: var(--mi-shadow-card); }
    .support-status-banner.edit { background: #fbdcdc; color: #7a1f1c; }
    @media (max-width: 860px) { .help-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

    /* Hilfe-Knopf: Kacheln weiß statt grün (überstimmt die allgemeine Knopf-Regel), Knopf in der Kopfzeile als Rand-Pille */
    .mi-body .help-tile button { background: var(--mi-paper); color: var(--mi-ink); border-radius: var(--mi-radius-card); padding: 1.1rem .6rem; }
    .mi-body .help-tile button:hover { background: var(--mi-paper); }
    .mi-top-tools .help-button { background: #fff; color: var(--mi-teal); border: 1.5px solid var(--mi-teal); }

    /* Buchhaltung angepasst: Kacheln ohne grünen Randstreifen (auch das negative Ergebnis), Titel und Hinweis der Ausgaben-Zeile getrennt, Tabellen mit Innenabstand am Rand */
    .mi-body .accounting-stat { border-width: 0; }
    .accounting-expense > summary > span:first-child { display: grid; gap: .2rem; }
    .accounting-expense > summary small { font-size: .8rem; }
    .mi-body .table-wrap th:first-child, .mi-body .table-wrap td:first-child { padding-left: .6rem; }
    .mi-body .table-wrap th:last-child, .mi-body .table-wrap td:last-child { padding-right: .6rem; }

    /* Sprachumschalter EN | SO in der Kopfzeile der angemeldeten Seiten: wie auf der Startseite, weißer Schalter */
    .mi-top-tools .ui-lang { align-self: center; }
    .mi-top-tools .ui-lang button { min-height: 0; padding: .3em .8em; font-size: .8rem; }
    .mi-mobile-system-actions .ui-lang-menu { justify-self: start; background: var(--mi-panel); }
    .mi-mobile-system-actions .ui-lang-menu button { color: var(--mi-muted); }
    .mi-mobile-system-actions .ui-lang-menu button.is-active { background: var(--mi-teal); color: #fff; }

    /* Kopfzeile: EN|SO, runder Hilfe-Knopf und Benutzer-Menü mit Initialen (Variante A) */
    .mi-top .mi-top-right { flex-wrap: nowrap; gap: .6rem; align-items: center; justify-content: flex-end; }
    .mi-help { display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 50%; background: #fff; color: var(--mi-ink); font-weight: 700; text-decoration: none; box-shadow: 0 1px 6px #14201a12; }
    .mi-help:hover { background: var(--mi-mint); color: var(--mi-teal); }
    .mi-usermenu { position: relative; }
    .mi-usermenu > summary { display: flex; align-items: center; gap: .55rem; padding: .2rem .85rem .2rem .2rem; border-radius: 999px; background: #fff; box-shadow: 0 1px 6px #14201a12; list-style: none; cursor: pointer; }
    .mi-usermenu > summary::-webkit-details-marker { display: none; }
    .mi-usermenu > summary:hover { background: var(--mi-mint); }
    .mi-usermenu .mi-avatar { order: 0; width: 2.2rem; height: 2.2rem; flex: 0 0 2.2rem; background: var(--mi-grad-green); color: #fff; font-size: .78rem; font-weight: 800; }
    .mi-user-text { display: grid; line-height: 1.2; }
    .mi-user-text b { color: var(--mi-ink); font-size: .82rem; }
    .mi-user-text small { color: var(--mi-muted); font-size: .72rem; }
    .mi-caret { color: var(--mi-muted); }
    .mi-user-pop { position: absolute; right: 0; top: calc(100% + .5rem); z-index: 40; display: grid; gap: .1rem; width: 15rem; padding: .5rem; border-radius: 1rem; background: #fff; box-shadow: 0 .75rem 2rem #14201a2e; }
    .mi-user-head { margin: 0; padding: .45rem .7rem .6rem; border-bottom: 1px solid var(--mi-line); }
    .mi-user-head b { display: block; color: var(--mi-ink); }
    .mi-user-head small { color: var(--mi-muted); }
    .mi-user-pop a, .mi-user-pop button { display: block; width: 100%; min-height: 0; padding: .55rem .7rem; border: 0; border-radius: .65rem; background: transparent; color: var(--mi-ink); font: inherit; font-weight: 600; text-align: left; text-decoration: none; cursor: pointer; }
    .mi-user-pop a:hover, .mi-user-pop button:hover { background: var(--mi-panel); }
    .mi-user-pop form { margin: .2rem 0 0; padding-top: .3rem; border-top: 1px solid var(--mi-line); }
    .mi-user-pop .mi-user-logout { color: var(--mi-danger); }
    @media (max-width: 860px) {
      .mi-top .mi-top-right { width: auto; }
      .mi-usermenu > summary { padding: .15rem; }
      .mi-user-text, .mi-caret { display: none; }
      .mi-user-pop { width: min(15rem, 86vw); }
    }
    .mi-user-pop button.mi-user-logout, .mi-user-pop button.mi-user-logout:hover { border: 0 !important; background: transparent !important; color: var(--mi-danger) !important; box-shadow: none; }
    .mi-user-pop button.mi-user-logout:hover { background: #fbeceb !important; }

    /* Support-Seite: Formular links schmaler, Liste rechts breiter (unter 1000 px untereinander) */
    .support-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); align-items: start; margin-top: 0; }
    .support-grid > :last-child { grid-column: auto; }
    @media (max-width: 1000px) { .support-grid { grid-template-columns: minmax(0, 1fr); } }

    /* Plattform-Admin: Häkchen steht direkt vor der Beschriftung (globale Feldbreite und Mindesthöhe gelten nicht für Häkchen) */
    .pa-check { justify-content: flex-start; }
    .pa-check input[type="checkbox"] { flex: 0 0 auto; width: 1.1rem; min-width: 0; height: 1.1rem; min-height: 0; margin: 0; padding: 0; accent-color: var(--mi-teal); }

    /* Hilfe-Seite: Kacheln über die ganze Seitenbreite, drei nebeneinander ab 900 px */
    .mi-body .help-page { max-width: none; }
    @media (min-width: 900px) { .mi-body .help-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
    }