/* =====================================================================
   Tales of Loki — FluxCP theme
   Palette taken from the Tales of Loki logo:
   midnight navy, icy cyan (LOKI letters), rune gold (horns / "Tales Of"),
   emerald (horn gem), silver-white (ice), wolf-eye red.
   ===================================================================== */

:root{
  --void:      #050911;
  --navy:      #0A1322;
  --navy-2:    #0F1B2E;
  --navy-3:    #15253C;
  --line:      #1F3350;
  --line-soft: rgba(110,190,255,.12);

  --ice:       #39C2F2;
  --ice-glow:  #8BE6FF;
  --gold:      #D9A93A;
  --gold-hi:   #F3D27A;
  --gold-deep: #8A6516;
  --emerald:   #2FA36B;
  --emerald-hi:#5FD69B;
  --blood:     #E2433C;

  --text:      #E8F1F8;
  --text-dim:  #93A7BB;
  --text-mute: #62778D;

  --radius:    12px;
  --radius-sm: 8px;
  --shadow:    0 18px 50px rgba(0,0,0,.45);
  --font-display: 'Cinzel', Georgia, serif;
  --font-body:    'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, Consolas, monospace;
  --nav-h: 68px;
}

*{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
body.tol{
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(1200px 600px at 85% -10%, rgba(57,194,242,.10), transparent 60%),
    radial-gradient(900px 500px at -10% 20%, rgba(47,163,107,.07), transparent 60%),
    var(--void);
  color: var(--text);
  font: 15px/1.6 var(--font-body);
  -webkit-font-smoothing: antialiased;
}
::selection{ background: var(--gold); color: var(--void); }

.tol-embers{
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    radial-gradient(2px 2px at 12% 88%, rgba(139,230,255,.45), transparent),
    radial-gradient(1.5px 1.5px at 34% 72%, rgba(243,210,122,.35), transparent),
    radial-gradient(1.5px 1.5px at 58% 93%, rgba(139,230,255,.3), transparent),
    radial-gradient(2px 2px at 81% 78%, rgba(243,210,122,.3), transparent),
    radial-gradient(1px 1px at 92% 40%, rgba(139,230,255,.35), transparent),
    radial-gradient(1px 1px at 6% 30%, rgba(243,210,122,.3), transparent);
}

a{ color: var(--ice-glow); text-decoration: none; transition: color .15s ease; }
a:hover{ color: var(--gold-hi); }
a img{ border: 0; }
img{ max-width: 100%; }

h1, h2, h3, h4{
  font-family: var(--font-display);
  color: var(--text);
  letter-spacing: .02em;
  line-height: 1.2;
}
h2{ font-size: 1.6rem; margin: 0 0 1rem; }
h2::after{
  content: ''; display: block; width: 64px; height: 2px; margin-top: .6rem;
  background: linear-gradient(90deg, var(--gold), transparent);
}
h3{ font-size: 1.15rem; margin: 1.6rem 0 .8rem; color: var(--gold-hi); }
h4{ font-size: 1rem; margin: 1rem 0 .5rem; }
p{ margin: 0 0 1rem; }
.tol-icon{ width: 1em; height: 1em; vertical-align: -0.15em; flex-shrink: 0; }

/* ============================ Top navigation ============================ */
.tol-nav{
  position: sticky; top: 0; z-index: 50;
  background: rgba(5,9,17,.72);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid transparent;
  transition: background .2s ease, border-color .2s ease;
}
.tol-nav.is-scrolled{ background: rgba(5,9,17,.92); border-bottom-color: var(--line); }
.tol-nav__inner{
  max-width: 1280px; margin: 0 auto; height: var(--nav-h);
  display: flex; align-items: center; gap: 1.5rem; padding: 0 1.25rem;
}
.tol-brand{ display: flex; align-items: center; gap: .6rem; color: var(--text); flex-shrink: 0; }
.tol-brand img{ height: 40px; width: auto; filter: drop-shadow(0 0 10px rgba(57,194,242,.35)); }
.tol-brand span{
  font-family: var(--font-display); font-weight: 700; font-size: 1.05rem;
  letter-spacing: .1em; text-transform: uppercase;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.tol-brand:hover span{ filter: brightness(1.15); }

.tol-nav__menu{ flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-width: 0; }
.tol-nav__list{ list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: .25rem; }
.tol-dd{ position: relative; }
.tol-dd__btn{
  display: inline-flex; align-items: center; gap: .3rem;
  background: none; border: 0; cursor: pointer;
  padding: .55rem .7rem; border-radius: var(--radius-sm);
  font: 600 .78rem/1 var(--font-display); letter-spacing: .12em; text-transform: uppercase;
  color: var(--text-dim); white-space: nowrap;
  transition: color .15s ease, background .15s ease;
}
.tol-dd__btn .tol-icon{ width: .85em; height: .85em; transition: transform .2s ease; }
.tol-dd__btn:hover, .tol-dd.is-open .tol-dd__btn{ color: var(--gold-hi); background: rgba(217,169,58,.06); }
.tol-dd.is-open .tol-dd__btn .tol-icon{ transform: rotate(180deg); }
.tol-dd__btn:focus-visible, .tol-btn:focus-visible, .tol-nav__toggle:focus-visible{ outline: 2px solid var(--ice); outline-offset: 2px; }

.tol-dd__panel{
  list-style: none; margin: 0; padding: .4rem;
  position: absolute; top: calc(100% + 8px); left: 0; min-width: 210px;
  background: linear-gradient(180deg, var(--navy-2), var(--navy));
  border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow);
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .15s ease, transform .15s ease, visibility .15s;
}
.tol-dd__panel::before{
  content: ''; position: absolute; top: 0; left: 14px; right: 14px; height: 1px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent); opacity: .6;
}
.tol-dd.is-open .tol-dd__panel{ opacity: 1; visibility: visible; transform: none; }
.tol-dd__panel--wide{ min-width: 240px; max-height: 70vh; overflow-y: auto; }
.tol-dd__panel a{
  display: block; padding: .5rem .75rem; border-radius: 6px;
  color: var(--text-dim); font-size: .9rem; font-weight: 500;
}
.tol-dd__panel a:hover, .tol-dd__panel a[aria-current="page"]{ background: rgba(57,194,242,.08); color: var(--text); }
.tol-dd__panel a[aria-current="page"]{ box-shadow: inset 2px 0 0 var(--gold); }
.tol-dd--admin .tol-dd__btn{ color: var(--blood); }

.tol-nav__actions{ display: flex; align-items: center; gap: .6rem; flex-shrink: 0; }
.tol-online{
  display: inline-flex; align-items: center; gap: .45rem;
  font: 600 .75rem/1 var(--font-mono); color: var(--text-dim);
  padding: .45rem .7rem; border: 1px solid var(--line); border-radius: 999px;
  background: rgba(15,27,46,.6);
}
.tol-dot{
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--emerald-hi); box-shadow: 0 0 8px var(--emerald-hi);
  animation: tolPulse 2s ease-in-out infinite;
}
.tol-dot--gold{ background: var(--gold-hi); box-shadow: 0 0 8px var(--gold-hi); }
.tol-dot--down{ background: var(--blood); box-shadow: 0 0 8px var(--blood); animation: none; }
a.tol-online:hover{ color: var(--text); border-color: var(--text-mute); }
.tol-online--down{ color: #FF9C95; border-color: rgba(226,67,60,.35); }
@keyframes tolPulse{ 50%{ opacity: .35; } }

.tol-nav__toggle{
  display: none; margin-left: auto;
  background: none; border: 1px solid var(--line); border-radius: var(--radius-sm);
  color: var(--text); width: 42px; height: 42px; cursor: pointer;
  align-items: center; justify-content: center; font-size: 1.3rem;
}

/* ================================ Buttons ================================ */
.tol-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  padding: .62rem 1.1rem; border-radius: var(--radius-sm);
  font: 600 .85rem/1 var(--font-display); letter-spacing: .04em;
  border: 1px solid transparent; cursor: pointer; white-space: nowrap;
  transition: transform .15s ease, box-shadow .2s ease, background .2s ease, color .15s ease, border-color .15s ease;
}
.tol-btn--gold{
  color: #1A1206;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold) 55%, #B98A26);
  border-color: rgba(243,210,122,.7);
  box-shadow: 0 6px 18px rgba(217,169,58,.25), inset 0 1px 0 rgba(255,255,255,.4);
}
.tol-btn--gold:hover{ color: #1A1206; transform: translateY(-1px); box-shadow: 0 10px 26px rgba(217,169,58,.4), inset 0 1px 0 rgba(255,255,255,.4); }
.tol-btn--ice{
  color: #04121C;
  background: linear-gradient(180deg, var(--ice-glow), var(--ice));
  box-shadow: 0 6px 18px rgba(57,194,242,.25);
}
.tol-btn--ice:hover{ color: #04121C; transform: translateY(-1px); box-shadow: 0 10px 26px rgba(57,194,242,.4); }
.tol-btn--ghost{ color: var(--text); background: rgba(15,27,46,.6); border-color: var(--line); }
.tol-btn--ghost:hover{ color: var(--gold-hi); border-color: var(--gold); }
.tol-btn--text{ color: var(--text-dim); padding-left: .4rem; padding-right: .4rem; }
.tol-btn--text:hover{ color: var(--text); }
.tol-btn--lg{ padding: .95rem 1.6rem; font-size: .95rem; }
.tol-btn--block{ width: 100%; }

/* ============================== Page shell ============================== */
.tol-page{ position: relative; z-index: 1; min-height: calc(100vh - var(--nav-h) - 220px); }
.tol-shell{ max-width: 1180px; margin: 0 auto; padding: 2.2rem 1.25rem 4rem; }
.tol-card{
  position: relative;
  background: linear-gradient(180deg, rgba(15,27,46,.92), rgba(10,19,34,.92));
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 2rem 2.2rem; box-shadow: var(--shadow);
  overflow-x: auto;
}
.tol-card::before{
  content: ''; position: absolute; top: -1px; left: 24px; right: 24px; height: 2px;
  background: linear-gradient(90deg, transparent, var(--ice), var(--gold), var(--emerald), transparent);
  border-radius: 2px;
}
.tol-serverpick{ float: right; font-size: .85rem; color: var(--text-dim); }

/* ============================ FluxCP content ============================ */
table{ border-collapse: collapse; }
td, th{ vertical-align: top; }

.message, .notice, p.red, p.green, .important{
  padding: .85rem 1.1rem; border-radius: var(--radius-sm); margin: 0 0 1.25rem;
  border: 1px solid; font-weight: 500;
}
.message{ background: rgba(47,163,107,.12); border-color: rgba(95,214,155,.35); color: #BFF1D6; }
.notice, .important{ background: rgba(217,169,58,.1); border-color: rgba(243,210,122,.35); color: #F6E2AD; }
p.red{ background: rgba(226,67,60,.1); border-color: rgba(226,67,60,.4); color: #FFB4AE; }
p.green{ background: rgba(47,163,107,.1); border-color: rgba(95,214,155,.35); color: #BFF1D6; }
.red{ color: #FF8A82; }
.green, .up, .online{ color: var(--emerald-hi); }
.down, .offline{ color: #FF8A82; }
.keyword, .not-applicable, .note{ color: var(--text-mute); font-style: italic; }
.important .server-name{ color: var(--gold-hi); }

#submenu, #pagemenu{
  font-size: .85rem; color: var(--text-mute); margin-bottom: 1.4rem;
  padding-bottom: 1rem; border-bottom: 1px solid var(--line-soft);
}
#submenu a, #pagemenu a{
  display: inline-block; margin: .15rem .1rem; padding: .3rem .7rem; border-radius: 999px;
  border: 1px solid var(--line); color: var(--text-dim); font-weight: 600;
}
#submenu a:hover, #pagemenu a:hover{ border-color: var(--gold); color: var(--gold-hi); }
#submenu a.current-sub-menu{ background: rgba(217,169,58,.12); border-color: var(--gold); color: var(--gold-hi); }

/* Data tables */
.horizontal-table, .vertical-table, .woe-table, .install_table, .shop-table, #server_status{
  width: 100%; margin: 0 0 1.5rem;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  border-collapse: separate; border-spacing: 0; overflow: hidden;
  background: rgba(5,9,17,.35);
}
.horizontal-table th, .vertical-table th, .woe-table th, .install_table th, #server_status th{
  background: var(--navy-3); color: var(--gold-hi);
  font: 600 .74rem/1.3 var(--font-display); letter-spacing: .08em; text-transform: uppercase;
  text-align: left; padding: .75rem .9rem; border-bottom: 1px solid var(--line);
}
.horizontal-table th a, .vertical-table th a{ color: var(--gold-hi); }
.horizontal-table td, .vertical-table td, .woe-table td, .install_table td, #server_status td{
  padding: .7rem .9rem; border-bottom: 1px solid var(--line-soft); color: var(--text);
}
.horizontal-table tr:last-child td, .vertical-table tr:last-child td{ border-bottom: 0; }
.horizontal-table tr:hover td{ background: rgba(57,194,242,.04); }
.vertical-table th{ width: 220px; border-right: 1px solid var(--line); }
.top-ranked td{ background: rgba(217,169,58,.07); }
.top-ranked a{ color: var(--gold-hi); font-weight: 700; }
.empty-row td{ color: var(--text-mute); text-align: center; }

/* Pagination */
.pages{ display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; margin: 1rem 0; font-size: .85rem; color: var(--text-mute); }
.pages a, .pages .current-page{
  min-width: 34px; text-align: center; padding: .35rem .6rem; border-radius: 6px;
  border: 1px solid var(--line); color: var(--text-dim);
}
.pages a:hover{ border-color: var(--ice); color: var(--text); }
.pages .current-page{ background: var(--ice); border-color: var(--ice); color: #04121C; font-weight: 700; }
.jump-to-page input{ width: 60px; }

/* Forms (shared) */
input[type=text], input[type=password], input[type=email], input[type=number], input[type=file], input[type=search], textarea, select{
  font: 500 .95rem/1.4 var(--font-body);
  color: var(--text);
  background: var(--void);
  border: 1px solid var(--line);
  border-radius: var(--radius-sm);
  padding: .6rem .8rem;
  transition: border-color .15s ease, box-shadow .15s ease;
  max-width: 100%;
}
select{ padding-right: 2rem; cursor: pointer;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23D9A93A' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right .7rem center;
}
input::placeholder, textarea::placeholder{ color: var(--text-mute); }
input:focus, textarea:focus, select:focus{
  outline: none; border-color: var(--gold);
  box-shadow: 0 0 0 3px rgba(217,169,58,.18);
}
input[type=checkbox], input[type=radio]{ accent-color: var(--gold); width: 16px; height: 16px; vertical-align: -3px; }
label{ cursor: pointer; }

button, input[type=submit], input[type=button], input[type=reset], .submit_button, .button-action{
  font: 600 .85rem/1 var(--font-display); letter-spacing: .04em;
  color: #1A1206; cursor: pointer;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold) 55%, #B98A26);
  border: 1px solid rgba(243,210,122,.7); border-radius: var(--radius-sm);
  padding: .7rem 1.2rem;
  box-shadow: 0 6px 18px rgba(217,169,58,.2);
  transition: transform .15s ease, box-shadow .2s ease;
}
button:hover, input[type=submit]:hover, .submit_button:hover{ transform: translateY(-1px); box-shadow: 0 10px 26px rgba(217,169,58,.35); }
input[type=reset], input[type=button]{ color: var(--text); background: var(--navy-3); border-color: var(--line); box-shadow: none; }
.tol-dd__btn, .tol-nav__toggle{ box-shadow: none; transform: none !important; }
.tol-dd__btn:hover{ box-shadow: none; }

.generic-form-table{ width: 100%; }
.generic-form-table th{ text-align: left; padding: .7rem 1rem .7rem 0; width: 200px; color: var(--text-dim); font-weight: 600; font-size: .9rem; }
.generic-form-table td{ padding: .5rem 0; }
.generic-form-table td p, .generic-form-table td div{ color: var(--text-mute); font-size: .85rem; margin: .35rem 0 0; }
.generic-form-table input[type=text], .generic-form-table input[type=password]{ width: 100%; max-width: 380px; }

.search-form, .search-form2{
  background: rgba(5,9,17,.5); border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 1rem 1.2rem; margin-bottom: 1.4rem;
}
.search-form p, .search-form2 p{ display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: center; margin: 0 0 .7rem; }
.search-form label, .search-form2 label{ color: var(--text-dim); font-size: .85rem; font-weight: 600; }
.toggler a{ font-weight: 600; }
.info-text, .info-text-total, .info-text-results{ color: var(--text-dim); font-size: .9rem; }

/* Misc FluxCP bits */
.character-stats td{ padding: .35rem .8rem; }
.character-stats .stat-name{ color: var(--text-dim); }
.character-stats .stat-value{ color: var(--gold-hi); font-family: var(--font-mono); }
.credit-balance{ background: rgba(217,169,58,.08); border: 1px solid rgba(217,169,58,.3); border-radius: var(--radius-sm); padding: .8rem 1rem; margin-bottom: 1.2rem; }
.credit-balance .balance-amount{ color: var(--gold-hi); font-family: var(--font-mono); font-weight: 600; }
.script, .script-line-code, .raw-txn-log, pre, code{ font-family: var(--font-mono); font-size: .85rem; background: var(--void); border-radius: 6px; }
.state-pending{ color: var(--gold-hi); }
.state-banned, .state-permanently-banned{ color: #FF8A82; }
.equipped td{ background: rgba(47,163,107,.07); }
.mvp{ color: var(--gold-hi); font-weight: 700; }
.newsDiv h4{ color: var(--gold-hi); }
.newsCont{ border-left: 2px solid var(--line); padding-left: 1rem; margin-bottom: 1.5rem; }
.newsDate{ color: var(--text-mute); }
.clear{ clear: both; }
#copyright, #info{ display: none; }

/* ToL Jam nav button (game styles live in css/toljam.css) */
.tol-jamlink{
  display: inline-flex; align-items: center; gap: .3rem; margin-left: .3rem;
  padding: .5rem .8rem; border-radius: 999px; white-space: nowrap;
  font: 700 .74rem/1 var(--font-display); letter-spacing: .12em; text-transform: uppercase;
  color: var(--ice-glow); border: 1px solid rgba(57,194,242,.45); background: rgba(57,194,242,.08);
}
.tol-jamlink:hover, .tol-jamlink.is-current{ color: #04121C; background: var(--ice-glow); border-color: var(--ice-glow); }
@media (max-width: 1320px){ .tol-jamlink{ padding: .5rem .6rem; letter-spacing: .08em; } }
@media (max-width: 1180px){ .tol-jamlink{ margin: .6rem 0 0; justify-content: center; } }

/* Server status (S1 / S2) */
.tol-statusgrid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1rem; margin: 1.5rem 0 1rem; }
.tol-shard{
  padding: 1.2rem 1.3rem; border-radius: var(--radius-sm);
  background: rgba(5,9,17,.5); border: 1px solid var(--line);
}
.tol-shard.is-up{ border-color: rgba(95,214,155,.4); }
.tol-shard.is-down{ border-color: rgba(226,67,60,.35); }
.tol-shard__head{ display: flex; align-items: center; justify-content: space-between; gap: .5rem; margin-bottom: .6rem; }
.tol-shard__name{ font: 700 1.25rem/1.1 var(--font-display); color: var(--gold-hi); }
.tol-shard__players{ color: var(--text-mute); font-size: .9rem; }
.tol-shard__players b{ font: 700 1.6rem/1 var(--font-display); color: var(--text); margin-right: .3rem; }
.tol-status{ display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; font-size: .88rem; }
.tol-status--up{ color: var(--emerald-hi); }
.tol-status--down{ color: #FF9C95; }
#server_status td.server strong{ font-family: var(--font-display); color: var(--gold-hi); letter-spacing: .04em; }
.tol-status__total td{ background: rgba(5,9,17,.4); }

/* ================================ Footer ================================ */
.tol-footer{ position: relative; z-index: 1; border-top: 1px solid var(--line); background: linear-gradient(180deg, rgba(10,19,34,.6), var(--void)); }
.tol-footer__inner{
  max-width: 1180px; margin: 0 auto; padding: 3rem 1.25rem 2rem;
  display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 2rem;
}
.tol-footer__brand img{ width: 165px; height: auto; margin-bottom: .6rem; }
.tol-footer__brand p{ color: var(--text-mute); font-size: .9rem; max-width: 320px; }
.tol-footer__col{ display: flex; flex-direction: column; gap: .5rem; }
.tol-footer__col h4{ margin: 0 0 .4rem; font: 600 .72rem/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.tol-footer__col a{ color: var(--text-dim); font-size: .9rem; }
.tol-footer__col a:hover{ color: var(--text); }
.tol-footer__select{ display: flex; flex-direction: column; gap: .3rem; color: var(--text-mute); font-size: .8rem; }
.tol-footer__select select{ font-size: .85rem; padding: .45rem .7rem; padding-right: 2rem; }
.tol-footer__base{
  max-width: 1180px; margin: 0 auto; padding: 1.2rem 1.25rem 5rem;
  border-top: 1px solid var(--line-soft);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem;
  color: var(--text-mute); font-size: .8rem;
}

/* Floating chip */
.tol-chip{
  position: fixed; z-index: 40; bottom: 18px; left: 18px;
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .6rem 1rem; border-radius: 999px;
  background: rgba(10,19,34,.92); border: 1px solid rgba(217,169,58,.55);
  color: var(--text); font-size: .85rem;
  box-shadow: 0 10px 30px rgba(0,0,0,.5), 0 0 0 4px rgba(217,169,58,.06);
  backdrop-filter: blur(8px);
}
.tol-chip strong{ color: var(--gold-hi); font-weight: 700; }
.tol-chip:hover{ color: var(--text); border-color: var(--gold-hi); }

/* ================================= Home ================================= */
.tol-hero{
  position: relative; overflow: hidden;
  min-height: calc(100vh - var(--nav-h));
  display: flex; align-items: center;
  padding: 2rem 1.25rem 6rem;
  margin-top: calc(var(--nav-h) * -1); padding-top: calc(var(--nav-h) + 1.5rem);
}
.tol-hero__art{
  position: absolute; inset: 0; z-index: 0;
  background:
    linear-gradient(90deg, var(--void) 0%, rgba(5,9,17,.97) 38%, rgba(5,9,17,.55) 62%, rgba(5,9,17,.4) 100%),
    linear-gradient(0deg, var(--void) 0%, transparent 35%),
    var(--hero-img) right center / auto 105% no-repeat;
}
.tol-hero__glow{
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(600px 400px at 70% 40%, rgba(57,194,242,.18), transparent 70%),
    radial-gradient(500px 300px at 20% 70%, rgba(217,169,58,.10), transparent 70%);
}
.tol-hero__inner{ position: relative; z-index: 1; max-width: 1180px; width: 100%; margin: 0 auto; }
.tol-hero__content{ max-width: 640px; }
.tol-hero__logo{
  width: min(250px, 70%); height: auto; display: block; margin: 0 0 1rem -8px;
  filter: drop-shadow(0 0 30px rgba(57,194,242,.35)) drop-shadow(0 10px 30px rgba(0,0,0,.6));
  animation: tolFloat 6s ease-in-out infinite;
}
@keyframes tolFloat{ 50%{ transform: translateY(-6px); } }
.tol-badge{
  display: inline-flex; align-items: center; gap: .55rem;
  padding: .45rem 1rem; border-radius: 999px;
  border: 1px solid rgba(243,210,122,.45); background: rgba(217,169,58,.08);
  font: 600 .72rem/1 var(--font-display); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-hi);
  margin-bottom: 1.2rem;
}
.tol-hero__kicker{ font: 600 .9rem/1.4 var(--font-display); letter-spacing: .06em; color: var(--ice-glow); margin: 0 0 .6rem; }
.tol-hero__title{
  font-family: var(--font-display); font-weight: 700; margin: 0 0 1.2rem;
  font-size: clamp(2.1rem, 4.4vw, 3.5rem); line-height: 1.05; letter-spacing: .01em;
  text-transform: uppercase;
  background: linear-gradient(180deg, #FFFFFF 10%, #CFE9F7 60%, #8FC7E3);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 0 40px rgba(57,194,242,.25);
}
.tol-hero__title::after{ display: none; }
.tol-hero__title em{
  display: block; font-style: italic; text-transform: none; font-weight: 600;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold));
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.tol-hero__text{ color: var(--text-dim); font-size: 1.05rem; max-width: 560px; margin-bottom: 1.8rem; }
.tol-hero__cta{ display: flex; flex-wrap: wrap; gap: .8rem; margin-bottom: 2rem; }
.tol-rates{ display: flex; flex-wrap: wrap; gap: .5rem; }
.tol-rate{
  display: inline-flex; flex-direction: column; gap: .2rem;
  padding: .55rem .9rem; border-radius: var(--radius-sm);
  background: rgba(10,19,34,.7); border: 1px solid var(--line);
}
.tol-rate small{ font: 600 .65rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--text-mute); }
.tol-rate b{ font: 700 1.05rem/1 var(--font-display); color: var(--ice-glow); }

.tol-stats{
  position: relative; z-index: 2; max-width: 1180px; margin: -3.5rem auto 0; padding: 0 1.25rem;
}
.tol-stats__grid{
  display: grid; grid-template-columns: repeat(4, 1fr);
  background: linear-gradient(180deg, rgba(15,27,46,.95), rgba(10,19,34,.95));
  border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.tol-stat{ padding: 1.5rem 1.2rem; text-align: center; border-right: 1px solid var(--line-soft); }
.tol-stat:last-child{ border-right: 0; }
.tol-stat__num{ font: 700 clamp(1.7rem, 3vw, 2.4rem)/1 var(--font-display); color: var(--text); }
.tol-stat__num--gold{ color: var(--gold-hi); }
.tol-stat__num--ice{ color: var(--ice-glow); }
.tol-stat__num--green{ color: var(--emerald-hi); }
.tol-stat__label{ margin-top: .5rem; font: 600 .7rem/1.3 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--text-mute); }

/* ===================== S2 pre-registration goal ===================== */
.tol-goalwrap{ position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: 3.5rem 1.25rem 0; }
.tol-goal{
  position: relative; overflow: hidden;
  padding: 2rem 2.2rem 1.6rem; border-radius: var(--radius);
  background:
    radial-gradient(700px 260px at 100% 0%, rgba(57,194,242,.10), transparent 70%),
    linear-gradient(180deg, rgba(15,27,46,.96), rgba(10,19,34,.96));
  border: 1px solid var(--line); box-shadow: var(--shadow);
}
.tol-goal::before{
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--gold-deep), var(--gold-hi), var(--gold-deep));
}
.tol-goal__head{ display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 1rem 2rem; }
.tol-goal__kicker{ font: 700 .7rem/1 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--ice-glow); margin-bottom: .6rem; }
.tol-goal__title{ font-size: clamp(1.5rem, 3vw, 2.1rem); margin: 0; }
.tol-goal__title::after{ display: none; }

.tol-countdown{
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 1.5rem;
  margin: 1.4rem 0 1.2rem; padding: .9rem 1.1rem; border-radius: var(--radius-sm);
  background: rgba(217,169,58,.07); border: 1px solid rgba(243,210,122,.28);
}
.tol-countdown__label{ display: flex; align-items: center; gap: .55rem; color: var(--text-dim); font-size: .92rem; }
.tol-countdown__label strong{ color: var(--gold-hi); font-family: var(--font-display); letter-spacing: .03em; }
.tol-countdown__clock{ display: flex; gap: .5rem; }
.tol-countdown__clock span{
  min-width: 62px; padding: .45rem .5rem; border-radius: 8px; text-align: center;
  background: var(--void); border: 1px solid var(--line);
}
.tol-countdown__clock b{ display: block; font: 700 1.35rem/1.1 var(--font-display); color: var(--text); font-variant-numeric: tabular-nums; }
.tol-countdown__clock small{ font: 600 .6rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--text-mute); }
.tol-countdown__live{ font: 700 1rem/1.3 var(--font-display); color: var(--emerald-hi); }
[hidden]{ display: none !important; }

.tol-goal__count{ display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .4rem 1rem; margin-bottom: .6rem; }
.tol-goal__count p{ margin: 0; color: var(--text-dim); }
.tol-goal__count strong{ font: 700 2rem/1 var(--font-display); color: var(--ice-glow); margin-right: .2rem; font-variant-numeric: tabular-nums; }
.tol-goal__status{ font-size: .85rem; color: var(--text-mute) !important; }
.tol-goal__bar{
  position: relative; height: 12px; border-radius: 999px; overflow: visible;
  background: var(--void); border: 1px solid var(--line); margin-bottom: 1.3rem;
}
.tol-goal__bar span{
  display: block; height: 100%; min-width: 10px; border-radius: inherit;
  background: linear-gradient(90deg, var(--ice), var(--ice-glow) 70%, var(--gold-hi));
  box-shadow: 0 0 14px rgba(57,194,242,.5);
  transition: width .8s ease;
}
.tol-goal__bar i{
  position: absolute; top: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%;
  background: var(--navy-3); border: 2px solid var(--line);
}
.tol-goal__bar i.is-hit{ background: var(--gold-hi); border-color: var(--gold); }

.tol-goal__tiers{ list-style: none; margin: 0 0 1rem; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }
.tol-tier{
  display: flex; align-items: center; gap: .9rem;
  padding: .9rem 1rem; border-radius: var(--radius-sm);
  background: rgba(5,9,17,.55); border: 1px solid var(--line);
}
.tol-tier__icon{
  flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 10px; font-size: 1.3rem;
  color: var(--text-mute); background: var(--navy-3);
}
.tol-tier b{ display: block; font: 700 1.2rem/1.2 var(--font-display); color: var(--text-dim); }
.tol-tier small{ font-size: .78rem; color: var(--text-mute); }
.tol-tier.is-unlocked{ border-color: rgba(243,210,122,.55); background: rgba(217,169,58,.08); }
.tol-tier.is-unlocked .tol-tier__icon{ color: #1A1206; background: linear-gradient(180deg, var(--gold-hi), var(--gold)); }
.tol-tier.is-unlocked b{ color: var(--gold-hi); }
.tol-goal__note{ margin: 0; font-size: .85rem; color: var(--text-mute); }

.tol-quick{
  display: grid; grid-template-columns: repeat(3, 1fr);
  margin: 1.6rem 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.tol-quick__item{
  display: flex; align-items: center; gap: .9rem; padding: 1.2rem 1rem;
  color: var(--text); border-right: 1px solid var(--line-soft);
  transition: background .15s ease;
}
.tol-quick__item:last-child{ border-right: 0; }
.tol-quick__item:hover{ color: var(--text); background: rgba(57,194,242,.05); }
.tol-quick__item > span:nth-child(2){ flex: 1; min-width: 0; }
.tol-quick__item b{ display: block; font-size: .98rem; }
.tol-quick__item small{ color: var(--text-mute); font-size: .85rem; }
.tol-quick__item > .tol-icon{ color: var(--text-mute); transition: transform .15s ease, color .15s ease; }
.tol-quick__item:hover > .tol-icon{ color: var(--gold-hi); transform: translateX(3px); }
.tol-quick__icon{ flex-shrink: 0; display: inline-flex; font-size: 2rem; color: var(--ice-glow); }
.tol-quick__icon--gold{ color: var(--gold-hi); }
.tol-quick__icon--green{ color: var(--emerald-hi); }

.tol-about{
  position: relative; overflow: hidden;
  padding: 1.6rem 1.8rem; border-radius: var(--radius);
  background:
    radial-gradient(500px 200px at 90% 0%, rgba(139,230,255,.22), transparent 70%),
    linear-gradient(120deg, #0E3E66, #13598E 55%, #1B78B4);
  border: 1px solid rgba(139,230,255,.25);
  box-shadow: 0 18px 40px rgba(14,62,102,.35);
}
.tol-about__kicker{ font: 700 .7rem/1 var(--font-display); letter-spacing: .2em; text-transform: uppercase; color: var(--gold-hi); margin-bottom: .9rem; }
.tol-about__grid{ display: grid; grid-template-columns: repeat(4, 1fr); }
.tol-about__item{ padding: .2rem 1.2rem; border-left: 1px solid rgba(255,255,255,.18); }
.tol-about__item:first-child{ padding-left: 0; border-left: 0; }
.tol-about__item b{ display: block; font: 700 clamp(1rem, 1.75vw, 1.35rem)/1.25 var(--font-display); color: #fff; white-space: nowrap; }
.tol-about__item small{ color: rgba(232,241,248,.75); font-size: .82rem; }

.tol-section{ position: relative; z-index: 1; max-width: 1180px; margin: 0 auto; padding: 5rem 1.25rem 1rem; }
.tol-section__head{ text-align: center; margin-bottom: 2.5rem; }
.tol-eyebrow{ font: 600 .72rem/1 var(--font-display); letter-spacing: .3em; text-transform: uppercase; color: var(--gold); margin-bottom: .8rem; }
.tol-eyebrow::before, .tol-eyebrow::after{ content: ' ✦ '; color: var(--gold-deep); }
.tol-section__head h2{ font-size: clamp(1.7rem, 3.5vw, 2.6rem); margin: 0 0 .6rem; text-transform: uppercase; }
.tol-section__head h2::after{ margin: .9rem auto 0; background: linear-gradient(90deg, transparent, var(--gold), transparent); width: 120px; }
.tol-section__head p{ color: var(--text-dim); max-width: 620px; margin: 0 auto; }

.tol-realms{ display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.tol-realm{
  position: relative; overflow: hidden;
  padding: 2rem; border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(15,27,46,.9), rgba(10,19,34,.9));
  border: 1px solid var(--line);
  transition: border-color .2s ease, transform .2s ease;
}
.tol-realm:hover{ transform: translateY(-3px); }
.tol-realm--s1:hover{ border-color: var(--ice); }
.tol-realm--s2{ border-color: rgba(217,169,58,.5); box-shadow: 0 0 0 1px rgba(217,169,58,.15), 0 20px 50px rgba(217,169,58,.08); }
.tol-realm--s2:hover{ border-color: var(--gold-hi); }
.tol-realm__tag{ font: 700 3rem/1 var(--font-display); }
.tol-realm--s1 .tol-realm__tag{ color: var(--ice-glow); }
.tol-realm--s2 .tol-realm__tag{ color: var(--gold-hi); }
.tol-realm__flag{
  position: absolute; top: 1.4rem; right: 1.4rem;
  font: 700 .65rem/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase;
  padding: .4rem .7rem; border-radius: 999px;
}
.tol-realm--s1 .tol-realm__flag{ color: var(--ice-glow); border: 1px solid rgba(57,194,242,.4); }
.tol-realm--s2 .tol-realm__flag{ color: #1A1206; background: var(--gold-hi); }
.tol-realm h3{ margin: .8rem 0 .5rem; color: var(--text); font-size: 1.3rem; }
.tol-realm p{ color: var(--text-dim); margin-bottom: 1.2rem; }
.tol-realm__meta{ display: flex; gap: 1.5rem; margin-bottom: 1.4rem; font-size: .85rem; color: var(--text-mute); }
.tol-realm__meta b{ display: block; font: 700 1.2rem/1.2 var(--font-display); color: var(--text); }

.tol-features{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.tol-feature{
  padding: 1.6rem; border-radius: var(--radius);
  background: rgba(10,19,34,.7); border: 1px solid var(--line);
}
.tol-feature__rune{ font: 700 1.6rem/1 var(--font-display); color: var(--gold); margin-bottom: .8rem; }
.tol-feature h4{ margin: 0 0 .4rem; font-size: 1.05rem; color: var(--text); }
.tol-feature p{ margin: 0; color: var(--text-dim); font-size: .92rem; }

.tol-news{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.tol-news__item{
  display: flex; flex-direction: column;
  padding: 1.5rem; border-radius: var(--radius);
  background: linear-gradient(180deg, rgba(15,27,46,.9), rgba(10,19,34,.9)); border: 1px solid var(--line);
}
.tol-news__item:hover{ border-color: rgba(57,194,242,.5); }
.tol-news__date{ font: 600 .7rem/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--gold); margin-bottom: .7rem; }
.tol-news__item h4{ margin: 0 0 .6rem; font-size: 1.1rem; color: var(--text); }
.tol-news__body{ color: var(--text-dim); font-size: .92rem; flex: 1; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; }
.tol-news__body p{ margin: 0 0 .5rem; }
.tol-news__more{ margin-top: 1rem; font-weight: 600; font-size: .88rem; }
.tol-empty{
  text-align: center; color: var(--text-mute); padding: 2.5rem;
  border: 1px dashed var(--line); border-radius: var(--radius);
}

.tol-cta{
  position: relative; z-index: 1; max-width: 1180px; margin: 5rem auto 4rem; padding: 0 1.25rem;
}
.tol-cta__box{
  position: relative; overflow: hidden; text-align: center;
  padding: 3.5rem 1.5rem; border-radius: 18px;
  background:
    radial-gradient(600px 300px at 50% 0%, rgba(217,169,58,.18), transparent 70%),
    radial-gradient(500px 300px at 50% 120%, rgba(57,194,242,.16), transparent 70%),
    var(--navy);
  border: 1px solid rgba(217,169,58,.35);
}
.tol-cta__box h2{ font-size: clamp(1.6rem, 3.4vw, 2.4rem); text-transform: uppercase; }
.tol-cta__box h2::after{ margin: .9rem auto 0; background: linear-gradient(90deg, transparent, var(--gold), transparent); }
.tol-cta__box p{ color: var(--text-dim); max-width: 520px; margin: 0 auto 1.6rem; }

/* ============================ Auth: register / login ============================ */
.tol-page--auth .tol-shell{ max-width: 1180px; padding-top: 2.5rem; }
.tol-auth{
  display: grid; grid-template-columns: 1.05fr 1fr; gap: 0;
  border: 1px solid var(--line); border-radius: 18px; overflow: hidden;
  background: linear-gradient(180deg, rgba(15,27,46,.95), rgba(10,19,34,.95));
  box-shadow: var(--shadow);
}
.tol-auth__art{
  position: relative; min-height: 640px;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 2.5rem;
  background:
    linear-gradient(0deg, rgba(5,9,17,.95) 0%, rgba(5,9,17,.35) 55%, rgba(5,9,17,.2) 100%),
    var(--auth-img) center 30% / cover no-repeat;
  border-right: 1px solid var(--line);
}
.tol-auth__art img.tol-auth__logo{ position: absolute; top: 2rem; left: 50%; transform: translateX(-50%); width: 240px; height: auto; filter: drop-shadow(0 0 24px rgba(57,194,242,.4)); }
.tol-auth__art h2{ font-size: 1.9rem; text-transform: uppercase; margin-bottom: .5rem; }
.tol-auth__art p{ color: var(--text-dim); margin: 0; }
.tol-auth__form{ padding: 2.5rem 2.6rem; }
.tol-auth__form h1{ font-size: 1.7rem; margin: 0 0 .4rem; text-transform: uppercase; }
.tol-auth__lead{ color: var(--text-dim); margin-bottom: 1.6rem; font-size: .95rem; }

.tol-field{ margin-bottom: 1rem; }
.tol-field > label, .tol-label{
  display: block; margin-bottom: .4rem;
  font: 600 .72rem/1 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim);
}
.tol-input{ position: relative; }
.tol-input .tol-icon{ position: absolute; left: .85rem; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--text-mute); pointer-events: none; transition: color .15s ease; }
.tol-input input{ width: 100%; padding-left: 2.6rem; height: 46px; }
.tol-input:focus-within .tol-icon{ color: var(--gold); }
.tol-row{ display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.tol-hint{ color: var(--text-mute); font-size: .8rem; margin-top: .35rem; }

/* Server picker cards */
.tol-servers{ display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin-bottom: 1.3rem; }
.tol-server{ position: relative; display: block; cursor: pointer; }
.tol-server input{ position: absolute; opacity: 0; pointer-events: none; }
.tol-server__card{
  display: block; height: 100%;
  padding: 1rem 1.1rem; border-radius: var(--radius-sm);
  border: 1px solid var(--line); background: rgba(5,9,17,.55);
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}
.tol-server__name{ display: flex; align-items: center; justify-content: space-between; gap: .5rem; font: 700 1.3rem/1 var(--font-display); color: var(--text); }
.tol-server__flag{ font: 700 .6rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; padding: .3rem .5rem; border-radius: 999px; color: #1A1206; background: var(--gold-hi); }
.tol-server__flag--ice{ background: transparent; color: var(--ice-glow); border: 1px solid rgba(57,194,242,.4); }
.tol-server__desc{ display: block; margin-top: .45rem; font-size: .82rem; color: var(--text-mute); }
.tol-server:hover .tol-server__card{ border-color: var(--text-mute); }
.tol-server input:checked + .tol-server__card{
  border-color: var(--gold); background: rgba(217,169,58,.08);
  box-shadow: 0 0 0 3px rgba(217,169,58,.15);
}
.tol-server input:checked + .tol-server__card .tol-server__name{ color: var(--gold-hi); }
.tol-server input:focus-visible + .tol-server__card{ outline: 2px solid var(--ice); outline-offset: 2px; }

/* Gender segmented control */
.tol-seg{ display: inline-flex; padding: 3px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: rgba(5,9,17,.55); }
.tol-seg label{ position: relative; }
.tol-seg input{ position: absolute; opacity: 0; pointer-events: none; }
.tol-seg span{ display: block; padding: .5rem 1.1rem; border-radius: 6px; color: var(--text-dim); font-weight: 600; font-size: .9rem; }
.tol-seg input:checked + span{ background: var(--navy-3); color: var(--gold-hi); box-shadow: inset 0 0 0 1px var(--gold-deep); }
.tol-seg input:focus-visible + span{ outline: 2px solid var(--ice); }
.tol-date select{ margin-right: .15rem; padding: .6rem 1.9rem .6rem .7rem; background-position: right .55rem center; }
.tol-row--auto{ grid-template-columns: auto 1fr; gap: 1.4rem; }
.tol-date{ white-space: nowrap; }

.tol-rules{ list-style: none; margin: 0 0 1.3rem; padding: .8rem 1rem; border-radius: var(--radius-sm); background: rgba(5,9,17,.45); border: 1px solid var(--line-soft); font-size: .8rem; color: var(--text-mute); display: grid; grid-template-columns: 1fr 1fr; gap: .25rem 1rem; }
.tol-rules li::before{ content: '◆ '; color: var(--gold-deep); }
.tol-terms{ font-size: .82rem; color: var(--text-mute); margin: 0 0 1rem; }
.tol-auth__alt{ text-align: center; margin: 1.2rem 0 0; color: var(--text-mute); font-size: .9rem; }
.tol-error{
  display: flex; gap: .6rem; align-items: flex-start;
  padding: .8rem 1rem; border-radius: var(--radius-sm); margin-bottom: 1.2rem;
  background: rgba(226,67,60,.1); border: 1px solid rgba(226,67,60,.45); color: #FFB4AE; font-weight: 500; font-size: .92rem;
}
.security-code img{ border-radius: 6px; border: 1px solid var(--line); margin-bottom: .5rem; }

/* ================================ Responsive ================================ */
@media (max-width: 1320px){
  .tol-online{ display: none; }
  .tol-dd__btn{ padding: .55rem .5rem; letter-spacing: .08em; }
}
@media (max-width: 1180px){
  .tol-nav__toggle{ display: inline-flex; }
  .tol-nav__menu{
    position: absolute; top: var(--nav-h); left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 1rem;
    padding: 1rem 1.25rem 1.5rem;
    background: rgba(5,9,17,.98); border-bottom: 1px solid var(--line);
    max-height: calc(100vh - var(--nav-h)); overflow-y: auto;
    display: none;
  }
  .tol-nav.is-open .tol-nav__menu{ display: flex; }
  .tol-nav__list{ flex-direction: column; align-items: stretch; }
  .tol-dd__btn{ width: 100%; justify-content: space-between; padding: .8rem .4rem; font-size: .85rem; border-bottom: 1px solid var(--line-soft); border-radius: 0; }
  .tol-dd__panel{ position: static; opacity: 1; visibility: visible; transform: none; display: none; box-shadow: none; background: transparent; border: 0; padding: .2rem 0 .5rem .6rem; }
  .tol-dd__panel::before{ display: none; }
  .tol-dd.is-open .tol-dd__panel{ display: block; }
  .tol-nav__actions{ flex-wrap: wrap; }
  .tol-nav__actions .tol-btn{ flex: 1; }
  .tol-online{ display: inline-flex; width: 100%; justify-content: center; }
}
@media (max-width: 980px){

  .tol-hero__art{ background:
    linear-gradient(0deg, var(--void) 5%, rgba(5,9,17,.75) 50%, rgba(5,9,17,.6) 100%),
    var(--hero-img) center top / cover no-repeat; }
  .tol-stats__grid{ grid-template-columns: repeat(2, 1fr); }
  .tol-stat:nth-child(2){ border-right: 0; }
  .tol-stat:nth-child(-n+2){ border-bottom: 1px solid var(--line-soft); }
  .tol-realms, .tol-features, .tol-news{ grid-template-columns: 1fr; }
  .tol-goal__tiers, .tol-about__grid{ grid-template-columns: repeat(2, 1fr); gap: .8rem; }
  .tol-about__item{ border-left: 0; padding: 0; }
  .tol-quick{ grid-template-columns: 1fr; }
  .tol-quick__item{ border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .tol-quick__item:last-child{ border-bottom: 0; }
  .tol-footer__inner{ grid-template-columns: 1fr 1fr; }
  .tol-auth{ grid-template-columns: 1fr; }
  .tol-auth__art{ min-height: 260px; border-right: 0; border-bottom: 1px solid var(--line); }
  .tol-auth__art img.tol-auth__logo{ width: 180px; top: 1.2rem; }
}
@media (max-width: 600px){
  .tol-card{ padding: 1.3rem 1rem; }
  .tol-shell{ padding: 1.2rem 1rem 3rem; }
  .tol-auth__form{ padding: 1.6rem 1.2rem; }
  .tol-row, .tol-servers, .tol-rules{ grid-template-columns: 1fr; }
  .tol-goal{ padding: 1.4rem 1.1rem 1.2rem; }
  .tol-goal__head .tol-btn{ width: 100%; }
  .tol-goal__tiers{ grid-template-columns: 1fr; gap: .5rem; }
  .tol-tier{ padding: .65rem .8rem; }
  .tol-tier__icon{ width: 34px; height: 34px; font-size: 1.1rem; }
  .tol-tier b{ display: inline; margin-right: .4rem; font-size: 1.05rem; }
  .tol-chip strong{ display: none; }
  .tol-countdown__clock{ width: 100%; }
  .tol-countdown__clock span{ flex: 1; min-width: 0; }
  .tol-about__grid{ grid-template-columns: 1fr; }
  .tol-footer__inner{ grid-template-columns: 1fr; }
  .tol-hero__cta .tol-btn{ width: 100%; }
  .vertical-table th{ width: auto; }
  .generic-form-table th, .generic-form-table td{ display: block; width: 100%; padding: .3rem 0; }
  .tol-chip{ left: 10px; right: 10px; bottom: 10px; justify-content: center; }
}
@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* Home: tighter spacing after the stats strip, quick links and About band were removed (2026-11-09) */
.tol-hero{ min-height: 0; padding-bottom: 2.5rem; }
.tol-goalwrap{ padding-top: 2.25rem; }
#realms.tol-section{ padding-top: 3.5rem; }
/* Nav: one online pill per realm (2026-11-09) */
.tol-online__realm{ color: var(--gold-hi); font-weight: 700; margin-right: .1rem; }
/* World pages: S1 | S2 realm tabs (2026-11-09) */
.tol-realmtabs{ display: flex; gap: .5rem; margin: .2rem 0 1.2rem; padding: .3rem; border: 1px solid var(--line); border-radius: 999px; width: max-content; max-width: 100%; background: rgba(5,9,17,.45); }
.tol-realmtab{ display: inline-flex; align-items: baseline; gap: .45rem; padding: .5rem 1.3rem; border-radius: 999px; font-family: 'Cinzel', serif; font-weight: 700; letter-spacing: .06em; color: var(--text-dim); text-decoration: none; transition: background .15s ease, color .15s ease; }
.tol-realmtab small{ font-family: 'Manrope', sans-serif; font-weight: 500; letter-spacing: 0; font-size: .75rem; color: var(--text-mute); }
.tol-realmtab:hover{ color: var(--text); background: rgba(57,194,242,.08); }
.tol-realmtab.is-on{ color: #1A1206; background: linear-gradient(180deg, var(--gold-hi), var(--gold)); box-shadow: 0 4px 16px rgba(217,169,58,.3); }
.tol-realmtab.is-on small{ color: rgba(26,18,6,.75); }
/* My Account: realm badge (2026-11-09) */
.tol-accrealm{ display: flex; align-items: center; gap: 1rem; margin: .4rem 0 1.2rem; padding: .9rem 1.1rem; border-radius: var(--radius); border: 1px solid rgba(57,194,242,.35); background: linear-gradient(90deg, rgba(57,194,242,.12), rgba(57,194,242,.02)); }
.tol-accrealm__tag{ flex: none; width: 54px; height: 54px; border-radius: 14px; display: grid; place-items: center; font-family: 'Cinzel', serif; font-weight: 700; font-size: 1.35rem; color: var(--ice-glow); border: 1px solid rgba(57,194,242,.45); background: rgba(5,9,17,.5); }
.tol-accrealm__text b{ display: block; color: var(--text); }
.tol-accrealm__text small{ color: var(--text-dim); }
.tol-accrealm--s2{ border-color: rgba(217,169,58,.45); background: linear-gradient(90deg, rgba(217,169,58,.14), rgba(217,169,58,.02)); }
.tol-accrealm--s2 .tol-accrealm__tag{ color: var(--gold-hi); border-color: rgba(217,169,58,.55); }