/* CiegoLink Stream – Basis aus hub.css/srt.css (Broadcast Hub Design) */
@font-face{font-family:"DM Serif Display";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/dm-serif-display-400.woff2) format("woff2")}
@font-face{font-family:"DM Serif Display";font-style:italic;font-weight:400;font-display:swap;src:url(fonts/dm-serif-display-400-italic.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:400;font-display:swap;src:url(fonts/manrope-400.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:600;font-display:swap;src:url(fonts/manrope-600.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:700;font-display:swap;src:url(fonts/manrope-700.woff2) format("woff2")}
@font-face{font-family:"Manrope";font-weight:800;font-display:swap;src:url(fonts/manrope-800.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:500;font-display:swap;src:url(fonts/jetbrains-mono-500.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-weight:700;font-display:swap;src:url(fonts/jetbrains-mono-700.woff2) format("woff2")}
:root{--ink:#1F2126;--side:#191b1f;--line:#EAEAE21a;--line2:#EAEAE244;--sand:#EAEAE2;--teal:#198580;--serif:"DM Serif Display",Georgia,serif;--mono:"JetBrains Mono",monospace;--e:cubic-bezier(.2,.7,.2,1)}
*,*::before,*::after{box-sizing:border-box}
a{color:var(--teal);font-weight:700;text-decoration:none}
svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
[hidden]{display:none!important}
button{font:inherit}
::selection{background:var(--teal);color:#fff}
.hb-k{display:flex;align-items:center;gap:10px;font:700 11px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--teal);margin-bottom:22px}
.hb-k span{opacity:.6}
.hb-k::after{content:"";width:60px;height:1px;background:currentColor;opacity:.7}
.hb-live{display:flex;align-items:center;gap:8px;font:700 10px var(--mono);letter-spacing:.1em;text-transform:uppercase;opacity:.75}
.hb-live i{width:7px;height:7px;border-radius:50%;background:#30A46C;box-shadow:0 0 8px #30A46C}
:root{--ok:#30A46C;--bad:#E5484D;--warn:#F5A524}
body.sr{margin:0;min-height:100vh;font:400 15px/1.55 Manrope,system-ui,sans-serif;color:var(--sand);-webkit-font-smoothing:antialiased;
  background:radial-gradient(55% 50% at 15% 0%,#19858022,transparent 70%),radial-gradient(40% 45% at 100% 100%,#35405C44,transparent 70%),var(--ink);background-attachment:fixed}
.sr-in{max-width:1280px;margin:0 auto;padding:clamp(24px,5vh,56px) clamp(16px,4vw,48px) 0;min-height:100vh;display:flex;flex-direction:column}

/* Kopf */
.sr-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;margin-bottom:28px}
.sr-hd .hb-k{margin-bottom:14px}
.sr-hd h1{font:400 clamp(34px,4.4vw,60px)/1 var(--serif);letter-spacing:-.01em;margin:0}
.sr-sum{list-style:none;display:flex;margin:0;padding:0;border:1px solid var(--line2);border-radius:6px}
.sr-sum li{display:grid;padding:10px 20px;min-width:96px}
.sr-sum li+li{border-left:1px solid var(--line2)}
.sr-sum b{font:400 32px/1 var(--serif)}
.sr-sum span{font:700 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;opacity:.55;margin-top:6px}
.sr-sum .on b{color:var(--ok)}
.sr-sum.alarm .off b{color:var(--bad)}

/* Filter + Suche */
.sr-bar{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;margin-bottom:14px}
.sr-chips{display:flex;flex-wrap:wrap;gap:6px}
.sr-chips button{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid var(--line2);border-radius:99px;background:none;color:var(--sand);font:700 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;opacity:.7;cursor:pointer;transition:opacity .2s,background .2s,border-color .2s}
.sr-chips button:hover{opacity:1;border-color:var(--teal)}
.sr-chips button em{font-style:normal;font-weight:500;opacity:.6}
.sr-chips button.on{background:var(--teal);border-color:var(--teal);color:#fff;opacity:1}
.sr-chips button.on em{opacity:.85}
.sr-sep{width:1px;align-self:stretch;margin:6px 4px;background:var(--line2)}
.sr-chips button.hot:not(.on){border-color:#F5A52488;color:var(--warn);opacity:1}
.sr-search{display:flex;align-items:center;gap:10px;height:36px;width:min(300px,100%);padding:0 14px;border:1px solid var(--line2);border-radius:99px;transition:border-color .2s}
.sr-search:focus-within{border-color:var(--teal)}
.sr-search svg{flex:none;width:16px;height:16px;opacity:.5}
.sr-search input{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--sand);font:500 13px Manrope,system-ui,sans-serif;outline:none}
.sr-search input::placeholder{color:var(--sand);opacity:.4}

/* Hinweis */
.sr-msg{margin:0 0 14px;padding:14px 18px;border-left:3px solid var(--teal);background:#19858018;font-size:14px}
.sr-msg.warn{border-color:var(--warn);background:#F5A5241a}

/* Liste – eine Zeile pro Stream */
.sr-list{display:grid;gap:8px}
.sr-row{display:grid;grid-template-columns:150px minmax(180px,1.6fr) minmax(150px,1fr) minmax(150px,1fr) auto;align-items:center;gap:22px;padding:16px 22px;border:1px solid var(--line2);border-left:3px solid #30A46C88;border-radius:6px;background:#0000001a}
.sr-row:hover{background:#EAEAE208}
.sr-row.warn{border-left-color:var(--warn);background:#F5A5240a}
.sr-row.is-off{border-color:#E5484D66;border-left-color:var(--bad);background:#E5484D12}

.sr-pill{justify-self:start;display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:99px;font:700 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.sr-pill i{width:7px;height:7px;border-radius:50%;background:currentColor}
.is-on .sr-pill{color:var(--ok);background:#30A46C1f}
.is-on .sr-pill i{box-shadow:0 0 8px currentColor;animation:srPulse 2s infinite}
.warn .sr-pill{color:var(--warn);background:#F5A5241f}
.is-off .sr-pill{color:#ff8a8d;background:#E5484D26}

.sr-rn{display:grid;gap:3px;min-width:0;line-height:1.3}
.sr-rn b{font:400 19px/1.15 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sr-rn small{font:500 10.5px var(--mono);opacity:.5}

.sr-pt{display:flex;align-items:center;gap:10px;min-width:0}
.sr-pt>i{flex:none;width:9px;height:9px;border-radius:50%;background:var(--bad);box-shadow:0 0 7px var(--bad)}
.sr-pt.ok>i{background:var(--ok);box-shadow:0 0 7px var(--ok)}
.sr-pt span{display:grid;gap:2px;min-width:0;line-height:1.3}
.sr-pt small{font:700 9px var(--mono);letter-spacing:.12em;text-transform:uppercase;opacity:.5}
.sr-pt b{font:700 16px var(--mono)}
.sr-pt em{font:500 10px var(--mono);font-style:normal;opacity:.5}
.sr-pt.nok b{color:#ff8a8d}

/* Log */
.sr-lb{display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 12px;border:1px solid var(--line2);border-radius:99px;background:none;color:var(--sand);font:700 10px var(--mono);letter-spacing:.12em;text-transform:uppercase;opacity:.7;cursor:pointer;transition:opacity .2s,border-color .2s,background .2s}
.sr-lb:hover{opacity:1;border-color:var(--teal)}
.sr-lb i{width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .2s}
.open .sr-lb{opacity:1;background:var(--teal);border-color:var(--teal);color:#fff}
.open .sr-lb i{transform:rotate(-135deg) translateY(-1px)}
.sr-log{grid-column:1/-1;margin:2px 0 0;max-height:280px;overflow:auto;padding:14px 16px;border:1px solid var(--line);border-radius:6px;background:#00000040;font:500 11.5px/1.65 var(--mono);color:#EAEAE2cc;white-space:pre-wrap;word-break:break-all}
.sr-log .e{color:#ff8a8d}

/* Fuss */
.sr-ft{margin-top:auto;display:flex;justify-content:space-between;gap:8px 24px;flex-wrap:wrap;padding:40px 0 calc(20px + env(safe-area-inset-bottom));font:500 11px var(--mono);opacity:.6}
.hb-live.bad i{background:var(--warn);box-shadow:0 0 8px var(--warn)}

@keyframes srPulse{50%{opacity:.35}}

/* Tablet/Mobil: zweizeilig */
@media(max-width:860px){
  .sr-row{grid-template-columns:1fr 1fr;grid-template-areas:"p l" "n n" "i o" "g g";gap:12px 16px;padding:16px 18px}
  .sr-lb{grid-area:l;justify-self:end}
  .sr-log{grid-area:g}
  .sr-pill{grid-area:p}
  .sr-rn{grid-area:n}
  .sr-pt.pi{grid-area:i}
  .sr-pt.po{grid-area:o}
}
@media(max-width:640px){
  .sr-sum{width:100%}
  .sr-sum li{flex:1;min-width:0;padding:10px 14px}
  .sr-bar{flex-direction:column;align-items:stretch}
  .sr-search{width:100%}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Öffentliche Support-Seite (support/index.php) */
.sr-sub{margin:12px 0 0;font:500 12px var(--mono);opacity:.6}
.sr-sub code{font:inherit;opacity:1;color:var(--sand);padding:2px 6px;border:1px solid var(--line2);border-radius:4px;word-break:break-all}
.sp-top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:14px;height:60px;padding:0 clamp(16px,4vw,48px);border-bottom:1px solid var(--line);background:#1F2126e6;backdrop-filter:blur(8px)}
.sp-brand img{display:block;height:20px;width:auto}
.sp-tag{flex:1;font:700 10px var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--teal)}
.sp-top .hb-lang{margin:0}
.sp-land h1{font:400 clamp(40px,5.8vw,84px)/.98 var(--serif);letter-spacing:-.01em;margin:0}
.sp-lead{max-width:560px;margin:22px 0 28px;font-size:17px;opacity:.72}
.sp-links{font-size:15px}
.sr-ft a{color:var(--teal)}
