/* ===== Bottom sheet (native-app style panel; phones/tablets) =====
   Markup: .sheet[data-sheet] > .sheet__panel > (.sheet__grab, .sheet__head, .sheet__body)
   Open with any [data-sheet-open="#id"]; closes on backdrop / × / Esc / swipe-down (modules/sheet.js).
   .sheet--inline renders its body inline on desktop (≥992px) — used for content that is a card
   section on desktop and a sheet on phones. */
/* A closed sheet must not paint at all: `opacity:0` does NOT reliably suppress a backdrop-filter
   in Chrome/Safari, and this element covers the whole viewport — it washed the page out wherever
   a sheet was rendered. visibility (delayed on close so the fade still plays) switches it off. */
.sheet{position:fixed;inset:0;z-index:1200;background:rgba(30,32,93,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s,visibility 0s linear .25s}
.sheet.is-open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .25s,visibility 0s}
.sheet__panel{position:absolute;left:0;right:0;bottom:0;max-height:92vh;max-height:92dvh;display:flex;flex-direction:column;background:var(--c-card);border-radius:var(--r-xl) var(--r-xl) 0 0;box-shadow:0 -20px 60px rgba(30,32,93,.35);transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,.25,1);padding-bottom:env(safe-area-inset-bottom)}
.sheet.is-open .sheet__panel{transform:none}
.sheet.is-dragging .sheet__panel{transition:none}
.sheet__grab{padding:10px 0 4px;display:flex;justify-content:center;cursor:grab;touch-action:none;flex:none}
.sheet__grab::before{content:"";width:42px;height:5px;border-radius:var(--r-xs);background:var(--c-line-2)}
.sheet__head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 20px 12px;flex:none}
.sheet__title{font:800 19px/1.2 var(--ff-display);letter-spacing:-.02em;color:var(--c-text)}
.sheet__close{width:34px;height:34px;border-radius:50%;border:0;background:var(--c-raised);color:var(--c-text);display:grid;place-items:center;padding:0}
.sheet__close svg{width:15px;height:15px}
.sheet__body{overflow-y:auto;overscroll-behavior:contain;padding:0 20px 20px;-webkit-overflow-scrolling:touch}
body.sheet-open{overflow:hidden}
@media (prefers-reduced-motion:reduce){.sheet,.sheet__panel{transition:none}}
/* desktop: inline variant becomes plain flow content */
@media (min-width:992px){
  .sheet--inline{position:static;inset:auto;background:none;backdrop-filter:none;-webkit-backdrop-filter:none;opacity:1;visibility:visible;pointer-events:auto;display:contents}
  .sheet--inline .sheet__panel{position:static;transform:none;box-shadow:none;border-radius:0;background:none;max-height:none;display:contents}
  .sheet--inline .sheet__grab,.sheet--inline .sheet__head{display:none}
  .sheet--inline .sheet__body{overflow:visible;padding:0;display:contents}
}
/* ===== Side drawer variant (tablets 768–991): the same sheet slides in from the right, full height =====
   Only the menu uses it; on phones it is the bottom sheet above, on desktop the topnav takes over. */
@media (min-width:768px) and (max-width:991.98px){
  .sheet--side .sheet__panel{left:auto;top:0;right:0;bottom:0;width:min(420px,88vw);max-height:none;border-radius:0;box-shadow:-20px 0 60px rgba(30,32,93,.35);transform:translateX(100%);transition:transform .22s cubic-bezier(.32,.72,.25,1);padding-bottom:0;padding-top:env(safe-area-inset-top)}
  .sheet--side.is-open .sheet__panel{transform:none}
  .sheet--side .sheet__grab{display:none}
  .sheet--side .sheet__head{padding-top:16px;padding-bottom:14px;border-bottom:1px solid var(--c-line)}
  .sheet--side .sheet__body{padding-top:18px;padding-bottom:calc(20px + env(safe-area-inset-bottom))}
}
/* ===== App menu sheet ===== */
.appmenu__brand{display:flex;align-items:center;gap:10px}
.appmenu__mark{height:30px;width:auto}
.appmenu .sheet__close{width:44px;height:44px}
.appmenu__search{display:flex;align-items:center;gap:10px;background:var(--c-raised);border:1px solid transparent;border-radius:var(--r-card);padding:5px 5px 5px 14px;margin-bottom:14px;transition:border-color .15s,background .15s}
.appmenu__search:focus-within{background:var(--c-card);border-color:var(--c-primary)}
.appmenu__search>svg{width:19px;height:19px;color:var(--c-primary);flex:none}
.appmenu__input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:600 16px/1.3 var(--ff-ui);color:var(--c-text);padding:9px 0}
.appmenu__input::placeholder{color:var(--c-muted);font-weight:500}
.appmenu__input::-webkit-search-cancel-button{display:none}
.appmenu__go{flex:none;min-height:40px;padding:0 16px;border:0;border-radius:var(--r-md);background:var(--c-primary);color:#fff;font:700 13px/1 var(--ff-ui)}
.appmenu__go:active{transform:scale(.97)}
/* now on Vizion Plus */
.appmenu__now{display:flex;align-items:center;gap:12px;padding:10px;margin-bottom:18px;border-radius:var(--r-card);background:var(--c-raised);color:var(--c-text);min-height:64px}
.appmenu__nowpic{width:74px;aspect-ratio:16/9;border-radius:var(--r-sm);overflow:hidden;flex:none;display:grid;place-items:center;color:#fff}
.appmenu__nowpic>svg{position:relative;z-index:2;width:18px;height:18px}
.appmenu__nowtxt{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.appmenu__nowtxt .kick{display:inline-flex;align-items:center;gap:6px}
.appmenu__nowtxt .kick .dot{background:var(--c-live);animation:pulse 1.4s infinite}
.appmenu__nowt{font:800 15px/1.2 var(--ff-display);letter-spacing:var(--track-tight);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appmenu__nowtxt .mu{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.appmenu__now .btn-live{flex:none}
.appmenu__kick{margin:0 0 6px;color:var(--c-muted)}
/* sections accordion: 52px rows, chevrons, children indented with their dot */
.appmenu__nav{display:flex;flex-direction:column;margin-bottom:18px}
.nsec{border-top:1px solid var(--c-line)}
.nsec:last-child,.nsec__row--link:last-child{border-bottom:1px solid var(--c-line)}
.nsec__row{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:0 4px;font:700 16px/1.2 var(--ff-display);color:var(--c-text);list-style:none;cursor:pointer;border-top:1px solid var(--c-line);border-radius:var(--r-sm);-webkit-user-select:none;user-select:none}
.nsec>.nsec__row{border-top:0}
.nsec__row::-webkit-details-marker{display:none}
.nsec__row svg{width:18px;height:18px;color:var(--c-primary);flex:none;transition:transform .2s}
.nsec__row--link svg{transform:rotate(-90deg)}
.nsec[open]>.nsec__row svg{transform:rotate(180deg)}
.nsec[open]>.nsec__row{color:var(--c-primary)}
.nsec__row:active{background:var(--c-raised)}
.nsec__list{list-style:none;margin:0;padding:2px 0 10px}
.nsec__link{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 10px 0 14px;border-radius:var(--r-md);font:600 15px/1.2 var(--ff-ui);color:var(--c-body)}
.nsec__link:active{background:color-mix(in srgb,var(--cat,var(--c-primary)) 10%,#fff)}
.nsec__link.is-active{background:color-mix(in srgb,var(--cat,var(--c-primary)) 10%,#fff);color:var(--c-text);font-weight:700}
.nsec__link--all{color:var(--c-link);font-weight:700}
.nsec__link--all svg{width:15px;height:15px;margin-left:auto}
/* quick tiles */
.appmenu__tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:18px}
.appmenu__tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:74px;padding:12px 6px;border-radius:var(--r-lg);background:var(--c-raised);color:var(--c-text);font:600 12.5px/1 var(--ff-ui);text-align:center}
.appmenu__tile:active{transform:scale(.96)}
.appmenu__tile svg{width:22px;height:22px;color:var(--c-primary)}
.appmenu__foot{display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--c-line);padding-top:16px}
.appmenu__legal{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px}
.appmenu__legal a{color:var(--c-muted);min-height:28px;display:inline-flex;align-items:center}
.appmenu .fsocial a{color:var(--c-primary);background:var(--c-raised);border:0}
/* on-air schedule sheet trigger */
.onair__morebtn{display:none;margin-top:16px;width:100%;border:1px solid var(--c-line-2);background:var(--c-card);border-radius:var(--r-card);padding:13px 14px;font:600 14px/1 var(--ff-ui);color:var(--c-text);align-items:center;justify-content:space-between;gap:10px}
.onair__morebtn svg{width:17px;height:17px;color:var(--c-primary)}
.onair__morebtn .mu{font-weight:400}
@media (max-width:991.98px){
  .onair__morebtn{display:flex}
  .onair .sheet--inline .next{max-height:none;mask-image:none}
}
/* share sheet */
.sharesheet__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-bottom:6px}
.sharesheet__row{display:flex;align-items:center;gap:12px;padding:15px 16px;border-radius:var(--r-card);border:0;background:var(--c-raised);color:var(--c-text);font:600 14.5px/1 var(--ff-ui);text-align:left}
.sharesheet__row svg{width:20px;height:20px;color:var(--c-primary);flex:none}
.sharesheet__row:active{transform:scale(.97)}
.share__more{border:1px solid var(--c-line-2);background:var(--c-card);color:var(--c-text);font:700 16px/1 var(--ff-ui);letter-spacing:1px}
@media (max-width:991.98px){.share .share__net{display:none}}
