
  .lc-wrap { max-width: 1180px; margin: 0 auto; padding: 2.5rem var(--container-padding) 4rem; }

  .lc-header { margin-bottom: 1.75rem; }
  .lc-header h1 {
    font-family: var(--font-display);
    font-size: clamp(2rem, 5vw, 2.75rem);
    font-weight: 700; color: var(--ink); margin-bottom: 0.4rem;
  }
  .lc-header p { color: var(--ink-60); font-size: 1rem; max-width: 660px; margin: 0; }

  .lc-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 1.5rem; align-items: start; }
  @media (max-width: 900px) { .lc-layout { grid-template-columns: 1fr; } }

  /* ── Calculator. The hero surface, so it wears the chip offset. ── */
  .lc-card {
    background: var(--surface); border: 2px solid var(--keyline);
    border-radius: var(--r-sm); box-shadow: var(--shadow-chip);
    padding: 1.5rem; margin-right: 5px;
  }
  .lc-card-title {
    display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
    font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--ink-45); margin-bottom: 1rem;
  }
  .lc-reset {
    border: 0; background: none; padding: 0; cursor: pointer; font-family: var(--font-body);
    font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
    color: var(--coral-dark);
  }
  .lc-reset:hover { text-decoration: underline; }

  /* ── Mode switches ─────────────────────────────────────────── */
  .lc-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; margin-bottom: 1.25rem; }
  @media (max-width: 560px) { .lc-modes { grid-template-columns: 1fr; } }
  .lc-modes .lbl {
    display: block; font-size: 0.74rem; color: var(--ink-45); font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.3rem;
  }
  .lc-seg { display: flex; border: 1.5px solid var(--rule); border-radius: var(--r-sm); overflow: hidden; }
  .lc-seg button {
    flex: 1; padding: 0.55rem 0.5rem; border: 0; background: var(--surface);
    font-family: var(--font-body); font-size: 0.85rem; font-weight: 600;
    color: var(--ink-60); cursor: pointer;
  }
  .lc-seg button + button { border-left: 1.5px solid var(--rule); }
  .lc-seg button:hover { background: var(--wash-2); }
  .lc-seg button[aria-pressed="true"] { background: var(--ink); color: #fff; }

  /* ── Inputs ────────────────────────────────────────────────── */
  .lc-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; }
  @media (max-width: 560px) { .lc-fields { grid-template-columns: 1fr; } }
  .lc-fields.book { padding-bottom: 1.1rem; border-bottom: 1px solid var(--rule); margin-bottom: 1.1rem; }

  .lc-field label {
    display: block; font-size: 0.74rem; color: var(--ink-45); font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.3rem;
  }
  .lc-input { position: relative; }
  .lc-input input {
    width: 100%; box-sizing: border-box; border: 1.5px solid var(--rule);
    border-radius: var(--r-sm); padding: 0.65rem 0.75rem; font-size: 1.1rem;
    font-family: inherit; font-weight: 600; font-variant-numeric: tabular-nums;
    background: var(--surface); color: var(--ink-strong);
  }
  .lc-input input::placeholder { color: var(--ink-20); font-weight: 500; }
  .lc-input input:focus { outline: 2px solid var(--coral-light); border-color: var(--coral); }
  .lc-input.money input { padding-left: 1.6rem; }
  .lc-input.pct input { padding-right: 2.1rem; }
  .lc-input .pre, .lc-input .suffix {
    position: absolute; top: 50%; transform: translateY(-50%);
    color: var(--ink-45); font-weight: 600; pointer-events: none;
  }
  .lc-input .pre { left: 0.75rem; }
  .lc-input .suffix { right: 0.75rem; }
  .lc-hint { font-size: 0.74rem; color: var(--ink-45); margin-top: 0.3rem; line-height: 1.4; }
  .lc-hint.warn { color: var(--negative-strong); font-weight: 600; }

  /* ── Results ───────────────────────────────────────────────── */
  .lc-results { margin-top: 1.4rem; }
  .lc-idle {
    background: var(--wash-2); border: 1px dashed var(--rule); border-radius: var(--r-sm);
    padding: 1.1rem; font-size: 0.9rem; color: var(--ink-45); text-align: center;
  }

  .lc-headline {
    background: var(--wash-2); border: 2px solid var(--keyline); border-radius: var(--r-sm);
    padding: 1.1rem 1.2rem;
  }
  .lc-headline .eyebrow {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--ink-45); margin-bottom: 0.45rem;
  }
  .lc-stake-line { display: flex; align-items: center; gap: 0.7rem; flex-wrap: wrap; }
  .lc-stake-big {
    font-family: var(--font-display); font-size: 2.1rem; font-weight: 700; line-height: 1;
    color: var(--ink); font-variant-numeric: tabular-nums;
  }
  .lc-at { font-size: 0.9rem; color: var(--ink-60); }
  .lc-copy {
    border: 1.5px solid var(--keyline); background: var(--surface); border-radius: var(--r-sm);
    padding: 0.3rem 0.7rem; font-family: var(--font-body); font-size: 0.78rem; font-weight: 700;
    letter-spacing: 0.03em; text-transform: uppercase; color: var(--ink); cursor: pointer;
  }
  .lc-copy:hover { background: var(--wash); }
  .lc-copy.done { background: var(--positive-10); border-color: var(--positive-strong); color: var(--positive-deep); }

  .lc-lock {
    display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
    flex-wrap: wrap; margin-top: 0.9rem; padding-top: 0.9rem; border-top: 1px solid var(--rule);
    font-size: 0.95rem; color: var(--ink-60);
  }
  .lc-lock .amt { font-size: 1.4rem; font-weight: 700; font-variant-numeric: tabular-nums; }
  .lc-lock .amt.pos { color: var(--positive-strong); }
  .lc-lock .amt.neg { color: var(--negative-strong); }

  .lc-rows { list-style: none; padding: 0; margin: 1rem 0 0; }
  .lc-rows li {
    display: flex; align-items: baseline; justify-content: space-between; gap: 0.75rem;
    padding: 0.5rem 0; border-bottom: 1px solid var(--rule); font-size: 0.9rem; color: var(--ink-60);
  }
  .lc-rows li:last-child { border-bottom: 0; }
  .lc-rows .val { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
  .lc-rows .val.pos { color: var(--positive-strong); }
  .lc-rows .val.neg { color: var(--negative-strong); }

  .lc-note {
    margin-top: 1rem; background: var(--info-05); border-left: 3px solid var(--info);
    border-radius: 0 var(--r-sm) var(--r-sm) 0; padding: 0.75rem 0.95rem;
    font-size: 0.85rem; color: var(--ink-60); line-height: 1.6;
  }
  .lc-note.bad { background: var(--negative-05); border-left-color: var(--negative); }
  .lc-note strong { color: var(--ink); }

  /* ── Alternatives ──────────────────────────────────────────── */
  .lc-alts { display: grid; grid-template-columns: 1fr 1fr; gap: 0.9rem; margin-top: 1rem; }
  @media (max-width: 560px) { .lc-alts { grid-template-columns: 1fr; } }
  .lc-alt {
    border: 1.5px solid var(--rule); border-radius: var(--r-sm); background: var(--surface); padding: 0.95rem 1rem;
  }
  .lc-alt h3 {
    font-family: var(--font-body); font-size: 0.72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-45); margin: 0 0 0.15rem;
  }
  .lc-alt .why { font-size: 0.78rem; color: var(--ink-45); margin: 0 0 0.6rem; line-height: 1.45; }
  .lc-alt .amt-line { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
  .lc-alt .amt {
    font-size: 1.35rem; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums;
  }
  .lc-alt .lc-rows li { font-size: 0.84rem; padding: 0.35rem 0; }

  /* ── Custom lay ────────────────────────────────────────────── */
  .lc-custom { margin-top: 1rem; border: 1.5px solid var(--rule); border-radius: var(--r-sm); padding: 0.95rem 1rem; }
  .lc-custom h3 {
    font-family: var(--font-body); font-size: 0.72rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-45); margin: 0 0 0.55rem;
  }
  .lc-slider-row { display: flex; align-items: center; gap: 0.8rem; flex-wrap: wrap; }
  .lc-slider-row input[type="range"] { flex: 1 1 200px; accent-color: var(--coral); }
  .lc-slider-row .box {
    display: flex; align-items: center; gap: 0.3rem; border: 1.5px solid var(--rule);
    border-radius: var(--r-sm); padding: 0.3rem 0.55rem; background: var(--surface);
  }
  .lc-slider-row .box span { color: var(--ink-45); font-weight: 600; font-size: 0.9rem; }
  .lc-slider-row .box input {
    width: 74px; border: 0; padding: 0; font-family: inherit; font-size: 0.95rem; font-weight: 700;
    font-variant-numeric: tabular-nums; color: var(--ink-strong); background: none;
  }
  .lc-slider-row .box input:focus { outline: none; }
  .lc-band { font-size: 0.78rem; color: var(--ink-45); margin-top: 0.55rem; line-height: 1.5; }

  /* ── Sidebar ───────────────────────────────────────────────── */
  .lc-side { position: sticky; top: 6rem; }
  @media (max-width: 900px) { .lc-side { position: static; } }
  .lc-promo {
    background: var(--surface); border: 2px solid var(--keyline); border-radius: var(--r-sm);
    box-shadow: 5px 5px 0 var(--ink); padding: 1.35rem; margin-right: 5px;
  }
  .lc-promo .eyebrow {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--coral-dark); margin-bottom: 0.5rem;
  }
  .lc-promo h2 {
    font-family: var(--font-display); font-size: 1.35rem; font-weight: 700;
    color: var(--ink); line-height: 1.25; margin: 0 0 0.6rem;
  }
  .lc-promo > p { font-size: 0.88rem; color: var(--ink-60); line-height: 1.6; margin: 0 0 1rem; }
  .lc-stats { list-style: none; padding: 0; margin: 0 0 1.1rem; border-top: 1px solid var(--rule); }
  .lc-stats li {
    display: flex; align-items: baseline; justify-content: space-between; gap: 0.6rem;
    padding: 0.55rem 0; border-bottom: 1px solid var(--rule);
    font-size: 0.85rem; color: var(--ink-60);
  }
  .lc-stats .val { font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
  .lc-cta {
    display: block; text-align: center; background: var(--coral); color: #fff; font-weight: 700;
    padding: 0.7rem 1rem; border: 2px solid var(--keyline); border-radius: var(--r-sm);
    box-shadow: 3px 3px 0 var(--keyline); text-decoration: none; font-size: 0.92rem;
    transition: transform 0.1s ease, box-shadow 0.1s ease;
  }
  .lc-cta:hover, .lc-cta:focus-visible { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--keyline); }
  .lc-cta-sub { display: block; text-align: center; font-size: 0.82rem; margin-top: 0.7rem; color: var(--ink-45); }
  .lc-cta-sub a { color: var(--coral-dark); font-weight: 600; }

  .lc-side-links { margin-top: 1rem; border: 1px solid var(--rule); border-radius: var(--r-sm); background: var(--wash-2); padding: 0.4rem 1rem; }
  .lc-side-links a {
    display: block; padding: 0.55rem 0; font-size: 0.86rem; font-weight: 600;
    color: var(--ink-70); text-decoration: none; border-bottom: 1px solid var(--rule);
  }
  .lc-side-links a:last-child { border-bottom: 0; }
  .lc-side-links a:hover { color: var(--coral-dark); }
  .lc-side-links span { display: block; font-weight: 400; font-size: 0.78rem; color: var(--ink-45); }

  /* ── Static content below ──────────────────────────────────── */
  .lc-public { margin-top: 3.5rem; padding-top: 2rem; border-top: 2px solid var(--keyline); }
  .lc-public h2 {
    font-family: var(--font-display); font-size: 1.4rem; font-weight: 700;
    color: var(--ink); margin: 2rem 0 0.6rem;
  }
  .lc-public > h2:first-child { margin-top: 0; }
  .lc-public h3 {
    font-family: var(--font-body); font-size: 1.02rem; font-weight: 700;
    color: var(--ink); margin: 1.6rem 0 0.5rem;
  }
  .lc-public p { color: var(--ink-60); line-height: 1.7; margin-bottom: 0.9rem; max-width: 720px; }
  .lc-public a { color: var(--coral-dark); font-weight: 600; }
  .lc-public strong { color: var(--ink); }
  .lc-public ol, .lc-public ul { color: var(--ink-60); line-height: 1.7; max-width: 720px; padding-left: 1.2rem; margin-bottom: 0.9rem; }
  .lc-public li { margin-bottom: 0.45rem; }

  .lc-formula {
    background: var(--wash-2); border-left: 3px solid var(--coral);
    border-radius: 0 var(--r-sm) var(--r-sm) 0; padding: 0.9rem 1.1rem; margin: 0 0 1.2rem;
    font-size: 0.92rem; color: var(--ink-70); line-height: 1.7; max-width: 720px;
  }
  .lc-formula code { font-family: inherit; font-weight: 700; color: var(--ink); }

  table.lc-mini {
    border-collapse: collapse; border: 2px solid var(--keyline); background: var(--surface);
    box-shadow: var(--shadow-chip); font-size: 0.87rem; margin: 0 5px 1.4rem 0; width: 100%; max-width: 700px;
  }
  table.lc-mini th {
    text-align: left; font-size: 0.7rem; letter-spacing: 0.04em; text-transform: uppercase;
    color: var(--ink-45); font-weight: 700; padding: 0.6rem 0.75rem;
    border-bottom: 2px solid var(--keyline); white-space: nowrap;
  }
  table.lc-mini td {
    padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--rule);
    color: var(--ink-60); font-variant-numeric: tabular-nums; white-space: nowrap;
  }
  table.lc-mini tr:last-child td { border-bottom: 0; }
  .lc-scroll { overflow-x: auto; }

  .lc-faq { max-width: 720px; margin-top: 1rem; }
  .lc-faq details {
    border: 1px solid var(--rule); border-radius: var(--r-sm);
    background: var(--wash-2); margin-bottom: 0.5rem; padding: 0.85rem 1.1rem;
  }
  .lc-faq summary { cursor: pointer; font-weight: 600; color: var(--ink); list-style: none; }
  .lc-faq summary::-webkit-details-marker { display: none; }
  .lc-faq details[open] summary { margin-bottom: 0.6rem; }
  .lc-faq details p { margin: 0; font-size: 0.93rem; }

  .lc-rg { font-size: 0.8rem; color: var(--ink-45); margin-top: 2rem; line-height: 1.6; }

  .lc-wrap button:focus-visible, .lc-wrap input:focus-visible, .lc-wrap a:focus-visible {
    outline: 2px solid var(--coral); outline-offset: 1px;
  }
  @media (prefers-reduced-motion: reduce) { .lc-wrap * { transition: none !important; } }
