/* One DOM and one navigation state. Desktop keeps its existing composition. */
:root { --app-header-height: var(--header-height, 80px); --mobile-visual-height: 100dvh; --mobile-visual-offset-top: 0px; }
.mobile-nav-icon, .tab-label-short, .mobile-search-toggle, .mobile-menu-settings, .mobile-tool-label { display: none; }
.mobile-search-dialog:not([open]) { display: none; }
.mobile-context-toggle, .mobile-context-dialog:not([open]) { display: none; }
@media (max-width: 1180px), (max-width: 1366px) and (any-pointer: coarse) {
  :root { --header-height: var(--mobile-header-height, calc(112px + env(safe-area-inset-top, 0px))); --page-gutter: 16px; }
  body.mobile-shell-active { --header-height: var(--mobile-header-height, calc(112px + env(safe-area-inset-top, 0px))); }
  html { scroll-padding-top: calc(var(--app-header-height, var(--header-height)) + 12px); }
  body { min-width: 0; }
  body .shell, body.login-visible .shell { padding: var(--app-header-height, var(--header-height)) max(12px, env(safe-area-inset-right, 0px)) calc(24px + env(safe-area-inset-bottom, 0px)) max(12px, env(safe-area-inset-left, 0px)); }
  body .topbar { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px 44px; grid-template-rows: auto auto; align-items: center; align-content: start; gap: 0 4px; height: auto; min-height: 0; padding: env(safe-area-inset-top, 0px) max(4px, env(safe-area-inset-right, 0px)) 2px max(4px, env(safe-area-inset-left, 0px)); background: var(--header-surface); border-bottom: 1px solid var(--line-soft); z-index: 80; }
  body .topbar #mobile-menu { display: block; grid-column: 1; grid-row: 1; width: 44px; height: 48px; min-height: 44px; margin: 0; }
  body .topbar .brand { display: block; grid-column: 2; grid-row: 1; width: auto; min-width: 0; flex: none; margin: 0; padding: 10px 0; font-size: 1.25rem; line-height: 1.15; overflow-wrap: anywhere; white-space: normal; }
  body .topbar .header-tools { display: contents; }
  body .topbar .header-search { display: none; }
  body .mobile-search-toggle { position: relative; display: grid; place-items: center; grid-column: 3; grid-row: 1; width: 44px; height: 48px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 12px; color: var(--text); background: transparent; box-shadow: none; }
  .mobile-search-toggle::before { content: ''; display: block; width: 21px; height: 21px; background: currentColor; mask: var(--ui-search) center / contain no-repeat; -webkit-mask: var(--ui-search) center / contain no-repeat; }
  body .topbar #change-account { grid-column: 4; grid-row: 1; width: 44px; max-width: 44px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 12px; background: transparent; box-shadow: none; font-size: 0; }
  body .topbar #change-account::before { content: ''; display: block; width: 21px; height: 21px; margin: auto; background: currentColor; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='7' r='3' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M3 21v-3a7 7 0 0 1 11-5m1-4h7m-3-3 3 3-3 3' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10' cy='7' r='3' fill='none' stroke='black' stroke-width='1.7'/%3E%3Cpath d='M3 21v-3a7 7 0 0 1 11-5m1-4h7m-3-3 3 3-3 3' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat; }
  body .topbar .catalog-tabs { grid-column: 1 / -1; grid-row: 2; display: grid; grid-template-columns: repeat(7, minmax(44px, 1fr)); align-items: stretch; gap: 0; order: 0; width: 100%; min-width: 0; margin: 0; padding: 0; overflow: visible; }
  body .topbar .catalog-tabs button, body .topbar #tab-favorites { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 4px; min-width: 44px; width: 100%; min-height: 60px; height: auto; margin: 0; padding: 7px 2px 8px; border: 0; border-radius: 12px; font-size: .6875rem; line-height: 1.2; font-weight: 550; color: var(--text-muted); white-space: normal; overflow-wrap: anywhere; box-shadow: none; background: transparent; }
  body .topbar .catalog-tabs .mobile-nav-icon { display: block; flex: 0 0 21px; width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
  body .topbar .catalog-tabs .tab-label { display: block; width: 100%; min-width: 0; max-width: 100%; text-align: center; white-space: normal; word-break: normal; overflow-wrap: anywhere; hyphens: none; }
  body .topbar .catalog-tabs .tab-label-wide { display: none; }
  body .topbar .catalog-tabs .tab-label-short { display: block; }
  body .topbar .catalog-tabs button[aria-pressed='true'] { color: var(--text); background: var(--accent-soft); }
  body .topbar .catalog-tabs button[aria-pressed='true']::after { content: ''; position: absolute; width: 15px; height: 3px; left: calc(50% - 7.5px); bottom: 1px; border-radius: 999px; background: var(--accent-bright); }
  body .topbar .catalog-tabs #favorites-count { display: none; }
  body .topbar #tab-favorites[data-count]:not([data-count=''])::before { content: attr(data-count); position: absolute; top: 0; right: max(0px, calc(50% - 23px)); min-width: 14px; padding: 1px 3px; border-radius: 8px; background: var(--surface-elevated); color: var(--text); font-size: .5625rem; line-height: 1.25; }
  body .app-main, body.sidebar-collapsed .app-main, body.streaming-active .app-main, body.sagas-visible .app-main { margin-left: 0; max-width: 100%; }
  body.mobile-shell-active #app-sidebar, body.mobile-shell-active.sidebar-collapsed #app-sidebar, body.mobile-shell-active.sagas-visible #app-sidebar, body.mobile-shell-active.sagas-sidebar-collapsed #app-sidebar, body.mobile-shell-active.streaming-active #app-sidebar { display: block; position: fixed; top: var(--app-header-height, var(--header-height)); bottom: 0; left: 0; z-index: 90; width: min(320px, calc(100vw - 40px)); max-width: calc(100vw - 40px); max-height: calc(var(--mobile-visual-height, 100dvh) - var(--app-header-height, var(--header-height))); margin: 0; padding: 16px max(16px, env(safe-area-inset-right, 0px)) calc(20px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); overflow: auto; background: var(--sidebar-surface); border-right: 1px solid var(--line); border-radius: 0 18px 0 0; opacity: 0; visibility: hidden; transform: translateX(-100%); transition: transform 200ms var(--motion-ease), opacity 160ms ease, visibility 200ms; }
  body.mobile-shell-active.sidebar-open #app-sidebar { opacity: 1; visibility: visible; transform: translateX(0); }
  body.mobile-shell-active.sidebar-closing #app-sidebar { visibility: visible; pointer-events: none; }
  body.sidebar-open #sidebar-backdrop:not([hidden]) { position: fixed; display: block; inset: var(--app-header-height, var(--header-height)) 0 0; z-index: 85; width: 100%; height: auto; margin: 0; padding: 0; border: 0; border-radius: 0; background: #0008; box-shadow: none; backdrop-filter: blur(3px); }
  body #app-sidebar #sidebar-toggle { width: 44px; height: 44px; min-height: 44px; margin: 0 0 12px auto; }
  body.mobile-shell-active #app-sidebar :is(.sidebar-label, .sidebar-context-label, .sagas-nav-label) { display: block; min-width: 0; width: auto; max-width: none; opacity: 1; visibility: visible; overflow: hidden; overflow-wrap: anywhere; white-space: normal; transform: none; }
  body #app-sidebar :is(.sidebar-navigation, .sidebar-services, .sidebar-live, .sidebar-sports) { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; width: 100%; }
  body #app-sidebar :is(.sidebar-action, .service-nav-button, .sidebar-family, .sidebar-sport-item, .sagas-nav-button) { display: flex; align-items: center; justify-content: flex-start; gap: 13px; min-height: 44px; width: 100%; height: auto; padding: 10px 12px; font-size: .875rem; }
  body #app-sidebar .service-logo { flex: 0 0 44px; width: 44px; }
  body.mobile-shell-active:is(.sidebar-open, .sidebar-closing) #app-sidebar { overflow-x: hidden; overscroll-behavior: contain; background: var(--canvas); }
  body #app-sidebar .mobile-menu-settings { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--line); }
  body #app-sidebar .mobile-menu-settings #theme-toggle { display: flex; align-items: center; justify-content: flex-start; gap: 13px; width: 100%; height: auto; min-height: 44px; padding: 10px 12px; border: 0; border-radius: 12px; font-size: .875rem; color: var(--text); text-align: left; background: transparent; }
  body #app-sidebar #theme-toggle::before { flex: 0 0 21px; width: 21px; height: 21px; margin: 0; }
  body #app-sidebar .mobile-tool-label { display: block; position: static; width: auto; height: auto; margin: 0; background: none; mask: none; -webkit-mask: none; }
  body #mobile-search-dialog[open] { position: fixed; inset: var(--mobile-visual-offset-top, 0px) 0 auto; display: flex; flex-direction: column; gap: 16px; width: 100%; max-width: none; height: var(--mobile-visual-height, 100dvh); max-height: var(--mobile-visual-height, 100dvh); margin: 0; padding: max(10px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); overflow: auto; overscroll-behavior: contain; border: 0; border-radius: 0; background: var(--canvas); color: var(--text); animation: mobile-search-enter 180ms var(--motion-ease) both; }
  .mobile-search-dialog::backdrop { background: #0008; }
  .mobile-search-heading { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 12px; }
  .mobile-search-heading h2 { margin: 0; font-size: 1.1rem; }
  .mobile-search-close { flex: 0 0 44px; width: 44px; min-height: 44px; padding: 0; font-size: 1.6rem; line-height: 1; border: 1px solid var(--line); color: var(--text); background: var(--surface); }
  .mobile-search-content { min-height: 0; }
  .mobile-search-dialog .header-search { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 8px; width: 100%; }
  .mobile-search-dialog .header-search::before { top: 23px; left: 14px; transform: translateY(-50%); }
  #mobile-search-dialog .header-search > #header-search { grid-column: 1; grid-row: 1; min-width: 0; min-height: 46px; padding: 10px 12px 10px 40px; border-radius: 14px; font-size: 1rem; }
  .mobile-search-dialog .header-search > .universal-scope { position: static; grid-column: 2; grid-row: 1; width: 85px; max-width: 100%; min-height: 46px; height: auto; margin: 0; padding: 8px 20px 8px 8px; border: 1px solid var(--line); border-radius: 12px; transform: none; background-color: var(--surface); font-size: .8125rem; }
  .mobile-search-dialog .header-search > .universal-results { position: static; grid-column: 1 / -1; grid-row: 2; width: 100%; max-width: none; height: auto; max-height: none; margin: 0; padding: 6px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .mobile-search-dialog .universal-option { min-height: 72px; padding: 10px 4px; }
  .mobile-search-dialog .universal-copy { min-width: 0; }
  .mobile-search-dialog .universal-copy strong { white-space: normal; overflow-wrap: anywhere; font-size: .875rem; }
  .mobile-search-dialog .universal-copy small, .mobile-search-dialog .universal-message { font-size: .75rem; color: var(--text-muted); }
  .mobile-search-dialog .universal-all { min-height: 44px; margin-top: 8px; padding: 12px 4px; font-size: .8125rem; }
  body.mobile-layer-open, html:has(body.mobile-layer-open) { overflow: hidden; overscroll-behavior: none; }
  body :is(button, a, input, select, textarea, summary, [tabindex]):focus-visible { outline: 2px solid var(--accent-bright); outline-offset: 2px; scroll-margin-top: calc(var(--app-header-height, var(--header-height)) + 12px); scroll-margin-bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
  body .topbar :focus-visible { outline-offset: -3px; }
  body input, body select, body textarea { font-size: max(1rem, 16px); }
  @keyframes mobile-search-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
}
@media (prefers-reduced-motion: reduce) {
  .mobile-search-dialog[open], .mobile-search-dialog::backdrop { animation: none !important; }
  body.mobile-shell-active #app-sidebar, body.mobile-shell-active .catalog-tabs button { transition: none !important; }
}

/* The contextual tree is moved, never cloned. These rules apply only to the
   compact shell, so the original desktop rail retains its own composition. */
body.mobile-shell-active:is(.mobile-layer-open, .mobile-context-open),
html:has(body.mobile-shell-active:is(.mobile-layer-open, .mobile-context-open)) { overflow: hidden; overscroll-behavior: none; }
body.mobile-shell-active .mobile-context-toggle {
  --mobile-context-safe-top: env(safe-area-inset-top, 0px); --mobile-context-safe-right: env(safe-area-inset-right, 0px);
  --mobile-context-safe-bottom: env(safe-area-inset-bottom, 0px); --mobile-context-safe-left: env(safe-area-inset-left, 0px);
  position: fixed; z-index: 96; left: var(--mobile-context-left, 16px); top: var(--mobile-context-top, calc(var(--app-header-height, 60px) + 16px));
  display: grid; place-items: center; width: 48px; min-width: 48px; max-width: 48px;
  height: 48px; min-height: 48px; padding: 9px 7px; margin: 0;
  border: 1px solid #ffffff24; border-radius: 16px; background: #191a1eec;
  color: var(--text, #f2efe8); box-shadow: 0 8px 24px #0005; transform: translateY(0); opacity: 1; visibility: visible;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  transition: transform var(--shell-chrome-duration, 280ms) var(--shell-chrome-ease, cubic-bezier(.22,.7,.2,1)),
    opacity var(--shell-chrome-opacity-duration, 220ms) var(--shell-chrome-ease, cubic-bezier(.22,.7,.2,1)),
    visibility var(--shell-chrome-duration, 280ms), border-color 160ms ease;
}
body.mobile-shell-active .mobile-context-toggle[hidden] { display: none !important; }
body.mobile-shell-active .mobile-context-toggle:active { opacity: .65; }
body.mobile-shell-active .mobile-context-toggle[aria-expanded='true'] { border-color: #ffffff4a; }
body.mobile-shell-active.mobile-header-hidden .mobile-context-toggle {
  opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-14px);
}
body.mobile-shell-active.mobile-header-hidden .mobile-context-toggle[data-edge='bottom'] { transform: translateY(14px); }
body.mobile-shell-active:is(.player-open, .mobile-keyboard-open) .mobile-context-toggle,
body.mobile-shell-active .mobile-context-toggle.mobile-context-unavailable { opacity: 0; visibility: hidden; pointer-events: none; }
/* Transfer between edges only while invisible. Top/left never animate through
   the picture; these phases combine with the shared chrome's hidden state. */
body.mobile-shell-active .mobile-context-toggle[data-motion='out'],
body.mobile-shell-active .mobile-context-toggle[data-motion='hold'] {
  opacity: 0; transform: scale(.94); pointer-events: none;
  transition: opacity 180ms cubic-bezier(.22,.7,.2,1), transform 180ms cubic-bezier(.22,.7,.2,1);
}
body.mobile-shell-active .mobile-context-toggle[data-motion='hold'] { visibility: hidden; transition: none; }
body.mobile-shell-active .mobile-context-toggle[data-motion='in'] {
  transition: opacity 220ms cubic-bezier(.22,.7,.2,1), transform 260ms cubic-bezier(.22,.7,.2,1);
}
body.mobile-shell-active .mobile-context-icon:not(.service-logo),
body.mobile-shell-active .mobile-context-all::before {
  display: block; width: 23px; height: 23px; background: currentColor;
  --mobile-context-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='6' width='18' height='14' rx='3' fill='none' stroke='black' stroke-width='1.6'/%3E%3Cpath d='m8 2 4 4 4-4m-8 21h8' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  mask: var(--mobile-context-mask) center / contain no-repeat;
  -webkit-mask: var(--mobile-context-mask) center / contain no-repeat;
}
body.mobile-shell-active .mobile-context-icon[data-icon='trophy']:not(.service-logo) {
  --mobile-context-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3h10v6a5 5 0 0 1-10 0V3Zm0 2H3v3a4 4 0 0 0 4 4m10-7h4v3a4 4 0 0 1-4 4m-5 2v6m-5 1h10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
body.mobile-shell-active .mobile-context-icon[data-icon='universe']:not(.service-logo) {
  --mobile-context-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m12 3 9 5-9 5-9-5Zm-9 9 9 5 9-5m-18 5 9 5 9-5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}
body.mobile-shell-active :is(.mobile-context-toggle, .mobile-context-dialog) .service-logo {
  flex: 0 0 56px; width: 56px; height: 26px; max-width: 100%; color: var(--text, #f2efe8);
  overflow: hidden; font-size: 0; background: currentColor;
  mask: var(--service-mask) center / contain no-repeat;
  -webkit-mask: var(--service-mask) center / contain no-repeat; filter: none;
}
body.mobile-shell-active .mobile-context-toggle .service-logo { width: 32px; height: 25px; }
body.mobile-shell-active :is(.mobile-context-toggle, .mobile-context-dialog) .service-logo[data-service='disney'] { --service-mask: url('/assets/sports/channel-logos/disney-plus-dark-v1.svg'); }
body.mobile-shell-active :is(.mobile-context-toggle, .mobile-context-dialog) .service-logo[data-service='globoplay'] { --service-mask: url('/assets/services/globoplay.svg'); }
body.mobile-shell-active #mobile-context-dialog[open] {
  position: fixed; inset: auto; left: var(--mobile-context-panel-left, 16px); top: var(--mobile-context-panel-top, 136px);
  display: flex; flex-direction: column;
  width: var(--mobile-context-panel-width, min(360px, calc(100% - 32px))); max-width: calc(100% - 24px);
  max-height: var(--mobile-context-panel-max-height, calc(var(--mobile-visual-height, 100dvh) - 160px));
  margin: 0; padding: 0; overflow: hidden; border: 1px solid #ffffff20;
  border-radius: 20px; background: #151619f5; color: var(--text, #f2efe8);
  --mobile-context-enter-y: -6px; transform-origin: top right;
  opacity: 1; transform: translateY(0) scale(1);
  box-shadow: 0 12px 40px #0006; animation: none;
  transition: opacity 220ms cubic-bezier(.22,.7,.2,1), transform 220ms cubic-bezier(.22,.7,.2,1);
}
body.mobile-shell-active #mobile-context-dialog[data-edge='bottom'] { --mobile-context-enter-y: 6px; transform-origin: bottom right; }
body.mobile-shell-active #mobile-context-dialog[open]:is([data-phase='preparing'], [data-phase='closing']) {
  opacity: 0; transform: translateY(var(--mobile-context-enter-y)) scale(.98);
}
body.mobile-shell-active #mobile-context-dialog[open][data-phase='preparing'] { transition: none; }
body.mobile-shell-active #mobile-context-dialog[open][data-phase='closing'] {
  pointer-events: none;
  transition-duration: 180ms;
}
body.mobile-shell-active #mobile-context-dialog::backdrop {
  background: #0009; opacity: 1; animation: none;
  transition: opacity 220ms cubic-bezier(.22,.7,.2,1);
}
body.mobile-shell-active #mobile-context-dialog[data-phase='preparing']::backdrop { opacity: 0; transition: none; }
body.mobile-shell-active #mobile-context-dialog[data-phase='closing']::backdrop { opacity: 0; transition-duration: 180ms; }
body.mobile-shell-active .mobile-context-heading { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 12px; margin: 0; padding: 16px 16px 10px 20px; }
body.mobile-shell-active .mobile-context-heading h2 { min-width: 0; margin: 0; font-size: 1.125rem; line-height: 1.35; overflow-wrap: anywhere; }
body.mobile-shell-active .mobile-context-close {
  display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px; min-height: 44px; margin: 0; padding: 0;
  border: 0; border-radius: 50%; background: #ffffff08; color: inherit; font-size: 1.75rem; line-height: 1; box-shadow: none;
}
body.mobile-shell-active .mobile-context-content {
  min-height: 0; padding: 0 12px max(18px, env(safe-area-inset-bottom, 0px)); overflow: auto;
  overscroll-behavior: contain; scrollbar-width: thin; scroll-padding-block: 8px;
}
body.mobile-shell-active .mobile-context-section { margin: 12px 0 0; padding: 12px 0 0; border-top: 1px solid #ffffff10; }
body.mobile-shell-active .mobile-context-section h3,
body.mobile-shell-active #mobile-context-dialog .sagas-nav-heading { margin: 0; padding: 0 10px 8px; color: var(--text-muted, #a9abb3); font-size: .75rem; line-height: 1.4; font-weight: 600; letter-spacing: .03em; }
body.mobile-shell-active #mobile-context-dialog :is(#sidebar-services, #sidebar-live, #sidebar-sports, #sidebar-catalog-categories, #sidebar-sagas, .sagas-primary-nav, .sagas-secondary-actions) {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 3px; width: 100%; min-width: 0; margin: 0; padding: 0; overflow: visible;
}
body.mobile-shell-active #mobile-context-dialog .sagas-secondary-nav { margin: 12px 0 0; padding: 12px 0 0; border-top: 1px solid #ffffff10; }
body.mobile-shell-active #mobile-context-dialog .sagas-nav-footnote { margin: 10px; font-size: .75rem; color: var(--text-muted, #a9abb3); }
body.mobile-shell-active #mobile-context-dialog :is(.mobile-context-all, .service-nav-button, .sidebar-family, .sidebar-sport-item, .sagas-nav-button, .category-nav-button) {
  position: relative; display: flex; align-items: center; justify-content: flex-start; gap: 14px;
  width: 100%; min-width: 0; max-width: none; min-height: 48px; height: auto; margin: 0; padding: 11px 12px;
  border: 0; border-radius: 12px; background: transparent; color: var(--text, #f2efe8); box-shadow: none;
  font-size: .9375rem; font-weight: 500; line-height: 1.4; text-align: left; white-space: normal; overflow-wrap: anywhere; transform: none;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
body.mobile-shell-active #mobile-context-dialog button:is(:hover, :active) { box-shadow: none; transform: none; }
body.mobile-shell-active #mobile-context-dialog button:active { opacity: .65; }
body.mobile-shell-active #mobile-context-dialog button[aria-pressed='true'] { background: #ffffff08; color: var(--text, #f2efe8); }
body.mobile-shell-active #mobile-context-dialog button::after { content: none; }
body.mobile-shell-active #mobile-context-dialog .mobile-context-all::before { content: ''; flex: 0 0 23px; }
body.mobile-shell-active #mobile-context-dialog :is(.category-nav-button, .sidebar-sport-item)::before { content: none; }
body.mobile-shell-active #mobile-context-dialog :is(.sidebar-context-label, .sagas-nav-label) {
  display: block; position: static; flex: 1 1 auto; width: auto; height: auto; min-width: 0; max-width: none;
  padding: 0; overflow: visible; clip-path: none; opacity: 1; visibility: visible; white-space: normal; overflow-wrap: anywhere; transform: none;
}
body.mobile-shell-active #mobile-context-dialog :is(.sidebar-context-icon, .sagas-nav-icon) { flex: 0 0 23px; width: 23px; height: 23px; }
body.mobile-shell-active #mobile-context-dialog .sidebar-context-icon::before { width: 23px; height: 23px; }
body.mobile-shell-active #mobile-context-dialog .sidebar-context-icon img { display: block; width: 23px; height: 23px; object-fit: contain; filter: none; opacity: 1; }
body.mobile-shell-active #mobile-context-dialog .sidebar-context-icon:has(img)::before,
body.mobile-shell-active #mobile-context-dialog .sidebar-competition .sidebar-context-icon::before { content: none; }
body.mobile-shell-active #mobile-context-dialog [hidden] { display: none !important; }
body.mobile-shell-active #mobile-context-dialog :focus-visible { outline: 2px solid var(--accent-bright, #ff304c); outline-offset: -2px; scroll-margin-block: 8px; }
@supports (backdrop-filter: blur(1px)) {
  body.mobile-shell-active .mobile-context-toggle { background: #191a1edc; backdrop-filter: blur(8px); }
}
@media (prefers-reduced-motion: reduce) {
  body.mobile-shell-active :is(.mobile-context-toggle, .mobile-context-dialog[open]),
  body.mobile-shell-active #mobile-context-dialog::backdrop { animation: none !important; transition: none !important; }
}