@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&family=Newsreader:opsz,wght@6..72,500;6..72,600&family=Vazirmatn:wght@400;500;600;700&display=swap");

:root{
  --black:#f3f0e8;
  --ink:#092d35;
  --ash:#536c70;
  --line:#bcc8c3;
  --grid:#0b5f640d;
  --lime:#0c8e80;
  --orange:#c02c67;
  --sky:#126fad;
  --danger:#a8114d;
  --paper:#f3f0e8;
  --paper-high:#fffdf7;
  --recorder:#092d35;
  --recorder-soft:#103d45;
  --teal:#0c8e80;
  --teal-light:#61c3c0;
  --blue:#126fad;
  --magenta:#c02c67;
  --shadow:#183f4930;
  --sans:"IBM Plex Sans","Noto Sans",sans-serif;
  --display:"Newsreader","Iowan Old Style",Georgia,serif;
  --mono:"IBM Plex Mono","Cascadia Mono",monospace;
  --max:1500px;
  --header:88px;
  color-scheme:light;
}

html{background:var(--paper)}
body{
  background:
    radial-gradient(circle at 78% 12%,#d9eeea 0,transparent 24rem),
    radial-gradient(circle at 8% 74%,#f4dce6 0,transparent 22rem),
    var(--paper);
  color:var(--ink);
  font-family:var(--sans);
}
body::before{
  background:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:38px 38px;
  opacity:.72;
  mask-image:linear-gradient(to bottom,#000 0,transparent 72%);
}
body::after{
  content:"";
  position:fixed;
  inset:0 auto 0 clamp(18px,4vw,68px);
  width:1px;
  background:linear-gradient(transparent,var(--magenta) 18%,var(--magenta) 82%,transparent);
  opacity:.22;
  pointer-events:none;
  z-index:1;
}
body[data-lang="fa"]{font-family:"Vazirmatn",sans-serif}
#trace-canvas{opacity:.55;mix-blend-mode:multiply}
::selection{background:var(--magenta);color:var(--paper-high)}
a,button{transition:color .18s,border-color .18s,background-color .18s,transform .18s}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--magenta);
  outline-offset:3px;
}
.skip-link{background:var(--recorder);color:var(--paper-high);font:12px var(--mono)}

.site-header{
  height:var(--header);
  padding:0 clamp(18px,3.4vw,54px);
  background:#f3f0e8ed;
  border-color:var(--line);
  backdrop-filter:blur(16px) saturate(1.2);
}
.site-header::after{
  content:"";
  position:absolute;
  right:0;
  bottom:-1px;
  width:28%;
  height:3px;
  background:linear-gradient(90deg,transparent,var(--blue) 40%,var(--magenta));
}
.brand{gap:11px;color:var(--ink);font:600 17px/1 var(--display);letter-spacing:.13em}
.brand img{width:44px;height:44px;filter:drop-shadow(0 7px 8px #163d4826)}
.brand span::after{content:"";color:var(--magenta)}
.header-meta{flex:1;justify-content:flex-end;gap:20px;color:var(--blue)}
.system-status{color:var(--teal);letter-spacing:.08em;white-space:nowrap}
.system-status i{width:8px;height:8px;background:var(--teal);box-shadow:0 0 0 5px #0c8e801c}
.quick-links{
  flex-wrap:nowrap;
  gap:0;
  overflow-x:auto;
  scrollbar-width:none;
  max-width:min(64vw,900px);
  border-inline:1px solid var(--line);
}
.quick-links::-webkit-scrollbar{display:none}
.quick-links a{
  flex:0 0 auto;
  color:var(--ash);
  border:0;
  border-inline-end:1px solid var(--line);
  padding:7px 12px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.quick-links a:hover{background:var(--ink);color:var(--paper-high);border-color:var(--ink)}
.language-toggle{border:0;border-bottom:1px solid var(--ink);color:var(--ink);padding:8px 2px}
.language-toggle b{color:var(--magenta)}

.opr-release-strip{
  width:min(var(--max),100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:.58fr 1.22fr .95fr auto;
  align-items:stretch;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--ink);
  background:var(--ink);
  color:var(--paper-high);
}
.opr-release-index,
.opr-release-copy,
.opr-release-facts,
.opr-release-link{padding:clamp(24px,3vw,48px)}
.opr-release-index{border-inline-end:1px solid #ffffff2a}
.opr-release-index span{display:block;color:var(--teal-light);font:9px var(--mono);letter-spacing:.13em}
.opr-release-index b{display:block;margin-top:50px;color:var(--paper-high);font:500 clamp(28px,3.2vw,52px)/.88 var(--display);letter-spacing:-.035em}
.opr-release-copy{border-inline-end:1px solid #ffffff2a}
.opr-release-copy p{max-width:62ch;color:#d4dedb;font-size:13px;line-height:1.7}
.opr-release-copy h2{margin:42px 0 0;color:var(--teal-light);font:500 clamp(31px,3.3vw,54px)/.92 var(--display);letter-spacing:-.035em}
.opr-release-facts{display:grid;align-content:center;gap:12px;border-inline-end:1px solid #ffffff2a}
.opr-release-facts span{display:flex;justify-content:space-between;gap:18px;padding-bottom:9px;border-bottom:1px solid #ffffff20;color:#b9c7c4;font:9px var(--mono);letter-spacing:.06em}
.opr-release-facts b{color:var(--paper-high);font-weight:600}
.opr-release-link{
  min-width:170px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:var(--ink);
  background:var(--teal-light);
  text-decoration:none;
  font:600 10px var(--mono);
  letter-spacing:.08em;
}
.opr-release-link:hover{background:var(--paper-high)}
.opr-release-link i{align-self:flex-end;font:normal 34px var(--display)}

main{isolation:isolate}
.hero{
  position:relative;
  padding:clamp(54px,7vw,108px) clamp(18px,3.4vw,54px) 82px;
  grid-template-columns:minmax(310px,1.03fr) minmax(480px,.97fr);
  gap:clamp(26px,4vw,70px);
  min-height:calc(100svh - var(--header));
  align-items:center;
}
.hero::before{
  content:"FIELD / 001";
  position:absolute;
  inset:25px auto auto clamp(18px,3.4vw,54px);
  color:var(--magenta);
  font:10px var(--mono);
  letter-spacing:.16em;
}
.hero-copy{padding-top:18px;position:relative;z-index:4}
.hero-copy,.continuity-stage{min-width:0}
.eyebrow{color:var(--teal);font:500 11px var(--mono);letter-spacing:.15em}
.signal-dot{background:var(--magenta);border-radius:0;box-shadow:6px 6px 0 #c02c6720;transform:rotate(45deg)}
h1{
  color:var(--ink);
  font-family:var(--display);
  font-size:clamp(66px,7.4vw,122px);
  font-weight:500;
  line-height:.82;
  letter-spacing:-.064em;
  max-width:9ch;
  margin-bottom:28px;
}
h1 em{
  color:var(--teal);
  font-style:italic;
  position:relative;
  white-space:nowrap;
}
h1 em::after{
  content:"";
  position:absolute;
  left:.03em;
  right:-.12em;
  bottom:.05em;
  height:.07em;
  background:linear-gradient(90deg,var(--teal),var(--blue),var(--magenta));
  transform:skewX(-24deg);
}
.hero-deck{color:var(--ash);font-size:clamp(17px,1.6vw,21px);line-height:1.62;max-width:53ch}
.hero-actions{margin-top:34px;gap:0;align-items:stretch}
.action{
  min-width:0;
  height:58px;
  padding:0 17px;
  border-color:var(--ink);
  backdrop-filter:none;
  font:500 10px var(--mono);
  letter-spacing:.06em;
  text-transform:uppercase;
}
.action.primary{background:var(--ink);color:var(--paper-high);border-color:var(--ink);min-width:215px}
.action.primary i{color:var(--teal-light);font-size:18px}
.action.secondary{background:#fffdf780;color:var(--ink);border-inline-start:0}
.action:hover,.action:focus-visible{transform:translateY(-4px);box-shadow:0 4px 0 var(--magenta)}

.continuity-stage{position:relative;min-height:730px;display:grid;align-items:end}
.brand-orbit{
  position:absolute;
  top:-36px;
  right:-16px;
  width:min(78%,430px);
  aspect-ratio:1;
  z-index:0;
}
.brand-orbit::before{
  content:"";
  position:absolute;
  inset:23%;
  border:1px dashed #0b656650;
  border-radius:50%;
  background:#f3f0e8b8;
}
.brand-orbit img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 28px 24px #183f4924)}
.orbit-label{
  position:absolute;
  padding:4px 7px;
  background:var(--paper-high);
  border:1px solid var(--line);
  font:9px var(--mono);
  letter-spacing:.08em;
  box-shadow:5px 5px 0 #173f4814;
}
.orbit-label.authority{left:-11%;top:58%;color:var(--magenta)}
.orbit-label.runtime{right:-5%;top:59%;color:var(--blue)}
.orbit-label.evidence{top:1%;left:37%;color:var(--teal)}
.mission-core{
  position:absolute;
  inset:44% auto auto 48%;
  transform:translate(-50%,-50%);
  text-align:center;
  color:var(--ink);
  font:600 9px/1.5 var(--mono);
  letter-spacing:.16em;
}
.state-capsule{
  z-index:2;
  width:94%;
  margin:184px 0 0 auto;
  min-height:510px;
  padding:22px;
  color:var(--paper-high);
  background:
    linear-gradient(120deg,#123f47 0,#092d35 48%,#061f26 100%);
  border:1px solid #32565c;
  clip-path:polygon(0 0,94% 0,100% 7%,100% 100%,6% 100%,0 94%);
  box-shadow:18px 20px 0 #126fad26,34px 40px 80px #153b4538;
}
.state-capsule::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(115deg,transparent 0 67%,#0c8e8014 67% 68%,transparent 68%);
}
.state-capsule > header{color:var(--teal-light);border-bottom:1px solid #ffffff20;padding-bottom:12px}
.scope-stack{gap:7px}
.scope-rail{
  border-color:#ffffff21;
  background:#061f2666;
  color:var(--paper-high);
  clip-path:polygon(0 0,98% 0,100% 30%,100% 100%,0 100%);
}
.scope-rail span{color:#ec7fac}
.scope-rail b{color:var(--paper-high)}
.scope-rail small{color:#b7c8c6}
.scope-rail:hover{border-color:var(--teal-light);transform:translateX(4px)}
.scope-rail.active{border-color:var(--teal-light);background:#0c8e8024;box-shadow:inset 4px 0 0 var(--teal-light)}
.runtime-chip{background:#061f26a8;border-color:#ffffff26}
.runtime-chip b{color:var(--paper-high)}
.runtime-chip span{color:#ec7fac}
.runtime-chip.source{border-color:#4e9bc4}
.runtime-chip.target{border-color:#ec7fac}
.resolver-stroke{background:linear-gradient(to bottom,transparent,var(--teal-light),transparent)}
.fingerprint-line{background:#061f26;border-color:var(--teal-light)}
.fingerprint-line span{color:#b7c8c6}
.fingerprint-line code{color:var(--paper-high)}
.fingerprint-line strong{color:var(--teal-light)}
.fingerprint-line strong i{background:var(--teal-light)}
.scope-readout{background:#061f26;border-color:#ffffff24}
.scope-readout span{color:var(--teal-light)}
.scope-readout p{color:#c4d1cf}

.evidence-strip{
  max-width:var(--max);
  padding:0 clamp(18px,3.4vw,54px);
  grid-template-columns:1.25fr .85fr 1.1fr .8fr;
  border:0;
  align-items:start;
}
.evidence-strip article>span small{
  display:block;
  margin-top:5px;
  color:var(--ash);
  font:8px var(--mono);
  letter-spacing:.08em;
}
.evidence-strip article{
  min-height:158px;
  padding:24px 18px;
  border:1px solid var(--line);
  border-inline-end:0;
  background:#fffdf790;
  position:relative;
}
.evidence-strip article:last-child{border-inline-end:1px solid var(--line)}
.evidence-strip article:nth-child(2),.evidence-strip article:nth-child(4){margin-top:24px}
.evidence-strip article::before{content:attr(data-index);position:absolute;right:12px;top:8px;color:#0c8e8038;font:50px var(--display)}
.evidence-strip span{color:var(--magenta)}
.evidence-strip b{color:var(--ink);font-family:var(--display);font-size:54px}
.evidence-strip sup{color:var(--teal)}

.trio-block{
  padding:110px clamp(18px,3.4vw,54px) 0;
  grid-template-columns:1.2fr .8fr;
  gap:0;
  align-items:start;
}
.trio-card{
  min-height:0;
  padding:34px;
  border-color:var(--line);
  background:#fffdf79c;
  gap:18px;
  position:relative;
}
.trio-card span{color:var(--magenta)}
.trio-card h2{font-family:var(--display);font-weight:500;font-size:clamp(38px,4.3vw,68px);line-height:.94;max-width:13ch;color:var(--ink)}
.trio-card p{color:var(--ash);font-size:16px;max-width:50ch}
.trio-card:first-child{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:.4fr 1fr .8fr;
  align-items:end;
  border-bottom:0;
}
.trio-card:nth-child(2){margin-right:clamp(30px,8vw,130px);background:var(--recorder);color:var(--paper-high);border-color:var(--recorder)}
.trio-card:nth-child(2) h2{color:var(--paper-high)}
.trio-card:nth-child(2) p{color:#bfd0cd}
.trio-card:nth-child(3){margin-top:66px;margin-left:-80px;border-left:5px solid var(--blue)}

.protocol-band{padding:110px clamp(18px,3.4vw,54px);border-color:var(--line);gap:44px}
.protocol-head h2{font-family:var(--display);font-weight:500;color:var(--ink);font-size:clamp(48px,6vw,92px);max-width:16ch}
.protocol-head h2 span{color:var(--blue);margin-left:14%;font-style:italic}
.protocol-map{
  grid-template-columns:1.3fr .7fr 1.05fr .95fr;
  gap:12px;
  background:transparent;
  align-items:start;
}
.protocol-map div{
  min-height:118px;
  padding:19px;
  background:transparent;
  border:1px solid var(--line);
  border-top:4px solid var(--teal);
  position:relative;
}
.protocol-map div:nth-child(2){margin-top:42px;border-top-color:var(--magenta)}
.protocol-map div:nth-child(3){margin-top:15px;border-top-color:var(--blue)}
.protocol-map div:nth-child(4){margin-top:64px;border-top-color:var(--ink)}
.protocol-map div::after{
  content:"";
  position:absolute;
  right:-13px;
  top:50%;
  width:12px;
  border-top:1px dashed var(--ash);
}
.protocol-map div:last-child::after{display:none}
.protocol-map span{font:600 16px var(--mono);color:var(--ink)}
.protocol-map small{color:var(--ash);font-family:var(--mono)}
.completion-receipt{
  width:88%;
  margin-left:auto;
  padding:28px;
  background:var(--recorder);
  color:var(--paper-high);
  border:0;
  box-shadow:-16px 16px 0 var(--teal),-31px 31px 0 #126fad25;
  clip-path:polygon(0 0,96% 0,100% 10%,100% 100%,4% 100%,0 90%);
}
.completion-receipt header{border-color:#ffffff36}
.completion-receipt code{color:var(--paper-high)}
.completion-receipt span{color:#ec7fac}
.completion-receipt b.ok{color:#8de0d8;background:#0c8e8020;border-color:#61c3c05c}
.completion-receipt b.warn{color:#f18db4;background:#c02c6717;border-color:#c02c6755}

.access-call{
  padding:52px clamp(18px,3.4vw,54px);
  margin-bottom:80px;
  background:linear-gradient(108deg,var(--teal),#08766f);
  color:var(--paper-high);
  grid-template-columns:1.2fr .8fr;
  clip-path:polygon(0 0,96% 0,100% 17%,100% 100%,4% 100%,0 82%);
}
.access-call p{color:#effaf7;font-size:18px}
.manifest-launch{
  min-width:0;
  width:100%;
  background:var(--paper-high);
  color:var(--ink);
  border:0;
  box-shadow:10px 10px 0 var(--magenta);
}
.manifest-launch:hover{transform:translate(-4px,-4px);box-shadow:14px 14px 0 var(--magenta)}

footer{
  min-height:106px;
  height:auto;
  padding:22px clamp(18px,3.4vw,54px);
  border-color:var(--line);
  color:var(--ash);
}
footer img{width:40px;height:40px}
footer b{font-family:var(--display);letter-spacing:.12em;color:var(--ink)}
.footer-links a{color:var(--blue);border-bottom:1px solid transparent}
.footer-links a:hover{color:var(--magenta);border-color:var(--magenta)}

.doc-main{padding:84px clamp(18px,5vw,76px) 110px;gap:28px}
.doc-main::before{
  content:"PORTABLE / GOVERNED / VERIFIED";
  color:var(--magenta);
  font:10px var(--mono);
  letter-spacing:.16em;
}
.doc-panel{
  padding:clamp(28px,5vw,76px);
  border-color:var(--line);
  background:#fffdf7b8;
  clip-path:polygon(0 0,97% 0,100% 11%,100% 100%,0 100%);
}
.doc-panel:first-of-type{border-top:6px solid var(--teal)}
.doc-panel h1{
  color:var(--ink);
  font-family:var(--display);
  font-weight:500;
  font-size:clamp(52px,7vw,104px);
  line-height:.88;
  letter-spacing:-.045em;
  max-width:13ch;
}
.doc-panel p{color:var(--ash);font-size:18px;max-width:72ch}
.doc-grid{grid-template-columns:1.15fr .85fr;gap:20px;align-items:start}
.doc-card{
  padding:clamp(24px,3vw,42px);
  border-color:var(--line);
  background:#fffdf7a6;
  gap:16px;
}
.doc-card:nth-child(even){margin-top:48px;background:var(--recorder);color:var(--paper-high);border-color:var(--recorder)}
.doc-card h2{font-family:var(--display);font-weight:500;font-size:clamp(34px,4vw,55px);color:var(--teal);line-height:.95}
.doc-card:nth-child(even) h2{color:var(--teal-light)}
.doc-card h3{font-family:var(--display);font-size:28px;color:var(--blue)}
.doc-card p,.doc-card li{line-height:1.75}
.doc-card:nth-child(even) p,.doc-card:nth-child(even) li{color:#c6d3d1}
.doc-code{background:#061f26;border-color:#31545a;box-shadow:10px 10px 0 #126fad33}
.doc-code code{color:#eaf3ef}
.doc-form label{color:var(--teal)}
.doc-form input,.doc-form textarea,.doc-form select{
  background:var(--paper-high);
  border-color:var(--line);
  color:var(--ink);
  font-family:var(--sans);
}
.doc-form button{background:var(--magenta);color:var(--paper-high);border:0;box-shadow:7px 7px 0 #7e1238}
.doc-cta a,.doc-cta button{border-color:var(--ink);background:transparent;color:var(--ink);font:500 10px var(--mono);text-transform:uppercase}
.doc-cta a:hover{background:var(--ink);color:var(--paper-high);border-color:var(--ink)}

dialog{
  border:0;
  background:var(--recorder);
  color:var(--paper-high);
  box-shadow:20px 20px 0 var(--magenta);
  clip-path:polygon(0 0,97% 0,100% 5%,100% 100%,3% 100%,0 95%);
}
dialog::backdrop{background:#092d35ad;backdrop-filter:blur(7px)}
.manifest-shell header{border-color:#ffffff2e}
.dialog-close{border-color:#ffffff38;color:var(--paper-high)}
.manifest-grid{background:#ffffff24;border-color:#ffffff24}
fieldset button{border-color:#ffffff2c;color:var(--paper-high)}
fieldset button.selected,#copy-manifest{background:var(--teal-light);color:var(--ink);border-color:var(--teal-light)}
.manifest-output{background:#061f26;border-color:var(--teal-light)}
.contact-line input{color:var(--paper-high);border-color:#ffffff38}
.manifest-actions button{border-color:#ffffff35;color:var(--paper-high)}

@media (max-width:1240px){
  .system-status{display:none}
  .hero{grid-template-columns:minmax(280px,.9fr) minmax(440px,1.1fr)}
  .brand-orbit{width:390px}
}
@media (max-width:980px){
  .hero{grid-template-columns:1fr;padding-top:76px}
  .hero-copy{max-width:760px}
  h1{max-width:10ch}
  .continuity-stage{min-height:690px}
  .brand-orbit{right:4%;width:360px}
  .state-capsule{width:86%;margin-top:160px}
  .trio-card:first-child{grid-template-columns:1fr}
  .trio-card:nth-child(2){margin-right:60px}
  .trio-card:nth-child(3){margin-left:-45px}
  .protocol-map{grid-template-columns:1fr 1fr}
  .protocol-map div:nth-child(n){margin-top:0}
  .protocol-map div::after{display:none}
  .completion-receipt{width:92%}
}
@media (max-width:720px){
  :root{--header:74px}
  body::after{left:12px}
  .site-header{padding:0 14px}
  .brand img{width:38px;height:38px}
  .header-meta{display:flex;flex:0 0 auto}
  .header-meta .quick-links,.header-meta .system-status{display:none}
  .hero{padding:58px 14px 62px;min-height:0}
  .hero::before{left:14px;top:20px}
  h1{font-size:clamp(54px,16vw,74px);max-width:100%}
  h1 em{display:block;white-space:normal}
  .hero-deck{font-size:17px}
  .hero-actions{display:grid}
  .action{border-inline-start:1px solid var(--ink)!important}
  .continuity-stage{min-height:720px}
  .brand-orbit{width:290px;max-width:calc(100% - 24px);right:50%;transform:translateX(50%);top:8px}
  .orbit-label{font-size:8px}
  .orbit-label.authority{left:0}
  .orbit-label.runtime{right:0}
  .state-capsule{width:100%;margin-top:205px;padding:15px;box-shadow:9px 11px 0 #126fad26}
  .scope-rail:hover{transform:none}
  .evidence-strip{grid-template-columns:1fr 1fr;padding:0 14px}
  .evidence-strip article:nth-child(n){margin:0;border:1px solid var(--line)}
  .trio-block{grid-template-columns:1fr;padding:80px 14px 0}
  .trio-card:first-child{grid-column:auto}
  .trio-card:nth-child(n){margin:0}
  .trio-card:nth-child(3){border-left:1px solid var(--line);border-top:5px solid var(--blue)}
  .protocol-band{padding:80px 14px}
  .protocol-head h2 span{margin-left:0}
  .protocol-map{grid-template-columns:1fr}
  .completion-receipt{width:calc(100% - 12px);padding:20px;box-shadow:-10px 10px 0 var(--teal)}
  .access-call{margin:0 0 60px;padding:38px 24px;grid-template-columns:1fr;clip-path:none}
  footer{align-items:flex-start;gap:18px;flex-direction:column;padding-block:28px}
  .footer-links{justify-content:flex-start}
  .doc-main{padding:54px 14px 80px}
  .doc-panel{padding:28px 20px;clip-path:none}
  .doc-panel h1{font-size:clamp(48px,15vw,72px)}
  .doc-grid{grid-template-columns:1fr}
  .doc-card:nth-child(even){margin-top:0}
  .manifest-shell{padding:18px}
}
@media (max-width:440px){
  .brand span{font-size:14px}
  .evidence-strip{grid-template-columns:1fr}
  .continuity-stage{min-height:760px}
  .runtime-chip b{font-size:17px}
  .fingerprint-line{grid-template-columns:1fr}
  .protocol-head h2{font-size:45px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
  #trace-canvas{display:none}
}

/* Continuity field v2: exact mark, legible mission field, and live state transfer. */
.continuity-stage{
  display:grid!important;
  grid-template-rows:minmax(410px,auto) auto;
  align-content:start;
  min-width:0;
  overflow:visible!important;
}
.brand-orbit{
  position:relative!important;
  inset:auto!important;
  width:min(100%,680px)!important;
  min-height:430px;
  margin:-2.5rem 0 1.25rem auto!important;
  opacity:1!important;
  transform:none!important;
  isolation:isolate;
}
.brand-orbit-frame{
  position:relative;
  width:min(94%,560px);
  aspect-ratio:1929/1963;
  margin-left:auto;
}
.brand-orbit-frame::before,.brand-orbit-frame::after{
  content:"";
  position:absolute;
  z-index:-2;
  pointer-events:none;
}
.brand-orbit-frame::before{
  inset:4% -7% -3% 10%;
  background:
    linear-gradient(90deg,rgba(9,45,53,.12) 1px,transparent 1px),
    linear-gradient(rgba(9,45,53,.1) 1px,transparent 1px);
  background-size:32px 32px;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 15%,transparent 72%);
  mask-image:radial-gradient(circle at 50% 50%,#000 15%,transparent 72%);
}
.brand-orbit-frame::after{
  width:54%;
  aspect-ratio:1;
  left:24%;
  top:23%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(243,240,232,.98) 0 44%,rgba(243,240,232,0) 72%);
  box-shadow:0 0 90px rgba(14,142,128,.14);
}
.brand-orbit img{
  position:absolute!important;
  inset:0!important;
  z-index:2;
  display:block;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  object-fit:contain;
  opacity:1!important;
  filter:saturate(1.12) contrast(1.04) drop-shadow(0 24px 30px rgba(9,45,53,.14));
  transform:translateZ(0);
  animation:brand-breathe 8s cubic-bezier(.4,0,.2,1) infinite;
}
.orbit-ring{
  position:absolute;
  z-index:1;
  left:34.2%;
  top:34%;
  width:32%;
  aspect-ratio:1;
  border-radius:50%;
  pointer-events:none;
}
.orbit-ring-outer{border:1px dashed rgba(9,45,53,.4);animation:orbit-spin 22s linear infinite}
.orbit-ring-inner{
  inset:39.2% auto auto 39.2%;
  width:22%;
  border:1px solid rgba(192,44,103,.38);
  box-shadow:inset 0 0 0 8px rgba(243,240,232,.62);
  animation:orbit-spin-reverse 15s linear infinite;
}
.orbit-signal{
  position:absolute;
  z-index:4;
  width:9px;
  aspect-ratio:1;
  border:2px solid #f3f0e8;
  border-radius:50%;
  box-shadow:0 0 0 1px rgba(9,45,53,.32),0 0 18px currentColor;
}
.signal-a{left:50%;top:31%;color:#0c8e80;background:currentColor;animation:signal-drift-a 5.6s ease-in-out infinite}
.signal-b{left:30%;top:58%;color:#c02c67;background:currentColor;animation:signal-drift-b 6.4s ease-in-out infinite}
.signal-c{right:24%;bottom:24%;color:#126fad;background:currentColor;animation:signal-drift-c 7.2s ease-in-out infinite}
.brand-orbit .mission-core{
  position:absolute!important;
  z-index:5;
  left:50%!important;
  top:49%!important;
  width:112px;
  height:112px;
  display:grid;
  place-content:center;
  margin:0!important;
  transform:translate(-50%,-50%)!important;
  border:1px solid rgba(9,45,53,.36);
  border-radius:50%;
  background:rgba(243,240,232,.88);
  color:#092d35;
  font-family:var(--mono,monospace);
  font-size:.67rem;
  font-weight:800;
  line-height:1.15;
  letter-spacing:.12em;
  text-align:center;
  backdrop-filter:blur(5px);
}
.mission-core small{display:block;margin-bottom:.45rem;color:#0c8e80;font-size:.5rem;letter-spacing:.16em}
.mission-core i{
  position:absolute;
  left:50%;
  bottom:10px;
  width:22px;
  height:2px;
  transform:translateX(-50%);
  background:#c02c67;
  box-shadow:0 0 12px rgba(192,44,103,.6);
}
.brand-orbit .orbit-label{
  position:absolute!important;
  inset:auto!important;
  z-index:5;
  display:inline-flex!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  align-items:center;
  padding:.24rem .38rem;
  border:1px solid rgba(9,45,53,.18);
  background:rgba(243,240,232,.9);
  color:#092d35;
  font-family:var(--mono,monospace);
  font-size:.56rem;
  font-weight:800;
  letter-spacing:.1em;
  line-height:1.2;
  white-space:nowrap;
  box-shadow:4px 4px 0 rgba(9,45,53,.07);
}
.brand-orbit .orbit-label::after{display:none!important}
.brand-orbit .orbit-label::before{
  content:"";
  display:inline-block;
  width:5px;
  height:5px;
  margin-right:.35rem;
  border-radius:50%;
  background:currentColor;
}
.brand-orbit .authority{top:8%!important;left:53%!important;color:#0c8e80}
.brand-orbit .runtime{right:0!important;bottom:20%!important;color:#126fad}
.brand-orbit .evidence{left:2%!important;bottom:23%!important;color:#c02c67}
.brand-coordinate{
  position:absolute;
  right:0;
  bottom:-.75rem;
  left:13%;
  z-index:6;
  display:flex;
  justify-content:space-between;
  padding-top:.52rem;
  border-top:1px solid rgba(9,45,53,.24);
  color:rgba(9,45,53,.67);
  font-family:var(--mono,monospace);
  font-size:.52rem;
  font-weight:700;
  letter-spacing:.08em;
}
.state-capsule{
  position:relative!important;
  inset:auto!important;
  z-index:8;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  overflow:hidden;
  transform:none!important;
  border:1px solid rgba(243,240,232,.22);
  border-radius:0!important;
  background:linear-gradient(90deg,rgba(12,142,128,.08),transparent 28%),#071f25!important;
  color:#f3f0e8;
  box-shadow:18px 20px 0 rgba(9,45,53,.09),0 24px 70px rgba(9,45,53,.2);
}
.state-capsule::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:repeating-linear-gradient(0deg,transparent 0 5px,rgba(243,240,232,.018) 5px 6px);
  mix-blend-mode:screen;
}
.state-capsule>*{position:relative;z-index:1}
.capsule-header{
  display:grid!important;
  grid-template-columns:1fr auto auto;
  align-items:center;
  min-height:42px;
  padding:0 .8rem!important;
  border-bottom:1px solid rgba(243,240,232,.18)!important;
  background:rgba(0,0,0,.16);
  font-family:var(--mono,monospace);
  font-size:.58rem;
  letter-spacing:.09em;
}
.recorder-id{display:inline-flex;align-items:center;gap:.5rem;color:#f3f0e8}
.recorder-id i,.capsule-footer strong i,.scenario-statusline>span:first-child i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#f26f35;
  box-shadow:0 0 0 4px rgba(242,111,53,.12),0 0 14px rgba(242,111,53,.8);
  animation:recorder-pulse 1.7s ease-out infinite;
}
.capsule-mode{
  padding:0 .8rem;
  border-right:1px solid rgba(243,240,232,.15);
  border-left:1px solid rgba(243,240,232,.15);
  color:rgba(243,240,232,.54);
}
.field-clock{min-width:72px;color:#8ee8d8!important;text-align:right;font-variant-numeric:tabular-nums}
.capsule-grid{display:grid;grid-template-columns:minmax(190px,.72fr) minmax(360px,1.7fr)}
.scope-column{
  padding:.72rem;
  border-right:1px solid rgba(243,240,232,.15);
  background:rgba(0,0,0,.1);
}
.capsule-label,.ledger-heading,.scenario-impact>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:.55rem;
  color:rgba(243,240,232,.62);
  font-family:var(--mono,monospace);
  font-size:.5rem;
  letter-spacing:.1em;
}
.capsule-label small{color:#8ee8d8}
.state-capsule .scope-stack{display:grid;gap:.26rem}
.state-capsule .scope-rail{
  position:relative;
  display:grid!important;
  grid-template-columns:22px 48px minmax(0,1fr) 8px;
  align-items:center;
  gap:.42rem;
  width:100%;
  min-height:38px;
  padding:.42rem .5rem!important;
  overflow:hidden;
  border:1px solid rgba(243,240,232,.13)!important;
  border-radius:0!important;
  background:rgba(243,240,232,.025)!important;
  color:rgba(243,240,232,.62)!important;
  text-align:left;
  cursor:pointer;
  transition:border-color 180ms ease,background-color 180ms ease,color 180ms ease;
}
.state-capsule .scope-rail::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  transform:scaleY(0);
  background:#8ee8d8;
  transform-origin:bottom;
  transition:transform 180ms ease;
}
.state-capsule .scope-rail:hover,.state-capsule .scope-rail:focus-visible,.state-capsule .scope-rail.active{
  border-color:rgba(142,232,216,.48)!important;
  background:rgba(12,142,128,.13)!important;
  color:#f3f0e8!important;
}
.state-capsule .scope-rail.active::before{transform:scaleY(1)}
.state-capsule .scope-rail>span{color:rgba(243,240,232,.42);font-family:var(--mono,monospace);font-size:.52rem}
.state-capsule .scope-rail>b{font-family:var(--mono,monospace);font-size:.61rem;letter-spacing:.08em}
.state-capsule .scope-rail>small{
  overflow:hidden;
  color:rgba(243,240,232,.45);
  font-family:var(--mono,monospace);
  font-size:.45rem;
  letter-spacing:.035em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.state-capsule .scope-rail>span,
.state-capsule .scope-rail>b,
.state-capsule .scope-rail>small,
.state-capsule .scope-rail>i{
  position:static!important;
  grid-area:auto!important;
  grid-row:auto!important;
  grid-column:auto!important;
  margin:0!important;
  transform:none!important;
}
.state-capsule .scope-rail>span{grid-column:1!important}
.state-capsule .scope-rail>b{grid-column:2!important}
.state-capsule .scope-rail>small{grid-column:3!important;min-width:0}
.state-capsule .scope-rail>i{grid-column:4!important}
.state-capsule .scope-rail{display:flex!important}
.state-capsule .scope-rail>span{flex:0 0 22px}
.state-capsule .scope-rail>b{flex:0 0 48px}
.state-capsule .scope-rail>small{
  flex:1 1 auto;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
}
.state-capsule .scope-rail>i{flex:0 0 6px}
.state-capsule .scope-rail>i{width:6px;height:6px;border:1px solid currentColor;border-radius:50%}
.state-capsule .scope-rail.active>i{border-color:#8ee8d8;background:#8ee8d8;box-shadow:0 0 10px rgba(142,232,216,.76)}
.scope-legend{
  display:flex;
  justify-content:space-between;
  margin-top:.55rem;
  color:rgba(243,240,232,.4);
  font-family:var(--mono,monospace);
  font-size:.43rem;
  letter-spacing:.08em;
}
.scope-legend span:first-child{display:inline-flex;align-items:center;gap:.35rem}
.scope-legend i{width:5px;height:5px;border-radius:50%;background:#8ee8d8}
.resolution-column{min-width:0}
.capsule-telemetry{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid rgba(243,240,232,.14)}
.capsule-telemetry>div{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:end;
  min-height:58px;
  padding:.65rem .75rem .55rem;
  border-right:1px solid rgba(243,240,232,.12);
}
.capsule-telemetry>div:last-child{border-right:0}
.capsule-telemetry span,.capsule-telemetry small{font-family:var(--mono,monospace);font-size:.44rem;letter-spacing:.08em}
.capsule-telemetry span{color:rgba(243,240,232,.52)}
.capsule-telemetry strong{grid-row:span 2;color:#8ee8d8;font-family:var(--mono,monospace);font-size:1rem}
.capsule-telemetry small{color:rgba(243,240,232,.3)}
.state-capsule .resolver-row{
  display:grid!important;
  grid-template-columns:minmax(90px,.7fr) minmax(150px,1.25fr) minmax(90px,.7fr)!important;
  align-items:stretch;
  gap:0!important;
  margin:0!important;
  border-bottom:1px solid rgba(243,240,232,.14);
}
.state-capsule .runtime-chip{
  display:grid;
  align-content:center;
  min-height:86px;
  padding:.65rem .75rem!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.state-capsule .runtime-chip.target{text-align:right}
.state-capsule .runtime-chip>span,.state-capsule .runtime-chip>small{
  color:rgba(243,240,232,.43);
  font-family:var(--mono,monospace);
  font-size:.43rem;
  letter-spacing:.09em;
}
.state-capsule .runtime-chip b{
  margin:.2rem 0;
  overflow:hidden;
  color:#f3f0e8;
  font-family:var(--mono,monospace);
  font-size:clamp(.58rem,.78vw,.78rem);
  text-overflow:ellipsis;
  white-space:nowrap;
  word-break:normal!important;
}
.continuity-bridge{
  position:relative;
  display:grid;
  place-content:center;
  padding:.6rem;
  overflow:hidden;
  border-right:1px solid rgba(243,240,232,.12);
  border-left:1px solid rgba(243,240,232,.12);
  text-align:center;
}
.continuity-bridge::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,transparent,rgba(12,142,128,.11),transparent);
  transform:translateX(-100%);
  animation:bridge-scan 3.2s ease-in-out infinite;
}
.bridge-caption,.bridge-rule{
  position:relative;
  color:rgba(243,240,232,.46);
  font-family:var(--mono,monospace);
  font-size:.42rem;
  letter-spacing:.08em;
}
.bridge-track{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:min(100%,190px);
  height:18px;
  margin:.3rem auto;
}
.bridge-track::before,.bridge-track::after{content:"";position:absolute;top:8px;right:0;left:0;height:1px}
.bridge-track::before{background:rgba(243,240,232,.2)}
.bridge-track::after{
  background:linear-gradient(90deg,#0c8e80,#f26f35,#126fad);
  transform:scaleX(0);
  transform-origin:left;
  animation:bridge-fill 3.2s ease-in-out infinite;
}
.bridge-track i{position:relative;z-index:1;width:7px;height:7px;border:1px solid rgba(243,240,232,.65);border-radius:50%;background:#071f25}
.state-capsule .fingerprint-line{
  display:grid!important;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:.7rem;
  min-height:38px;
  padding:.5rem .75rem!important;
  border-bottom:1px solid rgba(243,240,232,.14);
  color:rgba(243,240,232,.5);
  font-family:var(--mono,monospace);
  font-size:.48rem;
}
.state-capsule .fingerprint-line code{color:rgba(243,240,232,.74);font-size:.52rem}
.state-capsule .fingerprint-line strong{display:flex;align-items:center;gap:.38rem;color:#8ee8d8;font-size:.48rem}
.state-capsule .fingerprint-line strong i{width:6px;height:6px;border-radius:50%;background:#8ee8d8;box-shadow:0 0 10px rgba(142,232,216,.7)}
.state-capsule .scope-readout{
  display:grid!important;
  grid-template-columns:minmax(92px,.35fr) 1fr;
  align-items:start;
  gap:.7rem;
  min-height:58px;
  padding:.65rem .75rem!important;
  border-bottom:1px solid rgba(243,240,232,.14);
  background:rgba(12,142,128,.07);
}
.state-capsule .scope-readout>span{color:#8ee8d8;font-family:var(--mono,monospace);font-size:.55rem;letter-spacing:.07em}
.state-capsule .scope-readout p{margin:0;color:rgba(243,240,232,.74);font-size:.65rem;line-height:1.45}
.event-ledger{padding:.62rem .75rem .7rem}
.event-ledger ol{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  margin:0;
  padding:0;
  list-style:none;
  background:rgba(243,240,232,.12);
}
.event-ledger li{
  position:relative;
  display:grid;
  min-height:60px;
  padding:.5rem;
  overflow:hidden;
  background:#09252b;
  color:rgba(243,240,232,.42);
  transition:color 180ms ease,background-color 180ms ease;
}
.event-ledger li::before{
  content:"";
  position:absolute;
  inset:auto 100% 0 0;
  height:2px;
  background:#f26f35;
  transition:right 500ms ease;
}
.event-ledger li.active{background:rgba(242,111,53,.08);color:#f3f0e8}
.event-ledger li.active::before{right:0}
.event-ledger time,.event-ledger b,.event-ledger span{font-family:var(--mono,monospace)}
.event-ledger time{color:rgba(142,232,216,.68);font-size:.4rem}
.event-ledger b{align-self:end;margin-top:.35rem;font-size:.5rem;letter-spacing:.05em}
.event-ledger li span{margin-top:.16rem;font-size:.4rem;line-height:1.25}
.capsule-footer{
  display:grid;
  grid-template-columns:1fr 1fr auto;
  align-items:center;
  min-height:34px;
  padding:0 .75rem;
  border-top:1px solid rgba(243,240,232,.15);
  background:rgba(0,0,0,.18);
  color:rgba(243,240,232,.38);
  font-family:var(--mono,monospace);
  font-size:.43rem;
  letter-spacing:.08em;
}
.capsule-footer strong{display:flex;align-items:center;gap:.42rem;color:#f26f35}

/* How it works: scenario instrument, not a generic feature-card grid. */
.how-field{
  position:relative;
  margin:clamp(5rem,10vw,10rem) 0;
  padding:clamp(2rem,5vw,5rem);
  overflow:hidden;
  background:
    radial-gradient(circle at 84% 8%,rgba(18,111,173,.22),transparent 24rem),
    radial-gradient(circle at 9% 93%,rgba(192,44,103,.17),transparent 23rem),
    #071f25;
  color:#f3f0e8;
  box-shadow:0 0 0 1px rgba(9,45,53,.08),0 40px 90px rgba(9,45,53,.16);
}
.how-field::before{
  content:"OCB / CONTINUITY INSTRUMENT";
  position:absolute;
  top:2rem;
  right:-4.2rem;
  padding-bottom:.35rem;
  transform:rotate(90deg);
  border-bottom:1px solid rgba(243,240,232,.16);
  color:rgba(243,240,232,.26);
  font-family:var(--mono,monospace);
  font-size:.5rem;
  letter-spacing:.17em;
}
.how-intro{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.72fr);
  gap:clamp(2rem,8vw,8rem);
  align-items:end;
  margin-bottom:clamp(2rem,4vw,4rem);
}
.how-intro .eyebrow{color:#8ee8d8}
.how-intro h2{
  max-width:13ch;
  margin:.8rem 0 0;
  color:#f3f0e8;
  font-size:clamp(2.5rem,5.6vw,6rem);
  line-height:.88;
  letter-spacing:-.055em;
}
.how-deck{padding-top:1rem;border-top:1px solid rgba(243,240,232,.24)}
.how-deck>p{margin:0;color:rgba(243,240,232,.68);font-size:clamp(.82rem,1vw,1rem);line-height:1.62}
.how-index{
  display:flex;
  flex-wrap:wrap;
  gap:.8rem 1.2rem;
  margin-top:1.5rem;
  color:#f26f35;
  font-family:var(--mono,monospace);
  font-size:.52rem;
  font-weight:800;
  letter-spacing:.08em;
}
.scenario-console{border:1px solid rgba(243,240,232,.2);background:rgba(4,19,23,.78);box-shadow:18px 18px 0 rgba(243,240,232,.035)}
.scenario-tabs{display:grid;grid-template-columns:1.18fr .95fr 1.05fr .84fr;border-bottom:1px solid rgba(243,240,232,.17)}
.scenario-tabs button{
  position:relative;
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.1rem .58rem;
  min-height:68px;
  padding:.75rem .85rem;
  overflow:hidden;
  border:0;
  border-right:1px solid rgba(243,240,232,.14);
  border-radius:0;
  background:transparent;
  color:rgba(243,240,232,.47);
  text-align:left;
  cursor:pointer;
}
.scenario-tabs button:last-child{border-right:0}
.scenario-tabs button::after{
  content:"";
  position:absolute;
  inset:auto 100% 0 0;
  height:3px;
  background:linear-gradient(90deg,#0c8e80,#f26f35);
  transition:right 280ms ease;
}
.scenario-tabs button:hover,.scenario-tabs button:focus-visible,.scenario-tabs button.active{background:rgba(243,240,232,.045);color:#f3f0e8}
.scenario-tabs button.active::after{right:0}
.scenario-tabs span{grid-row:span 2;color:#8ee8d8;font-family:var(--mono,monospace);font-size:.54rem}
.scenario-tabs b,.scenario-tabs small{font-family:var(--mono,monospace)}
.scenario-tabs b{font-size:.62rem;letter-spacing:.06em}
.scenario-tabs small{color:rgba(243,240,232,.35);font-size:.46rem}
.scenario-stage{display:grid;grid-template-columns:minmax(190px,.73fr) minmax(390px,1.55fr) minmax(200px,.72fr);min-height:390px}
.scenario-context,.scenario-impact{padding:clamp(1rem,2vw,1.6rem)}
.scenario-context{border-right:1px solid rgba(243,240,232,.14)}
.scenario-kicker{
  display:flex;
  align-items:center;
  gap:.55rem;
  color:rgba(243,240,232,.42);
  font-family:var(--mono,monospace);
  font-size:.48rem;
  letter-spacing:.08em;
}
.scenario-kicker span{
  display:grid;
  width:26px;
  height:26px;
  place-content:center;
  border:1px solid rgba(142,232,216,.46);
  color:#8ee8d8;
}
.scenario-context h3{
  margin:clamp(1.4rem,3vw,2.5rem) 0 1rem;
  color:#f3f0e8;
  font-size:clamp(1.55rem,2.7vw,2.7rem);
  line-height:.96;
  letter-spacing:-.04em;
}
.scenario-context>p{color:rgba(243,240,232,.58);font-size:.72rem;line-height:1.58}
.scenario-context dl{display:grid;gap:.65rem;margin:2rem 0 0}
.scenario-context dl>div{padding-top:.55rem;border-top:1px solid rgba(243,240,232,.13)}
.scenario-context dt,.scenario-context dd{margin:0;font-family:var(--mono,monospace)}
.scenario-context dt{color:rgba(243,240,232,.35);font-size:.43rem;letter-spacing:.08em}
.scenario-context dd{margin-top:.22rem;color:#f26f35;font-size:.58rem}
.scenario-diagram{
  position:relative;
  display:grid;
  grid-template-columns:minmax(75px,.7fr) minmax(190px,1.55fr) minmax(75px,.7fr);
  align-items:center;
  gap:.8rem;
  min-width:0;
  padding:clamp(1rem,2vw,1.7rem);
  overflow:hidden;
  border-right:1px solid rgba(243,240,232,.14);
  background:
    linear-gradient(90deg,rgba(243,240,232,.026) 1px,transparent 1px),
    linear-gradient(rgba(243,240,232,.026) 1px,transparent 1px);
  background-size:23px 23px;
}
.scenario-diagram::before{content:"";position:absolute;inset:12% 4%;border:1px dashed rgba(243,240,232,.1);pointer-events:none}
.scenario-node{
  position:relative;
  z-index:2;
  display:grid;
  align-content:center;
  min-width:0;
  min-height:104px;
  padding:.65rem;
  border:1px solid rgba(243,240,232,.2);
  background:#09252b;
}
.scenario-node::after{content:"";position:absolute;top:50%;width:.8rem;height:1px;background:rgba(243,240,232,.38)}
.source-node::after{right:-.8rem}.target-node::after{left:-.8rem}
.scenario-node span,.scenario-node small,.scenario-node strong{overflow:hidden;font-family:var(--mono,monospace);text-overflow:ellipsis}
.scenario-node span,.scenario-node small{color:rgba(243,240,232,.38);font-size:.42rem;letter-spacing:.07em}
.scenario-node strong{margin:.45rem 0;color:#f3f0e8;font-size:.65rem;white-space:nowrap}
.scenario-node>i{
  position:absolute;
  right:7px;
  bottom:7px;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#8ee8d8;
  box-shadow:0 0 12px rgba(142,232,216,.74);
}
.target-node>i{background:#f26f35;box-shadow:0 0 12px rgba(242,111,53,.74)}
.state-transfer{position:relative;display:grid;gap:.45rem;min-width:0;padding:2rem 0}
.transfer-rail{
  position:relative;
  display:grid;
  grid-template-columns:43px 1fr;
  align-items:center;
  min-width:0;
  color:rgba(243,240,232,.38);
  font-family:var(--mono,monospace);
  font-size:.39rem;
}
.transfer-rail i{position:relative;height:1px;overflow:hidden;background:rgba(243,240,232,.15)}
.transfer-rail i::after{
  content:"";
  position:absolute;
  top:0;
  left:-42%;
  width:42%;
  height:1px;
  background:linear-gradient(90deg,transparent,#8ee8d8,transparent);
  animation:rail-flow 2.5s linear infinite;
}
.rail-person i::after{animation-delay:.15s}.rail-project i::after{animation-delay:.3s}.rail-app i::after{animation-delay:.45s}.rail-task i::after{animation-delay:.6s}
.transfer-core{
  position:absolute;
  z-index:3;
  top:50%;
  left:58%;
  display:grid;
  width:82px;
  height:82px;
  place-content:center;
  transform:translate(-50%,-50%);
  border:1px solid rgba(142,232,216,.42);
  border-radius:50%;
  background:rgba(7,31,37,.94);
  color:#f3f0e8;
  text-align:center;
  box-shadow:0 0 0 13px rgba(12,142,128,.06),0 0 36px rgba(12,142,128,.18);
}
.transfer-core b,.transfer-core small{position:relative;z-index:2;font-family:var(--mono,monospace)}
.transfer-core b{font-size:.76rem}.transfer-core small{margin-top:.15rem;color:#8ee8d8;font-size:.38rem}
.core-pulse{position:absolute;inset:-1px;border:1px solid rgba(142,232,216,.4);border-radius:50%;animation:core-expand 2.5s ease-out infinite}
.state-packet{
  position:absolute;
  z-index:4;
  top:50%;
  left:2%;
  width:7px;
  height:7px;
  border:1px solid #f3f0e8;
  background:#f26f35;
  box-shadow:0 0 12px rgba(242,111,53,.8);
  animation:packet-transfer 3.6s cubic-bezier(.3,0,.2,1) infinite;
}
.packet-two{margin-top:-24px;animation-delay:1.2s;background:#0c8e80;box-shadow:0 0 12px rgba(12,142,128,.8)}
.packet-three{margin-top:24px;animation-delay:2.4s;background:#126fad;box-shadow:0 0 12px rgba(18,111,173,.8)}
.receipt-ribbon{
  position:absolute;
  right:1.7rem;
  bottom:1.15rem;
  left:1.7rem;
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:.6rem;
  padding-top:.5rem;
  border-top:1px solid rgba(243,240,232,.13);
  color:rgba(243,240,232,.36);
  font-family:var(--mono,monospace);
  font-size:.4rem;
  letter-spacing:.07em;
}
.receipt-ribbon code{color:rgba(243,240,232,.62)}
.receipt-ribbon b{display:flex;align-items:center;gap:.35rem;color:#8ee8d8;font-size:.4rem}
.receipt-ribbon b i{width:5px;height:5px;border-radius:50%;background:#8ee8d8}
.scenario-impact{background:rgba(0,0,0,.1)}
.scenario-impact>p{min-height:7.2em;color:rgba(243,240,232,.63);font-size:.69rem;line-height:1.58}
.scenario-impact>header small{color:#f26f35}
.impact-metrics{display:grid;gap:1px;margin:1.2rem 0;background:rgba(243,240,232,.13)}
.impact-metrics>div{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  min-height:42px;
  padding:.5rem;
  background:#09252b;
  font-family:var(--mono,monospace);
}
.impact-metrics span{color:rgba(243,240,232,.38);font-size:.42rem}
.impact-metrics strong{color:#8ee8d8;font-size:.49rem}
.intent-note{
  display:block;
  padding-top:.7rem;
  border-top:1px solid rgba(243,240,232,.13);
  color:rgba(243,240,232,.32);
  font-family:var(--mono,monospace);
  font-size:.42rem;
  line-height:1.45;
}
.scenario-statusline{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:1rem;
  align-items:center;
  min-height:34px;
  padding:0 .85rem;
  border-top:1px solid rgba(243,240,232,.15);
  color:rgba(243,240,232,.35);
  font-family:var(--mono,monospace);
  font-size:.44rem;
  letter-spacing:.07em;
}
.scenario-statusline>span:first-child{display:flex;align-items:center;gap:.5rem;color:#f26f35}
.scenario-statusline>span:last-child{overflow:hidden;text-align:right;text-overflow:ellipsis;white-space:nowrap}
.how-steps{
  position:relative;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  margin:clamp(2rem,4vw,4rem) 0 0;
  padding:0;
  list-style:none;
}
.how-steps::before{
  content:"";
  position:absolute;
  top:17px;
  right:5%;
  left:5%;
  height:1px;
  background:linear-gradient(90deg,#0c8e80,#f26f35 48%,#126fad);
}
.how-steps li{position:relative;padding:0 .75rem}
.how-steps li+li{border-left:1px solid rgba(243,240,232,.12)}
.how-steps li>span{
  position:relative;
  z-index:1;
  display:grid;
  width:34px;
  height:34px;
  place-content:center;
  margin-bottom:1rem;
  border:1px solid rgba(243,240,232,.28);
  background:#071f25;
  color:#8ee8d8;
  font-family:var(--mono,monospace);
  font-size:.5rem;
}
.how-steps b{color:#f3f0e8;font-family:var(--mono,monospace);font-size:.57rem;letter-spacing:.08em}
.how-steps p{margin:.55rem 0 0;color:rgba(243,240,232,.47);font-size:.58rem;line-height:1.48}

@keyframes brand-breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-7px) scale(1.008)}}
@keyframes orbit-spin{to{transform:rotate(360deg)}}
@keyframes orbit-spin-reverse{to{transform:rotate(-360deg)}}
@keyframes signal-drift-a{50%{transform:translate(18px,7px)}}
@keyframes signal-drift-b{50%{transform:translate(-8px,-15px)}}
@keyframes signal-drift-c{50%{transform:translate(11px,13px)}}
@keyframes recorder-pulse{
  0%{box-shadow:0 0 0 0 rgba(242,111,53,.42),0 0 12px rgba(242,111,53,.72)}
  70%{box-shadow:0 0 0 6px rgba(242,111,53,0),0 0 12px rgba(242,111,53,.5)}
  100%{box-shadow:0 0 0 0 rgba(242,111,53,0),0 0 12px rgba(242,111,53,.72)}
}
@keyframes bridge-scan{0%,20%{transform:translateX(-100%)}75%,100%{transform:translateX(100%)}}
@keyframes bridge-fill{0%,15%{transform:scaleX(0)}70%,100%{transform:scaleX(1)}}
@keyframes rail-flow{to{left:100%}}
@keyframes core-expand{0%{opacity:.8;transform:scale(.85)}80%,100%{opacity:0;transform:scale(1.45)}}
@keyframes packet-transfer{
  0%,10%{left:2%;opacity:0}
  18%{opacity:1}
  48%{left:58%;transform:scale(1.35) rotate(45deg)}
  75%{opacity:1}
  90%,100%{left:96%;opacity:0;transform:scale(1) rotate(90deg)}
}

@media(max-width:1120px){
  .opr-release-strip{grid-template-columns:.7fr 1.3fr}
  .opr-release-facts{border-inline-end:0}
  .opr-release-link{min-height:120px}
  .brand-orbit{min-height:390px;margin-top:0!important}
  .capsule-grid{grid-template-columns:minmax(170px,.64fr) minmax(330px,1.4fr)}
  .scenario-stage{grid-template-columns:minmax(180px,.8fr) minmax(340px,1.35fr)}
  .scenario-impact{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:minmax(180px,1fr) minmax(330px,1.8fr);
    gap:1rem;
    border-top:1px solid rgba(243,240,232,.14);
  }
  .scenario-impact>header{grid-column:1/-1;margin:0}
  .scenario-impact>p{min-height:0}
  .scenario-impact .impact-metrics{margin:0}
  .scenario-impact .intent-note{grid-column:1/-1}
}
@media(max-width:820px){
  .opr-release-strip{grid-template-columns:1fr}
  .opr-release-index,
  .opr-release-copy,
  .opr-release-facts{border-inline-end:0;border-bottom:1px solid #ffffff2a}
  .opr-release-index b{margin-top:24px}
  .opr-release-link{min-height:112px}
  .continuity-stage{grid-template-rows:auto auto}
  .brand-orbit{width:100%!important;min-height:365px;margin:1rem auto 1.5rem!important}
  .brand-orbit-frame{width:min(100%,390px);margin:0 auto}
  .brand-coordinate{right:5%;left:5%}
  .capsule-header{grid-template-columns:1fr auto}
  .capsule-mode{display:none}
  .capsule-grid{grid-template-columns:1fr}
  .scope-column{border-right:0;border-bottom:1px solid rgba(243,240,232,.15)}
  .state-capsule .scope-stack{grid-template-columns:repeat(2,minmax(0,1fr))}
  .state-capsule .scope-rail{min-height:48px}
  .state-capsule .scope-rail>span{display:block}
  .how-field{
    margin-right:calc(50% - 50vw);
    margin-left:calc(50% - 50vw);
    padding:3rem max(1rem,calc((100vw - 720px)/2));
  }
  .how-intro{grid-template-columns:1fr;gap:2rem}
  .scenario-tabs{grid-template-columns:repeat(2,1fr)}
  .scenario-tabs button:nth-child(2){border-right:0}
  .scenario-tabs button:nth-child(-n+2){border-bottom:1px solid rgba(243,240,232,.14)}
  .scenario-stage{grid-template-columns:1fr}
  .scenario-context,.scenario-diagram{border-right:0;border-bottom:1px solid rgba(243,240,232,.14)}
  .scenario-context{display:grid;grid-template-columns:1fr 1fr;gap:.8rem 1.4rem}
  .scenario-context .scenario-kicker,.scenario-context h3{grid-column:1/-1}
  .scenario-context h3{margin-bottom:0}
  .scenario-context dl{margin:0}
  .scenario-diagram{min-height:330px}
  .scenario-impact{grid-column:auto}
  .how-steps{grid-template-columns:repeat(3,1fr);gap:2rem 0}
  .how-steps::before{display:none}
  .how-steps li:nth-child(4){border-left:0}
}
@media(max-width:560px){
  .brand-orbit{min-height:335px}
  .brand-orbit-frame{width:min(94%,330px)}
  .brand-orbit .mission-core{width:82px;height:82px;font-size:.52rem}
  .brand-orbit .orbit-label{font-size:.45rem}
  .brand-coordinate{bottom:0;font-size:.4rem}
  .capsule-header{min-height:38px;font-size:.5rem}
  .state-capsule .scope-stack{grid-template-columns:1fr}
  .state-capsule .scope-rail{min-height:38px}
  .capsule-telemetry{grid-template-columns:1fr}
  .capsule-telemetry>div{min-height:44px;border-right:0;border-bottom:1px solid rgba(243,240,232,.1)}
  .state-capsule .resolver-row{grid-template-columns:1fr 1fr!important}
  .continuity-bridge{
    grid-row:2;
    grid-column:1/-1;
    min-height:64px;
    border-top:1px solid rgba(243,240,232,.12);
    border-right:0;
    border-left:0;
  }
  .state-capsule .fingerprint-line{grid-template-columns:1fr auto}
  .state-capsule .fingerprint-line strong{grid-column:1/-1}
  .state-capsule .scope-readout{grid-template-columns:1fr}
  .event-ledger ol{grid-template-columns:1fr 1fr}
  .capsule-footer{grid-template-columns:1fr auto}
  .capsule-footer span:nth-child(2){display:none}
  .how-field::before{display:none}
  .how-intro h2{font-size:clamp(2.65rem,15vw,4.4rem)}
  .scenario-tabs{grid-template-columns:1fr}
  .scenario-tabs button{min-height:56px;border-right:0;border-bottom:1px solid rgba(243,240,232,.14)}
  .scenario-context{grid-template-columns:1fr}
  .scenario-context .scenario-kicker,.scenario-context h3{grid-column:auto}
  .scenario-diagram{
    grid-template-columns:1fr 1fr;
    gap:1rem;
    min-height:430px;
    padding-bottom:4.2rem;
  }
  .state-transfer{grid-row:1;grid-column:1/-1;min-height:170px}
  .source-node,.target-node{grid-row:2}
  .scenario-node::after{display:none}
  .receipt-ribbon{right:1rem;bottom:1rem;left:1rem}
  .scenario-impact{display:block}
  .scenario-impact>p{min-height:0}
  .scenario-impact .impact-metrics{margin:1.2rem 0}
  .scenario-statusline{grid-template-columns:1fr;gap:.25rem;padding:.55rem .8rem}
  .scenario-statusline>span:last-child{text-align:left}
  .how-steps{grid-template-columns:1fr 1fr}
  .how-steps li:nth-child(odd){border-left:0}
  .how-steps li:nth-child(4){border-left:1px solid rgba(243,240,232,.12)}
}
@media(prefers-reduced-motion:reduce){
  .bridge-track::after{transform:scaleX(1)}
  .state-packet{display:none}
}
