/* title */
#pg-title{align-items:center}
.ttl{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 48px 26px;margin:auto 0 6%;text-align:center;border-radius:14px;background:radial-gradient(ellipse at center,rgba(6,9,8,.72),rgba(6,9,8,.35) 60%,transparent 75%)}
.logo{font-family:var(--f-head);font-size:clamp(46px,11vw,118px);letter-spacing:2px;line-height:1;
  background:linear-gradient(180deg,#f4f6f6 0%,#b6bdc0 46%,#3e4548 50%,#8a9295 70%,#d9dddf 100%);-webkit-background-clip:text;background-clip:text;color:transparent;
  -webkit-text-stroke:2px var(--ink);filter:drop-shadow(0 4px 0 var(--ink)) drop-shadow(0 10px 18px rgba(0,0,0,.6))}
.tag{font:700 clamp(12px,2vw,17px) var(--f-tab);letter-spacing:6px;color:var(--g-hi);text-shadow:0 0 8px rgba(60,240,60,.6),0 2px 0 #000,0 0 3px #000}
.ttl .row{margin-top:16px}
.blink{margin-top:14px;font:12px var(--f-lcd);letter-spacing:4px;animation:blink 1.1s steps(2) infinite;color:var(--lcd);text-shadow:0 0 6px var(--lcd),0 1px 0 #000}
@keyframes blink{50%{opacity:0}}

/* mech select (v1.7): mechs in the hangar, pipe-framed console with CRT, tall green info screen */
#selHead{margin:10px 12px 0;padding:7px 12px;font-size:12px;line-height:1.5;align-self:flex-start;max-width:min(620px,calc(100% - 24px))}
#selHead b{font-size:13px;color:#fff}
#selView{flex:1;min-height:150px;cursor:pointer}
#selDeck{position:relative;padding:0 344px 12px 26px}
#selCon{position:relative;max-width:560px;padding:8px 14px 9px;border-radius:12px;border:2px solid #1d2022;
  background:var(--steelbar),var(--brushed);box-shadow:inset 0 2px 0 rgba(255,255,255,.55),inset 0 -3px 6px rgba(0,0,0,.4),0 10px 20px rgba(0,0,0,.6)}
#selCon::before{content:'';position:absolute;left:-16px;top:22%;bottom:22%;width:16px;border-radius:9px 0 0 9px;border:2px solid #1d2022;border-right:0;background:linear-gradient(180deg,#3a4042,#dfe3e4 35%,#99a0a2 62%,#3f4548)}
.conTop{display:flex;align-items:center;gap:10px;margin-bottom:7px;height:22px}
.vent{width:56px;height:14px;background:repeating-linear-gradient(90deg,#2a2e30 0 2px,#c8cccd 2px 5px);border:1px solid #2a2e30;border-radius:2px}
.knobs{display:flex;gap:3px}
.knobs b{width:18px;height:12px;background:linear-gradient(#f2f3f3,#9ba0a2);border:1px solid #2f3335;border-radius:2px}
.warn{width:22px;height:19px;background:#e7bf1d;clip-path:polygon(50% 0,100% 100%,0 100%);display:flex;align-items:flex-end;justify-content:center;font:900 12px Arial;color:#111;font-style:normal}
.brand{margin-left:auto;font:900 italic 15px var(--f-tab);letter-spacing:1px;color:#c7352a;text-shadow:0 1px 0 rgba(255,255,255,.55)}
.brand i{color:#2b3033;font-style:italic}
.crt{padding:6px;border-radius:14px;background:#1b1e1f;box-shadow:inset 0 0 0 2px #5a6063,inset 0 3px 8px #000,0 1px 0 rgba(255,255,255,.5)}
.crtIn{position:relative;display:flex;justify-content:space-around;align-items:stretch;height:118px;border-radius:10px;overflow:hidden;
  background:radial-gradient(ellipse at 50% 50%,#3f9435 0%,#1f5c1c 58%,#0b260b 100%);box-shadow:inset 0 0 26px rgba(0,0,0,.85)}
.crtIn::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.3) 0 1px,transparent 1px 3px),radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.12),transparent 45%);animation:crt 4s steps(40) infinite}
@keyframes crt{50%{opacity:.85}}
.mic{position:relative;flex:1;background:none;border:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#a6ff94;font:11px var(--f-lcd);letter-spacing:2px;opacity:.5;padding:6px 18px;text-shadow:0 0 4px #4dff3a}
.mic img{flex:1;min-height:0;width:100%;object-fit:contain;filter:drop-shadow(0 0 5px rgba(120,255,100,.55))}
.mic.sel{opacity:1}
.mic.sel::before,.mic.sel::after{content:'';position:absolute;top:8%;bottom:8%;width:12px;border:3px solid #a6ff94;box-shadow:0 0 7px #6dff5a}
.mic.sel::before{left:8%;border-right:0}.mic.sel::after{right:8%;border-left:0}
.mic:focus-visible{outline:1px dashed #a6ff94;outline-offset:-4px}
.conBot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;font:9px var(--f-lcd);color:#2c3133;letter-spacing:1px;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.pipeLink{position:absolute;left:calc(26px + min(560px,100% - 370px));right:330px;bottom:58px;height:34px;border:1px solid #16191a;border-width:1px 0;
  background:linear-gradient(180deg,#363b3d,#e3e6e7 33%,#9aa0a2 60%,#3d4346);box-shadow:0 6px 10px rgba(0,0,0,.5)}
#selInfo{position:absolute;right:14px;bottom:12px;width:316px;height:min(480px,calc(100% - 24px));display:flex;flex-direction:column;gap:8px;padding:8px 12px 10px;border-radius:9px;border:2px solid #1d2022;
  background:var(--steelbar),var(--brushed);box-shadow:inset 0 2px 0 rgba(255,255,255,.55),inset 0 -3px 6px rgba(0,0,0,.4),0 10px 22px rgba(0,0,0,.65)}
.infTop{display:flex;justify-content:space-between;font:9px var(--f-lcd);letter-spacing:1px;color:#2c3133;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.infScr{position:relative;flex:1;min-height:0;overflow:auto;padding:10px 12px;border-radius:6px;border:2px solid #23282a;background:linear-gradient(180deg,#3db532,#2a8c24 70%,#237a1e);
  color:#dcffd2;font-size:12px;line-height:1.5;text-shadow:0 0 4px rgba(200,255,190,.45);box-shadow:inset 0 0 18px rgba(0,0,0,.55)}
.infScr::after{content:'';position:sticky;display:block;bottom:-10px;height:0}
.infScr p{margin-bottom:10px}
.infScr .st{font-family:var(--f-lcd);font-size:12px;color:#f0ffe8}
.infScr .warnTxt{color:#fff2a0}
.sbars{display:grid;grid-template-columns:auto 1fr;gap:5px 10px;align-items:center;margin:4px 0 12px;font:11px var(--f-lcd);letter-spacing:1px;color:#f0ffe8}
.sbar{height:9px;background:rgba(0,40,0,.45);box-shadow:inset 0 0 0 1px rgba(0,30,0,.6)}
.sbar i{display:block;height:100%;background:repeating-linear-gradient(90deg,#e8ffd8 0 5px,transparent 5px 7px);box-shadow:0 0 6px rgba(220,255,200,.6)}
#selInfo .mbtn{width:100%}
.infGrille{flex:none;height:58px;display:flex;justify-content:center;gap:34px;border-radius:4px;border:1px solid #2a2e30;
  background:repeating-linear-gradient(180deg,#2a2e30 0 3px,#9aa0a2 3px 6px)}
.infGrille i{width:22px;background:linear-gradient(90deg,#3a3f41,#eef0f0 40%,#9aa0a2 65%,#3a3f41);border-left:1px solid #222;border-right:1px solid #222}