/* Draft UI Language · Signature mode · Life counters */
:root {
  color-scheme: light dark;
  --draft-bg:#F2EFE7; --draft-surface:#FFFDF6; --draft-surface-raised:#FFFFFF; --draft-surface-soft:#ECE8DE;
  --draft-text:#171717; --draft-muted:#625D56; --draft-border:rgba(16,16,16,.20); --draft-border-strong:rgba(16,16,16,.34);
  --draft-primary:#6977FF; --draft-focus:#245DE8; --draft-progress:#4252C7; --draft-glass:rgba(255,253,246,.90); --draft-shadow:0 12px 28px rgba(23,23,23,.10);
}
[data-theme="dark"],[data-theme="midnight"] {
  --draft-bg:#101010; --draft-surface:#181818; --draft-surface-raised:#202020; --draft-surface-soft:#151515;
  --draft-text:#F6F3EB; --draft-muted:#D0CCC3; --draft-border:rgba(255,255,255,.20); --draft-border-strong:rgba(255,255,255,.34);
  --draft-focus:#5FE6FF; --draft-progress:#8C98FF; --draft-glass:rgba(24,24,24,.90); --draft-shadow:0 12px 28px rgba(0,0,0,.26);
}
[data-theme] { --bg:var(--draft-bg); --card:var(--draft-surface); --text:var(--draft-text); --muted:var(--draft-muted); --line:var(--draft-border); --accent:var(--draft-progress); --ring:color-mix(in srgb,var(--draft-focus) 25%,transparent); }
html { background:var(--draft-bg); }
body { background:var(--draft-bg)!important; color:var(--draft-text)!important; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; line-height:1.6; }
header { min-height:76px; background:var(--draft-glass)!important; border-bottom:1px solid var(--draft-border)!important; box-shadow:var(--draft-shadow); backdrop-filter:blur(16px); }
.wrap { max-width:1180px; padding-inline:24px; }
.row { gap:24px; }
.title { font-weight:900; letter-spacing:-.025em; line-height:1.1; }
.title::before { content:"LIFE / ESTIMATE"; display:block; margin-bottom:5px; color:var(--draft-muted); font:800 11px/1.25 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; letter-spacing:.09em; }
.title small { max-width:630px; margin-top:7px; color:var(--draft-muted); font-size:.875rem; line-height:1.45; }
.controls { gap:14px; }
.age { gap:10px; }
.age label,.meta { color:var(--draft-muted)!important; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.72rem; letter-spacing:.035em; }
.age input[type="number"],.select { min-height:44px; border:1px solid var(--draft-border)!important; border-radius:0!important; background:var(--draft-surface-soft)!important; color:var(--draft-text)!important; }
.age input[type="number"] { padding:10px!important; }
.age input[type="range"] { accent-color:var(--draft-primary); }
.age input[type="number"]:focus,.select:focus { outline:3px solid var(--draft-focus); outline-offset:3px; }
.select option { background:var(--draft-surface-raised); color:var(--draft-text); }
main.wrap { padding-block:32px 64px; }
.intro,.card { position:relative; border:1px solid var(--draft-border)!important; border-radius:0!important; background:var(--draft-surface)!important; box-shadow:none; }
.intro { padding:26px!important; }
.intro::before,.card::before { content:""; position:absolute; top:22px; left:-1px; width:3px; height:38px; background:var(--draft-primary); }
.intro p { max-width:900px; color:var(--draft-muted)!important; }
.intro p:last-child { margin-bottom:0; }
.intro strong { color:var(--draft-text); }
.grid { gap:16px; margin-top:24px; }
.card { min-height:196px; padding:20px!important; gap:12px!important; }
.card h3 { color:var(--draft-text); font-size:1.1rem; font-weight:800; letter-spacing:-.02em; }
.card .meta strong { color:var(--draft-text); font-family:Inter,ui-sans-serif,system-ui,sans-serif; letter-spacing:0; }
.progress { height:8px; border-radius:0!important; background:var(--draft-surface-soft)!important; }
.bar { background:var(--draft-progress)!important; transition:width 180ms cubic-bezier(.22,1,.36,1)!important; }
footer.party { border-top:1px solid var(--draft-border)!important; background:var(--draft-bg)!important; color:var(--draft-muted)!important; }
.party-left { color:var(--draft-text); font:800 .72rem/1.3 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; letter-spacing:.08em; }
.party-center a,.party-right { color:var(--draft-muted)!important; }
.party-center a:focus-visible { outline:3px solid var(--draft-focus); outline-offset:3px; }
@media (max-width:720px) { .wrap{padding-inline:16px} header{position:static} header .row{align-items:stretch;flex-direction:column}.controls{align-items:flex-start;flex-direction:column}.age{width:100%;flex-wrap:wrap}.age input[type="range"]{flex:1 1 180px;width:auto}.select{width:100%}main.wrap{padding-block:24px 48px}.intro{padding:22px 18px!important}.card{min-height:0;padding:18px!important} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{transition-duration:.001ms!important;animation-duration:.001ms!important} }