:root{--bg: #f5efe2;--surface: #fdfaf3;--ink: #33261c;--muted: #7a6a58;--accent: #c4501b;--accent-ink: #fdfaf3;--line: #e2d5bd;--radius: 14px}*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.5}.app{max-width:30rem;margin:0 auto;padding:2rem 1.25rem 3rem}.app header{text-align:center;margin-bottom:1.5rem}.app h1{font-family:Fraunces,serif;font-size:1.9rem;font-weight:900;line-height:1.15;margin:0 0 .4rem}.subtitle{margin:0;color:var(--muted);font-size:.95rem}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.25rem;box-shadow:0 2px 10px #33261c0f}fieldset{border:0;padding:0;margin:0 0 1rem}legend{font-weight:700;font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);padding:0;margin-bottom:.6rem}.presets{display:flex;gap:.5rem;flex-wrap:wrap}.presets button{flex:1 1 auto;min-height:2.75rem;font:inherit;font-weight:600;color:var(--accent);background:transparent;border:1.5px solid var(--accent);border-radius:999px;padding:.4rem 1rem;cursor:pointer;transition:background .15s,color .15s}.presets button:hover,.presets button:focus-visible{background:var(--accent);color:var(--accent-ink)}.inputs{display:grid;gap:1rem}.field label{display:block;font-weight:600;margin-bottom:.3rem}.field .unit{color:var(--muted);font-weight:400}.field input{width:100%;min-height:3rem;font:inherit;font-size:1.15rem;font-weight:600;color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:.4rem .8rem}.field input:focus-visible{outline:3px solid var(--accent);outline-offset:1px;border-color:var(--accent)}.hint{font-size:.8rem;color:var(--muted);margin:.3rem 0 0}.results{margin-top:1rem;border-top:1px solid var(--line);padding-top:1rem}.results p{display:flex;justify-content:space-between;align-items:baseline;margin:0;padding:.45rem 0}.results .label{color:var(--muted)}.results .value{font-variant-numeric:tabular-nums;font-weight:700;font-size:1.25rem}.results .value small{font-size:.85rem;color:var(--muted);font-weight:400;margin-left:.2rem}.results .dash{color:var(--muted);font-weight:400}.footnote{font-size:.8rem;color:var(--muted);margin:1rem 0 0;border-top:1px dashed var(--line);padding-top:.8rem}footer{text-align:center;color:var(--muted);font-size:.8rem;margin-top:1.5rem}@media(prefers-reduced-motion:no-preference){.results .value{transition:opacity .15s}}
