/* The World table (16 Oct 2026): styles only this page needs. Everything shared lives in assets/css/logicers.css.
   Not a game: it wears the site's slate, as the duel and the rooms do. */
[data-g="world"] { --c: #3A3F5C; --tint: #ECEEF6; }
@media (prefers-color-scheme: dark) {
  [data-g="world"] { --c: #AEB6DA; --tint: #141728; }
}

.wt-wrap { padding-bottom: 36px; }
.wt-h1 { margin-top: 10px; font-family: var(--display); font-weight: 800; font-size: clamp(1.75rem, 7.4vw, 2.5rem); letter-spacing: -0.035em; line-height: 1.07; }
.wt-lede { margin-top: 8px; font-size: 1.05rem; line-height: 1.4; }

/* Today · Yesterday · This month */
.wt-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; margin-top: 18px; padding: 4px; border-radius: 999px; background: var(--card); box-shadow: var(--shadow); }
.wt-tab { appearance: none; min-height: 42px; border: 0; border-radius: 999px; background: none; color: var(--soft); font: inherit; font-weight: 700; font-size: 0.95rem; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.wt-tab[aria-selected="true"] { background: var(--c); color: var(--on-c); }

/* your country */
.wt-mine { margin-top: 14px; padding: 18px 18px 16px; border-radius: 22px; background: var(--card); box-shadow: var(--shadow); }
.wt-wait { color: var(--soft); font-weight: 600; }
.wt-mine-top { display: flex; align-items: center; gap: 14px; }
.wt-bigflag { font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; font-size: 2.6rem; line-height: 1; flex: none; }
.wt-mine-name { min-width: 0; }
.wt-mine-name b { display: block; font-family: var(--display); font-weight: 800; font-size: 1.35rem; letter-spacing: -0.025em; line-height: 1.1; overflow-wrap: anywhere; }
.wt-mine-name span { display: block; margin-top: 3px; color: var(--soft); font-weight: 600; font-size: 0.9rem; }
.wt-place { margin-left: auto; text-align: right; flex: none; }
.wt-place b { display: block; font-family: var(--display); font-weight: 800; font-size: 2.3rem; letter-spacing: -0.04em; line-height: 0.95; font-variant-numeric: tabular-nums; }
.wt-place span { display: block; margin-top: 3px; color: var(--soft); font-weight: 700; font-size: 0.78rem; }
.wt-mine-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 16px; }
.wt-fact b { display: block; font-family: var(--display); font-weight: 800; font-size: 1.5rem; letter-spacing: -0.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.wt-fact span { display: block; margin-top: 4px; color: var(--soft); font-size: 0.82rem; font-weight: 600; line-height: 1.2; }
.wt-mine-line { margin-top: 14px; font-weight: 600; line-height: 1.35; }
.wt-mine-line b { font-family: var(--display); font-weight: 800; }
.wt-mine .wd-acts { margin-top: 14px; }
.wt-mine .wd-invite { background: var(--ok); color: var(--on-ok); min-height: 50px; font-size: 1rem; padding: 0 22px; }

/* the way to today's games */
.wt-play { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 14px 18px; border-radius: 20px; background: var(--c); color: var(--on-c); text-decoration: none; -webkit-tap-highlight-color: transparent; }
.wt-play-text { flex: 1; min-width: 0; }
.wt-play-kicker { display: block; font-size: 0.82rem; font-weight: 700; opacity: .85; }
.wt-play b { display: block; margin-top: 2px; font-family: var(--display); font-weight: 800; font-size: 1.15rem; letter-spacing: -0.02em; }
.wt-play svg { width: 24px; height: 24px; flex: none; }
.wt-play:active { transform: scale(0.985); }

/* the tables */
.wt-card { margin-top: 14px; padding: 16px 16px 12px; border-radius: 22px; background: var(--card); box-shadow: var(--shadow); }
.wt-card[hidden] { display: none; }
.wt-h2 { font-family: var(--display); font-weight: 800; font-size: 1.2rem; letter-spacing: -0.02em; }
.wt-note { margin-top: 3px; color: var(--soft); font-size: 0.84rem; font-weight: 600; line-height: 1.3; }
.wt-note:empty { display: none; }
.wt-conts { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 8px; }
.wt-conts li { display: grid; grid-template-columns: minmax(0, 8.2rem) 1fr 2.2rem; gap: 10px; align-items: center; }
.wt-conts .n { font-weight: 700; font-size: 0.95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wt-conts li.me .n { color: var(--c); }
.wt-conts b { font-family: var(--display); font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
.wt-conts li.me .wd-bar i { background: var(--c); }
.wt-list { list-style: none; margin: 8px 0 0; padding: 0; }
.wt-list li { display: grid; grid-template-columns: 2.1rem minmax(0, 1fr) auto; gap: 8px; align-items: center; min-height: 46px; padding: 6px 4px; border-top: 1px solid var(--line); }
.wt-list li:first-child { border-top: 0; }
.wt-list .at { font-family: var(--display); font-weight: 800; font-size: 1rem; color: var(--soft); text-align: center; font-variant-numeric: tabular-nums; }
.wt-list .who { min-width: 0; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wt-list .who small { display: block; color: var(--soft); font-weight: 600; font-size: 0.78rem; }
.wt-list .val { text-align: right; }
.wt-list .val b { display: block; font-family: var(--display); font-weight: 800; font-size: 1.2rem; font-variant-numeric: tabular-nums; }
.wt-list li.me { margin: 0 -8px; padding: 6px 12px; border-radius: 14px; border-top-color: transparent; background: var(--tint); }
.wt-list li.me + li { border-top-color: transparent; }
.wt-list li.gap { min-height: 20px; padding: 0; justify-content: center; color: var(--soft); border-top: 0; }
.wt-list li.gap span { grid-column: 1 / -1; text-align: center; letter-spacing: 0.3em; }
.wt-list li:nth-child(1) .at, .wt-list li:nth-child(2) .at, .wt-list li:nth-child(3) .at { color: var(--ink); }
.wt-busy li { grid-template-columns: 2.1rem minmax(0, 1fr) 6.5rem; }
.wt-busy .wd-bar { height: 10px; }
.wt-busy .val { display: grid; gap: 4px; }
.wt-busy .val b { font-size: 1rem; }
.wt-more { appearance: none; margin: 10px 0 2px; min-height: 40px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--ink); font: inherit; font-weight: 700; font-size: 0.9rem; cursor: pointer; }
.wt-foot { margin-top: 16px; font-size: 0.88rem; }
.wt-opt { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-weight: 700; cursor: pointer; }
.wt-opt input { width: 22px; height: 22px; accent-color: var(--c); }

@media (prefers-color-scheme: dark) {
  .wt-tabs, .wt-mine, .wt-card { background: rgba(255, 255, 255, .055); box-shadow: inset 0 0 0 1px var(--line); }
}
@media (max-width: 350px) {
  .wt-mine { padding: 16px 14px 14px; }
  .wt-bigflag { font-size: 2.2rem; }
  .wt-place b { font-size: 2rem; }
  .wt-fact b { font-size: 1.3rem; }
  .wt-conts li { grid-template-columns: minmax(0, 7rem) 1fr 2rem; gap: 8px; }
  .wt-tab { font-size: 0.88rem; }
}
@media (prefers-reduced-motion: reduce) {
  .wt-play:active { transform: none; }
}