/* Mission explorer. All content stays readable when JavaScript is unavailable. */
#protocol{border-top:1px solid var(--edge);scroll-margin-top:70px;--mission-accent:#8aafff;}
html[data-mode="light"] #protocol{--mission-accent:#245ddd;}
#protocol .sec-head{padding-top:54px;padding-bottom:28px;}
#protocol .sec-title{font-size:clamp(22px,2.1vw,30px);}
.mission{padding:0 var(--pad) 64px;}
.mission-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:32px;}
.mission-intro h3{font-size:clamp(34px,4.3vw,66px);font-weight:400;line-height:1.08;letter-spacing:-.055em;max-width:18ch;}
.mission-intro h3 span{color:var(--ink-2);}
.mission-intro>p{max-width:30ch;font-size:15px;line-height:1.65;color:var(--ink-2);padding-bottom:4px;}
.mission-tabs{display:none;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--edge-2);}
.mission-ready .mission-tabs{display:grid;}
.mission-tab{position:relative;text-align:left;padding:17px 0 22px;color:var(--ink-2);transition:color .2s;min-height:64px;}
.mission-tab::after{content:"";position:absolute;bottom:-1px;left:0;right:20px;height:2px;background:var(--mission-accent);transform:scaleX(0);transform-origin:left;}
.mission-tab[aria-selected="true"]{color:var(--ink);}
.mission-tab[data-complete="true"]::after{transform:scaleX(1);opacity:.4;}
.mission-tab[aria-selected="true"]::before{content:"";position:absolute;bottom:-1px;left:0;right:20px;height:2px;background:var(--mission-accent);opacity:.2;}
.mission-tab[aria-selected="true"]::after{transform:scaleX(var(--mission-progress,0));}
.mission-tab:hover{color:var(--mission-accent);}
.mission-tab small{font:10px var(--mono);margin-right:16px;color:var(--mission-accent);}
.mission-tab span{font-size:clamp(14px,1.5vw,21px);letter-spacing:-.025em;}
#protocol :is(button,a,[tabindex="0"]):focus-visible{outline:2px solid var(--mission-accent);outline-offset:5px;}
.mission-stage{position:relative;display:grid;grid-template-columns:1fr 1.05fr;min-height:440px;}
.mission-panels{min-width:0;display:grid;}
.mission-panel{padding:46px 40px 36px 0;grid-area:1/1;align-self:start;}
.mission:not(.mission-ready) .mission-panels{display:block;}
.mission:not(.mission-ready) .mission-stage{grid-template-columns:1fr;}
.mission-panel[hidden]{display:none;}
.mission-ready .mission-panel{animation:mission-enter .4s ease both;}
.mission-eyebrow{display:flex;align-items:center;gap:12px;font:10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--mission-accent);}
.mission-eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.mission-panel h4{font-size:clamp(30px,3.05vw,46px);font-weight:400;line-height:1.12;letter-spacing:-.045em;margin:23px 0 18px;max-width:17ch;}
.mission-description{font-size:15px;line-height:1.7;color:var(--ink-2);max-width:43ch;}
.mission-tags{display:flex;flex-wrap:wrap;gap:8px 18px;list-style:none;margin:22px 0 30px;}
.mission-tags li{font-size:12px;color:var(--ink-2);display:flex;align-items:center;gap:7px;}
.mission-tags li::before{content:"+";color:var(--mission-accent);font-family:var(--mono);}
.mission-output{border-top:1px solid var(--edge-2);padding-top:18px;max-width:440px;}
.mission-output b{display:block;font:9px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--mission-accent);margin-bottom:8px;}
.mission-output p{font-size:14px;line-height:1.6;}
.mission-art{position:relative;min-width:0;overflow:hidden;display:none;background:radial-gradient(ellipse at 55% 48%,rgb(70 112 255 / .08),transparent 65%);}
.mission-ready .mission-art{display:block;}
.mission-art canvas{display:block;position:absolute;inset:0;width:100%;height:100%;}
.mission-art::before{content:"";position:absolute;inset:30px 0 38px 30px;border-left:1px solid var(--edge);pointer-events:none;}
.mission-art-index{position:absolute;right:0;top:18px;font-size:clamp(72px,9vw,138px);letter-spacing:-.08em;line-height:1;color:rgb(var(--ink-rgb)/.055);pointer-events:none;}
.mission-art-label{position:absolute;left:55px;bottom:30px;font:10px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);}
.mission-art-label::before{content:"↳";margin-right:12px;color:var(--mission-accent);}
.mission-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:22px;border-top:1px solid var(--edge-2);}
.mission-promise{font-size:12px;line-height:1.6;color:var(--ink-2);max-width:45ch;}
.mission-actions{display:flex;align-items:center;gap:28px;}
.mission-playback{display:none;align-items:center;gap:8px;min-height:44px;font-size:12px;color:var(--ink-2);}
.mission-ready .mission-playback{display:inline-flex;}
.mission-playback:hover{color:var(--mission-accent);}
.mission-playback [aria-hidden]{width:12px;text-align:center;font-size:15px;}
.mission-next{display:none;font-size:13px;min-height:44px;gap:18px;align-items:center;}
.mission-ready .mission-next{display:flex;}
.mission-next:disabled{visibility:hidden;}
.mission-next:hover{color:var(--mission-accent);}
.mission-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;background:var(--ink);color:var(--bg);padding:16px 23px;border-radius:4px;font-size:13px;min-height:48px;transition:background .2s,transform .2s;}
.mission-cta:hover{background:var(--mission-accent);transform:translateY(-2px);}
@keyframes mission-enter{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
@media(min-width:1500px){.mission-stage{min-height:480px;}.mission-panel{padding-top:58px;}}
@media(max-width:800px){
  #protocol .sec-head{padding-top:34px;gap:16px;}
  .mission-tabs{position:sticky;top:var(--nav-h,64px);z-index:10;background:var(--bg);}
  .mission{padding-bottom:40px;}.mission-intro{display:block;margin-bottom:27px;}.mission-intro h3{font-size:clamp(34px,7vw,52px);max-width:20ch;}.mission-intro>p{margin-top:18px;max-width:42ch;font-size:14px;}
  .mission-tab{padding:13px 0 16px;min-height:65px;}.mission-tab small{display:block;margin:0 0 8px;font-size:9px;}.mission-tab span{font-size:14px;}.mission-tab::after{right:12px;}
  .mission-stage{grid-template-columns:1fr;min-height:0;}.mission-art{grid-row:1;height:200px;margin:0 -8px;}.mission-art::before{inset:20px 8px;border-left:0;border-bottom:1px solid var(--edge);}.mission-art-index{font-size:85px;right:10px;top:14px;}.mission-art-label{left:8px;bottom:12px;font-size:9px;}
  .mission-panel{padding:22px 0 28px;}.mission-panel h4{font-size:32px;max-width:23ch;margin:15px 0 13px;}.mission-description{font-size:14px;max-width:48ch;}.mission-tags{margin:16px 0 22px;gap:7px 14px;}.mission-output{max-width:none;}.mission-output p{font-size:13px;}
  .mission-footer{flex-direction:column;align-items:stretch;gap:18px;}.mission-actions{justify-content:space-between;gap:12px;flex-wrap:wrap;}.mission-promise{max-width:none;font-size:11px;}.mission-next{font-size:12px;gap:10px;}.mission-cta{font-size:12px;padding:14px 17px;gap:16px;flex-basis:100%;}
}
@media(max-width:360px){.mission-tab span{font-size:12px;}.mission-actions{flex-wrap:wrap;}.mission-cta{flex:1;}.mission-art{height:175px;}}
@media(prefers-reduced-motion:reduce){.mission-ready .mission-panel{animation:none;}#protocol *{transition:none!important;}}
