/* ── INTERNAL PAGES — the facility ─────────────────────────────────────────
   Same command-centre language as the public site, applied to the working pages.
   Content, filtering and quiz behaviour are untouched; this is presentation.

   The right side of the viewport belongs to the drill console when it is open,
   so the page reserves --orb-w rather than letting content slide underneath it. */

body.facility{
  background:
    linear-gradient(90deg, rgba(2,5,7,.90) 0%, rgba(2,5,7,.74) 42%, rgba(2,5,7,.34) 100%),
    url("../img/facility-plate.webp") center center / cover no-repeat fixed,
    #02050a;
  min-height:100vh;
}
/* the fixed attachment is a repaint cost on small screens for no benefit */
@media(max-width:820px){
  body.facility{
    background:
      linear-gradient(to bottom, rgba(2,5,7,.93) 0%, rgba(2,5,7,.88) 50%, rgba(2,5,7,.95) 100%),
      url("../img/facility-plate-sm.webp") center center / cover no-repeat,
      #02050a;
  }
}

/* ── nav, integrated rather than a bar ── */
body.facility #nav{
  background:linear-gradient(to bottom, rgba(3,6,9,.86) 0%, rgba(3,6,9,.55) 70%, transparent 100%);
  backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,105,0,.14);
}
body.facility .nav-inner{max-width:none;padding:0 clamp(22px,3vw,54px);min-height:60px}
body.facility .brand{font-size:1.12rem}
body.facility .nav-links a{font-size:14px;color:rgba(228,234,240,.72)}
body.facility .nav-links a:hover{color:#fff}
body.facility .nav-links a.on{color:#ff671f}
body.facility .tag-internal{border-color:rgba(255,105,0,.4);color:#ff8a3d}

/* ── the left workstation column ── */
body.facility > .wrap{
  max-width:none;margin:0;
  padding-left:clamp(22px,3.4vw,64px);
  padding-right:clamp(22px,3.4vw,64px);
  padding-bottom:64px;
}
html.orb-open body.facility > .wrap{
  /* reserve the console's width so the two sit side by side */
  padding-right:calc(var(--orb-w, 0px) + 46px);
}
@media(max-width:1199px){
  html.orb-open body.facility > .wrap{padding-right:clamp(22px,3.4vw,64px)}
}

/* ── page head ── */
body.facility .page-head{border-bottom:none;padding:38px 0 22px}
body.facility .page-head h1{
  font-size:clamp(2.6rem,4vw,4rem);font-weight:750;line-height:1;letter-spacing:-.04em;color:#f5f5f3;
}
body.facility .lede{
  color:rgba(206,216,226,.76);font-size:clamp(1.02rem,1.24vw,1.14rem);line-height:1.66;
  max-width:60ch;margin-top:16px;
}
body.facility .lede strong{color:#eef2f6;font-weight:650}

/* ── the info module ── */
/* Block, not grid: the note's text contains <strong> and <em> inline, and as grid
   children each of those became its own cell — the quotes collapsed into a
   one-word column. The icon is positioned instead. */
body.facility .note{
  position:relative;display:block;
  background:rgba(5,9,12,.72);backdrop-filter:blur(10px);
  border:1px solid rgba(255,105,0,.34);border-radius:2px;
  /* shorthand first, then the left inset for the icon — the other way round the
     shorthand silently resets it */
  padding:22px 26px;padding-left:74px;
  margin:26px 0;color:rgba(200,210,220,.74);font-size:14.8px;line-height:1.62;
  clip-path:polygon(18px 0, 100% 0, 100% calc(100% - 18px), calc(100% - 18px) 100%, 0 100%, 0 18px);
  box-shadow:0 20px 50px rgba(0,0,0,.4), inset 0 1px rgba(255,255,255,.03), 0 0 26px rgba(255,100,0,.04);
}
body.facility .note::before{
  content:'';position:absolute;left:24px;top:22px;width:34px;height:34px;
  background:no-repeat center/contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M15 2.6 25.6 8.8v12.4L15 27.4 4.4 21.2V8.8z' fill='none' stroke='%23ff6a18' stroke-width='1'/%3E%3Cpath d='M15 9.4v1.6M15 13.6v7' fill='none' stroke='%23ff7a2e' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
}
body.facility .note strong{display:block;color:#f2f5f8;font-weight:700;font-size:15.6px;margin-bottom:6px}
body.facility .note em{color:rgba(226,232,238,.86);font-style:italic}

/* ── search as a command field ── */
body.facility .searchbar{
  min-height:68px;padding:0 54px 0 22px;border-radius:2px;font-size:15.4px;
  background:rgba(5,9,12,.70);backdrop-filter:blur(8px);
  border:1px solid rgba(150,165,180,.28);color:#eef2f6;
  clip-path:polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff7a2e' stroke-width='1.6'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='M15.4 15.4 21 21' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 20px center;background-size:20px;
  transition:border-color .2s ease, box-shadow .2s ease;
}
body.facility .searchbar::placeholder{color:rgba(170,182,196,.55)}
body.facility .searchbar:focus{
  outline:none;border-color:rgba(255,120,30,.7);
  box-shadow:0 0 0 1px rgba(255,120,30,.28), 0 0 26px rgba(255,101,23,.14), inset 0 0 30px rgba(255,101,23,.05);
}

/* ── filter toggles ── */
body.facility #filters{display:flex;gap:9px;flex-wrap:wrap;margin:14px 0 6px}
body.facility #filters button{
  font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:9px 18px;border-radius:2px;
  background:rgba(6,10,14,.66);border:1px solid rgba(150,165,180,.24);color:rgba(206,216,226,.72);
  transition:border-color .18s ease, color .18s ease, background .18s ease, box-shadow .18s ease;
}
body.facility #filters button:hover{border-color:rgba(255,120,30,.5);color:#eef2f6}
body.facility #filters button.on{
  border-color:rgba(255,120,30,.9);color:#ff8a3d;background:rgba(255,101,23,.10);
  box-shadow:inset 0 0 18px rgba(255,101,23,.10), 0 0 14px rgba(255,101,23,.12);
}
body.facility .searchmeta{color:rgba(160,174,190,.7);margin:14px 0 24px}
body.facility .searchmeta strong{color:#ff8a3d}

/* ── the registry ── */
body.facility .stage{margin-bottom:34px}
body.facility .stage-head{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;
  padding-bottom:12px;border-bottom:1px solid rgba(150,165,180,.16);margin-bottom:4px}
body.facility .stage-n{font-family:var(--mono);font-size:14px;font-weight:700;color:#ff671f;padding-top:3px}
body.facility .stage h2{font-size:1.24rem;font-weight:700;color:#f2f5f8;letter-spacing:-.012em}
body.facility .stage-why{color:rgba(190,202,214,.62);font-size:14px;line-height:1.55;margin-top:4px}

body.facility .skill{
  border:none;border-bottom:1px solid rgba(150,165,180,.13);background:transparent;
  border-radius:0;margin:0;transition:background .18s ease;
}
body.facility .skill:hover{background:rgba(255,101,23,.035)}
body.facility .skill[open]{background:rgba(6,10,14,.5)}
body.facility .skill > summary{padding:15px 16px 15px 4px;gap:13px}
body.facility .skill > summary::after{
  content:'›';margin-left:auto;color:rgba(255,122,46,.6);font-size:19px;line-height:1;
  transform:translateY(-1px);transition:transform .18s ease,color .18s ease;
}
body.facility .skill:hover > summary::after{color:#ff8a3d;transform:translate(3px,-1px)}
body.facility .skill[open] > summary::after{transform:rotate(90deg) translateX(-1px)}
body.facility .sid{color:#ff671f;border-color:rgba(255,105,0,.45);background:rgba(255,101,23,.07)}
body.facility .sobj{color:rgba(222,230,238,.88);font-weight:550}
body.facility .skill-body{background:transparent;border-top:1px solid rgba(150,165,180,.10)}
body.facility .skill-body .k{color:rgba(160,174,190,.62)}
body.facility .skill-body .v{color:rgba(206,216,226,.76)}
body.facility .kv.ask .v{color:#f0f4f8}

body.facility footer{border-top:1px solid rgba(150,165,180,.14);background:rgba(2,5,7,.55);
  color:rgba(160,174,190,.6)}
html.orb-open body.facility footer .wrap{padding-right:calc(var(--orb-w, 0px) + 46px)}
@media(max-width:1199px){ html.orb-open body.facility footer .wrap{padding-right:22px} }

/* ── left calibration rail, matching the public pages ── */
body.facility .fac-rail{
  position:fixed;left:clamp(6px,1vw,18px);top:96px;bottom:96px;width:12px;z-index:3;pointer-events:none;
}
body.facility .fac-rail .rail-line{position:absolute;left:5px;top:0;bottom:0;width:1px;
  background:linear-gradient(to bottom,rgba(255,102,20,.05),rgba(255,102,20,.42) 14%,
    rgba(255,102,20,.42) 86%,rgba(255,102,20,.05))}
body.facility .fac-rail i{position:absolute;left:0;width:11px;height:1px;background:rgba(255,140,60,.34)}
body.facility .fac-sys{
  position:fixed;left:clamp(4px,.9vw,16px);bottom:34px;z-index:3;pointer-events:none;
  font-family:var(--mono);font-size:8.5px;letter-spacing:.14em;line-height:1.5;
  color:rgba(255,102,20,.62);text-align:center;
}
@media(max-width:1100px){ body.facility .fac-rail, body.facility .fac-sys{display:none} }
