/* v4 page compositions (layouts_v4.py). Everything is scoped under main.lay so other pages are untouched.
   Palette: black, white, grays and one mint-green accent. */
main.lay{--l-line:#ffffff14;--l-line2:#ffffff24;--l-card:#0f1112;--l-card2:#131618;--l-mint:#0a8f5c}
main.lay .lay-flow{display:flex;flex-direction:column;gap:clamp(56px,7vw,104px);margin-top:clamp(56px,7vw,96px);min-width:0}
main.lay .lay-flow>*{margin-top:0!important;min-width:0}
main.lay .lay-main{min-width:0}
main.lay .lay-sec{scroll-margin-top:110px}
main.lay .x-head h2{max-width:22ch}

/* ---------- Hero variants and background patterns ---------- */
main.lay .lay-hero-stack{grid-template-columns:minmax(0,1fr)!important;gap:44px!important}
main.lay .lay-hero-stack h1{max-width:16ch}
main.lay .lay-hero-stack .landing-hero-copy>p{max-width:640px}
main.lay .lay-hero-stack .landing-hero-visual{max-width:960px}
main.lay .lay-hero-flip{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)!important}
main.lay .lay-hero-flip .landing-hero-copy{order:2}
main.lay .lay-pat-dots .x-grid{background-image:radial-gradient(#ffffff2e 1px,transparent 1.3px);background-size:22px 22px}
main.lay .lay-pat-lines .x-grid{background-image:repeating-linear-gradient(90deg,#ffffff0c 0 1px,transparent 1px 64px);background-size:auto}
main.lay .lay-pat-diag .x-grid{background-image:repeating-linear-gradient(135deg,#ffffff0d 0 1px,transparent 1px 18px);background-size:auto}
main.lay .lay-pat-rings .x-grid{background-image:repeating-radial-gradient(circle at 80% 30%,#ffffff0f 0 1px,transparent 1px 38px);background-size:auto}
main.lay .lay-pat-none .x-grid{background-image:none}
@media(max-width:900px){main.lay .lay-hero-flip{grid-template-columns:minmax(0,1fr)!important}main.lay .lay-hero-flip .landing-hero-copy{order:0}}

/* ---------- Tabs ---------- */
main.lay .lay-tablist{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
main.lay .lay-tab{display:flex;gap:12px;align-items:center;text-align:left;padding:16px;border-radius:14px;border:1px solid var(--l-line);background:var(--l-card);color:#aab4ae;font:500 14.5px/1.3 inherit;cursor:pointer;
 border-top:2px solid transparent;transition:border-color .2s,color .2s,background .2s}
main.lay .lay-tab small{display:block;margin-bottom:4px;font:11px 'Geist Mono',ui-monospace,monospace;letter-spacing:.1em;color:#6f7a73}
main.lay .lay-tab:hover{color:#fff;border-color:var(--l-line2)}
main.lay .lay-tab[aria-selected="true"]{color:#fff;background:var(--l-card2);border-color:var(--l-line2);border-top-color:var(--l-mint)}
main.lay .lay-tab:focus-visible{outline:2px solid var(--l-mint);outline-offset:2px}
main.lay .lay-panels{margin-top:16px;padding:clamp(20px,3.4vw,48px);border:1px solid var(--l-line);border-radius:20px;background:var(--l-card);display:flex;flex-direction:column;gap:56px}
main.lay.lay-js .lay-panel,.lay-js main.lay .lay-panel{display:none}
.lay-js main.lay .lay-panel.is-active{display:grid}
@media(max-width:860px){main.lay .lay-tablist{grid-template-columns:repeat(2,minmax(0,1fr))}main.lay .lay-tab{min-width:0}}
@media(max-width:520px){main.lay .lay-tablist{grid-template-columns:minmax(0,1fr)}}

/* ---------- Sticky nav ---------- */
main.lay .lay-sticky{display:grid;grid-template-columns:230px minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:start}
main.lay .lay-stk-nav{position:sticky;top:110px;display:flex;flex-direction:column;gap:2px;padding-left:2px}
main.lay .lay-stk-nav .x-kicker{margin-bottom:14px}
main.lay .lay-stk-nav a{display:flex;gap:12px;padding:10px 0 10px 14px;border-left:1px solid var(--l-line2);color:#8a958e;text-decoration:none;font-size:14px;line-height:1.35;transition:color .2s,border-color .2s}
main.lay .lay-stk-nav a em{font:normal 11px 'Geist Mono',ui-monospace,monospace;padding-top:3px;color:#5f6a63}
main.lay .lay-stk-nav a:hover,main.lay .lay-stk-nav a.is-on{color:#fff;border-left-color:var(--l-mint)}
main.lay .lay-stk-main{display:flex;flex-direction:column;gap:clamp(56px,6vw,88px);min-width:0}
main.lay .lay-stk.x-section{display:flex;flex-direction:column;align-items:stretch;gap:28px;padding-top:clamp(32px,4vw,56px);border-top:1px solid var(--l-line)}
main.lay .lay-stk:first-child{border-top:0;padding-top:0}
main.lay .lay-stk .x-lead{max-width:68ch}
@media(max-width:900px){main.lay .lay-sticky{grid-template-columns:minmax(0,1fr)}main.lay .lay-stk-nav{display:none}}

/* ---------- Rail ---------- */
main.lay .lay-rail-ctl{display:flex;gap:8px}
main.lay .lay-rail-ctl button{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--l-line2);background:var(--l-card);color:#fff;cursor:pointer}
main.lay .lay-rail-ctl button:hover{border-color:var(--l-mint)}
main.lay .lay-flip{transform:rotate(180deg)}
main.lay .lay-rail-track{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0}
main.lay .lay-card.x-section{min-width:0;display:flex;flex-direction:column;align-items:stretch;gap:22px;padding:20px 20px 26px;border:1px solid var(--l-line);border-radius:20px;background:var(--l-card)}
@media(max-width:760px){main.lay .lay-rail-track{grid-template-columns:minmax(0,1fr)}}
main.lay .lay-card h2{font-size:clamp(22px,2vw,28px)}
main.lay .lay-card .x-lead{font-size:15.5px}

/* ---------- Accordion ---------- */
main.lay .lay-accs{border-bottom:1px solid var(--l-line)}
main.lay .lay-acc{border-top:1px solid var(--l-line)}
main.lay .lay-acc>summary{display:flex;align-items:center;gap:18px;padding:22px 4px;cursor:pointer;list-style:none}
main.lay .lay-acc>summary::-webkit-details-marker{display:none}
main.lay .lay-acc-t{flex:1;min-width:0}
main.lay .lay-acc-t small{display:block;margin-bottom:6px;font:11px 'Geist Mono',ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#6f7a73}
main.lay .lay-acc-t strong{font-weight:500;font-size:clamp(20px,2.2vw,30px);letter-spacing:-.025em;line-height:1.15}
main.lay .lay-acc-i{color:#8a958e;transition:transform .25s}
main.lay .lay-acc[open] .lay-acc-i{transform:rotate(45deg);color:var(--l-mint)}
main.lay .lay-acc>summary:hover strong{color:var(--l-mint)}
main.lay .lay-acc>summary:focus-visible{outline:2px solid var(--l-mint);outline-offset:-2px}
main.lay .lay-acc-body.x-section{padding:8px 4px clamp(32px,4vw,56px) 4px;align-items:start}
main.lay .lay-acc-body .x-section-copy{padding-left:0}
@media(min-width:861px){main.lay .lay-acc-body.x-section{padding-left:66px}}

/* ---------- Timeline ---------- */
main.lay .lay-tl{list-style:none;margin:0;padding:0 0 0 72px;position:relative;display:flex;flex-direction:column;gap:clamp(48px,6vw,88px)}
main.lay .lay-tl::before{content:"";position:absolute;left:23px;top:8px;bottom:8px;width:1px;background:linear-gradient(#0a8f5c66,#ffffff1c 30%,#ffffff1c 80%,transparent)}
main.lay .lay-tl-i{position:relative}
main.lay .lay-tl-dot{position:absolute;left:-72px;top:0;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#0c0d10;border:1px solid #0a8f5c66;color:var(--l-mint);box-shadow:0 0 0 6px #0c0d10}
main.lay .lay-tl-sec.x-section{align-items:start}
@media(max-width:700px){main.lay .lay-tl{padding-left:46px}main.lay .lay-tl::before{left:15px}main.lay .lay-tl-dot{left:-46px;width:32px;height:32px;box-shadow:0 0 0 4px #0c0d10}main.lay .lay-tl-dot svg{width:14px;height:14px}}

/* ---------- Centered ---------- */
main.lay .lay-centered{display:flex;flex-direction:column;gap:clamp(24px,3vw,40px)}
main.lay .lay-ctr.x-section{display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(28px,3vw,44px);padding:clamp(32px,5vw,72px) clamp(18px,4vw,56px);border-radius:24px;border:1px solid var(--l-line);background:var(--l-card)}
main.lay .lay-ctr-1.x-section{background:radial-gradient(ellipse at 50% 0%,#0a8f5c12,transparent 60%),var(--l-card2)}
main.lay .lay-ctr .x-section-copy{max-width:760px;display:flex;flex-direction:column;align-items:center}
main.lay .lay-ctr h2{font-size:clamp(28px,3.4vw,48px);letter-spacing:-.035em}
main.lay .lay-ctr .x-lead{margin-left:auto;margin-right:auto}
main.lay .lay-ctr .x-more{width:100%;text-align:left}
main.lay .lay-ctr .x-more summary{justify-content:center}
main.lay .lay-ctr .x-section-visual{width:100%;max-width:940px}
main.lay .lay-3col{width:100%;grid-template-columns:repeat(3,minmax(0,1fr));text-align:left;margin:0}
main.lay .lay-3col li{flex-direction:column;gap:12px}
@media(max-width:860px){main.lay .lay-3col{grid-template-columns:minmax(0,1fr)}}

/* ---------- Pull quotes ---------- */
main.lay .lay-pulls{display:flex;flex-direction:column}
main.lay .lay-pull.x-section{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);padding:clamp(36px,5vw,72px) 0;border-top:1px solid var(--l-line);align-items:center}
main.lay .lay-pull:nth-child(even){grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
main.lay .lay-pull:nth-child(even) .lay-pull-q{order:2}
main.lay .lay-pull-q{position:relative;min-width:0}
main.lay .lay-qm{position:absolute;left:-4px;top:-46px;font:400 120px/1 Georgia,serif;color:#0a8f5c33;pointer-events:none}
main.lay .lay-pull-q blockquote{margin:0 0 26px;font-size:clamp(24px,2.7vw,38px);line-height:1.22;letter-spacing:-.032em;font-weight:450;color:#f3f6f4;position:relative;text-wrap:balance}
main.lay .lay-pull-by h2{margin:12px 0 18px;font-size:15px;font-weight:400;letter-spacing:0;color:#8a958e;max-width:none}
@media(max-width:860px){main.lay .lay-pull.x-section,main.lay .lay-pull:nth-child(even){grid-template-columns:minmax(0,1fr)}main.lay .lay-pull:nth-child(even) .lay-pull-q{order:0}}

/* ---------- Feature grid ---------- */
main.lay .lay-feats{display:flex;flex-direction:column;gap:clamp(24px,3vw,40px)}
main.lay .lay-feat.x-section{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:clamp(24px,3.4vw,48px);border:1px solid var(--l-line);border-radius:22px;background:var(--l-card)}
main.lay .lay-feat-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);align-items:center}
main.lay .lay-feat-top .x-section-visual{order:-1}
main.lay .lay-feat-cols{list-style:none;margin:clamp(28px,3vw,40px) 0 0;padding:clamp(24px,3vw,32px) 0 0;border-top:1px solid var(--l-line);display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:clamp(20px,3vw,40px)}
main.lay .lay-feat-cols li{display:flex;flex-direction:column;gap:14px}
main.lay .lay-feat-cols p{margin:0;color:#c3cbc6;font-size:15px;line-height:1.6}
@media(max-width:860px){main.lay .lay-feat-top,main.lay .lay-feat-cols{grid-template-columns:minmax(0,1fr)}main.lay .lay-feat-top .x-section-visual{order:0}}

/* ---------- Stage (figure stays put while the text scrolls) ---------- */
main.lay .lay-stage{display:flex;flex-direction:column}
main.lay .lay-stg.x-section{align-items:start;padding:clamp(40px,8vh,96px) 0;border-top:1px solid var(--l-line);min-height:70vh;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
main.lay .lay-stg:first-child{border-top:0}
main.lay .lay-stg-fig{position:sticky;top:110px}
@media(max-width:860px){main.lay .lay-stg.x-section{min-height:0;grid-template-columns:minmax(0,1fr)}main.lay .lay-stg-fig{position:static}}

/* ---------- 2x2 grid ---------- */
main.lay .lay-g22{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:18px}
main.lay .lay-gc.x-section{display:flex;flex-direction:column;align-items:stretch;gap:24px;padding:22px 22px 28px;border:1px solid var(--l-line);border-radius:22px;background:var(--l-card);grid-column:span 6}
main.lay .lay-gc-1,main.lay .lay-gc-4{grid-column:span 7!important}
main.lay .lay-gc-2,main.lay .lay-gc-3{grid-column:span 5!important}
main.lay .lay-gc h2{font-size:clamp(22px,2.1vw,30px)}
@media(max-width:960px){main.lay .lay-gc.x-section{grid-column:1/-1!important}}

/* ---------- Glance table ---------- */
main.lay .lay-gl{border-top:1px solid var(--l-line2)}
main.lay .lay-gl-row{display:grid;grid-template-columns:36px 36px minmax(0,1fr) minmax(0,1.7fr) 20px;gap:18px;align-items:center;padding:20px 8px;border-bottom:1px solid var(--l-line);color:inherit;text-decoration:none;transition:background .2s}
main.lay .lay-gl-row:hover{background:#ffffff06}
main.lay .lay-gl-n{font:12px 'Geist Mono',ui-monospace,monospace;color:#6f7a73}
main.lay .lay-gl-row strong{font-weight:500;font-size:17px;letter-spacing:-.01em}
main.lay .lay-gl-t{color:#9aa59e;font-size:14.5px;line-height:1.55}
main.lay .lay-gl-go{color:#6f7a73}
main.lay .lay-gl-row:hover .lay-gl-go{color:var(--l-mint)}
@media(max-width:760px){main.lay .lay-gl-row{grid-template-columns:32px minmax(0,1fr) 20px;gap:6px 14px}main.lay .lay-gl-n{display:none}main.lay .lay-gl-t{grid-column:2/3;grid-row:2}main.lay .lay-gl-row .x-tile{grid-row:1/3;align-self:start}main.lay .lay-gl-go{grid-row:1/3;grid-column:3}}

/* ---------- Index list ---------- */
main.lay .lay-ix{margin-top:18px;border-top:1px solid var(--l-line2)}
main.lay .lay-ix-row{display:grid;grid-template-columns:56px minmax(0,1.1fr) minmax(0,1fr) 28px;gap:24px;align-items:center;padding:clamp(20px,2.6vw,32px) 4px;border-bottom:1px solid var(--l-line);color:inherit;text-decoration:none;transition:padding .25s,background .25s}
main.lay .lay-ix-row:hover{background:linear-gradient(90deg,#0a8f5c0f,transparent);padding-left:18px}
main.lay .lay-ix-n{font:13px 'Geist Mono',ui-monospace,monospace;color:var(--l-mint)}
main.lay .lay-ix-h{font-size:clamp(22px,2.6vw,36px);letter-spacing:-.035em;line-height:1.1;font-weight:450}
main.lay .lay-ix-t{color:#9aa59e;font-size:15px;line-height:1.55}
main.lay .lay-ix-go{color:#6f7a73;transition:transform .25s,color .25s}
main.lay .lay-ix-row:hover .lay-ix-go{transform:translateX(4px);color:var(--l-mint)}
@media(max-width:760px){main.lay .lay-ix-row{grid-template-columns:36px minmax(0,1fr);gap:8px 12px}main.lay .lay-ix-t{grid-column:2}main.lay .lay-ix-go{display:none}}

/* ---------- Look for / leave out ---------- */
main.lay .lay-ls-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
main.lay .lay-ls-col{padding:clamp(22px,3vw,36px);border:1px solid var(--l-line);border-radius:20px;background:var(--l-card)}
main.lay .lay-yes{background:radial-gradient(ellipse at 0% 0%,#0a8f5c14,transparent 60%),var(--l-card);border-color:#0a8f5c33}
main.lay .lay-ls-col h3{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:20px;font-weight:500;letter-spacing:-.02em}
main.lay .lay-ls-col h3 span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--l-mint);color:#fff}
main.lay .lay-no h3 span{background:#ffffff1a;color:#cfd6d2}
main.lay .lay-ls-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
main.lay .lay-ls-col li{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-top:1px solid var(--l-line);font-size:15px;line-height:1.55;color:#cfd6d2}
main.lay .lay-ls-col li:first-child{border-top:0;padding-top:0}
main.lay .lay-ls-col li svg{margin-top:3px;color:var(--l-mint)}
main.lay .lay-no li svg{color:#8a958e}
@media(max-width:760px){main.lay .lay-ls-grid{grid-template-columns:minmax(0,1fr)}}

/* ---------- Anatomy ---------- */
main.lay .lay-anat-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
main.lay .lay-anat-rec{border:1px solid var(--l-line2);border-radius:18px;background:var(--l-card);overflow:hidden}
main.lay .lay-anat-bar{display:flex;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--l-line);background:#ffffff05;font:12px 'Geist Mono',ui-monospace,monospace;letter-spacing:.05em;color:#cfd6d2}
main.lay .lay-anat-bar em{font-style:normal;color:#6f7a73}
main.lay .lay-arow{display:grid;grid-template-columns:30px 130px minmax(0,1fr);gap:14px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--l-line);font-size:14.5px;line-height:1.45;transition:background .2s}
main.lay .lay-arow:last-child{border-bottom:0}
main.lay .lay-arow b{font:500 11.5px 'Geist Mono',ui-monospace,monospace;letter-spacing:.06em;text-transform:uppercase;color:#7d8881}
main.lay .lay-arow span:last-child{color:#e6ebe8;min-width:0;overflow-wrap:anywhere}
main.lay .lay-pin{display:inline-grid;place-items:center;flex:0 0 26px;width:26px;height:26px;border-radius:50%;border:1px solid #0a8f5c66;color:var(--l-mint);font:500 12px 'Geist Mono',ui-monospace,monospace;transition:background .2s,color .2s}
main.lay .lay-pin-off{border:0;visibility:hidden}
main.lay .lay-arow.is-pin{background:#0a8f5c08}
main.lay .is-hot.lay-arow,main.lay .lay-arow.is-hot{background:#0a8f5c1a}
main.lay .lay-arow.is-hot .lay-pin,main.lay .lay-anat-notes li.is-hot .lay-pin{background:var(--l-mint);color:#fff}
main.lay .lay-anat-notes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:n}
main.lay .lay-anat-notes a{display:flex;gap:16px;align-items:flex-start;padding:18px;border-radius:14px;border:1px solid var(--l-line);background:var(--l-card);color:inherit;text-decoration:none;transition:border-color .2s}
main.lay .lay-anat-notes li.is-hot a,main.lay .lay-anat-notes a:hover{border-color:#0a8f5c66}
main.lay .lay-anat-notes strong{display:block;font-weight:500;font-size:16px;margin-bottom:4px}
main.lay .lay-anat-notes p{margin:0;color:#9aa59e;font-size:14px;line-height:1.55}
@media(max-width:900px){main.lay .lay-anat-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:520px){main.lay .lay-arow{grid-template-columns:30px minmax(0,1fr);gap:4px 12px}main.lay .lay-arow span:last-child{grid-column:2}}

/* ---------- Sample record viewer ---------- */
main.lay .lay-vbox{position:relative;border:1px solid var(--l-line2);border-radius:20px;background:var(--l-card);overflow:hidden}
main.lay .lay-vbox>input{position:absolute;opacity:0;pointer-events:none}
main.lay .lay-vbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;border-bottom:1px solid var(--l-line);background:#ffffff05}
main.lay .lay-vtitle{display:inline-flex;align-items:center;gap:10px;font:12.5px 'Geist Mono',ui-monospace,monospace;letter-spacing:.03em;color:#cfd6d2;min-width:0}
main.lay .lay-seg{display:inline-flex;padding:3px;border-radius:10px;background:#000;border:1px solid var(--l-line2)}
main.lay .lay-seg label{padding:8px 16px;border-radius:7px;font-size:13px;color:#9aa59e;cursor:pointer;transition:background .2s,color .2s;white-space:nowrap}
main.lay .lay-seg label:first-child{background:var(--l-mint);color:#fff;font-weight:500}
main.lay .lay-vbox>input:nth-of-type(2):checked~.lay-vbar label:first-child{background:none;color:#9aa59e;font-weight:400}
main.lay .lay-vbox>input:nth-of-type(2):checked~.lay-vbar label:last-child{background:var(--l-mint);color:#fff;font-weight:500}
main.lay .lay-vbox>input:focus-visible~.lay-vbar .lay-seg{outline:2px solid var(--l-mint);outline-offset:2px}
main.lay .lay-vbody{padding:clamp(8px,2vw,20px) clamp(14px,2.4vw,28px)}
main.lay .lay-line{display:grid;grid-template-columns:minmax(140px,240px) minmax(0,1fr);gap:20px;padding:15px 0;border-bottom:1px solid var(--l-line);font-size:15px;line-height:1.6}
main.lay .lay-line:last-child{border-bottom:0}
main.lay .lay-lk{color:#7d8881;font:12.5px/1.8 'Geist Mono',ui-monospace,monospace;letter-spacing:.02em}
main.lay .lay-lv{color:#eef1ee;min-width:0;overflow-wrap:anywhere}
main.lay .lay-vbody .o{border-bottom:1px dashed #0a8f5c88;background:#0a8f5c0f}
main.lay .lay-vbody .m{padding:1px 7px;border-radius:5px;background:#000;border:1px solid #0a8f5c44;color:var(--l-mint);font:13px 'Geist Mono',ui-monospace,monospace}
main.lay .lay-vbody .m{display:none}
main.lay .lay-vbox>input:nth-of-type(2):checked~.lay-vbody .m{display:inline}
main.lay .lay-vbox>input:nth-of-type(2):checked~.lay-vbody .o{display:none}
main.lay .lay-vfoot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 28px;padding:16px clamp(14px,2.4vw,28px);border-top:1px solid var(--l-line);background:#ffffff04}
main.lay .lay-vfoot p{margin:0;font-size:13.5px;color:#9aa59e;line-height:1.55}
main.lay .lay-vfoot strong{color:#e6ebe8;font-weight:500}
main.lay .lay-vnote{font-family:'Geist Mono',ui-monospace,monospace;font-size:11.5px!important;letter-spacing:.03em;color:#6f7a73!important}
@media(max-width:600px){main.lay .lay-line{grid-template-columns:minmax(0,1fr);gap:2px}}

/* ---------- System picker ---------- */
main.lay .lay-pk-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
main.lay .lay-pk-help{margin:0 0 18px;color:#9aa59e;font-size:15px}
main.lay .lay-sys-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
main.lay .lay-sys{position:relative;display:block;cursor:pointer}
main.lay .lay-sys input{position:absolute;opacity:0;pointer-events:none}
main.lay .lay-sys-card{display:flex;align-items:center;gap:12px;padding:14px;border-radius:14px;border:1px solid var(--l-line);background:var(--l-card);font-size:14.5px;line-height:1.25;transition:border-color .2s,background .2s;height:100%;box-sizing:border-box}
main.lay .lay-sys-card>span:nth-child(2){flex:1;min-width:0}
main.lay .lay-sys img{width:32px;height:32px;object-fit:contain;border-radius:8px;background:#fff;padding:4px;flex:0 0 auto}
main.lay .lay-sys-ico{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;border:1px solid var(--l-line2);color:var(--l-mint);flex:0 0 auto}
main.lay .lay-sys .x-box{display:grid;place-items:center;flex:0 0 22px;height:22px;border-radius:7px;border:1.5px solid #ffffff38;color:transparent;transition:all .2s}
main.lay .lay-sys:hover .lay-sys-card{border-color:#0a8f5c55}
main.lay .lay-sys input:checked+.lay-sys-card{border-color:#0a8f5c99;background:#0a8f5c10}
main.lay .lay-sys input:checked+.lay-sys-card .x-box{background:var(--l-mint);border-color:var(--l-mint);color:#fff}
main.lay .lay-sys input:focus-visible+.lay-sys-card{outline:2px solid var(--l-mint);outline-offset:2px}
main.lay .lay-pk-out{position:sticky;top:110px;padding:24px;border:1px solid var(--l-line2);border-radius:18px;background:var(--l-card2)}
main.lay .lay-pk-empty{margin:14px 0 0;color:#8a958e;font-size:14.5px}
main.lay .lay-res-list{display:flex;flex-direction:column;gap:8px;margin-top:16px}
main.lay .lay-res{display:flex;align-items:center;gap:14px;padding:13px 14px;border-radius:12px;border:1px solid #0a8f5c33;background:#0a8f5c0c;color:inherit;text-decoration:none;transition:border-color .2s}
main.lay .lay-res[hidden]{display:none}
main.lay .lay-res:hover{border-color:#0a8f5c88}
main.lay .lay-res span:nth-child(2){flex:1;min-width:0}
main.lay .lay-res strong{display:block;font-weight:500;font-size:15px}
main.lay .lay-res small{color:#8a958e;font-size:12.5px}
@media(max-width:900px){main.lay .lay-pk-grid{grid-template-columns:minmax(0,1fr)}main.lay .lay-pk-out{position:static}}
@media(max-width:480px){main.lay .lay-sys-grid{grid-template-columns:repeat(2,minmax(0,1fr))}main.lay .lay-sys-card{padding:11px;gap:9px;font-size:13px}main.lay .lay-sys img,main.lay .lay-sys-ico{width:26px;height:26px}main.lay .lay-sys .x-box{display:none}}

/* ---------- Ready bar ---------- */
main.lay .x-ready.lay-ready-bar{display:flex!important;flex-direction:column;gap:28px;grid-template-columns:none}
main.lay .lay-rb-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 40px}
main.lay .lay-rb-top h2{margin:12px 0 0}
main.lay .lay-rb-score{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px}
main.lay .lay-rb-score .x-gauge{width:84px;height:84px}
main.lay .lay-rb-score .x-gauge strong{font-size:19px}
main.lay .lay-rb-score .x-gauge circle{stroke-width:12}
main.lay .lay-rb-score p{margin:0;color:#c3cbc6;max-width:30ch;min-height:0}
main.lay .lay-rb-checks{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1100px){main.lay .lay-rb-checks{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){main.lay .lay-rb-checks{grid-template-columns:minmax(0,1fr)}}

/* ---------- Process variants ---------- */
main.lay .lay-vproc{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(28px,5vw,80px);align-items:start}
main.lay .lay-vp-side{position:sticky;top:110px}
main.lay .lay-vp-side h2{margin:14px 0 12px;font-size:clamp(28px,3.2vw,44px);letter-spacing:-.035em;font-weight:500;line-height:1.08}
main.lay .lay-vp-side p{color:#9aa59e;margin:0 0 18px;max-width:34ch}
main.lay .lay-vsteps{list-style:none;margin:0;padding:0;border-top:1px solid var(--l-line2)}
main.lay .lay-vsteps li{display:grid;grid-template-columns:52px minmax(0,1fr) 28px;gap:18px;align-items:center;padding:22px 0;border-bottom:1px solid var(--l-line)}
main.lay .lay-vs-n{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid #0a8f5c55;color:var(--l-mint);font:14px 'Geist Mono',ui-monospace,monospace}
main.lay .lay-vsteps strong{display:block;font-weight:500;font-size:18px;margin-bottom:4px}
main.lay .lay-vsteps p{margin:0;color:#9aa59e;font-size:14.5px;line-height:1.55}
main.lay .lay-vs-ic{color:#6f7a73}
@media(max-width:900px){main.lay .lay-vproc{grid-template-columns:minmax(0,1fr)}main.lay .lay-vp-side{position:static}}
main.lay .lay-csteps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0}
main.lay .lay-csteps li{position:relative;padding:22px 20px 0 0;border-top:1px solid var(--l-line2)}
main.lay .lay-csteps li::before{content:"";position:absolute;left:0;top:-4px;width:7px;height:7px;border-radius:50%;background:var(--l-mint)}
main.lay .lay-cp-n{display:block;margin-bottom:14px;font:12px 'Geist Mono',ui-monospace,monospace;color:#6f7a73}
main.lay .lay-csteps strong{display:block;margin-bottom:6px;font-weight:500;font-size:16px}
main.lay .lay-csteps p{margin:0;color:#9aa59e;font-size:14px;line-height:1.55}
@media(max-width:1000px){main.lay .lay-csteps{grid-template-columns:minmax(0,1fr);gap:22px;border-left:1px solid var(--l-line2);padding-left:22px}main.lay .lay-csteps li{border-top:0;padding:0}main.lay .lay-csteps li::before{left:-26px;top:6px}}

/* ---------- Related variants ---------- */
main.lay .lay-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
main.lay .lay-chip{display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;border:1px solid var(--l-line2);color:#e6ebe8;text-decoration:none;font-size:14.5px;transition:border-color .2s,background .2s}
main.lay .lay-chip svg{color:var(--l-mint)}
main.lay .lay-chip:hover{border-color:#0a8f5c88;background:#0a8f5c10}
main.lay .lay-rel-rows{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:40px;border-top:1px solid var(--l-line2)}
main.lay .lay-rel-row{display:flex;align-items:center;gap:14px;padding:18px 4px;border-bottom:1px solid var(--l-line);color:inherit;text-decoration:none}
main.lay .lay-rel-row strong{flex:1;font-weight:500;font-size:16px}
main.lay .lay-rel-row>svg:last-child{color:#6f7a73;transition:transform .2s,color .2s}
main.lay .lay-rel-row:hover>svg:last-child{transform:translateX(4px);color:var(--l-mint)}
@media(max-width:700px){main.lay .lay-rel-rows{grid-template-columns:minmax(0,1fr)}}

/* ---------- Shared overflow guards ---------- */
main.lay .x-section-copy,main.lay .x-section-visual,main.lay .lay-sec{min-width:0}
main.lay .lay-sec .x-window{max-width:100%}
@media(prefers-reduced-motion:reduce){main.lay *{transition:none!important}}