:root{--background:#090a09;--surface:#121312;--surface-raised:#171817;--foreground:#eceeec;--muted:#949894;--faint:#626662;--border:#262826;--border-strong:#363936;--accent:#82e600;--accent-dark:#182900;--font-sans:Inter, "Helvetica Neue", Arial, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;color:var(--foreground);background:var(--background);font-family:var(--font-sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.5}*{box-sizing:border-box}html{background:#050605;min-width:320px;min-height:100%}body{background:#050605;min-width:320px;min-height:100svh;margin:0}button,input,select{font:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button{-webkit-tap-highlight-color:transparent}#app,.app-shell{min-height:100svh}.app-shell{background:#050605}.shell-inner{border-inline:1px solid var(--border);background:var(--background);width:min(100%,720px);min-height:100svh;margin:0 auto;position:relative;overflow:hidden}.app-header{border-bottom:1px solid #171917;justify-content:space-between;align-items:center;gap:20px;min-height:68px;padding:10px 16px;display:flex}.brand-lockup{align-items:center;gap:12px;min-width:0;display:flex}.brand-mark{background:var(--accent-dark);width:38px;height:38px;color:var(--accent);border:1px solid #2c4a05;border-radius:12px;flex:none;place-items:center;padding:0;display:grid}.brand-mark .icon{width:21px;height:21px}.brand-copy{gap:1px;min-width:0;display:grid}.brand-line{align-items:center;gap:9px;display:flex}.brand-name{font-size:15px;line-height:1.25}.status-badge{height:18px;color:var(--accent);letter-spacing:1.2px;text-transform:uppercase;background:#142500;border-radius:999px;align-items:center;gap:5px;padding:0 8px;font-size:9px;font-weight:800;display:inline-flex}.status-dot{background:currentColor;border-radius:50%;width:5px;height:5px;box-shadow:0 0 8px}.stream-summary{color:var(--muted);white-space:nowrap;font-size:11px}.header-action{width:38px;height:38px;color:var(--foreground);cursor:pointer;background:0 0;border:0;border-radius:9px;flex:none;place-items:center;padding:0;display:grid}.header-action:hover,.header-action-active{background:var(--surface-raised);color:var(--accent)}.header-action .icon{width:21px;height:21px}.content{padding-bottom:73px}.page-content{min-height:calc(100svh - 132px);padding:28px 18px 92px}.page-title{color:var(--foreground);margin:0;font-size:22px;line-height:1.2}.page-description{max-width:34rem;color:var(--muted);margin:10px 0 0;font-size:14px;line-height:1.5}.search-wrap{border:1px solid var(--border-strong);background:var(--surface);border-radius:8px;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:8px;height:44px;margin:10px 16px;padding:0 12px;display:grid}.search-wrap .icon{width:18px;height:18px;color:var(--muted)}input[type=search]{width:100%;min-width:0;color:var(--foreground);background:0 0;border:0;outline:0;font-size:13px}input[type=search]::placeholder{color:var(--faint)}input[type=search]::-webkit-search-cancel-button{display:none}.message-panel{min-height:120px}.empty-state{min-height:220px;color:var(--muted);place-items:center;font-size:13px;display:grid}.message-list{display:grid}.message-row{border-bottom:1px solid var(--border);background:var(--surface);gap:5px;padding:12px 16px 13px;display:grid}.message-row:nth-child(2n){background:#111211}.message-meta{justify-content:space-between;align-items:baseline;gap:16px;min-width:0;display:flex}.stream-name{min-width:0;color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:700;overflow:hidden}time{color:var(--muted);font-family:var(--font-mono);letter-spacing:.2px;flex:none;font-size:10px}.message-text{color:#d6d8d6;overflow-wrap:anywhere;white-space:pre-wrap;margin:0;font-size:14px;line-height:1.4}.audio-row{grid-template-columns:34px minmax(80px,1fr) auto;align-items:center;gap:10px;min-width:0;min-height:36px;margin-top:3px;display:grid}.play-button{border:1px solid var(--border-strong);background:var(--surface-raised);color:#a5a8a5;cursor:pointer;border-radius:50%;place-items:center;width:34px;height:34px;padding:0;display:grid}.play-button:hover,.play-button-active{color:var(--accent);border-color:#547d1e}.play-button-active{border-color:var(--accent);background:var(--accent);color:#142000}.play-button .icon{width:15px;height:15px}.waveform-track{width:min(100%,220px);min-width:0;height:30px;position:relative}.waveform-bars{pointer-events:none;align-items:center;gap:2px;display:flex;position:absolute;inset:0}.waveform-bar{background:#3b3f3b;border-radius:2px;flex:2px;width:2px;max-width:3px;height:8px;transition:background-color .1s linear}.waveform-bar:nth-child(7n+1){height:7px}.waveform-bar:nth-child(7n+2){height:14px}.waveform-bar:nth-child(7n+3){height:20px}.waveform-bar:nth-child(7n+4){height:11px}.waveform-bar:nth-child(7n+5){height:24px}.waveform-bar:nth-child(7n+6){height:16px}.waveform-bar:nth-child(7n){height:9px}.waveform-track-active .waveform-bar{background:#4a4e4a}.waveform-bar-played,.waveform-track-active .waveform-bar-played{background:var(--accent);box-shadow:0 0 5px #82e60038}.progress-input{z-index:1;opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.playback-time{color:var(--muted);font-family:var(--font-mono);white-space:nowrap;font-size:10px}.live-resume{z-index:20;color:#e9eee5;cursor:pointer;background:#182412;border:1px solid #527f18;border-radius:999px;align-items:center;gap:8px;min-height:40px;padding:7px 9px 7px 12px;font-size:11px;font-weight:700;display:flex;position:fixed;bottom:78px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #00000075,inset 0 0 0 1px #82e60014}.live-resume:hover{border-color:var(--accent);background:#203018}.live-resume>.icon{width:15px;height:15px;color:var(--accent)}.live-resume-label{white-space:nowrap}.unread-badge{background:var(--accent);color:#122000;min-width:22px;height:22px;font-family:var(--font-mono);border-radius:999px;place-items:center;padding:0 6px;font-size:10px;font-weight:800;display:grid}.bottom-nav{z-index:10;border-top:1px solid var(--border);border-inline:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#090a09f5;grid-template-columns:repeat(4,1fr);width:min(100%,720px);min-height:64px;display:grid;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.nav-item{color:#8b8e8b;cursor:pointer;background:0 0;border:0;align-content:center;place-items:center;gap:2px;min-width:0;padding:6px 4px;font-size:9px;text-decoration:none;display:grid;position:relative}.nav-item:disabled{opacity:1}.nav-item .icon{width:19px;height:19px}.nav-item-active{color:var(--accent)}.nav-item-active:before{content:"";background:var(--accent);border-radius:0 0 2px 2px;width:28px;height:2px;position:absolute;top:-1px}.icon{display:block}.play-button-active .ph-icon{animation:none}@media (width<=520px){.shell-inner,.bottom-nav{border-inline:0}.message-text{font-size:13.5px;line-height:1.38}.playback-time{font-size:9px}}@media (prefers-reduced-motion:no-preference){.play-button-active .ph-icon-spinner-gap{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}}