/* TuneTune v254 — adaptive layout for phones and tablets */
:root{--mobile-safe-left:env(safe-area-inset-left,0px);--mobile-safe-right:env(safe-area-inset-right,0px);--mobile-safe-bottom:env(safe-area-inset-bottom,0px)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;max-width:100%;overflow-x:hidden}
body{max-width:100%;overflow-x:clip}
img,svg,video,canvas{max-width:100%}
input,select,textarea,button{font:inherit}
.account-page :is(h1,h2,h3,h4,p,small,strong,span,label,code),
.site-main :is(h1,h2,h3,h4,p,small,strong,span,label,code),
main :is(h1,h2,h3,h4,p,small,strong,span,label,code){overflow-wrap:anywhere}

/* Equalizer: touch-first horizontal viewport with explicit arrows. */
.equalizer-bands-mobile-head{display:none;align-items:center;justify-content:space-between;gap:12px;margin:0 0 12px}
.equalizer-bands-mobile-head strong{font-size:15px}.equalizer-bands-mobile-head small{color:var(--account-muted,var(--gh-muted));text-align:right}
.equalizer-bands-mobile-shell{min-width:0}
.equalizer-bands-viewport{min-width:0}
.eq-bands-scroll-button{display:none;border:1px solid var(--account-border,var(--gh-border));border-radius:12px;background:var(--account-surface-soft,var(--gh-subtle));color:var(--account-text,var(--theme-text));font-size:25px;font-weight:900;line-height:1;cursor:pointer;touch-action:manipulation}
.eq-bands-scroll-button:disabled{opacity:.35;cursor:default}

/* Tables and code lists never force the whole page wider. */
.account-page :is(.table-wrap,.admin-table-wrap,.admin-premium-table-wrap-v239,.subscription-table-wrap,.orders-table-wrap){max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
.account-page table{max-width:100%}
pre,code{max-width:100%}
pre{overflow:auto;-webkit-overflow-scrolling:touch}

@media(max-width:1100px){
  .account-page{width:100%;padding-left:max(16px,var(--mobile-safe-left));padding-right:max(16px,var(--mobile-safe-right))}
  #panel-bot-control .bot-workspace{grid-template-columns:1fr!important;gap:14px!important}
  #panel-bot-control .bot-module-sidebar{position:sticky!important;top:8px!important;z-index:45!important;width:100%!important;max-width:100%!important;padding:8px!important;border-radius:16px!important;overflow:hidden!important}
  #panel-bot-control .bot-sidebar-top{display:none!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]{display:flex!important;width:100%!important;gap:8px!important;overflow-x:auto!important;overflow-y:hidden!important;padding:2px!important;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
  #panel-bot-control .bot-module-menu[data-bot-menu]::-webkit-scrollbar{display:none}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button{flex:0 0 auto!important;min-width:max-content!important;min-height:46px!important;padding:6px 11px!important;scroll-snap-align:start!important;border-radius:12px!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-icon{width:34px!important;height:34px!important;min-width:34px!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-label{display:block!important;white-space:nowrap!important}
  #panel-bot-control .bot-module-content{width:100%!important;min-width:0!important}
  .bot-switcher{max-width:100%;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
  .bot-switcher::-webkit-scrollbar{display:none}
  .bot-switch-button{min-width:150px}
  .console-heading,.page-heading,.card-title,.premium-card,.bot-install-card,.official-server-card{min-width:0}
  .console-heading{flex-wrap:wrap}
  .console-heading>div:first-child{min-width:0;flex:1 1 420px}
  .general-control-grid,.tunetune-community-grid,.command-catalog-grid,.bot-premium-plans,.developer-bot-grid-v205,.admin-promocode-layout-v243{grid-template-columns:1fr!important}
}

@media(max-width:820px){
  body{font-size:15px}
  .account-page{padding-top:12px;padding-bottom:max(18px,var(--mobile-safe-bottom))}
  .account-topbar{margin-bottom:14px;padding:10px 12px;border-radius:15px}
  .account-brand img{width:40px;height:40px}.account-brand-copy small{display:none}
  .topbar-tools{gap:6px}.topbar-icon{width:40px;height:40px;min-width:40px}
  .account-user-trigger{min-width:44px;min-height:44px}
  .page-heading{margin-bottom:14px;padding-bottom:14px}.page-heading h1{font-size:25px}
  .github-card,.stat-card,.bot-card{max-width:100%}
  .github-card{padding:16px}
  .content-grid,.stats-grid,.two-fields,.console-fields.two-fields,.console-fields.three-fields,.routing-events-grid,.feature-toggle-grid,.rss-toggle-grid-v204,.journal-options-grid-v202,.journal-meta-grid-v202,.game-choice-grid,.bot-premium-plans,.premium-assignment-grid-v235,.subscription-dialog-summary-v233{grid-template-columns:1fr!important}
  .console-heading,.card-title,.routing-card-head,.journal-master-head-v202,.gamey-feature-head-v205,.collapsible-feature-head-v204{align-items:flex-start!important}
  .console-heading>:last-child,.card-title>:last-child{max-width:100%}
  .security-row,.settings-list>div,.readonly-row,.details-list>div{min-width:0}
  .managed-server-trigger-v196,.field input,.field select,.field textarea,.console-field input,.console-field select,.console-field textarea{width:100%;max-width:100%}
  .quick-link-box,.remove-bot-server-card,.bot-install-card,.official-server-card{grid-template-columns:1fr!important;align-items:stretch!important}
  .quick-link-box>button,.remove-bot-server-card>button,.bot-install-card>a,.official-server-card>a{width:100%!important}
  .quick-link-result{max-width:100%;grid-template-columns:minmax(0,1fr) auto auto!important}
  .quick-link-result code{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

  /* Equalizer tablet/phone layout. */
  #tunetune-equalizer-panel .equalizer-layout{grid-template-columns:1fr!important;max-width:100%!important}
  #tunetune-equalizer-panel .equalizer-bands-card{overflow:hidden!important;padding:14px!important}
  .equalizer-bands-mobile-head{display:flex}
  .equalizer-bands-mobile-shell{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:8px;align-items:center;width:100%}
  .equalizer-bands-viewport{overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain;padding:2px}
  .equalizer-bands-viewport::-webkit-scrollbar{display:none}
  #tunetune-equalizer-panel .equalizer-bands{display:flex!important;grid-template-columns:none!important;width:max-content!important;min-width:100%!important;gap:12px!important;padding:2px 2px 10px!important}
  #tunetune-equalizer-panel .equalizer-band{flex:0 0 78px!important;min-width:78px!important;max-width:78px!important;scroll-snap-align:start}
  .eq-bands-scroll-button{display:grid;place-items:center;width:44px;height:52px;padding:0}
  #tunetune-equalizer-panel .equalizer-chart{min-height:170px!important}
  #tunetune-equalizer-panel .equalizer-chart svg{min-height:170px!important}
  #tunetune-equalizer-panel .equalizer-presets{grid-template-columns:1fr 1fr!important}
  #tunetune-equalizer-panel .equalizer-actions-card{grid-template-columns:1fr!important;gap:14px!important}
  #tunetune-equalizer-panel .equalizer-actions,.equalizer-reset-button{width:100%!important}

  /* Save bars become part of the flow on smaller devices and never cover fields. */
  #panel-bot-control .universal-save-bar-v186,
  #panel-bot-control .sticky-save-bar,
  #panel-bot-control .console-form>.form-actions.bot-settings-actions-v185{position:static!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important;width:100%!important;padding:12px!important;margin-top:16px!important;bottom:auto!important}
  #panel-bot-control :is(.universal-save-bar-v186,.sticky-save-bar,.console-form>.form-actions.bot-settings-actions-v185)>button{width:100%!important;min-width:0!important}
  #panel-bot-control :is(.universal-save-bar-v186,.sticky-save-bar,.console-form>.form-actions.bot-settings-actions-v185) .bot-settings-server-card{width:100%!important;max-width:100%!important;order:4!important}

  /* Forms, modal dialogs and action rows. */
  .form-actions,.subscription-dialog-actions-v233,.subscription-consent-actions-v182,.admin-promocode-actions-v243,.admin-cancellation-request-actions-v233{flex-wrap:wrap}
  .subscription-consent-dialog-v182,.subscription-dialog-v233,.modal-card,.checkout-modal-card{width:calc(100vw - 20px)!important;max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;overflow:auto!important;margin:auto!important}
  .account-user-dropdown{right:0;left:auto;max-width:calc(100vw - 24px)}
  .site-footer__compact-main,.site-footer__main,.premium-footer{grid-template-columns:1fr!important;text-align:center!important}
  .site-footer__compact-nav,.site-footer__nav,.premium-footer nav{justify-content:center!important}
}

@media(max-width:620px){
  .account-page{padding-left:max(10px,var(--mobile-safe-left));padding-right:max(10px,var(--mobile-safe-right))}
  .account-topbar{border-radius:13px}.account-brand-copy{display:none}
  .page-heading h1{font-size:23px}
  .bot-switcher{display:flex!important;gap:8px!important;padding-bottom:4px}
  .bot-switch-button{flex:0 0 132px!important;min-width:132px!important;padding:9px!important}
  #panel-bot-control .bot-module-sidebar{top:4px!important;padding:6px!important;border-radius:13px!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button{min-height:42px!important;padding:5px 9px!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-icon{width:30px!important;height:30px!important;min-width:30px!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-label{font-size:12px!important}
  .github-card{padding:14px;border-radius:14px!important}
  .console-heading{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .console-heading>:last-child{justify-self:start!important}
  .card-title{flex-wrap:wrap!important}.card-title>div{flex:1 1 220px}
  .muted-status,.routing-card-badge,.console-status,.premium-feature-badge,.free-feature-badge{max-width:100%!important;white-space:normal!important;text-align:center!important}
  .field input,.field select,.field textarea,.console-field input,.console-field select,.console-field textarea{font-size:16px!important}
  button,a.primary,a.secondary,.primary-link,.secondary-button,.inline-button{min-height:44px}
  .feature-toggle-grid>label,.routing-event-item,.toggle-row{grid-template-columns:minmax(0,1fr) 52px!important;gap:12px!important}
  .feature-toggle-grid>label>span:first-child,.routing-event-item>span:first-child,.toggle-row>span:first-child{min-width:0}
  .volume-control-v181{grid-template-columns:minmax(0,1fr) 72px!important}.volume-scale-v181{margin-right:84px!important}
  .equalizer-bands-mobile-shell{grid-template-columns:38px minmax(0,1fr) 38px;gap:6px}
  .eq-bands-scroll-button{width:38px;height:50px;border-radius:10px}
  #tunetune-equalizer-panel .equalizer-band{flex-basis:72px!important;min-width:72px!important;max-width:72px!important}
  #tunetune-equalizer-panel .equalizer-presets{grid-template-columns:1fr!important}
  .equalizer-bands-mobile-head{display:grid;grid-template-columns:1fr;gap:3px}.equalizer-bands-mobile-head small{text-align:left}
  .command-list-pro>div,.quick-command-row,.commands-grid>div{grid-template-columns:1fr!important;gap:4px!important}
  .command-list-pro code,.quick-command-row code{width:max-content;max-width:100%}
  .admin-premium-kpis-v239{grid-template-columns:1fr!important}
  .admin-premium-filter-actions-v239{grid-template-columns:1fr!important}
  .subscription-consent-actions-v182,.subscription-dialog-actions-v233{display:grid!important;grid-template-columns:1fr!important}
  .account-user-dropdown{position:fixed!important;top:70px!important;left:10px!important;right:10px!important;width:auto!important;max-height:calc(100dvh - 84px);overflow:auto}
  .site-header .header-inner{width:calc(100% - 18px)!important}.site-header .brand-copy strong{font-size:17px!important}
  .hero h1,.premium-hero h1,.legal-hero h1{font-size:clamp(32px,10vw,44px)!important;letter-spacing:-1px!important}
  .hero-actions,.cta-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important}
  .hero-actions>a,.cta-actions>a{width:100%!important}
  .features-grid,.commands-grid,.help-columns,.pricing-grid,.comparison,.payment-methods{grid-template-columns:1fr!important}
}

@media(max-width:420px){
  .account-page{padding-left:max(8px,var(--mobile-safe-left));padding-right:max(8px,var(--mobile-safe-right))}
  .account-topbar{padding:8px 9px}.topbar-icon{width:38px;height:38px;min-width:38px}.topbar-tools{gap:4px}
  .bot-switch-button{flex-basis:118px!important;min-width:118px!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-label{display:none!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button{min-width:44px!important;width:44px!important;padding:5px!important;justify-content:center!important}
  #panel-bot-control .bot-module-menu[data-bot-menu]>button .module-icon{margin:0!important}
  .github-card{padding:12px}
  .page-heading h1{font-size:21px}
  .equalizer-bands-mobile-shell{grid-template-columns:34px minmax(0,1fr) 34px}
  .eq-bands-scroll-button{width:34px;height:48px;font-size:22px}
  #tunetune-equalizer-panel .equalizer-band{flex-basis:68px!important;min-width:68px!important;max-width:68px!important}
  .quick-link-result{grid-template-columns:minmax(0,1fr) auto!important}.quick-link-result span{grid-column:1/-1}
  .site-header .brand-copy{display:none!important}
}

@media(hover:none) and (pointer:coarse){
  button,a,input[type="range"],input[type="checkbox"],select{touch-action:manipulation}
  .sidebar-nav,.bot-switcher,.bot-module-menu,.equalizer-bands-viewport{scrollbar-width:none}
}

@media(prefers-reduced-motion:reduce){.equalizer-bands-viewport{scroll-behavior:auto}}
.mobile-table-scroll-v254{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
.mobile-table-scroll-v254>table{min-width:max-content}

/* Final public-page overflow fixes found by the 390 px audit. */
@media(max-width:620px){
  .premium-page .hero-visual img{display:block!important;width:min(72vw,260px)!important;max-width:100%!important;height:auto!important;margin-inline:auto!important}
  .article-page,.article-shell,.article-container,.article-content,.article-main,.article-aside{min-width:0!important;max-width:100%!important}
  .toc-card,.related-card{min-width:0!important;max-width:100%!important;padding:18px!important}
  .toc-card nav,.related-card nav{min-width:0!important;max-width:100%!important}
  .toc-card a,.related-card a{display:block!important;width:auto!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important}
}
