/* Header alignment and persistent colour-mode control. */
.arcade-theme-toggle {
  display: inline-grid;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  place-items: center;
  padding: 0;
  border: 1px solid var(--arcade-line);
  border-radius: 11px;
  background: rgba(255,255,255,.04);
  color: #f5f7ff;
  font-size: 20px;
  line-height: 1;
  text-transform: none;
}
.arcade-theme-toggle:hover { background: rgba(255,255,255,.10); color: var(--arcade-accent-2); }
.arcade-theme-toggle__sun { display: none; }
.arcade-theme-toggle__moon { transform: translateY(-1px); }

/* Keep the search centred in the viewport, including tablet layouts where
   the original theme otherwise restores its fixed-width `.cont` wrapper. */
@media (min-width: 681px) {
  .arcade-header__main {
    position: relative;
    width: 100% !important;
    max-width: none !important;
    min-height: 82px;
    margin-right: 0;
    margin-left: 0;
    padding-right: 26px;
    padding-left: 26px;
  }
  .arcade-menu-toggle { order: -1; margin: 0; }
  .arcade-brand { min-width: 0; }
  .arcade-search {
    position: absolute;
    top: 50%;
    left: 50%;
    width: clamp(280px, 36vw, 480px);
    min-width: 0;
    margin: 0;
    transform: translate(-50%, -50%);
  }
  .arcade-account { margin-left: auto; }
  .arcade-theme-toggle { margin-left: 2px; }
  .arcade-primary-nav { display: none !important; }
  .arcade-rail {
    display: block;
    position: fixed;
    z-index: 160;
    top: 82px;
    bottom: 0;
    left: 0;
    width: 72px;
    overflow-x: hidden;
    overflow-y: auto;
    border-right: 1px solid rgba(255,255,255,.10);
    background: #191820;
    box-shadow: 5px 0 18px rgba(0,0,0,.08);
    scrollbar-width: none;
    transition: width .22s ease, box-shadow .22s ease;
  }
  .arcade-rail::-webkit-scrollbar { display: none; }
  .arcade-rail:hover,
  .arcade-rail:focus-within,
  .arcade-rail.is-open { width: 252px; box-shadow: 9px 0 24px rgba(0,0,0,.24); }
  .arcade-rail nav { border-top: 1px solid rgba(255,255,255,.09); }
  .arcade-rail ul { margin: 0; padding: 7px 0 16px; }
  .arcade-rail a.arcade-rail__link {
    display: flex;
    width: 234px;
    height: 44px;
    align-items: center;
    gap: 10px;
    margin: 3px 9px;
    padding: 0;
    border-radius: 11px;
    color: #aaa8b1;
    font-size: 13px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
    transition: background-color .16s ease, color .16s ease;
  }
  .arcade-rail__icon {
    display: grid;
    width: 46px;
    height: 36px;
    flex: 0 0 46px;
    place-items: center;
    border-radius: 10px;
    font-size: 19px;
  }
  .arcade-rail__label { overflow: hidden; opacity: 0; text-overflow: ellipsis; transform: translateX(-5px); transition: opacity .14s ease .04s, transform .18s ease .04s; }
  .arcade-rail:hover .arcade-rail__label,
  .arcade-rail:focus-within .arcade-rail__label,
  .arcade-rail.is-open .arcade-rail__label { opacity: 1; transform: translateX(0); }
  .arcade-rail a.arcade-rail__link:hover,
  .arcade-rail a.arcade-rail__link:focus,
  .arcade-rail a.arcade-rail__link.is-current,
  .arcade-rail a.arcade-rail__home { background: rgba(239,76,66,.12); color: #f2a06b; }
  .arcade-rail a.arcade-rail__home { margin-top: 9px; margin-bottom: 9px; }
  .bdcn > .cont { padding-left: 88px; }
}

@media (max-width: 680px) {
  .arcade-theme-toggle { width: 36px; height: 36px; flex-basis: 36px; border-radius: 9px; font-size: 18px; }
  .arcade-search { min-width: 0; }
  .arcade-primary-nav { display: none !important; }
  .arcade-rail {
    display: block;
    position: fixed;
    z-index: 160;
    top: 60px;
    bottom: 0;
    left: 0;
    width: 0;
    overflow: hidden auto;
    border-right: 0;
    background: #191820;
    box-shadow: 9px 0 24px rgba(0,0,0,.24);
    scrollbar-width: none;
    transition: width .22s ease;
  }
  .arcade-rail.is-open,
  .arcade-rail:focus-within { width: min(272px, 86vw); border-right: 1px solid rgba(255,255,255,.10); }
  .arcade-rail::-webkit-scrollbar { display: none; }
  .arcade-rail nav { border-top: 1px solid rgba(255,255,255,.09); }
  .arcade-rail ul { width: 100%; margin: 0; padding: 7px 0 16px; }
  .arcade-rail a.arcade-rail__link {
    display: flex;
    width: calc(100% - 18px);
    height: 44px;
    align-items: center;
    gap: 10px;
    margin: 3px 9px;
    padding: 0;
    border-radius: 11px;
    color: #aaa8b1;
    font-size: 13px;
    font-weight: 750;
    line-height: 1;
    white-space: nowrap;
  }
  .arcade-rail__icon { display: grid; width: 46px; height: 36px; flex: 0 0 46px; place-items: center; border-radius: 10px; font-size: 19px; }
  .arcade-rail__label { overflow: hidden; opacity: 1; text-overflow: ellipsis; transform: none; }
  .arcade-rail a.arcade-rail__link:hover,
  .arcade-rail a.arcade-rail__link:focus,
  .arcade-rail a.arcade-rail__link.is-current,
  .arcade-rail a.arcade-rail__home { background: rgba(239,76,66,.12); color: #f2a06b; }
  .arcade-rail a.arcade-rail__home { margin-top: 9px; margin-bottom: 9px; }
}

/* Light mode uses the same component hierarchy as the dark design. */
html.arcade-light-mode {
  --arcade-bg: #eef2f8;
  --arcade-surface: #ffffff;
  --arcade-surface-raised: #f8faff;
  --arcade-surface-muted: #e8edf7;
  --arcade-line: rgba(21, 31, 51, .14);
  --arcade-text: #172033;
  --arcade-muted: #5d6c84;
  --arcade-accent: #5c4ce5;
  --arcade-accent-2: #058b7a;
  color-scheme: light;
}
html.arcade-light-mode body {
  background:
    radial-gradient(circle at 8% -6%, rgba(92, 76, 229, .12), transparent 29rem),
    radial-gradient(circle at 95% 12%, rgba(5, 139, 122, .10), transparent 32rem),
    var(--arcade-bg);
  color: var(--arcade-text);
}
html.arcade-light-mode .arcade-header { border-color: rgba(21,31,51,.12); background: rgba(255,255,255,.91); box-shadow: 0 5px 20px rgba(20,33,57,.08); }
html.arcade-light-mode .arcade-brand__name,
html.arcade-light-mode .arcade-primary-nav .nav_menu > li > a:hover,
html.arcade-light-mode .arcade-primary-nav .nav_menu > li.current-menu-item > a,
html.arcade-light-mode .arcade-primary-nav .nav_menu > li.current_page_item > a,
html.arcade-light-mode .arcade-account__user { color: #172033; }
html.arcade-light-mode .arcade-primary-nav .nav_menu > li > a,
html.arcade-light-mode .arcade-account__login,
html.arcade-light-mode .arcade-account__logout { color: #44536b; }
html.arcade-light-mode .arcade-primary-nav .nav_menu > li > a:hover,
html.arcade-light-mode .arcade-primary-nav .nav_menu > li.current-menu-item > a,
html.arcade-light-mode .arcade-primary-nav .nav_menu > li.current_page_item > a { background: #edf1f8; }
html.arcade-light-mode .arcade-search { border-color: rgba(21,31,51,.16); background: #f6f8fc; }
html.arcade-light-mode .arcade-search input { color: #172033; }
html.arcade-light-mode .arcade-search button,
html.arcade-light-mode .arcade-menu-toggle,
html.arcade-light-mode .arcade-theme-toggle { color: #26344b; }
html.arcade-light-mode .arcade-menu-toggle,
html.arcade-light-mode .arcade-theme-toggle { border-color: rgba(21,31,51,.14); background: #f6f8fc; }
html.arcade-light-mode .arcade-menu-toggle span:not(.screen-reader-text) { background: #26344b; }
html.arcade-light-mode .arcade-theme-toggle__moon { display: none; }
html.arcade-light-mode .arcade-theme-toggle__sun { display: block; }
html.arcade-light-mode .arcade-primary-nav { background: #fff; box-shadow: 0 16px 38px rgba(20,33,57,.18); }
html.arcade-light-mode .arcade-rail { border-color: rgba(21,31,51,.12); background: #fff; }
html.arcade-light-mode .arcade-rail a { color: #5b6b84; }
html.arcade-light-mode .arcade-rail a:hover,
html.arcade-light-mode .arcade-rail a:focus,
html.arcade-light-mode .arcade-rail__home { background: #f7ecee; color: #c34948; }
html.arcade-light-mode .blk-cn,
html.arcade-light-mode .box,
html.arcade-light-mode .post-sngl,
html.arcade-light-mode .widget,
html.arcade-light-mode #myarcadetheme-author-info { box-shadow: 0 12px 28px rgba(20,33,57,.08); }
html.arcade-light-mode .titl,
html.arcade-light-mode .gmcn-midl .gm-titl,
html.arcade-light-mode .gmcn-larg .gm-titl,
html.arcade-light-mode .post-sngl h1,
html.arcade-light-mode .post-sngl h2,
html.arcade-light-mode .post-sngl h3 { color: #172033; }
html.arcade-light-mode .gmcn-midl,
html.arcade-light-mode .gmcn-larg,
html.arcade-light-mode .gmcn-smal { background: #fff; box-shadow: 0 8px 18px rgba(20,33,57,.10); }
html.arcade-light-mode body.home .arcade-dashboard #cntpromotedgames .gmcn-midl { border-color: rgba(21,31,51,.14); background: #e9edf5; }
html.arcade-light-mode .ftcn { border-color: rgba(21,31,51,.12); background: #e9eef7; }
html.arcade-light-mode .ftcn-2 { color: #5b6b84; }
html.arcade-light-mode .arcade-continue { background: linear-gradient(100deg, #fff4f1, #fff8f8); box-shadow: 0 12px 25px rgba(75,43,43,.08); }
html.arcade-light-mode .arcade-continue__copy h1 { color: #292032; }
html.arcade-light-mode .arcade-continue__copy p { color: #7a5960; }
