/* Theme and directional adaptations preserve the original component geometry. */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Arabic:wght@400;500;600;650;700&display=swap');
:root{color-scheme:light;--surface:#fff;--surface-soft:#f8faf7;--control-border:#d4dfd8}
.nav{gap:20px}.header-controls{display:flex;align-items:center;gap:7px;flex-shrink:0}.header-control{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:42px;padding:7px 11px;border:1px solid var(--line);border-radius:7px;color:var(--ink);background:var(--surface);font-size:11px;font-weight:550;white-space:nowrap}.header-control:hover{background:var(--mint)}.theme-symbol{font-size:17px;line-height:1}.language-control{font-family:'Noto Sans Arabic','DM Sans',sans-serif}.nav-cta{white-space:nowrap}.nav{min-width:0}.nav nav{gap:23px}.nav>*{min-width:0}input,textarea,select{max-width:100%}.hero-grid>*{min-width:0}.calculator-grid>*,.calc-layout>*,.article-grid>*,.footer-top>*{min-width:0}img{max-width:100%}.prose p,.prose li,.formula{overflow-wrap:anywhere}.children-link .icon-box{width:30px;height:30px;border-radius:7px}.children-link .icon-box svg{width:18px;height:18px}.calc-card{display:flex;flex-direction:column}.calc-card .card-bottom{margin-top:auto}.form-panel input{font-size:16px}.panel-title{gap:12px}.result-number{overflow-wrap:anywhere}#result{scroll-margin-top:110px}.header-control,.mobile-toggle{min-width:44px}
[data-theme=dark]{color-scheme:dark;--ink:#e0eee9;--teal:#88c8b7;--muted:#afc1ba;--line:#344c45;--mint:#213b32;--cream:#15231e;--surface:#1a2b24;--surface-soft:#172820;--control-border:#496257}
[data-theme=dark] body{background:#111e19;color:var(--ink)}[data-theme=dark] header{background:#15251ff5}[data-theme=dark] .brand-icon{background:#4b9a84;color:#f2faf6}[data-theme=dark] .hero{background:var(--cream)}[data-theme=dark] .pill{background:#243a2b;border-color:#3f5c42;color:#b4d7b1}[data-theme=dark] .btn{background:#4b9681;border-color:#4b9681;color:#fff}[data-theme=dark] .btn:hover{background:#3b806d}[data-theme=dark] .btn.secondary{background:#1d3128;border-color:#496155;color:var(--ink)}[data-theme=dark] .nav-cta{border-color:#466454}[data-theme=dark] .drop-list,[data-theme=dark] .demo-card,[data-theme=dark] .float-note,[data-theme=dark] .calc-card,[data-theme=dark] .form-panel{background:var(--surface);border-color:var(--line)}[data-theme=dark] .hero-demo:before{border-color:#344d3a;box-shadow:0 0 0 35px transparent,0 0 0 36px #2c4233,0 0 0 72px #17271e,0 0 0 73px #273f2f}[data-theme=dark] .demo-card{box-shadow:0 16px 50px #0002}[data-theme=dark] .demo-measures div{background:#17271f;border-color:#385041}[data-theme=dark] .demo-measures strong small{color:#aabbb0}[data-theme=dark] .icon-box{background:#294335;border-color:#3c5745;color:#a0cfb3}[data-theme=dark] .live,[data-theme=dark] .micro-trust,[data-theme=dark] .card-bottom,[data-theme=dark] .scale-labels{color:#afc1b3}[data-theme=dark] .category{background:#304e31;color:#c7e4bd}[data-theme=dark] .demo-link,[data-theme=dark] .card-bottom{border-color:var(--line)}[data-theme=dark] .float-note .check{background:#304c32;color:#c1dfb8}[data-theme=dark] .trust-strip{background:#17271f}[data-theme=dark] .trust-inner,[data-theme=dark] .source-logos{color:#aabbaf}[data-theme=dark] .calc-card.featured{background:#253a2b;border-color:#4b6450}[data-theme=dark] .badge{background:#364c34;color:#c0d8b4}[data-theme=dark] .calculator-grid .calc-card:nth-child(2) .icon-box{background:#293c48;color:#b1cce2}[data-theme=dark] .calculator-grid .calc-card:nth-child(3) .icon-box{background:#453b28;color:#e6ce9c}[data-theme=dark] .calculator-grid .calc-card:nth-child(4) .icon-box{background:#38324b;color:#cbbce8}[data-theme=dark] .calculator-grid .calc-card:nth-child(5) .icon-box{background:#45372c;color:#e5c1a5}[data-theme=dark] .calculator-grid .calc-card:nth-child(6) .icon-box{background:#263e48;color:#a6d0e1}[data-theme=dark] .children-link,[data-theme=dark] .notice,[data-theme=dark] .result-panel.empty{background:#1b2b23;border-color:var(--line)}[data-theme=dark] .journal-section,[data-theme=dark] footer{background:#16251e;border-color:var(--line)}[data-theme=dark] .article-meta{color:#a5c7ac}[data-theme=dark] .article-meta span{color:#b0bfb5}[data-theme=dark] .unit-toggle{background:#12231a}[data-theme=dark] .unit-toggle button.active{background:#354e3d;color:#d1ecda}[data-theme=dark] input,[data-theme=dark] textarea,[data-theme=dark] select{background:#13231b;border-color:var(--control-border);color:var(--ink)}[data-theme=dark] .input-wrap>span{color:#afc1b5}[data-theme=dark] input::placeholder,[data-theme=dark] textarea::placeholder{color:#aabbb0}[data-theme=dark] .result-panel{background:#223729;border-color:#425a45}[data-theme=dark] .result-range,[data-theme=dark] .formula{border-color:#476047}[data-theme=dark] .result-panel .category{background:#dce9d5!important;color:#263e2c!important}[data-theme=dark] .error{color:#ffb5a9}[data-theme=dark] .article-image{background:#293a2b}
html[dir=rtl] body{font-family:'Noto Sans Arabic','DM Sans',Arial,sans-serif}html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3{font-family:'Noto Sans Arabic',Arial,sans-serif;letter-spacing:0;line-height:1.55}html[dir=rtl] h1{font-size:48px;line-height:1.6}html[dir=rtl] .hero p{line-height:2}html[dir=rtl] .eyebrow,html[dir=rtl] .tiny-label,html[dir=rtl] .article-meta,html[dir=rtl] .pill,html[dir=rtl] .badge{letter-spacing:0}html[dir=rtl] .brand{direction:ltr;font-family:Manrope,Arial,sans-serif}html[dir=rtl] .dropdown button span{margin-left:0;margin-right:8px}html[dir=rtl] .drop-list{left:auto;right:-16px}html[dir=rtl] .nav-cta span{margin-left:0;margin-right:14px}html[dir=rtl] .micro-trust span:before{margin-left:6px;margin-right:0}html[dir=rtl] .live{margin-left:0;margin-right:auto;font-size:9px;letter-spacing:0}html[dir=rtl] .demo-card{transform:rotate(2deg)}html[dir=rtl] .hero-demo:before{left:auto;right:30px}html[dir=rtl] .float-note{left:auto;right:-27px;transform:rotate(-1deg)}html[dir=rtl] .text-link span{margin-left:0;margin-right:14px}html[dir=rtl] .article-meta span{margin-left:0;margin-right:12px}html[dir=rtl] .input-wrap>span{right:auto;left:14px}html[dir=rtl] .input-wrap input{padding-right:13px;padding-left:45px}html[dir=rtl] input[type=number]{direction:ltr;text-align:right}html[dir=rtl] .result-number,html[dir=rtl] .demo-score .number,html[dir=rtl] .result-range strong{direction:ltr;unicode-bidi:isolate;font-family:Manrope,'Noto Sans Arabic',sans-serif}html[dir=rtl] .prose h1,html[dir=rtl] .page-head h1{font-size:38px}html[dir=rtl] .article-card h3{font-size:17px}html[dir=rtl] .calc-card h3{font-size:16px}html[dir=rtl] .demo-heading{font-size:13px}html[dir=rtl] .breadcrumb{line-height:2.2}
@media(min-width:1101px){.nav{gap:18px}.nav .brand{font-size:21px}.nav nav{font-size:12px;gap:21px}.nav-cta{font-size:11px;padding:10px 12px}}
@media(max-width:1200px){.nav-cta{display:none}.nav{gap:18px}.nav nav{gap:22px}}
@media(min-width:761px) and (max-width:1000px){.nav .brand{font-size:18px}.nav nav{font-size:11px;gap:14px}.header-control{padding:7px 8px}.hero-grid{gap:30px}.hero-demo:before{width:330px;height:330px}.demo-heading{flex-wrap:wrap;gap:8px}.live{margin-left:0}.calculator-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid{gap:16px 10px}.form-panel,.result-panel{padding:20px}.panel-title{flex-wrap:wrap}.footer-top{grid-template-columns:1fr 1fr}.footer-note{grid-column:1/-1}.trust-inner{flex-wrap:wrap}.source-logos{gap:20px}.approach{gap:35px}html[dir=rtl] h1{font-size:38px}html[dir=rtl] .live{margin-right:0}}
@media(max-width:760px){.nav{gap:10px}.nav .brand{font-size:19px;gap:7px}.nav .brand-icon{width:30px;height:32px;font-size:25px;border-radius:9px}.header-controls{margin-inline-start:auto;gap:5px}.header-control{min-height:44px;padding:6px 9px;font-size:10px}.theme-label{display:none}.theme-symbol{font-size:21px}.mobile-toggle{padding:4px;min-height:44px;font-size:23px}.nav nav{gap:13px;max-height:calc(100dvh - 72px);overflow:auto;padding:20px}.nav nav a,.dropdown>button{min-height:44px;display:flex;align-items:center}.drop-list a{min-height:44px}.actions{flex-wrap:wrap}.hero-demo:before{max-width:90%}.float-note{max-width:calc(100% + 10px)}.calculator-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-heading .text-link{min-height:44px;display:inline-flex;align-items:center}.other-links a{min-height:44px;display:inline-flex;align-items:center}.footer-top a:not(.brand){min-height:34px;display:flex;align-items:center}.article-meta{line-height:1.8}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.unit-toggle button{min-height:40px}.panel-title{flex-wrap:wrap}.approach-items{flex-wrap:wrap}.approach-item{flex:1;min-width:100px}.demo-card{transform:rotate(-1deg)}html[dir=rtl] .nav .brand{font-size:18px}html[dir=rtl] h1{font-size:37px}html[dir=rtl] .hero-demo:before{right:20px}html[dir=rtl] .float-note{right:-11px}html[dir=rtl] .demo-card{transform:rotate(1deg)}html[dir=rtl] .drop-list{right:auto}html[dir=rtl] .page-head h1,html[dir=rtl] .prose h1{font-size:30px}.result-number{font-size:60px}.result-range{flex-wrap:wrap}}
@media(max-width:430px){.nav{gap:6px}.nav .brand{font-size:17px;gap:5px}.nav .brand-icon{width:27px;height:30px}.header-control{padding:5px 7px}.language-control{font-size:10px}.header-controls{gap:4px}.mobile-toggle{min-width:36px}.theme-symbol{font-size:20px}.demo-heading{flex-wrap:wrap;gap:9px}.live{margin-left:0}.calculator-grid{grid-template-columns:1fr}.calc-card p{min-height:0}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.section-heading{flex-wrap:wrap}.section-heading .text-link{margin-top:0}html[dir=rtl] .nav .brand{font-size:16px}html[dir=rtl] h1{font-size:33px}html[dir=rtl] .live{margin-right:0}.source-logos{gap:15px}}
@media(max-width:350px){.wrap{width:calc(100% - 28px)}.nav .brand{font-size:15px}.nav .brand-icon{width:24px;height:27px;font-size:23px}.header-control{padding:5px 6px;min-width:38px}.header-controls{gap:3px}.language-control{font-size:9px}.nav{gap:4px}html[dir=rtl] .nav .brand{font-size:15px}h1{font-size:35px}.footer-top{gap:18px}}
@media(prefers-reduced-motion:no-preference){body,header,.header-control,.hero,.calc-card,.result-panel,footer{transition:background-color .2s,color .2s,border-color .2s}}
[data-theme=dark] .btn{background:#357b66;border-color:#357b66}[data-theme=dark] .btn:hover{background:#2b6957}[data-theme=dark] .btn.secondary{background:#1d3128;border-color:#496155;color:var(--ink)}
@media(max-width:760px){.hero-demo{clip-path:inset(0 -20px -40px);padding-top:25px}}
