:root {
      --bg: #f3f6f8;
      --panel: #fff;
      --soft: #f8fafb;
      --surface: #edf2f6;
      --text: #16212b;
      --muted: #667582;
      --line: #dae2e8;
      --blue: #1f6feb;
      --blue-soft: #eef5ff;
      --green: #0c8b64;
      --green-soft: #edf8f3;
      --red: #bf3d38;
      --red-soft: #fff1ef;
      --amber: #986018;
      --amber-soft: #fff6e7;
      --status-ok: #0c8b64;
      --status-warn: #986018;
      --status-error: #bf3d38;
      --status-idle: #667582;
      --focus-ring: 0 0 0 3px color-mix(in srgb, var(--blue) 24%, transparent);
      --radius-sm: 6px;
      --radius-md: 8px;
      --radius-lg: 12px;
      --ease-standard: cubic-bezier(.2, 0, 0, 1);
      --shadow: 0 10px 28px rgba(22, 33, 43, .06);
      --shadow-strong: 0 16px 44px rgba(22, 33, 43, .10);
      --panel-accent: #f7fbff;
      --logo-bg: #111820;
      --logo-text: #ffffff;
      --glass-bg: color-mix(in srgb, var(--panel) 76%, transparent);
      --glass-strong: color-mix(in srgb, var(--panel) 88%, transparent);
      --glass-line: color-mix(in srgb, var(--line) 72%, transparent);
      --glass-highlight: color-mix(in srgb, #ffffff 50%, transparent);
      --glass-shadow: 0 18px 48px color-mix(in srgb, var(--text) 13%, transparent);
      --glass-blur: 18px;
      --glass-saturate: 1.45;
      --safe-top: env(safe-area-inset-top, 0px);
      --safe-right: env(safe-area-inset-right, 0px);
      --safe-bottom: env(safe-area-inset-bottom, 0px);
      --safe-left: env(safe-area-inset-left, 0px);
      font-family: "Segoe UI", "Noto Sans TC", system-ui, sans-serif;
    }
    body[data-theme="dark"] {
      --bg: #0f1520;
      --panel: #121c2a;
      --soft: #1a2737;
      --surface: #0b111a;
      --text: #dce7f2;
      --muted: #9ab0c7;
      --line: #2b3a4f;
      --blue: #63a4ff;
      --blue-soft: rgba(99, 164, 255, .16);
      --green: #5fd0a8;
      --green-soft: rgba(95, 208, 168, .16);
      --red: #f18a83;
      --red-soft: rgba(241, 138, 131, .16);
      --amber: #f2c978;
      --amber-soft: rgba(242, 201, 120, .16);
      --status-ok: #5fd0a8;
      --status-warn: #f2c978;
      --status-error: #f18a83;
      --status-idle: #9ab0c7;
      --shadow: 0 14px 30px rgba(0, 0, 0, .28);
      --shadow-strong: 0 18px 48px rgba(0, 0, 0, .38);
      --panel-accent: #16263a;
      --logo-bg: #e8eef7;
      --logo-text: #111820;
      --glass-bg: color-mix(in srgb, #192638 72%, transparent);
      --glass-strong: color-mix(in srgb, #182436 86%, transparent);
      --glass-line: color-mix(in srgb, #86a4c8 24%, transparent);
      --glass-highlight: color-mix(in srgb, #dce7f2 16%, transparent);
      --glass-shadow: 0 22px 58px rgba(0, 0, 0, .42);
    }
    * { box-sizing: border-box; }
    html { background: #edf2f6; }
    html[data-theme="dark"] { background: #0b111a; }
    html[data-theme="light"] { background: #edf2f6; }
    body { margin: 0; background: linear-gradient(180deg, var(--surface) 0, var(--bg) 280px, var(--bg) 100%); color: var(--text); min-height: 100vh; transition: background .18s var(--ease-standard), color .18s var(--ease-standard); color-scheme: light dark; accent-color: var(--blue); }
    html[data-visual-style="liquid"][data-theme="light"] { background: #eaf1f7; }
    html[data-visual-style="liquid"][data-theme="dark"] { background: #0b111a; }
    body[data-visual-style="liquid"] {
      --radius-sm: 10px;
      --radius-md: 16px;
      --radius-lg: 24px;
      --focus-ring: 0 0 0 4px color-mix(in srgb, var(--blue) 28%, transparent);
      background:
        radial-gradient(circle at 14% 0%, color-mix(in srgb, var(--blue) 18%, transparent), transparent 34vw),
        radial-gradient(circle at 88% 10%, color-mix(in srgb, var(--green) 14%, transparent), transparent 32vw),
        linear-gradient(180deg, color-mix(in srgb, var(--surface) 84%, var(--panel) 16%) 0, var(--bg) 340px, var(--bg) 100%);
    }
    @supports (backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px)) {
      body[data-visual-style="liquid"] header,
      body[data-visual-style="liquid"] .panel,
      body[data-visual-style="liquid"] .nav-tabs,
      body[data-visual-style="liquid"] .toolbar,
      body[data-visual-style="liquid"] .app-update-notice,
      body[data-visual-style="liquid"] .quick-more-menu,
      body[data-visual-style="liquid"] .header-more-menu,
      body[data-visual-style="liquid"] .quick-nav-menu,
      body[data-visual-style="liquid"] .toast,
      body[data-visual-style="liquid"] .wizard-modal-card,
      body[data-visual-style="liquid"] .pickup-mode-card,
      body[data-visual-style="liquid"] .push-prompt-card,
      body[data-visual-style="liquid"] .week-plan-secondary,
      body[data-visual-style="liquid"] .image-modal-close {
        background: var(--glass-bg);
        border-color: var(--glass-line);
        box-shadow: var(--glass-shadow);
        -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
        backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
      }
      body[data-visual-style="liquid"] header,
      body[data-visual-style="liquid"] .nav-tabs {
        background: var(--glass-strong);
      }
    }
    body[data-visual-style="liquid"] .panel:not(.nav-tabs),
    body[data-visual-style="liquid"] .quick-entry-card,
    body[data-visual-style="liquid"] .metric,
    body[data-visual-style="liquid"] .order-card,
    body[data-visual-style="liquid"] .meal-card,
    body[data-visual-style="liquid"] .insight-card {
      border-color: var(--glass-line);
      box-shadow: var(--glass-shadow);
    }
    body[data-visual-style="liquid"] .panel:not(.nav-tabs),
    body[data-visual-style="liquid"] .quick-entry-card,
    body[data-visual-style="liquid"] .metric,
    body[data-visual-style="liquid"] .order-card,
    body[data-visual-style="liquid"] .meal-card,
    body[data-visual-style="liquid"] .insight-card,
    body[data-visual-style="liquid"] .week-plan-secondary {
      isolation: isolate;
      position: relative;
    }
    body[data-visual-style="liquid"] .panel::before,
    body[data-visual-style="liquid"] .quick-entry-card::before,
    body[data-visual-style="liquid"] .metric::before,
    body[data-visual-style="liquid"] .order-card::before,
    body[data-visual-style="liquid"] .meal-card::before,
    body[data-visual-style="liquid"] .insight-card::before,
    body[data-visual-style="liquid"] .week-plan-secondary::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      border-radius: inherit;
      background: linear-gradient(135deg, var(--glass-highlight), transparent 42%);
      opacity: .7;
    }
    body[data-visual-style="liquid"] .head,
    body[data-visual-style="liquid"] .week-plan-toolbar,
    body[data-visual-style="liquid"] .week-plan-secondary-head,
    body[data-visual-style="liquid"] .week-plan-secondary-toolbar,
    body[data-visual-style="liquid"] .pickup-mode-head,
    body[data-visual-style="liquid"] .pickup-mode-foot {
      background: color-mix(in srgb, var(--glass-strong) 84%, transparent);
      border-color: var(--glass-line);
    }
    body[data-visual-style="liquid"] .btn:not(.primary):not(.success):not(.danger),
    body[data-visual-style="liquid"] select,
    body[data-visual-style="liquid"] input,
    body[data-visual-style="liquid"] textarea,
    body[data-visual-style="liquid"] .state,
    body[data-visual-style="liquid"] .tag {
      background: color-mix(in srgb, var(--panel) 64%, transparent);
      border-color: var(--glass-line);
    }
    body[data-visual-style="liquid"] .btn,
    body[data-visual-style="liquid"] select,
    body[data-visual-style="liquid"] input,
    body[data-visual-style="liquid"] textarea {
      border-radius: 14px;
    }
    body[data-visual-style="liquid"] .btn:hover {
      transform: translateY(-1px);
      border-color: color-mix(in srgb, var(--blue) 36%, var(--glass-line));
      box-shadow: 0 12px 28px color-mix(in srgb, var(--text) 10%, transparent);
    }
    body[data-visual-style="liquid"] .btn:active {
      transform: scale(.985);
    }
    body[data-visual-style="liquid"] .btn.primary,
    body[data-visual-style="liquid"] .btn.success {
      box-shadow: 0 14px 30px color-mix(in srgb, currentColor 18%, transparent), var(--glass-shadow);
    }
    body[data-visual-style="liquid"] .tab-btn,
    body[data-visual-style="liquid"] .week-plan-layout-btn,
    body[data-visual-style="liquid"] .week-plan-filter-btn {
      border-radius: 999px;
    }
    body[data-visual-style="liquid"] .tab-btn.active,
    body[data-visual-style="liquid"] .week-plan-layout-btn.active,
    body[data-visual-style="liquid"] .week-plan-filter-btn.active {
      background: color-mix(in srgb, var(--text) 12%, var(--panel) 68%);
      box-shadow: inset 0 1px 0 var(--glass-highlight), 0 10px 24px color-mix(in srgb, var(--text) 10%, transparent);
    }
    body[data-visual-style="liquid"] header {
      border-bottom-color: transparent;
      box-shadow: 0 12px 34px color-mix(in srgb, var(--text) 10%, transparent);
    }
    body[data-visual-style="liquid"] .toolbar,
    body[data-visual-style="liquid"] .nav-tabs {
      border-radius: 20px;
    }
    body[data-visual-style="liquid"] .logo {
      border-radius: 13px;
      box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 40%, transparent), 0 10px 24px color-mix(in srgb, var(--text) 12%, transparent);
    }
    body[data-visual-style="liquid"] .quick-nav > summary {
      box-shadow: 0 18px 42px color-mix(in srgb, var(--text) 18%, transparent);
      -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
      backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
    }
    body[data-visual-style="liquid"] .quick-nav-menu,
    body[data-visual-style="liquid"] .header-more-menu,
    body[data-visual-style="liquid"] .quick-more-menu,
    body[data-visual-style="liquid"] .week-plan-more-menu {
      border-radius: 18px;
      padding: 8px;
    }
    body[data-visual-style="liquid"] .mobile-sync-strip,
    body[data-visual-style="liquid"] .week-plan-cycle-pill,
    body[data-visual-style="liquid"] .week-plan-dirty,
    body[data-visual-style="liquid"] .ops-chip,
    body[data-visual-style="liquid"] .pickup-mode-chip {
      border-radius: 999px;
      background: color-mix(in srgb, var(--panel) 58%, transparent);
      border-color: var(--glass-line);
    }
    body[data-visual-style="liquid"] .pickup-mode.high-contrast .pickup-mode-card,
    body[data-visual-style="liquid"] .quick-qr-image,
    body[data-visual-style="liquid"] .pickup-mode-body img,
    body[data-visual-style="liquid"] .table,
    body[data-visual-style="liquid"] .week-plan-calendar-cell .week-plan-meal-card,
    body[data-visual-style="liquid"] .week-plan-day-card,
    body[data-visual-style="liquid"] .week-plan-meal-card {
      -webkit-backdrop-filter: none;
      backdrop-filter: none;
    }
    @media (prefers-reduced-transparency: reduce) {
      body[data-visual-style="liquid"] {
        --glass-bg: var(--panel);
        --glass-strong: var(--panel);
        --glass-line: var(--line);
        --glass-shadow: var(--shadow);
      }
      body[data-visual-style="liquid"] .panel::before,
      body[data-visual-style="liquid"] .quick-entry-card::before,
      body[data-visual-style="liquid"] .metric::before,
      body[data-visual-style="liquid"] .order-card::before,
      body[data-visual-style="liquid"] .meal-card::before,
      body[data-visual-style="liquid"] .insight-card::before,
      body[data-visual-style="liquid"] .week-plan-secondary::before {
        display: none;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      body[data-visual-style="liquid"] .btn:hover,
      body[data-visual-style="liquid"] .btn:active {
        transform: none;
      }
    }
    @media (pointer: coarse) {
      body[data-visual-style="liquid"] .btn,
      body[data-visual-style="liquid"] .btn.small,
      body[data-visual-style="liquid"] .tab-btn,
      body[data-visual-style="liquid"] summary.btn,
      body[data-visual-style="liquid"] select,
      body[data-visual-style="liquid"] input[type="date"],
      body[data-visual-style="liquid"] input[type="text"],
      body[data-visual-style="liquid"] input[type="password"] {
        min-height: 44px;
      }
      body[data-visual-style="liquid"] .quick-nav > summary {
        width: 58px;
        height: 58px;
      }
      body[data-visual-style="liquid"] .quick-nav-menu .btn,
      body[data-visual-style="liquid"] .header-more-menu .btn {
        justify-content: flex-start;
      }
    }
    button, input, select { font: inherit; }
    button { cursor: pointer; }
    button:disabled, select:disabled, input:disabled { cursor: not-allowed; opacity: .62; }
    button:focus-visible,
    select:focus-visible,
    input:focus-visible,
    textarea:focus-visible,
    summary:focus-visible,
    a:focus-visible {
      outline: none;
      box-shadow: var(--focus-ring);
    }
    .app { min-height: 100vh; display: grid; grid-template-rows: auto 1fr; }
    header {
      background: color-mix(in srgb, var(--panel) 92%, transparent); border-bottom: 1px solid var(--line); padding: calc(12px + env(safe-area-inset-top)) 20px 12px;
      display: flex; justify-content: space-between; align-items: center; gap: 16px; position: sticky; top: 0; z-index: 5;
      backdrop-filter: blur(12px);
    }
    .brand {
      display: flex;
      gap: 12px;
      align-items: center;
      min-width: 0;
      border: 0;
      background: transparent;
      color: inherit;
      padding: 0;
      text-align: left;
      cursor: pointer;
    }
    .brand:hover .logo,
    .brand:focus-visible .logo {
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 22%, transparent);
    }
    .logo { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--logo-bg); color: var(--logo-text); font-weight: 800; letter-spacing: -.01em; transition: background .18s var(--ease-standard), color .18s var(--ease-standard), box-shadow .18s var(--ease-standard); }
    .logo .icon { width: 22px; height: 22px; stroke-width: 2.3; }
    .header-actions { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; justify-content: flex-end; position: relative; min-width: 0; }
    .header-live-summary {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-width: 0;
      flex: 1 1 auto;
      color: var(--muted);
      font-size: 12px;
    }
    .header-meal-summary {
      min-width: 0;
      max-width: min(48vw, 520px);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      font-weight: 700;
      color: var(--text);
    }
    .header-push-chip {
      flex: 0 0 auto;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 3px 8px;
      line-height: 1.1;
      background: var(--soft);
      color: var(--muted);
      font-weight: 700;
      white-space: nowrap;
    }
    .header-push-chip.ok { background: var(--green-soft); color: var(--green); border-color: color-mix(in srgb, var(--green) 28%, var(--line)); }
    .header-push-chip.warn { background: var(--amber-soft); color: var(--amber); border-color: color-mix(in srgb, var(--amber) 28%, var(--line)); }
    .header-more { position: relative; flex: 0 0 auto; }
    .header-more > summary {
      list-style: none;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .header-more > summary::-webkit-details-marker { display: none; }
    .header-more-menu {
      position: absolute;
      top: calc(100% + 8px);
      right: 0;
      z-index: 30;
      min-width: 250px;
      max-width: min(360px, calc(100vw - 32px));
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--panel);
      box-shadow: var(--shadow-strong);
      display: grid;
      gap: 8px;
      align-items: stretch;
      justify-content: stretch;
    }
    .header-more-menu .btn,
    .header-more-menu .font-controls { width: 100%; }
    .header-more-menu .font-controls .btn { flex: 1 1 0; }
    .font-controls { display: inline-flex; gap: 6px; }
    .theme-toggle { min-width: 94px; }
    h1 { margin: 0; font-size: 19px; letter-spacing: 0; }
    .title-short { display: none; }
    .sub { color: var(--muted); font-size: 13px; margin-top: 2px; }
    .user-hint {
      margin-top: 6px;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      color: var(--muted);
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 3px 8px;
      background: var(--soft);
      width: fit-content;
    }
    .user-hint .dot { width: 8px; height: 8px; border-radius: 999px; background: var(--muted); }
    .user-hint.ok { color: var(--green); border-color: #b9e0d0; background: var(--green-soft); }
    .user-hint.ok .dot { background: var(--green); }
    .user-hint.warn { color: var(--amber); border-color: #efd39d; background: var(--amber-soft); }
    .user-hint.warn .dot { background: var(--amber); }
    .user-hint.err { color: var(--red); border-color: #efc1bc; background: var(--red-soft); }
    .user-hint.err .dot { background: var(--red); }
    .state { border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; min-width: 118px; text-align: center; background: var(--soft); color: var(--muted); font-size: 13px; overflow-wrap: anywhere; display: inline-flex; align-items: center; justify-content: center; line-height: 1.15; }
    .state.running { background: var(--blue-soft); color: var(--blue); border-color: #bbd3fb; }
    .state.ok { background: var(--green-soft); color: var(--green); border-color: #b9e0d0; }
    .state.error { background: var(--red-soft); color: var(--red); border-color: #efc1bc; }
    .app-update-notice {
      display: none;
      position: static;
      justify-self: end;
      z-index: 80;
      width: min(300px, calc(100% - 48px));
      margin: 8px 24px -10px;
      border: 1px solid var(--amber);
      border-radius: var(--radius-md);
      background: var(--amber-soft);
      color: var(--amber);
      padding: 6px 8px;
      gap: 6px;
      align-items: center;
      justify-content: space-between;
      font-size: 12px;
      font-weight: 650;
      box-shadow: var(--shadow-strong);
    }
    .app-update-notice.show { display: flex; }
    .app-update-notice > span:first-child {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .app-update-notice .notice-actions { display: inline-flex; gap: 6px; flex: 0 0 auto; }
    .app-update-notice .btn.small {
      min-height: 28px;
      padding: 0 8px;
      font-size: 12px;
    }
    .app-update-notice .btn.small .icon {
      width: 14px;
      height: 14px;
    }
    .auth-recovery-notice {
      display: none;
      width: min(1480px, calc(100% - 40px));
      margin: 12px auto 0;
      padding: 12px 14px;
      border: 1px solid var(--amber);
      border-radius: var(--radius-md);
      background: var(--amber-soft);
      color: var(--text);
      box-shadow: var(--shadow);
      align-items: center;
      justify-content: space-between;
      gap: 14px;
    }
    .auth-recovery-notice.show { display: flex; }
    .auth-recovery-notice[hidden] { display: none !important; }
    .auth-recovery-copy {
      min-width: 0;
      display: grid;
      gap: 3px;
    }
    .auth-recovery-copy strong { color: var(--amber); }
    .auth-recovery-copy span {
      color: var(--muted);
      font-size: 13px;
      overflow-wrap: anywhere;
    }
    .auth-recovery-actions {
      display: inline-flex;
      flex: 0 0 auto;
      gap: 8px;
    }
    main { width: min(1480px, 100%); margin: 0 auto; padding: 16px 20px 24px; display: grid; gap: 14px; }
    .panel { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius-md); box-shadow: var(--shadow); min-width: 0; }
    .toolbar {
      display: grid;
      grid-template-columns: minmax(260px, 1.05fr) minmax(172px, .62fr) minmax(390px, 1.1fr) minmax(285px, .86fr);
      grid-template-areas:
        "user date actions refresh";
      gap: 12px;
      align-items: end;
      padding: 14px;
      background:
        linear-gradient(180deg, color-mix(in srgb, var(--panel-accent) 45%, var(--panel)) 0%, var(--panel) 100%);
      box-shadow: var(--shadow-strong);
    }
    .toolbar-user { grid-area: user; }
    .toolbar-date { grid-area: date; }
    .primary-field { min-width: 0; }
    .toolbar-actions { grid-area: actions; }
    .toolbar-refresh { grid-area: refresh; }
    .primary-field label { font-size: 13px; font-weight: 700; color: var(--text); }
    .primary-field select, .primary-field input[type="date"] { height: 48px; font-size: 16px; font-weight: 650; padding: 0 13px; border-radius: 8px; }
    .refresh-group { display: grid; gap: 7px; justify-items: end; align-content: end; min-width: 0; }
    .refresh-controls { display: grid; grid-template-columns: auto 78px 128px; align-items: center; justify-content: end; gap: 8px; }
    .refresh-controls .check { white-space: nowrap; }
    #refreshAll { width: 100%; min-width: 0; flex: 0 0 auto; }
    .mini-select { height: 31px; border: 1px solid var(--line); border-radius: 6px; padding: 0 8px; background: var(--panel); color: var(--text); min-width: 74px; }
    .mini-note { color: var(--muted); font-size: 12px; text-align: right; overflow-wrap: anywhere; }
    .push-event-list { display: grid; gap: 6px; max-height: 180px; overflow: auto; }
    .push-event-item {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      gap: 8px;
      align-items: center;
      padding: 7px 9px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--muted);
      font-size: 12px;
      min-width: 0;
    }
    .push-event-main { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .push-event-time { color: var(--faint); white-space: nowrap; }
    .push-test-result {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: color-mix(in srgb, var(--soft) 74%, var(--panel));
      padding: 10px;
      display: grid;
      gap: 7px;
      font-size: 12.5px;
      line-height: 1.45;
      overflow-wrap: anywhere;
    }
    .push-test-result strong {
      color: var(--text);
    }
    .push-test-result .push-test-preview {
      padding: 8px 9px;
      border-radius: 7px;
      background: var(--panel);
      border: 1px solid color-mix(in srgb, var(--line) 76%, transparent);
    }
    .push-test-result.ok { border-color: #b9e0d0; background: var(--green-soft); color: var(--green); }
    .push-test-result.warn { border-color: #efd39d; background: var(--amber-soft); color: var(--amber); }
    .push-test-result.error { border-color: #efc1bc; background: var(--red-soft); color: var(--red); }
    .mobile-sync-strip { display: none; }
    .nav-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; position: sticky; top: 70px; z-index: 4; background: color-mix(in srgb, var(--panel) 86%, transparent); backdrop-filter: blur(10px); box-shadow: none; }
    .tab-btn { height: 34px; border-radius: 999px; border: 1px solid transparent; background: transparent; color: var(--muted); padding: 0 13px; font-weight: 650; display: inline-flex; align-items: center; gap: 7px; }
    .tab-btn:hover { background: var(--soft); color: var(--text); border-color: var(--line); }
    .tab-btn.active { background: var(--text); color: var(--panel); border-color: var(--text); box-shadow: 0 8px 18px rgba(22, 33, 43, .12); }
    .tab-btn.secondary { opacity: .78; }
    .tab-btn.secondary:hover { opacity: 1; }
    .tab-panel { display: none; gap: 16px; }
    .tab-panel.active { display: grid; }
    body:not([data-admin-visible="1"]) .admin-only { display: none !important; }
    .admin-banner {
      border: 1px dashed var(--line);
      border-radius: var(--radius-md);
      padding: 10px 12px;
      background: var(--soft);
      color: var(--muted);
      font-size: 13px;
      display: grid;
      gap: 8px;
    }
    .admin-auth-grid { display: grid; grid-template-columns: minmax(260px, 1fr) auto; gap: 10px; align-items: end; }
    .admin-summary-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 12px 14px; }
    .admin-summary-grid.secondary { grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 0; }
    .failover-control-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 12px; padding: 14px; }
    .failover-status-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: color-mix(in srgb, var(--panel-2) 72%, transparent);
      padding: 14px;
      display: grid;
      gap: 10px;
      min-width: 0;
    }
    .failover-status-card .headline { font-size: 20px; font-weight: 900; }
    .failover-status-card .meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .failover-status-card code { word-break: break-all; white-space: normal; }
    .failover-task-list { display: grid; gap: 6px; }
    .failover-task-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 8px;
      align-items: center;
      border: 1px solid var(--line);
      border-radius: 8px;
      padding: 8px 10px;
      background: var(--panel);
    }
    .admin-failure-list { display: grid; gap: 8px; padding: 12px 14px; max-height: 260px; overflow: auto; }
    .admin-failure-item {
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      padding: 9px 10px;
      background: var(--surface);
      font-size: 12px;
      line-height: 1.45;
    }
    .admin-actions { padding: 12px 14px; display: flex; gap: 8px; flex-wrap: wrap; }
    .automation {
      display: grid; grid-template-columns: 1.2fr .8fr; gap: 16px; align-items: stretch;
    }
    .hero {
      padding: 18px; display: grid; gap: 16px; min-height: 172px;
      background: linear-gradient(135deg, var(--panel) 0%, var(--panel-accent) 100%);
    }
    .hero-top { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
    .hero h2 { margin: 0; font-size: 22px; letter-spacing: 0; }
    .hero p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
    .window-state {
      border-radius: 999px; padding: 6px 10px; border: 1px solid var(--line);
      background: var(--soft); color: var(--muted); font-size: 12px; font-weight: 700;
    }
    .window-state.open { color: var(--green); background: var(--green-soft); border-color: #b9e0d0; }
    .window-state.waiting { color: var(--amber); background: var(--amber-soft); border-color: #efd39d; }
    .window-state.closed { color: var(--red); background: var(--red-soft); border-color: #efc1bc; }
    .timeline {
      display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px;
    }
    .time-card {
      border: 1px solid var(--line); border-radius: 8px; background: var(--soft);
      padding: 12px; min-height: 72px;
    }
    .time-card .k { color: var(--muted); font-size: 12px; margin-bottom: 7px; }
    .time-card .v { font-size: 17px; font-weight: 750; }
    .task-panel { padding: 14px; display: grid; gap: 10px; }
    .task-card {
      border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 12px;
      display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center;
    }
    .task-card:hover, .metric:hover, .insight-card:hover, .order-card:hover, .meal-card:hover, .quick-entry-card:hover { border-color: color-mix(in srgb, var(--blue) 35%, var(--line)); }
    .task-title { font-weight: 700; }
    .task-sub { color: var(--muted); font-size: 12px; margin-top: 3px; }
    .task-dot { width: 12px; height: 12px; border-radius: 99px; background: var(--red); }
    .task-dot.on { background: var(--green); }
    .readiness { display: grid; grid-template-columns: .8fr 1.2fr; gap: 16px; align-items: start; }
    .dashboard-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
    .dashboard-mission-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
    .dashboard-more-status-body {
      padding: 12px 14px 14px;
      display: grid;
      gap: 10px;
    }
    .dashboard-more-status-body > .panel,
    .dashboard-more-status-body > details.panel {
      margin: 0;
    }
    .dashboard-more-status-body > details.panel {
      box-shadow: none;
      background: color-mix(in srgb, var(--panel) 78%, var(--soft));
    }
    @media (min-width: 761px) {
      #tab-dashboard.active {
        grid-template-columns: minmax(0, 1fr) minmax(320px, 0.42fr);
        align-items: start;
        gap: 14px;
      }
      #tab-dashboard.active > * {
        grid-column: 1 / -1;
      }
      #tab-dashboard.active > #todayOrderPanel {
        grid-column: 1;
        grid-row: 1;
      }
      #tab-dashboard.active > #quickEntryPanel {
        grid-column: 2;
        grid-row: 1;
      }
      #tab-dashboard.active > #dashboardMissionGrid {
        grid-column: 1 / -1;
        grid-row: 2;
      }
      #tab-dashboard.active > #dashboardMoreStatusPanel {
        grid-column: 1 / -1;
      }
      #quickEntryPanel .quick-entry {
        grid-template-columns: 1fr;
        padding: 8px 10px 10px;
      }
      #quickEntryPanel .head {
        padding: 8px 10px;
      }
      #quickMealCard {
        display: none;
      }
      #quickQrCard {
        min-height: 0;
      }
      #quickQrCard .quick-entry-head {
        align-items: flex-start;
        flex-wrap: wrap;
        gap: 6px;
      }
      #quickQrCard .quick-qr-tools {
        justify-content: flex-start;
        gap: 6px;
      }
      #quickQrCard .quick-qr-wrap {
        min-height: 116px;
        padding: 6px;
      }
      #quickQrCard .quick-qr-wrap img {
        width: 136px;
        height: 136px;
      }
      #dashboardMissionGrid {
        grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr);
        gap: 8px;
      }
      #dashboardMissionGrid .insight-card {
        min-height: 0;
        padding: 9px 10px;
        box-shadow: none;
        gap: 5px;
      }
      #dashboardMissionGrid .insight-card .v {
        font-size: 16px;
      }
    }
    .quick-entry {
      padding: 12px 14px 14px;
      display: grid;
      grid-template-columns: minmax(260px, 0.8fr) minmax(340px, 1.2fr);
      gap: 12px;
      align-items: stretch;
    }
    .quick-entry-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 12px;
      display: grid;
      gap: 8px;
      min-height: 170px;
    }
    .quick-entry-card.task-primary {
      background: linear-gradient(180deg, color-mix(in srgb, var(--panel-accent) 44%, var(--soft)) 0%, var(--soft) 100%);
      border-color: color-mix(in srgb, var(--blue) 18%, var(--line));
    }
    .quick-entry-card.loading,
    .today-order-summary.loading,
    .week-plan-grid.loading,
    .run-status-card.loading {
      position: relative;
      overflow: hidden;
    }
    .quick-entry-card.loading::after,
    .today-order-summary.loading::after,
    .week-plan-grid.loading::after,
    .run-status-card.loading::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--panel) 58%, transparent), transparent);
      transform: translateX(-100%);
      animation: shimmer 1.1s ease-in-out infinite;
      pointer-events: none;
    }
    @keyframes shimmer {
      to { transform: translateX(100%); }
    }
    .quick-qr-tools {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      justify-content: flex-end;
    }
    .quick-entry-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    .quick-entry-title { font-size: 14px; font-weight: 750; }
    .quick-qr-wrap {
      display: grid;
      place-items: center;
      min-height: 108px;
      padding: 10px;
    }
    .quick-qr-wrap img {
      width: 132px;
      height: 132px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 6px;
      transition: filter .2s ease, background .2s ease, border-color .2s ease;
    }
    .quick-qr-wrap img.high-contrast {
      filter: contrast(1.45) brightness(1.05);
      border-color: #fff;
      background: #fff;
    }
    .pickup-mode {
      position: fixed;
      inset: 0;
      z-index: 90;
      display: none;
      background:
        radial-gradient(circle at 50% 0%, rgba(96,165,250,.18), transparent 42%),
        #06111f;
      color: #f8fbff;
      padding:
        calc(14px + env(safe-area-inset-top))
        calc(14px + env(safe-area-inset-right))
        calc(18px + env(safe-area-inset-bottom))
        calc(14px + env(safe-area-inset-left));
    }
    .pickup-mode.show { display: grid; }
    .pickup-mode.high-contrast { background: #000; color: #fff; }
    .pickup-mode-card {
      min-height: 100%;
      display: grid;
      grid-template-rows: auto 1fr auto;
      gap: 14px;
      align-items: stretch;
    }
    .pickup-mode-head,
    .pickup-mode-foot {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      min-width: 0;
    }
    .pickup-mode-title { min-width: 0; }
    .pickup-mode-title strong {
      display: block;
      font-size: clamp(20px, 4vw, 30px);
      line-height: 1.2;
    }
    .pickup-mode-title span {
      display: block;
      margin-top: 4px;
      color: rgba(248,251,255,.72);
      font-size: 13px;
      overflow-wrap: anywhere;
    }
    .pickup-mode-body {
      border: 1px solid rgba(255,255,255,.16);
      border-radius: 18px;
      background: rgba(255,255,255,.06);
      display: grid;
      place-items: center;
      padding: clamp(16px, 4vw, 36px);
      overflow: hidden;
    }
    .pickup-mode-body img {
      width: min(78vw, 62vh, 520px);
      height: min(78vw, 62vh, 520px);
      object-fit: contain;
      border-radius: 16px;
      background: #fff;
      padding: clamp(10px, 2vw, 18px);
      box-shadow: 0 20px 60px rgba(0,0,0,.42);
    }
    .pickup-mode.high-contrast .pickup-mode-body {
      background: #000;
      border-color: rgba(255,255,255,.4);
    }
    .pickup-mode-empty {
      width: min(520px, 100%);
      border: 1px dashed rgba(255,255,255,.34);
      border-radius: 16px;
      padding: 24px;
      text-align: center;
      color: rgba(248,251,255,.8);
      font-weight: 700;
      line-height: 1.6;
    }
    .pickup-mode-meta {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      min-width: 0;
    }
    .pickup-mode-chip {
      border: 1px solid rgba(255,255,255,.22);
      background: rgba(255,255,255,.08);
      color: #f8fbff;
      border-radius: 999px;
      padding: 6px 10px;
      font-size: 13px;
      font-weight: 750;
      overflow-wrap: anywhere;
    }
    .pickup-mode .btn {
      color: #f8fbff;
      background: rgba(255,255,255,.08);
      border-color: rgba(255,255,255,.28);
    }
    .pickup-mode .btn.primary {
      background: #fff;
      color: #06111f;
      border-color: #fff;
    }
    .quick-meal-main {
      font-size: 19px;
      font-weight: 800;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .quick-meal-sub {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.4;
    }
    .run-status-card {
      padding: 12px 14px 14px;
      border-top: 1px solid var(--line);
      display: grid;
      gap: 10px;
    }
    .run-status-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }
    .run-status-meta {
      display: grid;
      gap: 6px;
      color: var(--muted);
      font-size: 12px;
    }
    .run-status-breakdown {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }
    .final-summary-row {
      padding: 12px 14px;
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      gap: 10px;
      border-bottom: 1px solid var(--line);
    }
    .final-user-list { padding: 10px 14px 14px; display: grid; gap: 10px; }
    .final-user-item { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); overflow: hidden; }
    .final-user-head {
      width: 100%;
      border: 0;
      background: transparent;
      color: inherit;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
      padding: 10px 12px;
      cursor: pointer;
      text-align: left;
      font: inherit;
    }
    .final-user-head:hover { background: var(--panel-accent); }
    .final-user-detail { padding: 0 12px 12px; display: grid; gap: 8px; }
    .final-meal-row {
      display: grid;
      grid-template-columns: 72px 1fr auto auto auto;
      gap: 8px;
      align-items: center;
      border: 1px solid var(--line);
      border-radius: 8px;
      padding: 8px;
      background: var(--surface);
    }
    .rank-badge { font-size: 12px; color: var(--muted); }
    .final-rule-note { padding: 0 14px 12px; color: var(--muted); font-size: 12px; }
    .gateway-overview {
      padding: 12px 14px;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }
    .gateway-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 12px;
      display: grid;
      gap: 8px;
      min-height: 120px;
    }
    .gateway-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
    }
    .gateway-name { font-size: 13px; font-weight: 700; }
    .gateway-status {
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 2px 8px;
      font-size: 12px;
      font-weight: 700;
      color: var(--muted);
      background: var(--panel);
    }
    .gateway-status.online { color: var(--green); border-color: #b9e0d0; background: var(--green-soft); }
    .gateway-status.offline { color: var(--red); border-color: #efc1bc; background: var(--red-soft); }
    .gateway-status.unknown { color: var(--amber); border-color: #efd39d; background: var(--amber-soft); }
    .gateway-url {
      font-size: 12px;
      color: var(--text);
      overflow-wrap: anywhere;
      line-height: 1.45;
      min-height: 38px;
    }
    .gateway-actions { display: flex; gap: 8px; flex-wrap: wrap; }
    .gateway-toolbar {
      padding: 0 14px 12px;
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
    }
    .gateway-token {
      font-size: 12px;
      color: var(--muted);
      overflow-wrap: anywhere;
    }
    .insight-card { border: 1px solid var(--line); border-left: 4px solid var(--blue); border-radius: 8px; background: var(--panel); padding: 14px; display: grid; gap: 8px; min-height: 112px; box-shadow: var(--shadow); }
    .insight-card:nth-child(2) { border-left-color: var(--green); }
    .insight-card:nth-child(3) { border-left-color: var(--amber); }
    .insight-card:nth-child(4) { border-left-color: var(--text); }
    .insight-card .k { color: var(--muted); font-size: 12px; font-weight: 700; display: flex; align-items: center; gap: 6px; }
    .insight-card .v { font-size: 19px; font-weight: 800; line-height: 1.25; overflow-wrap: anywhere; }
    .insight-card .sub { margin: 0; line-height: 1.4; }
    .score { padding: 16px; display: grid; gap: 12px; }
    .score-ring { width: 104px; height: 104px; border-radius: 999px; border: 10px solid var(--green); display: grid; place-items: center; font-size: 22px; font-weight: 800; background: var(--panel); }
    .score-ring.warn { border-color: var(--amber); color: var(--amber); }
    .score-ring.error { border-color: var(--red); color: var(--red); }
    .user-status-grid { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
    .user-card { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 12px; display: grid; gap: 9px; }
    .user-card.ok { border-color: #b9e0d0; background: var(--green-soft); }
    .user-card.warn { border-color: #efd39d; background: var(--amber-soft); }
    .user-card.error { border-color: #efc1bc; background: var(--red-soft); }
    .plan-list { display: grid; gap: 6px; }
    .plan-row { display: grid; grid-template-columns: 48px 1fr auto; gap: 8px; align-items: center; font-size: 12px; }
    .form-grid { padding: 12px 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .form-grid > *,
    .pref-widget,
    .pref-col,
    .pause-status-card,
    .pause-status-body,
    .pause-status-preview,
    .pause-status-foot,
    .push-test-result {
      min-width: 0;
    }
    input,
    select,
    textarea {
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }
    .form-grid textarea,
    .form-grid select,
    .form-grid input[type="text"],
    .form-grid input[type="password"],
    .form-grid input[type="number"],
    .form-grid input[type="date"],
    .form-grid input[type="time"],
    .form-grid input[type="url"],
    .form-grid input[type="email"] {
      width: 100%;
      max-width: 100%;
      min-width: 0;
      min-height: 38px;
      border: 1px solid var(--line);
      border-radius: 6px;
      background: var(--panel);
      color: var(--text);
      padding: 8px 10px;
      outline: none;
      resize: vertical;
      transition: border-color .14s var(--ease-standard), box-shadow .14s var(--ease-standard), background .14s var(--ease-standard);
    }
    .form-grid textarea:focus, .form-grid input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 16%, transparent); }
    label { display: block; color: var(--muted); font-size: 12px; margin-bottom: 6px; }
    select, input[type="date"] { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; height: 38px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); color: var(--text); padding: 0 10px; outline: none; transition: border-color .14s var(--ease-standard), box-shadow .14s var(--ease-standard), background .14s var(--ease-standard); }
    select:focus, input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 16%, transparent); }
    .checks { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; padding-bottom: 4px; }
    .check { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; min-height: 32px; border-radius: 8px; }
    .check input { width: 18px; height: 18px; min-width: 18px; accent-color: var(--blue); }
    .check:has(input:focus-visible) { outline: none; box-shadow: var(--focus-ring); }
    .check.switch {
      position: relative;
      gap: 10px;
      color: var(--text);
      font-weight: 700;
    }
    .check.switch input {
      appearance: none;
      width: 40px;
      flex: 0 0 40px;
      height: 22px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: color-mix(in srgb, var(--muted) 18%, var(--panel));
      position: relative;
      transition: background .16s var(--ease-standard), border-color .16s var(--ease-standard), box-shadow .16s var(--ease-standard);
    }
    .check.switch input::after {
      content: "";
      position: absolute;
      width: 18px;
      height: 18px;
      left: 1px;
      top: 1px;
      border-radius: 999px;
      background: var(--panel);
      box-shadow: 0 1px 4px rgba(15, 23, 42, .22);
      transition: transform .16s var(--ease-standard);
    }
    .check.switch input:checked {
      border-color: color-mix(in srgb, var(--green) 56%, var(--line));
      background: var(--green);
    }
    .check.switch input:checked::after {
      transform: translateX(18px);
      background: #fff;
    }
    .check.switch input:disabled {
      opacity: .52;
    }
    .pause-status-card {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--soft);
      padding: 12px;
      display: grid;
      gap: 10px;
    }
    .food-constraint-card {
      min-width: 0;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--soft);
      padding: 12px;
      display: grid;
      gap: 10px;
    }
    .constraint-list {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .constraint-row {
      min-width: 0;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 9px 10px;
      display: grid;
      grid-template-columns: minmax(90px, auto) minmax(0, 1fr) auto;
      gap: 8px 12px;
      align-items: center;
    }
    .constraint-row .constraint-main {
      min-width: 0;
      overflow-wrap: anywhere;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }
    .constraint-row .constraint-meta {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
      display: flex;
      flex-wrap: wrap;
      gap: 4px 10px;
    }
    .constraint-table {
      min-width: 0;
      display: grid;
      border: 1px solid var(--line);
      border-radius: 8px;
      overflow: hidden;
      background: var(--panel);
    }
    .constraint-table-row {
      min-width: 0;
      display: grid;
      grid-template-columns: minmax(0, .72fr) minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1.05fr) minmax(0, .72fr) minmax(0, .72fr) minmax(0, 1fr);
      gap: 8px;
      align-items: center;
      padding: 9px 10px;
      border-top: 1px solid var(--line);
      font-size: 12px;
    }
    .constraint-table-row:first-child { border-top: 0; }
    .constraint-table-row.header {
      background: var(--soft);
      color: var(--muted);
      font-weight: 800;
    }
    .constraint-table-cell {
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .constraint-observations {
      margin-top: 10px;
      border-top: 1px solid var(--line);
      padding-top: 8px;
    }
    .constraint-observations > summary {
      cursor: pointer;
      font-weight: 700;
    }
    .constraint-observation-list {
      display: grid;
      gap: 6px;
      margin-top: 8px;
    }
    .constraint-observation-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 8px 10px;
      border: 1px solid var(--line);
      border-radius: 6px;
      background: var(--surface-2);
    }
    .week-plan-strategy-note.quota-blocked {
      border-color: color-mix(in srgb, var(--warn) 38%, var(--line));
      background: color-mix(in srgb, var(--warn) 10%, var(--panel));
    }
    .pause-status-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
    }
    .pause-status-head strong {
      display: block;
      color: var(--text);
      font-size: 14px;
      margin-bottom: 2px;
    }
    .pause-status-head .sub,
    .pause-status-foot {
      margin: 0;
      text-align: left;
      overflow-wrap: anywhere;
    }
    .pause-status-actions {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
    }
    .pause-action-group {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, auto));
      gap: 8px;
      align-items: center;
    }
    .pause-action-group .btn {
      min-width: 0;
    }
    .pause-action-group .btn[aria-pressed="true"] {
      border-color: color-mix(in srgb, var(--blue) 42%, var(--line));
      background: color-mix(in srgb, var(--blue-soft) 72%, var(--panel));
      color: var(--blue-strong);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue) 18%, transparent);
    }
    .pause-until-details,
    .account-enabled-details {
      min-width: min(100%, 220px);
      border: 1px solid var(--line);
      border-radius: 8px;
      padding: 8px 10px;
      background: var(--panel);
    }
    .pause-until-details summary,
    .account-enabled-details summary {
      list-style: none;
      cursor: pointer;
      color: var(--muted);
      font-weight: 700;
      font-size: 13px;
    }
    .pause-until-details summary::-webkit-details-marker,
    .account-enabled-details summary::-webkit-details-marker {
      display: none;
    }
    .pause-until-details.is-active {
      border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
      background: color-mix(in srgb, var(--amber-soft) 52%, var(--panel));
    }
    .pause-until-grid {
      padding-top: 10px;
      grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    }
    .pause-action-hint {
      margin: 0;
      padding: 8px 10px;
      border: 1px solid color-mix(in srgb, var(--blue) 18%, var(--line));
      border-radius: 8px;
      background: color-mix(in srgb, var(--blue-soft) 34%, transparent);
      color: var(--muted);
      font-size: 12.5px;
      line-height: 1.45;
    }
    .pause-status-actions > .pause-until-details,
    .pause-status-actions > .account-enabled-details,
    .pause-status-actions > .pause-action-hint {
      flex: 1 1 100%;
    }
    @media (max-width: 640px) {
      .pause-status-head {
        align-items: stretch;
      }
      .pause-action-group {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
      }
      .pause-action-group .btn {
        width: 100%;
      }
      .pause-until-details,
      .account-enabled-details {
        width: 100%;
        min-width: 0;
      }
    }
    .btn { min-height: 38px; height: 38px; max-width: 100%; border-radius: 7px; border: 1px solid var(--line); background: var(--panel); color: var(--text); padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; text-decoration: none; font-weight: 650; white-space: nowrap; flex-shrink: 0; min-width: 0; transition: transform .14s var(--ease-standard), box-shadow .14s var(--ease-standard), background .14s var(--ease-standard), border-color .14s var(--ease-standard), opacity .14s var(--ease-standard); }
    .btn:hover { background: var(--soft); border-color: #b8c6d2; }
    .btn:active { transform: translateY(1px); }
    .btn.primary { background: var(--blue); border-color: var(--blue); color: white; font-weight: 700; box-shadow: 0 8px 22px color-mix(in srgb, var(--blue) 26%, transparent); }
    .btn.success { background: var(--green); border-color: var(--green); color: white; font-weight: 700; box-shadow: 0 8px 22px color-mix(in srgb, var(--green) 24%, transparent); }
    .btn.danger { background: var(--red-soft); border-color: #efc1bc; color: var(--red); font-weight: 700; }
    .btn.small { height: 31px; font-size: 13px; padding: 0 9px; }
    .btn.prominent { border-width: 2px; }
    .btn span { white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
    .btn[aria-busy="true"],
    .btn.loading-control { cursor: wait; }
    .btn[aria-busy="true"] span,
    .btn.loading-control span { opacity: .92; }
    .icon { width: 15px; height: 15px; stroke-width: 2; flex: 0 0 auto; }
    .tab-btn .icon { width: 14px; height: 14px; }
    .head strong { display: inline-flex; gap: 7px; align-items: center; }
    .quick-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: end; }
    .toolbar-actions.quick-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; justify-content: stretch; align-content: end; align-items: stretch; }
    .toolbar-actions .btn { width: 100%; min-width: 0; }
    .quick-more {
      position: relative;
      align-self: stretch;
      display: inline-grid;
      min-width: 0;
    }
    .quick-more > summary {
      list-style: none;
      min-height: 38px;
      border-radius: 7px;
      border: 1px solid var(--line);
      background: var(--panel);
      color: var(--text);
      padding: 0 12px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 0;
      gap: 7px;
      font-weight: 650;
    }
    .quick-more > summary::-webkit-details-marker { display: none; }
    .quick-more[open] > summary { border-color: color-mix(in srgb, var(--blue) 35%, var(--line)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--blue-soft) 45%, transparent); }
    .quick-more-menu {
      position: absolute;
      top: calc(100% + 6px);
      left: 0;
      min-width: 184px;
      padding: 8px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      box-shadow: var(--shadow-strong);
      display: grid;
      gap: 6px;
      z-index: 6;
    }
    .quick-more-menu .btn { width: 100%; justify-content: flex-start; min-width: 0; }
    .quick-actions .check { margin-bottom: 0; }
    .advanced-options { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 10px; }
    .advanced-options summary { cursor: pointer; color: var(--muted); font-size: 13px; font-weight: 650; }
    .advanced-grid { margin-top: 10px; display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 12px; align-items: end; }
    .grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 16px; align-items: start; }
    .stack { display: grid; gap: 16px; }
    .onboarding { background: var(--panel); box-shadow: none; }
    .onboarding-grid { padding: 10px 14px 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .onboarding-card { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 11px; display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; min-height: 96px; align-content: start; }
    .step-num { width: 24px; height: 24px; grid-row: 1 / span 2; border-radius: 999px; background: var(--blue-soft); color: var(--blue); display: grid; place-items: center; font-size: 12px; font-weight: 800; border: 1px solid var(--line); }
    .step-title { font-size: 14px; font-weight: 700; }
    .step-desc { color: var(--muted); font-size: 12px; line-height: 1.45; grid-column: 2; }
    .first-run-guide { padding: 12px 14px; display: grid; gap: 10px; }
    .guide-status {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 10px 12px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      font-size: 13px;
    }
    .guide-status strong { font-size: 14px; }
    .guide-steps {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }
    .guide-step {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 12px;
      display: grid;
      gap: 8px;
      min-height: 120px;
    }
    .guide-step.done { border-color: #b9e0d0; background: var(--green-soft); }
    .guide-step .step-title { font-size: 13px; font-weight: 700; }
    .guide-step .step-help { color: var(--muted); font-size: 12px; line-height: 1.45; }
    .guide-state-tag {
      border-radius: 999px;
      border: 1px solid var(--line);
      padding: 2px 8px;
      font-size: 12px;
      font-weight: 700;
      width: fit-content;
      color: var(--muted);
      background: var(--soft);
    }
    .guide-state-tag.done { color: var(--green); border-color: #b9e0d0; background: var(--green-soft); }
    .guide-actions { display: flex; gap: 8px; flex-wrap: wrap; }
    .pref-editor { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 10px; }
    .pref-editor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .pref-widget { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 10px; display: grid; gap: 8px; }
    .pref-widget h4 { margin: 0; font-size: 13px; font-weight: 700; color: var(--text); }
    .pref-widget .sub { margin: 0; font-size: 12px; }
    .default-time-policy-card {
      min-width: 0;
      margin: 0;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
    }
    .default-time-policy-card legend {
      padding: 0 5px;
      color: var(--text);
      font-size: 13px;
      font-weight: 800;
    }
    .default-time-policy-card > .sub { margin: 0 0 8px; }
    .default-time-policy-options {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 7px;
      min-width: 0;
    }
    .default-time-policy-options label {
      position: relative;
      min-width: 0;
      cursor: pointer;
    }
    .default-time-policy-options input {
      position: absolute;
      inline-size: 1px;
      block-size: 1px;
      opacity: 0;
      pointer-events: none;
    }
    .default-time-policy-options span {
      min-height: 58px;
      padding: 8px;
      border: 1px solid var(--line);
      border-radius: 7px;
      background: var(--panel);
      display: grid;
      align-content: center;
      gap: 3px;
      color: var(--muted);
      text-align: center;
      transition: border-color .14s ease, background .14s ease, color .14s ease;
    }
    .default-time-policy-options strong {
      color: inherit;
      font-size: 12px;
      line-height: 1.25;
    }
    .default-time-policy-options small {
      font-size: 10px;
      line-height: 1.3;
    }
    .default-time-policy-options input:checked + span {
      border-color: var(--blue);
      background: color-mix(in srgb, var(--blue) 12%, var(--panel));
      color: var(--text);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue) 28%, transparent);
    }
    .default-time-policy-options input:focus-visible + span {
      outline: 2px solid var(--blue);
      outline-offset: 2px;
    }
    .default-time-policy-card.compact {
      margin-bottom: 10px;
      padding: 8px;
    }
    .default-time-policy-card.compact .default-time-policy-options span {
      min-height: 50px;
      padding: 6px;
    }
    .pref-workbench { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; min-height: 188px; }
    .pref-col { border: 1px solid var(--line); border-radius: 7px; background: var(--panel); padding: 8px; display: grid; grid-template-rows: auto 1fr; gap: 8px; min-height: 170px; }
    .pref-col-title { color: var(--muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; }
    .pref-pool, .pref-selected { display: grid; align-content: start; gap: 6px; overflow: auto; max-height: 280px; margin: 0; padding: 0; }
    .pref-option { border: 1px solid var(--line); border-radius: 6px; background: var(--soft); color: var(--text); height: 32px; padding: 0 8px; text-align: left; font-size: 12px; }
    .pref-option:hover { background: var(--blue-soft); border-color: var(--blue); }
    .pref-item { list-style: none; border: 1px solid var(--line); border-radius: 6px; background: var(--soft); padding: 7px; display: grid; grid-template-columns: auto auto 1fr auto; gap: 8px; align-items: center; cursor: move; }
    .pref-item.dragging { opacity: 0.55; }
    .pref-item.drop-target { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(31,111,235,.14); }
    .pref-rank { width: 19px; height: 19px; border-radius: 999px; display: grid; place-items: center; font-size: 11px; font-weight: 800; background: var(--blue-soft); color: var(--blue); border: 1px solid var(--line); }
    .pref-grip { color: var(--muted); font-size: 14px; user-select: none; }
    .pref-label { font-size: 12px; line-height: 1.3; }
    .pref-remove { width: 24px; height: 24px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel); color: var(--red); font-size: 12px; }
    .pref-empty { color: var(--muted); font-size: 12px; border: 1px dashed var(--line); border-radius: 6px; padding: 10px; text-align: center; }
    .pref-raw { display: none; }
    .menu-guide-box { padding: 12px 14px; display: grid; gap: 10px; }
    .menu-guide-frame { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); min-height: 230px; display: grid; place-items: center; overflow: hidden; }
    .menu-guide-frame img { max-width: 100%; max-height: 420px; object-fit: contain; cursor: zoom-in; display: block; }
    .menu-guide-meta { color: var(--muted); font-size: 12px; display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
    .image-modal { position: fixed; inset: 0; background: rgba(0,0,0,.8); display: none; place-items: center; z-index: 40; padding: calc(20px + env(safe-area-inset-top)) calc(16px + env(safe-area-inset-right)) calc(20px + env(safe-area-inset-bottom)) calc(16px + env(safe-area-inset-left)); }
    .image-modal.show { display: grid; }
    .image-modal img { max-width: min(1080px, 95vw); max-height: 88vh; border-radius: 8px; border: 1px solid #465970; background: white; }
    .image-modal-close { position: fixed; top: calc(12px + env(safe-area-inset-top)); right: calc(12px + env(safe-area-inset-right)); }
    .wizard-modal {
      position: fixed;
      inset: 0;
      background: rgba(7, 12, 18, .62);
      display: none;
      place-items: center;
      z-index: 24;
      padding: 18px;
    }
    .wizard-modal.show { display: grid; }
    .wizard-card {
      width: min(760px, 95vw);
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      box-shadow: var(--shadow-strong);
      overflow: hidden;
      display: grid;
      grid-template-rows: auto auto 1fr auto;
    }
    .wizard-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 12px 14px;
      border-bottom: 1px solid var(--line);
      background: var(--soft);
    }
    .wizard-progress {
      padding: 10px 14px;
      border-bottom: 1px solid var(--line);
      font-size: 12px;
      color: var(--muted);
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .wizard-body { padding: 16px 14px; display: grid; gap: 10px; }
    .wizard-title { font-size: 18px; font-weight: 800; }
    .wizard-desc { color: var(--muted); font-size: 13px; line-height: 1.5; }
    .wizard-note { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 10px; font-size: 13px; }
    .wizard-foot {
      display: flex;
      justify-content: space-between;
      gap: 8px;
      align-items: center;
      padding: 12px 14px;
      border-top: 1px solid var(--line);
      background: color-mix(in srgb, var(--soft) 50%, var(--panel));
    }
    .head { min-height: 48px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 12px 14px; background: color-mix(in srgb, var(--soft) 52%, transparent); border-radius: 8px 8px 0 0; }
    .head strong { font-size: 14px; }
    .open-dates { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: 10px; }
    .chip {
      border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 10px 11px; color: var(--text); font-size: 13px;
      text-align: left; min-height: 58px; display: grid; gap: 4px;
    }
    .chip strong { font-size: 15px; }
    .chip span { color: var(--muted); font-size: 12px; }
    .chip.active { background: var(--text); color: var(--panel); border-color: var(--text); }
    .chip.active span { color: var(--muted); }
    .cards { padding: 12px 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
    .metric { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 12px; min-height: 76px; }
    .metric .k { color: var(--muted); font-size: 12px; margin-bottom: 8px; }
    .metric .v { font-size: 20px; font-weight: 750; overflow-wrap: anywhere; }
    .table { width: 100%; border-collapse: collapse; font-size: 13px; }
    .table th, .table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
    .table th { color: var(--muted); font-weight: 650; background: var(--soft); }
    #adminPushSettingsPanel,
    #adminPushSettingsPanel > *,
    #pushDeviceHealthTable,
    #pushRecentEventsList {
      min-width: 0;
      max-width: 100%;
    }
    #pushDeviceHealthTable {
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
    }
    #pushDeviceHealthTable .table {
      min-width: 520px;
    }
    #adminPushSettingsPanel .sub,
    #adminPushSettingsPanel .mini-note {
      overflow-wrap: anywhere;
    }
    .push-device-list {
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .push-device-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 9px 10px;
      display: grid;
      gap: 6px;
      min-width: 0;
    }
    .push-device-card .row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      min-width: 0;
    }
    .push-device-card .row span {
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .push-device-card .meta {
      color: var(--muted);
      font-size: 12px;
      overflow-wrap: anywhere;
    }
    .order-grid { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
    .order-card { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 12px; display: grid; gap: 8px; }
    .order-date { color: var(--muted); font-size: 12px; }
    .order-food { font-weight: 750; line-height: 1.35; }
    .order-meta { display: flex; gap: 8px; flex-wrap: wrap; }
    .order-actions { display: flex; flex-wrap: wrap; gap: 8px; }
    .today-order-summary {
      padding: 0 14px 14px;
      display: grid;
      gap: 10px;
      touch-action: pan-y;
      user-select: none;
    }
    .today-order-nav {
      padding: 10px 14px 0;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 8px;
    }
    .today-order-date-strip {
      display: flex;
      gap: 7px;
      overflow-x: auto;
      scrollbar-width: thin;
      padding: 2px 1px 5px;
      min-width: 0;
      scroll-snap-type: x proximity;
    }
    .today-date-chip {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--soft);
      color: var(--muted);
      min-width: 78px;
      padding: 6px 9px;
      display: grid;
      gap: 2px;
      justify-items: center;
      line-height: 1.05;
      font-weight: 750;
      flex: 0 0 auto;
      scroll-snap-align: center;
    }
    .today-date-chip .date-main {
      color: var(--text);
      font-size: 13px;
    }
    .today-date-chip .date-sub {
      display: flex;
      gap: 4px;
      align-items: center;
      justify-content: center;
      font-size: 11px;
      color: var(--muted);
      white-space: nowrap;
    }
    .today-date-chip.active {
      color: var(--panel);
      background: var(--text);
      border-color: var(--text);
      box-shadow: 0 8px 18px rgba(22, 33, 43, .12);
    }
    .today-date-chip.active .date-main,
    .today-date-chip.active .date-sub {
      color: var(--panel);
    }
    .today-date-chip.holiday:not(.active) {
      border-style: dashed;
      background: color-mix(in srgb, var(--amber-soft) 30%, var(--soft));
    }
    .today-date-chip.has-orders:not(.active) {
      border-color: color-mix(in srgb, var(--green) 34%, var(--line));
    }
    .today-order-card {
      border: 1px solid var(--line);
      border-left: 4px solid var(--blue);
      border-radius: var(--radius-md);
      background: linear-gradient(180deg, color-mix(in srgb, var(--panel-accent) 28%, var(--soft)), var(--soft));
      padding: 11px 12px;
      display: grid;
      gap: 8px;
    }
    .today-order-card.quota-blocked {
      border-left-color: var(--warn);
      background: color-mix(in srgb, var(--warn) 8%, var(--soft));
    }
    .today-current-orders {
      margin: 0 14px 14px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      background: color-mix(in srgb, var(--panel) 72%, var(--soft));
      overflow: hidden;
    }
    .today-current-orders .current-head {
      padding: 10px 12px;
      border-bottom: 1px solid var(--line);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
    }
    .today-current-orders .current-head strong {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      min-width: 0;
    }
    .today-current-orders .current-list {
      padding: 10px 12px 12px;
      display: grid;
      gap: 8px;
    }
    .today-current-order-card {
      border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
      border-radius: 8px;
      background: var(--soft);
      padding: 10px;
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 8px 10px;
      align-items: center;
    }
    .today-current-order-main {
      min-width: 0;
      display: grid;
      gap: 4px;
    }
    .today-current-order-title {
      font-weight: 850;
      line-height: 1.25;
      overflow-wrap: anywhere;
    }
    .today-current-order-title .tag {
      margin-left: 6px;
      vertical-align: 1px;
      font-size: 10px;
      line-height: 1.25;
    }
    .today-current-order-sub {
      color: var(--muted);
      font-size: 12px;
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
    }
    .today-current-order-actions {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 6px;
    }
    .today-current-orders .empty {
      margin: 0;
      border: 0;
      background: transparent;
    }
    .today-order-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }
    .today-order-main {
      font-size: 16px;
      font-weight: 800;
      line-height: 1.4;
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .today-order-title {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
      flex-wrap: wrap;
    }
    .today-order-meal-type {
      color: var(--muted);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0;
    }
    .today-order-meta-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
      color: var(--muted);
      font-size: 12px;
    }
    .today-order-meta-row .tag { min-height: 21px; padding-block: 2px; }
    .today-order-sub {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
    }
    .today-order-content {
      color: var(--text);
      font-size: 13px;
      line-height: 1.45;
      overflow-wrap: anywhere;
      border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
      border-radius: 8px;
      background: color-mix(in srgb, var(--panel) 50%, var(--soft));
      padding: 8px 10px;
    }
    .today-order-content.missing {
      border-style: dashed;
      color: var(--muted);
      background: color-mix(in srgb, var(--amber-soft) 28%, var(--panel));
    }
    .today-order-content.compact {
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .today-order-content strong {
      color: var(--muted);
      font-size: 12px;
      font-weight: 750;
    }
    .today-order-result-line {
      display: flex;
      align-items: center;
      gap: 6px;
      color: var(--muted);
      font-size: 13px;
      font-weight: 700;
      min-width: 0;
    }
    .today-order-result-line span {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .today-order-source-row {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
      min-width: 0;
    }
    .empty { color: var(--muted); padding: 14px; font-size: 13px; }
    .recs { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
    .rec { border: 1px solid var(--line); border-radius: 8px; padding: 12px; background: var(--soft); display: grid; gap: 7px; }
    .rec-top { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
    .tag { border-radius: 999px; padding: 3px 8px; font-size: 12px; font-weight: 700; background: var(--soft); color: var(--muted); border: 1px solid transparent; display: inline-flex; align-items: center; justify-content: center; gap: 4px; min-height: 24px; min-width: 0; line-height: 1.1; text-align: center; vertical-align: middle; }
    .tag.ok { background: var(--green-soft); color: var(--green); }
    .tag.warn { background: var(--amber-soft); color: var(--amber); }
    .tag.err { background: var(--red-soft); color: var(--red); }
    .tag.no-order { background: color-mix(in srgb, var(--green-soft) 70%, var(--panel)); color: var(--green); border-color: color-mix(in srgb, var(--green) 30%, transparent); }
    .tag.strategy { background: color-mix(in srgb, var(--amber-soft) 76%, var(--panel)); color: var(--amber); border-color: color-mix(in srgb, var(--amber) 30%, transparent); }
    .tag.review { background: color-mix(in srgb, var(--blue-soft) 78%, var(--panel)); color: var(--blue); border-color: color-mix(in srgb, var(--blue) 24%, transparent); }
    .qr-box { padding: 14px; display: grid; gap: 12px; justify-items: center; min-height: 280px; }
    .qr-box img { max-width: 230px; width: 100%; image-rendering: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); padding: 8px; }
    .week-plan-main { padding-bottom: 10px; min-width: 0; }
    .week-plan-split {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 12px;
      padding: 0 14px 12px;
      align-items: start;
    }
    .week-plan-split.has-menu-drawer {
      grid-template-columns: minmax(0, 1fr);
    }
    .week-plan-primary {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
      min-width: 0;
      display: grid;
      gap: 10px;
      align-content: start;
      padding-bottom: 10px;
    }
    .week-plan-secondary {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
      min-width: 0;
      display: none;
      grid-template-rows: auto 1fr;
    }
    .week-plan-split.has-menu-drawer .week-plan-secondary {
      display: grid;
      position: fixed;
      z-index: 24;
      top: var(--week-menu-top, calc(82px + env(safe-area-inset-top)));
      left: var(--week-menu-left, auto);
      right: var(--week-menu-right, 18px);
      width: min(420px, calc(100vw - 28px));
      max-height: min(78vh, 720px);
      box-shadow: var(--shadow-strong);
    }
    .menu-compare-layout {
      display: grid;
      gap: 10px;
      align-content: start;
      overflow: auto;
      max-height: calc(72vh - 48px);
      scrollbar-gutter: stable;
    }
    .week-plan-ocr-primary {
      margin: 0 12px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 10px;
      display: grid;
      gap: 8px;
    }
    .week-plan-ocr-primary > summary {
      list-style: none;
      cursor: pointer;
    }
    .week-plan-ocr-primary > summary::-webkit-details-marker { display: none; }
    .week-plan-ocr-primary:not([open]) {
      padding-bottom: 10px;
    }
    .week-plan-ocr-primary:not([open]) > :not(summary) {
      display: none;
    }
    .week-plan-ocr-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }
    .loading-control {
      cursor: wait;
      opacity: .72;
    }
    .loading-control .icon {
      animation: spin .9s linear infinite;
    }
    @keyframes spin { to { transform: rotate(360deg); } }
    .skeleton {
      position: relative;
      overflow: hidden;
      color: transparent !important;
      background: color-mix(in srgb, var(--soft) 70%, var(--line));
      border-radius: 8px;
    }
    .skeleton::after {
      content: "";
      position: absolute;
      inset: 0;
      transform: translateX(-100%);
      background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--panel) 58%, transparent), transparent);
      animation: skeleton-shimmer 1.1s ease-in-out infinite;
    }
    @keyframes skeleton-shimmer { to { transform: translateX(100%); } }
    .week-plan-ocr-title {
      font-size: 13px;
      font-weight: 750;
      display: inline-flex;
      align-items: center;
      gap: 8px;
    }
    .week-plan-secondary-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 9px 10px;
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--panel-accent) 34%, var(--soft));
      cursor: move;
      user-select: none;
      touch-action: none;
    }
    .week-plan-secondary-toolbar {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      padding: 8px 10px 0;
    }
    .week-plan-secondary-title {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      font-weight: 750;
    }
    .week-plan-toolbar {
      padding: 0 14px 10px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: flex-start;
      justify-content: space-between;
      border-bottom: 1px solid var(--line);
      margin-bottom: 10px;
    }
    .week-plan-actions { display: flex; flex-wrap: wrap; gap: 8px; }
    .focus-planning-mode .week-plan-tip,
    .focus-planning-mode #desiredStrategySummary,
    .focus-planning-mode #weekPlanQuickPref,
    .focus-planning-mode #weekPlanOcrPanel,
    .focus-planning-mode #weekPlanMenuAside,
    .focus-planning-mode #opsManualPanel,
    .focus-planning-mode #opsQrPanel,
    .focus-planning-mode #opsSelfPanel {
      display: none !important;
    }
    .focus-planning-mode #focusPlanningMode {
      background: var(--blue-soft);
      color: var(--blue);
      border-color: color-mix(in srgb, var(--blue) 28%, transparent);
    }
    .desired-strategy-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: color-mix(in srgb, var(--panel-accent) 30%, var(--soft));
      padding: 10px;
      display: grid;
      gap: 9px;
      min-width: 0;
    }
    .desired-strategy-inline {
      margin: 0 14px 10px;
      grid-template-columns: minmax(170px, auto) minmax(0, 1fr) auto;
      align-items: center;
      padding: 9px 10px;
    }
    .desired-strategy-main {
      display: grid;
      gap: 2px;
      min-width: 0;
    }
    .desired-strategy-main strong {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      font-weight: 800;
    }
    .desired-strategy-chips {
      display: flex;
      gap: 7px;
      flex-wrap: wrap;
      min-width: 0;
    }
    .desired-strategy-inline .desired-strategy-chips {
      align-items: center;
      flex-wrap: nowrap;
      overflow: hidden;
    }
    .desired-strategy-inline .ops-chip {
      flex: 0 1 auto;
      max-width: 170px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .desired-strategy-details {
      flex: 0 0 auto;
      position: relative;
      min-width: 0;
    }
    .desired-strategy-details summary {
      list-style: none;
      cursor: pointer;
      color: var(--blue);
      font-size: 12px;
      font-weight: 800;
      white-space: nowrap;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--soft);
      padding: 5px 8px;
    }
    .desired-strategy-details summary::-webkit-details-marker { display: none; }
    .desired-strategy-details[open] summary {
      border-color: #bbd3fb;
      background: var(--blue-soft);
    }
    .desired-strategy-details-panel {
      position: absolute;
      right: 0;
      top: calc(100% + 8px);
      z-index: 18;
      width: min(620px, calc(100vw - 56px));
      max-height: min(56vh, 360px);
      overflow: auto;
      padding: 10px;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--panel);
      box-shadow: var(--shadow-strong);
    }
    .desired-strategy-details-panel .desired-strategy-chips {
      flex-wrap: wrap;
      overflow: visible;
    }
    .desired-strategy-body {
      padding: 12px 14px 14px;
      display: grid;
      gap: 12px;
    }
    .desired-strategy-form {
      display: grid;
      grid-template-columns: repeat(3, minmax(160px, 1fr));
      gap: 10px;
      align-items: end;
    }
    .desired-strategy-form .check { align-self: center; margin-bottom: 0; }
    .desired-strategy-form label:not(.check) {
      display: block;
      margin-bottom: 5px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
    }
    .desired-strategy-form input,
    .desired-strategy-form select {
      width: 100%;
      min-width: 0;
      height: 34px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--text);
      padding: 0 9px;
      font-weight: 650;
    }
    .admin-option-drawer {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--panel);
      overflow: hidden;
    }
    .admin-option-drawer > summary {
      list-style: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 12px;
      font-weight: 800;
      color: var(--text);
      background: color-mix(in srgb, var(--panel-accent) 28%, var(--panel));
    }
    .admin-option-drawer > summary::-webkit-details-marker { display: none; }
    .admin-option-drawer > summary .sub {
      font-weight: 650;
      text-align: right;
    }
    .admin-option-drawer[open] > summary {
      border-bottom: 1px solid var(--line);
    }
    .admin-option-drawer-body {
      padding: 12px;
      display: grid;
      gap: 10px;
    }
    @media (max-width: 680px) {
      .constraint-row {
        grid-template-columns: minmax(0, 1fr) auto;
      }
      .constraint-row .constraint-meta {
        grid-column: 1 / -1;
      }
      .constraint-table-row,
      .constraint-table-row.header {
        grid-template-columns: minmax(0, 1fr) auto;
      }
      .constraint-table-row.header { display: none; }
      .constraint-table-cell[data-label]::before {
        content: attr(data-label) "：";
        color: var(--muted);
        font-weight: 700;
      }
      .constraint-table-cell.actions {
        grid-column: 1 / -1;
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
      }
      .constraint-observation-row {
        align-items: flex-start;
        flex-direction: column;
      }
    }
    .strategy-mode-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }
    .strategy-mode-card {
      min-height: 132px;
      display: grid;
      align-content: start;
      gap: 8px;
      text-align: left;
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--panel);
      color: var(--text);
      padding: 12px;
      cursor: pointer;
      transition: transform .14s var(--ease-standard), border-color .14s var(--ease-standard), box-shadow .14s var(--ease-standard), background .14s var(--ease-standard);
    }
    .strategy-mode-card:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--blue) 45%, var(--line)); }
    .strategy-mode-card[aria-pressed="true"],
    .strategy-mode-card[aria-checked="true"] {
      border-color: var(--blue);
      background: color-mix(in srgb, var(--blue-soft) 72%, var(--panel));
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--blue) 15%, transparent);
    }
    .strategy-mode-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-weight: 900; }
    .strategy-mode-title .tag { flex: 0 0 auto; }
    .strategy-mode-desc { color: var(--muted); font-size: 12px; line-height: 1.45; }
    .strategy-mode-meta { display: flex; flex-wrap: wrap; gap: 5px; }
    .strategy-control-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 10px;
    }
    .strategy-control {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--soft);
      padding: 10px;
      display: grid;
      gap: 8px;
      min-width: 0;
    }
    .strategy-control > label,
    .strategy-control .strategy-control-label {
      color: var(--muted);
      font-size: 12px;
      font-weight: 800;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }
    .strategy-control input[type="range"] { width: 100%; accent-color: var(--blue); }
    .strategy-control output { color: var(--text); font-weight: 850; font-size: 12px; }
    .strategy-segment {
      display: inline-flex;
      flex-wrap: wrap;
      gap: 4px;
      padding: 3px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--panel);
    }
    .strategy-segment button,
    .strategy-food-chip,
    .stepper-btn {
      border: 1px solid transparent;
      border-radius: 999px;
      background: transparent;
      color: var(--muted);
      font-weight: 800;
      min-height: 30px;
      padding: 0 10px;
      cursor: pointer;
    }
    .strategy-segment button[aria-pressed="true"],
    .strategy-food-chip[aria-pressed="true"] {
      color: var(--blue);
      background: var(--blue-soft);
      border-color: color-mix(in srgb, var(--blue) 32%, var(--line));
    }
    .strategy-food-chips { display: flex; flex-wrap: wrap; gap: 6px; }
    .strategy-food-chip { background: var(--panel); border-color: var(--line); }
    .strategy-stepper { display: grid; grid-template-columns: 34px 1fr 34px; gap: 6px; align-items: center; }
    .strategy-stepper input { text-align: center; height: 34px; }
    .stepper-btn { border-color: var(--line); background: var(--panel); padding: 0; }
    .strategy-hidden-field { display: none !important; }
    .run-wizard {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--soft);
      padding: 12px;
      display: grid;
      gap: 10px;
    }
    .run-wizard-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
    .run-wizard-step {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 10px;
      display: grid;
      gap: 6px;
    }
    .run-wizard-step strong { display: flex; gap: 6px; align-items: center; }
    .run-wizard-actions { display: flex; flex-wrap: wrap; gap: 6px; }
    .run-wizard-actions .btn[aria-pressed="true"] {
      border-color: var(--blue);
      background: var(--blue-soft);
      color: var(--blue);
    }
    .run-wizard-actions .btn.danger[aria-pressed="true"] {
      border-color: var(--warn);
      background: color-mix(in srgb, var(--warn) 18%, var(--panel));
      color: var(--warn);
    }
    .week-plan-context {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      justify-content: flex-end;
      margin-left: auto;
      font-size: 12px;
      color: var(--muted);
    }
    .week-plan-context .tag strong { color: var(--text); font-weight: 700; }
    .week-plan-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
    .week-plan-meta-info {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
      color: var(--muted);
      font-size: 12px;
      margin-right: auto;
      min-width: min(100%, 420px);
    }
    .week-plan-cycle-pill {
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 3px 10px;
      background: var(--soft);
      color: var(--muted);
      font-size: 12px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 100%;
    }
    .week-plan-cycle-pill.warn {
      background: var(--amber-soft);
      color: var(--amber);
      border-color: color-mix(in srgb, var(--amber) 35%, transparent);
    }
    .week-plan-layout-switch {
      display: inline-flex;
      border: 1px solid var(--line);
      border-radius: 999px;
      overflow: hidden;
      background: var(--panel);
    }
    .week-plan-layout-btn {
      border: 0;
      background: transparent;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
      min-height: 28px;
      padding: 0 10px;
    }
    .week-plan-layout-btn.active {
      background: var(--blue-soft);
      color: var(--blue);
    }
    .week-plan-filter {
      display: inline-flex;
      border: 1px solid var(--line);
      border-radius: 999px;
      overflow: hidden;
      background: var(--panel);
    }
    .week-plan-filter-btn {
      border: 0;
      background: transparent;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
      min-height: 28px;
      padding: 0 10px;
    }
    .week-plan-filter-btn.active {
      background: var(--blue-soft);
      color: var(--blue);
    }
    .week-plan-dirty {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border: 1px solid #efc1bc;
      border-radius: 999px;
      background: var(--red-soft);
      color: var(--red);
      font-size: 12px;
      font-weight: 700;
      padding: 2px 9px;
    }
    .week-plan-dirty .dot { width: 8px; height: 8px; border-radius: 999px; background: var(--red); }
    .week-plan-dirty.clean {
      border-color: #b9e0d0;
      background: var(--green-soft);
      color: var(--green);
    }
    .week-plan-dirty.clean .dot { background: var(--green); }
    .week-plan-loaded { color: var(--muted); font-size: 12px; }
    .week-plan-grid { padding: 10px 12px 12px; display: grid; gap: 10px; }
    .week-plan-empty-action {
      display: grid;
      gap: 10px;
      padding: 14px;
      border: 1px dashed var(--line);
      border-radius: 8px;
      background: var(--soft);
      color: var(--muted);
    }
    .week-plan-empty-action strong { color: var(--text); }
    .week-plan-empty-action .quick-actions { padding: 0; justify-content: flex-start; }
    .week-plan-tip {
      margin: 0 14px 10px;
      padding: 8px 10px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
    }
    .week-plan-primary .week-plan-tip { order: 0; }
    .week-plan-primary #weekPlanGrid { order: 1; }
    .week-plan-primary #weekPlanQuickPref { order: 2; }
    .week-plan-primary #weekPlanOcrPanel { order: 3; }
    .week-plan-board { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .week-plan-calendar-wrap {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
    }
    .week-plan-calendar {
      display: grid;
      grid-template-columns: 88px repeat(var(--week-days, 5), minmax(0, 1fr));
      gap: 0;
      min-width: 0;
    }
    .week-plan-calendar-head,
    .week-plan-calendar-corner,
    .week-plan-calendar-row-head,
    .week-plan-calendar-cell {
      border-right: 1px solid var(--line);
      border-bottom: 1px solid var(--line);
      min-width: 0;
    }
    .week-plan-calendar-head:last-child,
    .week-plan-calendar-cell:last-child { border-right: 0; }
    .week-plan-calendar-corner {
      background: color-mix(in srgb, var(--panel-accent) 30%, var(--soft));
      padding: 10px 10px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 700;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
    }
    .week-plan-calendar-head {
      background: color-mix(in srgb, var(--panel-accent) 36%, var(--soft));
      padding: 9px 10px;
      display: grid;
      gap: 4px;
    }
    .week-plan-calendar-head.holiday,
    .week-plan-calendar-cell.holiday,
    .week-plan-day-card.holiday {
      background: color-mix(in srgb, var(--amber-soft) 12%, var(--soft));
      border-color: color-mix(in srgb, var(--amber) 18%, var(--line));
    }
    .week-plan-calendar-head.holiday {
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber) 7%, transparent);
    }
    .week-plan-calendar-date { font-size: 14px; font-weight: 800; }
    .week-plan-calendar-date-line {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 6px;
      min-width: 0;
    }
    .week-plan-holiday-chip {
      display: inline-flex;
      align-items: center;
      width: max-content;
      max-width: 100%;
      border: 1px solid color-mix(in srgb, var(--amber) 30%, transparent);
      border-radius: 999px;
      background: color-mix(in srgb, var(--amber-soft) 48%, transparent);
      color: var(--amber);
      font-size: 11px;
      font-weight: 800;
      line-height: 1;
      padding: 3px 8px;
      white-space: nowrap;
    }
    .week-plan-calendar-sub { color: var(--muted); font-size: 12px; }
    .week-plan-calendar-row-head {
      background: color-mix(in srgb, var(--panel-accent) 25%, var(--soft));
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      font-size: 13px;
      font-weight: 800;
      padding: 10px 8px;
    }
    .week-plan-calendar-cell {
      padding: 6px;
      background: var(--soft);
    }
    .week-plan-calendar-cell * { min-width: 0; }
    .week-plan-calendar-cell .week-plan-meal-card {
      min-height: 0;
      background: var(--panel);
      padding: 8px;
      gap: 7px;
    }
    .week-plan-calendar .week-plan-meal-top { gap: 6px; }
    .week-plan-calendar .week-plan-meal-name { font-size: 12px; }
    .week-plan-calendar .tag { max-width: 76px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .week-plan-calendar .week-plan-selected { padding: 6px; }
    .week-plan-calendar .week-plan-selected-line {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 6px;
      align-items: start;
    }
    .week-plan-calendar .week-plan-selected-label {
      white-space: normal;
      line-height: 1.3;
      overflow-wrap: anywhere;
    }
    .week-plan-calendar .week-plan-selected-tools {
      opacity: .68;
      justify-content: flex-start;
    }
    .week-plan-calendar .week-plan-meal-card:hover .week-plan-selected-tools,
    .week-plan-calendar .week-plan-meal-card:focus-within .week-plan-selected-tools {
      opacity: 1;
    }
    .week-plan-calendar .week-plan-drag-hint,
    .week-plan-calendar .week-plan-clear-one,
    .week-plan-calendar .week-plan-no-order-one {
      padding: 2px 6px;
      min-height: 22px;
      font-size: 10px;
    }
    .week-plan-calendar .week-plan-no-order-one {
      justify-self: start;
    }
    .week-plan-calendar .week-plan-editor-line {
      grid-template-columns: 42px minmax(0, 1fr);
      gap: 6px;
      font-size: 11px;
    }
    .week-plan-calendar .week-plan-time-policy {
      grid-template-columns: 42px minmax(0, 1fr);
      gap: 4px 6px;
    }
    .week-plan-calendar .week-plan-time-policy-summary {
      display: none;
    }
    .week-plan-calendar .week-plan-time-policy-option {
      min-height: 24px;
      font-size: 9px;
    }
    .week-plan-calendar .week-plan-select {
      min-height: 32px;
      padding: 0 8px;
      font-size: 12px;
    }
    .week-plan-calendar .week-plan-candidate-details summary { padding: 6px 7px; }
    .week-plan-meal-card.strategy-skip {
      border-style: dashed;
      background: color-mix(in srgb, var(--amber-soft) 46%, var(--panel));
    }
    .week-plan-meal-card.holiday {
      border-style: dashed;
      border-color: color-mix(in srgb, var(--amber) 34%, var(--line));
      background: color-mix(in srgb, var(--amber-soft) 22%, var(--panel));
    }
    .week-plan-meal-card.holiday .tag {
      background: color-mix(in srgb, var(--amber-soft) 72%, transparent);
      color: var(--amber);
      border-color: color-mix(in srgb, var(--amber) 32%, transparent);
    }
    .week-plan-meal-card.holiday .week-plan-selected.empty {
      border-style: dashed;
      background: color-mix(in srgb, var(--amber-soft) 32%, var(--soft));
    }
    .week-plan-meal-card.no-order {
      border-color: rgba(20, 184, 166, .46);
      background: color-mix(in srgb, var(--green-soft) 32%, var(--panel));
    }
    .week-plan-meal-card.no-order .tag { background: var(--green-soft); color: var(--green); border-color: color-mix(in srgb, var(--green) 30%, transparent); }
    .week-plan-meal-card.strategy-skip .tag { background: var(--amber-soft); color: var(--amber); border-color: color-mix(in srgb, var(--amber) 30%, transparent); }
    .week-plan-meal-card.has-existing-order {
      border-color: color-mix(in srgb, var(--blue) 28%, var(--line));
      background: color-mix(in srgb, var(--blue-soft) 16%, var(--panel));
    }
    .week-plan-meal-card.has-existing-order .week-plan-meal-top .tag {
      background: color-mix(in srgb, var(--blue-soft) 78%, transparent);
      color: var(--blue);
      border-color: color-mix(in srgb, var(--blue) 38%, transparent);
    }
    .week-plan-existing-order {
      border: 1px solid color-mix(in srgb, var(--blue) 28%, var(--line));
      border-radius: 8px;
      background: color-mix(in srgb, var(--blue-soft) 42%, var(--soft));
      padding: 8px;
      display: grid;
      gap: 5px;
      box-shadow: inset 3px 0 0 color-mix(in srgb, var(--blue) 72%, transparent);
    }
    .week-plan-existing-order-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      min-width: 0;
    }
    .week-plan-existing-order-label {
      color: var(--muted);
      font-size: 11px;
      font-weight: 800;
      letter-spacing: .01em;
    }
    .week-plan-existing-order-badge {
      border: 1px solid color-mix(in srgb, var(--green) 30%, transparent);
      border-radius: 999px;
      background: var(--green-soft);
      color: var(--green);
      padding: 2px 7px;
      font-size: 11px;
      font-weight: 850;
      white-space: nowrap;
    }
    .week-plan-existing-order-main {
      color: var(--text);
      font-size: 13px;
      font-weight: 850;
      line-height: 1.25;
      overflow-wrap: anywhere;
    }
    .week-plan-existing-order-sub {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .week-plan-race-hint {
      border: 1px solid color-mix(in srgb, var(--blue) 30%, transparent);
      border-radius: 8px;
      background: color-mix(in srgb, var(--blue-soft) 36%, var(--soft));
      color: var(--blue);
      padding: 6px 8px;
      font-size: 11px;
      font-weight: 780;
      line-height: 1.35;
      display: flex;
      align-items: flex-start;
      gap: 6px;
      overflow-wrap: anywhere;
    }
    .week-plan-race-hint.hot {
      border-color: color-mix(in srgb, var(--green) 30%, transparent);
      background: color-mix(in srgb, var(--green-soft) 44%, var(--soft));
      color: var(--green);
    }
    .week-plan-race-hint.warn {
      border-color: color-mix(in srgb, var(--amber) 30%, transparent);
      background: color-mix(in srgb, var(--amber-soft) 48%, var(--soft));
      color: var(--amber);
    }
    .week-plan-race-hint .icon {
      width: 14px;
      height: 14px;
      flex: 0 0 auto;
      margin-top: 1px;
    }
    .week-plan-candidate-race {
      display: inline-flex;
      align-items: center;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, var(--blue) 28%, transparent);
      background: color-mix(in srgb, var(--blue-soft) 45%, transparent);
      color: var(--blue);
      font-size: 10px;
      font-weight: 800;
      line-height: 1;
      padding: 2px 6px;
      margin-left: 4px;
      white-space: nowrap;
    }
    .week-plan-candidate-race.hot {
      border-color: color-mix(in srgb, var(--green) 30%, transparent);
      background: color-mix(in srgb, var(--green-soft) 48%, transparent);
      color: var(--green);
    }
    .week-plan-strategy-note,
    .week-plan-dish-note {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .week-plan-meal-card.preopen-preview {
      border-style: dashed;
      border-color: color-mix(in srgb, var(--blue) 30%, var(--line));
      background: color-mix(in srgb, var(--blue-soft) 13%, var(--panel));
    }
    .week-plan-preopen-note {
      color: var(--muted);
      font-size: 11px;
      line-height: 1.4;
    }
    .week-plan-preopen-note strong { color: var(--text); }
    .week-plan-preopen-menu {
      border: 1px solid color-mix(in srgb, var(--blue) 20%, var(--line));
      border-radius: 7px;
      background: color-mix(in srgb, var(--blue-soft) 18%, var(--soft));
      overflow: hidden;
    }
    .week-plan-preopen-menu > summary {
      cursor: pointer;
      color: var(--text);
      font-size: 11px;
      font-weight: 750;
      line-height: 1.35;
      padding: 7px 8px;
      overflow-wrap: anywhere;
    }
    .week-plan-preopen-list {
      display: grid;
      gap: 5px;
      padding: 0 8px 8px;
    }
    .week-plan-preopen-item {
      display: grid;
      grid-template-columns: minmax(64px, auto) minmax(0, 1fr);
      gap: 2px 7px;
      align-items: start;
      border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
      padding-top: 5px;
      color: var(--muted);
      font-size: 11px;
      line-height: 1.35;
    }
    .week-plan-preopen-item strong { color: var(--text); }
    .week-plan-preopen-item span { overflow-wrap: anywhere; }
    .week-plan-preopen-item small {
      grid-column: 2;
      color: var(--muted);
      font-size: 10px;
    }
    .week-plan-preopen-empty {
      color: var(--muted);
      font-size: 11px;
    }
    .week-plan-calendar .week-plan-preopen-item {
      grid-template-columns: 1fr;
    }
    .week-plan-calendar .week-plan-preopen-item small { grid-column: 1; }
    .week-plan-dish-note strong { color: var(--text); font-weight: 750; }
    .week-plan-dish-note .tag {
      margin-left: 4px;
      padding: 1px 5px;
      font-size: 10px;
      line-height: 1.35;
      vertical-align: 1px;
    }
    .week-plan-calendar .week-plan-strategy-note {
      display: none;
    }
    .week-plan-calendar .week-plan-existing-order {
      padding: 6px;
      gap: 3px;
    }
    .week-plan-calendar .week-plan-edit-section {
      padding: 6px;
      gap: 6px;
    }
    .week-plan-calendar .week-plan-edit-section-head {
      font-size: 10px;
    }
    .week-plan-calendar .week-plan-existing-order-main {
      font-size: 12px;
      display: -webkit-box;
      line-clamp: 2;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .week-plan-calendar .week-plan-existing-order-sub {
      display: -webkit-box;
      line-clamp: 1;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .week-plan-calendar .week-plan-race-hint {
      padding: 5px 6px;
      font-size: 10px;
    }
    .week-plan-calendar .week-plan-dish-note {
      display: -webkit-box;
      line-clamp: 2;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .week-plan-day-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
    }
    .week-plan-day-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
      padding: 10px 12px;
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--panel-accent) 38%, var(--soft));
    }
    .week-plan-day-actions {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 6px;
    }
    .week-plan-day-title { font-size: 14px; font-weight: 800; }
    .week-plan-day-sub { color: var(--muted); font-size: 12px; }
    .week-plan-edit-toggle { display: none; }
    .week-plan-day-body {
      padding: 10px 12px 12px;
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
    }
    .week-plan-quick-pref {
      margin: 0 14px 10px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      overflow: hidden;
    }
    .week-plan-quick-pref > summary {
      cursor: pointer;
      padding: 9px 10px;
      list-style: none;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      font-size: 13px;
      font-weight: 750;
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--panel-accent) 24%, var(--panel));
    }
    .week-plan-quick-pref > summary::-webkit-details-marker { display: none; }
    .week-plan-quick-pref-body {
      padding: 10px;
      display: grid;
      gap: 10px;
    }
    .week-plan-quick-pref-toggles {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }
    .week-plan-quick-pref-grid {
      display: grid;
      gap: 8px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .week-plan-quick-pref-grid label {
      display: grid;
      gap: 4px;
      font-size: 12px;
      color: var(--muted);
      font-weight: 650;
    }
    .week-plan-quick-pref-grid input {
      width: 100%;
      min-height: 34px;
      border-radius: 8px;
      border: 1px solid var(--line);
      background: var(--panel);
      color: var(--text);
      padding: 0 10px;
      font-size: 13px;
      font-weight: 650;
    }
    .week-plan-quick-pref-grid .pref-widget {
      background: var(--soft);
      min-height: 0;
    }
    .week-plan-quick-pref-grid .pref-workbench {
      min-height: 150px;
    }
    .week-plan-quick-pref-grid .pref-col {
      min-height: 132px;
    }
    .week-plan-quick-pref-grid .pref-pool,
    .week-plan-quick-pref-grid .pref-selected {
      max-height: 180px;
    }
    .week-plan-quick-pref-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }
    .week-plan-meal-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 10px;
      display: grid;
      gap: 8px;
      min-height: 170px;
    }
    .week-plan-meal-card.drag-copying { opacity: .68; }
    .week-plan-meal-card.drop-allow { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31, 111, 235, .12); }
    .week-plan-meal-card.drop-deny { border-color: #efc1bc; background: var(--red-soft); }
    .week-plan-meal-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
    .week-plan-meal-name { font-size: 13px; font-weight: 750; }
    .week-plan-edit-section {
      border: 1px solid color-mix(in srgb, var(--line) 84%, transparent);
      border-radius: 8px;
      background: color-mix(in srgb, var(--panel) 62%, var(--soft));
      padding: 8px;
      display: grid;
      gap: 8px;
    }
    .week-plan-edit-section-head {
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 11px;
      font-weight: 850;
      letter-spacing: .01em;
    }
    .week-plan-meal-card.has-existing-order .week-plan-edit-section {
      border-color: color-mix(in srgb, var(--blue) 20%, var(--line));
      background: color-mix(in srgb, var(--panel) 74%, var(--blue-soft));
    }
    .week-plan-editors {
      display: grid;
      gap: 6px;
    }
    .week-plan-editor-line {
      display: grid;
      grid-template-columns: 58px 1fr;
      align-items: center;
      gap: 8px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
    }
    .week-plan-time-policy {
      display: grid;
      grid-template-columns: 58px minmax(0, 1fr);
      align-items: center;
      gap: 5px 8px;
      min-width: 0;
    }
    .week-plan-time-policy-label {
      color: var(--muted);
      font-size: 11px;
      font-weight: 750;
    }
    .week-plan-time-policy-options {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 3px;
      min-width: 0;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 3px;
    }
    .week-plan-time-policy-option {
      min-width: 0;
      min-height: 28px;
      border: 0;
      border-radius: 6px;
      background: transparent;
      color: var(--muted);
      padding: 3px 4px;
      font-size: 10px;
      font-weight: 800;
      line-height: 1.1;
      cursor: pointer;
    }
    .week-plan-time-policy-option:hover:not(:disabled),
    .week-plan-time-policy-option:focus-visible {
      background: var(--panel);
      color: var(--text);
    }
    .week-plan-time-policy-option.active {
      background: var(--blue-soft);
      color: var(--blue);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--blue) 28%, transparent);
    }
    .week-plan-time-policy-option:disabled {
      cursor: default;
      opacity: .58;
    }
    .week-plan-time-policy-summary {
      grid-column: 2;
      min-width: 0;
      color: var(--muted);
      font-size: 10px;
      line-height: 1.3;
      overflow-wrap: anywhere;
    }
    .week-plan-select {
      width: 100%;
      min-height: 34px;
      border-radius: 8px;
      border: 1px solid var(--line);
      background: var(--panel);
      color: var(--text);
      padding: 0 10px;
      font-size: 13px;
      font-weight: 650;
    }
    .week-plan-selected {
      border: 1px dashed var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 6px 8px;
      font-size: 12px;
      line-height: 1.4;
      overflow-wrap: anywhere;
      cursor: grab;
      user-select: none;
      touch-action: manipulation;
    }
    .week-plan-drag-hint {
      border-radius: 999px;
      border: 1px solid var(--line);
      background: var(--panel);
      color: var(--muted);
      font-size: 11px;
      font-weight: 700;
      padding: 2px 8px;
      display: inline-flex;
      align-items: center;
      gap: 4px;
    }
    .week-plan-selected-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      min-width: 0;
    }
    .week-plan-selected-tools {
      display: inline-flex;
      align-items: center;
      justify-content: flex-end;
      flex-wrap: wrap;
      gap: 4px;
      min-width: 0;
      transition: opacity .14s var(--ease-standard);
    }
    @media (hover: hover) and (pointer: fine) {
      .week-plan-meal-card:not(:hover):not(:focus-within) .week-plan-selected-tools {
        opacity: .46;
      }
    }
    .week-plan-selected-label {
      font-weight: 750;
      min-width: 0;
      display: block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .week-plan-clear-one {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--panel);
      color: var(--muted);
      font-size: 11px;
      font-weight: 700;
      padding: 2px 8px;
      min-height: 22px;
      white-space: nowrap;
    }
    .week-plan-clear-one:hover { color: var(--red); border-color: #efc1bc; background: var(--red-soft); }
    .week-plan-no-order-one,
    .week-plan-clear-one,
    .week-plan-drag-hint {
      line-height: 1.15;
    }
    .week-plan-selected-tools button {
      cursor: pointer;
    }
    .week-plan-no-order-one {
      border: 1px solid rgba(20, 184, 166, .42);
      border-radius: 999px;
      background: var(--green-soft);
      color: var(--green);
      font-size: 11px;
      font-weight: 800;
      padding: 2px 8px;
      min-height: 22px;
      white-space: nowrap;
    }
    .week-plan-no-order-one.is-active {
      border-color: rgba(239, 68, 68, .32);
      background: var(--red-soft);
      color: var(--red);
    }
    .week-plan-selected.empty { cursor: default; color: var(--muted); }
    .week-plan-selected.no-order {
      cursor: default;
      border-style: solid;
      color: var(--green);
      background: var(--green-soft);
    }
    .week-plan-selected.drag-active { border-color: var(--blue); background: var(--blue-soft); color: var(--blue); }
    .week-plan-note { color: var(--muted); font-size: 12px; line-height: 1.35; }
    .week-plan-candidate-details {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
    }
    .week-plan-candidate-details summary {
      cursor: pointer;
      padding: 6px 8px;
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
      list-style: none;
    }
    .week-plan-candidate-details summary::-webkit-details-marker { display: none; }
    .week-plan-candidate-list {
      border-top: 1px solid var(--line);
      padding: 6px 8px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
      display: grid;
      gap: 4px;
    }
    .week-plan-more-wrap { position: relative; }
    .week-plan-more-wrap summary {
      list-style: none;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }
    .week-plan-more-wrap summary::-webkit-details-marker { display: none; }
    .week-plan-more-menu {
      position: absolute;
      z-index: 12;
      right: 0;
      top: calc(100% + 6px);
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      box-shadow: var(--shadow-strong);
      padding: 6px;
      min-width: 230px;
      display: grid;
      gap: 6px;
    }
    .week-plan-more-menu .btn { justify-content: flex-start; width: 100%; min-height: 30px; }
    .menu-candidate-groups {
      padding: 4px 14px 12px;
      display: grid;
      gap: 10px;
    }
    .menu-candidate-group {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
    }
    .menu-candidate-head {
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--panel-accent) 34%, var(--soft));
      padding: 8px 10px;
      font-size: 12px;
      font-weight: 700;
      color: var(--muted);
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
    }
    .menu-candidate-items {
      padding: 8px 10px;
      display: grid;
      gap: 6px;
    }
    .menu-candidate-item {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 8px;
      display: grid;
      gap: 4px;
    }
    .menu-catalog-summary {
      display: grid;
      gap: 10px;
      padding: 4px 0;
    }
    .menu-catalog-meta {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 9px 10px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: wrap;
      color: var(--muted);
      font-size: 12px;
    }
    .menu-catalog-groups {
      display: grid;
      gap: 10px;
    }
    .menu-catalog-day {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
    }
    .menu-catalog-day-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 8px 10px;
      border-bottom: 1px solid var(--line);
      font-size: 12px;
      font-weight: 750;
      color: var(--muted);
      background: color-mix(in srgb, var(--panel-accent) 28%, var(--soft));
    }
    .menu-catalog-meals {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      padding: 8px;
    }
    .menu-catalog-meal {
      display: grid;
      gap: 6px;
      min-width: 0;
    }
    .menu-catalog-meal-title {
      color: var(--muted);
      font-size: 12px;
      font-weight: 750;
    }
    .menu-dish-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 8px;
      display: grid;
      gap: 4px;
      min-width: 0;
    }
    .menu-dish-card.missing-candidate {
      border-style: dashed;
      background: color-mix(in srgb, var(--soft) 72%, var(--panel));
    }
    .menu-dish-card.focused {
      border-color: var(--blue);
      box-shadow: 0 0 0 2px color-mix(in srgb, var(--blue) 22%, transparent);
    }
    .menu-dish-main {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      font-weight: 800;
      min-width: 0;
    }
    .menu-dish-main span:first-child,
    .menu-dish-text {
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .menu-dish-text {
      color: var(--text);
      line-height: 1.35;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }
    .menu-dish-sub {
      color: var(--muted);
      font-size: 12px;
      line-height: 1.35;
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      align-items: center;
    }
    @media (max-width: 760px) {
      .menu-catalog-meals { grid-template-columns: 1fr; }
      .menu-catalog-meta { align-items: stretch; }
    }
    .week-plan-day-summary {
      display: none;
      padding: 8px 12px 10px;
      color: var(--muted);
      font-size: 12px;
      border-top: 1px dashed var(--line);
      background: color-mix(in srgb, var(--soft) 60%, var(--panel));
    }
    .week-plan-mobile-bar {
      display: none;
      position: sticky;
      bottom: 0;
      z-index: 6;
      padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
      border-top: 1px solid var(--line);
      background: color-mix(in srgb, var(--panel) 95%, transparent);
      backdrop-filter: blur(8px);
      box-shadow: 0 -8px 20px rgba(0, 0, 0, .12);
      gap: 8px;
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    .week-plan-mobile-bar .btn { width: 100%; min-width: 0; }
    .week-plan-mobile-dirty {
      grid-column: 1 / -1;
      color: var(--muted);
      font-size: 12px;
      text-align: center;
    }
    .toast-stack {
      position: fixed;
      right: calc(14px + env(safe-area-inset-right));
      bottom: calc(18px + env(safe-area-inset-bottom));
      z-index: 30;
      display: grid;
      gap: 8px;
      pointer-events: none;
    }
    .toast {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--text);
      box-shadow: var(--shadow-strong);
      padding: 8px 10px;
      font-size: 12px;
      max-width: min(86vw, 300px);
      line-height: 1.4;
    }
    .toast.ok { border-color: #b9e0d0; background: var(--green-soft); color: var(--green); }
    .toast.warn { border-color: #efd39d; background: var(--amber-soft); color: var(--amber); }
    .toast.error { border-color: #efc1bc; background: var(--red-soft); color: var(--red); }
    .push-prompt-sheet {
      position: fixed;
      inset: 0;
      z-index: 55;
      display: none;
      align-items: end;
      justify-items: center;
      padding:
        calc(16px + env(safe-area-inset-top))
        calc(14px + env(safe-area-inset-right))
        calc(16px + env(safe-area-inset-bottom))
        calc(14px + env(safe-area-inset-left));
      background: color-mix(in srgb, #03070b 42%, transparent);
    }
    .push-prompt-sheet.show { display: grid; }
    .push-prompt-card {
      width: min(560px, 100%);
      max-height: min(82vh, calc(100vh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom)));
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      background: var(--panel);
      color: var(--text);
      box-shadow: var(--shadow-strong);
      overflow: hidden;
      animation: push-sheet-in .18s var(--ease-standard);
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
    }
    @keyframes push-sheet-in {
      from { opacity: 0; transform: translateY(14px) scale(.985); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }
    .push-prompt-head,
    .push-prompt-body,
    .push-prompt-foot { padding: 14px 16px; }
    .push-prompt-head {
      display: flex;
      justify-content: space-between;
      align-items: start;
      gap: 12px;
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--soft) 62%, var(--panel));
    }
    .push-prompt-title {
      display: grid;
      gap: 4px;
      min-width: 0;
    }
    .push-prompt-title strong {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 16px;
    }
    .push-prompt-title span {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.45;
    }
    .push-prompt-body {
      display: grid;
      gap: 10px;
      line-height: 1.55;
      overflow: auto;
    }
    .push-prompt-points {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
    }
    .push-prompt-message {
      border: 1px solid var(--line);
      border-radius: 10px;
      background: var(--soft);
      color: var(--muted);
      padding: 9px 10px;
      font-size: 13px;
      overflow-wrap: anywhere;
    }
    .push-prompt-message.ok { border-color: #b9e0d0; background: var(--green-soft); color: var(--green); }
    .push-prompt-message.warn { border-color: #efd39d; background: var(--amber-soft); color: var(--amber); }
    .push-prompt-message.error { border-color: #efc1bc; background: var(--red-soft); color: var(--red); }
    .push-prompt-foot {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      justify-content: flex-end;
      border-top: 1px solid var(--line);
    }
    @media (max-width: 760px) {
      .push-prompt-foot .btn {
        flex: 1 1 calc(50% - 8px);
        min-width: 0;
      }
      .push-prompt-foot #pushPromptPrimary {
        flex-basis: 100%;
      }
    }
    .quick-nav {
      position: fixed;
      right: 16px;
      bottom: calc(18px + env(safe-area-inset-bottom));
      z-index: 23;
      transition: left .16s ease, top .16s ease, right .16s ease, bottom .16s ease, transform .12s ease;
    }
    .quick-nav.hidden { display: none; }
    .quick-nav.positioned {
      left: var(--quick-nav-left);
      top: var(--quick-nav-top);
      right: auto;
      bottom: auto;
    }
    .quick-nav.dragging {
      transition: none;
      z-index: 35;
    }
    .quick-nav > summary {
      list-style: none;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--text);
      color: var(--panel);
      min-width: 46px;
      min-height: 46px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      box-shadow: var(--shadow-strong);
      cursor: pointer;
      touch-action: none;
      user-select: none;
      transition: transform .14s var(--ease-standard), box-shadow .14s var(--ease-standard), background .14s var(--ease-standard);
    }
    .quick-nav > summary:hover { transform: translateY(-1px); box-shadow: 0 18px 42px color-mix(in srgb, var(--text) 22%, transparent); }
    .quick-nav > summary::-webkit-details-marker { display: none; }
    .quick-nav-menu {
      position: fixed;
      left: var(--quick-nav-menu-left, 12px);
      top: var(--quick-nav-menu-top, 12px);
      right: auto;
      bottom: auto;
      display: grid;
      gap: 6px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      background: var(--panel);
      box-shadow: var(--shadow-strong);
      padding: 8px;
      min-width: 168px;
      max-width: min(210px, calc(100vw - 24px));
      max-height: var(--quick-nav-menu-max-height, min(70vh, 360px));
      overflow-y: auto;
      transform-origin: var(--quick-nav-menu-origin, bottom right);
      animation: menu-pop .14s var(--ease-standard);
    }
    @keyframes menu-pop {
      from { opacity: 0; transform: translateY(4px) scale(.98); }
      to { opacity: 1; transform: translateY(0) scale(1); }
    }
    .quick-nav:not([open]) .quick-nav-menu { display: none; }
    .quick-nav-menu .btn { justify-content: flex-start; width: 100%; }
    .quick-nav-menu-separator { height: 1px; background: var(--line); margin: 2px 0; }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
      }
    }
    .menu-compare-layout {
      padding: 0;
      display: grid;
      gap: 8px;
      min-height: 0;
      overflow: auto;
    }
    .menu-compare-left { display: grid; gap: 8px; }
    .menu-candidate-title {
      padding: 0;
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
    }
    .menu-compare-guide {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      overflow: hidden;
    }
    .menu-guide-box { padding: 10px; }
    .menu-guide-frame { min-height: 180px; max-height: 320px; overflow: auto; }
    .menu-guide-frame img { max-height: 300px; width: 100%; object-fit: contain; }
    .ocr-status-bar {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--muted);
      font-size: 12px;
      padding: 8px 10px;
      line-height: 1.45;
    }
    .ocr-tools {
      display: grid;
      grid-template-columns: 1fr;
      gap: 8px;
    }
    .ocr-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }
    .ocr-actions select {
      height: 32px;
      min-width: 142px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--text);
      padding: 0 8px;
    }
    .ocr-draft-wrap {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      overflow: hidden;
      min-height: 120px;
    }
    .ocr-draft-head {
      border-bottom: 1px solid var(--line);
      padding: 8px 10px;
      font-size: 12px;
      color: var(--muted);
      background: color-mix(in srgb, var(--panel-accent) 22%, var(--panel));
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 8px;
    }
    .ocr-draft-grid {
      padding: 8px;
      display: grid;
      gap: 8px;
      max-height: 260px;
      overflow: auto;
    }
    .ocr-draft-day {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 8px;
      display: grid;
      gap: 8px;
    }
    .ocr-draft-day-title {
      font-size: 12px;
      font-weight: 750;
      color: var(--text);
    }
    .ocr-draft-cell {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      padding: 8px;
      display: grid;
      gap: 6px;
    }
    .ocr-draft-dish {
      font-size: 12px;
      color: var(--muted);
      line-height: 1.35;
      overflow-wrap: anywhere;
    }
    .ocr-draft-cell label {
      display: grid;
      gap: 4px;
      font-size: 12px;
      color: var(--muted);
      font-weight: 650;
    }
    .ocr-draft-cell select {
      width: 100%;
      height: 32px;
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--panel);
      color: var(--text);
      padding: 0 8px;
    }
    .ops-latest-card {
      border: 1px solid var(--line);
      border-radius: 8px;
      background: var(--soft);
      padding: 12px;
      display: grid;
      gap: 8px;
    }
    .ops-latest-main { font-size: 14px; font-weight: 750; }
    .ops-latest-sub { color: var(--muted); font-size: 12px; line-height: 1.4; }
    .menu-grid { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 10px; }
    .meal-card { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); padding: 11px; display: grid; gap: 8px; }
    .meal-food { font-weight: 700; line-height: 1.35; }
    .meal-time { color: var(--blue); font-weight: 750; }
    .actions { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 14px; border-top: 1px solid var(--line); }
    details.panel summary { cursor: pointer; padding: 12px 14px; font-weight: 650; }
    .console { height: 260px; overflow: auto; border-top: 1px solid var(--line); background: #0f1720; color: #d8e2ea; font: 13px/1.55 "Cascadia Mono", Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere; padding: 14px; }
    .command { font: 12px/1.5 "Cascadia Mono", Consolas, monospace; background: var(--soft); border: 1px solid var(--line); border-radius: 6px; padding: 9px; color: var(--text); white-space: pre-wrap; overflow-wrap: anywhere; }
    .advanced-command { border: 1px solid var(--line); border-radius: 8px; background: var(--soft); overflow: hidden; }
    .advanced-command summary { cursor: pointer; padding: 10px 12px; color: var(--muted); font-weight: 650; font-size: 13px; }
    .advanced-command .command { border: 0; border-top: 1px solid var(--line); border-radius: 0; background: var(--panel); }
    .ops-summary { display: flex; flex-wrap: wrap; gap: 7px; }
    .ops-chip {
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--soft);
      color: var(--text);
      font-size: 12px;
      font-weight: 650;
      padding: 4px 9px;
      line-height: 1.2;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 24px;
      min-width: 0;
      text-align: center;
    }
    .ops-chip.primary { background: var(--blue-soft); color: var(--blue); border-color: #bbd3fb; }
    .ops-chip.success { background: var(--green-soft); color: var(--green); border-color: #b9e0d0; }
    .ops-chip.warn { background: var(--amber-soft); color: var(--amber); border-color: #efd39d; }
    .fold-panel { overflow: hidden; }
    .fold-summary {
      cursor: pointer;
      list-style: none;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      padding: 11px 14px;
      font-weight: 700;
      border-bottom: 1px solid var(--line);
      background: color-mix(in srgb, var(--soft) 45%, var(--panel));
    }
    .fold-summary::-webkit-details-marker { display: none; }
    .fold-summary .left { display: inline-flex; align-items: center; gap: 8px; }
    .fold-summary .right {
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
      border: 1px solid var(--line);
      border-radius: 999px;
      padding: 2px 8px;
      background: var(--panel);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 22px;
      line-height: 1.1;
    }
    .fold-body { padding: 0; }
    @media (max-width: 1100px) {
      .toolbar { grid-template-columns: 1fr 1fr; grid-template-areas: "user date" "actions refresh"; }
      .toolbar-actions.quick-actions .btn { flex: 1 1 148px; }
      .quick-more { min-width: 148px; }
      .strategy-mode-grid,
      .strategy-control-grid,
      .run-wizard-steps { grid-template-columns: 1fr; }
      .strategy-mode-card { min-height: auto; }
      .automation, .readiness { grid-template-columns: 1fr 1fr; }
      .grid, .onboarding-grid { grid-template-columns: 1fr; }
      .quick-entry { grid-template-columns: 1fr; }
      .run-status-grid { grid-template-columns: 1fr; }
      .week-plan-calendar { grid-template-columns: 82px repeat(var(--week-days, 5), minmax(0, 1fr)); }
      .week-plan-split { grid-template-columns: 1fr; }
      .week-plan-split.has-menu-drawer { grid-template-columns: 1fr; }
      .week-plan-split.has-menu-drawer .week-plan-secondary {
        left: 12px !important;
        right: 12px !important;
        top: auto !important;
        bottom: calc(12px + env(safe-area-inset-bottom));
        width: auto;
        max-height: min(72vh, 680px);
      }
      .week-plan-split.has-menu-drawer .menu-compare-layout {
        max-height: calc(72vh - 92px);
        padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important;
      }
      .week-plan-secondary { order: 2; max-height: none; }
      .week-plan-board { grid-template-columns: 1fr; }
    }
    @media (max-width: 680px) {
      .auth-recovery-notice {
        width: calc(100% - 20px);
        margin-top: 8px;
        padding: 11px;
        align-items: stretch;
        flex-direction: column;
        gap: 10px;
      }
      .auth-recovery-actions {
        width: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      }
      .auth-recovery-actions .btn { width: 100%; min-width: 0; }
      header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
          "brand actions"
          "summary summary";
        align-items: center;
        column-gap: 8px;
        row-gap: 5px;
        padding: calc(5px + env(safe-area-inset-top)) 10px 7px;
      }
      .logo { width: 30px; height: 30px; border-radius: 8px; }
      .logo .icon { width: 17px; height: 17px; }
      h1 { font-size: 15px; }
      .title-full { display: none; }
      .title-short { display: inline; }
      .brand { grid-area: brand; gap: 7px; min-width: 0; }
      .header-live-summary {
        grid-area: summary;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 7px;
        min-width: 0;
        width: 100%;
        min-height: 24px;
      }
      .header-meal-summary {
        max-width: none;
        flex: 1 1 auto;
        font-size: 12px;
        line-height: 1.25;
      }
      .header-push-chip {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        max-width: 96px;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .header-actions { grid-area: actions; justify-content: flex-end; flex-wrap: nowrap; gap: 6px; }
      .header-actions > .state {
        display: none;
      }
      .header-more > summary { display: inline-flex; }
      .header-more > summary.btn.small {
        min-height: 30px;
        padding: 0 8px;
        gap: 4px;
      }
      .header-more-menu {
        display: none;
        position: absolute;
        top: calc(100% + 8px);
        right: 0;
        z-index: 30;
        min-width: 238px;
        max-width: calc(100vw - 28px);
        padding: 10px;
        border: 1px solid var(--line);
        border-radius: 8px;
        background: var(--panel);
        box-shadow: var(--shadow-strong);
        align-items: stretch;
        justify-content: stretch;
      }
      .header-more[open] .header-more-menu { display: grid; }
      .header-more-menu .btn,
      .header-more-menu .font-controls { width: 100%; }
      .header-more-menu .font-controls .btn { flex: 1 1 0; }
      body[data-standalone-pwa="1"] #installPwa { display: none !important; }
      .toolbar { display: grid; align-items: stretch; }
      .toolbar {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-areas: "user date";
        gap: 8px;
        padding: 8px;
        overflow: hidden;
      }
      .toolbar-actions.quick-actions { display: none; }
      .toolbar-refresh { display: none; }
      .cards, .timeline, .automation, .readiness, .form-grid, .advanced-grid, .dashboard-summary, .dashboard-mission-grid, .gateway-overview, .guide-steps, .final-summary-row { grid-template-columns: 1fr; }
      .final-meal-row { grid-template-columns: 1fr; }
      .task-panel .actions, .quick-actions, .refresh-controls { width: 100%; }
      .task-panel .actions .btn, .quick-actions .btn { flex: 1 1 132px; }
      #adminPushSettingsPanel .quick-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
      }
      #adminPushSettingsPanel .quick-actions .btn {
        width: 100%;
        min-width: 0;
        flex: 1 1 auto;
      }
      #adminPushSettingsPanel .check.switch {
        width: 100%;
        white-space: normal;
        align-items: flex-start;
      }
      .toolbar-actions.quick-actions .btn, .toolbar-actions.quick-actions .quick-more { min-width: 0; flex: 1 1 calc(50% - 4px); }
      .quick-more-menu { position: static; min-width: 0; margin-top: 6px; box-shadow: none; }
      .refresh-controls { grid-template-columns: 1fr; }
      .refresh-controls .check,
      .refresh-controls .mini-select { display: none; }
      #refreshAll { grid-column: auto; }
      .onboarding .head { display: grid; grid-template-columns: 1fr; align-items: stretch; }
      .onboarding .quick-actions .btn { flex-basis: 100%; }
      .btn { white-space: normal; height: auto; padding-top: 8px; padding-bottom: 8px; line-height: 1.25; }
      .btn.small { height: auto; min-height: 31px; }
      .btn span { white-space: normal; overflow-wrap: anywhere; text-align: center; }
      .app-update-notice {
        position: static;
        left: auto;
        right: auto;
        bottom: auto;
        width: min(286px, calc(100vw - 20px - env(safe-area-inset-left) - env(safe-area-inset-right)));
        margin: 6px 10px -2px auto;
        display: none;
        align-items: center;
        flex-wrap: nowrap;
      }
      .app-update-notice.show { display: flex; }
      .app-update-notice > span:first-child {
        flex: 1 1 auto;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .app-update-notice .notice-actions {
        width: auto;
        display: inline-flex;
      }
      .app-update-notice .notice-actions .btn {
        width: auto;
        min-width: 0;
      }
      .pref-editor-grid, .pref-workbench { grid-template-columns: 1fr; }
      .refresh-group { justify-items: start; }
      .mini-note { text-align: left; }
      .nav-tabs {
        position: static;
        top: auto;
        left: auto;
        right: auto;
        bottom: auto;
        z-index: 4;
        justify-content: stretch;
        box-shadow: none;
        margin: 0;
      }
      .tab-btn { flex: 1 1 0; min-width: 0; padding: 0 8px; }
      .menu-guide-frame img { max-height: 280px; }
      main { padding: 10px 12px calc(24px + env(safe-area-inset-bottom)); gap: 10px; }
      .primary-field label { font-size: 11px; }
      .primary-field select,
      .primary-field input[type="date"] {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        height: 38px;
        font-size: 12px;
        min-width: 0;
        text-align: center;
        padding: 0 3px;
        overflow: hidden;
        text-overflow: ellipsis;
        letter-spacing: 0;
      }
      .primary-field input[type="date"]::-webkit-date-and-time-value {
        text-align: center;
        min-width: 0;
        padding: 0;
        margin: 0;
      }
      .nav-tabs { padding: 6px; gap: 4px; }
      .tab-btn { height: 32px; padding: 0 7px; }
      .quick-entry { padding: 10px 10px calc(20px + env(safe-area-inset-bottom)); gap: 10px; }
      .mobile-sync-strip {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px;
        align-items: center;
        margin: 0 10px 10px;
        padding: 8px 10px;
        border: 1px solid var(--line);
        border-radius: 12px;
        background: color-mix(in srgb, var(--panel-accent) 40%, var(--panel));
      }
      .mobile-sync-main {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
        overflow: hidden;
      }
      #mobileSyncText {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      #dashboardPushStatusChip {
        justify-self: start;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      #mobileSyncRefresh {
        grid-column: 2;
        grid-row: 1 / span 2;
      }
      .quick-entry-card { min-height: 0; }
      .quick-qr-card { order: 1; }
      .quick-meal-card { order: 2; }
      .quick-entry-title { font-size: 15px; }
      .quick-entry-head { align-items: flex-start; }
      .quick-qr-tools { justify-content: flex-start; }
      #quickEntryPanel > .head { display: none; }
      .quick-qr-card { padding: 10px; }
      .quick-qr-wrap { min-height: 168px; }
      .quick-qr-wrap img { width: min(210px, 70vw); height: min(210px, 70vw); }
      .pickup-mode {
        padding:
          calc(10px + env(safe-area-inset-top))
          calc(10px + env(safe-area-inset-right))
          calc(14px + env(safe-area-inset-bottom))
          calc(10px + env(safe-area-inset-left));
      }
      .pickup-mode-card { gap: 10px; }
      .pickup-mode-head,
      .pickup-mode-foot {
        align-items: stretch;
      }
      .pickup-mode-head { flex-direction: column; }
      .pickup-mode-foot {
        display: grid;
        grid-template-columns: 1fr 1fr;
      }
      .pickup-mode-foot .pickup-mode-meta {
        grid-column: 1 / -1;
        order: 2;
      }
      .pickup-mode-body {
        border-radius: 14px;
        padding: 14px;
      }
      .quick-meal-main { font-size: 18px; }
      .run-status-card { gap: 8px; }
      .run-status-grid { gap: 8px; }
      #dashboardRunStatusPanel .metric { min-height: 0; padding: 10px; }
      .run-status-meta { font-size: 13px; }
      .admin-auth-grid { grid-template-columns: 1fr; }
      .admin-summary-grid { grid-template-columns: 1fr; }
      .failover-control-grid { grid-template-columns: 1fr; padding: 10px; }
      .failover-status-card .meta-grid { grid-template-columns: 1fr; }
      .desired-strategy-inline {
        grid-template-columns: 1fr;
        margin-inline: 10px;
        padding: 8px 10px;
        gap: 6px;
      }
      .desired-strategy-inline .btn { display: none; }
      .desired-strategy-inline #desiredStrategyChips { display: none; }
      .desired-strategy-inline .desired-strategy-main {
        grid-template-columns: auto 1fr;
        align-items: center;
      }
      .desired-strategy-inline .desired-strategy-main strong {
        font-size: 13px;
        white-space: nowrap;
      }
      .desired-strategy-inline .desired-strategy-main .sub {
        font-size: 12px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .desired-strategy-form { grid-template-columns: 1fr; }
      .week-plan-tip { margin: 0 0 8px; }
      .week-plan-day-head { align-items: start; }
      .week-plan-edit-toggle { display: inline-flex; }
      .week-plan-day-card:not(.expanded) .week-plan-day-body { display: none; }
      .week-plan-day-card:not(.expanded) .week-plan-day-summary { display: block; }
      .week-plan-mobile-bar {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        bottom: calc(10px + env(safe-area-inset-bottom));
        border-radius: 12px;
        margin: 0 4px;
        padding: 8px;
      }
      .week-plan-mobile-bar .week-plan-mobile-more { min-width: 0; }
      .week-plan-mobile-bar .week-plan-mobile-more > summary {
        width: 100%;
        justify-content: center;
      }
      .week-plan-mobile-menu {
        position: absolute;
        left: 10px;
        right: 10px;
        bottom: calc(100% + 8px);
        display: grid;
        gap: 6px;
        padding: 8px;
        border: 1px solid var(--line);
        border-radius: 10px;
        background: var(--panel);
        box-shadow: var(--shadow-strong);
      }
      .week-plan-mobile-menu .btn { width: 100%; }
      .week-plan-mobile-more:not([open]) .week-plan-mobile-menu { display: none; }
      .week-plan-toolbar {
        padding: 0 10px 8px;
        margin-bottom: 8px;
        gap: 6px;
      }
      .week-plan-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
      }
      .week-plan-actions > .btn,
      .week-plan-actions > .week-plan-more-wrap {
        min-width: 0;
        width: 100%;
      }
      .week-plan-actions > .week-plan-more-wrap summary {
        width: 100%;
        justify-content: center;
      }
      #writebackPreferences,
      #toggleWeekPlanMenuDrawer {
        display: none;
      }
      .week-plan-split { padding: 0 10px 12px; }
      .week-plan-secondary { border-style: dashed; }
      .week-plan-ocr-primary { margin: 0 10px; }
      .week-plan-main { padding-bottom: calc(112px + env(safe-area-inset-bottom)); }
      .week-plan-meta {
        width: 100%;
        min-width: 0;
        justify-content: flex-start;
        overflow: hidden;
      }
      .week-plan-meta-info { min-width: 0; width: 100%; order: 10; }
      .week-plan-cycle-pill { width: 100%; max-width: 100%; min-width: 0; }
      .week-plan-view-filter,
      .week-plan-view-switch,
      .week-plan-loaded {
        display: none;
      }
      .week-plan-cycle-switch {
        width: 100%;
      }
      .week-plan-cycle-switch .week-plan-layout-btn {
        flex: 1 1 0;
      }
      #state.state {
        overflow-wrap: anywhere;
      }
      .week-plan-more-menu { position: static; min-width: 0; margin-top: 6px; box-shadow: none; }
      .week-plan-editor-line { grid-template-columns: 1fr; gap: 4px; }
      .week-plan-time-policy {
        grid-template-columns: 1fr;
        gap: 4px;
      }
      .week-plan-time-policy-summary { grid-column: 1; }
      .week-plan-drag-hint { display: none; }
      .week-plan-candidate-details { display: none; }
      .week-plan-context { width: 100%; justify-content: flex-start; margin-left: 0; }
      .week-plan-quick-pref { margin: 0 10px 8px; }
      .week-plan-quick-pref-grid { grid-template-columns: 1fr; }
      .ocr-actions { display: grid; grid-template-columns: 1fr 1fr; }
      .ocr-actions .btn { width: 100%; min-width: 0; }
      .ocr-actions select { grid-column: 1 / -1; width: 100%; min-width: 0; }
      .ocr-draft-grid { max-height: none; }
      .toast-stack { left: 10px; right: 10px; bottom: calc(84px + env(safe-area-inset-bottom)); }
      .quick-nav {
        right: 16px;
        bottom: calc(98px + env(safe-area-inset-bottom));
      }
      .quick-nav.positioned {
        left: var(--quick-nav-left);
        top: var(--quick-nav-top);
        right: auto;
        bottom: auto;
      }
      .nav-tabs {
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0;
        overflow: hidden;
        box-sizing: border-box;
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        justify-items: center;
        align-items: center;
      }
      .nav-tabs .tab-btn {
        width: 100%;
        justify-content: center;
        gap: 4px;
        text-align: center;
        min-height: 38px;
        line-height: 1;
      }
      #tab-dashboard > * { order: 20; }
      #todayOrderPanel { order: 1; }
      #quickEntryPanel { order: 2; }
      .today-current-orders {
        margin-inline: 10px;
        margin-bottom: 10px;
      }
      .today-current-orders .current-head {
        padding: 9px 10px;
      }
      .today-current-orders .current-list {
        padding: 9px 10px 10px;
      }
      .today-current-order-card {
        grid-template-columns: 1fr;
      }
      .today-current-order-actions {
        justify-content: stretch;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .today-current-order-actions .btn {
        width: 100%;
        min-width: 0;
        justify-content: center;
      }
      #mobileSyncStrip {
        order: 3;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 8px;
        padding: 9px 10px;
        border-radius: 12px;
        border: 1px solid var(--line);
        background: color-mix(in srgb, var(--panel-accent) 54%, var(--panel));
        color: var(--muted);
        font-size: 12px;
        min-width: 0;
      }
      #mobileSyncStrip .mobile-sync-main {
        grid-column: 1;
        grid-row: 1;
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 7px;
        overflow: hidden;
      }
      #mobileSyncText {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      #mobileSyncStrip .mobile-sync-chips {
        grid-column: 1;
        grid-row: 2;
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 6px;
        overflow: hidden;
      }
      #dashboardAutoOrderStatusChip,
      #dashboardPushStatusChip {
        min-width: 0;
        max-width: 50%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      #mobileSyncRefresh {
        grid-column: 2;
        grid-row: 1 / span 2;
        min-width: 72px;
      }
      #dashboardMoreStatusPanel { order: 8; }
      #dashboardRunStatusPanel { order: 8; }
      #dashboardMissionGrid { display: none; }
      #firstRunGuide,
      #connectionPanel,
      #dashboardTodayPanel,
      #dashboardAutomationPanel,
      #dashboardReadinessPanel,
      #dashboardOverviewPanel {
        display: none;
      }
      #connectionPanel,
      #firstRunGuide,
      #gatewaySummaryPrimaryUrl,
      #copyGatewayPrimary { font-size: 13px; }
      .quick-qr-card { order: 1; }
      .quick-meal-card { order: 2; }
      #quickEntryPanel {
        display: grid;
      }
      #quickEntryPanel > .quick-entry {
        order: 1;
      }
      .quick-entry { padding-bottom: 12px; margin-bottom: 8px; }
      .quick-meal-card { display: none; }
      .today-order-summary {
        padding: 0 10px 10px;
        gap: 8px;
      }
      .today-order-nav {
        grid-template-columns: minmax(0, 1fr);
        padding: 8px 10px 0;
      }
      .today-order-nav .btn {
        display: none;
      }
      .today-order-date-strip {
        padding-bottom: 4px;
      }
      .today-date-chip {
        min-width: 74px;
      }
      .today-order-card {
        padding: 10px;
        gap: 7px;
      }
      .today-order-main { font-size: 15px; }
      .today-order-content {
        padding: 7px 9px;
        font-size: 12.5px;
      }
      .app-update-notice {
        position: static;
        left: auto;
        right: auto;
        bottom: auto;
        top: auto;
        width: min(286px, calc(100vw - 20px - env(safe-area-inset-left) - env(safe-area-inset-right)));
        margin: 6px 10px -2px auto;
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
        padding: 7px 8px;
        font-size: 12px;
      }
      .app-update-notice .btn { width: auto; min-width: 0; }
    }
    @media (max-width: 380px) {
      .toolbar {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
          "user"
          "date";
      }
      .header-push-chip { max-width: 82px; }
    }