:root{
  color-scheme:light;
  --ink:#152e46;
  --muted:#526476;
  --teal:#08796f;
  --amber:#926112;
  --paper:#fff;
  --ground:#f2f6f8;
  --line:#cbd6dd;
  --light-teal:#edf8f5;
  --light-amber:#fbf1e0;
  --error:#9b2635;
  --error-bg:#fff1f2;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  background:var(--ground);
  font-size:16px;
  line-height:1.5;
  font-synthesis:none;
}
*{box-sizing:border-box}
html,body{margin:0;overflow-x:hidden;max-width:100%}
button,input,select{font:inherit}
button,select,summary,input[type=checkbox],input[type=range]{cursor:pointer}
button{border:1px solid var(--line);background:var(--paper);color:var(--ink);padding:10px 14px;min-height:44px;border-radius:7px;font-weight:650}
button:hover{background:var(--light-teal);border-color:var(--teal)}
button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
a{color:#075f77;text-underline-offset:3px}
:focus-visible{outline:3px solid #0a837a;outline-offset:2px}
input,select{width:100%;min-height:46px;padding:9px 11px;border:1px solid #a7b8c5;border-radius:6px;background:#fff;color:var(--ink);font-variant-numeric:tabular-nums}
input[aria-invalid=true]{border:2px solid var(--error)}
label{display:block;font-size:14px;font-weight:650;margin:0 0 6px}
h1,h2,h3,p{margin-top:0}
h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(26px,3.4vw,36px);line-height:1.15;font-weight:400;letter-spacing:-.5px;margin-bottom:6px}
h2{font-size:19px;margin-bottom:4px}
p{margin-bottom:10px}
summary{font-size:16px;font-weight:700;min-height:44px;padding:10px 0;display:list-item}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;top:-100px;left:16px;background:#fff;padding:12px;border-radius:6px;z-index:5}
.skip-link:focus{top:10px}
[hidden]{display:none!important}

.app-shell{max-width:980px;margin:0 auto;padding:22px 18px 40px}
.eyebrow{font-size:11px;font-weight:750;letter-spacing:1.5px;color:var(--muted);margin-bottom:8px}
.subtitle{font-size:15px;color:var(--muted);margin:0 0 18px}

/* input card */
.input-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:20px;margin-bottom:18px}
.field-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.field{min-width:0}
#age-error{margin-top:12px}
.sum-block{margin-top:16px;padding-top:16px;border-top:1px solid var(--line)}
.tier-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:4px}
.tier-buttons button{padding:10px 6px;font-size:13px;line-height:1.35;display:flex;flex-direction:column;align-items:center;gap:3px}
.tier-buttons button span{display:block;font-weight:800;font-size:14px}
.tier-buttons button small{font-weight:500;color:var(--muted);font-size:11px}
.tier-buttons button[aria-pressed=true] span,.tier-buttons button[aria-pressed=true] small{color:#fff}
.custom-wrap{margin-top:12px;max-width:260px}
.helper{font-size:13px;color:var(--muted);margin:8px 0 0}
#raNow{font-size:22px;font-weight:700;padding:11px}
#ra-slider{accent-color:var(--teal);margin-top:10px;padding:0;background:transparent}
.quick-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}
.quick-buttons button{font-size:13px;padding:9px 6px;display:flex;flex-direction:column;gap:2px}
.quick-buttons button span{font-weight:800}

/* headline strip */
.ra-headline{display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--ink);color:#fff;border-radius:10px;padding:18px 22px;margin-bottom:14px;flex-wrap:wrap}
.ra-headline .eyebrow{color:#c9dced;margin-bottom:4px}
.ra-headline .amount{font-family:Georgia,"Times New Roman",serif;font-size:clamp(28px,4vw,38px);margin:0}
.ra-headline .note{font-size:13px;color:#cfe0ec;max-width:340px;margin:0}

.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:18px}
.plan-card{--bar:var(--ink);background:#fff;border:1px solid var(--line);box-shadow:inset 0 4px 0 var(--bar);border-radius:8px;padding:16px 14px;min-width:0}
.plan-card.basic{--bar:var(--teal)}
.plan-card.escalating{--bar:var(--amber)}
.plan-card h3{font-size:15px;margin-bottom:4px}
.plan-card .amount{font-size:clamp(22px,3vw,30px);font-weight:750;letter-spacing:-.5px;font-variant-numeric:tabular-nums;margin:6px 0 2px}
.plan-card .unit{font-size:12px;color:var(--muted);display:block;margin-bottom:8px}
.plan-card .note{font-size:12px;color:var(--muted);margin:0}

/* table cards */
.table-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:16px}
.table-head-row{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.toggle{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;min-height:auto;margin:0}
.toggle input{width:18px;min-height:18px;height:18px;accent-color:var(--teal)}
.table-scroll{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:8px;margin-top:10px}
table{border-collapse:collapse;width:100%;font-size:12.5px;min-width:520px}
th,td{text-align:right;padding:8px 9px;border-bottom:1px solid var(--line);white-space:nowrap;font-variant-numeric:tabular-nums}
th{font-weight:700;color:var(--ink);background:var(--ground)}
th small{display:block;font-weight:500;color:var(--muted);font-size:10.5px}
thead th{position:sticky;top:0;background:var(--ground)}
th:first-child,td:first-child{text-align:left;position:sticky;left:0;background:#fff;z-index:1;box-shadow:1px 0 0 var(--line)}
thead th:first-child{background:var(--ground);z-index:2}
tr.selected td,tr.selected th{background:var(--light-teal)}
tr.selected td:first-child,tr.selected th:first-child{background:var(--light-teal)}
.group-standard{color:var(--ink)}
.group-escalating{color:var(--amber)}
.group-basic{color:var(--teal)}
.year-table td.dim{color:var(--muted)}

/* how it works */
.how-it-works{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px 20px;margin-bottom:16px}
.how-it-works ul{padding-left:20px;font-size:13.5px;color:var(--muted)}
.how-it-works li{margin-bottom:8px}

.notice{border-radius:8px;padding:14px 16px;margin:0 0 14px;font-size:14px}
.notice.error{background:var(--error-bg);border:1px solid #dfb2b7;color:var(--error)}
.notice.warn{background:#fff7e6;border:1px solid #e8c98a;color:#5c4210}
.notice.warn p{margin:0}
.notice.warn p+p{margin-top:8px}

footer{font-size:12px;color:var(--muted);padding:14px 0 4px;border-top:1px solid var(--line);margin-top:6px}
footer p{margin-bottom:6px}

@media(max-width:700px){
  .app-shell{padding:16px 12px 32px}
  .field-row{grid-template-columns:1fr}
  .tier-buttons{grid-template-columns:repeat(2,1fr)}
  .quick-buttons{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .ra-headline{flex-direction:column;align-items:flex-start}
  .input-card,.table-card,.how-it-works{padding:14px}
}

@media print{
  @page{size:A4;margin:12mm}
  body{background:#fff;font-size:11px}
  .app-shell{max-width:none;padding:0}
  .skip-link,.input-card,.toggle{display:none!important}
  .table-scroll{overflow:visible;border:none}
  table{min-width:0}
  th:first-child,td:first-child,thead th{position:static;box-shadow:none}
  .cards,.ra-headline{break-inside:avoid}
  .table-card,.how-it-works{break-inside:avoid;border:1px solid #152e46;padding:10px}
}