/* Native vector illustrations for the formula and QR chapters. Colors inherit the existing site theme. */
.feature-graphic{margin:0;position:relative;isolation:isolate;overflow:hidden;border:1px solid var(--line);border-radius:18px;background:var(--surface);box-shadow:0 16px 38px -30px var(--shadow-c);color:var(--ink);}
.feature-graphic::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 15% 70%,var(--glow),transparent 70%);}
.graphic-heading{display:flex;align-items:center;gap:10px;padding:18px 22px;border-bottom:1px solid var(--line);font-size:.82rem;font-weight:600;color:var(--ink-2);}
.graphic-heading-icon{width:28px;height:28px;color:var(--accent);display:grid;place-items:center;border-radius:8px;background:var(--glow);}
.graphic-heading-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;}
.model-symbol{margin-inline-start:auto;color:var(--muted);font:italic 1.05rem Georgia,serif;}
.model-inputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:20px 22px 0;}
.model-component{position:relative;display:flex;align-items:center;flex-direction:column;text-align:center;min-width:0;padding:23px 10px 18px;border:1px solid var(--line);border-radius:12px;background:var(--bg);}
.component-number{position:absolute;top:9px;inset-inline-start:11px;font:400 .6rem var(--mono);color:var(--muted);}
.component-glyph{height:74px;width:100%;max-width:160px;display:flex;align-items:center;justify-content:center;gap:8px;direction:ltr;color:var(--accent);}
.component-glyph svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.input-glyph{position:relative;padding-bottom:25px;gap:9px;}
.input-glyph>span{width:32px;height:28px;display:grid;place-content:center;grid-auto-flow:column;align-items:baseline;gap:1px;border:1px solid var(--line);border-radius:6px;background:var(--surface);font:italic 1rem Georgia,serif;}
.input-glyph sub{font-size:.6em;position:relative;top:.35em;}
.input-glyph svg{position:absolute;bottom:0;width:118px;height:32px;}
.distribution-glyph svg{width:148px;height:72px;}
.distribution-axis{stroke:var(--line);}
.distribution-fill{fill:var(--glow);stroke:var(--accent);stroke-width:2;}
.distribution-center{stroke:var(--muted);stroke-width:.7;stroke-dasharray:3 4;}
.sensitivity-glyph{font:italic 1.65rem Georgia,serif;gap:8px;}
.sensitivity-glyph sub{font-size:.6em;}
.math-fraction{display:inline-flex;flex-direction:column;align-items:center;font-size:1.12rem;line-height:1.3;}
.math-fraction>span:first-child{border-bottom:1px solid currentColor;width:100%;text-align:center;padding:0 6px 2px;}
.math-fraction>span:last-child{padding-top:2px;}
.model-component b{display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:600;line-height:1.5;min-height:2.9em;margin-top:5px;color:var(--ink);}
.model-component p{margin:4px 0 0;font-size:.65rem;line-height:1.6;color:var(--muted);min-height:3.2em;}
.model-component :is(b,p){max-width:100%;overflow-wrap:anywhere;}
.model-connectors{height:32px;margin:0 22px;direction:ltr;}
.model-connectors svg{width:100%;height:100%;fill:none;stroke:var(--line);stroke-width:1.5;overflow:visible;}
.model-connectors circle{fill:var(--accent);stroke:var(--surface);stroke-width:2;}
.model-wire-active{stroke:var(--accent);stroke-dasharray:7 8;animation:model-wire-flow 8s linear infinite;}
.model-result{margin:0 22px 20px;border:1px solid var(--line);border-radius:12px;padding:14px 18px;background:var(--surface);position:relative;}
.model-result::before{content:"";position:absolute;top:-1px;left:28%;right:28%;height:2px;background:var(--accent);opacity:.65;}
.model-result-label{display:flex;align-items:center;gap:8px;color:var(--ink-2);font-size:.75rem;font-weight:500;}
.graphic-check{display:inline-grid;place-items:center;border:1px solid var(--line);background:var(--glow);color:var(--accent);width:22px;height:22px;border-radius:50%;font:500 .8rem var(--body);flex-shrink:0;}
.model-equation{padding:12px 0 8px;color:var(--accent);text-align:center;overflow:visible;}
.model-equation math{font-size:clamp(1.15rem,2vw,1.55rem);margin:0;min-width:0;}
.model-example{font-size:.6rem!important;color:var(--muted);text-align:center!important;margin:7px 0 0;}
:root[data-rtl] .graphic-heading,:root[data-rtl] .model-result-label{direction:rtl;}
:root[data-rtl] .model-symbol{margin-left:0;margin-right:auto;}
:root[data-rtl] .model-component :is(b,p){direction:rtl;text-align:center;}
.qr-graphic{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;min-height:340px;}
.qr-visual{position:relative;min-width:0;padding:10px 0 12px;}
.qr-art{width:100%;height:auto;display:block;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.graphic-ground{fill:var(--shadow-c);opacity:.07;}
.graphic-paper{fill:var(--surface);stroke:var(--line);stroke-width:1.5;}
.graphic-detail{fill:none;stroke:var(--muted);stroke-width:1.5;opacity:.6;}
.graphic-accent-stroke{fill:none;stroke:var(--accent);stroke-width:2;}
.graphic-seal{fill:var(--glow);stroke:var(--accent);stroke-width:1.2;}
.qr-site-line{stroke:var(--muted);stroke-width:1.2;opacity:.25;}
.qr-instrument{filter:drop-shadow(0 10px 12px rgba(0,0,0,.09));}
.qr-paper{filter:drop-shadow(0 6px 9px rgba(0,0,0,.09));}
.qr-tag{color:var(--ink-2);}
.qr-tag-string{stroke:var(--muted);stroke-width:1;}
.qr-transfer{stroke:var(--accent);stroke-width:1.5;stroke-dasharray:5 6;opacity:.65;}
.qr-travel-dot{fill:var(--accent);stroke:var(--surface);stroke-width:2;}
.phone-shadow{fill:var(--shadow-c);stroke:none;opacity:.15;}
.graphic-phone{fill:var(--bg-alt);stroke:var(--ink-2);stroke-width:2.5;}
.graphic-screen{fill:var(--bg);stroke:var(--line);stroke-width:1;}
.qr-link-node{fill:var(--surface);stroke:var(--line);stroke-width:1;}
.qr-scan-line{stroke:var(--accent);stroke-width:1.5;opacity:.6;animation:qr-scan-sweep 4.6s ease-in-out infinite;}
.qr-visual-label{display:flex;gap:8px;align-items:center;justify-content:center;font-size:.68rem;color:var(--muted);margin-top:-9px;}
.qr-visual-label .graphic-check{width:19px;height:19px;}
.qr-reach{padding:24px 26px 24px 8px;min-width:0;}
.qr-reach-title{font:600 clamp(.95rem,1.5vw,1.2rem)/1.5 var(--body);margin:0 0 22px;max-width:24ch;color:var(--ink);}
.qr-reach ul{display:grid;gap:17px;list-style:none;margin:0;padding:0;}
.qr-reach li{display:flex;align-items:center;gap:12px;color:var(--ink-2);font-size:.8rem;line-height:1.6;}
.qr-location-icon{width:38px;height:38px;flex-shrink:0;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--bg);color:var(--accent);}
.qr-location-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;}
.qr-record-types{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:24px;padding-top:18px;border-top:1px solid var(--line);font-size:.65rem;color:var(--muted);}
.qr-record-types i{color:var(--accent);font-style:normal;}
:root[data-rtl] .qr-reach{direction:rtl;padding:24px 24px 24px 8px;}
:root[data-rtl] .qr-visual-label,:root[data-rtl] .qr-record-types{direction:rtl;}
@keyframes model-wire-flow{to{stroke-dashoffset:-90;}}
@keyframes qr-scan-sweep{0%,100%{transform:translateY(0);opacity:0;}18%{opacity:.6;}72%{opacity:.6;}85%{transform:translateY(90px);opacity:0;}}
.feat[hidden] .feature-graphic *{animation-play-state:paused!important;}
@media(max-width:1199px) and (min-width:1000px){.qr-graphic{grid-template-columns:1fr;}.qr-visual{max-width:460px;margin:auto;}.qr-reach{padding:8px 20px 20px!important;}.qr-reach-title{max-width:none;text-align:center!important;margin-bottom:14px;}.qr-reach ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}.qr-reach li{flex-direction:column;text-align:center;font-size:.68rem;gap:7px;}.qr-record-types{justify-content:center;margin-top:15px;padding-top:12px;}}
@media(max-width:640px){.feature-graphic{border-radius:13px;}.graphic-heading{padding:13px 15px;font-size:.75rem;}.model-inputs{grid-template-columns:1fr;padding:15px 15px 0;gap:8px;}.model-component{display:grid;grid-template-columns:82px minmax(0,1fr);column-gap:13px;padding:16px 14px;min-height:94px;text-align:start;}.component-number{font-size:.52rem;top:5px;inset-inline-start:6px;}.component-glyph{grid-area:1/1/3/2;height:58px;width:82px;}.input-glyph{gap:4px;padding-bottom:21px;}.input-glyph>span{width:24px;height:24px;font-size:.9rem;}.input-glyph svg{width:82px;height:25px;}.distribution-glyph svg{width:82px;height:50px;}.sensitivity-glyph{font-size:1.3rem;gap:4px;}.math-fraction{font-size:.9rem;}.model-component b{grid-area:1/2;min-height:0;justify-content:start;margin:0;font-size:.76rem;text-align:start!important;}.model-component p{grid-area:2/2;min-height:0;margin-top:5px;text-align:start!important;font-size:.65rem;}.model-connectors{height:25px;margin:0 15px;}.model-result{margin:0 15px 15px;padding:12px;}.model-result-label{font-size:.68rem;}.model-equation{padding-top:12px;}.model-equation math{font-size:1.17rem;}.model-example{font-size:.55rem!important;}.qr-graphic{grid-template-columns:1fr;min-height:0;}.qr-visual{width:100%;max-width:450px;margin:auto;padding:4px 5px 12px;}.qr-visual-label{font-size:.62rem;}.qr-reach,:root[data-rtl] .qr-reach{padding:14px 17px 20px;}.qr-reach-title{max-width:none;text-align:center!important;font-size:.95rem;margin-bottom:18px;}.qr-reach ul{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}.qr-reach li{flex-direction:column;text-align:center;font-size:.62rem;gap:9px;}.qr-location-icon{width:34px;height:34px;border-radius:9px;}.qr-record-types{justify-content:center;font-size:.62rem;margin-top:19px;padding-top:13px;}}
@media(prefers-reduced-motion:reduce){.feature-graphic *{animation:none!important;}.qr-travel-dot{display:none;}}
@media(max-width:380px){.model-equation math{font-size:1rem;}}
