.calculator-page {
  --calc-bg: #0b100d;
  --calc-panel: #121a15;
  --calc-panel-raised: #17221b;
  --calc-line: rgba(225, 207, 145, 0.15);
  --calc-line-strong: rgba(225, 207, 145, 0.3);
  --calc-text: #f4eedb;
  --calc-muted: #91a095;
  --calc-gold: #e1c873;
  --calc-green: #78c38d;
  --calc-green-deep: #183c27;
  --calc-orange: #e4a957;
  background:
    radial-gradient(circle at 8% 0%, rgba(68, 118, 78, 0.22), transparent 30rem),
    radial-gradient(circle at 92% 5%, rgba(157, 126, 47, 0.14), transparent 28rem),
    var(--calc-bg);
  color: var(--calc-text);
  font-family: "Noto Sans SC", "Microsoft YaHei", sans-serif;
  zoom: 1.5;
}

.calculator-page [hidden] {
  display: none !important;
}

.calculator-page button,
.calculator-page input,
.calculator-page select {
  font: inherit;
}

.calculator-page button:focus-visible,
.calculator-page input:focus-visible,
.calculator-page select:focus-visible,
.calculator-page a:focus-visible {
  outline: 2px solid var(--calc-gold);
  outline-offset: 2px;
}

.calculator-shell {
  width: min(1440px, calc(100vw - 48px));
  margin: 0 auto;
}

.calculator-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 72px;
}

.calculator-brand {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  color: var(--calc-text);
  font-weight: 700;
  text-decoration: none;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid var(--calc-line-strong);
  border-radius: 9px;
  color: var(--calc-gold);
  font-family: Georgia, serif;
  font-size: 12px;
  letter-spacing: 0.08em;
}

.text-link {
  color: var(--calc-muted);
  text-decoration: none;
}

.text-link:hover { color: var(--calc-text); }

.calculator-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 72px;
  align-items: end;
  padding: 56px 0 42px;
  border-bottom: 1px solid var(--calc-line);
}

.calculator-hero h1 {
  margin: 10px 0 0;
  color: var(--calc-text);
  font-family: Georgia, "Noto Serif SC", "Songti SC", serif;
  font-size: clamp(38px, 5vw, 68px);
  font-weight: 500;
  letter-spacing: -0.04em;
}

.calculator-hero > p {
  margin: 0 0 5px;
  color: var(--calc-muted);
  font-size: 15px;
  line-height: 1.85;
}

.auth-panel,
.session-bar {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-top: 24px;
  padding: 18px 20px;
  border: 1px solid var(--calc-line);
  border-radius: 16px;
  background: rgba(18, 26, 21, 0.9);
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.2);
}

.auth-copy {
  display: grid;
  gap: 4px;
  min-width: 220px;
}

.auth-copy span { color: var(--calc-muted); font-size: 12px; }
.auth-fields, .session-fields { display: flex; flex: 1; gap: 10px; }

.calculator-page input,
.calculator-page select {
  min-width: 0;
  height: 44px;
  border: 1px solid var(--calc-line);
  border-radius: 10px;
  color: var(--calc-text);
  background: rgba(5, 9, 7, 0.52);
  padding: 0 13px;
  outline: none;
}

.calculator-page input:focus,
.calculator-page select:focus { border-color: var(--calc-line-strong); }
.calculator-page input::placeholder { color: #68766c; }

.button-primary,
.button-secondary,
.button-quiet,
.button-sale {
  min-height: 42px;
  border-radius: 10px;
  padding: 0 16px;
  font-weight: 700;
}

.button-primary {
  border: 1px solid var(--calc-gold);
  color: #182014;
  background: var(--calc-gold);
}

.button-primary:hover:not(:disabled) { background: #ecd887; }
.button-secondary { border: 1px solid var(--calc-line-strong); color: var(--calc-text); background: transparent; }
.button-secondary:hover:not(:disabled) { background: var(--calc-panel-raised); }
.button-quiet { border: 0; color: var(--calc-muted); background: transparent; }
.button-quiet:hover { color: var(--calc-text); }
.calculator-page button:disabled { cursor: not-allowed; opacity: 0.45; }

.account-block {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 140px;
  color: var(--calc-muted);
  font-size: 13px;
}

.account-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--calc-green); box-shadow: 0 0 0 4px rgba(120, 195, 141, 0.1); }
.session-fields input:first-child { flex: 1; }

.calculator-workspace {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  gap: 28px;
  padding: 28px 0 80px;
}

.history-panel {
  position: sticky;
  top: 20px;
  align-self: start;
  min-height: 180px;
  border: 1px solid var(--calc-line);
  border-radius: 16px;
  background: rgba(18, 26, 21, 0.7);
  padding: 14px;
}

.section-label {
  padding: 5px 8px 13px;
  color: var(--calc-muted);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.party-list { display: grid; gap: 6px; }
.party-entry { display: flex; align-items: stretch; border: 1px solid transparent; border-radius: 10px; }
.party-entry:hover, .party-entry.active { border-color: var(--calc-line); background: var(--calc-panel-raised); }
.party-row { display: grid; gap: 5px; flex: 1; min-width: 0; border: 0; border-radius: 10px; color: var(--calc-muted); background: transparent; padding: 11px 8px 11px 12px; text-align: left; }
.party-entry:hover .party-row, .party-entry.active .party-row { color: var(--calc-text); }
.party-row-title { overflow: hidden; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.party-row-date { color: #6f7f73; font-size: 11px; }
.party-delete { width: 32px; border: 0; border-radius: 8px; color: #68766c; background: transparent; font-size: 18px; }
.party-delete:hover { color: #e0907e; background: rgba(208, 104, 88, 0.08); }
.aside-empty { padding: 24px 8px; color: var(--calc-muted); line-height: 1.7; text-align: center; }
.aside-empty span { color: #68766c; font-size: 11px; }

.ledger-detail { min-width: 0; }
.empty-ledger { display: grid; place-items: center; min-height: 360px; border: 1px dashed var(--calc-line-strong); border-radius: 18px; padding: 60px; text-align: center; }
.empty-ledger h2 { margin: 12px 0 6px; font-family: Georgia, "Noto Serif SC", serif; font-size: 24px; }
.empty-ledger p { margin: 0; color: var(--calc-muted); }
.empty-icon { color: var(--calc-gold); font-size: 30px; }

.ledger-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.ledger-heading h2 { margin: 5px 0 0; font-family: Georgia, "Noto Serif SC", serif; font-size: 34px; font-weight: 500; }
.ledger-date { color: var(--calc-gold); font-size: 12px; letter-spacing: 0.08em; }

.ledger-actions { display: flex; gap: 8px; }
.button-danger { min-height: 42px; border: 1px solid rgba(208, 104, 88, 0.3); border-radius: 10px; color: #d88d7c; background: transparent; padding: 0 13px; }
.button-danger:hover { border-color: rgba(208, 104, 88, 0.6); background: rgba(208, 104, 88, 0.08); }

.sidebar-stats { display: grid; gap: 14px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--calc-line); }
.sidebar-pool { display: grid; gap: 5px; border: 1px solid rgba(225, 200, 115, 0.28); border-radius: 12px; background: linear-gradient(145deg, rgba(62, 55, 25, 0.7), rgba(24, 34, 27, 0.7)); padding: 14px; }
.sidebar-pool span, .sidebar-pool small { color: var(--calc-muted); font-size: 10px; }
.sidebar-pool strong { color: var(--calc-gold); font-family: Georgia, serif; font-size: 31px; font-weight: 500; }
.sidebar-stats dl { display: grid; gap: 8px; margin: 0; }
.sidebar-stats dl div { display: flex; justify-content: space-between; gap: 10px; color: var(--calc-muted); font-size: 11px; }
.sidebar-stats dt { color: var(--calc-muted); }
.sidebar-stats dd { margin: 0; color: var(--calc-text); font-family: Georgia, serif; font-size: 13px; }

.ledger-section { margin-top: 16px; border: 1px solid var(--calc-line); border-radius: 16px; background: rgba(18, 26, 21, 0.75); padding: 22px; }
.section-heading { margin-bottom: 18px; }
.section-heading > div { display: flex; align-items: flex-start; gap: 12px; }
.section-heading h3 { margin: 0; font-family: Georgia, "Noto Serif SC", serif; font-size: 19px; font-weight: 600; }
.section-heading p { margin: 5px 0 0; color: var(--calc-muted); font-size: 12px; line-height: 1.6; }
.split-heading { display: flex; align-items: flex-start; justify-content: space-between; }
.step-number { display: grid; place-items: center; flex: 0 0 30px; height: 30px; border: 1px solid var(--calc-line-strong); border-radius: 8px; color: var(--calc-gold); font-family: Georgia, serif; font-size: 11px; }
.count-badge { border: 1px solid rgba(228, 169, 87, 0.25); border-radius: 999px; color: var(--calc-orange); background: rgba(228, 169, 87, 0.08); padding: 5px 10px; font-size: 11px; }
.sold-count { border-color: rgba(120, 195, 141, 0.25); color: var(--calc-green); background: rgba(120, 195, 141, 0.08); }
.status-orb { flex: 0 0 11px; height: 11px; margin: 6px 5px 0; border-radius: 50%; }
.status-orb.selling { background: var(--calc-orange); box-shadow: 0 0 0 5px rgba(228, 169, 87, 0.08); }
.status-orb.sold { background: var(--calc-green); box-shadow: 0 0 0 5px rgba(120, 195, 141, 0.08); }

.member-layout { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.member-list { display: flex; flex-wrap: wrap; gap: 8px; }
.member-chip { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--calc-line); border-radius: 999px; padding: 6px 10px 6px 6px; color: var(--calc-text); font-size: 12px; }
.member-chip b { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 50%; color: var(--calc-gold); background: rgba(225, 200, 115, 0.1); font-family: Georgia, serif; font-size: 10px; }
.favorite-toggle { width: 24px; height: 24px; margin: -3px -5px -3px 0; border: 0; border-radius: 50%; color: #566159; background: transparent; padding: 0; line-height: 1; }
.favorite-toggle:hover, .favorite-toggle.active { color: var(--calc-gold); background: rgba(225, 200, 115, 0.1); }
.inline-empty { color: var(--calc-muted); font-size: 12px; }
.compact-form { display: flex; flex: 0 0 auto; gap: 8px; }

.favorite-roster { display: grid; grid-template-columns: 170px 1fr; gap: 18px; align-items: center; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--calc-line); }
.favorite-roster-label { display: flex; align-items: center; gap: 10px; }
.favorite-roster-label > span { color: var(--calc-gold); }
.favorite-roster-label div { display: grid; gap: 3px; }
.favorite-roster-label strong { font-size: 12px; }
.favorite-roster-label small { color: var(--calc-muted); font-size: 9px; }
.favorite-list { display: flex; flex-wrap: wrap; gap: 7px; }
.favorite-person { display: inline-flex; overflow: hidden; border: 1px solid var(--calc-line); border-radius: 999px; background: rgba(225, 200, 115, 0.04); }
.favorite-person button { min-height: 30px; border: 0; color: var(--calc-text); background: transparent; padding: 0 10px; font-size: 11px; }
.favorite-person button:first-child:hover { color: var(--calc-gold); background: rgba(225, 200, 115, 0.08); }
.favorite-person button:last-child { color: var(--calc-muted); padding: 0 9px 1px 5px; }
.favorite-person button:last-child:hover { color: #d68772; }
.favorite-empty { color: #68766c; font-size: 11px; }

.loot-form { display: grid; grid-template-columns: 170px minmax(220px, 1fr) 90px 150px auto; gap: 10px; align-items: end; }
.loot-form label { display: grid; gap: 7px; }
.loot-form label > span, .sale-action > label, .relist-action > label { color: var(--calc-muted); font-size: 11px; font-weight: 700; }
.loot-form em { color: #68766c; font-style: normal; font-weight: 400; }

.loot-list, .sold-list, .settlement-list { display: grid; gap: 10px; }
.loot-card { display: grid; grid-template-columns: minmax(200px, 1fr) 160px minmax(350px, 1.2fr); gap: 22px; align-items: center; position: relative; overflow: hidden; border: 1px solid var(--calc-line); border-radius: 14px; background: var(--calc-panel); padding: 26px 54px 18px 18px; }
.selling-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--calc-orange); }
.loot-status { position: absolute; top: 8px; left: 18px; display: flex; align-items: center; gap: 6px; color: var(--calc-orange); font-size: 10px; font-weight: 700; }
.pulse-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--calc-orange); box-shadow: 0 0 0 4px rgba(228, 169, 87, 0.09); }
.loot-main { display: flex; align-items: center; gap: 13px; }
.loot-icon { display: grid; place-items: center; flex: 0 0 44px; height: 44px; border: 1px solid var(--calc-line-strong); border-radius: 12px; color: var(--calc-gold); background: rgba(225, 200, 115, 0.07); font-family: Georgia, "Noto Serif SC", serif; font-size: 18px; }
.loot-main h4, .sold-row h4 { margin: 0; font-size: 15px; }
.loot-main h4 small, .sold-row h4 small { color: var(--calc-muted); font-weight: 400; }
.loot-main p, .sold-row p { margin: 6px 0 0; color: var(--calc-muted); font-size: 11px; }
.estimate-block { display: grid; gap: 5px; padding-left: 18px; border-left: 1px solid var(--calc-line); }
.estimate-block span { color: var(--calc-muted); font-size: 10px; }
.estimate-block strong { font-family: Georgia, serif; font-size: 19px; font-weight: 500; }
.estimate-block small { color: #68766c; font-size: 10px; line-height: 1.45; }
.trade-actions { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) 112px; align-items: end; gap: 12px; }
.sale-action, .relist-action { display: grid; min-width: 0; gap: 7px; }
.relist-action > div { display: grid; min-width: 0; grid-template-columns: minmax(0, 1fr) 82px; gap: 7px; }
.sale-action input, .relist-action input { width: 100%; min-width: 0; }
.sale-action small, .relist-action small { color: #68766c; font-size: 10px; }
.button-sale { flex: 0 0 auto; border: 1px solid var(--calc-orange); color: #261a0c; background: var(--calc-orange); }
.button-sale:hover:not(:disabled) { background: #efba6b; }
.relist-action .button-secondary { min-width: 0; padding: 0 8px; white-space: nowrap; }
.button-sale { min-width: 0; white-space: nowrap; }
.sale-action .button-sale { width: 100%; }
.loot-delete { position: absolute; top: 13px; right: 14px; border: 0; color: #7e625d; background: transparent; padding: 5px; font-size: 11px; }
.loot-delete:hover { color: #e0907e; }

.cash-entry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cash-entry-card { display: grid; grid-template-columns: 120px minmax(180px, 1fr) 110px; gap: 9px; align-items: end; border: 1px solid var(--calc-line); border-radius: 12px; background: var(--calc-panel); padding: 14px; }
.cash-entry-card > div { display: grid; grid-column: 1 / 3; gap: 4px; }
.cash-entry-card strong { font-size: 13px; }
.cash-entry-card small { color: var(--calc-muted); font-size: 10px; }
.cash-entry-card input[placeholder*="备注"] { grid-column: 3; grid-row: 1; }
.cash-entry-card select { grid-column: 1; grid-row: 2; }
.cash-entry-card input[type="number"] { grid-column: 2; grid-row: 2; }
.cash-entry-card button { grid-column: 3; grid-row: 2; }
.income-entry { border-left: 3px solid var(--calc-green); }
.expense-entry { border-left: 3px solid #d68772; }
.pool-cash-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--calc-line); border-left: 3px solid var(--calc-green); border-radius: 12px; background: var(--calc-panel); padding: 14px 16px; }
.pool-cash-row > div { display: flex; align-items: center; gap: 12px; }
.pool-cash-row > div > span { min-width: 58px; border-radius: 999px; color: var(--calc-green); background: rgba(120, 195, 141, 0.1); padding: 5px 8px; text-align: center; font-size: 10px; font-weight: 700; }
.pool-cash-row h4 { margin: 0; font-size: 14px; }
.pool-cash-row p { margin: 5px 0 0; color: var(--calc-muted); font-size: 11px; }
.pool-cash-row > strong { color: var(--calc-green); font-family: Georgia, serif; font-size: 18px; }
.pool-cash-row.is-expense { border-left-color: #d68772; }
.pool-cash-row.is-expense > div > span, .pool-cash-row.is-expense > strong { color: #d68772; }
.pool-cash-row.is-expense > div > span { background: rgba(214, 135, 114, 0.1); }

.section-empty { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 110px; border: 1px dashed var(--calc-line); border-radius: 12px; color: var(--calc-muted); }
.section-empty > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--calc-green); background: rgba(120, 195, 141, 0.08); }
.section-empty strong { color: var(--calc-text); font-size: 13px; }
.section-empty p { margin: 4px 0 0; font-size: 11px; }
.section-empty.compact { min-height: 72px; }

.sold-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--calc-line); border-radius: 12px; background: var(--calc-panel); padding: 14px 16px; }
.sold-row > div { display: flex; align-items: center; gap: 12px; }
.sold-check { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: var(--calc-green); background: var(--calc-green-deep); }
.sold-row dl { display: grid; grid-template-columns: repeat(4, minmax(70px, 1fr)); gap: 18px; margin: 0; }
.sold-row dl div { display: grid; gap: 4px; }
.sold-row dt { color: var(--calc-muted); font-size: 10px; }
.sold-row dd { margin: 0; font-family: Georgia, serif; font-size: 16px; }
.sold-row .tax-value { color: #d68772; }
.sold-row .net-value { color: var(--calc-green); }

.settlement-card { display: grid; grid-template-columns: 190px 1fr; gap: 20px; border: 1px solid var(--calc-line); border-radius: 12px; background: var(--calc-panel); padding: 16px; }
.settlement-summary { display: grid; gap: 5px; padding-right: 18px; border-right: 1px solid var(--calc-line); }
.settlement-summary span, .settlement-summary small { color: var(--calc-muted); font-size: 10px; }
.settlement-summary strong { font-size: 14px; }
.settlement-details { display: grid; gap: 12px; align-content: center; }
.settlement-chain { margin: 0; color: var(--calc-muted); font-size: 11px; line-height: 1.6; }
.settlement-chain::first-line { color: var(--calc-text); }
.transfer-list { display: grid; gap: 6px; align-content: center; }
.transfer-list > div { display: grid; grid-template-columns: 1fr 24px 1fr 80px; gap: 8px; align-items: center; color: var(--calc-muted); font-size: 12px; }
.transfer-list b { color: var(--calc-gold); text-align: center; }
.transfer-list strong { color: var(--calc-text); text-align: right; }
.transfer-list p { margin: 0; color: var(--calc-muted); font-size: 12px; }

.calculator-page .notice { top: 22px; border-color: rgba(120, 195, 141, 0.4); background: #173621; }
.calculator-page .notice.error { border-color: rgba(218, 112, 112, 0.6); background: #492528; }

@media (max-width: 1120px) {
  .calculator-shell { width: min(100% - 32px, 960px); }
  .calculator-hero { grid-template-columns: 1fr; gap: 18px; }
  .loot-form { grid-template-columns: repeat(2, 1fr); }
  .loot-form .button-primary { min-height: 44px; }
  .loot-card { grid-template-columns: 1fr 150px; }
  .trade-actions { grid-column: 1 / -1; }
  .cash-entry-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .calculator-page { zoom: 1; }
  .calculator-shell { width: min(100% - 20px, 640px); }
  .calculator-nav { min-height: 58px; }
  .calculator-hero { padding: 34px 0 28px; }
  .calculator-hero h1 { font-size: 38px; }
  .auth-panel, .session-bar { align-items: stretch; flex-direction: column; gap: 14px; }
  .auth-fields, .session-fields { flex-direction: column; }
  .calculator-workspace { grid-template-columns: 1fr; }
  .history-panel { position: static; }
  .party-list { display: flex; overflow-x: auto; }
  .party-entry { min-width: 170px; }
  .ledger-heading { align-items: flex-start; flex-direction: column; }
  .stat-card { min-height: 112px; padding: 14px; }
  .member-layout { align-items: stretch; flex-direction: column; }
  .compact-form { flex-direction: column; }
  .favorite-roster { grid-template-columns: 1fr; }
  .loot-form { grid-template-columns: 1fr; }
  .loot-card { grid-template-columns: 1fr; }
  .estimate-block { padding: 0; border: 0; }
  .trade-actions { grid-template-columns: 1fr; }
  .cash-entry-card { grid-template-columns: 1fr; }
  .cash-entry-card > div, .cash-entry-card input[placeholder*="备注"], .cash-entry-card select, .cash-entry-card input[type="number"], .cash-entry-card button { grid-column: auto; grid-row: auto; }
  .pool-cash-row { align-items: flex-start; flex-direction: column; gap: 8px; }
  .ledger-actions { width: 100%; flex-direction: column; }
  .sold-row { align-items: flex-start; flex-direction: column; }
  .sold-row dl { width: 100%; }
  .settlement-card { grid-template-columns: 1fr; }
  .settlement-summary { padding: 0 0 14px; border-right: 0; border-bottom: 1px solid var(--calc-line); }
  .settlement-summary { padding: 0 0 12px; border: 0; border-bottom: 1px solid var(--calc-line); }
}
