/* Phone watch mode (channel pages). Classes are set by mobile-watch.js only at phone widths. */
.mw-switch,.mw-back,.mw-reactions{display:none}
@media (max-width:760px){
 /* Immersive page: no site header, no bottom tabs; the watch layout fills the screen. */
 html.mw .topbar,html.mw .mnav,html.mw .wc-view-toolbar,html.mw .footer,html.mw .msub{display:none!important}
 html.mw,html.mw body{overflow:hidden!important;overscroll-behavior:none}
 html.mw body{padding-bottom:0!important}
 html.mw .content{padding:0!important;margin:0!important}
 html.mw #page{padding:0!important;margin:0!important}
 html.mw .watch-layout.wc-channel{position:fixed;inset:0;z-index:40;display:flex!important;flex-direction:column!important;gap:0!important;margin:0!important;padding:env(safe-area-inset-top,0px) 0 0!important;height:100dvh;background:#0e0e12;max-width:none!important}
 html.mw .wc-main{flex:none;display:flex!important;flex-direction:column;min-height:0;margin:0!important;padding:0!important;max-width:none!important}
 /* Video: edge to edge with a back button on top. */
 html.mw #player{position:relative;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;flex:none;background:#000}
 html.mw #player .custom-player-wrap,html.mw #player video{border-radius:0!important}
 html.mw .mw-back{display:grid;place-items:center;position:absolute;top:var(--mw-back-top,10px);left:10px;z-index:30;width:34px;height:34px;margin:0;padding:0!important;border-radius:17px!important;border:0!important;background:rgba(0,0,0,.5)!important;color:#fff!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);filter:none!important}
 html.mw .mw-back svg{width:20px;height:20px}
 html.mw #player .player-live-badge{margin-left:42px!important}
 /* Compact channel bar. */
 html.mw .wc-channel-head{display:grid!important;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:8px 11px!important;margin:0!important;padding:11px 14px 9px!important;border:0!important;border-radius:0!important;background:#0e0e12!important;box-shadow:none!important}
 html.mw .wc-channel-avatar{width:42px!important;height:42px!important;min-width:42px;padding:0!important;margin:0!important}
 html.mw .wc-channel-avatar .avatar{width:42px!important;height:42px!important}
 html.mw .wc-channel-avatar>span:last-child:not(.avatar){font-size:8px!important;padding:1px 5px!important;bottom:-5px!important}
 html.mw .wc-channel-identity{min-width:0;gap:1px!important;display:flex!important;flex-direction:column}
 html.mw .wc-name h1{font-size:16px!important;line-height:1.3!important;margin:0!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 html.mw .wc-stream-title{font-size:12.5px!important;line-height:1.5!important;margin:0!important;color:#c9c9d4!important;font-weight:500!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 html.mw .wc-channel-subline{font-size:11px!important;color:#8d8d9b}
 html.mw .wc-tags{display:none!important}
 html.mw .wc-channel-actions{grid-column:1/-1;display:flex!important;flex-wrap:nowrap!important;align-items:center;gap:7px!important;margin:2px 0 0!important;padding:0!important;overflow-x:auto}
 html.mw .wc-channel-actions .btn{flex:1 1 auto;min-height:36px!important;height:36px;margin:0!important;padding:0 10px!important;border-radius:10px!important;font-size:12.5px!important;white-space:nowrap;justify-content:center}
 html.mw .wc-channel-actions .wc-icon-btn{flex:none;width:36px!important;height:36px!important;border-radius:10px!important;background:#1c1c23!important}
 html.mw #report{display:none!important}
 /* Chat / Channel switch. */
 html.mw .mw-switch{display:flex;gap:4px;margin:0 14px 8px;padding:3px;border-radius:12px;background:#1a1a21;flex:none}
 html.mw .mw-switch button{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:36px;margin:0;padding:0 10px!important;border:0!important;border-radius:9px!important;background:transparent!important;color:#a3a3b0!important;font-size:13.5px!important;font-weight:600!important;filter:none!important}
 html.mw .mw-switch button.on{background:#2a2a33!important;color:#fff!important}
 html.mw .mw-unread{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:#b4ff63;color:#14180f;font-size:10px;font-weight:700;display:inline-grid;place-items:center}
 html.mw .mw-unread[hidden]{display:none}
 /* Channel mode: the original tabs and panels, scrolling under the bar. */
 html.mw.mw-about .wc-main{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
 html.mw.mw-about .wc-chat-column{display:none!important}
 html.mw.mw-about .wc-tabs{position:sticky;top:0;z-index:5;background:#0e0e12}
 html.mw.mw-about .wc-panel{padding-inline:14px!important}
 html.mw.mw-about #player{position:sticky;top:0;z-index:6}
 /* Chat mode: chat fills the rest of the screen, typing stays at the bottom. */
 html.mw.mw-chat .wc-tabs,html.mw.mw-chat .wc-panel{display:none!important}
 html.mw.mw-chat .wc-chat-column{flex:1;min-height:0;display:flex!important;flex-direction:column;margin:0!important;padding:0!important;border:0!important;width:auto!important;max-width:none!important;position:static!important;height:auto!important;background:#0e0e12}
 html.mw.mw-chat .wc-chat{flex:1;min-height:0;display:flex!important;flex-direction:column;height:auto!important;max-height:none!important;margin:0!important;border:0!important;border-top:1px solid #1f1f27!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
 html.mw .wc-chat-header,html.mw .wc-chat-welcome{display:none!important}
 html.mw #chatlog{flex:1;min-height:0;overflow-y:auto!important;padding:10px 14px 6px!important;max-height:none!important;height:auto!important;scroll-behavior:smooth}
 html.mw #chatlog .wc-chat-empty{margin:auto;opacity:.8}
 html.mw #chatlog .message{position:relative;padding:5px 2px!important;margin:0!important;font-size:14.5px!important;line-height:1.6!important;border-radius:8px;animation:mw-in .22s ease-out;overflow-wrap:anywhere}
 html.mw #chatlog .message .author-name{font-weight:700}
 html.mw #chatlog .message .message-body{color:#ececf2}
 html.mw #chatlog .message.mw-mention{background:rgba(180,255,99,.08);box-shadow:inset 3px 0 0 #b4ff63;padding:6px 10px!important}
 html.mw #chatlog .message.mw-emoji .message-body{font-size:22px;vertical-align:middle}
 html.mw .wc-chat-jump{position:absolute!important;bottom:150px!important;left:50%!important;right:auto!important;transform:translateX(-50%)!important;z-index:5;border-radius:18px!important;padding:7px 14px!important;font-size:12px!important;background:#b4ff63!important;color:#14180f!important;box-shadow:0 6px 18px rgba(0,0,0,.45)!important}
 @keyframes mw-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
 /* Composer: reactions row, then support · message · emoji in one line. */
 html.mw .wc-chat-composer{flex:none;display:flex!important;flex-wrap:wrap;align-items:center;gap:8px!important;margin:0!important;padding:8px 12px max(12px,calc(env(safe-area-inset-bottom,0px) + 4px))!important;border-top:1px solid #1f1f27!important;background:#131318!important}
 html.mw .mw-reactions{display:flex;flex-basis:100%;order:0;gap:6px;overflow-x:auto}
 html.mw .mw-reactions button{flex:1;min-width:40px;height:34px;margin:0;padding:0!important;border:1px solid #2a2a33!important;border-radius:17px!important;background:#1c1c23!important;font-size:18px!important;line-height:1;filter:none!important;transition:transform .12s}
 html.mw .mw-reactions button:active{transform:scale(1.25)}
 html.mw #chatTipBtn{order:1;flex:none;width:44px!important;height:44px!important;min-height:44px;margin:0!important;padding:0!important;border-radius:22px!important;justify-content:center}
 html.mw #chatTipBtn>span:not(.w-coin-mark),html.mw #chatTipBtn>svg{display:none!important}
 html.mw .wc-chat-composer #chatForm{order:2;flex:1 1 0;min-width:0;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center;gap:6px!important;margin:0!important;padding:0!important}
 html.mw .wc-chat-composer #chatForm #chatInput{flex:1 1 auto;width:auto!important;min-width:0;height:44px!important;min-height:44px!important;margin:0!important;padding:0 16px!important;border-radius:22px!important;border:1px solid #2f2f39!important;background:#0e0e12!important;font-size:16px!important;line-height:44px!important;box-sizing:border-box}
 html.mw .wc-chat-composer #chatForm #chatInput:focus{border-color:#b4ff63!important;outline:none}
 html.mw .wc-chat-composer #chatForm .actions{flex:none;margin:0!important;padding:0!important;display:flex!important;gap:0}
 html.mw .wc-chat-composer #chatForm .actions .muted{display:none!important}
 /* Send: a round green button with the arrow only. */
 html.mw .wc-chat-composer #chatForm .actions button{display:grid!important;place-items:center;width:44px!important;height:44px!important;min-width:44px;min-height:44px;padding:0!important;margin:0!important;border-radius:22px!important;font-size:0!important;gap:0!important}
 html.mw .wc-chat-composer #chatForm .actions button{position:relative!important;overflow:hidden;color:#14180f!important;background:#b4ff63!important;border:0!important;transition:transform .12s ease,background .15s ease}
 html.mw .wc-chat-composer #chatForm .actions button:active{transform:scale(.92)}
 /* The arrow sits exactly in the middle of the circle (the hidden "send" text no longer pushes it down). */
 html.mw .wc-chat-composer #chatForm .actions button svg{position:absolute!important;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;width:21px!important;height:21px!important;margin:0!important;transform:translate(-50%,-50%)!important;stroke-width:2.3}
 html.mw .wc-chat-tools{order:3;flex:none;margin:0!important;padding:0!important;gap:4px!important}
 html.mw .wc-chat-tools small{display:none!important}
 html.mw .wc-chat-tools .wc-icon-btn{width:36px!important;height:36px!important;font-size:18px!important}
 html.mw #wcEmojiGrid{order:4;flex-basis:100%}
 /* Floating reactions over the video. */
 .mw-float{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:25}
 .mw-float span{position:absolute;bottom:18%;inset-inline-end:var(--x);font-size:30px;animation:mw-rise var(--dur,2.6s) ease-out forwards;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
 @keyframes mw-rise{0%{opacity:0;transform:translate(0,10px) scale(.6)}12%{opacity:1;transform:translate(0,0) scale(1.15)}100%{opacity:0;transform:translate(var(--drift),-170px) scale(.9)}}
 /* Turning the phone sideways opens the full-screen player (player-mobile.js). */
}