@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;600;700;800&display=swap');
:root{--ink:#143b3b;--muted:#526867;--cream:#faf8f1;--teal:#006b60;--lime:#daef91}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:25px}body{margin:0;background:var(--cream);color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:17px;line-height:1.6}header,main,footer{max-width:1180px;margin:auto}header{padding:28px 32px;display:flex;justify-content:space-between;align-items:center}.brand{display:flex;align-items:center;gap:12px;font-size:23px;font-weight:800;text-decoration:none;color:var(--ink);line-height:1.1}nav{display:flex;gap:30px}a{color:var(--teal);text-underline-offset:4px}nav a{text-decoration:none;color:var(--ink);font-size:15px;font-weight:600}main{padding:0 32px}section{padding:70px 0}.hero{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;padding:45px 0 80px}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:800;color:var(--teal)}h1,h2,h3{font-family:Manrope,Arial,sans-serif;letter-spacing:-1.5px;line-height:1.1}h1{font-size:64px;margin:22px 0}h2{font-size:38px;margin:12px 0 22px}h3{font-size:24px}p{color:var(--muted)}.intro{font-size:19px;max-width:490px}.button{display:inline-block;background:var(--teal);color:white;border:0;border-radius:7px;padding:16px 24px;font-size:16px;font-weight:700;text-decoration:none;cursor:pointer;margin-top:15px}.button:hover{background:#004f48}.small{font-size:13px;line-height:1.6}.art{height:425px;background:#d9e9e0;border-radius:140px 140px 12px 12px;position:relative;overflow:hidden}.sun{position:absolute;width:105px;height:105px;background:#ecd69a;border-radius:50%;top:40px;right:35px}.board{position:absolute;width:80px;height:330px;bottom:0;border-radius:50% 50% 33% 33%;box-shadow:9px 9px 0 #173e3820;transform:rotate(-12deg);background:#faf8ed}.b1{left:80px;border-left:18px solid #ed986e}.b2{left:180px;bottom:-20px;transform:rotate(6deg);background:#f4cf75;width:65px;height:295px;border-right:4px solid #f8e4b4}.b3{left:280px;transform:rotate(19deg);background:#2c7a70;width:70px;height:315px;border-left:5px solid #a7cabc}.wave{position:absolute;width:750px;height:260px;border-radius:50%;left:-80px;background:#83b8a6;bottom:-195px;transform:rotate(-12deg)}.w2{background:#276b61;bottom:-225px;transform:rotate(12deg)}.art span{position:absolute;left:25px;top:35px;font-size:10px;letter-spacing:2px;font-weight:700}.calc-section{border-top:1px solid #d5ded3}.section-heading{max-width:630px}.calculator{display:grid;grid-template-columns:1fr 1fr;margin-top:32px;border:1px solid #d2ddd3;border-radius:14px;overflow:hidden;background:white}form{padding:36px}.field{margin-bottom:22px}label{display:block;font-weight:700;font-size:15px;margin-bottom:8px}input,select{font:inherit;color:var(--ink);width:100%;border:1px solid #a9bdb5;background:#fff;border-radius:6px;padding:13px;min-height:52px}.weight-row{display:flex;gap:10px}.weight-row select{width:90px}.result{background:var(--ink);color:white;padding:40px}.result p{color:#d1e3dd}.result .eyebrow{color:var(--lime)}.result h3{color:var(--lime);font-size:62px;margin:24px 0}.result h4{margin-bottom:10px}.rule{height:1px;background:#ffffff30;margin:30px 0}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:35px}.cards article{border-top:2px solid #9bb3a7;padding-top:22px}.cards span{font-size:13px;color:var(--teal)}.cards h3{font-size:23px;letter-spacing:-.6px}.faq{border-top:1px solid #d5ded3;display:grid;grid-template-columns:1fr 1.4fr;column-gap:65px}.faq h2{grid-row:span 3}details{border-bottom:1px solid #cbd7ce;padding:18px 0}summary{font-weight:700;cursor:pointer;line-height:1.4}details p{font-size:16px}.method{background:#eaf0e5;padding:36px;border-radius:12px;margin:20px 0 70px}.method p{max-width:900px;font-size:15px}footer{padding:32px;border-top:1px solid #d5ded3;display:flex;justify-content:space-between;align-items:center;gap:20px}footer .brand{font-size:16px}footer p{font-size:14px}input:focus-visible,select:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #bf9023;outline-offset:4px}@media(max-width:760px){header{padding:22px}nav{gap:15px}nav a{font-size:12px}nav a:last-child{display:none}main{padding:0 22px}.hero{grid-template-columns:1fr;gap:30px;padding:30px 0 55px}h1{font-size:48px}h2{font-size:32px}.art{height:300px;border-radius:100px 100px 12px 12px}.board{height:250px}.b2{height:225px}.b3{height:235px}.calculator,.cards,.faq{grid-template-columns:1fr}.faq h2{grid-row:auto}form,.result{padding:26px}.result h3{font-size:50px}section{padding:45px 0}.method{padding:25px}footer{flex-direction:column;align-items:flex-start}}
/* Midnight coast: vaporwave palette with high-contrast reading surfaces. */
:root{color-scheme:dark;--ink:#f5f0ff;--muted:#c6bedb;--cream:#100d21;--teal:#71eee4;--lime:#ffaddf}
body{background:radial-gradient(ellipse at 85% 0%,#44205055,transparent 40%),radial-gradient(ellipse at 0% 55%,#173c4a35,transparent 35%),#100d21}
header{border-bottom:1px solid #a48dca25}.brand{color:#f5f0ff}.brand:first-letter{color:#71eee4}nav a:hover{color:#ffaddf}
h1{background:linear-gradient(130deg,#fff3ff 10%,#ffb0e1 65%,#78f4ed);background-clip:text;-webkit-background-clip:text;color:transparent}
.eyebrow{color:#71eee4}.button{background:linear-gradient(110deg,#ef80c5,#b5a0ff);color:#190e29;box-shadow:0 5px 25px #db54cf25}.button:hover{background:linear-gradient(110deg,#ffa6dd,#ccbcff);box-shadow:0 5px 30px #db54cf40}
.art{background:radial-gradient(ellipse at 50% 65%,#c2539635,transparent 55%),linear-gradient(#201332,#442057 55%,#162c49);border:1px solid #c493ee50;box-shadow:0 0 45px #d269ce15}
.art:before{content:'';position:absolute;inset:55% -40% -25%;background:linear-gradient(#72f4ef45 1px,transparent 1px),linear-gradient(90deg,#72f4ef45 1px,transparent 1px);background-size:42px 32px;transform:perspective(180px) rotateX(42deg);transform-origin:top}
.sun{width:145px;height:145px;right:35px;top:35px;background:repeating-linear-gradient(to bottom,transparent 0 18px,#321944 18px 22px),linear-gradient(#ffce91,#ff88c4 55%,#e552c7);box-shadow:0 0 45px #ff83c345}
.board{box-shadow:9px 9px 0 #09071955,0 0 22px #ff8ddb20}.b1{background:#f6dcff;border-left-color:#ff80c3}.b2{background:#9aeae9;border-right-color:#e5ffff}.b3{background:#a398ef;border-left-color:#eeccff}.wave{background:#6852a6}.w2{background:#242847;border-top:2px solid #77e4e780}.art span{color:#f8e5ff}
.calc-section,.faq,footer{border-color:#9c82ba35}.calculator{background:#19152d;border-color:#8b71ae55;box-shadow:0 15px 55px #07051155}input,select{background:#100e20;color:#f5f0ff;border-color:#75648d}input:hover,select:hover{border-color:#b5a0d2}.result{background:linear-gradient(135deg,#282042,#1b2035)}.result p{color:#ded6ee}.result .eyebrow{color:#7ef1e6}.result h3{color:#ffaddf;letter-spacing:-2px}.rule{background:#bca3dc35}.cards article{border-color:#bc87d4}.cards span{color:#ffaddf}details{border-color:#9c82ba35}.method{background:linear-gradient(120deg,#221b35,#192536);border:1px solid #9c82ba35}a{color:#8ef3e9}input:focus-visible,select:focus-visible,a:focus-visible,button:focus-visible,summary:focus-visible{outline-color:#75f9ed}::selection{background:#ffaddf;color:#190e29}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero-photo{border-radius:24px;overflow:hidden;border:1px solid #c493ee50;box-shadow:0 0 45px #d269ce15;background:#1b2035}.hero-photo img{display:block;width:100%;height:auto}@media(max-width:760px){.hero-photo{border-radius:16px}}
.hero-photo{position:relative}.photo-caption{position:absolute;z-index:1;top:20px;left:24px;color:#171727;font-size:11px;line-height:1.5;letter-spacing:1.6px;font-weight:800;text-align:left}@media(max-width:760px){.photo-caption{top:14px;left:16px;font-size:10px;letter-spacing:1.2px}}
/* Keep both caption lines inside the pale sky at every screen size. */
.hero-photo .photo-caption{top:5%;left:5%;font-size:clamp(8px,1vw,11px);line-height:1.25;color:#151522;letter-spacing:1.2px}
.hero-photo .photo-caption{font-size:clamp(10px,1.2vw,13px);line-height:1.25}
.article-main{max-width:1180px}.article{max-width:820px;margin:0 auto;padding:55px 0 75px}.article h1{font-size:52px;line-height:1.15}.article h2{font-size:28px;letter-spacing:-.7px;margin-top:40px}.article p,.article li{font-size:17px;color:var(--muted)}.article strong{color:var(--ink)}.article li{margin-bottom:9px}.article .intro{max-width:750px;font-size:20px}.back-link{font-size:14px;display:inline-block;margin-bottom:25px}.footer-links{display:flex;flex-wrap:wrap;gap:20px;font-size:14px}.guide-card{display:block;padding:26px;border:1px solid #8b71ae55;border-radius:12px;text-decoration:none;background:#19152d}.guide-card:hover{border-color:#ffaddf;background:#231b37}.guide-card h3{color:var(--ink);font-size:25px}.guide-card strong{font-size:14px;color:var(--teal)}.guide-card span{font-size:11px;letter-spacing:1px}.table-scroll{overflow-x:auto;border:1px solid #8b71ae55;border-radius:10px;margin:25px 0}table{border-collapse:collapse;width:100%;min-width:600px;font-size:14px}th,td{text-align:left;padding:13px 14px;border-bottom:1px solid #8b71ae30}thead{background:#282042}tbody tr:nth-child(even){background:#19152d}caption{text-align:left;padding:14px;font-weight:700;color:var(--ink)}.article-cta,.contact-box{padding:26px;background:#221b35;border:1px solid #8b71ae55;border-radius:12px;margin-top:35px}.article-cta h2,.contact-box h2{margin-top:0}.article-cta .button{color:#190e29}.article-main>section>h1{font-size:52px}@media(max-width:760px){.article{padding:35px 0 55px}.article h1,.article-main>section>h1{font-size:38px}.article h2{font-size:25px}.article .intro{font-size:18px}nav a:last-child{display:inline}.footer-links{gap:15px}.guide-card{padding:22px}}