:root {
  --life-bg: #101214;
  --life-line: #303437;
  --life-muted: #939a9c;
  --life-gold: #ddbf84;
  --life-green: #8db5a0;
  --life-blue: #8daec6;
  --life-rose: #cda29d;
}
body { background: #0d0f11; }
svg { flex-shrink: 0; width: 18px; height: 18px; stroke-width: 1.6; }
button { -webkit-tap-highlight-color: transparent; }
.primary-button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; }
.life-shell {
  width: min(100%, 1320px);
  min-height: 100svh;
  background: var(--life-bg);
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}
body:has(.life-shell) { padding: 0; }
.life-dashboard { padding: 0 32px 32px; }
.life-topbar { display: flex; align-items: center; justify-content: space-between; min-height: 100px; border-bottom: 1px solid var(--life-line); margin-bottom: 28px; gap: 20px; }
.life-brand { color: #f0eee8; text-decoration: none; display: grid; gap: 7px; }
.life-brand strong { font-size: 23px; font-weight: 650; line-height: 1.2; }
.life-brand strong > span { color: var(--life-gold); }
.life-brand small { color: var(--life-muted); font-size: 10px; }
.day-display { width: 140px; text-align: right; color: var(--life-gold); font-size: 12px; }
.day-display b { font-size: 25px; font-weight: 500; font-variant-numeric: tabular-nums; }
.day-display small { color: var(--life-muted); }
.day-track { height: 2px; margin-top: 10px; background: #343535; }
.day-track i { display: block; height: 100%; background: var(--life-gold); transition: width .5s; }
.life-layout { display: grid; grid-template-columns: 236px minmax(0, 1fr) 304px; align-items: start; gap: 30px; }
.life-main { min-width: 0; }
.character-card { border: 1px solid var(--life-line); background: #171a1b; border-radius: 8px; overflow: hidden; }
.character-scene { height: 142px; position: relative; background: #292b2a; overflow: hidden; }
.character-scene img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 54%; opacity: .76; }
.character-scene > span { position: absolute; top: 14px; left: 16px; color: #e5e5df; font-size: 9px; padding: 5px 7px; background: #161818c9; border: 1px solid #76786c55; }
.identity-row { display: flex; align-items: start; gap: 12px; padding: 0 18px; position: relative; margin-top: -25px; }
.character-avatar { width: 54px; height: 68px; flex-shrink: 0; display: grid; place-items: center; background: #454b48; color: #d9e0d8; border: 4px solid #171a1b; border-radius: 8px; }
.character-avatar svg { width: 32px; height: 32px; stroke-width: 1.1; }
.identity-copy { padding-top: 35px; min-width: 0; }
.character-name { display: flex; align-items: center; gap: 3px; }
.character-name h1 { font-size: 24px; line-height: 1.3; margin: 0; font-weight: 650; overflow-wrap: anywhere; }
.icon-button { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 6px; border: 1px solid transparent; background: transparent; color: #a8aeae; padding: 6px; cursor: pointer; flex-shrink: 0; }
.icon-button:hover { background: #ffffff0d; border-color: var(--life-line); color: #fff; }
.icon-button svg { width: 15px; height: 15px; }
.identity-copy > p { margin: 5px 0 0; font-size: 10px; color: var(--life-muted); line-height: 1.6; }
.identity-copy > p span { padding: 0 2px; }
.character-details { padding: 16px 18px 12px; }
.character-details p { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; font-size: 12px; color: #bbbfbf; }
.character-details svg { width: 14px; height: 14px; color: var(--life-muted); }
.character-state { display: flex; align-items: center; gap: 7px; margin: 0 18px; padding: 10px 0 17px; border-bottom: 1px solid var(--life-line); color: var(--life-green); font-size: 11px; }
.character-state small { margin-left: auto; color: var(--life-muted); font-size: 10px; }
.presence-dot { width: 5px; height: 5px; background: var(--life-green); border-radius: 50%; }
.attribute-bars { display: grid; gap: 22px; padding: 24px 18px; }
.attribute > div:first-child { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 10px; }
.attribute span { font-size: 12px; color: #c2c6c6; }
.attribute strong { font-size: 16px; font-weight: 500; font-variant-numeric: tabular-nums; }
.attribute strong span { font-size: inherit; color: #eee; }
.attribute strong small { font-size: 10px; font-weight: 400; color: #6d7679; }
.attribute-track { height: 4px; background: #303538; overflow: hidden; }
.attribute-track > span { height: 100%; display: block; background: var(--tone); }
.gold { --tone: var(--life-gold); }
.blue { --tone: var(--life-blue); }
.green { --tone: var(--life-green); }
.rose { --tone: var(--life-rose); }
.character-footnote { display: flex; gap: 7px; padding: 15px 18px; border-top: 1px solid var(--life-line); color: var(--life-muted); font-size: 10px; align-items: center; }
.character-footnote svg { width: 13px; height: 13px; }
.life-status { padding: 1px 0 18px; border-bottom: 1px solid var(--life-line); }
.cash-heading { display: flex; justify-content: space-between; align-items: center; color: #c1c3bf; font-size: 12px; gap: 12px; }
.status-tag { display: inline-flex; align-items: center; gap: 5px; color: #778180; font-size: 10px; }
.status-tag svg { width: 13px; height: 13px; }
.hero-cash { color: var(--life-gold); font-size: 48px; font-weight: 570; line-height: 1.12; margin: 12px 0 19px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.safety-row, .net-row { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.safety-row { padding-bottom: 15px; border-bottom: 1px solid #2a2e2f; margin-bottom: 15px; }
.safety-row > span { display: inline-flex; align-items: center; gap: 6px; color: #b1b6b5; font-size: 12px; }
.safety-row svg { width: 14px; height: 14px; color: #879889; }
.safety-row strong { font-size: 21px; font-weight: 550; color: #d6dacf; }
.net-row > span { font-size: 12px; color: #b1b6b5; }
.net-row strong { font-size: 19px; font-weight: 500; font-variant-numeric: tabular-nums; }
.net-row small { color: #777f7e; font-size: 11px; font-weight: 400; }
.gain-text { color: var(--life-green); }
.loss-text { color: #d39c8e; }
.income-expense { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 15px; }
.income-expense > span { display: flex; flex-wrap: wrap; align-items: center; column-gap: 5px; color: var(--life-muted); font-size: 10px; row-gap: 4px; }
.income-expense svg { width: 12px; height: 12px; color: var(--life-green); }
.income-expense > span + span svg { color: #c49488; }
.income-expense b { color: #cbcfc9; font-size: 12px; font-weight: 450; margin-left: auto; }
.receipt-row { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; font-size: 10px; color: #808987; }
.receipt-row b { color: #aeb8b0; font-weight: 450; white-space: nowrap; }
.text-button { background: transparent; color: #aeb7b5; cursor: pointer; padding: 6px 0; font-size: 11px; display: inline-flex; gap: 6px; align-items: center; }
.text-button:hover { color: var(--life-gold); }
.budget-link { margin: 7px 0 17px; }
.budget-link svg { width: 12px; height: 12px; }
.section-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 17px; }
.section-kicker { display: block; color: #7d8785; font-size: 9px; margin-bottom: 7px; }
.section-title h2 { margin: 0; font-size: 19px; line-height: 1.4; font-weight: 550; }
.action-energy { display: flex; align-items: center; gap: 6px; color: var(--life-gold); flex-wrap: wrap; justify-content: end; width: 75px; }
.action-energy > svg { width: 16px; height: 16px; }
.action-energy strong { font-size: 19px; font-weight: 600; }
.action-energy small { font-size: 12px; color: #76817c; font-weight: 400; }
.energy-pips { width: 100%; display: flex; justify-content: end; gap: 4px; }
.energy-pips i { width: 17px; height: 3px; background: #373a35; }
.energy-pips i.filled { background: var(--life-gold); }
.action-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.life-action { display: flex; flex-direction: column; align-items: start; position: relative; min-width: 0; min-height: 132px; padding: 14px 12px 11px; border: 1px solid #323939; border-radius: 6px; background: #191d1e; color: #e2e5e0; text-align: left; cursor: pointer; transition: border-color .18s, background .18s, transform .18s; }
.life-action:hover:not(:disabled) { background: #222728; border-color: var(--tone); transform: translateY(-2px); }
.life-action:active:not(:disabled) { transform: translateY(0); }
.action-icon { color: var(--tone); height: 26px; margin-bottom: 8px; }
.action-icon svg { width: 20px; height: 20px; }
.action-cost { position: absolute; top: 12px; right: 10px; display: inline-flex; align-items: center; gap: 2px; font-size: 10px; color: #90988c; }
.action-cost svg { width: 10px; height: 10px; }
.life-action strong { font-size: 13px; line-height: 1.5; font-weight: 560; margin-bottom: 7px; }
.action-preview { font-size: 10px; color: #b7c0b8; line-height: 1.5; }
.action-detail { font-size: 9px; color: #7f8986; margin-top: 3px; line-height: 1.5; }
.life-action:disabled { cursor: not-allowed; opacity: .46; }
.life-action.completed { opacity: .72; border-color: #3c5046; background: #19231e; }
.life-action.completed .action-icon, .life-action.completed .action-preview { color: var(--life-green); }
.daily-record { padding: 17px 0 3px; }
.record-heading { display: flex; align-items: center; gap: 7px; color: #a7b0aa; font-size: 11px; }
.record-heading svg { width: 14px; height: 14px; }
.record-heading small { margin-left: auto; color: #6f7b75; font-size: 9px; }
.empty-record { margin: 12px 0 5px; color: #67716d; font-size: 11px; }
.record-row { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid #252c28; gap: 7px; }
.record-row > span { font-size: 11px; display: inline-flex; align-items: center; gap: 7px; color: #c0c8c1; }
.record-row > span svg { color: var(--life-green); width: 12px; height: 12px; }
.record-row > div { display: flex; gap: 4px; flex-wrap: wrap; }
.record-row .effect-chip { font-size: 9px; padding: 2px 4px; background: none; }
.opportunity-readings { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding: 13px 0; border-top: 1px solid #282e2b; font-size: 10px; color: #88958c; }
.opportunity-readings b { font-weight: 500; color: #b9c4b7; padding-left: 4px; }
.opportunity-readings small { color: #627066; font-size: 9px; }
.priority-message { display: flex; align-items: center; gap: 12px; width: 100%; border: 1px solid #3c4b43; border-left: 2px solid var(--life-green); border-radius: 5px; padding: 14px 12px; margin-top: 8px; background: #1b2420; text-align: left; color: #d6dfd4; cursor: pointer; }
.priority-icon { color: var(--life-green); flex-shrink: 0; }
.priority-message > span:nth-child(2) { flex: 1; min-width: 0; }
.priority-message small { display: block; font-size: 10px; color: #93a697; margin-bottom: 6px; }
.priority-message strong { font-size: 12px; font-weight: 550; line-height: 1.5; }
.priority-message > svg { width: 15px; height: 15px; }
.day-footer { margin-top: 20px; }
.day-footer > p { font-size: 11px; color: #8b958e; margin-bottom: 15px; }
.end-day-button { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 48px; padding: 12px 15px; gap: 10px; background: #c9ad77; color: #191c16; border-radius: 5px; font-size: 13px; font-weight: 650; cursor: pointer; }
.end-day-button:hover { background: #e0c490; }
.end-day-button:disabled { opacity: .4; cursor: default; }
.end-day-button > small { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; font-size: 10px; font-weight: 500; }
.end-day-button svg { width: 16px; height: 16px; }
.unused-energy { display: block; text-align: center; margin-top: 9px; color: #727d74; font-size: 10px; }
.phone-column { position: sticky; top: 24px; min-width: 0; }
.phone-device { background: #1a1e20; border: 1px solid #42484c; box-shadow: inset 0 0 0 4px #121516, 0 18px 35px #0003; border-radius: 28px; padding: 20px 17px 12px; overflow: hidden; }
.phone-status { position: relative; display: flex; align-items: center; justify-content: space-between; color: #c1c8c8; font-size: 10px; padding: 0 4px; height: 18px; }
.phone-status > span:last-child { display: flex; gap: 4px; }
.phone-status svg { width: 14px; height: 14px; }
.phone-speaker { position: absolute; left: 50%; transform: translateX(-50%); width: 54px; height: 5px; border-radius: 9px; background: #080b0c; }
.phone-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 27px 0 17px; }
.phone-heading h2 { font-size: 20px; font-weight: 550; margin: 0; }
.phone-heading .section-kicker { font-size: 8px; }
.unread-total { font-size: 9px; color: #9cad9e; }
.phone-apps { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 6px; padding-bottom: 17px; border-bottom: 1px solid #353b3e; }
.phone-app { background: none; color: #919d9d; cursor: pointer; padding: 0; }
.phone-app > span { position: relative; display: grid; place-items: center; width: 40px; height: 40px; margin: 0 auto 8px; border-radius: 11px; border: 1px solid #47504f; background: #293032; color: var(--tone); transition: background .15s; }
.phone-app svg { width: 21px; height: 21px; }
.phone-app.selected > span { background: #35423d; border-color: var(--tone); }
.phone-app.selected { color: #e2e7e1; }
.phone-app small { font-size: 10px; }
.app-badge { position: absolute; top: -4px; right: -4px; border-radius: 10px; background: #b77d6b; border: 2px solid #1a1e20; color: #fff; min-width: 17px; height: 17px; padding: 0 3px; font-size: 9px; font-weight: 500; display: grid; place-items: center; }
.phone-content { height: 405px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #46514d transparent; }
.inbox-label { display: flex; align-items: center; justify-content: space-between; margin: 13px 0 3px; color: #6f7d7d; font-size: 9px; }
.inbox-label button { font-size: 9px; }
.message-row { position: relative; display: flex; width: 100%; gap: 9px; padding: 14px 0; border-bottom: 1px solid #2e3537; background: transparent; color: #d1d8d5; text-align: left; cursor: pointer; }
.message-row:hover { background: #ffffff04; }
.sender-avatar { width: 32px; height: 32px; border-radius: 7px; background: #2a3331; color: var(--tone); display: grid; place-items: center; flex-shrink: 0; }
.sender-avatar svg { width: 17px; height: 17px; }
.message-summary { min-width: 0; flex: 1; padding-right: 7px; }
.message-summary > span { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.message-summary strong { font-size: 11px; font-weight: 550; }
.message-summary small { font-size: 8px; color: #6c7b79; white-space: nowrap; }
.message-summary > b { display: block; font-size: 10px; font-weight: 400; margin-top: 6px; color: #9bac9f; line-height: 1.4; }
.message-summary p { color: #7e8b88; font-size: 10px; line-height: 1.7; margin: 4px 0 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.message-summary strong { font-size: 12px; }
.message-summary > b, .message-summary p { font-size: 11px; }
.phone-app small { font-size: 11px; }
.bank-amount { color: var(--life-gold); font-size: 26px; font-weight: 550; margin: 20px 0 12px; overflow-wrap: anywhere; }
.phone-safety { padding: 12px 0; border-top: 1px solid #394a3e; border-bottom: 1px solid #394a3e; font-size: 11px; display: grid; gap: 8px; margin: 16px 0; color: #97a59b; }
.phone-safety strong { font-size: 16px; font-weight: 500; color: #c5d7c9; }
.unread-dot { position: absolute; top: 19px; right: 0; width: 4px; height: 4px; background: var(--life-green); border-radius: 50%; }
.message-row.unread .message-summary strong { color: #f0f3ed; }
.phone-home-line { width: 72px; height: 3px; background: #8b9594; border-radius: 6px; margin: 16px auto 0; }
.thread-heading { display: flex; align-items: center; gap: 5px; border-bottom: 1px solid #353b3e; margin-bottom: 16px; padding: 12px 0; }
.thread-heading strong { font-size: 12px; font-weight: 500; }
.thread-heading small { margin-left: auto; font-size: 9px; color: #8c9a94; }
.thread-subject { font-size: 12px; font-weight: 500; margin-bottom: 17px; line-height: 1.6; color: #a5b6a9; }
.message-bubbles p { width: fit-content; max-width: 100%; margin-bottom: 8px; padding: 10px 12px; background: #2c3731; border-radius: 0 7px 7px 7px; color: #d5dfd7; font-size: 12px; line-height: 1.7; }
.message-effects { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 18px; padding-bottom: 12px; }
.phone-success { color: var(--life-green); font-size: 12px; }
.phone-empty { display: grid; place-items: center; align-content: center; height: 230px; gap: 16px; color: #667670; }
.phone-empty svg { width: 30px; height: 30px; stroke-width: 1; }
.phone-empty p { font-size: 12px; margin: 0; }
.mobile-life-nav { display: none; }
.effect-chip { display: inline-flex; font-size: 11px; border-radius: 4px; padding: 5px 7px; line-height: 1.4; white-space: nowrap; }
.effect-chip.gain { color: #b2d1ba; background: #8db5a016; }
.effect-chip.loss { color: #d8a699; background: #c9867318; }
.life-feedback { position: fixed; z-index: 100; bottom: 27px; left: 50%; transform: translateX(-50%); width: max-content; max-width: min(92%, 460px); padding: 14px 18px; border: 1px solid #5d7262; border-radius: 8px; background: #202a24f5; box-shadow: 0 14px 50px #0007; color: #dfe8db; pointer-events: none; animation: feedbackIn .25s ease-out; }
.life-feedback > div:first-child { display: flex; gap: 8px; align-items: center; }
.life-feedback strong { font-size: 13px; font-weight: 500; line-height: 1.6; }
.life-feedback svg { width: 16px; height: 16px; color: var(--life-green); }
.feedback-effects { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.feedback-effects:empty { display: none; }
.value-changing { text-shadow: 0 0 14px #dfc88d55; }
.story-topbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; color: #929d97; font-size: 10px; }
.story-topbar button { font-size: 12px; }
.story-topbar svg { width: 15px; height: 15px; }
.compact-status { padding: 14px 18px; border: 1px solid #373d37; border-radius: 8px; background: #171b18; }
.compact-status .hero-cash { font-size: 37px; margin: 9px 0 13px; }
.compact-status .safety-row { padding-bottom: 9px; margin-bottom: 9px; }
.compact-status .safety-row strong { font-size: 18px; }
.compact-status .net-row strong { font-size: 17px; }
.compact-status .income-expense { margin-top: 12px; }
.compact-attributes { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid #303831; margin-top: 12px; padding-top: 10px; font-size: 10px; color: #859388; }
.compact-attributes b { color: #b6c1b2; font-weight: 500; }
.life-dialog { width: min(420px, calc(100% - 32px)); max-height: calc(100svh - 70px); overflow-y: auto; padding: 30px 24px 24px; border: 1px solid #465047; border-radius: 8px; background: #191e1b; color: #e9eee4; box-shadow: 0 22px 100px #0008; }
.life-dialog::backdrop { background: #030807bd; backdrop-filter: blur(6px); }
.dialog-close { position: absolute; right: 10px; top: 10px; }
.life-dialog h2 { font-size: 24px; }
.life-dialog label { display: block; font-size: 12px; color: #b1bbad; margin: 22px 0 9px; }
.life-dialog input { background: #101613; color: #f0f2e9; border: 1px solid #627562; border-radius: 5px; padding: 12px; width: 100%; font: inherit; font-size: 16px; outline-color: var(--life-gold); }
.input-note, .budget-note { margin-top: 10px; font-size: 11px; color: #89998a; line-height: 1.7; }
.life-dialog form > button { margin-top: 10px; }
.life-dialog .cost-breakdown { background: none; padding: 15px 0 0; border: 0; border-radius: 0; border-top: 1px solid #3c453d; }
.life-dialog .cashflow-panel div { background: none; border: 0; border-radius: 0; padding: 12px 0; border-bottom: 1px solid #2e392f; }
@keyframes feedbackIn { from { opacity: 0; translate: 0 9px; } to { opacity: 1; translate: 0 0; } }
@media (max-width: 1160px) and (min-width: 761px) {
  .life-dashboard { padding: 0 24px 32px; }
  .life-layout { grid-template-columns: 208px minmax(0, 1fr) 276px; gap: 20px; }
  .hero-cash { font-size: 40px; }
  .life-action { padding: 12px 9px; }
  .life-action strong { font-size: 12px; }
  .phone-device { padding-left: 14px; padding-right: 14px; }
}
@media (max-width: 980px) and (min-width: 761px) {
  .life-layout { grid-template-columns: 218px minmax(0, 1fr); gap: 28px; }
  .character-card { grid-row: 1 / span 2; position: sticky; top: 24px; }
  .phone-column { grid-column: 2; position: relative; top: 0; max-width: 390px; width: 100%; justify-self: center; }
}
@media (max-width: 760px) {
  .life-dashboard { padding: 0 20px 98px; }
  .life-topbar { min-height: 68px; margin-bottom: 16px; }
  .life-brand strong { font-size: 19px; }
  .life-brand small { font-size: 9px; }
  .day-display { width: 94px; font-size: 10px; }
  .day-display b { font-size: 22px; }
  .day-track { margin-top: 7px; }
  .life-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .character-card { border: 0; border-radius: 0; background: transparent; overflow: visible; }
  .character-scene { display: none; }
  .identity-row { margin: 0; padding: 0; align-items: center; gap: 13px; }
  .character-avatar { width: 49px; height: 50px; border: 1px solid #4f5d53; border-radius: 6px; background: #29352e; }
  .character-avatar svg { width: 27px; height: 27px; }
  .identity-copy { padding: 0; flex: 1; }
  .character-name { justify-content: space-between; }
  .character-name h1 { font-size: 21px; line-height: 1.3; }
  .identity-copy > p { font-size: 10px; margin-top: 3px; }
  .character-details { display: flex; flex-wrap: wrap; gap: 7px 16px; padding: 10px 0 0; }
  .character-details p { margin: 0; font-size: 10px; }
  .character-details svg { width: 12px; height: 12px; }
  .character-state { display: none; }
  .attribute-bars { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; padding: 13px 0 0; }
  .attribute > div:first-child { margin-bottom: 8px; }
  .attribute span { font-size: 10px; }
  .attribute strong { font-size: 13px; }
  .attribute strong small { display: none; }
  .attribute-track { height: 3px; }
  .character-footnote { display: none; }
  .life-status { padding-top: 0; padding-bottom: 14px; }
  .hero-cash { font-size: 46px; margin: 8px 0 10px; }
  .safety-row { padding-bottom: 9px; margin-bottom: 9px; }
  .safety-row strong { font-size: 20px; }
  .income-expense { margin-top: 10px; }
  .income-expense b { font-size: 11px; }
  .receipt-row { margin-top: 10px; }
  .budget-link { margin: 6px 0 10px; }
  .section-title { margin-bottom: 12px; }
  .section-title h2 { font-size: 18px; }
  .life-action { min-height: 116px; padding: 11px 10px 9px; }
  .life-action .action-icon { height: 22px; margin-bottom: 6px; }
  .life-action strong { margin-bottom: 5px; }
  .phone-column { position: relative; top: 0; display: none; }
  [data-mobile-tab="phone"] .character-card, [data-mobile-tab="phone"] .life-main { display: none; }
  [data-mobile-tab="phone"] .phone-column { display: block; }
  .phone-device { max-width: 430px; margin: 0 auto; }
  .phone-content { height: max(120px, calc(100svh - 392px - env(safe-area-inset-bottom, 0px))); }
  .phone-heading { padding-top: 19px; }
  .mobile-life-nav { position: fixed; z-index: 10; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #38403a; background: #151b17f5; padding: 8px 20px max(10px, env(safe-area-inset-bottom)); backdrop-filter: blur(16px); }
  .mobile-life-nav button { display: flex; align-items: center; justify-content: center; position: relative; min-height: 43px; gap: 8px; background: none; color: #7a8a7d; font-size: 12px; cursor: pointer; }
  .mobile-life-nav button.active { color: var(--life-gold); }
  .mobile-life-nav svg { width: 17px; height: 17px; }
  .mobile-life-nav b { background: #485e4e; color: #d4e5d5; min-width: 17px; height: 17px; font-size: 9px; font-weight: 500; border-radius: 10px; display: grid; place-items: center; }
  .life-feedback { bottom: 82px; max-width: calc(100% - 32px); padding: 13px 15px; }
}
@media (max-width: 360px) {
  .life-dashboard { padding-left: 16px; padding-right: 16px; }
  .hero-cash { font-size: 40px; }
  .action-grid { gap: 7px; }
  .life-action { padding: 12px 8px 9px; }
  .life-action strong { font-size: 12px; }
  .action-preview { font-size: 9px; }
  .action-detail { font-size: 8px; }
  .action-cost { right: 7px; }
  .section-title h2 { font-size: 17px; }
  .income-expense { gap: 8px; }
  .income-expense b { margin-left: 0; }
  .phone-device { padding-left: 15px; padding-right: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}