.an42-stream-page,.an42-stream-section { --as-bg:#101827; --as-border:rgba(255,255,255,.12); --as-text:#e5e7eb; --as-muted:#a8b4c8; --as-blue:#60a5fa; color:var(--as-text); }
.an42-stream-page { max-width:1440px; margin:30px auto 55px; padding:0 22px; }
.an42-stream-page *,.an42-stream-section * { box-sizing:border-box; }
.an42-stream-page a,.an42-stream-section a { color:#93c5fd; }
.an42-stream-page .btn,.an42-stream-section .btn { text-decoration:none; }
.an42-stream-page .btn.primary,.an42-stream-section .btn.primary { color:#fff; }
.an42-stream-page [hidden],.an42-stream-section [hidden] { display:none!important; }
.an42-stream-page button,.an42-stream-section button { cursor:pointer; }
.an42-stream-page button:disabled { opacity:.6; cursor:default; }
.an42-stream-page :focus-visible,.an42-stream-section :focus-visible { outline:3px solid #93c5fd; outline-offset:3px; }
.an42-stream-heading,.an42-stream-section-head,.an42-stream-channel-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.an42-stream-heading { margin-bottom:25px; }
.an42-stream-heading h1 { font-size:clamp(28px,4vw,42px); margin:8px 0; line-height:1.2; }
.an42-stream-heading p,.an42-stream-section-head p { color:var(--as-muted); margin:6px 0; }
.an42-stream-eyebrow { color:var(--as-blue); font-size:11px; letter-spacing:1.7px; font-weight:800; text-transform:uppercase; }
.an42-stream-buttons { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.an42-stream-section { margin:26px 0; border:1px solid var(--as-border); border-radius:16px; padding:24px; background:linear-gradient(140deg,rgba(21,38,66,.8),rgba(15,23,42,.8)); }
.an42-stream-section-head { margin-bottom:22px; }
.an42-stream-section-head h2 { margin:8px 0; font-size:25px; }
.an42-stream-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.an42-recording-preview { display:block; width:100%; aspect-ratio:16/9; background:#050914; border-radius:9px; margin:16px 0; }
.an42-background-tools { margin-bottom:20px; }
.an42-background-tools p { margin:10px 0 0; }
.an42-studio-window .an42-stream-manage-layout { grid-template-columns:1fr; gap:16px; }
.an42-studio-window .an42-stream-player { min-height:0; height:auto; aspect-ratio:16/9; max-height:240px; }
.an42-studio-window .an42-stream-heading h1 { font-size:28px; }
.an42-studio-window .an42-stream-panel { padding:18px; }
.an42-stream-grid.forum-preview { grid-template-columns:repeat(4,minmax(0,1fr)); }
a.an42-stream-card { display:block; min-width:0; border:1px solid var(--as-border); border-radius:14px; overflow:hidden; background:var(--as-bg); text-decoration:none; transition:border-color .15s ease,transform .15s ease; }
a.an42-stream-card:hover { border-color:#60a5fa; transform:translateY(-2px); }
.an42-stream-art { aspect-ratio:16/9; padding:15px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; background:radial-gradient(ellipse at 65% 60%,rgba(59,130,246,.28),transparent 60%),linear-gradient(130deg,#152440,#0d1421); }
.an42-stream-play { align-self:center; font-size:28px; color:#bfdbfe; }
.an42-stream-source { color:#9caec9; font-size:10px; font-weight:800; letter-spacing:1.5px; }
.an42-stream-status { display:inline-block; padding:4px 9px; border:1px solid rgba(255,255,255,.14); border-radius:7px; background:#17243a; font-size:11px; color:#bfdbfe; font-weight:800; }
.an42-stream-status.live { background:#b91c1c; border-color:#ef4444; color:#fff; }
.an42-stream-card-copy { padding:17px; }
.an42-stream-card-copy h3 { color:#f3f4f6; margin:0 0 7px; font-size:17px; line-height:1.4; overflow-wrap:anywhere; }
.an42-stream-card-copy p,.an42-stream-card-copy small { color:var(--as-muted); margin:0; font-size:13px; overflow-wrap:anywhere; }
.an42-stream-empty,.an42-stream-panel { border:1px solid var(--as-border); border-radius:14px; background:var(--as-bg); padding:24px; }
.an42-stream-empty { text-align:center; padding:36px 24px; }
.an42-stream-empty p { color:var(--as-muted); }
.an42-stream-notice { padding:16px 20px; border:1px solid #2c5289; border-radius:10px; background:#13243d; color:#bfdbfe; }
.an42-stream-notice.error { background:#321922; border-color:#8e3448; color:#fecdd3; }
.an42-stream-muted { color:var(--as-muted); font-size:13px; line-height:1.65; }
.an42-stream-search { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:24px 0; }
.an42-stream-search label { font-weight:700; }
.an42-stream-search input { flex:1; min-width:180px; }
.an42-stream-page .form-input { display:block; border:1px solid #344155; border-radius:9px; padding:11px 13px; color:#e5e7eb; background:#0b1220; font:inherit; max-width:100%; }
.an42-stream-page textarea { resize:vertical; }
.an42-stream-manage-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:25px; align-items:start; }
.an42-stream-panel h2 { margin-top:0; font-size:22px; }
.an42-stream-panel h3 { margin-top:30px; }
.an42-stream-panel p { line-height:1.65; }
.an42-stream-form { display:grid; gap:12px; }
.an42-stream-form label { font-weight:700; font-size:14px; }
.an42-stream-form .form-input { width:100%; margin-bottom:6px; }
.an42-stream-form .btn { justify-self:start; }
.an42-stream-check { display:flex; align-items:center; gap:10px; }
.an42-stream-check input { width:18px; height:18px; }
.an42-stream-manage-layout aside .form-input { width:100%; margin:10px 0 18px; }
.an42-stream-breadcrumb { margin-bottom:22px; font-size:13px; }
.an42-stream-watch-layout { display:grid; grid-template-columns:minmax(0,1fr) 350px; gap:24px; align-items:start; }
.an42-stream-player { position:relative; aspect-ratio:16/9; min-height:300px; border:1px solid var(--as-border); border-radius:14px; overflow:hidden; background:#050910; }
.an42-stream-player video { display:block; position:absolute; inset:0; width:100%; height:100%; border:0; }
.an42-stream-player-placeholder { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center; text-align:center; padding:22px; background:radial-gradient(ellipse at 50% 50%,#162a4b,#080d17 75%); }
.an42-stream-player-placeholder>span { color:#93c5fd; font-size:34px; }
.an42-stream-player-placeholder h2 { margin:15px 0 8px; }
.an42-stream-player-placeholder p { font-size:13px; color:var(--as-muted); max-width:480px; }
.an42-stream-channel-heading { margin-top:24px; align-items:flex-start; }
.an42-stream-channel-heading h1 { font-size:26px; margin:12px 0 8px; line-height:1.3; overflow-wrap:anywhere; }
.an42-stream-channel-heading p { margin:0; color:var(--as-muted); }
.an42-stream-watch-layout section>.an42-stream-panel { margin-top:24px; }
.an42-stream-about { overflow-wrap:anywhere; white-space:normal; }
.an42-stream-chat { padding:20px; }
.an42-stream-chat-heading { display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--as-border); padding-bottom:14px; }
.an42-stream-chat-heading h2 { margin:0; font-size:20px; }
.an42-stream-chat-heading>span { color:var(--as-muted); font-size:12px; }
.an42-stream-messages { height:390px; overflow-y:auto; padding:14px 0; scrollbar-width:thin; overflow-wrap:anywhere; }
.an42-stream-message { padding:9px 0; border-bottom:1px solid rgba(255,255,255,.04); }
.an42-stream-message-head { display:flex; align-items:baseline; gap:7px; }
.an42-stream-message-head strong { font-size:13px; color:#93c5fd; overflow-wrap:anywhere; }
.an42-stream-message-head small { font-size:10px; color:#b6c3d5; }
.an42-stream-message-head time { margin-left:auto; font-size:10px; color:var(--as-muted); white-space:nowrap; }
.an42-stream-message p { margin:5px 0; font-size:14px; white-space:pre-wrap; line-height:1.5; }
.an42-stream-message-actions { display:flex; gap:10px; }
.an42-stream-message-actions button { border:0; color:#fca5a5; background:transparent; padding:2px 0; font-size:11px; }
.an42-stream-chat-form { display:grid; gap:8px; margin-top:14px; }
.an42-stream-chat-form label { font-size:12px; font-weight:700; }
.an42-stream-chat-form input,.an42-stream-chat-form textarea { width:100%; }
.an42-stream-feedback { color:#fcd34d; font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
@media (min-width:1800px) { .an42-stream-page { max-width:1560px; } .an42-stream-watch-layout { grid-template-columns:minmax(0,1fr) 400px; } }
@media (max-width:1100px) { .an42-stream-grid.forum-preview { grid-template-columns:repeat(2,minmax(0,1fr)); } .an42-stream-watch-layout { grid-template-columns:minmax(0,1fr) 310px; gap:18px; } }
@media (max-width:850px) { .an42-stream-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .an42-stream-watch-layout,.an42-stream-manage-layout { grid-template-columns:1fr; } .an42-stream-messages { height:330px; } .an42-stream-heading,.an42-stream-section-head,.an42-stream-channel-heading { align-items:flex-start; flex-direction:column; gap:15px; } }
@media (max-width:540px) { .an42-stream-page { padding:0 15px; } .an42-stream-section { padding:18px; } .an42-stream-grid,.an42-stream-grid.forum-preview { grid-template-columns:1fr; } .an42-stream-player { min-height:300px; aspect-ratio:auto; height:320px; } .an42-stream-panel { padding:20px; } .an42-stream-search input { min-width:100%; } }
