/* Compass 2026 — an editorial financial workspace, not a marketing landing page.
   The existing views and controls remain intact; this layer changes hierarchy,
   navigation, rhythm and color across the authenticated product. */
:root {
  --ink: #172723;
  --muted: #687a73;
  --paper: #f7f8f5;
  --card: #ffffff;
  --green: #173b36;
  --green2: #277d66;
  --lime: #d5eee0;
  --line: #e1e8e2;
  --danger: #b7544a;
  --shadow: 0 8px 30px rgba(25, 53, 42, .045);
}

html { scroll-behavior: auto; }
body { background: var(--paper); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, "Pretendard", "Noto Sans KR", sans-serif; letter-spacing: -.025em; }
button, input, select, textarea { font-family: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #54b79a; outline-offset: 3px; }

/* A calm, persistent desktop masthead gives every page the same orientation. */
.app-layout { background: var(--paper); }
.sidebar {
  position: sticky; inset: auto; top: 0; z-index: 35;
  width: 100%; height: 76px; padding: 0 max(28px, calc((100vw - 1440px) / 2));
  display: flex; flex-direction: row; align-items: center; gap: clamp(20px, 3vw, 55px);
  background: rgba(255, 255, 255, .96); border: 0; border-bottom: 1px solid var(--line);
  box-shadow: none; backdrop-filter: blur(14px);
}
.sidebar .brand { flex: none; gap: 9px; padding: 0; color: var(--green); font: 800 20px "DM Sans", sans-serif; letter-spacing: -.07em; }
.brand-mark { width: 32px; height: 32px; border-radius: 10px; background: var(--green); color: #fff; font-size: 17px; font-weight: 800; letter-spacing: -.08em; }
.sidebar nav { display: flex; flex: 1; align-items: center; gap: 2px; min-width: 0; margin: 0; overflow-x: auto; scrollbar-width: none; }
.sidebar nav::-webkit-scrollbar { display: none; }
.sidebar nav a, .sidebar nav a:hover, .sidebar nav a.active {
  flex: none; padding: 11px 15px; border-radius: 10px; box-shadow: none;
  background: transparent; color: #687a73; font-size: 14px; font-weight: 650; white-space: nowrap;
}
.sidebar nav a span { display: none; }
.sidebar nav a:hover { background: #f1f6f2; color: var(--green); }
.sidebar nav a.active { background: #e9f3ed; color: #1d634b; }
.sidebar-footer { flex: none; display: flex; align-items: center; gap: 9px; margin: 0; padding: 0; border: 0; }
.sidebar-footer .profile-dot { width: 31px; height: 31px; border-radius: 50%; background: #d5eee0; color: #1a654d; }
.sidebar-footer strong { max-width: 118px; font-size: 11px; color: var(--green); }
.sidebar-footer small { max-width: 118px; font-size: 9px; }
.sidebar-footer .icon-button { width: 30px; height: 30px; color: var(--muted); }

main { max-width: 1500px; margin: 0 auto; padding: 0 42px 96px; }
.topbar { min-height: 105px; height: auto; margin-bottom: 30px; padding: 18px 0; gap: 20px; border-color: var(--line); }
.topbar .eyebrow { margin-bottom: 6px; }
.topbar h2 { color: var(--ink); font-size: clamp(21px, 2vw, 28px); font-weight: 750; letter-spacing: -.055em; }
.top-actions { gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.top-actions .household-select { max-width: 185px; }
.sync-state.broker-status {
  display: inline-flex; align-items: center; min-height: 34px; padding: 7px 10px;
  border: 1px solid #dbece2; border-radius: 999px; background: #f1faf4;
  color: #27694e; font-size: 11px; line-height: 1.25; font-weight: 700; white-space: normal;
}
.sync-state.broker-status[data-tone="attention"] { border-color: #f2dfc3; background: #fff8ee; color: #9a6735; }
.top-actions .button { min-height: 36px; border-radius: 9px; padding: 8px 12px; font-size: 12px; white-space: nowrap; }
.top-actions [data-toss-connect="true"] { background: var(--green); color: #fff; box-shadow: none; }
.top-actions [data-page-link="settings"] { border-color: var(--line); }
.mobile-bottom-nav { display: none; }

/* Product-wide type and surfaces: one clear heading, not layers of badges. */
.eyebrow { color: #447763; font-size: 10px; font-weight: 800; letter-spacing: .09em; }
.welcome-row, .section-head { margin-bottom: 28px; }
.welcome-row h1, .section-head h1 { color: #182b25; font-size: clamp(31px, 3vw, 43px); line-height: 1.18; font-weight: 760; letter-spacing: -.065em; }
.welcome-row p, .section-head p { color: #718078; font-size: 14px; line-height: 1.65; }
.section-head .section-actions { gap: 8px; }
.button { border-radius: 10px; transition: background-color .15s, border-color .15s; }
.button:hover { transform: none; }
.button.primary, .primary { background: var(--green); color: #fff; box-shadow: none; }
.button.primary:hover { background: #255449; }
.button.secondary, .secondary { background: #fff; border: 1px solid #dce6df; color: #24443a; }
.button.secondary:hover { background: #f3f8f4; }
.button.danger, .danger { background: #fff7f4; border-color: #f0d6d0; color: #a44c43; }
.panel, .metric, .item-card, .asset-summary-card, .cashflow-metrics article, .scenario-card, .settings-unit, .settings-page-card {
  border: 1px solid var(--line); border-radius: 18px; background: #fff;
  box-shadow: var(--shadow);
}
.panel { padding: clamp(20px, 2.2vw, 30px); }
.panel-head h3, .settings-unit h3 { color: var(--ink); letter-spacing: -.04em; }
.panel-head a, .settings-page-card a { color: #277d66; }
.muted, .meta-line, .auth-note { color: var(--muted); }
.badge { background: #e8f4eb; color: #26684e; }
.badge.warn { background: #fff3e4; color: #9c6b36; }
.badge.risk { background: #fff0eb; color: #ae584c; }
.progress-track { background: #edf1ec; }
.progress-track i, #page-overview #dashboard-goals .progress-track i { background: #43a883; }
.notice { background: var(--green); }
input, select, textarea { border-color: #dce5de; border-radius: 10px; background: #fff; color: var(--ink); }
input:focus, select:focus, textarea:focus { border-color: #61ab8b; box-shadow: 0 0 0 3px #6dba9629; }

/* Dashboard: a financial editorial spread. The decision leads, proof follows. */
#page-overview .welcome-row { margin-bottom: 24px; }
#page-overview .family-command-center {
  grid-template-columns: 1.05fr .95fr; grid-template-areas: "status goal" "action evidence";
  gap: 14px; overflow: visible; margin: 0 0 24px;
  border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
#page-overview .family-command-center>* { min-width: 0; min-height: 230px; padding: clamp(22px, 2.4vw, 34px); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); }
#page-overview .command-status { background: #173b36; border-color: #173b36; color: #fff; }
#page-overview .command-status .eyebrow, #page-overview .command-status p, #page-overview .command-status small { color: #c9e7d8; }
#page-overview .command-status h3 { color: #fff; font-size: 20px; }
#page-overview .command-status strong { margin: 25px 0 13px; color: #fff; font-size: clamp(30px, 3.2vw, 47px); line-height: 1.1; letter-spacing: -.06em; }
#page-overview .command-goal { background: #fff; }
#page-overview .command-goal strong { color: var(--ink); }
#page-overview .command-goal .button { align-self: flex-start; }
#page-overview .command-action { background: #e5f4e9; }
#page-overview .command-action>span, #page-overview .command-action strong, #page-overview .command-action b { color: #1e644d; }
#page-overview .command-action p { color: #4b6b5e; }
#page-overview .command-evidence { background: #fff; color: var(--ink); }
#page-overview .command-evidence span, #page-overview .command-evidence small { color: #6e8177; }
#page-overview .command-evidence b { color: #218666; }
#page-overview .command-evidence b.down { color: #b7544a; }
#page-overview .command-evidence svg polyline { stroke: #43a883; }
#page-overview .command-evidence .command-sparkline { height: 112px; }
#page-overview .command-data-review { grid-column: 1/-1; min-height: 0; border-color: #e9dfc5; background: #fff9ec; border-radius: 14px; box-shadow: none; }
#page-overview .family-command-center[data-dashboard-state="previous"] .command-status,
#page-overview .family-command-center[data-dashboard-state="unavailable"] .command-status { background: #594b3e; border-color: #594b3e; }
#page-overview .overview-grid .panel { min-height: 0; }
#page-overview #dashboard-goals .goal-row { background: #fafcf9; border-color: var(--line); box-shadow: none; }
#page-overview #asset-composition .composition-item { background: #f6f9f6; }
#page-overview #asset-composition .composition-item strong, .portfolio-center strong, .portfolio-totals strong { color: var(--ink); }
#page-overview .trade-insight { background: #f3f8f4; color: var(--ink); }
#page-overview .trade-insight span { color: #367d62; }
.trade-insight-grounds p { background: #fff; color: #63746b; }
.trade-insight-grounds p span { background: #e4f3e9; color: #25765b; }
.insight-more summary { border-color: var(--line); color: #277d66; }

/* Accounts, goals, cash flow, insight and settings share the same visual grammar. */
.asset-summary-card.featured { background: var(--green); border-color: var(--green); }
.asset-summary-card.featured span, .asset-summary-card.featured small { color: #cae7d8; }
.asset-summary-card strong, .asset-value strong, .goal-amounts strong, .cashflow-metrics strong, .broker-asset-group h3, .broker-asset-group>summary>strong { color: var(--ink); }
.asset-type-icon, .goal-icon { background: #e8f4eb; color: #287756; }
.asset-ledger-row { border-bottom-color: var(--line); }
.asset-ledger-row:hover { background: #fbfdfb; }
.asset-tabs { border-color: var(--line); }
.asset-tabs button { color: #738177; }
.asset-tabs button.active { border-color: #328461; color: #256d50; }
.broker-asset-group { border-color: var(--line); }
.broker-asset-group>summary { background: #f6faf6; }
/* Household workspace: facts first, one action, details on demand. */
#household-workspace { display: grid; gap: 20px; margin-block: 24px; min-width: 0; }
.workspace-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; }
.workspace-head h2, .workspace-plan h2, .workspace-reviews h2 { margin: 10px 0; font-size: 22px; letter-spacing: -.04em; }
.workspace-plan-grid, .family-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; }
.workspace-plan-grid article { padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: #fafcfb; min-width: 0; }
.workspace-plan-grid strong, .family-net>strong { display: block; font: 700 24px 'DM Sans',sans-serif; margin-block: 10px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.workspace-plan-grid small, .workspace-basis, .family-summary-grid small { color: #62776f; font-size: 12px; line-height: 1.7; }
.workspace-plan details { margin-top: 18px; }
.workspace-review { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-block: 18px; border-bottom: 1px solid var(--line); }
.workspace-review h3 { margin: 8px 0; font-size: 16px; }
.workspace-review p { margin: 0; color: #62776f; line-height: 1.6; }
.workspace-review button { flex-shrink: 0; }
.workspace-optional>summary { padding-block: 18px; cursor: pointer; }
.workspace-warning { color: #8b5128; }
.workspace-clear { margin: 0; padding: 12px 4px; color: #62776f; font-size: 13px; }
.workspace-analysis-details>summary { cursor: pointer; padding: 18px 0; color: #277d66; font-size: 14px; font-weight: 650; }
.family-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.family-summary-grid .panel { min-width: 0; }
.family-summary-grid h2 { font-size: 23px; line-height: 1.5; }
.family-summary-grid p { line-height: 1.7; }
.family-net { background: #edf6f0; }
.asset-more-actions { position: relative; justify-self: end; min-width: 0; }
.asset-more-actions>summary { list-style: none; cursor: pointer; border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px; font-size: 13px; }
.asset-more-actions[open] { padding: 12px; background: #f6faf6; border-radius: 12px; }
.asset-more-actions .card-actions { margin-top: 12px; flex-wrap: wrap; }
.workspace-head .button:focus-visible, .asset-more-actions summary:focus-visible { outline: 3px solid #338574; outline-offset: 3px; }
#workspace-feedback-dialog, #workspace-plan-dialog { max-width: min(560px,calc(100vw - 24px)); }
#workspace-feedback-error, #workspace-plan-error { color: #a03f32; }
@media(max-width:1100px) { .workspace-plan-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .family-summary-grid { grid-template-columns: 1fr; } }
@media(max-width:760px) { .workspace-head, .workspace-review { align-items: stretch; flex-direction: column; } .workspace-plan-grid { grid-template-columns: 1fr; } .asset-more-actions { justify-self: start; max-width: 100%; } .workspace-plan .panel-head { flex-direction: column; align-items: stretch; } }
.broker-asset-group { border-width: 2px; margin-block: 12px; transition: border-color .15s, box-shadow .15s; }
.broker-asset-group[open] { border-color: #338574; box-shadow: 0 0 0 3px #33857418; }
.broker-asset-group[open]>summary { background: #eaf5ef; border-bottom: 1px solid #b5d6c7; }
.broker-asset-group>summary:focus-visible { outline: 3px solid #338574; outline-offset: -5px; }
.broker-holdings .nh-holding-row { grid-template-columns: minmax(0,1fr) minmax(150px,.45fr); }
.nh-holding-row .asset-identity>div { min-width: 0; }
.nh-holding-row h3, .nh-holding-row .meta-line { overflow-wrap: anywhere; }
.nh-holding-row .asset-value small { display: block; margin-top: 5px; color: var(--muted); }
@media(max-width:760px) { .broker-holdings .nh-holding-row { grid-template-columns: minmax(0,1fr); gap: 14px; } }
.goal-journey-card .next-action, .goal-next-actions article { background: #f3f8f4; color: #4a6b59; }
.goal-next-actions article>span { color: #267450; }
.goal-actions-panel>a { color: #277d66; }
.cashflow-metrics .capacity strong, .cashflow-metrics .saving strong { color: #2c8d65; }
.cashflow-metrics .expense strong { color: #bf6354; }
.cashflow-bar-stack i, .cashflow-legend span:before { background: #3e9475; }
.cashflow-bar-stack i.expense, .cashflow-legend .expense:before { background: #efa97d; }
.cashflow-bar-stack i.saving, .cashflow-legend .saving:before { background: #b0d7b0; }
.expense-legend>div, .recurring-expense-row, .scenario-results.empty-state { background: #f8faf7; border-color: var(--line); }
.explanation-card { background: #f7faf7; }
.explanation-text { border-color: #4da17d; }
.insight-line, .explanation-card .insight-line { border-color: var(--line); background: #fff; color: var(--ink); }
.insight-line>span { background: #e8f4eb; color: #287756; }
.insight-line>strong { color: var(--ink); }
.insight-line>p { color: #5c7166 !important; }
.settings-page { width: min(1250px,100%); max-width: 1250px; }
.settings-page-header, .settings-tabs, .settings-page-card { max-width: 1250px; }
.settings-page-header h1 { color: var(--ink); font-size: clamp(29px, 3vw, 40px); }
.settings-page-header>p:last-child { color: var(--muted); }
.settings-tabs { gap: 7px; border-bottom: 1px solid var(--line); padding-bottom: 0; }
.settings-tabs button { border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: #78877d; padding: 12px 18px; }
.settings-tabs button.active { border-color: #2a7a59; background: transparent; color: #27694e; box-shadow: none; }
.settings-unit { box-shadow: var(--shadow); border-color: var(--line); }
.settings-unit h3 { color: var(--ink); }
.settings-card-grid.active { gap: 14px !important; }
.settings-tab-panel[data-settings-panel="investments"] .investment-profile-form label:nth-of-type(2),
.settings-tab-panel[data-settings-panel="investments"] .investment-profile-form label:nth-of-type(6) { grid-column: auto; }
.settings-tab-panel[data-settings-panel="investments"] .investment-profile-form .button { grid-column: 1/-1; }
.settings-tab-panel>h2 { color: var(--ink); }
.settings-page-card:has(.settings-card-grid.active) { background: transparent; }
.settings-page-card .button, .settings-unit .button { border-radius: 9px; }
.settings-unit .integration-status.connected { color: #26815f; }
.settings-section, .settings-divider { border-color: var(--line); }
.family-first-use-guide { border-color: #d6e8d9; background: #f3faf3; }
.onboarding-guide { background: #173b36; }
.onboarding-steps button { border-color: #557d6c; }
.onboarding-steps button span { background: #d5eee0; }
.plan-health { border-color: #d5e7d9; background: #f2f8f3; }

/* Login belongs to the same product: restrained composition, no fake orbit art. */
#auth-view { background: #f7f8f5; }
#auth-view .brand-panel { background: #173b36; }
#auth-view .brand-panel:before, #auth-view .brand-panel:after { display: none; }
#auth-view .brand-mark { background: #d5eee0; color: #173b36; }
#auth-view .hero-copy h1 em { color: #bee7c9; }
#auth-view .hero-preview { background: #ffffff11; border-color: #ffffff2c; backdrop-filter: none; }
#auth-view .auth-panel { background: #f7f8f5; backdrop-filter: none; }
#auth-view .auth-card { background: #fff; border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
#auth-view .auth-card h2 { color: var(--ink); }
#auth-view .auth-lead { color: var(--muted); }
#auth-view .auth-card .primary { background: var(--green); box-shadow: none; }
#auth-view .auth-card input { background: #fff; }
#auth-view.auth-layout{display:grid;grid-template-columns:1fr;place-items:center;min-height:100dvh;background:#f7f8f5}
#auth-view .auth-panel{width:100%;min-height:0;padding:40px 20px;background:transparent;backdrop-filter:none}
#auth-view .auth-card{width:min(440px,100%);margin:auto;padding:32px;border:1px solid var(--line);border-radius:18px;box-shadow:none;background:#fff;backdrop-filter:none}
#auth-view .mobile-brand{display:flex;align-items:center;gap:10px;margin:0 0 32px;font-size:17px;letter-spacing:-.04em;color:var(--green)}
#auth-view h1{font-size:26px;line-height:1.4;margin:0 0 12px;letter-spacing:-.05em}
#auth-view .auth-lead{font-size:14px;line-height:1.7;color:var(--muted)}
#auth-view .auth-mode-switch{display:flex;gap:4px;padding:4px;background:#f1f4f0;border-radius:10px;margin:22px 0}
#auth-view .auth-mode-switch button{flex:1;padding:10px;border:0;background:transparent;border-radius:7px;color:var(--muted);font-weight:650}
#auth-view .auth-mode-switch button.active{background:#fff;color:var(--green)}
#auth-view .auth-card .primary{background:var(--green);box-shadow:none}
#auth-view .recover-details{margin-top:22px;border-top:1px solid var(--line);padding-top:18px}
#auth-view .auth-note{font-size:12px;line-height:1.7;margin-top:22px}
.auth-inline-notice{padding:12px;border-radius:8px;background:#edf5ef;font-size:13px;line-height:1.6}.auth-inline-notice.error{background:#fff2ee;color:#a0443b}
#cashflow-review-modal{width:min(1100px,calc(100% - 24px));max-height:90dvh}#cashflow-review-modal p{font-size:13px;line-height:1.75}#cashflow-review-accounts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cashflow-rule-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px;margin:12px 0;border:1px solid var(--line);border-radius:12px}.cashflow-review-actions{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.cashflow-import-totals{margin-top:16px;padding:14px;background:#f0f6f1;border-radius:10px}
@media(max-width:600px){#cashflow-review-accounts,.cashflow-rule-row{grid-template-columns:1fr}.cashflow-review-actions{display:grid}.cashflow-review-actions .button{white-space:normal}}
@media(max-width:480px){#auth-view .auth-card{padding:24px 20px;border:0;background:transparent}#auth-view .auth-panel{padding:24px 8px}#auth-view h1{font-size:24px}}

@media (max-width: 1100px) {
  .sidebar { gap: 18px; padding-inline: 20px; }
  .sidebar nav a, .sidebar nav a:hover, .sidebar nav a.active { padding-inline: 10px; font-size: 12px; }
  .sidebar-footer strong, .sidebar-footer small { display: none; }
  main { padding-inline: 28px; }
}

@media (max-width: 900px) {
  .sidebar {
    position: fixed; inset: 0 auto 0 0; top: 0; width: min(315px, 86vw); height: 100dvh;
    padding: 28px 20px; display: flex; flex-direction: column; align-items: stretch; gap: 0;
    background: #fff; border-right: 1px solid var(--line); transform: translateX(-105%); z-index: 60;
  }
  .sidebar.open { transform: translateX(0); box-shadow: 14px 0 50px #123b3028; }
  .sidebar .brand { margin: 0 0 24px; }
  .sidebar nav { flex: none; display: grid; gap: 3px; margin: 0; overflow: visible; }
  .sidebar nav a, .sidebar nav a:hover, .sidebar nav a.active { padding: 14px 12px; font-size: 15px; }
  .sidebar nav a span { display: inline-block; width: 24px; text-align: center; }
  .sidebar-footer { margin-top: auto; padding-top: 18px; border-top: 1px solid var(--line); }
  .sidebar-footer strong, .sidebar-footer small { display: block; }
  main { min-width: 0; margin: 0; padding: 0 24px 100px; }
  .topbar { position: sticky; top: 0; z-index: 30; min-height: 0; margin: 0 -24px 26px; padding: 13px 24px 12px;
    grid-template-columns: 42px minmax(0,1fr); gap: 10px 12px; background: #fffffff2; backdrop-filter: blur(16px); }
  #menu-button { width: 42px; height: 42px; border-color: var(--line); border-radius: 12px; color: var(--green); }
  .topbar h2 { font-size: 19px; }
  .top-actions { display: flex; flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .top-actions::-webkit-scrollbar { display: none; }
  .top-actions .sync-state.broker-status { display: inline-flex; flex: none; min-height: 30px; padding: 5px 9px; font-size: 10px; white-space: nowrap; }
  .top-actions .household-select { display: none; }
  .top-actions .button { flex: none; width: auto; min-height: 31px; padding: 6px 10px; font-size: 10px; }
  .mobile-bottom-nav { position: fixed; inset: auto 0 0; z-index: 40; height: calc(68px + env(safe-area-inset-bottom));
    display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); padding: 6px 8px calc(6px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line); background: #fffffffa; box-shadow: 0 -7px 24px #163e2d0b; }
  .mobile-bottom-nav button { min-width: 0; border: 0; border-radius: 10px; background: transparent; color: #819087; font-size: 11px; font-weight: 700; }
  .mobile-bottom-nav button[aria-current="page"] { background: #e9f4ec; color: #246a4d; }
  #page-overview .family-command-center { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: "status goal" "action evidence"; }
}

@media (max-width: 700px) {
  main { padding-inline: 16px; }
  .topbar { margin-inline: -16px; padding-inline: 16px; }
  .welcome-row h1, .section-head h1 { font-size: clamp(28px, 8vw, 35px); }
  #page-overview .family-command-center { grid-template-columns: minmax(0,1fr); grid-template-areas: "status" "goal" "action" "evidence"; gap: 11px; }
  #page-overview .family-command-center>* { min-height: 0; padding: 23px 20px; }
  #page-overview .command-status strong { font-size: clamp(29px, 9vw, 40px); white-space: nowrap; overflow-wrap: normal; }
  #page-overview .command-goal strong { font-size: 23px; }
  #page-overview .command-evidence { min-height: 205px; }
  #page-overview .command-action .button { width: 100%; }
  #page-overview .overview-grid { grid-template-columns: minmax(0,1fr); }
  .asset-summary-grid { grid-template-columns: minmax(0,1fr); }
  .settings-card-grid.active { grid-template-columns: minmax(0,1fr) !important; }
  .settings-page-card { padding: 20px; }
  .settings-unit { padding: 21px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .page { animation: none; }
  .sidebar, .button { transition: none; }
}
#broker-detail-modal { width:min(1000px, calc(100vw - 24px)); max-height:90dvh; }
#broker-detail-modal .modal-card { width:100%; max-width:none; min-width:0; }
.broker-summary-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:16px; }
.broker-summary-grid span,.broker-summary-grid strong { display:block;overflow-wrap:anywhere; }
.broker-summary-grid span { color:var(--muted);font-size:13px;margin-bottom:6px; }
#broker-trade-period { display:flex;flex-wrap:wrap;gap:12px;align-items:end; }
#broker-trade-period label { flex:1;min-width:130px; }
#broker-detail-body .table-wrap { overflow-x:auto; }
#broker-detail-body, #cashflow-review-diff, #cashflow-review-modal .modal-card > * { min-width:0; max-width:100%; }
#broker-detail-body p { overflow-wrap:anywhere; }
#broker-detail-body small { display:block; }
@media(max-width:640px) { .broker-summary-grid { grid-template-columns:1fr; } #broker-detail-modal .modal-card { padding:20px; } }
.workspace-funding { margin-block:20px; overflow-wrap:anywhere; }
#monthly-funding-form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-block:20px; }
#monthly-funding-form label, #workspace-plan-preview label { display:flex; flex-direction:column; gap:8px; min-width:0; }
#monthly-funding-form input, #monthly-funding-form select, #workspace-plan-preview input[type=number] { width:100%; min-width:0; box-sizing:border-box; }
.workspace-funding ul { padding-left:20px; }
.workspace-funding li { margin-block:12px; }
#workspace-plan-preview, #funding-match-options { display:grid; gap:12px; }
@media(max-width:600px) { #monthly-funding-form { grid-template-columns:minmax(0,1fr); } .workspace-funding .workspace-plan-grid { grid-template-columns:minmax(0,1fr); } }
.monthly-review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; margin-block:20px; }
#monthly-review-content .panel { min-width:0; overflow-wrap:anywhere; }
#monthly-review-content dl { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; margin-block:20px; }
#monthly-review-content dd { margin:0; font-weight:700; font-variant-numeric:tabular-nums; }
#monthly-close-form { display:grid; gap:16px; }
#monthly-close-form label { display:block; }
#monthly-close-form textarea { display:block; width:100%; box-sizing:border-box; margin-top:10px; }
#monthly-close-form input[type=checkbox] { width:auto; }
@media(max-width:760px) { .monthly-review-grid { grid-template-columns:minmax(0,1fr); } #monthly-review-content dl { grid-template-columns:minmax(0,1fr); gap:6px; } #monthly-review-content dd { margin-bottom:10px; } }
#planned-expenses-panel { margin-block:20px; min-width:0; overflow-wrap:anywhere; }
.planned-expense-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:16px; align-items:center; padding-block:18px; border-bottom:1px solid var(--line); }
.planned-expense-row h3 { margin-block:10px; }
#expense-paid-date-label[hidden] { display:none; }
#planned-expense-form textarea { width:100%; box-sizing:border-box; }
@media(max-width:760px) { #planned-expenses-panel .panel-head { align-items:stretch; flex-direction:column; } .planned-expense-row { grid-template-columns:minmax(0,1fr); } }
.outcome-actions { display:flex;flex-wrap:wrap;gap:10px;margin-block:16px; }
.outcome-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-block:20px; }
.outcome-grid article { border:1px solid var(--line);border-radius:16px;padding:18px;min-width:0; }
.outcome-grid dl { display:grid;grid-template-columns:minmax(0,1fr);gap:6px; }
.outcome-grid dd { margin:0 0 12px;font-weight:700;overflow-wrap:anywhere; }
#family-plan-response textarea { width:100%;box-sizing:border-box; }
#family-plan-response li { margin-block:14px;overflow-wrap:anywhere; }
#monthly-outcome small,#briefing-comparison small { display:block;overflow-wrap:anywhere; }
@media(max-width:760px) { .outcome-grid { grid-template-columns:minmax(0,1fr); } .outcome-actions>.button { flex:1 1 160px; } }