:root{color-scheme:light;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;background:#f5faf8;color:#15382f}*{box-sizing:border-box}body{margin:0;min-height:100vh}main{max-width:980px;margin:auto;padding:30px 24px 70px}a{color:#08775a;text-underline-offset:4px}a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:3px solid #08775a;outline-offset:4px}.brand{font-size:15px;font-weight:750;text-decoration:none;color:#15382f}.brand span{color:#08775a}h1{font-size:clamp(2.2rem,6vw,3.5rem);line-height:1.1;letter-spacing:-.045em;margin:30px 0 18px}h2{font-size:1.45rem;letter-spacing:-.025em}p{line-height:1.75;color:#51675f}small,.muted{color:#51675f;line-height:1.6}.panel{background:#fff;border:1px solid #d5e5dd;border-radius:22px;padding:26px;margin:28px 0}.fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.field{display:flex;flex-direction:column;gap:9px}.wide{grid-column:1/-1}label{font-size:.85rem;font-weight:650}input,select,textarea{width:100%;padding:12px 14px;border-radius:9px;border:1px solid #91afa0;background:#fff;color:#15382f;font:inherit}textarea{resize:vertical}button{background:#08775a;border:1px solid #08775a;color:#fff;border-radius:10px;font-weight:650;padding:12px 18px;cursor:pointer;font:inherit;min-height:46px}button.secondary{background:#fff;border-color:#91afa0;color:#15382f}.controls{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}output,.results{display:block;background:#e7f4ed;border-radius:12px;padding:22px;line-height:1.8}output:empty{display:none}strong.value{color:#08775a;font-size:1.15rem}.note{font-size:.85rem;border-left:3px solid #08775a;padding:8px 14px}table{border-collapse:collapse;width:100%;font-size:.75rem}th,td{text-align:left;border-bottom:1px solid #d5e5dd;padding:12px 8px;vertical-align:top;min-width:100px;overflow-wrap:anywhere}th{color:#15382f;background:#e7f4ed}.scroll{overflow-x:auto;margin-top:24px}.footer{border-top:1px solid #d5e5dd;margin-top:38px;padding-top:22px;font-size:.8rem;line-height:1.7}[hidden]{display:none!important}noscript p{background:#fff1cf;padding:15px;border-radius:10px}@media(max-width:640px){.fields{grid-template-columns:1fr}.panel{padding:18px}main{padding:22px 16px 55px}}
/* Matching liquid-glass utility workspace, with native form controls. */
body{background:radial-gradient(ellipse at 95% 0,#bcebdc,transparent 48%),radial-gradient(ellipse at 0 35%,#e8edc9,transparent 45%),#f0f6f2;color:#102f28}main{max-width:1400px;padding:40px clamp(20px,5vw,70px) 80px}.brand{display:inline-block;padding:13px 20px;border:1px solid #fff;border-radius:99px;background:linear-gradient(135deg,#fff,#e2f1e8);box-shadow:0 12px 24px -22px #174d3b}.panel{border-color:#fff;border-radius:28px;background:linear-gradient(145deg,#fffffff2,#ffffffa6);box-shadow:0 22px 50px -35px #174d3b99,inset 0 1px #fff;padding:32px}h1{font-size:clamp(2.4rem,5vw,4.6rem);font-weight:600;max-width:1000px}input,select,textarea{border-color:#afc9ba;border-radius:13px;padding:14px 15px;min-height:48px;box-shadow:inset 0 2px 5px #153d2909}button{position:relative;overflow:hidden;border-radius:99px;padding:15px 23px;background:linear-gradient(135deg,#205d49,#063d30);box-shadow:0 12px 23px -18px #153d29,inset 0 1px #ffffff50}button.secondary{background:linear-gradient(130deg,#fff,#e4f1e7)}button::after{content:'';position:absolute;inset:-100% -60%;background:linear-gradient(115deg,transparent 43%,#ffffff60 50%,transparent 57%);transform:translateX(-75%);pointer-events:none}button:hover::after{transform:translateX(75%);transition:transform .75s}output,.results{background:linear-gradient(125deg,#d9ecdf,#eef4df);border:1px solid #c3d9c8;border-radius:19px;padding:25px}.scroll{border:1px solid #cbded3;border-radius:13px}th,td{padding:14px 12px}@media(hover:hover) and (pointer:fine){button{transition:transform .2s,box-shadow .2s}button:hover{transform:translateY(-3px);box-shadow:0 16px 25px -18px #153d29}}@media(max-width:640px){main{padding:24px 18px 60px}.panel{padding:23px 19px;border-radius:23px}.controls{gap:10px}.controls button{flex:1}output{padding:20px}}@media(prefers-reduced-motion:reduce){*,*::after{transition:none!important;animation:none!important}button:hover{transform:none}}