/* Hub home and admin pages. Builds on mtech.css. The hub is always dark. */
@import url("/assets/css/mtech.css");
.visually{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hubpage{background:#0B0D0E;--line:#262B30;--surface:#14181B}
.hubpage .bar{background:rgba(11,13,14,.72);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid #1d2227}
.hublogo{display:block;width:150px;height:26px;background:var(--logo) left center/contain no-repeat}
.bar .who{display:inline-flex;align-items:center;gap:12px;font-size:.82rem}
.bar .wrap{display:flex;align-items:center;justify-content:space-between}
section[hidden]{display:none}

/* hero */
.hubhero{position:relative;overflow:hidden;padding-block:clamp(56px,11vw,132px) 36px;isolation:isolate}
.hubhero::before{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(60% 70% at 88% 8%,rgba(242,86,77,.20),transparent 62%),radial-gradient(40% 50% at 8% 100%,rgba(242,86,77,.07),transparent 70%)}
.hubhero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.5;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(70% 80% at 85% 0%,#000,transparent 70%);mask-image:radial-gradient(70% 80% at 85% 0%,#000,transparent 70%)}
.signal{position:absolute;z-index:-1;right:clamp(-240px,-8vw,-60px);top:clamp(-120px,-4vw,-30px);width:clamp(420px,56vw,820px);aspect-ratio:1;display:grid;place-items:center;pointer-events:none}
.signal i{position:absolute;border-radius:50%;border:1px solid rgba(242,86,77,.34);aspect-ratio:1}
.signal .r1{width:24%}.signal .r2{width:44%;border-color:rgba(242,86,77,.26)}.signal .r3{width:66%;border-color:rgba(242,86,77,.17)}.signal .r4{width:90%;border-color:rgba(242,86,77,.1)}
.signal .core{width:9px;height:9px;border-radius:50%;background:var(--red);box-shadow:0 0 0 6px rgba(242,86,77,.16),0 0 60px 10px rgba(242,86,77,.55)}
.hubhero h1{font-family:var(--display);font-stretch:125%;font-weight:800;font-size:clamp(2.7rem,8.4vw,7.6rem);line-height:.94;letter-spacing:-.035em;color:#F2F3F3;max-width:11ch}
.hubhero h1 .ln{display:block}
.hubsub{margin-top:26px;max-width:46ch;font-size:clamp(1.02rem,1.5vw,1.18rem);color:#A8AFB5;line-height:1.55}

/* search */
.searchbox{position:relative;margin-top:40px;max-width:760px}
.searchbox .mag{position:absolute;left:22px;top:50%;translate:0 -50%;color:#7E868D;transition:color .2s}
.search{width:100%;font:inherit;font-size:1.2rem;height:68px;padding:0 64px 0 58px;border:1px solid #30363C;border-radius:14px;background:rgba(20,24,27,.86);color:#F2F3F3;box-shadow:0 1px 0 #ffffff0d inset,0 24px 60px -28px #000;transition:border-color .2s,box-shadow .25s}
.search::placeholder{color:#6F777E}
.search:focus-visible{outline:none;border-color:var(--red);box-shadow:0 0 0 4px rgba(242,86,77,.18),0 24px 70px -24px rgba(242,86,77,.45)}
.searchbox:focus-within .mag{color:var(--red)}
.slash{position:absolute;right:20px;top:50%;translate:0 -50%;font-family:var(--mono);font-size:.8rem;color:#8A9299;border:1px solid #353B41;border-bottom-width:2px;border-radius:6px;padding:2px 9px;background:#101316}
.searchbox:focus-within .slash{opacity:0}
.search::-webkit-search-cancel-button{display:none}
.says-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 10px;margin-top:20px;max-width:900px}
.saysl{font-size:.84rem;color:#7E868D;margin-right:4px}
.sayq{font:inherit;font-size:.9rem;color:#D7DADD;background:transparent;border:0;border-bottom:1px dashed #4a5258;padding:2px 0;margin-right:10px;cursor:pointer;text-align:left}
.sayq::before{content:"\201C";color:var(--red)}.sayq::after{content:"\201D";color:var(--red)}
.sayq:hover{color:#fff;border-bottom-color:var(--red)}
.sayq:focus-visible,.chip:focus-visible{outline:2px solid var(--red);outline-offset:3px;border-radius:4px}

/* filters */
.filters{display:grid;gap:12px;margin-top:34px;padding-top:24px;border-top:1px solid #20252A}
.fgroup{display:flex;gap:16px;align-items:baseline;flex-wrap:wrap}
.flab{font-size:.84rem;color:#7E868D;min-width:62px;flex:0 0 62px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font:inherit;font-size:.84rem;border:1px solid #30363C;background:transparent;color:#D7DADD;border-radius:999px;padding:6px 14px;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.chip:hover{border-color:#6a737b}
.chip[aria-pressed="true"]{background:var(--red);border-color:var(--red);color:#fff}
.note{font-size:.84rem;color:#8A9299;margin-top:16px;min-height:1.3em}
.ftresults{margin-top:18px;background:#14181B;border:1px solid #262B30;border-radius:14px;padding:22px 26px;max-width:900px}
.ftt{font-size:.84rem;color:#8A9299}
.ftresults ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:16px}
.ftresults li a{font-weight:600;color:#F2F3F3;text-decoration:none}
.ftresults li a:hover{color:var(--red-ink)}
.ftresults li small{display:block;color:#8A9299;font-size:.78rem}
.ftresults li p{font-size:.92rem;color:#A8AFB5;margin-top:2px}
.ftresults mark{background:rgba(242,86,77,.22);color:#fff;padding:0 2px;border-radius:2px}

/* document ledger */
.docs{padding-block:clamp(48px,7vw,84px) 0}
.dhead{display:flex;align-items:baseline;gap:14px}
.dhead h2{font-family:var(--display);font-stretch:118%;font-weight:760;font-size:clamp(1.6rem,3.2vw,2.4rem);letter-spacing:-.02em;color:#F2F3F3}
.dhead .count{font-size:.95rem;color:var(--red-ink)}
.dsub{color:#8A9299;margin-top:8px;max-width:56ch}
.units{margin-top:30px;border-top:1px solid #262B30}
.unit{position:relative;display:grid;grid-template-columns:18px minmax(0,1fr) minmax(220px,300px);gap:0 28px;padding:30px 20px 30px 0;border-bottom:1px solid #262B30;transition:background .25s}
.unit[hidden]{display:none}
.unit::before{content:"";position:absolute;left:0;top:-1px;bottom:-1px;width:0;background:linear-gradient(90deg,rgba(242,86,77,.16),transparent);transition:width .35s cubic-bezier(.2,.7,.2,1)}
.unit:hover::before,.unit:focus-within::before{width:100%}
.led{width:9px;height:9px;border-radius:50%;margin-top:.4rem;background:#4a5258;position:relative;z-index:1}
.led.ok{background:var(--ok);box-shadow:0 0 0 4px rgba(79,179,122,.16)}
.led.todo{background:var(--red);box-shadow:0 0 0 4px rgba(242,86,77,.16)}
.umain,.umeta,.uprobs{position:relative;z-index:1}
.utype{display:flex;gap:10px;align-items:center;font-size:.84rem;color:#8A9299}
.unit h3{font-family:var(--display);font-stretch:125%;font-weight:780;font-size:clamp(1.5rem,3vw,2.35rem);line-height:1.05;letter-spacing:-.025em;margin-top:6px}
.unit h3 a{color:#F2F3F3;text-decoration:none}
.unit h3 a::after{content:"";position:absolute;inset:0;z-index:2}
.unit h3 a:focus-visible{outline:2px solid var(--red);outline-offset:6px;border-radius:2px}
.unit .sum{font-size:1rem;color:#A8AFB5;margin-top:12px;max-width:62ch;line-height:1.55}
.tags{list-style:none;margin:16px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.tags li{font-size:.76rem;border:1px solid #30363C;border-radius:999px;padding:2px 10px;color:#D7DADD}
.tags li.sector{color:#8A9299}
.badges{display:flex;gap:6px}
.umeta{margin:0;display:grid;gap:12px;align-content:start;padding-top:4px;font-size:.88rem}
.umeta div{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid #20252A;padding-bottom:10px}
.umeta dt{color:#7E868D}.umeta dd{margin:0;color:#E4E6E8;text-align:right}
.umeta .m{font-family:var(--mono);font-variant-numeric:tabular-nums}
.uprobs{grid-column:2 / -1;display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.2,.7,.2,1)}
.uprobsin{overflow:hidden;min-height:0}
.unit:hover .uprobs,.unit:focus-within .uprobs{grid-template-rows:1fr}
.uprobsin p{font-size:.84rem;color:#7E868D;margin-top:22px}
.uprobsin ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.uprobsin li a{position:relative;z-index:3;color:#E4E6E8;text-decoration:none;font-family:var(--display);font-stretch:108%;font-weight:600;font-size:1.02rem}
.uprobsin li a::before{content:"\201C";color:var(--red)}.uprobsin li a::after{content:"\201D";color:var(--red)}
.uprobsin li a:hover{color:var(--red-ink)}
@media (hover:none),(max-width:760px){.uprobs{grid-template-rows:1fr}}
@media (max-width:760px){
  .unit{grid-template-columns:14px minmax(0,1fr);gap:0 16px;padding-block:26px}
  .umeta{grid-column:2;margin-top:20px}
  .uprobs{grid-column:2}
  .search{height:60px;font-size:1.05rem}
}

/* problem lines */
.prows{list-style:none;margin:30px 0 0;padding:0;border-top:1px solid #262B30;max-width:980px}
.prow{border-bottom:1px solid #262B30}
.prow[hidden]{display:none}
.prow a{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:16px 6px;text-decoration:none;color:#E4E6E8;transition:padding .25s,color .2s}
.prow a:hover{color:#fff;padding-left:16px}
.prow .says{font-family:var(--display);font-stretch:112%;font-weight:650;font-size:1.15rem;line-height:1.3}
.prow .says::before{content:"\201C";color:var(--red)}.prow .says::after{content:"\201D";color:var(--red)}
.prow .from{font-size:.82rem;color:#7E868D;white-space:nowrap}
.prow a:focus-visible{outline:2px solid var(--red);outline-offset:-2px}
.nofit{margin-top:24px;color:#A8AFB5}
@media (max-width:560px){.prow a{flex-direction:column;gap:2px}}
.hubpage footer{margin-top:clamp(64px,9vw,120px)}

/* one orchestrated entrance: the signal rings answer the headline */
@media (prefers-reduced-motion:no-preference){
  .signal i{animation:ping 1.9s cubic-bezier(.2,.7,.2,1) both}
  .signal .r1{animation-delay:.05s}.signal .r2{animation-delay:.2s}.signal .r3{animation-delay:.35s}.signal .r4{animation-delay:.5s}
  .signal .core{animation:corein .9s cubic-bezier(.2,.7,.2,1) both}
  .signal::after{content:"";position:absolute;width:24%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(242,86,77,.5);animation:pulse 5.5s 2.4s ease-out infinite}
  .hubhero:has(.search:focus) .signal .r1,.hubhero:has(.search:focus) .signal .r2{border-color:rgba(242,86,77,.6);transition:border-color .4s}
  @keyframes ping{from{transform:scale(.2);opacity:0}to{transform:scale(1);opacity:1}}
  @keyframes corein{from{transform:scale(0)}to{transform:scale(1)}}
  @keyframes pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.6);opacity:0}}
  .hubhero h1 .ln{animation:rise .8s cubic-bezier(.2,.7,.2,1) both}
  .hubhero h1 .ln:nth-child(2){animation-delay:.12s}
  @keyframes rise{from{opacity:0;transform:translateY(.3em)}to{opacity:1;transform:none}}
}

.adminpage td.m,.adminpage .m{font-family:var(--mono);font-variant-numeric:tabular-nums}
.adminpage .tw{overflow-x:auto;border:1px solid var(--line);border-radius:6px;background:var(--surface);margin-top:22px}
.adminpage .toolbar{display:flex;flex-wrap:wrap;gap:14px 24px;align-items:center;margin-top:24px}
.adminpage .toolbar label{display:flex;gap:8px;align-items:center;font-size:.88rem;cursor:pointer}
.adminpage .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin-top:24px}
.adminpage .stat{background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:14px 16px}
.adminpage .stat .h{font-size:.72rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.adminpage .stat .big{font-family:var(--mono);font-size:1.5rem;font-weight:500}
.btn{font:inherit;font-size:.86rem;font-weight:500;border:1px solid var(--ink);background:var(--ink);color:var(--bg);border-radius:999px;padding:7px 16px;cursor:pointer;text-decoration:none;display:inline-block}
.btn.ghost{background:transparent;color:var(--ink)}

a.badge{text-decoration:none}

/* refinements */
.hubhero::before{-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.fgroup{display:grid;grid-template-columns:62px minmax(0,1fr);align-items:start}
.fgroup .flab{padding-top:8px}
@media (max-width:560px){.fgroup{grid-template-columns:1fr;gap:8px}.fgroup .flab{padding-top:0}}
