@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');
:root{--bg:#f6f7f2;--ink:#193e31;--green:#297d65;--muted:#7b887a;--line:#dce4d9}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',system-ui,sans-serif}.shell{max-width:1300px;margin:auto;padding:0 36px}header{height:96px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{font:800 39px/1 Manrope,system-ui,sans-serif;letter-spacing:-2.5px;text-decoration:none;color:var(--ink)}.brand span{color:#63a779}.back{font-size:12px;color:#7d8c76;text-decoration:none}.intro{padding:40px 0 29px}.eyebrow{font-size:9px;letter-spacing:1.8px;color:#7e9471;font-weight:700}h1{font:800 clamp(30px,4vw,47px)/1.2 Manrope,system-ui,sans-serif;letter-spacing:-1.8px;margin:14px 0}h1 span{color:var(--green)}.intro p{font-size:14px;line-height:1.8;color:var(--muted)}.workspace{display:grid;grid-template-columns:215px minmax(300px,1fr) 310px;gap:20px;align-items:start}.categories{display:grid;gap:6px;padding-top:8px}.navlabel{font-size:8px;letter-spacing:1.2px;color:#94a087;margin-bottom:14px;font-weight:600}.categories button{display:flex;align-items:center;text-align:left;gap:13px;padding:13px 12px;background:none;border:1px solid transparent;border-radius:8px;color:#758571;font-size:12px;font-weight:500}.categories button:hover{background:#edf2e6}.categories button[aria-pressed=true]{background:#e4eddb;color:var(--ink);border-color:#d5e1ca;font-weight:700}.icon{width:22px;font-size:20px;line-height:1.1;text-align:center;color:#5e8859}.local-note{font-size:9px;color:#93a087;margin:20px 12px}.calculator{background:#fff;border:1px solid var(--line);border-radius:15px;padding:26px}.panel-head,.result-head,.history-head{display:flex;align-items:center;justify-content:space-between;gap:10px}h2{font:700 19px Manrope,system-ui;letter-spacing:-.5px;margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}.textbtn{font-size:10px;color:#7d9270;background:none;border:0;padding:5px;white-space:nowrap}.textbtn:hover{color:var(--green)}.textbtn:disabled{opacity:.4;cursor:default}.hint{font-size:11px;line-height:1.7;color:#8a9680;margin:12px 0 21px}label{display:block;font-size:11px;font-weight:600;margin:18px 0 8px}input,select,textarea{width:100%;border:1px solid #dbe3d7;border-radius:8px;background:#fcfdf9;color:var(--ink);padding:13px;font-size:15px;outline:none;min-width:0}input:focus,select:focus,textarea:focus{border-color:#7ca66c;box-shadow:0 0 0 3px #7ca66c18}input::placeholder,textarea::placeholder{color:#b2bbae}textarea{min-height:135px;resize:vertical;line-height:1.6}.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}.primary{width:100%;display:flex;align-items:center;justify-content:space-between;background:var(--green);color:white;border:0;padding:14px 17px;border-radius:8px;font-size:12px;font-weight:600;margin-top:22px}.primary:hover{background:#20624f}.subhint{font-size:9px;color:#96a18e;line-height:1.6;margin-top:8px}#error{color:#b04031;font-size:11px;line-height:1.6;margin-top:12px}#expression{font-size:25px;text-align:right;font-variant-numeric:tabular-nums;padding:18px 12px}.keypad{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:13px}.keypad button{border:1px solid #e3e8de;border-radius:7px;background:#f6f8f1;color:#365b40;min-height:44px;font-size:17px}.keypad button:hover{background:#e6efdc}.keypad button.operator{color:var(--green);background:#e9f1e0}.result-panel{background:#ecf2e4;border:1px solid #d8e5cb;border-radius:15px;padding:24px}.result-head{font-size:9px;letter-spacing:1.3px;color:#8b9b7c;font-weight:600}.result-placeholder{font:700 33px/1.25 Manrope,system-ui;letter-spacing:-1.2px;color:#9eb28b;margin-top:32px}.result-placeholder span{color:#699b50}.result-value{font:800 clamp(27px,3vw,40px)/1.25 Manrope,system-ui;letter-spacing:-1.4px;color:var(--green);margin:26px 0 8px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.result-caption{font-size:11px;color:#779168;line-height:1.6}.detail-list{margin:22px 0 0;padding:0}.detail-list div{display:flex;justify-content:space-between;gap:15px;padding:9px 0;border-bottom:1px solid #d9e5cb;font-size:11px}.detail-list dt{color:#8b9b7c}.detail-list dd{margin:0;text-align:right;font-weight:600;overflow-wrap:anywhere;min-width:0}.history-head{border-top:1px solid #d5e2c9;margin-top:29px;padding-top:18px}.history-head h3{font-size:10px;font-weight:600;margin:0}#history .hint{font-size:10px;margin-bottom:18px}.history-item{font-size:10px;border-bottom:1px solid #dce6d4;padding:10px 0;color:#899b79;line-height:1.5}.history-item strong{display:block;color:#507447;margin-top:3px;overflow-wrap:anywhere}.result-panel small{display:block;font-size:9px;color:#97a78b;line-height:1.6;margin-top:22px}#copyStatus{font-size:10px;color:var(--green)}.bottom-note{display:flex;justify-content:space-between;font-size:10px;color:#94a087;margin:24px 0 36px}footer{border-top:1px solid var(--line);padding:26px 0;display:flex;align-items:center;gap:20px;font-size:10px;color:#95a089}.small{font-size:26px;letter-spacing:-1.5px}footer>a:last-child{margin-left:auto;color:#7a9170;text-decoration:none}a:focus-visible,button:focus-visible{outline:3px solid #96bd7b;outline-offset:3px}[hidden]{display:none!important}@media(max-width:1050px){.workspace{grid-template-columns:180px minmax(260px,1fr)}.result-panel{grid-column:2}.categories{grid-row:1/3}.result-panel{padding:24px}.shell{padding:0 25px}}@media(max-width:650px){.shell{padding:0 18px}header{height:80px}.brand{font-size:34px}.intro{padding-top:30px}h1{font-size:33px}.desktop{display:none}.workspace{display:flex;flex-direction:column;gap:16px}.categories{display:flex;overflow-x:auto;width:100%;padding:0 0 8px;gap:8px}.categories button{white-space:nowrap;padding:10px;font-size:11px}.categories .icon{font-size:15px;width:auto}.navlabel,.local-note{display:none}.calculator,.result-panel{width:100%;padding:22px}.bottom-note{gap:15px;font-size:9px}footer{gap:13px}footer>span{display:none}.result-value{font-size:36px}.result-placeholder{margin-top:20px}.two{gap:10px}}