body{min-height:100dvh;display:flex;flex-direction:column}.bar{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;padding:6px var(--gutter);border-bottom:1px solid var(--line);background:var(--surface)}.brand{display:flex;align-items:center;gap:10px;margin-right:auto;font-weight:800}.mark{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--accent);color:var(--on-accent);font:800 14px/1 var(--display)}.group{display:inline-flex;gap:2px;padding:3px;border:1px solid var(--line);border-radius:99px;background:var(--sunk)}.group button{min-height:34px;padding:0 12px;border:0;border-radius:99px;background:0 0;color:var(--ink-2);font:600 var(--t-xs) var(--sans)}.group [aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-card)}.stage{flex:1;display:grid;background:var(--bg)}.panel{padding:0;border:0;border-radius:0;background:0 0;box-shadow:none;min-width:0}.side{--sk:var(--on-accent);--sk:light-dark(var(--on-accent),var(--accent));display:flex;flex-direction:column;gap:24px;padding:24px 20px 52px;--sbg:var(--accent);--sbg:light-dark(var(--accent),color-mix(in oklab,var(--accent) 13%,var(--bg)));background:var(--sbg);color:var(--on-accent);color:light-dark(var(--on-accent),var(--ink))}.sb{display:flex;align-items:center;gap:12px;margin:0;font-weight:800;font-size:var(--t-lg)}.sb .mark{width:40px;height:40px;border-radius:12px;background:var(--sk);color:var(--sbg);font-size:19px}.head{display:grid;gap:16px}.side .kicker{background:0 0;color:var(--sk);box-shadow:inset 0 0 0 1.5px var(--sk);border-radius:99px;padding:6px 12px;margin:0;font:600 var(--t-xs) var(--sans);text-transform:uppercase;letter-spacing:.06em;width:fit-content}.head h1{font-size:clamp(2.25rem,1.15rem + 2.9vw,3.6rem);color:inherit;max-width:13ch}.side :is(h1,h2) em{color:inherit}.lead{margin:0;line-height:1.6;max-width:44ch}.pts{display:grid;gap:14px;margin:0;padding:24px 0 0;border-top:1px solid;list-style:none;font-weight:600}.pts:empty{display:none}.pts li{display:flex;align-items:center;gap:12px}.ck{position:relative;flex:none;width:24px;height:24px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--sk)}.ck::after{content:"";position:absolute;left:9px;top:5px;width:5px;height:10px;border:solid var(--sk);border-width:0 2px 2px 0;transform:rotate(45deg)}.card{display:grid;align-content:start;gap:24px;margin:-24px 12px 0;padding:28px 20px;border:1px solid var(--line);border-radius:20px;background:var(--surface);box-shadow:var(--shadow-card);position:relative}form{display:grid;gap:20px}.field{display:grid;gap:8px}.field input,.field textarea{min-height:48px;padding:12px 14px;border:1px solid var(--edge);border-radius:var(--r);background:var(--surface);color:var(--ink);font:400 var(--t-md)/1.4 var(--sans);width:100%;box-sizing:border-box}.field textarea{resize:vertical;min-height:88px}.field input:focus,.field textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px color-mix(in oklab,var(--accent) 22%,transparent)}.stepper{display:grid;grid-template-columns:48px 1fr 48px;gap:8px;align-items:center}.stepper input{text-align:center;font:800 var(--t-xl) var(--display);font-variant-numeric:tabular-nums;-moz-appearance:textfield}.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.step{min-height:48px;border:1px solid var(--edge);border-radius:var(--r);background:var(--surface);color:var(--ink);font:800 var(--t-lg) var(--display);cursor:pointer}.step:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.step:disabled{opacity:.4;cursor:not-allowed}.hint{margin:0;font-size:var(--t-sm);color:var(--ink-2)}.error{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--t-sm);color:var(--bad)}.error::before{content:"!";display:grid;place-items:center;flex:none;width:18px;height:18px;border-radius:50%;background:var(--bad);color:var(--surface);font-size:11px;font-weight:800}.submit{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:52px;border-radius:12px;font-size:var(--t-md)}.spin{width:18px;height:18px;border:2px solid;border-top-color:transparent;border-radius:50%;animation:sp .7s linear infinite}@keyframes sp{to{transform:rotate(1turn)}}.saved{display:grid;gap:6px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--sunk)}.saved p{margin:0}.saved-l{font:600 var(--t-xs) var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}.saved-who{font-weight:700}.saved .btn{margin-top:6px}.done{display:grid;gap:12px;justify-items:center;text-align:center;padding:8px 0}.tick{position:relative;width:72px;height:72px;margin:0 0 8px;border-radius:50%;background:var(--accent)}.tick::after{content:"";position:absolute;left:27px;top:18px;width:14px;height:26px;border:solid var(--on-accent);border-width:0 4px 4px 0;transform:rotate(45deg)}.done p{margin:0;color:var(--ink-2)}.recap{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;width:100%;margin:8px 0 0;padding:16px;border-radius:var(--r-card);background:var(--sunk);text-align:left}.recap dt{font:600 var(--t-sm) var(--sans);color:var(--ink-2)}.recap dd{margin:0;font-weight:600;overflow-wrap:anywhere}.row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;width:100%}.row .btn{flex:1 1 180px}.summary{display:grid;gap:4px;padding:16px;border:1px solid var(--line);border-radius:var(--r-card);background:var(--sunk)}.summary p{margin:0}.sum-k{font:600 var(--t-xs) var(--sans);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-2)}.sum-big{font:800 var(--t-2xl) var(--display);letter-spacing:-.03em}.sum-big .num{font-size:40px}.sum-line{font-size:var(--t-sm);color:var(--ink-2);overflow-wrap:anywhere}.foot{padding:20px var(--gutter);font-size:var(--t-xs);color:var(--ink-2);text-align:center;border-top:1px solid var(--line)}@media (min-width:900px){.panel{display:grid;grid-template-columns:5fr 6fr}.side{justify-content:space-between;gap:32px;padding:56px clamp(40px,5vw,88px)}.card{width:min(100% - 64px,520px);margin:56px auto;align-self:center;padding:40px}}@media (prefers-reduced-motion:reduce){.spin{animation:none}}@media (max-width:600px){.bar{padding:4px 12px;gap:0 8px}}

/* tap-targets: comfortable phone taps -- the sizes win on phones, the page's own layout stays */
@media (max-width: 600px) {
  a[href]:not(p a, li p a, blockquote a, figcaption a, td a, dd a, label a), button, [role=button], [onclick], summary, select, input:not([type=hidden], [type=checkbox], [type=radio], [type=range]) { min-height: 44px !important; min-width: 44px !important; }
  :where(a[href]:not(p a, li p a, blockquote a, figcaption a, td a, dd a, label a)) { display: inline-flex; align-items: center; justify-content: center; }
  input, select, textarea { font-size: max(16px, 1em) !important; }
}