/* Cinder Signal opening titles and the original field interface. */

/* ---------- Cinder Signal opening + original field interface ---------- */
#cold-open{position:fixed;inset:0;z-index:48;display:flex;align-items:flex-end;pointer-events:none;opacity:0;
  padding:0 0 clamp(92px,13vh,150px) clamp(34px,6vw,104px);transition:opacity .65s ease;
  background:linear-gradient(90deg,rgba(0,0,0,.7),transparent 58%),linear-gradient(0deg,rgba(0,0,0,.5),transparent 45%)}
#cold-open.active{opacity:1}
#cold-open.recede{opacity:0}
.co-card{max-width:min(660px,78vw);padding-left:17px;border-left:3px solid #b98442;
  filter:drop-shadow(0 4px 12px #000)}
#co-kicker{color:#b98442;font:700 10px/1.2 "Courier New",monospace;letter-spacing:.26em;text-transform:uppercase}
#co-title{margin-top:9px;color:#d8d0ba;font:800 clamp(28px,4.7vw,62px)/.92 "Arial Narrow","Franklin Gothic Medium",sans-serif;
  letter-spacing:.04em;text-transform:uppercase;text-shadow:2px 3px #000}
#co-sub{margin-top:10px;color:#858174;font:700 10px/1.4 "Courier New",monospace;letter-spacing:.2em;text-transform:uppercase}
#signal-subtitle{position:fixed;z-index:49;left:50%;bottom:12%;width:min(760px,86vw);transform:translateX(-50%);
  color:#d8d0ba;text-align:center;font:700 13px/1.5 "Courier New",monospace;letter-spacing:.07em;text-shadow:0 2px 8px #000;
  opacity:0;transition:opacity .22s;pointer-events:none}
#signal-subtitle.show{opacity:1}
#signal-subtitle b{color:#c39555}
#mission{position:absolute;left:31px;top:27px;width:min(390px,42vw);padding:11px 15px 12px 18px;
  color:#bbb39f;background:linear-gradient(90deg,rgba(13,14,11,.88),rgba(13,14,11,.62),transparent);
  border-left:3px solid #b98442;opacity:0;transform:translateX(-14px);transition:opacity .25s,transform .25s}
#mission.show{opacity:1;transform:none}
#mission-kicker{color:#b98442;font:700 9px/1 "Courier New",monospace;letter-spacing:.25em;text-transform:uppercase}
#mission-title{margin-top:6px;color:#ded5bf;font:800 16px/1.08 "Arial Narrow","Franklin Gothic Medium",sans-serif;
  letter-spacing:.09em;text-transform:uppercase;text-shadow:1px 2px #000}
#mission-detail{margin-top:5px;color:#77766d;font:700 9px/1.35 "Courier New",monospace;letter-spacing:.08em;text-transform:uppercase}
#objective-marker{position:absolute;left:50%;top:50%;display:none;min-width:56px;transform:translate(-50%,-50%);
  color:#d8c495;text-align:center;font:700 9px/1 "Courier New",monospace;letter-spacing:.12em;text-shadow:0 1px 4px #000}
#objective-marker.show{display:block}
#objective-marker:before{content:"";display:block;width:11px;height:11px;margin:0 auto 7px;border:1px solid #d0a15e;
  background:rgba(118,76,30,.24);transform:rotate(45deg);box-shadow:0 0 13px rgba(211,152,70,.46);
  animation:signalMarker 1.1s ease-in-out infinite}
@keyframes signalMarker{50%{transform:rotate(45deg) scale(1.35);opacity:.55}}
#hud.opening #round-box,#hud.opening #points-box{opacity:.18}

/* The round display and points readout replace slash tallies and soda-style badges. */
#round-box{left:auto;right:33px;top:28px;bottom:auto;text-align:right;filter:none}
#round-tally{display:none!important}
#round-num{display:block;color:#c29858;font:800 34px/1 "Courier New",monospace;font-style:normal;letter-spacing:.08em;
  text-shadow:1px 2px #000;transform:none}
#round-num:before{content:"ROUND";display:block;margin-bottom:4px;color:#686a60;font:700 8px/1 "Courier New",monospace;letter-spacing:.24em}
#points-box{left:auto;right:34px;top:91px;bottom:auto;padding:0 12px 0 0;text-align:right}
#points-box:before{left:auto;right:0;top:4px;width:3px;height:29px;background:#9c7139;transform:none;box-shadow:0 0 7px rgba(156,113,57,.55)}
#points{color:#d4cbb6;font-family:"Courier New",monospace;font-size:25px;font-weight:800;letter-spacing:.04em}
#points:after{content:"FIELD SCRIP // RECOVERY TWO";color:#696a61;font-size:7px;letter-spacing:.12em}
#perks{left:auto;right:32px;bottom:116px;flex-direction:column;gap:5px}
.perk-chip{width:31px;height:31px;border-radius:2px;border-color:rgba(205,180,127,.3);font:800 13px/1 "Courier New",monospace;
  filter:sepia(.55) saturate(.58);box-shadow:0 2px 5px #000,inset 0 0 9px #000}

@media(max-width:800px){
  .title-content{margin-left:28px;width:calc(100vw - 56px);padding-top:8vh}
  .controls-panel{display:none}
  h1.game-title{font-size:clamp(46px,15vw,78px)}
  .eyebrow{max-width:88vw;font-size:9px}
  .mbtn{min-width:270px}
  #zcount,#killfeed{display:none}
  #mission{left:16px;top:16px;width:min(350px,70vw)}
  #points-box{left:auto;right:18px;top:80px;bottom:auto}
  #round-box{left:auto;right:18px;top:18px;bottom:auto}
  #ammo-box{right:20px;bottom:20px;transform:scale(.86);transform-origin:right bottom}
  #perks{left:auto;right:18px;bottom:112px}
  #vm-img{width:clamp(700px,96vw,920px)}
}
@media(max-height:690px){
  .title-content{transform:scale(.84);transform-origin:left center}
  .controls-panel{display:none}
}