    /* v0.1.04: approved screen architecture and navigation polish */
    body.architecture-v0104 {
      --page-max: 1080px;
    }

    body.architecture-v0104 .app {
      max-width: var(--page-max);
    }

    .page-shell {
      display: grid;
      gap: 12px;
    }

    .page-heading {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      margin-bottom: 2px;
    }

    .page-heading h2,
    .page-heading h3 {
      margin: 0;
    }

    .page-kicker {
      color: var(--accent);
      font-size: .72rem;
      font-weight: 900;
      letter-spacing: .1em;
      text-transform: uppercase;
      margin-bottom: 4px;
    }

    .mode-hub-utilities,
    .page-toolbar,
    .archive-nav,
    .run-primary-nav,
    .room-toolbar,
    .setup-progress {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
    }

    .mode-hub-utilities {
      justify-content: center;
      margin-top: 12px;
    }

    .hub-skin-toggle {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 6px;
      color: var(--muted);
      font-size: .72rem;
      font-weight: 800;
      letter-spacing: .06em;
      text-transform: uppercase;
    }

    .hub-skin-toggle button {
      width: auto;
      min-height: 32px;
      padding: 5px 10px;
      font-size: .72rem;
    }

    .hub-skin-toggle button.active {
      border-color: var(--accent);
      color: var(--heading);
      box-shadow: inset 0 0 0 1px rgba(217,255,143,.14);
    }

    body.experimental-hub-visible {
      min-height: 100vh;
      background: #070a08;
    }

    body.experimental-hub-visible::before {
      content: "";
      position: fixed;
      inset: 0;
      z-index: -2;
      pointer-events: none;
      background:
        linear-gradient(90deg, rgba(4,7,6,.42) 0%, rgba(5,8,7,.18) 48%, rgba(5,7,7,.32) 100%),
        radial-gradient(circle at 18% 22%, rgba(100,185,68,.08), transparent 35%),
        radial-gradient(circle at 82% 28%, rgba(135,58,220,.07), transparent 32%),
        radial-gradient(circle at 70% 82%, rgba(226,147,52,.06), transparent 34%),
        url("../assets/hub/myco-hub-background.webp") center / cover no-repeat,
        linear-gradient(145deg, #17251b, #090c0b 52%, #21170e);
    }

    body.experimental-hub-visible::after {
      content: "";
      position: fixed;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      background: linear-gradient(180deg, rgba(0,0,0,.02), rgba(0,0,0,.26));
    }

    body.experimental-hub-visible > .app > #gameTitle,
    body.experimental-hub-visible > .app > .subtitle { display: none; }

    body.experimental-hub-visible .app { max-width: 1180px; }

    body.experimental-hub-visible #modeSelectPanel {
      min-height: calc(100vh - 32px);
      display: grid;
      align-items: center;
      margin: 0;
      padding: clamp(18px, 4vw, 52px);
      border-color: rgba(255,255,255,.13);
      background: rgba(6,10,8,.14);
      box-shadow: 0 30px 80px rgba(0,0,0,.5);
      backdrop-filter: saturate(1.08);
      -webkit-backdrop-filter: saturate(1.08);
    }

    .hub-shell-experimental { gap: clamp(18px, 3vw, 34px); }

    .experimental-hub-brand {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
    }

    .experimental-logo > span {
      display: block;
      color: #f4f8ed;
      font-size: clamp(2.2rem, 7vw, 5.6rem);
      font-weight: 950;
      line-height: .82;
      letter-spacing: -.06em;
      text-shadow: 0 4px 30px rgba(0,0,0,.85);
    }

    .experimental-logo > small {
      display: block;
      margin-top: 10px;
      color: #cbd3c6;
      font-size: clamp(.64rem, 1.4vw, .9rem);
      font-weight: 850;
      letter-spacing: .18em;
      text-transform: uppercase;
    }

    .experimental-version { color: #c5cec0; font: 750 .75rem var(--log-font); }
    .experimental-hub-intro h2 { margin: 0; font-size: clamp(1.5rem, 3vw, 2.4rem); }
    .experimental-hub-intro p { max-width: 600px; margin: 7px 0 0; color: #c5cec0; line-height: 1.5; }

    .experimental-mode-grid { gap: 14px; }

    .experimental-mode-grid .experimental-mode-card {
      --mode-accent: #8edb6a;
      position: relative;
      z-index: 1;
      min-height: 230px;
      padding: 22px;
      border-color: color-mix(in srgb, var(--mode-accent) 48%, rgba(255,255,255,.12));
      background: linear-gradient(155deg, color-mix(in srgb, var(--mode-accent) 13%, rgba(10,14,12,.88)), rgba(7,10,9,.84));
      box-shadow: 0 18px 38px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.06);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }

    .experimental-mode-grid .experimental-mode-card > * {
      pointer-events: none;
    }

    .experimental-mode-grid .mode-arcade { --mode-accent: #a967ff; }
    .experimental-mode-grid .mode-career { --mode-accent: #e4a24c; opacity: .72; }
    .experimental-mode-grid .mode-card-title { margin: 18px 0 9px; font-size: clamp(1.45rem, 3vw, 2.15rem); }
    .experimental-mode-grid .mode-status-line { color: #cbd2c7; font-size: .86rem; line-height: 1.5; }
    .experimental-mode-grid .mode-card-tag { margin-top: 22px; border-color: var(--mode-accent); color: var(--mode-accent); }
    .mode-card-eyebrow { color: var(--mode-accent); font-size: .69rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
    .experimental-hub-utilities { justify-content: flex-start; margin-top: 0; }
    .experimental-hub-utilities button { background: rgba(8,12,10,.66); }

    .mode-hub-utilities button,
    .page-toolbar button,
    .archive-nav button,
    .run-primary-nav button,
    .room-toolbar button,
    .setup-progress button {
      min-height: 40px;
      width: auto;
      padding: 8px 12px;
    }

    .mode-ready-grid .mode-card-button {
      text-align: left;
      min-height: 112px;
      padding: 16px;
    }

    .mode-card-title {
      display: block;
      color: var(--heading);
      font-size: 1.05rem;
      font-weight: 900;
      margin-bottom: 6px;
    }

    .mode-card-tag {
      display: inline-flex;
      margin-top: 8px;
      padding: 3px 7px;
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 999px;
      color: var(--muted);
      font-size: .68rem;
      letter-spacing: .05em;
      text-transform: uppercase;
    }

    .classic-home-primary {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .classic-home-secondary {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
      gap: 10px;
    }

    .destination-card {
      display: flex;
      flex-direction: column;
      min-height: 150px;
    }

    .destination-card button {
      margin-top: auto;
      width: 100%;
    }

    .run-snapshot-grid,
    .essential-stats-grid,
    .dashboard-preview-grid,
    .setup-summary-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(110px, 1fr));
      gap: 8px;
    }

    .run-snapshot-item,
    .essential-stat,
    .setup-summary-item {
      padding: 9px 10px;
      border: 1px solid rgba(255,255,255,.09);
      border-radius: 10px;
      background: rgba(0,0,0,.17);
    }

    .run-snapshot-item b,
    .essential-stat b,
    .setup-summary-item b {
      display: block;
      margin-top: 2px;
      color: var(--heading);
      font-size: .98rem;
    }

    .archive-nav,
    .run-primary-nav,
    .setup-progress {
      position: sticky;
      top: 6px;
      z-index: 25;
      padding: 8px;
      border: 1px solid var(--border);
      border-radius: 13px;
      background: color-mix(in srgb, var(--panel) 93%, transparent);
      box-shadow: 0 8px 20px rgba(0,0,0,.24);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
    }

    .archive-nav button.active,
    .run-primary-nav button.active,
    .setup-progress button.active {
      border-color: var(--accent);
      color: var(--accent);
      box-shadow: inset 0 0 0 1px rgba(217,255,143,.16);
    }

    .classic-page-note {
      margin: 0;
      color: var(--muted);
      line-height: 1.45;
    }

    .setup-step {
      border: 1px solid var(--border);
      border-radius: 14px;
      background: rgba(29,36,25,.92);
      overflow: clip;
    }

    .setup-step > summary {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      align-items: center;
      padding: 13px 14px;
      cursor: pointer;
      list-style: none;
      font-weight: 900;
    }

    .setup-step > summary::-webkit-details-marker { display: none; }
    .setup-step > summary::before {
      content: "▶";
      color: var(--accent);
      margin-right: 7px;
    }
    .setup-step[open] > summary::before { content: "▼"; }

    .setup-step-content {
      padding: 0 12px 12px;
      display: grid;
      gap: 9px;
    }

    .setup-choice-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 9px;
    }

    .setup-choice-grid .character-card.selected-choice {
      border-color: var(--accent);
      box-shadow: 0 0 0 1px rgba(217,255,143,.16), 0 10px 24px rgba(0,0,0,.25);
    }

    .setup-final-card {
      border-color: rgba(217,255,143,.45);
      background: linear-gradient(180deg, rgba(49,67,37,.92), rgba(20,28,16,.96));
    }

    #runArchitectureHeader {
      display: grid;
      gap: 10px;
      margin-bottom: 12px;
    }

    #runEssentialStats {
      margin-bottom: 0;
    }

    .run-essential-stats {
      display: grid;
      gap: 8px;
    }

    #moreRunStatsDisclosure {
      border: 0;
      background: transparent;
    }

    #moreRunStatsDisclosure > summary {
      display: none;
    }

    #moreRunStatsDisclosure > .essential-stats-grid {
      margin: 0;
    }

    #detailedStatsDisclosure {
      border: 1px solid var(--border);
      border-radius: 13px;
      background: rgba(19,25,17,.78);
      overflow: hidden;
    }

    #detailedStatsDisclosure > summary {
      cursor: pointer;
      padding: 10px 12px;
      font-weight: 850;
      color: var(--muted);
    }

    #detailedStatsDisclosure #stats {
      padding: 0 10px 10px;
      margin: 0;
    }

    .run-screen {
      display: grid;
      gap: 12px;
    }

    .run-screen.hidden { display: none !important; }

    .room-intro {
      padding: 12px;
      border: 1px solid var(--border);
      border-radius: 14px;
      background: rgba(18,26,16,.72);
    }

    .room-intro .card-title { margin-bottom: 4px; }

    .room-toolbar {
      margin-top: 9px;
    }

    .dashboard-preview-grid {
      grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    }

    .dashboard-preview-card {
      min-height: 150px;
    }

    .mobile-dashboard-disclosure > summary {
      list-style: none;
      cursor: default;
    }

    .mobile-dashboard-disclosure > summary::-webkit-details-marker {
      display: none;
    }

    .preview-list {
      display: grid;
      gap: 6px;
      margin: 8px 0;
    }

    .preview-row {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      padding: 7px 8px;
      border: 1px solid rgba(255,255,255,.07);
      border-radius: 9px;
      background: rgba(0,0,0,.15);
      font-size: .82rem;
    }

    body.architecture-v0104 #gameUI > .grid {
      display: none !important;
    }

    body.architecture-v0104 #actionsPanel .action-drawer {
      display: none !important;
    }

    #runRoomShortcuts {
      margin-top: 10px;
    }

    .run-room-shortcuts-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
      gap: 8px;
    }

    .archive-content > .card:first-child,
    .page-content > .card:first-child {
      margin-top: 0;
    }

    .collapsible-info {
      border: 1px solid rgba(255,255,255,.09);
      border-radius: 11px;
      background: rgba(0,0,0,.14);
      overflow: hidden;
    }

    .collapsible-info > summary {
      cursor: pointer;
      padding: 10px 11px;
      font-weight: 850;
    }

    .collapsible-info > div {
      padding: 0 11px 11px;
    }

    #hubUtilityPanel .utility-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
      gap: 10px;
    }

    .mobile-bottom-space { height: max(12px, env(safe-area-inset-bottom)); }

    body.career-shell-testing-open {
      max-width: 1320px;
      min-height: 100vh;
      min-height: 100dvh;
      overflow-x: hidden;
      background: #07100b;
    }

    body.career-shell-testing-open::before {
      content: "";
      position: fixed;
      inset: 0;
      z-index: -2;
      pointer-events: none;
      background:
        linear-gradient(180deg, rgba(3,9,6,.62), rgba(5,10,7,.88)),
        radial-gradient(circle at 16% 18%, rgba(146,226,103,.13), transparent 34%),
        url("../assets/hub/myco-hub-background.webp") center / cover no-repeat,
        linear-gradient(145deg, #142219, #07100b 58%, #1a120b);
    }

    body.career-shell-testing-open::after {
      content: "";
      position: fixed;
      inset: 0;
      z-index: -1;
      pointer-events: none;
      background: linear-gradient(90deg, rgba(0,0,0,.25), transparent 46%, rgba(0,0,0,.2));
    }

    #careerChapterPanel {
      min-height: calc(100vh - 36px);
      min-height: calc(100dvh - 36px);
      padding-bottom: max(20px, env(safe-area-inset-bottom));
      overflow: visible;
    }

    .career-shell-heading,
    .career-chapter-card-heading {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
    }

    .career-job-shell { scroll-margin-top: 12px; }
    .career-job-card details { color: var(--muted); font-size: .82rem; }
    .career-job-result,
    .career-job-history { display: grid; gap: 7px; padding: 12px; border: 1px solid rgba(197,255,131,.24); border-radius: 14px; background: rgba(10,24,15,.72); margin: 10px 0; }
    .career-job-history span { overflow-wrap: anywhere; }
    @media (max-width: 560px) {
      .career-job-card { min-width: 0; }
      .career-job-result button,
      .career-job-card button { width: 100%; min-height: 46px; }
    }

    .career-shell-heading h2,
    .career-chapter-card h3 { margin: 3px 0 6px; }
    .career-shell-heading > div > p { margin: 0; max-width: 720px; }

    .career-chapter-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      margin-top: 20px;
    }

    .career-chapter-card {
      display: flex;
      min-width: 0;
      min-height: 390px;
      flex-direction: column;
      padding: 18px;
      border: 1px solid rgba(255,255,255,.11);
      border-radius: 15px;
      background: rgba(0,0,0,.18);
    }

    .career-chapter-status {
      flex: 0 0 auto;
      padding: 5px 8px;
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 999px;
      font-size: .76rem;
      font-weight: 850;
      letter-spacing: .02em;
    }

    .career-chapter-status[data-status="active"] { color: var(--good, #87e2a7); }
    .career-chapter-status[data-status="completed"] { color: var(--gold, #f2ce72); }
    .career-chapter-status[data-status="locked"] { opacity: .64; }

    .career-chapter-card-locked {
      min-height: 300px;
      opacity: .48;
      filter: saturate(.4);
    }

    .career-chapter-unlock-condition {
      margin-top: auto;
      padding: 12px 0;
      font-weight: 850;
    }

    .career-locked-preview-trigger { width: 100%; }

    .career-chapter-objective,
    .career-chapter-records {
      display: grid;
      gap: 5px;
      margin-top: 12px;
      padding: 11px;
      border-radius: 10px;
      background: rgba(255,255,255,.035);
      font-size: .86rem;
    }

    .career-chapter-objective span,
    .career-chapter-records { color: var(--muted, #aeb8ae); }

    .career-chapter-continue {
      margin-top: auto;
      padding: 15px 0 9px;
      font-size: .88rem;
      font-weight: 800;
    }

    .career-chapter-actions,
    .career-confirm-actions {
      display: flex;
      gap: 9px;
      flex-wrap: wrap;
    }

    .career-chapter-actions > *,
    .career-confirm-actions > * { flex: 1 1 180px; }
    .career-chapter-action { width: 100%; }
    .career-chapter-card > .tiny { margin-top: 7px; text-align: center; }

    .career-compact-panel {
      width: min(760px, 100%);
      margin: 22px auto 0;
      padding: 20px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 15px;
      background: rgba(0,0,0,.2);
    }

    .career-current-run-details,
    .career-cash-breakdown {
      display: grid;
      gap: 8px;
      margin: 14px 0;
    }

    .career-current-run-details > div,
    .career-cash-breakdown > div {
      display: flex;
      justify-content: space-between;
      gap: 14px;
      padding: 10px 11px;
      border-radius: 9px;
      background: rgba(255,255,255,.04);
    }

    .career-current-run-details strong,
    .career-cash-breakdown strong {
      min-width: 0;
      overflow-wrap: anywhere;
      text-align: right;
    }

    .career-replacement-warning {
      display: grid;
      gap: 4px;
      margin: 14px 0;
      padding: 12px;
      border: 1px solid rgba(255,120,110,.28);
      border-radius: 10px;
      background: rgba(120,20,20,.16);
    }

    .career-completion-panel > div { margin: 9px 0; }

    .career-shell-error {
      position: relative;
      z-index: 2;
      width: min(900px, 100%);
      margin: 0 auto 14px;
      padding: 13px 15px;
      border: 1px solid rgba(255,105,100,.78);
      border-radius: 11px;
      color: #ffe3df;
      background: rgba(92,15,18,.92);
      overflow-wrap: anywhere;
    }

    .career-terminal-presentation {
      position: relative;
      isolation: isolate;
      width: min(860px, 100%);
      padding: clamp(18px, 4vw, 34px);
      border-color: rgba(183,238,145,.42);
      background: linear-gradient(155deg, rgba(8,25,15,.94), rgba(5,12,9,.96));
      box-shadow: 0 24px 70px rgba(0,0,0,.42), inset 0 1px rgba(255,255,255,.05);
      overflow: hidden;
    }

    .career-terminal-presentation::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: -1;
      background:
        radial-gradient(circle at 8% 12%, rgba(167,240,114,.13), transparent 29%),
        radial-gradient(circle at 92% 88%, rgba(205,156,73,.1), transparent 31%);
      pointer-events: none;
    }

    .career-terminal-mark {
      display: inline-grid;
      min-width: 74px;
      min-height: 74px;
      place-items: center;
      margin-bottom: 8px;
      padding: 10px;
      border: 1px solid rgba(190,239,151,.36);
      border-radius: 50%;
      color: var(--gold, #f2ce72);
      background: rgba(0,0,0,.28);
      font-size: .86rem;
      font-weight: 950;
      letter-spacing: .12em;
    }

    .career-completion-facts,
    .career-existing-run-notice {
      display: grid;
      gap: 8px;
      margin: 16px 0;
      padding: 14px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 11px;
      background: rgba(0,0,0,.2);
    }

    .career-existing-run-notice { border-color: rgba(244,190,74,.58); }
    .career-terminal-actions { margin-top: 20px; }
    .career-terminal-actions > button { min-height: 48px; touch-action: manipulation; }
    .career-complete-panel { border-color: rgba(242,206,114,.58); }

    .career-debt-state,
    .career-major-transition,
    .career-checkpoint-toast,
    .career-checkpoint-preview,
    .career-property-secured {
      display: grid;
      gap: 6px;
      margin: 12px 0;
      padding: 12px;
      border: 1px solid rgba(164,224,188,.28);
      border-radius: 10px;
      background: rgba(6,22,16,.72);
    }

    .career-debt-state[data-career-debt-state="warning"] { border-color: rgba(244,190,74,.75); }
    .career-debt-state[data-career-debt-state="critical"],
    .career-debt-state[data-career-debt-state="bankrupt"] { border-color: rgba(255,92,92,.85); }
    .career-major-transition > strong,
    .career-property-secured > strong { letter-spacing: .12em; }
    .career-checkpoint-toast { border-color: rgba(100,210,255,.65); }
    .career-recovery-actions { align-items: stretch; }

    .career-placeholder-run { width: min(1120px, 100%); }

    .career-score-panel,
    .career-score-unranked,
    .career-score-result-note {
      margin: 12px 0;
      padding: 12px;
      border: 1px solid rgba(242,206,114,.42);
      border-radius: 11px;
      background: rgba(24,32,12,.7);
    }

    .career-score-unranked { color: var(--muted, #aeb8ae); }
    .career-score-compact { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
    .career-score-compact strong { color: var(--gold, #f2ce72); font-size: 1.08rem; }
    .career-score-panel details { margin-top: 8px; }
    .career-score-panel summary { cursor: pointer; font-weight: 850; }
    .career-score-breakdown { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; margin-top: 9px; }
    .career-score-breakdown > span { display: grid; gap: 3px; padding: 8px; border-radius: 8px; background: rgba(255,255,255,.04); }
    .career-score-breakdown small { color: var(--muted, #aeb8ae); overflow-wrap: anywhere; }
    .career-score-at-risk { display: block; margin-top: 9px; color: var(--gold, #f2ce72); }
    .career-risk-breakdown { display: grid; gap: 5px; margin-top: 8px; }
    .career-risk-breakdown > span { display: flex; justify-content: space-between; gap: 10px; }
    [data-career-risk-breakdown] summary,
    [data-career-dial-guidance] summary { cursor: pointer; font-weight: 800; }
    [data-career-dial-guidance] { padding: 10px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 10px; }
    [data-career-dial-guidance] p { margin: 8px 0 0; color: var(--muted, #aeb8ae); }

    .career-production-shell {
      display: grid;
      gap: 18px;
      margin: 20px 0;
      padding-top: 18px;
      border-top: 1px solid rgba(255,255,255,.12);
    }

    .career-management-shell {
      display: grid;
      gap: 13px;
      margin: 20px 0;
      padding: 16px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 13px;
      background: rgba(0,0,0,.14);
    }

    .career-management-shell > h3,
    .career-management-shell > h4 { margin: 0; }

    .career-contract-shell { border-color: rgba(95, 205, 145, .42); }
    .career-contract-card { min-width: 0; }
    .career-contract-notice,
    .career-contract-decision {
      display: grid;
      gap: 8px;
      margin: 8px 0;
      padding: 13px;
      border: 1px solid rgba(255, 196, 86, .58);
      border-radius: 11px;
      background: rgba(72, 43, 10, .42);
    }
    .career-monster-order { border-color: rgba(255, 92, 92, .7); background: rgba(65, 15, 20, .46); }
    .career-monster-label { color: #ff8b83; letter-spacing: .08em; }

    .career-renewal-decision {
      display: grid;
      gap: 9px;
      padding: 13px;
      border: 1px solid rgba(244,190,74,.75);
      border-radius: 11px;
      background: rgba(75,48,6,.35);
    }

    .career-renewal-choice,
    [data-career-assignment-employee] label {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      padding: 7px;
      border-radius: 8px;
      background: rgba(255,255,255,.04);
    }

    [data-career-assignment-employee] { display: grid; gap: 6px; border: 0; padding: 0; }
    .career-assignment-list { display: grid; gap: 6px; }
    .career-assignment-chip { display: flex; align-items: center; justify-content: space-between; gap: 8px; overflow-wrap: anywhere; }
    .career-assignment-chip button { flex: 0 0 auto; padding: 6px 8px; }
    .career-assisted-planting { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
    .career-assisted-planting button { grid-column: 1 / -1; }

    .career-production-shell section h3 { margin: 0 0 9px; }

    .career-production-summary {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 9px;
    }

    .career-production-summary > div {
      display: grid;
      gap: 4px;
      min-width: 0;
      padding: 11px;
      border-radius: 10px;
      background: rgba(255,255,255,.04);
    }

    .career-production-summary span,
    .career-production-card > span,
    .career-capacity-panel > span { color: var(--muted, #aeb8ae); }

    .career-production-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
      gap: 10px;
    }

    .career-production-card,
    .career-capacity-panel,
    .career-production-confirmation {
      display: grid;
      align-content: start;
      gap: 9px;
      min-width: 0;
      padding: 13px;
      border: 1px solid rgba(255,255,255,.11);
      border-radius: 11px;
      background: rgba(0,0,0,.18);
      overflow-wrap: anywhere;
    }

    .career-production-card > button,
    .career-capacity-panel > button { width: 100%; }

    .career-production-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 7px;
      margin-top: auto;
    }

    .career-production-actions > * { flex: 1 1 125px; }
    .career-production-confirmation { border-color: rgba(255,92,92,.7); }
    .career-capacity-panel { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
    .career-capacity-panel h3 { grid-column: 1 / -1; }

    .career-rewards-shell,
    .career-bankruptcy-reward-summary,
    .career-victory-reward-summary {
      display: grid;
      gap: 12px;
    }

    .career-reward-columns {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }

    .career-reward-columns > div,
    .career-bankruptcy-reward-summary,
    .career-victory-reward-summary {
      padding: 13px;
      border: 1px solid rgba(255,255,255,.12);
      border-radius: 11px;
      background: rgba(0,0,0,.18);
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .career-reward-row,
    .career-reward-ledger-row,
    .career-reward-total {
      display: grid;
      gap: 4px;
      padding: 8px 0;
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .career-reward-total { border-bottom: 0; }

    @media (max-width: 700px) {
      body.experimental-hub-visible { padding: 8px; }
      body.experimental-hub-visible #modeSelectPanel { min-height: calc(100vh - 16px); padding: 18px; }
      .experimental-mode-grid { grid-template-columns: 1fr; }
      .career-score-breakdown { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .career-score-compact { align-items: flex-start; }
      .career-risk-breakdown > span { align-items: flex-start; }
      .experimental-mode-grid .experimental-mode-card { min-height: 154px; padding: 17px; }
      .experimental-mode-grid .mode-card-title { margin: 9px 0 5px; }
      .experimental-mode-grid .mode-card-tag { margin-top: 11px; }
      .hub-skin-toggle { justify-content: flex-start; flex-wrap: wrap; }
      .classic-home-primary { grid-template-columns: 1fr; }
      .archive-nav,
      .run-primary-nav,
      .setup-progress {
        top: 3px;
        overflow-x: auto;
        flex-wrap: nowrap;
        justify-content: flex-start;
        scrollbar-width: thin;
      }
      .archive-nav button,
      .run-primary-nav button,
      .setup-progress button {
        flex: 0 0 auto;
      }
      .page-heading { display: block; }
      .page-heading .page-toolbar { margin-top: 8px; }
      .essential-stats-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
      .dashboard-preview-grid { grid-template-columns: 1fr; }
      #moreRunStatsDisclosure {
        display: block;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: rgba(19,25,17,.78);
        overflow: hidden;
      }
      #moreRunStatsDisclosure > summary {
        list-style: none;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        min-height: 44px;
        padding: 10px 12px;
        cursor: pointer;
        color: var(--muted);
        font-weight: 850;
      }
      #moreRunStatsDisclosure > summary::-webkit-details-marker { display: none; }
      #moreRunStatsDisclosure > summary::after {
        content: "\25B6";
        color: var(--accent);
        font-size: .78rem;
      }
      #moreRunStatsDisclosure[open] > summary::after { content: "\25BC"; }
      #moreRunStatsDisclosure > .essential-stats-grid { padding: 0 10px 10px; }
      .mobile-dashboard-disclosure { min-height: 0; }
      .mobile-dashboard-disclosure > summary {
        min-height: 44px;
        cursor: pointer;
        margin-bottom: 0;
      }
      .mobile-dashboard-disclosure > summary::before {
        content: "\25B6";
        color: var(--accent);
        flex: 0 0 auto;
        font-size: .72rem;
      }
      .mobile-dashboard-disclosure[open] > summary::before { content: "\25BC"; }
      .mobile-dashboard-disclosure > summary > span:first-of-type { flex: 1; }
      .mobile-dashboard-disclosure[open] > summary { margin-bottom: 8px; }
      #careerChapterPanel {
        min-height: calc(100vh - 16px);
        min-height: calc(100dvh - 16px);
        padding: max(15px, env(safe-area-inset-top)) max(15px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(15px, env(safe-area-inset-left));
      }
      .career-shell-heading { display: block; }
      .career-shell-heading > button { width: 100%; margin-top: 13px; }
      .career-chapter-grid { grid-template-columns: 1fr; }
      .career-chapter-card { min-height: 345px; }
      .career-chapter-card-locked { min-height: 250px; }
      .career-compact-panel { padding: 15px; }
      .career-current-run-details > div,
      .career-cash-breakdown > div { display: grid; gap: 4px; }
      .career-current-run-details strong,
      .career-cash-breakdown strong { text-align: left; }
      .career-confirm-actions > *,
      .career-chapter-actions > * { flex-basis: 100%; }
      .career-production-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .career-production-grid { grid-template-columns: 1fr; }
      .career-production-actions > * { flex-basis: 100%; }
      .career-capacity-panel { grid-template-columns: 1fr; }
      .career-capacity-panel h3 { grid-column: auto; }
      .career-assisted-planting { grid-template-columns: 1fr; }
      .career-assisted-planting button { grid-column: auto; }
      .career-reward-columns { grid-template-columns: 1fr; }
    }

    @media (orientation: landscape) and (max-height: 500px) {
      body.career-shell-testing-open { padding: 4px; }
      #careerChapterPanel {
        min-height: calc(100dvh - 8px);
        padding: max(10px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
      }
      .career-shell-heading { align-items: center; }
      .career-shell-heading > div > p { font-size: .84rem; }
      .career-compact-panel { margin-top: 12px; }
      .career-terminal-presentation { padding: 16px; }
      .career-terminal-mark { min-width: 50px; min-height: 50px; margin: 0; }
      .career-terminal-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
      .career-terminal-actions > * { min-width: 0; }
      .career-victory-reward-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    }
