/* fb8 (2026-10-27): protocol tabs boost, dark-theme clickable borders, workbench readability, micro-animations */

/* 1. research protocol tabs */
.rs-method-track button:nth-child(1){--c:var(--ac-orange)}.rs-method-track button:nth-child(2){--c:var(--ac-amber)}.rs-method-track button:nth-child(3){--c:var(--ac-green)}.rs-method-track button:nth-child(4){--c:var(--ac-blue)}.rs-method-track button:nth-child(5){--c:var(--ac-violet)}
.rs-method{--mc:var(--ac-orange);border-color:color-mix(in srgb,var(--mc) 45%,transparent)!important;transition:border-color .3s}
.rs-method:has([data-method="1"][aria-pressed=true]){--mc:var(--ac-amber)}.rs-method:has([data-method="2"][aria-pressed=true]){--mc:var(--ac-green)}.rs-method:has([data-method="3"][aria-pressed=true]){--mc:var(--ac-blue)}.rs-method:has([data-method="4"][aria-pressed=true]){--mc:var(--ac-violet)}
.rs-method-track{position:relative;gap:10px;padding:26px 14px 14px;--p:0}
.rs-method:has([data-method="1"][aria-pressed=true]) .rs-method-track{--p:1}.rs-method:has([data-method="2"][aria-pressed=true]) .rs-method-track{--p:2}.rs-method:has([data-method="3"][aria-pressed=true]) .rs-method-track{--p:3}.rs-method:has([data-method="4"][aria-pressed=true]) .rs-method-track{--p:4}
.rs-method-track::before,.rs-method-track::after{content:"";position:absolute;top:11px;left:calc(14px + 10%);height:3px;border-radius:2px;pointer-events:none}
.rs-method-track::before{right:calc(14px + 10%);background:color-mix(in srgb,currentColor 18%,transparent)}
.rs-method-track::after{width:calc((100% - 28px) * .8 * var(--p) / 4);background:linear-gradient(90deg,var(--ac-orange),var(--ac-amber),var(--ac-green),var(--ac-blue),var(--ac-violet));background-size:calc((100% - 28px) * .8) 100%;transition:width .45s ease}
.rs-method-track button{position:relative;border:1px solid color-mix(in srgb,var(--c) 40%,transparent)!important;border-top:3px solid var(--c)!important;border-radius:8px;min-height:120px;padding:18px 20px!important;font-size:clamp(18px,1.35vw,28px)!important;font-weight:500;line-height:1.3!important;transition:background .2s,box-shadow .2s,border-color .2s,transform .2s;background:color-mix(in srgb,var(--c) 5%,transparent)}
.rs-method-track button span{font-size:clamp(13px,.95vw,18px)!important;color:var(--c)!important;letter-spacing:.12em;margin-bottom:12px!important;display:flex!important;align-items:center;gap:8px}
.rs-method-track button span::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent)}
.rs-method-track button:hover{background:color-mix(in srgb,var(--c) 14%,transparent)!important;border-color:var(--c)!important;box-shadow:0 0 22px -6px var(--c)}
.rs-method-track button[aria-pressed=true]{background:color-mix(in srgb,var(--c) 20%,transparent)!important;border-color:var(--c)!important;box-shadow:0 0 0 1px var(--c),0 0 30px -6px var(--c)!important;color:inherit!important}
.rs-method-track button:focus-visible{outline:3px solid var(--c);outline-offset:2px}
.rs-method-note{border-top:3px solid var(--mc);box-shadow:inset 4px 0 0 var(--mc);padding:30px 34px!important;transition:border-color .3s,box-shadow .3s}
.rs-method-note .rs-mini-label{color:var(--mc)!important;font-size:clamp(13px,.95vw,18px)!important;letter-spacing:.14em}
.rs-method-note h3{font-size:clamp(28px,2.5vw,52px)!important}
.rs-method-note p{font-size:clamp(16px,1.35vw,27px)!important;max-width:1300px!important}
.rs-method-ghost{font-size:11px!important;border-left-color:color-mix(in srgb,var(--mc) 50%,transparent)!important}
@media (prefers-reduced-motion:no-preference){.rs-method-track button[aria-pressed=true] span::before{animation:fb8pulse 2.2s ease-in-out infinite}.rs-method-track button:hover{transform:translateY(-2px)}}
.metric-grid>div:nth-child(1){--c:var(--ac-blue)}.metric-grid>div:nth-child(2){--c:var(--ac-violet)}.metric-grid>div:nth-child(3){--c:var(--ac-teal)}.metric-grid>div:nth-child(4){--c:var(--ac-green)}
.metric-grid>div{box-shadow:inset 0 3px 0 var(--c);position:relative}
.metric-grid span{color:var(--c)!important;font-size:clamp(13px,.95vw,18px)!important}
.metric-grid h3{font-size:clamp(24px,2vw,40px)!important;margin:26px 0 18px!important}
.metric-grid p{font-size:clamp(15.5px,1.25vw,24px)!important}
@media(max-width:930px){.rs-method-track{grid-template-columns:repeat(2,minmax(0,1fr))!important}.rs-method-track::before,.rs-method-track::after{display:none}.rs-method-track{padding-top:14px}}
@media(max-width:600px){.rs-method-track{grid-template-columns:1fr!important}.rs-method-track button{min-height:0}.rs-method-note{grid-template-columns:1fr!important;padding:22px!important}}

/* 3. workbench readability */
.rs-experiment span{font-size:clamp(12px,.85vw,16px)!important}
.rs-experiment strong{font-size:clamp(20px,1.75vw,34px)!important}
.rs-experiment small{font-size:clamp(14px,1.15vw,22px)!important}
.rs-screen-graphic svg{max-height:min(560px,58vh)!important}
.rsv-diagram text{font-size:18px}.rsv-diagram text.rsv-sub{font-size:16px}.rsv-diagram text.rsv-loop{font-size:14px}
.rs-readout h3{font-size:clamp(28px,2.6vw,54px)!important}
.rs-readout>p{font-size:clamp(16px,1.35vw,27px)!important;max-width:1200px!important}
.rs-readout-grid b,.rs-falsifier b{font-size:clamp(12px,.85vw,16px)!important}
.rs-readout-grid span,.rs-falsifier span{font-size:clamp(15px,1.25vw,24px)!important}
.rs-readout .rs-falsifier,.rs-falsifier{padding:12px 0 12px 18px!important;border-left:3px solid var(--accent-danger)}
@media(max-width:600px){.rs-experiment strong{font-size:17px!important}.rs-experiment small{font-size:13px!important}}

/* 2. dark theme: visible borders on clickables */
html[data-theme=dark] :is(.rs-experiment,.rs-method-track button,.rs-review-options button,.research-card,.mv-tabs button,.mv-ptab,.mv-seg label,.mv-ctl button,.mv-why-t,.atlas-btn-ghost,.lab-req button,.lab-prov button,.lab-st,.lab-cnav button,.lab-lp,.contact-form .button,form .button,.theme-switch button){border:1px solid rgba(255,255,255,.26)!important;transition:border-color .2s,box-shadow .2s}
html[data-theme=dark] :is(.rs-experiment,.rs-method-track button,.rs-review-options button,.research-card,.mv-tabs button,.mv-ptab,.mv-seg label,.mv-ctl button,.mv-why-t,.atlas-btn-ghost,.lab-req button,.lab-prov button,.lab-st,.lab-cnav button,.lab-lp,form .button,.theme-switch button):is(:hover,:focus-visible,[aria-pressed=true],[aria-selected=true],[aria-current=true],:has(input:checked)){border-color:var(--c,var(--ac-blue))!important;box-shadow:0 0 0 1px var(--c,var(--ac-blue)),0 0 18px -6px var(--c,var(--ac-blue))}
html[data-theme=dark] .rs-method-track button{border-top-width:3px!important;border-top-color:var(--c)!important}
html[data-theme=dark] :is(.pg-card,.metric-grid,.metric-grid>div,.rs-method,.rs-workbench,.mv-card){border-color:rgba(255,255,255,.2)!important}
html[data-theme=dark] .research-card{--c:var(--ac-teal)}html[data-theme=dark] .research-card:nth-child(2){--c:var(--ac-violet)}html[data-theme=dark] .research-card:nth-child(3){--c:var(--ac-pink)}
html[data-theme=dark] .mv-why-t{border:0!important;box-shadow:none!important;text-decoration:underline}

/* 4. micro-animations */
.pg-cards>.pg-card{position:relative;transition:transform .25s ease,box-shadow .25s ease}
.pg-cards>.pg-card::after{content:"";position:absolute;top:clamp(18px,1.4vw,28px);right:clamp(16px,1.3vw,26px);width:36px;height:8px;pointer-events:none;background:radial-gradient(circle,var(--c,currentColor) 0 2.6px,transparent 3.1px) 0 50%/12px 8px repeat-x;-webkit-mask:linear-gradient(90deg,rgba(0,0,0,.25) 0 35%,#000 45% 55%,rgba(0,0,0,.25) 65%) 100% 0/300% 100%;mask:linear-gradient(90deg,rgba(0,0,0,.25) 0 35%,#000 45% 55%,rgba(0,0,0,.25) 65%) 100% 0/300% 100%}
.pg-steps li b::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:10px;vertical-align:.12em;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 22%,transparent)}
.metric-grid>div::after{content:"";position:absolute;top:31px;right:25px;width:36px;height:8px;background:radial-gradient(circle,var(--c) 0 2.6px,transparent 3.1px) 0 50%/12px 8px repeat-x;-webkit-mask:linear-gradient(90deg,rgba(0,0,0,.25) 0 35%,#000 45% 55%,rgba(0,0,0,.25) 65%) 100% 0/300% 100%;mask:linear-gradient(90deg,rgba(0,0,0,.25) 0 35%,#000 45% 55%,rgba(0,0,0,.25) 65%) 100% 0/300% 100%}
@media (prefers-reduced-motion:no-preference){
 .pg-cards>.pg-card::after,.metric-grid>div::after{animation:fb8dots 2.6s linear infinite}
 .pg-cards>.pg-card:nth-child(2)::after,.metric-grid>div:nth-child(2)::after{animation-delay:-.65s}.pg-cards>.pg-card:nth-child(3)::after,.metric-grid>div:nth-child(3)::after{animation-delay:-1.3s}.pg-cards>.pg-card:nth-child(4)::after,.metric-grid>div:nth-child(4)::after{animation-delay:-1.95s}
 .pg-cards>.pg-card:hover{transform:translateY(-3px);box-shadow:inset 0 3px 0 var(--c),0 12px 28px -14px var(--c)!important}
 .pg-steps li:first-child b::before{animation:fb8pulse 2.4s ease-in-out infinite}
 .pg-steps li:nth-child(2) b::before{animation:fb8blink 3s ease-in-out infinite}
}
@keyframes fb8dots{to{-webkit-mask-position:0 0;mask-position:0 0}}
@keyframes fb8pulse{0%,100%{box-shadow:0 0 0 3px color-mix(in srgb,var(--c,currentColor) 22%,transparent)}50%{box-shadow:0 0 0 7px color-mix(in srgb,var(--c,currentColor) 0%,transparent),0 0 12px var(--c,currentColor)}}
@keyframes fb8blink{0%,100%{opacity:1}50%{opacity:.35}}
/* fb8b: dark node fills in every theme */
.rsv-diagram .rsv-node rect,.rs-review-result svg rect{fill:color-mix(in srgb,var(--c,#888) 9%,#0a0f3a)!important}
html[data-theme=dark] :is(.rsv-diagram .rsv-node rect,.rs-review-result svg rect){fill:color-mix(in srgb,var(--c,#888) 9%,#0b0b0d)!important}
.rsv-diagram .rsv-node text.rsv-sub,.rs-review-result svg text{fill:#c9ccd6!important}
.rsv-diagram .rsv-node text:not(.rsv-sub){fill:var(--c)!important}