/* V3.4 // AUDIO + COMMUNICATIONS interaction layer */

/* AUDIO CHANNEL // compact tactical signal meter */
.audio-channel{position:relative;isolation:isolate;transition:border-color .24s ease,box-shadow .24s ease,transform .24s ease}
.audio-channel::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(110deg,transparent 0 42%,rgba(90,223,255,.045) 50%,transparent 58%);transform:translateX(-36%);transition:opacity .2s ease;z-index:0}
.audio-channel:hover{border-color:rgba(90,223,255,.36);box-shadow:0 18px 46px rgba(0,0,0,.34),0 0 24px rgba(90,223,255,.055)}
.audio-channel:hover::after{opacity:1;animation:audioPanelSweep 1.25s cubic-bezier(.18,.78,.24,1) both}
@keyframes audioPanelSweep{to{transform:translateX(48%)}}
.audio-channel__body,.operations-head{position:relative;z-index:2}
.audio-channel__line{position:relative!important;height:20px!important;margin:12px 0 10px!important;background:none!important;display:flex;align-items:flex-end;gap:3px;overflow:hidden;border-bottom:1px solid rgba(116,207,255,.2)}
.audio-channel__line::before{content:"SIGNAL";position:absolute;right:0;top:0;font:700 5px "Space Mono",monospace;letter-spacing:.12em;color:#55788e;opacity:.9}
.audio-signal-bar{width:3px;height:var(--h,7px);background:linear-gradient(180deg,#a9ecff,#58ddff 58%,rgba(88,221,255,.25));box-shadow:0 0 5px rgba(88,221,255,.24);opacity:.42;transform-origin:50% 100%;transition:opacity .18s ease,filter .18s ease}
.audio-channel.is-playing .audio-signal-bar{opacity:.92;animation:signalMeter .72s ease-in-out infinite alternate;animation-delay:var(--d,0s);filter:drop-shadow(0 0 3px rgba(88,221,255,.46))}
@keyframes signalMeter{0%{transform:scaleY(.42)}50%{transform:scaleY(1.18)}100%{transform:scaleY(.68)}}
.audio-channel__cover{position:relative;transition:border-color .22s ease,box-shadow .22s ease,filter .22s ease}
.audio-channel.is-playing .audio-channel__cover{border-color:rgba(90,223,255,.55)!important;box-shadow:0 0 18px rgba(90,223,255,.1),inset 0 0 24px rgba(90,223,255,.06);animation:coverSignal 2.8s ease-in-out infinite}
@keyframes coverSignal{0%,100%{filter:brightness(1)}50%{filter:brightness(1.08)}}

/* tactical transport buttons */
.audio-channel .player-controls button,.audio-channel__open,.feed-refresh,.send-terminal__submit{position:relative;overflow:hidden;isolation:isolate;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);transition:transform .16s cubic-bezier(.2,.8,.2,1),border-color .16s,color .16s,background .16s,box-shadow .16s!important}
.audio-channel .player-controls button::after,.audio-channel__open::after,.feed-refresh::after,.send-terminal__submit::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 0 36%,rgba(255,255,255,.16) 49%,transparent 62%);transform:translateX(-140%);transition:transform .34s ease}
.audio-channel .player-controls button:hover,.audio-channel__open:hover,.feed-refresh:hover,.send-terminal__submit:hover{transform:translateY(-2px);border-color:rgba(90,223,255,.68)!important;color:#dff9ff;box-shadow:0 0 16px rgba(90,223,255,.12)}
.audio-channel .player-controls button:hover::after,.audio-channel__open:hover::after,.feed-refresh:hover::after,.send-terminal__submit:hover::after{transform:translateX(140%)}
.audio-channel #playTrack{border-color:rgba(255,48,74,.42);color:#ff8b9b}
.audio-channel.is-playing #playTrack{border-color:rgba(57,231,166,.56)!important;color:#6dffc1;box-shadow:0 0 16px rgba(57,231,166,.1),inset 0 0 14px rgba(57,231,166,.035)}

/* COMMUNICATIONS TERMINAL // live console focus */
.communications-terminal{position:relative;isolation:isolate;transition:border-color .22s ease,box-shadow .22s ease}
.communications-terminal::after{content:"";position:absolute;left:12px;right:12px;top:39px;height:1px;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(255,48,74,.52),rgba(90,223,255,.44),transparent);opacity:.22;transform:scaleX(.38);transition:opacity .25s,transform .38s cubic-bezier(.2,.8,.2,1)}
.communications-terminal:focus-within{border-color:rgba(116,207,255,.4);box-shadow:0 18px 46px rgba(0,0,0,.32),0 0 30px rgba(90,223,255,.055)}
.communications-terminal:focus-within::after{opacity:.82;transform:scaleX(1)}
.send-terminal{position:relative;overflow:hidden;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease}
.send-terminal::before{content:"";position:absolute;left:0;right:0;top:-2px;height:2px;pointer-events:none;background:linear-gradient(90deg,transparent,#58ddff 35%,#ff304a 68%,transparent);opacity:0;transform:translateX(-70%)}
.send-terminal:focus-within{border-color:rgba(90,223,255,.38);background:rgba(3,14,23,.62);box-shadow:inset 0 0 26px rgba(90,223,255,.025)}
.send-terminal:focus-within::before{opacity:.82;animation:terminalFocusScan 1.2s cubic-bezier(.2,.75,.25,1) both}
@keyframes terminalFocusScan{to{transform:translateX(70%)}}
.send-terminal input[type="text"],.send-terminal textarea{transition:border-color .16s ease,box-shadow .16s ease,background .16s ease,transform .16s ease}
.send-terminal input[type="text"]:focus,.send-terminal textarea:focus{border-color:rgba(90,223,255,.62)!important;background:rgba(2,13,22,.94)!important;box-shadow:0 0 0 1px rgba(90,223,255,.08),inset 3px 0 0 rgba(90,223,255,.52),0 0 16px rgba(90,223,255,.045);outline:none;transform:translateX(2px)}
.send-terminal label:has(input[type="text"]:focus),.send-terminal label:has(textarea:focus){color:#a8dff4}
.send-terminal input[type="radio"],.send-terminal input[type="checkbox"]{accent-color:#58ddff}
.send-terminal fieldset label,.send-terminal .anonymous-toggle{transition:color .15s,text-shadow .15s}
.send-terminal fieldset label:hover,.send-terminal .anonymous-toggle:hover{color:#c7efff;text-shadow:0 0 8px rgba(90,223,255,.18)}

/* APPROVED FEED // incoming packet */
.approved-feed{position:relative;overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease}
.approved-feed.is-receiving{border-color:rgba(57,231,166,.44);box-shadow:inset 0 0 22px rgba(57,231,166,.025),0 0 18px rgba(57,231,166,.045)}
.approved-feed.is-receiving::after{content:"INCOMING TRANSMISSION";position:absolute;z-index:6;right:10px;top:7px;font:700 6px "Space Mono",monospace;letter-spacing:.1em;color:#55f0b4;text-shadow:0 0 8px rgba(57,231,166,.42);animation:incomingLabel 1.35s ease both}
@keyframes incomingLabel{0%{opacity:0;transform:translateX(12px)}18%,70%{opacity:1;transform:none}100%{opacity:0;transform:translateX(-5px)}}
.approved-feed .transmission-card.incoming{position:relative;overflow:hidden;animation:incomingCard .7s cubic-bezier(.16,.8,.25,1) both}
.approved-feed .transmission-card.incoming::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(57,231,166,.2),rgba(90,223,255,.08),transparent 68%);transform:translateX(-110%);animation:incomingCardSweep .75s ease both}
@keyframes incomingCard{0%{opacity:.25;transform:translateX(10px);border-color:rgba(57,231,166,.58)}100%{opacity:1;transform:none}}
@keyframes incomingCardSweep{to{transform:translateX(112%)}}
.feed-refresh.is-refreshing{animation:refreshSpin .58s cubic-bezier(.3,.7,.4,1)}
@keyframes refreshSpin{to{transform:rotate(360deg)}}

/* terminal response states */
.terminal-response{transition:color .2s,text-shadow .2s,opacity .2s}
.terminal-response:not(:empty){color:#7bdcff;text-shadow:0 0 8px rgba(90,223,255,.15)}

body.reduced-motion .audio-channel:hover::after,
body.reduced-motion .audio-channel.is-playing .audio-signal-bar,
body.reduced-motion .audio-channel.is-playing .audio-channel__cover,
body.reduced-motion .send-terminal:focus-within::before,
body.reduced-motion .approved-feed .transmission-card.incoming,
body.reduced-motion .approved-feed .transmission-card.incoming::before,
body.reduced-motion .approved-feed.is-receiving::after,
body.reduced-motion .feed-refresh.is-refreshing{animation:none!important}
body.reduced-motion .audio-channel .player-controls button:hover,
body.reduced-motion .audio-channel__open:hover,
body.reduced-motion .feed-refresh:hover,
body.reduced-motion .send-terminal__submit:hover,
body.reduced-motion .send-terminal input[type="text"]:focus,
body.reduced-motion .send-terminal textarea:focus{transform:none!important}

@media(max-width:700px){.audio-channel__line{height:16px!important}.audio-signal-bar{width:2px}.approved-feed.is-receiving::after{display:none}}