:root{--ink:#183a39;--muted:#63736c;--paper:#faf9f4;--orange:#d55b32;--line:#dedfd5}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 Arial,sans-serif}a{color:inherit;text-decoration:none}header,main,footer{max-width:1240px;margin:auto;padding:0 40px}header{display:flex;align-items:center;justify-content:space-between;height:112px;border-bottom:1px solid var(--line)}.brand{display:flex;gap:13px;align-items:center;font-size:29px;font-weight:800;letter-spacing:-2px}.brand>span{border-left:1px solid #b3bcb1;padding-left:13px;font-size:14px;letter-spacing:1px}.brand small{display:block;font-size:9px;letter-spacing:2px;font-weight:400}.brand sup{font-size:8px}nav{display:flex;gap:30px;font-size:13px}.hero{padding:65px 0 45px;display:grid;grid-template-columns:1.05fr 1fr;gap:45px;align-items:center}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;color:var(--muted)}h1{font-family:Georgia,serif;font-size:53px;line-height:1.12;letter-spacing:-1.7px;font-weight:400;margin:20px 0}h1 em{color:var(--orange);font-weight:400}.hero p{max-width:470px;color:var(--muted);font-size:16px}.button{display:inline-flex;gap:50px;background:var(--ink);color:white;padding:13px 22px;border-radius:5px;margin-top:15px;font-size:13px}.hero-art{background:#e9eddf;border-radius:12px;padding:28px 32px;transform:rotate(-2deg);border:1px solid #dce0cf;box-shadow:10px 14px 0 #ecece3;overflow:hidden}.art-label{font-size:9px;letter-spacing:1.6px}.big{font-family:Georgia,serif;font-size:82px;padding:32px 0 22px;white-space:nowrap}.big small{font-size:24px}.big span{font-size:35px;color:var(--orange);margin:0 16px}.ruler{height:35px;background:repeating-linear-gradient(90deg,var(--ink) 0 1px,transparent 1px 20px);border-top:2px solid var(--ink);opacity:.6}.art-bottom{padding-top:20px;font-size:11px;display:flex;justify-content:space-between;gap:15px}.trust{display:flex;justify-content:space-between;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;color:var(--muted);font-size:11px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:52px 0 24px}h2{font:normal 32px/1.2 Georgia,serif;margin:10px 0}.tool-count{font-size:11px;border:1px solid var(--line);border-radius:30px;padding:6px 13px}.workspace{display:grid;grid-template-columns:230px 1fr;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}aside{background:#f2f3eb;padding:23px 16px}aside h3{font-size:9px;letter-spacing:1.8px;margin:10px 12px 14px;color:var(--muted)}aside a{display:flex;justify-content:space-between;font-size:13px;padding:8px 12px;border-radius:5px;margin-bottom:2px}aside a:hover{background:#e5e9dc}aside a.active{background:var(--ink);color:white}.calculator{padding:35px 40px}.calc-heading h2{font-size:30px}.calc-heading p{font-size:13px;color:var(--muted);margin-top:8px}#form{margin-top:25px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.units-row{display:grid;grid-template-columns:1fr 38px 1fr;align-items:end;gap:12px;margin-top:15px}label{display:block;font-size:11px;font-weight:700;letter-spacing:.4px}input,select{display:block;width:100%;margin-top:8px;border:1px solid #d8dcd2;border-radius:5px;background:white;padding:13px;color:var(--ink);font:15px Arial;min-height:46px}input:focus,select:focus{outline:2px solid #72917c;outline-offset:2px}button{cursor:pointer;font-family:inherit;color:var(--ink)}#swap{height:46px;border:1px solid var(--line);background:var(--paper);border-radius:5px;font-size:18px}.result{background:#edf2e8;border:1px solid #dce6d5;padding:22px 25px;border-radius:6px;margin-top:24px}.result small{font-size:9px;letter-spacing:1.8px}#answer{font-size:34px;font-weight:500;line-height:1.3;margin:8px 0;overflow-wrap:anywhere}#answer-detail{font-size:12px;color:var(--muted)}#error{color:#a63324;font-size:13px}details{border-bottom:1px solid var(--line);margin-top:22px}summary{font-size:13px;font-weight:700;cursor:pointer;list-style:none;padding:8px 0}summary span{float:right}ol{padding-left:23px;margin:14px 0 20px}li{font-size:13px;color:#52665b;margin:8px 0;padding-left:6px}.tip{background:#fff8ed;border-left:3px solid #d5a66b;padding:12px 15px;margin-top:22px;font-size:12px}.tip p{margin:4px 0}.actions{display:flex;gap:20px;margin-top:22px}.actions button{background:none;border:0;padding:5px 0;font-size:12px;text-decoration:underline;text-underline-offset:4px}.learning{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;padding:65px 0}.learning p{color:var(--muted);font-size:14px}.learning h3{font-size:16px}.learning-note{background:var(--ink);color:white;border-radius:8px;padding:30px}.learning-note>span{font-size:9px;letter-spacing:2px;color:#c3d2c1}.learning-note h3{font:normal 25px/1.5 Georgia,serif}.learning-note a{font-size:12px;border-bottom:1px solid #8ca69b;padding-bottom:7px}.about{border-top:1px solid var(--line);padding:40px 0}.about h2{font-size:25px}.about p{max-width:850px;color:var(--muted);font-size:14px}.about .fine{font-size:11px}footer{padding-top:25px;padding-bottom:35px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}footer div{display:flex;gap:25px}@media(max-width:800px){header,main,footer{padding-left:20px;padding-right:20px}header{height:85px}nav a:first-child{display:none}nav{font-size:11px}.brand{font-size:24px}.brand>span{font-size:11px}.hero{grid-template-columns:1fr;padding:35px 0;gap:25px}h1{font-size:43px}.hero-art{max-width:480px;width:95%;margin:auto}.big{font-size:70px}.trust{flex-wrap:wrap;gap:12px}.trust span{width:45%}.workspace{grid-template-columns:1fr}aside{padding:12px}aside h3{display:none}#category-nav{display:flex;overflow:auto;gap:5px;padding-bottom:8px}aside a{white-space:nowrap;font-size:12px}aside>a{display:inline-flex;margin-top:7px;border:1px solid var(--line)}.calculator{padding:25px 20px}.section-heading h2{font-size:27px}.tool-count{display:none}.learning{grid-template-columns:1fr;gap:25px;padding:40px 0}footer{flex-direction:column;gap:15px}.art-bottom{font-size:10px}.units-row{gap:8px}#answer{font-size:28px}}@media print{header,nav,aside,.hero,.trust,.section-heading,.actions,.learning,footer,.about{display:none!important}main{padding:0}.workspace{display:block;border:0}.calculator{padding:0}details{display:block}details>ol{display:block!important}body{background:white}.result{print-color-adjust:exact}}
/* Refined editorial palette and compact responsive layout */
:root{--ink:#182b46;--muted:#5e6d80;--paper:#f7f8fb;--orange:#b64d29;--line:#dde3ec}
header{height:96px}header nav a:hover,footer a:hover{color:var(--orange)}.hero{padding:45px 0 32px;gap:42px}h1{font-size:clamp(36px,4.3vw,53px)}.button{background:#223b61;border:1px solid #223b61;box-shadow:0 4px 10px #182b4612;gap:32px;margin-top:9px}.button:hover{background:#142a4b}.hero-art{position:relative;background:linear-gradient(145deg,#fff 25%,#edf2fa);border:1px solid #d6dfec;border-top:4px solid #ba643d;border-radius:12px;transform:none;box-shadow:0 10px 24px #182b4609;padding:27px 28px}.hero-art:before{content:'';position:absolute;right:0;top:0;width:100px;height:100px;background:linear-gradient(135deg,transparent 48%,#e7edf7 49%);opacity:.55;pointer-events:none}.art-label{position:relative;color:#64738a}.big{position:relative;display:flex;align-items:baseline;justify-content:center;gap:12px;font-size:clamp(50px,6.2vw,78px);padding:25px 0 18px;letter-spacing:-2px}.big small{font-size:25px;letter-spacing:0}.big span{font-family:Arial,sans-serif;font-size:30px;margin:0 8px;color:#b45b35}.ruler{height:26px;border-color:#7c8da5;background:repeating-linear-gradient(90deg,#7c8da5 0 1px,transparent 1px 20px);opacity:.7}.art-bottom{border-top:1px solid #e0e6ef;margin-top:18px;padding-top:14px;font-size:11px;color:#61718a}.art-bottom b{color:var(--ink)}.trust{padding:16px 0;color:#52647b}.section-heading{margin:32px 0 20px}.workspace{box-shadow:0 5px 22px #182b4605;align-items:stretch}aside{background:#f0f3f9;padding:18px 14px}aside a{font-size:12px;padding:7px 11px;border:1px solid transparent}aside a:hover{background:#e4eaf5}aside a.active{background:#223b61;border-color:#223b61}.calculator{padding:28px 32px}.calc-heading h2{margin:7px 0}.calc-heading p{margin-bottom:14px}#form{margin-top:18px}.result{background:linear-gradient(110deg,#f0f4fb,#f8faff);border:1px solid #d9e2f1;border-left:4px solid #4f6d9c;padding:18px 21px;margin-top:20px}.result small{color:#526887}#answer{font-size:32px;color:#1c365b}.tip{background:#fbf7f1;border-left-color:#bb7a4e;margin-top:17px}.actions{margin-top:15px;gap:18px}details{margin-top:17px}.learning{padding:34px 0 26px;gap:45px;align-items:stretch}.learning h2{font-size:29px}.learning h3{margin-bottom:8px}.learning p{margin:8px 0}.learning-note{background:linear-gradient(135deg,#edf1f8,#fff);border:1px solid #d8e1ef;border-top:3px solid #bb7048;border-radius:8px;padding:23px 27px;color:var(--ink)}.learning-note>span{color:#5c718f}.learning-note h3{font-size:24px;line-height:1.45;margin:14px 0 17px}.learning-note a{color:#28476f;border-color:#b2c0d4}.about{padding:24px 0 20px}.about h2{font-size:25px;margin:0 0 12px}.about p{margin:9px 0;font-size:13px}.creator{margin:17px 0 14px;padding-left:12px;border-left:2px solid #bd7853}.creator>span{display:block;font-size:9px;letter-spacing:1.6px;color:var(--muted)}.creator strong{display:block;white-space:nowrap;font:normal 22px/1.5 Georgia,serif;color:#182b46}.about .fine{font-size:11px;line-height:1.65}footer{padding-top:17px;padding-bottom:20px;align-items:center;gap:12px}footer .footer-author{display:block;font-size:12px;font-weight:600;color:#314b70;margin-top:3px}footer div{gap:18px}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #b45b35;outline-offset:4px}.workspace>*{min-width:0}
@media(max-width:800px){header{height:78px;padding-top:8px;padding-bottom:8px;gap:14px}.brand{font-size:23px;gap:9px}.brand>span{font-size:10px;padding-left:9px;letter-spacing:.6px}.brand small{font-size:8px;letter-spacing:1.2px}nav{font-size:10px;gap:10px}nav a{max-width:105px;line-height:1.5}.hero{padding:28px 0 22px;gap:22px}h1{font-size:39px;letter-spacing:-1.1px;margin:14px 0}.hero p{font-size:14px;line-height:1.6;margin:12px 0}.hero-art{width:100%;max-width:none;padding:20px 22px;box-shadow:0 5px 16px #182b4606}.art-label{font-size:8px;letter-spacing:1.2px}.big{font-size:68px;gap:10px;padding:19px 0 15px}.big small{font-size:22px}.big span{margin:0 2px;font-size:27px}.art-bottom{font-size:10px;gap:8px;margin-top:13px;padding-top:11px}.trust{gap:10px;padding:14px 0;font-size:10px}.trust span{width:calc(50% - 5px)}.section-heading{margin:25px 0 16px}.section-heading .eyebrow{font-size:8px;letter-spacing:1.1px}.section-heading h2{font-size:26px;margin:8px 0}.workspace{border-radius:8px}aside{padding:12px;border-bottom:1px solid var(--line)}aside h3{display:block;font-size:8px;margin:1px 3px 8px;letter-spacing:1.2px}#category-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;overflow:visible;padding:0 0 10px}aside a{font-size:11px;padding:8px 7px;margin:0;border:1px solid #dce3ee;border-radius:4px;white-space:normal;background:#fff;line-height:1.25;align-items:center;gap:2px}aside a>span{display:none}aside>a{display:inline-flex;justify-content:center;width:calc(50% - 3px);margin:0;padding:9px 6px;font-size:11px}aside>a:last-child{margin-left:6px}.calculator{padding:22px 17px}.calc-heading h2{font-size:27px}.calc-heading p{font-size:12px}input,select{font-size:14px;padding:11px 9px}.units-row{gap:7px;grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr)}#swap{height:44px}.result{padding:16px;margin-top:17px}#answer{font-size:27px}.learning{padding:23px 0 21px;gap:20px}.learning .eyebrow{font-size:8px;letter-spacing:1px}.learning h2{font-size:26px}.learning-note{padding:20px 22px}.learning-note h3{font-size:23px;line-height:1.45;margin:12px 0 16px}.about{padding:22px 0 18px}.about h2{font-size:25px;line-height:1.3}.about p{font-size:13px;line-height:1.65}.creator{margin:14px 0}.creator strong{font-size:22px}footer{flex-direction:column;align-items:flex-start;gap:12px;padding-top:15px;padding-bottom:18px}footer div{gap:18px;flex-wrap:wrap}}
@media(max-width:360px){header,main,footer{padding-left:15px;padding-right:15px}.big{font-size:57px;gap:8px}.big small{font-size:20px}#category-nav{grid-template-columns:repeat(2,minmax(0,1fr))}h1{font-size:35px}}
@media print{.creator{display:none}.workspace{box-shadow:none}.calculator{padding:0}.result{background:#f0f4fb}}
.visual-learning{margin:22px 0 8px;border:1px solid #dbe3ef;border-radius:8px;background:#fcfdff;padding:19px 20px 15px}.visual-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:15px}.visual-heading h3{font:normal 21px/1.35 Georgia,serif;margin:5px 0 4px}.visual-heading .eyebrow{font-size:8px;letter-spacing:1.5px}.visual-label{font-size:7px;letter-spacing:1px;border:1px solid #dfe5ee;border-radius:3px;padding:4px 6px;white-space:nowrap;color:#64758c}.visual-learning svg{width:100%;height:auto;display:block;max-height:270px;margin:12px auto 5px;overflow:visible}.visual-learning svg text{font:12px Arial,sans-serif;fill:#314965;stroke:none}.visual-learning svg line{stroke:#7487a1;stroke-width:2}.visual-learning svg rect,.visual-learning svg circle,.visual-learning svg path{stroke:#7186a2;stroke-width:2;fill:none}.visual-learning svg .v-center{text-anchor:middle}.visual-learning svg .v-bold{font-weight:700}.visual-learning svg .v-large{font-size:30px}.visual-learning svg .v-light{fill:#edf2fa;stroke:#8ba0bc}.visual-learning svg .v-mid{fill:#c8d6eb;stroke:#6b85a9}.visual-learning svg .v-solid{fill:#304d75;stroke:#304d75}.visual-learning svg .v-accent{stroke:#b45b35;stroke-width:3}.visual-learning svg .v-tick{stroke:#7890af;stroke-width:1}.visual-learning svg .v-grid{stroke:#9badc6;stroke-width:1}.visual-learning svg .v-dashed{stroke:#a3b0c3;stroke-dasharray:7 5}.visual-learning svg .v-copper{fill:#bc7653;stroke:#bc7653}.visual-learning svg .v-charge{fill:#f5e9df;stroke:#b45b35}.visual-learning svg .v-cylinder{fill:#f0f3f8;stroke:#587497;stroke-width:4}.visual-learning svg .v-fluid{fill:#d8e5f6;stroke:none}.visual-learning svg .v-piston-head{fill:#b97a58;stroke:#965b3a}.visual-learning svg .v-rod{fill:#b6c4d6;stroke:#68809e}.visual-learning svg .v-wire{stroke:#4d688d;stroke-width:3;fill:none}.visual-learning svg .v-dimension{stroke:#b45b35}.visual-caption{font-size:12px;line-height:1.65;color:#5e6d80;margin:8px 0}.visual-current{font-size:12px;line-height:1.6;border-top:1px solid #e2e8f1;padding-top:10px;margin:12px 0 7px;overflow-wrap:anywhere}.visual-scale{display:block;color:#6b7890;font-size:9px;margin-top:9px}.motion-button{border:1px solid #aebfd6;border-radius:4px;padding:8px 12px;background:#f1f5fc;font-size:11px;margin:4px 0}.is-playing .v-piston-moving{animation:piston-stroke 3s ease-in-out infinite alternate}.is-playing .v-fluid{animation:fluid-stroke 3s ease-in-out infinite alternate;transform-origin:77px 122px}@keyframes piston-stroke{from{transform:translateX(-35px)}to{transform:translateX(45px)}}@keyframes fluid-stroke{from{transform:scaleX(.757)}to{transform:scaleX(1.3125)}}@media(prefers-reduced-motion:reduce){.is-playing .v-piston-moving,.is-playing .v-fluid{animation:none}}@media(max-width:800px){.visual-learning{padding:14px 12px 12px;margin-top:18px}.visual-heading{gap:7px}.visual-heading h3{font-size:19px}.visual-label{display:none}.visual-learning svg{margin:9px auto 2px}.visual-caption,.visual-current{font-size:11px}.visual-scale{font-size:8px}}@media print{.visual-learning{break-inside:avoid;padding:12px}.visual-learning svg{max-height:200px}.motion-button{display:none}.v-piston-moving,.v-fluid{animation:none!important}}

.visual-learning svg marker path{fill:#b45b35;stroke:none}
.enlarge-visual{display:block;background:none;border:0;border-bottom:1px solid #9db0ca;padding:4px 0;font-size:11px;color:#36577e;margin-top:9px}.visual-modal{width:min(920px,calc(100% - 24px));max-height:90vh;border:1px solid #c9d5e6;border-radius:10px;padding:22px;color:#182b46;background:#fcfdff}.visual-modal::backdrop{background:#12253dcc}.visual-modal-head{display:flex;gap:15px;align-items:center;justify-content:space-between}.visual-modal h3{font:normal 23px/1.35 Georgia,serif;margin:0}.visual-modal-head button{border:1px solid #b9c9df;background:#f0f4fb;border-radius:4px;padding:8px 14px}.visual-modal p{font-size:12px;color:#5e6d80}.visual-zoom-canvas{overflow-x:auto;margin:15px 0;padding:10px}.visual-zoom-canvas svg{min-width:640px;max-height:none}.visual-zoom-canvas svg text{font-size:14px}@media print{.enlarge-visual{display:none}.visual-modal{display:none}}