:root{--ink:#252521;--muted:#696960;--paper:#f6f5f1;--line:#deded5;--orange:#c44724;--peach:#fce6db;--green:#e8efdc;--white:#fff;--max:1160px}*{box-sizing:border-box}body{margin:0;font:16px/1.65 Arial,Helvetica,sans-serif;color:var(--ink);background:var(--paper);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--orange);outline-offset:4px}button:disabled{cursor:default;opacity:.55}[hidden]{display:none!important}.wrap{max-width:var(--max);margin:auto}.header{height:92px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{font-size:25px;font-weight:700;letter-spacing:-1px;display:inline-flex;gap:10px;align-items:center}.brand img{width:36px;height:36px}.brand>span{color:var(--ink)}.brand>span>span{color:var(--orange)}.header nav{display:flex;gap:4px;align-items:center}.header nav a{padding:10px 17px;font-size:13px;border-radius:8px}.header nav a[aria-current=page]{background:var(--ink);color:white}.header nav a:hover{background:var(--peach);color:var(--ink)}.menu-toggle{display:none}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:var(--muted);margin:0 0 19px}.eyebrow:before{content:'';display:inline-block;width:6px;height:6px;background:var(--orange);border-radius:50%;margin-right:8px}h1,h2,h3,p{margin-top:0}h1{font-size:64px;line-height:1.03;letter-spacing:-3.4px;margin-bottom:25px;font-weight:700}h1 em{color:var(--orange);font-style:normal}h2{font-size:31px;line-height:1.16;letter-spacing:-1.1px;margin-bottom:15px}h3{font-size:21px;line-height:1.25;letter-spacing:-.5px;margin-bottom:12px}p{color:var(--muted)}.hero{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:center;padding:61px 0 51px}.hero .intro{max-width:535px;font-size:16px;line-height:1.8;margin:0}.hero-art{width:100%;height:auto}.section{margin:60px 0}.section-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px;gap:20px}.section-head h2{margin:0}.text-link{font-size:13px;font-weight:700;color:var(--orange);padding:10px 0}.tool{background:white;border:1px solid var(--line);border-radius:20px;padding:30px;box-shadow:0 15px 35px #33331c06}.tool-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:12px}.tool-top h2{font-size:19px;margin:0;letter-spacing:-.4px}.badge{font-size:11px;background:var(--green);border-radius:20px;padding:5px 11px;white-space:nowrap;color:#485938}.fields{display:grid;grid-template-columns:1fr 1.7fr 170px;gap:16px;align-items:end}label{font-size:12px;font-weight:700;display:block;color:var(--ink)}input,select{display:block;border:1px solid var(--line);border-radius:9px;padding:12px 15px;height:55px;background:#fafaf7;color:var(--ink);width:100%;min-width:0;margin-top:9px}input::placeholder{color:#919188}input[aria-invalid=true]{border-color:#b33d22}.primary{border:0;border-radius:9px;background:var(--orange);color:white;font-weight:700;font-size:14px;height:55px;padding:13px 24px;display:inline-flex;align-items:center;justify-content:center;gap:18px}.primary:hover{background:#b64121}.secondary{border:1px solid var(--line);background:white;border-radius:8px;min-height:44px;padding:8px 15px;color:var(--ink);font-size:12px}.secondary:hover{background:var(--paper)}.help{font-size:12px;margin:12px 0;color:var(--muted)}.error{color:#a42e18;font-size:13px;margin:10px 0}.error:empty{display:none}.examples{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:20px;font-size:12px;color:var(--muted)}.examples button{border:1px solid var(--line);border-radius:7px;background:white;font-size:11px;padding:7px 12px;min-height:36px}.examples button:hover{border-color:var(--orange)}.result{border-radius:13px;background:var(--ink);color:white;padding:25px 28px;margin-top:24px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:15px}.result p{color:#c3c3b9;margin:0;font-size:12px}.result .roman{display:block;font-size:48px;line-height:1.2;letter-spacing:2px;font-weight:600;overflow-wrap:anywhere;margin:8px 0 14px}.result .secondary{background:#ffffff0a;border-color:#ffffff33;color:white}.result-label{letter-spacing:1.5px;font-size:9px}.copy-status{font-size:12px;min-height:18px;margin:8px 0 0;color:var(--muted)}.symbols{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}.symbol{background:white;border:1px solid var(--line);border-radius:13px;text-align:center;padding:21px 5px}.symbol strong{display:block;font:600 32px/1.3 Georgia,serif;margin-bottom:10px}.symbol span{font-size:12px;color:var(--muted)}.symbol:nth-child(2),.symbol:nth-child(5){background:var(--peach)}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{background:white;border:1px solid var(--line);border-radius:16px;padding:27px;position:relative;min-height:181px;display:block;transition:transform .15s}.card:hover{transform:translateY(-3px);border-color:#b9b9a9}.card:nth-child(3n+2){background:var(--peach)}.card:nth-child(3n){background:var(--green)}.card-number{display:block;font-size:11px;color:var(--muted);margin-bottom:35px}.card-arrow{position:absolute;right:24px;top:21px;font-size:21px}.card h3{margin-bottom:8px}.card p{font-size:12px;margin:0}.explainer{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:start}.explainer p{font-size:14px}.breakdown{border:1px solid var(--line);border-radius:16px;background:white;padding:30px}.breakdown .big{font-size:44px;font-weight:700;letter-spacing:1px;margin-bottom:12px}.breakdown p{margin-bottom:0}.formula{font-family:ui-monospace,monospace;color:var(--orange);font-size:20px}.faq{max-width:840px;margin:70px auto}.faq details{border-bottom:1px solid var(--line);padding:20px 0}.faq summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px}.faq summary:after{content:'+';font-size:23px;color:var(--orange)}.faq details[open] summary:after{content:'−'}.faq details p{font-size:14px;margin:16px 24px 0 0}.footer{border-top:1px solid var(--line);padding:35px 0 45px;display:flex;justify-content:space-between;gap:20px;align-items:start}.footer p{font-size:12px;margin:10px 0 0}.footer nav{display:flex;gap:25px;font-size:12px}.breadcrumb{display:flex;flex-wrap:wrap;gap:11px;font-size:11px;color:var(--muted);padding:25px 0}.breadcrumb a{color:var(--orange)}.inner-hero{max-width:760px;padding:27px 0 33px}.inner-hero h1{font-size:51px;letter-spacing:-2.2px}.inner-hero p{max-width:650px;margin-bottom:0}.content{max-width:780px}.content section{margin:35px 0}.content p,.content li{font-size:15px;color:var(--muted)}.content li{margin-bottom:10px}.content a{color:#b44124;text-decoration:underline;text-underline-offset:3px}.aside-layout{display:grid;grid-template-columns:minmax(0,780px) 1fr;gap:50px}.note{background:var(--peach);border-radius:15px;padding:26px;align-self:start}.note p{font-size:13px;margin:0}.note h2{font-size:23px}.table-tools{display:flex;gap:15px;align-items:end;max-width:550px;margin-bottom:20px}.table-tools label{flex:1}.table-wrap{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:white}table{width:100%;border-collapse:collapse;font-size:14px}caption{padding:20px;text-align:left;font-weight:700}th{text-align:left;background:var(--ink);color:white;font-size:12px;padding:13px 18px}td{padding:11px 18px;border-bottom:1px solid #ededE5}tr:last-child td{border:0}tbody tr:nth-child(even){background:#f9f9f5}td:nth-child(2){font-weight:700;letter-spacing:1px}.table-status{font-size:12px}.date-fields{grid-template-columns:1fr 180px}.date-result .roman{font-size:38px}.year-examples{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.year-examples div{padding:20px;border:1px solid var(--line);border-radius:12px;background:white}.year-examples strong{display:block;font-size:23px}.year-examples span{font-size:12px;color:var(--muted)}.clock-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.clock-grid img{width:100%;max-width:390px;height:auto}.overbar{text-decoration:overline}.quiz-card{max-width:780px}.quiz-card h2{font-size:30px}.quiz-controls{display:flex;gap:12px;align-items:end}.quiz-controls label{flex:1}.feedback{font-size:15px;color:var(--ink);margin:22px 0}.cw-fields{grid-template-columns:1fr 1fr 1.5fr 150px}.cw-results{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.cw-results li{padding:14px;background:white;border:1px solid var(--line);border-radius:10px}.cw-results span{font-size:12px;color:var(--muted)}.menu-open{overflow:hidden}dialog{padding:30px;border:0;border-radius:20px;background:var(--ink);color:white;width:calc(100% - 24px);max-width:450px;max-height:calc(100dvh - 24px);overflow:auto}dialog::backdrop{background:#252521a8;backdrop-filter:blur(5px)}.menu-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:25px;border-bottom:1px solid #ffffff22;font-size:28px;letter-spacing:-1px}.menu-close{background:#ffffff0a;color:white;border:1px solid #ffffff33;border-radius:9px;width:44px;height:44px;font-size:23px}dialog nav{display:flex;flex-direction:column;margin:16px 0 30px}dialog nav a{padding:17px 0;border-bottom:1px solid #ffffff18;font-size:18px;display:flex;justify-content:space-between}dialog nav a[aria-current=page]{color:#ffad8f}dialog p{font-size:12px;color:#b9b9b0}dialog .menu-extra{font-size:13px;display:block;margin:18px 0;color:#d2d2c6}dialog .menu-note{margin-top:40px;color:#e8efdc}noscript{display:block;background:var(--peach);padding:15px;font-size:14px;border-radius:10px;margin-top:20px}
@media(max-width:1240px){.wrap{margin:0 35px}.hero{gap:30px}h1{font-size:55px}.fields{grid-template-columns:1fr 1.4fr 150px}.cw-fields{grid-template-columns:1fr 1fr}.date-fields{grid-template-columns:1fr 180px}}
@media(max-width:800px){.header{height:77px}.header nav{display:none}.menu-toggle{display:block;height:44px;padding:8px 14px;border:1px solid var(--line);background:white;border-radius:9px;font-size:12px}.wrap{margin:0 20px}.brand{font-size:23px}.brand img{width:32px;height:32px}.hero{display:block;padding:36px 0 28px}.hero-art{display:none}h1{font-size:43px;letter-spacing:-2px;line-height:1.06;max-width:560px}.hero .intro{font-size:14px}.eyebrow{font-size:9px;margin-bottom:21px}.tool{padding:22px 19px;border-radius:17px}.tool-top{align-items:start}.tool-top h2{font-size:18px;max-width:175px}.badge{font-size:9px;padding:5px 8px}.fields,.date-fields,.cw-fields{grid-template-columns:1fr;gap:16px}input,select{font-size:16px;height:52px}.primary{height:52px}.help{font-size:11px}.examples{gap:7px}.examples button{min-height:44px;font-size:11px}.result{padding:22px 18px;grid-template-columns:1fr;gap:6px}.result .roman{font-size:35px;letter-spacing:1px}.result .secondary{justify-self:start;margin-top:12px}.result p{font-size:11px;line-height:1.8}.section{margin:42px 0}.section-head{align-items:start;gap:15px}.section-head h2,h2{font-size:26px;letter-spacing:-.8px}.text-link{font-size:11px;white-space:nowrap;padding:5px 0}.symbols{grid-template-columns:repeat(4,1fr);gap:8px}.symbol{padding:17px 4px;border-radius:10px}.symbol strong{font-size:26px}.symbol span{font-size:11px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card{padding:20px 15px;min-height:174px;border-radius:13px}.card h3{font-size:19px;overflow-wrap:anywhere}.card p{font-size:11px}.card-number{margin-bottom:29px}.card-arrow{right:16px;top:17px;font-size:19px}.explainer,.aside-layout,.clock-grid{grid-template-columns:1fr;gap:25px}.breakdown{padding:24px}.breakdown .big{font-size:35px}.faq{margin:45px auto}.faq summary{font-size:13px}.footer{display:block;padding:27px 0}.footer nav{flex-wrap:wrap;gap:20px;margin-top:24px}.inner-hero{padding-top:15px}.inner-hero h1{font-size:40px;letter-spacing:-1.7px}.inner-hero p{font-size:14px}.breadcrumb{font-size:10px;gap:8px}.table-tools{gap:10px}.table-tools .secondary{height:52px}.year-examples{grid-template-columns:repeat(2,1fr);gap:10px}.year-examples strong{font-size:19px}.year-examples div{padding:16px}.date-result .roman{font-size:27px}.clock-grid img{max-width:300px;margin:auto}.quiz-controls{display:block}.quiz-controls .primary{width:100%;margin-top:15px}.quiz-card h2{font-size:26px}.cw-results{grid-template-columns:repeat(2,1fr)}.content p,.content li{font-size:14px}.note{padding:23px}.table-wrap{border-radius:11px}th,td{padding:12px}.formula{font-size:17px}}
@media(max-width:359px){h1{font-size:38px}.wrap{margin:0 15px}.tool-top{flex-wrap:wrap}.cards{grid-template-columns:1fr}.section-head{display:block}.result .roman{font-size:29px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Romertal, second visual edition. Layout changes preserve all HTML and behaviour. */
:root{--ink:#201d35;--muted:#706c84;--paper:#f5f4f9;--line:#e5e2ee;--orange:#6550ce;--peach:#ede9fc;--green:#e4f3d5;--max:1160px}
body{background:var(--paper);font-family:Arial,Helvetica,sans-serif;letter-spacing:-.1px}a,button{touch-action:manipulation}
.header{height:100px;border:0}.brand{letter-spacing:-1.1px;font-size:25px;gap:11px}.brand img{width:40px;height:40px}.brand>span>span{color:#6550ce}.header nav{background:white;padding:5px;border:1px solid var(--line);border-radius:99px;box-shadow:0 3px 14px #30245104}.header nav a{border-radius:99px;padding:9px 21px;font-size:12px;color:#6e6882}.header nav a[aria-current=page]{background:#201d35;color:white}.header nav a:hover{background:#eeebf8}
.hero{display:block;position:relative;isolation:isolate;text-align:center;background:#201d35;border-radius:32px;padding:62px 32px 132px;overflow:hidden;margin:8px -24px 0}.hero:before,.hero:after{content:'';position:absolute;z-index:-1;pointer-events:none;width:560px;height:560px;border-radius:50%;border:1px solid #ffffff10;top:-185px;left:-265px;box-shadow:0 0 0 42px #ffffff03,0 0 0 84px #ffffff02}.hero:after{left:auto;right:-270px;top:60px;width:620px;height:620px;border-color:#a99bff16;background:radial-gradient(circle,#5843942b,transparent 70%)}.hero>div{position:relative}.hero .eyebrow{display:inline-block;color:#d9d2f4;background:#ffffff0b;border:1px solid #ffffff16;border-radius:99px;padding:7px 13px;font-size:9px;letter-spacing:1.9px;margin-bottom:28px}.hero .eyebrow:before{background:#d4efb7;box-shadow:0 0 0 3px #d4efb713}.hero h1{font-size:78px;line-height:1.03;letter-spacing:-4.5px;color:white;font-weight:700;max-width:1000px;margin:0 auto 25px}.hero h1 em{color:#c6b9ff}.hero .intro{color:#bcb5d0;font-size:14px;line-height:1.8;max-width:530px;margin:auto}.hero-art{display:none}
.tool{border:1px solid var(--line);box-shadow:0 20px 60px #30205408;border-radius:24px;padding:30px}.hero+.tool{position:relative;margin:-83px 40px 0;z-index:2}.tool-top{margin-bottom:0;padding-bottom:23px;border-bottom:1px solid #efedf4}.tool-top h2{font-size:20px;letter-spacing:-.6px}.badge{background:#efecf8;color:#625482;font-size:10px;padding:6px 12px;border-radius:99px}
.tool:has(#converter),.date-card,.tool:has(#date-form){display:grid;grid-template-columns:1fr 1.1fr;gap:24px 30px}.tool:has(#converter)>.tool-top,.tool:has(#date-form)>.tool-top{grid-column:1/-1;grid-row:1}.tool:has(#converter)>form,.tool:has(#date-form)>form{grid-column:1;grid-row:2}.tool:has(#converter)>.examples{grid-column:1;grid-row:3;margin:0;align-self:start}.tool:has(#converter)>.result,.tool:has(#date-form)>.result{grid-column:2;grid-row:2/4;margin:0;display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:23px;min-width:0}.tool:has(#converter)>.copy-status,.tool:has(#date-form)>.copy-status{grid-column:2;grid-row:4;margin:-15px 0 -8px;font-size:11px;min-height:0}
.fields{gap:17px}.tool:has(#converter) .fields,.tool:has(#date-form) .fields{display:grid;grid-template-columns:1fr}.fields label{font-size:11px;color:#645e77;font-weight:600;letter-spacing:.1px}input,select{background:#f7f6fa;border-color:#e6e2ee;border-radius:10px;height:53px;font-size:15px;color:#201d35;margin-top:8px;padding:12px 15px}input::placeholder{color:#918ba3}.primary{height:52px;background:#6550ce;border-radius:10px;font-size:13px;box-shadow:0 5px 14px #6550ce16;letter-spacing:.1px}.primary:hover{background:#503bb4}.secondary{border-radius:9px;color:#5e5872;border-color:#e5e0ef;background:white}.help{font-size:11px;line-height:1.7;margin-bottom:0;color:#837b93}.error{font-size:12px;color:#ad2439}.examples{font-size:10px;gap:6px}.examples>span{width:100%;margin-bottom:2px;color:#8a829b}.examples button{border-color:#e8e4f0;background:#faf9fc;border-radius:8px;min-width:49px;color:#625a77;min-height:35px}
.result{background:#eeebfa;color:#201d35;padding:30px;border-radius:18px;position:relative;isolation:isolate;overflow:hidden}.result:after{content:'';position:absolute;z-index:-1;right:-48px;top:-55px;width:190px;height:190px;border:1px solid #cfc5ee;border-radius:50%;box-shadow:0 0 0 32px #d7cff018,0 0 0 64px #d7cff010;pointer-events:none}.result-label{color:#8b7eaf;font-size:9px;letter-spacing:2px}.result .roman{font-size:51px;font-weight:700;letter-spacing:-1.7px;line-height:1.15;color:#524094;margin:25px 0 17px}.result p{color:#83769d;font-size:12px;line-height:1.9}.result #result-value{color:#54496e;font-size:14px;font-weight:600;margin-bottom:8px}.result .secondary{align-self:start;border-color:#d7cfee;background:white;color:#6550a6;font-size:11px;min-height:40px;padding:9px 16px}.date-result .roman{font-size:36px;line-height:1.4}.copy-status{color:#706287}
.section{margin:70px 0}.section-head{margin-bottom:26px}.section-head h2,h2{font-size:31px;font-weight:700;letter-spacing:-1.2px}.eyebrow{color:#8b839b;font-size:9px;letter-spacing:1.8px}.eyebrow:before{background:#6550ce}.text-link{font-size:12px;color:#6550ce;font-weight:600}.symbols{background:#201d35;border-radius:20px;padding:23px 16px;gap:0}.symbol,.symbol:nth-child(2),.symbol:nth-child(5){background:transparent;border:0;border-right:1px solid #ffffff12;border-radius:0;padding:4px 5px}.symbol:last-child{border:0}.symbol strong{font-family:Arial,Helvetica,sans-serif;font-size:31px;color:#d5cbff;font-weight:600;line-height:1.3;margin-bottom:9px}.symbol span{color:#948ba9;font-size:11px}
.cards{gap:17px}.card,.card:nth-child(3n+2),.card:nth-child(3n){background:white;border-color:#e4dfed;border-radius:20px;padding:27px;min-height:206px;transition:transform .2s,box-shadow .2s}.card:hover{border-color:#c3b9e1;transform:translateY(-4px);box-shadow:0 12px 24px #34224a09}.card-number{display:inline-flex;width:37px;height:37px;border-radius:11px;background:#eeebf9;align-items:center;justify-content:center;font-size:11px;color:#9688b2;font-weight:700;margin-bottom:26px}.card:nth-child(2n) .card-number{background:#edf4e4;color:#6d8c58}.card:nth-child(3n) .card-number{background:#f9ede8;color:#b18477}.card-arrow{width:32px;height:32px;border-radius:50%;border:1px solid #e8e3f0;text-align:center;line-height:29px;top:28px;right:24px;font-size:18px;color:#9a8eae}.card h3{font-size:22px;font-weight:650;letter-spacing:-.8px}.card p{color:#898096;font-size:12px;max-width:255px}.explainer{background:#eae6f5;border-radius:25px;padding:44px;gap:40px;align-items:center}.explainer h2{max-width:380px}.explainer p{font-size:13px;line-height:1.9;color:#847b95}.breakdown{border:1px solid #e2ddee;border-radius:18px;box-shadow:0 10px 30px #432b6c05;padding:30px}.breakdown .big{color:#6550ce;font-size:43px;letter-spacing:-1px}.formula{color:#504166;font-size:18px}.breakdown p{font-size:12px;color:#a094b2}
.faq{max-width:820px;margin:70px auto}.faq>h2{margin-bottom:28px}.faq details{background:white;border:1px solid #e7e2ef;border-radius:14px;margin-bottom:10px;padding:21px 24px}.faq summary{font-size:13px;color:#514961;font-weight:500}.faq summary:after{background:#f2effa;width:28px;height:28px;border-radius:50%;text-align:center;line-height:28px;flex-shrink:0;font-size:20px;color:#8673b6}.faq details p{font-size:13px;color:#857a96}
.inner-hero{max-width:900px;padding:18px 0 40px}.inner-hero .eyebrow{display:inline-block;background:#ece8f7;padding:6px 11px;border-radius:99px;color:#9a8bb5;font-size:8px}.inner-hero h1{font-size:58px;letter-spacing:-2.7px;line-height:1.07;margin-top:4px;margin-bottom:19px}.inner-hero p{font-size:14px;line-height:1.9;color:#8a8098}.breadcrumb{font-size:10px;gap:10px;padding:15px 0 22px;color:#a39aae}.breadcrumb a{color:#8773b2}
.content{background:white;border:1px solid #e7e2ef;border-radius:24px;padding:36px 40px;margin-top:32px;max-width:820px}.content section{margin:0 0 36px}.content section:last-of-type{margin-bottom:0}.content h2{font-size:27px;letter-spacing:-.8px}.content p,.content li{font-size:14px;line-height:1.85;color:#7f748d}.content a{color:#6550b5;text-decoration-color:#c8bce5}.aside-layout{grid-template-columns:minmax(0,820px) 1fr;gap:26px}.aside-layout .content{margin-top:0}.note{padding:27px;background:#201d35;border-radius:23px;position:sticky;top:25px;overflow:hidden}.note:after{content:'';position:absolute;width:130px;height:130px;border:1px solid #ffffff12;border-radius:50%;bottom:-70px;right:-50px}.note h2{font-size:24px;color:#d5cbff}.note p{color:#aaa1bf;font-size:12px;line-height:1.9}
.table-tools{max-width:650px;background:white;padding:22px 24px;border:1px solid #e7e2ef;border-radius:18px;margin-bottom:16px}.table-tools label{color:#7e728f;font-size:11px}.table-tools input{background:#f8f6fb}.table-tools .secondary{height:53px;padding:10px 20px;font-size:11px}.table-status{color:#94859f;font-size:11px;padding-left:4px}.table-wrap{border-radius:19px;border-color:#e4ddef;max-width:950px}caption{padding:23px;font-size:15px;letter-spacing:-.4px;color:#5f5171}th{background:#201d35;color:#d7cdef;font-size:11px;padding:15px 25px;font-weight:500}td{padding:13px 25px;font-size:13px;border-bottom-color:#f0ebf6;color:#8a7c9a}td:nth-child(2){color:#6550ab;font-size:16px;font-weight:600;letter-spacing:.5px}tbody tr:nth-child(even){background:#faf8fd}.year-examples{gap:16px}.year-examples div{background:white;border:1px solid #e5deef;border-radius:18px;padding:25px}.year-examples strong{color:#6550b5;font-size:25px;letter-spacing:-.5px}.year-examples span{display:block;margin-top:14px;color:#9585a4;font-size:11px}.clock-grid{background:white;border:1px solid #e7e2ef;border-radius:25px;padding:36px;gap:35px}.clock-grid p{font-size:14px;color:#887b94}.clock-grid h2{font-size:30px}.quiz-card{max-width:900px;padding:35px}.quiz-card h2{font-size:35px;max-width:620px;margin:23px 0 30px;letter-spacing:-1.3px}.quiz-card .eyebrow{color:#8d77b3}.quiz-controls .primary{min-width:165px}.feedback{color:#655078;background:#f4effb;border-radius:12px;padding:15px 18px;font-size:13px}.feedback:empty{display:none}.cw-fields{padding-top:24px}.cw-results{gap:12px;margin-top:23px}.cw-results li{background:#f6f2fb;border-color:#e9e0f2;border-radius:12px;padding:18px;color:#655094}.cw-results span{font-size:11px;color:#9583a4}#cw-status{font-size:12px;color:#9584a0;margin-top:22px}
.footer.wrap{max-width:1240px;padding:45px 40px 50px;margin:65px auto 0;background:#201d35;border:0;border-radius:27px 27px 0 0}.footer .brand>span{color:white}.footer .brand>span>span{color:#c6b9ff}.footer p{color:#8e829f;font-size:11px}.footer nav{color:#b2a3c7;font-size:11px;padding-top:12px}
dialog{background:#201d35;border-radius:27px;padding:30px;color:#f4f0fc}dialog::backdrop{background:#171024a6;backdrop-filter:blur(7px)}.menu-head{font-size:30px;letter-spacing:-1px;border-color:#ffffff15}.menu-close{border-radius:13px;background:#ffffff09;border-color:#ffffff22;color:#c7b7dd}dialog nav a{font-size:19px;border-color:#ffffff10;letter-spacing:-.5px}dialog nav a[aria-current=page]{color:#c6b9ff}dialog p{font-size:9px;letter-spacing:1px;color:#9e8cb5}dialog .menu-extra{color:#baa8cd;font-size:13px}.menu-note{color:#c9e5b1!important;font-size:17px!important;letter-spacing:-.4px!important}
@media(max-width:1240px){.hero{margin-left:0;margin-right:0}.header nav a{padding:9px 16px}.hero h1{font-size:69px}.hero+.tool{margin-left:26px;margin-right:26px}.footer.wrap{margin-left:25px;margin-right:25px}.result .roman{font-size:43px}.date-result .roman{font-size:31px}}
@media(max-width:1000px){.hero h1{font-size:60px}.hero+.tool{margin-left:20px;margin-right:20px}.tool:has(#converter),.tool:has(#date-form){gap:22px;grid-template-columns:1fr 1fr}.result{padding:25px}.result .roman{font-size:37px}.date-result .roman{font-size:27px}.explainer{padding:32px}.aside-layout{grid-template-columns:1fr}.note{position:static}.content{max-width:none}}
@media(max-width:800px){.header{height:83px}.brand{font-size:23px;gap:9px}.brand img{width:35px;height:35px}.header nav{display:none}.menu-toggle{background:white;border:1px solid #e5e0ef;border-radius:12px;font-size:11px;height:44px;padding:8px 12px}.hero{margin:4px -8px 0;padding:35px 20px 85px;border-radius:25px}.hero .eyebrow{font-size:7px;letter-spacing:1.5px;padding:7px 10px;margin-bottom:24px}.hero h1{font-size:40px;line-height:1.06;letter-spacing:-2.1px;max-width:500px;margin-bottom:20px}.hero .intro{font-size:12px;line-height:1.85;max-width:310px}.hero:before{width:380px;height:380px;left:-290px;top:-100px}.hero:after{width:450px;height:450px;right:-330px;top:70px}.tool{padding:23px 20px;border-radius:20px}.hero+.tool{margin:-50px 4px 0}.tool:has(#converter),.tool:has(#date-form){display:flex;flex-direction:column;gap:20px}.tool-top{padding-bottom:18px;align-items:center;gap:9px}.tool-top h2{font-size:17px;max-width:160px}.badge{font-size:8px;padding:6px 9px}.fields label{font-size:11px}input,select{font-size:16px;height:52px}.fields{gap:15px}.primary{height:51px;font-size:12px}.help{font-size:10px}.examples button{min-height:44px;min-width:48px}.tool:has(#converter)>.examples{margin-top:-3px;gap:7px;align-self:stretch}.examples>span{font-size:10px;margin-bottom:3px}.tool:has(#converter)>.result,.tool:has(#date-form)>.result{display:block;width:100%;padding:24px 20px;min-height:230px}.result .roman{font-size:39px;letter-spacing:-1.3px;margin:23px 0 16px}.result p{font-size:10px;line-height:1.9}.result #result-value{font-size:12px}.result-label{font-size:8px}.result .secondary{margin-top:21px;min-height:44px;font-size:10px}.date-result .roman{font-size:28px}.tool:has(#converter)>.copy-status,.tool:has(#date-form)>.copy-status{margin:-12px 0 -9px;font-size:10px}.section{margin:47px 0}.section-head{gap:17px;align-items:center;margin-bottom:22px}.section-head h2,h2{font-size:25px;letter-spacing:-.9px}.section-head h2{max-width:285px}.text-link{font-size:10px}.symbols{padding:19px 11px;grid-template-columns:repeat(4,1fr);gap:23px 0;border-radius:18px}.symbol,.symbol:nth-child(2),.symbol:nth-child(5){padding:0 3px;border:0}.symbol strong{font-size:25px;margin-bottom:6px}.symbol span{font-size:10px}.cards{gap:12px}.card,.card:nth-child(3n+2),.card:nth-child(3n){border-radius:17px;min-height:192px;padding:20px 15px}.card-number{width:31px;height:31px;font-size:9px;border-radius:9px;margin-bottom:28px}.card-arrow{width:26px;height:26px;line-height:24px;font-size:14px;top:23px;right:14px}.card h3{font-size:19px;line-height:1.2;letter-spacing:-.6px}.card p{font-size:10px;line-height:1.7}.explainer{padding:27px 23px;gap:24px;border-radius:22px}.explainer h2{font-size:27px}.explainer p{font-size:12px}.breakdown{padding:24px}.breakdown .big{font-size:34px}.formula{font-size:16px}.faq{margin:50px auto}.faq details{padding:18px 17px;border-radius:13px}.faq summary{font-size:12px;gap:14px}.faq summary:after{width:25px;height:25px;line-height:25px;font-size:18px}.faq details p{font-size:12px;margin-right:0}.inner-hero{padding-top:13px;padding-bottom:29px}.inner-hero h1{font-size:41px;letter-spacing:-1.8px}.inner-hero p{font-size:13px;line-height:1.8}.inner-hero .eyebrow{font-size:7px}.breadcrumb{font-size:9px;padding-top:13px}.content{padding:27px 23px;border-radius:20px;margin-top:26px}.content h2{font-size:25px;letter-spacing:-.7px}.content p,.content li{font-size:13px;line-height:1.85}.content section{margin-bottom:31px}.aside-layout{gap:19px}.note{border-radius:20px;padding:27px}.note h2{font-size:25px}.note p{font-size:12px}.table-tools{padding:19px 17px;border-radius:16px;gap:9px}.table-tools label{font-size:10px}.table-tools .secondary{font-size:10px;padding:9px 12px}.table-wrap{border-radius:16px}caption{padding:19px;font-size:13px}th{padding:13px 14px;font-size:10px}td{padding:12px 14px;font-size:12px}td:nth-child(2){font-size:14px}.year-examples{gap:11px}.year-examples div{border-radius:15px;padding:20px 16px}.year-examples strong{font-size:20px}.year-examples span{font-size:10px;margin-top:12px}.clock-grid{padding:25px 23px;border-radius:20px;gap:23px}.clock-grid h2{font-size:26px}.clock-grid p{font-size:13px}.quiz-card{padding:27px 23px}.quiz-card h2{font-size:29px;margin:21px 0 28px;letter-spacing:-1px}.feedback{font-size:12px;padding:14px}.cw-fields{padding-top:22px}.cw-results{gap:9px}.cw-results li{padding:15px;font-size:14px}.cw-results span{font-size:10px}.footer.wrap{margin:45px 12px 0;padding:31px 25px 37px;border-radius:22px 22px 0 0}.footer nav{gap:18px;font-size:10px;padding-top:0}.footer .brand{font-size:23px}.footer p{font-size:10px}dialog{padding:28px;border-radius:24px}.menu-head{font-size:29px}dialog nav a{font-size:18px}.menu-note{margin-top:40px}}
@media(max-width:359px){.hero h1{font-size:35px;letter-spacing:-1.6px}.hero{padding-left:17px;padding-right:17px}.tool-top{flex-wrap:wrap}.result .roman{font-size:32px}.date-result .roman{font-size:24px}.cards{grid-template-columns:1fr}.card{min-height:170px}}

/* --- production responsive fixes, browser-verified --- */
/* The rules aside drops position:sticky below 1000px by going position:static, which
   also removes the containing block for its decorative ::after circle. The circle is
   offset right:-50px, so it escaped .note's overflow:hidden and pushed every mobile
   viewport 50px wide. position:relative keeps it unstuck and clipped. */
@media(max-width:1000px){.note{position:relative}}
/* Two year cards cannot shrink below their min-content at 320px. One column fits. */
@media(max-width:359px){.year-examples{grid-template-columns:1fr}}