/*
 * AoE landscape theme
 * Stone UI / grassland / sandy road / deep water / Roman red.
 */
:root {
  --ink: #292d27;
  --paper: #f4ecd9;
  --red: #b9472e;
  --lime: #a7bd48;
  --theme-stone: #30342e;
  --theme-stone-deep: #232721;
  --theme-stone-soft: #454b40;
  --theme-grass: #617c24;
  --theme-grass-bright: #91aa37;
  --theme-grass-pale: #e4ebc8;
  --theme-sand: #d7bd8c;
  --theme-sand-pale: #f4ead5;
  --theme-paper: #fffaf0;
  --theme-paper-2: #f8f1e3;
  --theme-water: #255b9b;
  --theme-water-bright: #4c82be;
  --theme-clay: #b9472e;
  --theme-clay-pale: #f2ddd3;
  --theme-line: #cfbd99;
  --theme-text: #292d27;
  --theme-muted: #716d61;
  --theme-shadow: 0 10px 26px rgba(48, 45, 34, .11);
}

/* Shared stone navigation */
.site-header {
  border-top: 3px solid #5b6055;
  border-bottom: 1px solid #171a16;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035), transparent 28%, rgba(255,255,255,.02)),
    linear-gradient(180deg, #3a3f37, var(--theme-stone));
  color: #fff8e8;
  box-shadow: 0 5px 18px rgba(28, 31, 26, .2);
}
.site-brand { color: #fff8e8; text-shadow: 0 1px 1px #171a16; }
.site-brand span { color: #d0dc75; }
.site-brand small { color: #bbb8aa; }
.site-nav a { color: #ddd8c8; }
.site-nav a:hover,
.site-nav a.is-active {
  border-color: #7d8f46;
  background: #262a25;
  color: #e0e98e;
}
.site-header .user-highlight-control label { color: #c8c3b5; }
.site-header .user-highlight-control input {
  border-color: #777b70;
  background: #fffaf0;
  color: var(--theme-text);
}
.site-header .user-highlight-control button {
  background: var(--theme-clay);
  color: #fff;
}

/* Top page: open grassland and sand */
.home-page {
  background: var(--theme-sand-pale);
  color: var(--theme-text);
}
.home-page .current-section {
  background:
    radial-gradient(circle at 87% 8%, rgba(141, 169, 49, .22), transparent 29rem),
    linear-gradient(135deg, #fffaf0 0, #f3ead6 58%, #e5e8c6 100%);
}
.home-page .title > span { color: var(--theme-clay); }
.home-page .current-section > .title h2,
.home-page .rank-change-heading h2,
.home-page .dark > .title h2 {
  font-size: clamp(17px, 1.8vw, 23px);
  letter-spacing: -.02em;
}
.home-page .availability-panel {
  background: rgba(255, 250, 240, .9);
  border-color: #cdbd9e;
  border-top-color: var(--theme-grass);
  box-shadow: var(--theme-shadow);
}
.home-page .availability-panel.active-panel { border-top-color: #bd8a35; }
.home-page .availability-panel.twitch-panel { border-top-color: var(--theme-water); }
.home-page .availability-panel > header {
  background: linear-gradient(180deg, #fffdf6, #f3e8d2);
  border-color: #d9c9a8;
}
.home-page .availability-panel > header small { color: var(--theme-grass); }
.home-page .availability-panel.active-panel > header small { color: #966522; }
.home-page .availability-panel.twitch-panel > header small { color: var(--theme-water); }
.home-page .availability-panel > header h3 em {
  background: #ead9a6;
  color: #69521a;
}
.home-page .lobby,
.home-page .active-game,
.home-page .live-stream {
  background: var(--theme-paper);
}
.home-page .lobby-member {
  background: #eee5d2;
}
.home-page .status-empty {
  background:
    radial-gradient(circle at 78% 20%, rgba(120, 151, 41, .14), transparent 5rem),
    linear-gradient(145deg, #fffdf7, #eee3cd);
  color: var(--theme-muted);
}
.home-page .status-empty strong { color: #3e4439; }
.home-page .status-empty i {
  border-color: #cfc2a7;
  border-top-color: var(--theme-grass);
}

/* Rank updates use the sandy road palette */
.home-page .rank-changes-section {
  background:
    linear-gradient(112deg, rgba(105, 132, 33, .13), transparent 38%),
    linear-gradient(180deg, #e8d3ae, #f1dfc0);
  border-color: #c8ad7f;
}
.home-page .rank-change-heading small { color: var(--theme-grass); }
.home-page .rank-change-heading > span {
  background: var(--theme-stone);
  color: #f5efdc;
  box-shadow: inset 0 0 0 1px #565b50;
}
.home-page .rank-change-card {
  background: linear-gradient(145deg, #fffdf6, #f7ecd8);
  color: var(--theme-text);
  border-color: #ccb990;
  border-left-color: var(--theme-grass);
  box-shadow: 0 8px 20px rgba(73, 59, 35, .11);
}
.home-page .rank-change-card.is-down { border-left-color: var(--theme-clay); }
.home-page .rank-change-user small { color: #80765f; }
.home-page .rank-change-values b { color: #716b5f; }
.home-page .rank-change-values i { color: #a28e67; }
.home-page .rank-change-values strong,
.home-page .rank-change-card > em { color: #58751e; }
.home-page .rank-change-card.is-down .rank-change-values strong,
.home-page .rank-change-card.is-down > em { color: var(--theme-clay); }
.home-page .rank-change-card:hover {
  border-color: #9b865e;
  box-shadow: 0 12px 25px rgba(73, 59, 35, .16);
}
.home-page .rank-change-empty {
  background: rgba(255, 250, 240, .78);
  border-color: #cbb68e;
}

/* Past games echo the dark stone command panel */
.home-page .dark {
  background:
    radial-gradient(circle at 12% 0, rgba(91, 124, 47, .18), transparent 31rem),
    linear-gradient(180deg, #373c35, #252923);
  color: #f8f0df;
}
.home-page .dark .title > span,
.home-page .dark .win { color: #cfdd76; }
.home-page .dark .lead { color: #bbb6a8; }
.home-page .dark .lead strong {
  color: #dfd29a;
  font-weight: 900;
}
.home-page .games {
  border-color: #5a6055;
  background: rgba(18, 21, 17, .2);
}
.home-page .games .game-row {
  border-color: #494f46;
  background: rgba(255, 250, 233, .018);
}
.home-page .games .game-row:hover { background: rgba(207, 221, 118, .055); }
.home-page .game-date-divider {
  background: linear-gradient(90deg, #444a40, #343931 70%, rgba(52,57,49,.35));
  border-color: #60675a;
  color: #d6e27e;
  box-shadow: inset 3px 0 0 #9fb641;
}
.home-page .player {
  background: #363b34;
  border-top-color: rgba(255,255,255,.05);
}
.home-page .winners .player { background: linear-gradient(135deg, #3d4a31, #343a33 76%); }
.home-page .losers .player { background: linear-gradient(135deg, #493632, #363a34 76%); }
.home-page .games .game-name h3,
.home-page .game-time .game-name h3,
.home-page .player strong { color: #fff7e7; }
.home-page .player small { color: #c6bdac; }
.home-page .game-time .time-line span { color: #bdb7aa; }
.home-page .game-time .team-rank-total { color: #d3df7b; }
.home-page .versus { color: #aca99d; }
.home-page .dark nav a {
  border-color: #6a7065;
  color: #f5eddb;
}
.home-page .dark nav a:hover {
  border-color: #b3c45e;
  background: #454c3d;
  color: #e1eb91;
}

/* Light content pages */
.activity-page,
.winrate-page,
.mod-page {
  --bg: #efe5d0;
  --panel: #fffaf0;
  --panel2: #f6ecd8;
  --line: #cfbd99;
  --text: #292d27;
  --muted: #716d61;
  --lime: #617c24;
  --cyan: #255b9b;
  --orange: #b56d2c;
  --red: #b9472e;
  background:
    radial-gradient(circle at 85% 4%, rgba(128, 158, 40, .2), transparent 29rem),
    linear-gradient(135deg, #fbf4e6, #eadbc0);
  color: var(--theme-text);
}
.activity-page main,
.winrate-page main,
.mod-page main { color: var(--theme-text); }
.activity-page .activity-hero small,
.activity-page .panel-head small,
.winrate-page .wr-hero small,
.mod-page .mod-hero > small,
.mod-page .section-head small { color: var(--theme-grass); }
.activity-page .activity-hero p,
.activity-page .panel-head > span,
.winrate-page .wr-hero p,
.mod-page .mod-hero p,
.mod-page .section-head > span { color: var(--theme-muted); }
.activity-page .panel,
.activity-page .summary-grid article,
.winrate-page .wr-table-panel,
.winrate-page .summary-grid article,
.winrate-page .wr-filter,
.winrate-page .wr-updated,
.mod-page .mod-list {
  background: linear-gradient(145deg, #fffdf6, #f6ecd9);
  border-color: #cfbd99;
  box-shadow: var(--theme-shadow);
}
.activity-page .summary-grid article { border-top-color: var(--theme-grass); }
.activity-page .summary-grid article:nth-child(2) { border-top-color: var(--theme-water); }
.activity-page .summary-grid article:nth-child(4),
.activity-page .summary-grid article:nth-child(5) { border-top-color: #b56d2c; }
.activity-page .period-picker select,
.activity-page .period-picker button,
.winrate-page .wr-filter input,
.winrate-page .wr-filter select,
.winrate-page .player-search input {
  background: #fffaf0;
  border-color: #bda981;
  color: var(--theme-text);
}
.activity-page .period-picker select:focus,
.winrate-page input:focus,
.winrate-page select:focus {
  outline: 0;
  border-color: var(--theme-water);
  box-shadow: 0 0 0 3px rgba(37, 91, 155, .14);
}
.activity-page .heat-map > i {
  background: color-mix(in srgb, #78952e calc(var(--heat) * 88%), #eee3ca);
}
.activity-page .heat-map > i em {
  color: color-mix(in srgb, #fffaf0 calc(var(--heat) * 82%), #3d4436);
}
.activity-page .month-table > div { border-color: #dfd1b5; }
.activity-page .month-table span { background: #e1d4b9; }
.activity-page .month-table i {
  background: linear-gradient(90deg, var(--theme-water-bright), var(--theme-grass-bright));
}

/* Win-rate tables: water blue for data, grass for positive results */
.winrate-page .wr-filter { border-left-color: var(--theme-water); }
.winrate-page .period-buttons button,
.winrate-page .period-buttons a {
  border-color: #c5b38f;
  background: #f1e5cf;
  color: #5f594c;
}
.winrate-page .period-buttons button:hover,
.winrate-page .period-buttons button.active,
.winrate-page .period-buttons a:hover,
.winrate-page .period-buttons a.active {
  border-color: var(--theme-water);
  background: var(--theme-water);
  color: #fff;
}
.winrate-page .apply-button {
  background: var(--theme-grass);
  color: #fff;
}
.winrate-page .table-scroll { border-color: #cbb991; }
.winrate-page thead th {
  background: #dfd0b2;
  color: #504d44;
  border-color: #cbb991;
}
.winrate-page tbody th {
  background: #f5ead6;
  color: var(--theme-text);
}
.winrate-page td { border-color: #dfd1b5; }
.winrate-page tbody tr:nth-child(even) td { background: rgba(224, 211, 183, .18); }
.winrate-page tbody tr:hover,
.winrate-page tbody tr:hover th,
.winrate-page tbody tr:hover td { background: #e6eccd; }
.winrate-page .wins,
.winrate-page .up { color: #58751e; }
.winrate-page .losses,
.winrate-page .down { color: var(--theme-clay); }
.winrate-page .rate { color: var(--theme-water); }
.winrate-page .bar-baseline { background: #ded0b4; }
.winrate-page .mini-chart .wins { background: var(--theme-grass-bright); }
.winrate-page .mini-chart .losses { background: var(--theme-clay); }

/* MOD cards resemble map plaques without becoming a game screenshot */
.mod-page .mod-list { border-top: 4px solid var(--theme-stone); }
.mod-page .mod-card {
  background: linear-gradient(135deg, #fffaf0, #efe1c6);
  border-color: #c9b58d;
  box-shadow: 0 6px 18px rgba(65, 54, 35, .09);
}
.mod-page .mod-mark {
  background: linear-gradient(180deg, #465334, #34402b);
  border-color: #596645;
}
.mod-page .mod-mark span { color: #d6e37f; }
.mod-page .mod-mark strong { color: #929c73; }
.mod-page .mod-tag {
  background: var(--theme-grass-pale);
  color: #4f681c;
}
.mod-page .mod-copy p { color: #5f5b50; }
.mod-page .mod-copy small,
.mod-page code { color: #787164; }
.mod-page .mod-action {
  background: #e8dbc0;
  border-color: #c9b58d;
}
.mod-page .mod-action a {
  background: var(--theme-water);
  color: #fff;
}
.mod-page .mod-action a:hover { background: var(--theme-grass); }
.mod-page .mod-note {
  background: #f2e5ce;
  border-left-color: var(--theme-clay);
}
.mod-page .mod-note p { color: #6c665a; }
.mod-page .font-install-guide {
  border-color: #c9b58d;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, .6), transparent 48%),
    linear-gradient(135deg, #fffdf6, #eee1c8) #fffdf6;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .86), 0 5px 14px rgba(65, 54, 35, .08);
}
.mod-page .font-install-title {
  margin: -4px -4px 14px;
  padding: 10px 12px 11px;
  border-bottom: 1px solid #cbb991;
  background: linear-gradient(90deg, #e4ecd2, rgba(228, 236, 210, .18)) #e4ecd2;
}
.mod-page .font-install-title span {
  display: inline-block;
  padding: 3px 7px;
  border-radius: 2px;
  background: #d6e8e4;
  color: #245b59;
}
.mod-page .font-install-title h3 {
  color: #2b3428;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
}
.mod-page .font-install-guide > p { color: #504b40; }
.mod-page .font-install-guide > code {
  border-left-color: #39766f;
  background: #e2eeea;
  color: #173f3b;
  box-shadow: inset 0 0 0 1px #c2d8d1;
}
.mod-page .font-install-guide h4 { color: #3f5d21; }
.mod-page .font-install-guide ol { color: #4f4a3f; }
.mod-page .font-install-guide li::marker { color: #58751e; }
.mod-page .font-install-guide li code {
  background: #e6dece;
  color: #235a61;
}
.mod-page .font-install-guide .font-install-final {
  border-top-color: #c9b58d;
  background: rgba(244, 237, 219, .78);
  color: #423e35;
}
.mod-page .font-install-guide .font-install-final strong { color: #315f24; }
.mod-page footer { color: #746c5e; }

/* User and ranking pages */
.user-page {
  background:
    radial-gradient(circle at 83% 3%, rgba(128, 158, 40, .2), transparent 30rem),
    linear-gradient(135deg, #fbf4e6, #e9dabf);
  color: var(--theme-text);
}
.user-page .profile-main { color: var(--theme-text); }
.user-page .back-link { color: var(--theme-water); }
.user-page .profile-head small,
.user-page .profile-section .title span { color: var(--theme-grass); }
.user-page .profile-head p,
.user-page .metric-grid small,
.user-page .period-grid span { color: var(--theme-muted); }
.user-page .profile-rank,
.user-page .member-rank {
  background: var(--theme-grass);
  border-color: var(--theme-grass);
  color: #fff;
}
.user-page .metric-grid {
  gap: 8px;
  background: transparent;
}
.user-page .metric-grid > div,
.user-page .period-grid > div,
.user-page .ranking-filter,
.user-page .recent-media-head,
.user-page .rank-history-summary {
  background: linear-gradient(145deg, #fffdf6, #f4e8d1);
  border: 1px solid #cfbd99;
  box-shadow: var(--theme-shadow);
}
.user-page .period-grid > div { border-top: 3px solid var(--theme-grass); }
.user-page .profile-table th,
.user-page .profile-table td { border-color: #d8c7a6; }
.user-page .profile-table th { color: #706a5d; }
.user-page .profile-table a,
.user-page .recent-game a { color: #28598b; }
.user-page .profile-table a:hover,
.user-page .recent-game a:hover { color: var(--theme-grass); }
.user-page .recent-games { border-color: #cdbb96; }
.user-page .recent-game {
  background: rgba(255, 250, 240, .76);
  color: var(--theme-text);
  border-color: #d8c7a6;
}
.user-page .recent-game.is-win {
  background: rgba(151, 178, 62, .16);
  border-left-color: var(--theme-grass);
}
.user-page .recent-game.is-loss {
  background: rgba(185, 71, 46, .1);
  border-left-color: var(--theme-clay);
}
.user-page .recent-game.is-win > b { color: #56751d; }
.user-page .recent-game.is-loss > b { color: var(--theme-clay); }
.user-page .recent-team.allies small { color: #56751d; }
.user-page .recent-team.enemies small { color: var(--theme-clay); }
.user-page .recent-team a { color: #28598b; }
.user-page .ranking-filter select,
.user-page .ranking-filter button,
.user-page .period-select,
.user-page .month-history-form select,
.user-page .month-history-form button {
  border-color: #bca77e;
  background: #fffaf0;
  color: var(--theme-text);
}
.user-page .ranking-filter button,
.user-page .month-history-form button {
  background: var(--theme-water);
  color: #fff;
}
.user-page .rank-history-chart {
  background: linear-gradient(#fffdf7, #eee3cc);
  border-color: #c8b58d;
}
.user-page .rank-grid-line { stroke: #d4c5a7; }
.user-page .rank-grid-date { stroke: #e1d5bc; }
.user-page .rank-axis-label { fill: #6f695e; }
.user-page .rank-axis-title { fill: var(--theme-grass); }
.user-page .rank-history-point {
  fill: var(--theme-water);
  stroke: #fffaf0;
}
.user-page .rank-history-point:hover,
.user-page .rank-history-point:focus {
  fill: var(--theme-clay);
  stroke: #fffaf0;
}
.user-page .rank-history-tooltip {
  border-color: var(--theme-sand);
  background: var(--theme-stone);
  color: #fff8e8;
}
.user-page .rate-track { background: #ddcfb2; }
.user-page .rate-track span { background: var(--theme-grass); }
.user-page .profile-section h3 { color: #5f5b51; }
.user-page .profile-section pre {
  background: var(--theme-stone);
  color: #ded8c8;
}
.user-page footer {
  background: var(--theme-stone);
  color: #c8c1b1;
}

/* Admin pages: pale work surface, clear focused rows */
.admin-page {
  --bg: #efe5d0;
  --panel: #fffaf0;
  --line: #cdbb96;
  --text: #292d27;
  --muted: #716d61;
  --green: #617c24;
  --yellow: #9a6a24;
  --red: #b9472e;
  --purple: #255b9b;
  background:
    radial-gradient(circle at 88% 0, rgba(128, 158, 40, .18), transparent 28rem),
    linear-gradient(135deg, #fbf4e6, #e8d8bb);
  color: var(--theme-text);
}
.admin-page > header {
  background: linear-gradient(180deg, #3b4038, #2c302a);
  border-color: #181b17;
  color: #fff8e8;
  box-shadow: 0 5px 18px rgba(28, 31, 26, .18);
}
.admin-page > header a { color: #d6e27e; }
.admin-page .tools {
  background: rgba(239, 229, 208, .96);
  border-color: #cdbb96;
}
.admin-page .summary div,
.admin-page .notice {
  background: linear-gradient(145deg, #fffdf6, #f3e6ce);
  border-color: var(--theme-grass);
  box-shadow: 0 6px 18px rgba(65, 54, 35, .08);
}
.admin-page .error {
  background: #f8e5dc;
  border-color: var(--theme-clay);
  color: #81311f;
}
.admin-page .search,
.admin-page #search,
.admin-page td input,
.admin-page td select,
.admin-page textarea,
.admin-page select {
  background: #fffaf0;
  border-color: #bda980;
  color: var(--theme-text);
}
.admin-page td[data-field="ID"] input { background: #e9dec7; color: #6f695d; }
.admin-page .table-wrap {
  border-color: #baa67e;
  background: #fffaf0;
  box-shadow: var(--theme-shadow);
}
.admin-page th {
  background: #ded0b2;
  color: #565249;
  border-color: #c4b088;
}
.admin-page td {
  background: #fffaf0;
  border-color: #ded0b2;
}
.admin-page tbody tr:nth-child(even) > td { background: #fbf3e4; }
.admin-page tbody tr:hover > td,
.admin-page tbody tr:focus-within > td {
  background: #e7edcf;
  border-color: #93a953;
}
.admin-page tbody tr:hover input,
.admin-page tbody tr:hover select,
.admin-page tbody tr:focus-within input,
.admin-page tbody tr:focus-within select {
  background: #fffdf7;
  border-color: #839b40;
}
.admin-page button {
  background: var(--theme-water);
  color: #fff;
}
.admin-page .rank-step,
.admin-page .restore {
  background: var(--theme-grass);
  color: #fff;
}
.admin-page .danger,
.admin-page .delete { background: var(--theme-clay); color: #fff; }
.admin-page .deleted-box {
  background: #f4dfd3;
  border-color: #c17a66;
}
.admin-page .deleted-box tbody tr:hover > td,
.admin-page .deleted-box tbody tr:focus-within > td {
  background: #f3d7cb;
  border-color: #bd715e;
}
.admin-page .score,
.admin-page .record-stat.win { color: #58751e; }
.admin-page .record-stat.loss,
.admin-page .none { color: var(--theme-clay); }
.admin-page .candidate { color: #94651f; }
.admin-page .twitch { color: var(--theme-water); }
.admin-page code,
.admin-page .alias-list { color: #666054; }

/* Accessible highlighting retained across every palette */
.is-user-highlight,
a.is-user-highlight {
  color: #fff !important;
  background: #255b9b !important;
  border-color: #163f70 !important;
  border-bottom-color: transparent !important;
  box-shadow: 0 0 0 3px rgba(37, 91, 155, .28), 0 8px 20px rgba(25, 57, 94, .22) !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
}
a.is-user-highlight small,
a.is-user-highlight strong,
a.is-user-highlight b,
a.is-user-highlight i,
a.is-user-highlight em,
a.is-user-highlight span {
  color: #fff !important;
}
.player.user-highlighted {
  outline-color: #70a4dc;
  background: linear-gradient(135deg, #254c72, #343d39);
}
.user-page .profile-head.user-highlighted {
  border-color: #255b9b;
  border-left-color: #255b9b;
  box-shadow: inset 5px 0 0 rgba(76,130,190,.22), 0 0 0 3px rgba(37,91,155,.13), var(--theme-shadow);
}
.winrate-page tr.user-highlighted th,
.winrate-page tr.user-highlighted td,
.user-page tr.user-highlighted th,
.user-page tr.user-highlighted td {
  background-color: #dce8c8;
}

/* Browser-local MyPLAYER marker. Kept separate from the name-search highlight. */
a.is-my-user:not(.rank-change-card):not(.home-my-user),
.is-my-user:not(.rank-change-card):not(.home-my-user) {
  color: #302000 !important;
  background: #f0c85f !important;
  border-color: #a97913 !important;
  border-bottom-color: #a97913 !important;
  box-shadow: 0 0 0 2px rgba(192, 137, 26, .25), 0 5px 13px rgba(112, 76, 11, .18) !important;
  text-decoration: none !important;
  text-shadow: none !important;
}
a.is-my-user:not(.rank-change-card):not(.home-my-user) small,
a.is-my-user:not(.rank-change-card):not(.home-my-user) strong,
a.is-my-user:not(.rank-change-card):not(.home-my-user) b,
a.is-my-user:not(.rank-change-card):not(.home-my-user) i,
a.is-my-user:not(.rank-change-card):not(.home-my-user) em,
a.is-my-user:not(.rank-change-card):not(.home-my-user) span {
  color: inherit !important;
}
.player.my-user-highlighted {
  outline: 2px solid #d29a20;
  outline-offset: -2px;
  background: linear-gradient(135deg, #594819, #343d39);
  box-shadow: inset 0 0 12px rgba(255, 218, 113, .13), 0 0 8px rgba(190, 137, 24, .22);
}
.lobby-member.my-user-highlighted,
.recent-team-member.my-user-highlighted {
  background: #fae9ae;
  box-shadow: inset 0 0 0 2px #d5a12e;
}
.user-page .recent-team-member.my-user-highlighted,
.home-page .recent-team-member.my-user-highlighted {
  color: #30260f;
}
.user-page .recent-team-member.my-user-highlighted .recent-team-member-civ,
.home-page .recent-team-member.my-user-highlighted .recent-team-member-civ {
  color: #51451f;
  border-left-color: rgba(94, 70, 17, .4);
}
.user-page .recent-team-member.my-user-highlighted .member-rank,
.home-page .recent-team-member.my-user-highlighted .member-rank {
  color: #342400;
  background: #fff8dd;
  border-color: #9a7115;
  text-shadow: none;
}
.user-page .recent-team-member.my-user-highlighted .vod-summary-score,
.home-page .recent-team-member.my-user-highlighted .vod-summary-score {
  color: #684900;
}
.rank-change-card.is-my-user,
.rank-change-card.my-user-highlighted {
  color: #302000 !important;
  background: #fff7d9 !important;
  border-color: #ddbd62 !important;
  border-left-color: #c68f18 !important;
  box-shadow: inset 0 0 0 1px rgba(225, 181, 68, .25), 0 3px 10px rgba(112, 76, 11, .13) !important;
}
.profile-head.my-user-highlighted {
  border-color: #c68f18;
  border-left-color: #c68f18;
  box-shadow: inset 5px 0 0 rgba(224, 175, 48, .24), 0 0 0 3px rgba(198, 143, 24, .13), var(--theme-shadow);
}
tr.my-user-highlighted > th,
tr.my-user-highlighted > td {
  background-color: #fae9b7 !important;
}
.user-page .game-media-stats-table tr.my-user-highlighted > th,
.user-page .game-media-stats-table tr.my-user-highlighted > td {
  color: #30260f !important;
}
.user-page .game-media-stats-table tr.my-user-highlighted > th > small {
  color: #6b500e !important;
}
.user-page .game-media-stats-table tr.my-user-highlighted > th > a {
  color: #302000 !important;
  text-shadow: none !important;
}
.user-page .game-media-stats-table tr.my-user-highlighted > td.is-derived,
.user-page .game-media-stats-table tr.my-user-highlighted > td.is-derived > small {
  color: #49360a !important;
}
.home-page .game-media-stats-table tr.user-highlighted > th,
.home-page .game-media-stats-table tr.user-highlighted > td {
  color: #172a35 !important;
  background-color: #dce9f8 !important;
  text-shadow: none !important;
}
.home-page .game-media-stats-table tr.user-highlighted > th > small {
  color: #275a80 !important;
}
.home-page .game-media-stats-table tr.my-user-highlighted > th,
.home-page .game-media-stats-table tr.my-user-highlighted > td {
  color: #30260f !important;
  background-color: #fae9b7 !important;
  text-shadow: none !important;
}
.home-page .game-media-stats-table tr.my-user-highlighted > th > small {
  color: #6b500e !important;
}
.home-page .game-media-stats-table tr.my-user-highlighted > td.is-derived,
.home-page .game-media-stats-table tr.my-user-highlighted > td.is-derived > small {
  color: #49360a !important;
}

/* If both markers target the same user, retain both blue and gold identities. */
a.is-user-highlight.is-my-user:not(.rank-change-card):not(.home-my-user) {
  color: #fff !important;
  background: linear-gradient(135deg, #255b9b 0 48%, #c99424 52% 100%) !important;
  border-color: #173f6f !important;
  box-shadow: 0 0 0 2px rgba(37, 91, 155, .32), 0 0 0 5px rgba(201, 148, 36, .28) !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .35) !important;
}
.player.user-highlighted.my-user-highlighted {
  outline-color: #d6a12b;
  background: linear-gradient(135deg, #254c72 0 49%, #5c4a1c 51% 100%);
  box-shadow: inset 4px 0 0 #70a4dc, inset -4px 0 0 #d6a12b, 0 0 8px rgba(37, 91, 155, .22);
}
.lobby-member.user-highlighted.my-user-highlighted,
.recent-team-member.user-highlighted.my-user-highlighted {
  background: linear-gradient(90deg, #dce9f8 0 49%, #fae9ae 51% 100%);
  box-shadow: inset 3px 0 0 #4d86c4, inset -3px 0 0 #d5a12e;
}
tr.user-highlighted.my-user-highlighted > th,
tr.user-highlighted.my-user-highlighted > td {
  background: linear-gradient(90deg, #dce9f8 0 49%, #fae9b7 51% 100%) !important;
}
.user-page .game-media-stats-table tr.user-highlighted.my-user-highlighted > th,
.user-page .game-media-stats-table tr.user-highlighted.my-user-highlighted > td,
.home-page .game-media-stats-table tr.user-highlighted.my-user-highlighted > th,
.home-page .game-media-stats-table tr.user-highlighted.my-user-highlighted > td {
  color: #241d0c !important;
}
.profile-head.user-highlighted.my-user-highlighted {
  border-left-color: #c68f18;
  box-shadow: inset 4px 0 0 #4d86c4, inset 8px 0 0 #d5a12e, 0 0 0 3px rgba(37,91,155,.13), var(--theme-shadow);
}

/* TOPの過去ゲームでは、MY PLAYERだけを明るい紙色で抜き、暗い一覧の中でも読みやすくする。 */
.home-page #past-games .player.my-user-highlighted {
  color: #29251c;
  outline: 3px solid #d3a22f;
  outline-offset: -3px;
  background-color: #fffaf0;
  background-image: linear-gradient(135deg, #fff 0%, #fffaf0 64%, #f5e7bd 100%);
  box-shadow:
    inset 5px 0 0 #e2b237,
    inset 0 0 0 1px rgba(255, 255, 255, .9),
    0 0 0 1px rgba(103, 76, 17, .72),
    0 0 10px rgba(211, 162, 47, .3);
}
.home-page #past-games .player.my-user-highlighted .user-link.is-my-user {
  color: #2c2516 !important;
  background: transparent !important;
  border-color: transparent !important;
  border-bottom: 2px solid #c6921f !important;
  box-shadow: none !important;
  font-weight: 900;
  text-shadow: none !important;
}
.home-page #past-games .player.my-user-highlighted > strong {
  color: #29251c;
  text-shadow: none;
}
.home-page #past-games .player.my-user-highlighted .member-rank {
  color: #352a0d !important;
  background: #f3d879 !important;
  border-color: #9c7518 !important;
  text-shadow: none !important;
}
.home-page #past-games .player.my-user-highlighted > small {
  color: #514a3d !important;
  text-shadow: none !important;
}
.home-page #past-games .player.my-user-highlighted .vod-summary-score {
  color: #725000 !important;
  text-shadow: none !important;
}
.home-page #past-games .player.my-user-highlighted .player-no {
  -webkit-text-stroke: 0;
  text-shadow: none;
}
.home-page #past-games .player.player-number-1.my-user-highlighted .player-no { color: #1f5a9b; }
.home-page #past-games .player.player-number-2.my-user-highlighted .player-no { color: #a52222; }
.home-page #past-games .player.player-number-3.my-user-highlighted .player-no { color: #705900; }
.home-page #past-games .player.player-number-4.my-user-highlighted .player-no { color: #68401d; }
.home-page #past-games .player.player-number-5.my-user-highlighted .player-no { color: #994400; }
.home-page #past-games .player.player-number-6.my-user-highlighted .player-no { color: #12652f; }
.home-page #past-games .player.player-number-7.my-user-highlighted .player-no { color: #652a98; }
.home-page #past-games .player.player-number-8.my-user-highlighted .player-no { color: #006271; }
.home-page #past-games .player.my-user-highlighted .user-link.is-my-user::before {
  content: none;
}
.home-page #past-games .player.user-highlighted.my-user-highlighted {
  color: #252b31;
  background-color: #f7fbff;
  background-image: linear-gradient(135deg, #eef7ff 0 44%, #fffdf7 58% 100%);
  box-shadow:
    inset 5px 0 0 #4f86c1,
    inset -5px 0 0 #e2b237,
    inset 0 0 0 1px rgba(255, 255, 255, .9),
    0 0 0 1px rgba(62, 91, 117, .72),
    0 0 11px rgba(79, 134, 193, .28);
}
.home-page #past-games .player.user-highlighted.my-user-highlighted .user-link.is-user-highlight.is-my-user {
  color: #fff !important;
  background: #315f91 !important;
  border-color: #264c75 !important;
  border-bottom-color: #d8aa35 !important;
  box-shadow: inset -3px 0 0 #d8aa35 !important;
  text-shadow: 0 1px 1px rgba(0, 0, 0, .35) !important;
}

@media (max-width: 680px) {
  .home-page .current-section > .title h2,
  .home-page .rank-change-heading h2,
  .home-page .dark > .title h2 {
    font-size: 20px;
  }
  .home-page .rank-change-heading { align-items: flex-start; }
  .site-header { border-top-width: 2px; }
}

/*
 * Restrained civilization details.
 * Bronze edges, stone grain and faint landscape fragments echo the game art
 * without turning utility screens into illustrated posters.
 */
:root {
  --theme-bronze: #b78a3e;
  --theme-bronze-light: #dfbd70;
  --theme-banner: #963f2b;
  --theme-panel-glow: inset 0 1px 0 rgba(255, 255, 255, .7);
}

.site-header {
  border-bottom-color: #9a7737;
  background:
    repeating-linear-gradient(112deg, rgba(255,255,255,.018) 0 1px, transparent 1px 9px),
    linear-gradient(90deg, rgba(183,138,62,.09), transparent 28%, rgba(109,124,48,.07)),
    linear-gradient(180deg, #3b4038, #2d312b);
  box-shadow:
    inset 0 -1px 0 rgba(226, 190, 107, .42),
    0 6px 18px rgba(28, 31, 26, .2);
}
.site-brand::before {
  content: "";
  width: 4px;
  height: 23px;
  flex: 0 0 auto;
  background: linear-gradient(180deg, var(--theme-bronze-light), var(--theme-banner));
  box-shadow: 1px 0 0 rgba(255,255,255,.11);
}
.site-nav a {
  transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.site-nav a:hover,
.site-nav a.is-active {
  box-shadow: inset 0 -2px 0 var(--theme-bronze);
}

.activity-page,
.winrate-page,
.mod-page,
.user-page,
.admin-page {
  background-color: #eee2ca;
  background-image:
    radial-gradient(circle at 86% 4%, rgba(111, 143, 38, .2), transparent 29rem),
    radial-gradient(circle at 8% 72%, rgba(37, 91, 155, .075), transparent 24rem),
    repeating-linear-gradient(135deg, rgba(77, 66, 44, .018) 0 1px, transparent 1px 12px),
    linear-gradient(135deg, #fbf5e9, #e8d8bb);
  background-attachment: fixed;
}

.activity-page .activity-hero,
.winrate-page .wr-hero,
.mod-page .mod-hero,
.user-page .profile-head {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(28px, 3.4vw, 48px);
  border: 1px solid rgba(174, 144, 87, .58);
  border-left: 4px solid var(--theme-bronze);
  background:
    linear-gradient(105deg, rgba(255,253,246,.97) 0 47%, rgba(244,233,210,.9) 72%, rgba(226,216,184,.78));
  box-shadow: var(--theme-panel-glow), 0 11px 28px rgba(72, 58, 35, .1);
}
.activity-page .activity-hero::after,
.winrate-page .wr-hero::after,
.mod-page .mod-hero::after,
.user-page .profile-head::after {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0 0 0 auto;
  width: min(57%, 760px);
  pointer-events: none;
  background: url("images/home-hero-civilizations-v1.webp") 76% center / cover no-repeat;
  opacity: .15;
  filter: saturate(.78) sepia(.12);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 38%);
  mask-image: linear-gradient(90deg, transparent, #000 38%);
}
.activity-page .activity-hero > *,
.winrate-page .wr-hero > *,
.mod-page .mod-hero > *,
.user-page .profile-head > * {
  position: relative;
  z-index: 1;
}
.activity-page .activity-hero h1,
.winrate-page .wr-hero h1,
.mod-page .mod-hero h1,
.user-page .profile-head h1 {
  color: #2d302a;
  text-shadow: 0 1px 0 #fff9e9;
}
.activity-page .activity-hero small,
.winrate-page .wr-hero small,
.mod-page .mod-hero > small,
.user-page .profile-head small {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}
.activity-page .activity-hero small::before,
.winrate-page .wr-hero small::before,
.mod-page .mod-hero > small::before,
.user-page .profile-head small::before {
  content: "";
  width: 28px;
  height: 2px;
  background: linear-gradient(90deg, var(--theme-banner), var(--theme-bronze-light));
}

.activity-page .panel,
.activity-page .summary-grid article,
.winrate-page .wr-table-panel,
.winrate-page .summary-grid article,
.winrate-page .wr-filter,
.winrate-page .wr-updated,
.mod-page .mod-list,
.mod-page .mod-card,
.user-page .metric-grid > div,
.user-page .period-grid > div,
.user-page .rank-overview-panel,
.user-page .ranking-filter,
.user-page .recent-media-head,
.user-page .rank-history-summary,
.admin-page .table-wrap,
.admin-page .summary div,
.admin-page .notice {
  box-shadow: var(--theme-panel-glow), 0 9px 24px rgba(72, 58, 35, .1);
}
.activity-page .panel,
.winrate-page .wr-table-panel,
.mod-page .mod-list,
.user-page .rank-overview-panel,
.admin-page main > section:not(.deleted-box) {
  border-top-color: var(--theme-bronze);
}

.activity-page .panel-head h2,
.winrate-page .table-tools h2,
.mod-page .section-head h2,
.home-page .current-section > .title h2,
.home-page .rank-change-heading h2,
.home-page .dark > .title h2,
.user-page .profile-section .title h2,
.user-page .rank-overview-panel > .title h2 {
  position: relative;
  padding-left: 12px;
}
.activity-page .panel-head h2::before,
.winrate-page .table-tools h2::before,
.mod-page .section-head h2::before,
.home-page .current-section > .title h2::before,
.home-page .rank-change-heading h2::before,
.home-page .dark > .title h2::before,
.user-page .profile-section .title h2::before,
.user-page .rank-overview-panel > .title h2::before {
  content: "";
  position: absolute;
  inset: .14em auto .1em 0;
  width: 3px;
  background: linear-gradient(180deg, var(--theme-bronze-light), var(--theme-banner));
}

.home-page .current-section {
  background:
    radial-gradient(circle at 87% 8%, rgba(141, 169, 49, .22), transparent 29rem),
    repeating-linear-gradient(135deg, rgba(105, 89, 52, .018) 0 1px, transparent 1px 13px),
    linear-gradient(135deg, #fffaf0 0, #f3ead6 58%, #e5e8c6 100%);
}
.home-page .availability-panel,
.home-page .rank-change-card {
  box-shadow: var(--theme-panel-glow), 0 10px 24px rgba(73, 59, 35, .12);
}
.home-page .availability-panel > header {
  background:
    repeating-linear-gradient(115deg, rgba(114,91,50,.022) 0 1px, transparent 1px 9px),
    linear-gradient(180deg, #fffdf6, #f3e8d2);
}
.home-page .availability-panel:hover,
.home-page .rank-change-card:hover {
  border-color: #aa9162;
  box-shadow: var(--theme-panel-glow), 0 13px 28px rgba(73, 59, 35, .16);
}
.home-page .rank-changes-section {
  background:
    radial-gradient(circle at 8% 0, rgba(99,126,36,.14), transparent 19rem),
    repeating-linear-gradient(135deg, rgba(100,80,43,.02) 0 1px, transparent 1px 12px),
    linear-gradient(180deg, #e8d3ae, #f1dfc0);
}
.home-page .dark {
  border-top: 4px solid var(--theme-bronze);
  background:
    radial-gradient(circle at 12% 0, rgba(91,124,47,.18), transparent 31rem),
    repeating-linear-gradient(120deg, rgba(255,255,255,.012) 0 1px, transparent 1px 11px),
    linear-gradient(180deg, #373c35, #252923);
  box-shadow: inset 0 1px 0 rgba(231,195,112,.25);
}
.home-page .game-date-divider {
  border-left: 3px solid var(--theme-bronze);
}

.activity-page .summary-grid article,
.winrate-page .summary-grid article,
.user-page .period-grid > div {
  border-top-width: 3px;
}
.activity-page .summary-grid strong,
.winrate-page .summary-grid strong,
.user-page .metric-grid strong,
.user-page .period-grid strong {
  color: #30342e;
}
.activity-page .period-picker button,
.winrate-page .apply-button,
.mod-page .mod-action a,
.user-page .ranking-filter button,
.user-page .month-history-form button,
.admin-page button,
.site-header .user-highlight-control button {
  border: 1px solid rgba(55, 48, 35, .28);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 2px 5px rgba(54, 43, 25, .14);
}

.winrate-page thead th,
.user-page .profile-table th,
.admin-page th {
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.2), transparent),
    repeating-linear-gradient(120deg, rgba(95,75,40,.025) 0 1px, transparent 1px 9px);
}
.admin-page main > section:not(.deleted-box) {
  border-color: #c6b084;
  box-shadow: var(--theme-panel-glow), 0 8px 20px rgba(72, 58, 35, .08);
}
.admin-page tbody tr:hover > td,
.admin-page tbody tr:focus-within > td {
  box-shadow: inset 0 1px 0 rgba(183,138,62,.18), inset 0 -1px 0 rgba(183,138,62,.18);
}

@media (max-width: 700px) {
  .site-brand::before { height: 18px; }
  .activity-page .activity-hero,
  .winrate-page .wr-hero,
  .mod-page .mod-hero,
  .user-page .profile-head {
    padding: 25px 20px;
  }
  .activity-page .activity-hero::after,
  .winrate-page .wr-hero::after,
  .mod-page .mod-hero::after,
  .user-page .profile-head::after {
    width: 78%;
    opacity: .09;
  }
}

/* Compact rank changes: direction stays clear without oversized cards. */
.home-page .rank-change-card {
  background: rgba(255, 253, 246, .92);
  border-color: #cbb991;
  border-left-color: var(--theme-grass);
  box-shadow: 0 2px 8px rgba(73, 59, 35, .09);
}
.home-page .rank-change-card.is-down { border-left-color: var(--theme-clay); }
.home-page .rank-change-card.is-even { border-left-color: #7e8781; }
.home-page .rank-change-card:hover {
  border-color: #a99165;
  box-shadow: 0 4px 12px rgba(73, 59, 35, .14);
}
.home-page .rank-change-user time { color: #82775f; }
.home-page .rank-change-values b { color: #746e62; }
.home-page .rank-change-values i { color: #a18e69; }
.home-page .rank-change-values strong { color: #526f20; }
.home-page .rank-change-card > em {
  color: #526f20;
  background: #e5edcf;
}
.home-page .rank-change-card.is-down .rank-change-values strong { color: #a94a38; }
.home-page .rank-change-card.is-down > em {
  color: #9d3f30;
  background: #f3ddd3;
}