#wb-mobile { display: none; }
@media (max-width: 760px) {
  html, body { width:100%; max-width:100%; margin:0; height:auto; min-height:100%; overflow-x:clip; overflow-y:auto; }
  body > .viewport, body > #modalBackdrop, body > #settingsBackdrop { display:none !important; }
  #wb-mobile { --gold:#d6b773; --muted:#98a5b6; display:flex; flex-direction:column; width:100%; max-width:100%; min-height:100dvh; color:#eef0f3; background:radial-gradient(ellipse at 90% 0%,#263243 0%,#101720 45%,#0c1119 100%); font:15px/1.5 system-ui,sans-serif; position:relative; isolation:isolate; padding-bottom:calc(84px + env(safe-area-inset-bottom)); }
  #wb-mobile *, #wb-mobile *::before, #wb-mobile *::after { box-sizing:border-box; min-width:0; max-width:100%; }
  #wb-mobile [hidden] { display:none !important; }
  #wb-mobile button, #wb-mobile input, #wb-mobile select, #wb-mobile textarea { font:inherit; border-radius:10px; }
  #wb-mobile button { min-height:44px; cursor:pointer; border:1px solid #394352; background:#202b3a; color:#eee; padding:10px 12px; white-space:normal; text-align:left; touch-action:manipulation; }
  #wb-mobile button:focus-visible, #wb-mobile input:focus-visible, #wb-mobile summary:focus-visible { outline:2px solid var(--gold); outline-offset:2px; }
  #wb-mobile button:disabled { opacity:.55; cursor:default; }
  #wb-mobile button[aria-current=page], #wb-mobile .wb-primary { color:#f6e7ba; border-color:#927c50; background:linear-gradient(135deg,#4b402d,#2f2c27); }
  #wb-mobile h1 { font-size:23px; margin:0; letter-spacing:.03em; }
  #wb-mobile h2 { font-size:17px; margin:0 0 10px; }
  #wb-mobile h3 { font-size:15px; margin:0 0 6px; }
  #wb-mobile p { margin:6px 0 12px; }
  #wb-mobile small, #wb-mobile .wb-muted { color:var(--muted); }
  #wb-mobile strong, #wb-mobile p, #wb-mobile span, #wb-mobile dd { overflow-wrap:anywhere; }
  #wb-mobile .wb-top { display:flex; align-items:center; gap:10px; padding:calc(10px + env(safe-area-inset-top)) 14px 10px; border-bottom:1px solid #39404a; background:#121b27; }
  #wb-mobile .wb-brand { flex:1; color:var(--gold); font-size:19px; letter-spacing:.12em; font-weight:800; }
  #wb-mobile .wb-icon { width:44px; padding:8px; text-align:center; flex:none; position:relative; }
  #wb-mobile .wb-badge { position:absolute; top:0; right:0; background:#a74035; color:white; border-radius:10px; font-size:10px; padding:0 4px; }
  #wb-mobile .wb-content { width:100%; max-width:100%; padding:16px 14px; }
  #wb-mobile .wb-page-head { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
  #wb-mobile .wb-page-head h1 { flex:1; }
  #wb-mobile .wb-clock { border-bottom:1px solid #3b414a; padding:0 0 12px; margin-bottom:16px; display:flex; justify-content:space-between; align-items:center; gap:12px; }
  #wb-mobile .wb-clock strong { color:var(--gold); font-size:24px; font-variant-numeric:tabular-nums; }
  #wb-mobile .wb-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; margin-bottom:20px; }
  #wb-mobile .wb-tile { min-height:116px; display:flex; flex-direction:column; align-items:flex-start; gap:5px; background:linear-gradient(145deg,#2b3541,#18212d); border-top:2px solid #a98b52; }
  #wb-mobile .wb-tile i { font-size:25px; font-style:normal; }
  #wb-mobile .wb-tile strong { font-size:16px; }
  #wb-mobile .wb-shortcut { display:flex; align-items:center; gap:8px; font-size:13px; }
  #wb-mobile .wb-card { display:block; width:100%; margin-bottom:10px; padding:14px; background:#192330; border:1px solid #35404e; border-radius:12px; box-shadow:0 3px 12px #0002; }
  #wb-mobile button.wb-card { text-align:left; }
  #wb-mobile .wb-card strong, #wb-mobile .wb-card small { display:block; }
  #wb-mobile .wb-card .wb-countdown { color:var(--gold); font-size:29px; letter-spacing:.04em; margin:8px 0; font-variant-numeric:tabular-nums; }
  #wb-mobile .wb-actions, #wb-mobile .wb-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:12px 0; }
  #wb-mobile .wb-tabs button { flex:1; text-align:center; }
  #wb-mobile label { display:block; margin:0 0 14px; color:#c2cad4; }
  #wb-mobile input:not([type=checkbox]), #wb-mobile select, #wb-mobile textarea { display:block; width:100%; max-width:100%; min-height:46px; border:1px solid #465368; background:#0f1825; color:#fff; padding:10px; margin-top:5px; }
  #wb-mobile textarea { min-height:110px; resize:vertical; }
  #wb-mobile input[type=checkbox] { width:22px; height:22px; margin:0 10px 0 0; accent-color:var(--gold); }
  #wb-mobile .wb-check { min-height:44px; display:flex; align-items:center; }
  #wb-mobile dl { margin:0; }
  #wb-mobile dt { color:var(--muted); font-size:12px; margin-top:12px; }
  #wb-mobile dd { margin:0; }
  #wb-mobile details { margin-bottom:12px; border:1px solid #35404e; border-radius:12px; background:#192330; padding:0 14px; }
  #wb-mobile summary { min-height:50px; padding:13px 0; cursor:pointer; color:var(--gold); font-weight:700; }
  #wb-mobile details > div { padding:6px 0 14px; }
  #wb-mobile progress { display:block; width:100%; accent-color:var(--gold); margin:8px 0 16px; }
  #wb-mobile .wb-status { white-space:pre-wrap; color:#e1c28a; margin-bottom:12px; }
  #wb-mobile .wb-status:empty { display:none; }
  #wb-mobile .wb-bottom { position:fixed; bottom:0; left:0; right:0; z-index:50; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:2px; padding:8px 6px calc(8px + env(safe-area-inset-bottom)); background:#111b28f5; border-top:1px solid #566071; backdrop-filter:blur(14px); }
  #wb-mobile .wb-bottom button { display:flex; flex-direction:column; align-items:center; gap:3px; border:0; background:none; text-align:center; font-size:11px; padding:5px 2px; min-height:54px; color:#a6b3c5; }
  #wb-mobile .wb-bottom button span { font-size:21px; line-height:24px; }
  #wb-mobile .wb-bottom button[aria-current=page] { color:var(--gold); background:#bba26912; }
}

/* Desktop Warboard visual language, applied to the existing mobile views only. */
@media (max-width: 760px) {
  #wb-mobile {
    --gold:#f2b447; --gold-light:#ffd587; --muted:#afbfcc;
    --steel:#344d60; --panel:#0a1721; --ink:#f0f4f7;
    color:var(--ink);
    background:linear-gradient(180deg,rgba(3,12,19,.92),rgba(3,10,16,.98) 700px),url('assets/citycap-bg.jpg') 83% 0/auto 780px no-repeat,#030a10;
  }
  #wb-mobile button, #wb-mobile input, #wb-mobile select, #wb-mobile textarea { border-radius:4px; }
  #wb-mobile button {
    color:#edf3f6; border-color:#495447;
    background:linear-gradient(180deg,#1d2e3a,#0b1924);
    box-shadow:inset 0 1px 0 #ffffff0b,inset 0 -2px 6px #0004,0 3px 8px #0003;
    transition:background-color .12s,border-color .12s,box-shadow .12s;
  }
  #wb-mobile button:active {
    border-color:var(--gold); background-color:#684716;
    box-shadow:inset 0 2px 10px #0009,0 0 12px #f2b44735;
    filter:brightness(1.18);
  }
  #wb-mobile button:focus-visible, #wb-mobile input:focus-visible,
  #wb-mobile select:focus-visible, #wb-mobile textarea:focus-visible,
  #wb-mobile summary:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
  #wb-mobile .wb-primary, #wb-mobile button[aria-current=page], #wb-mobile button[aria-pressed=true] {
    color:var(--gold-light); border-color:#b08033;
    background:linear-gradient(135deg,#725025,#382a17 70%,#241f16);
    box-shadow:inset 0 1px 0 #ffdb8930,0 0 14px #d3972615,inset 3px 0 0 var(--gold);
  }
  #wb-mobile h1, #wb-mobile h2, #wb-mobile h3 { font-weight:800; color:#f5f6f7; }
  #wb-mobile h1 { font-size:22px; letter-spacing:.025em; }
  #wb-mobile h2 { font-size:16px; letter-spacing:.04em; }
  #wb-mobile [data-wb-view=home] > h2 { text-transform:uppercase; padding:0 0 9px; border-bottom:1px solid #95703750; }
  #wb-mobile .wb-top {
    border-bottom:1px solid #b08039;
    background:linear-gradient(90deg,#020b13e8,#071521aa,#020911e8),url('assets/warboard-banner.png') 45% center/auto 82px no-repeat;
    box-shadow:0 4px 16px #0008,inset 0 -1px 0 #f6b83f20;
  }
  #wb-mobile .wb-brand { font-size:18px; letter-spacing:.15em; color:var(--gold); text-shadow:0 1px 0 #000,0 0 14px #db9e3840; }
  #wb-mobile .wb-icon { border-color:#5c563d; border-radius:4px; background:linear-gradient(180deg,#243340b8,#07121ce8); color:var(--gold-light); }
  #wb-mobile .wb-badge { border:1px solid #f28160; border-radius:3px; background:#74251c; }
  #wb-mobile .wb-page-head { padding-bottom:12px; border-bottom:1px solid #ad803750; }
  #wb-mobile .wb-page-head button { border-color:#6d5b38; color:var(--gold-light); }
  #wb-mobile .wb-clock {
    padding:14px; margin-bottom:16px; border:1px solid #80612f;
    display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:6px;
    border-radius:4px; position:relative;
    background:linear-gradient(90deg,#06131b,#101a24);
    box-shadow:inset 0 1px 0 #ffcf691b,inset 3px 0 0 var(--gold),0 6px 18px #0004;
  }
  #wb-mobile .wb-clock::before { content:''; position:absolute; inset:0 0 0 auto; width:115px; border-radius:inherit; pointer-events:none; background:linear-gradient(90deg,#08141ef5,#08141e99),url('assets/game-clock-bg.jpg') right bottom/auto 180px no-repeat; }
  #wb-mobile .wb-clock > * { position:relative; }
  #wb-mobile .wb-clock small { color:#e9c885; font-size:11px; font-weight:700; letter-spacing:.05em; }
  #wb-mobile .wb-clock strong { display:block; white-space:nowrap; color:#fff0cd; font-size:29px; line-height:1.35; text-shadow:0 2px 4px #000; }
  #wb-mobile .wb-clock-date { text-align:center; }
  #wb-mobile .wb-clock-local { text-align:right; }
  #wb-mobile .wb-clock small { white-space:nowrap; }
  #wb-mobile [data-wb-game-date] { display:block; white-space:nowrap; color:#d5e0e9; font-size:13px; font-weight:700; line-height:1.35; }
  #wb-mobile .wb-tile {
    --tile-ink:#abd9fa; --tile-line:#557c96;
    min-height:126px; gap:4px; padding:12px;
    border:1px solid var(--tile-line); border-top:1px solid var(--tile-line); border-radius:4px;
    box-shadow:inset 0 1px 0 #ffffff20,inset 0 -18px 30px #0004,0 5px 12px #0005;
    position:relative; overflow:hidden;
  }
  #wb-mobile .wb-tile::after { content:'›'; position:absolute; right:10px; top:10px; color:var(--tile-ink); font-size:24px; line-height:1; opacity:.8; pointer-events:none; }
  #wb-mobile .wb-tile[data-wb-route=city] {
    --tile-ink:#a7dcff; --tile-line:#397dad;
    background:linear-gradient(135deg,#15548ac7,#082f50cc 45%,#02121bf5),url('assets/citycap-bg.jpg') right center/auto 160px no-repeat;
  }
  #wb-mobile .wb-tile[data-wb-route=duel] {
    --tile-ink:#ffce70; --tile-line:#a47b38;
    background:linear-gradient(135deg,#765023b8,#4d321bbb 45%,#20170cf5),url('assets/citycap-bg.jpg') right center/auto 160px no-repeat;
  }
  #wb-mobile .wb-tile[data-wb-route=doomed] {
    --tile-ink:#d1b6fa; --tile-line:#775181;
    background:linear-gradient(135deg,#432958de,#342038d6 45%,#160e23f5),url('assets/citycap-bg.jpg') right center/auto 160px no-repeat;
  }
  #wb-mobile .wb-tile[data-wb-route=calendar] {
    --tile-ink:#c2dfef; --tile-line:#527c92;
    background:linear-gradient(135deg,#34556ecf,#1b3448d4 45%,#0a1924f5),url('assets/warboard-banner.png') 48% center/auto 160px no-repeat;
  }
  #wb-mobile .wb-tile strong { font-size:15px; text-shadow:0 1px 3px #000; }
  #wb-mobile .wb-tile small { color:#d2dce6; font-size:12px; line-height:1.4; }
  #wb-mobile .wb-tile i { display:block; font-size:0; height:35px; width:35px; margin:0 0 5px; filter:drop-shadow(0 2px 4px #0006); }
  #wb-mobile .wb-tile i::before { content:''; display:block; width:35px; height:35px; background:var(--tile-ink); mask:var(--tile-icon) center/contain no-repeat; }
  #wb-mobile .wb-tile[data-wb-route=city] { --tile-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M3 11h5v5h4V5h3v4h3V5h3v11h4v-5h5v19H3zM12 30h8v-9a4 4 0 0 0-8 0z' fill='black' fill-rule='evenodd'/%3E%3C/svg%3E"); }
  #wb-mobile .wb-tile[data-wb-route=duel] { --tile-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M9 3h14v5h6v5c0 5-3 8-8 8l-3 2v4h5v3H9v-3h5v-4l-3-2c-5 0-8-3-8-8V8h6zm0 8H6v2c0 3 1 4 4 5zm14 0-1 7c3-1 4-2 4-5v-2z' fill='black' fill-rule='evenodd'/%3E%3C/svg%3E"); }
  #wb-mobile .wb-tile[data-wb-route=doomed] { --tile-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='m16 3 14 25H2zm0 9L9 25h14zM5 29h22v2H5z' fill='black' fill-rule='evenodd'/%3E%3Cpath d='M17 4V1h9v7l-9-3' fill='black'/%3E%3C/svg%3E"); }
  #wb-mobile .wb-tile[data-wb-route=calendar] { --tile-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5 5h4V2h3v3h8V2h3v3h4v25H5zm3 9v13h16V14zm2 3h4v3h-4zm8 0h4v3h-4zm-8 6h4v3h-4zm8 0h4v3h-4z' fill='black' fill-rule='evenodd'/%3E%3C/svg%3E"); }
  #wb-mobile .wb-shortcut { padding:8px 10px; gap:9px; border-radius:4px; background:linear-gradient(140deg,#162737,#09151f); border-color:#3e566a; box-shadow:inset 0 1px 0 #ffffff0c,0 3px 10px #0004; }
  #wb-mobile .wb-shortcut-icon { color:var(--gold); font-size:22px; width:23px; text-align:center; flex:none; }
  #wb-mobile .wb-shortcut[data-wb-route=par] { border-color:#765594; background:linear-gradient(140deg,#282044,#100f21); }
  #wb-mobile .wb-shortcut[data-wb-route=announcements] { border-color:#656296; background:linear-gradient(140deg,#242343,#101524); }
  #wb-mobile .wb-shortcut[data-wb-route=diplomacy] { border-color:#8b633c; background:linear-gradient(140deg,#3c2b1f,#161614); }
  #wb-mobile .wb-card {
    border-radius:4px; border-color:#304758;
    background:linear-gradient(135deg,#10232fcf,#08131df5);
    box-shadow:inset 0 1px 0 #ffffff09,inset 0 0 24px #0003,0 5px 14px #0004;
  }
  #wb-mobile .wb-card h2 { color:#f1d298; border-bottom:1px solid #7c60322e; padding-bottom:8px; }
  #wb-mobile .wb-card .wb-countdown { color:#ffcd6d; font-size:32px; text-shadow:0 0 18px #e6a23230,0 2px 2px #000; }
  #wb-mobile .wb-event-card { --event-color:#96c7e8; display:grid; grid-template-columns:43px minmax(0,1fr); gap:11px; align-items:center; padding:12px; border-left:3px solid var(--event-color); background:linear-gradient(100deg,#102332,#08121b); }
  #wb-mobile .wb-event-date { display:flex; flex-direction:column; align-items:center; padding:5px 2px; border-radius:3px; border:1px solid #67728250; background:linear-gradient(#394250,#18232f); box-shadow:inset 0 1px 0 #fff1,0 3px 6px #0005; }
  #wb-mobile .wb-event-date small { color:#e3e7ec; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
  #wb-mobile .wb-event-date strong { color:#fff; font-size:24px; line-height:1.2; }
  #wb-mobile .wb-event-heading { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; margin-bottom:4px; }
  #wb-mobile .wb-event-heading strong { flex:1 1 135px; font-size:14px; line-height:1.35; }
  #wb-mobile .wb-event-copy > small { font-size:11px; color:#b9c8d5; line-height:1.55; }
  #wb-mobile .wb-event-copy > small:first-of-type { color:#dce4e9; }
  #wb-mobile .wb-event-type { color:var(--event-color); background:#263243; border:1px solid var(--event-color); border-radius:3px; padding:2px 5px; font-size:10px; font-weight:700; line-height:1.4; }
  #wb-mobile .wb-event-card[data-event-type=tm_start] { --event-color:#c4b7ff; background:linear-gradient(100deg,#201c38,#0b1520); }
  #wb-mobile .wb-event-card[data-event-type=tm_start] .wb-event-type { background:#302649; }
  #wb-mobile .wb-event-card[data-event-type=city_cap] { --event-color:#edaf73; }
  #wb-mobile .wb-event-card[data-event-type=city_cap] .wb-event-type { background:#41291a; }
  #wb-mobile .wb-event-card[data-event-type=alliance_duel], #wb-mobile .wb-event-card[data-event-type=aow] { --event-color:#f5c56d; }
  #wb-mobile .wb-event-card[data-event-type=war_alert] { --event-color:#ffa18d; background:linear-gradient(100deg,#321d24,#11151e); }
  #wb-mobile .wb-event-card[data-event-type=season_reset] { --event-color:#9acbff; }
  #wb-mobile .wb-event-card[data-event-type=custom_event] { --event-color:#d6b6eb; }
  #wb-mobile .wb-tabs button { font-size:12px; font-weight:700; padding:10px 4px; border-color:#4a5a61; }
  #wb-mobile [data-wb-view=city] > .wb-card:first-child {
    padding:16px; border:1px solid #7b693f;
    background:linear-gradient(90deg,#071a2be8,#092136df 40%,#07121bb8),url('assets/citycap-bg.jpg') right center/auto 300px no-repeat;
    box-shadow:inset 3px 0 0 #d8a64a,inset 0 1px 0 #f5d69820,0 8px 20px #0005;
  }
  #wb-mobile [data-wb-view=city] > .wb-card:first-child h2 { text-transform:uppercase; font-size:12px; letter-spacing:.12em; color:var(--gold-light); }
  #wb-mobile [data-wb-view=city] .wb-countdown { font-size:34px; }
  #wb-mobile [data-wb-view=city] > .wb-card:last-child { border-color:#68603c; }
  #wb-mobile [data-wb-view=doomed] details { border-color:#554360; background:linear-gradient(135deg,#20192de8,#0e1420f7); }
  #wb-mobile details { border-radius:4px; border-color:#385061; background:linear-gradient(135deg,#10212d,#07131d); box-shadow:inset 0 1px 0 #ffffff0a,0 4px 12px #0004; }
  #wb-mobile summary { list-style:none; display:flex; align-items:center; justify-content:space-between; gap:10px; color:#e2c393; font-size:14px; font-weight:800; letter-spacing:.04em; border-bottom:1px solid transparent; }
  #wb-mobile summary::-webkit-details-marker { display:none; }
  #wb-mobile summary::after { content:'+'; color:var(--gold); font-size:22px; font-weight:400; line-height:1; }
  #wb-mobile details[open] > summary { border-bottom-color:#8b6d443e; color:var(--gold-light); }
  #wb-mobile details[open] > summary::after { content:'−'; }
  #wb-mobile summary:active { color:#fff0c5; background:#ca903d10; }
  #wb-mobile [data-wb-view=doomed] .wb-card { border-color:#544761; background:linear-gradient(135deg,#271f34,#111724); }
  #wb-mobile [data-wb-view=doomed] [data-wb-forecast] { padding:12px; border:1px solid #97773f; border-left:3px solid var(--gold); border-radius:3px; background:linear-gradient(135deg,#3c2d25,#1e1928); color:#f2d49f; }
  #wb-mobile progress { appearance:none; height:10px; border:1px solid #5e4e34; border-radius:2px; overflow:hidden; background:#030a12; color:var(--gold); }
  #wb-mobile progress::-webkit-progress-bar { background:linear-gradient(#02070d,#17212b); box-shadow:inset 0 1px 4px #000; }
  #wb-mobile progress::-webkit-progress-value { background:linear-gradient(180deg,#fbd475,#b07827); box-shadow:0 0 8px #efb44655; }
  #wb-mobile progress::-moz-progress-bar { background:linear-gradient(180deg,#fbd475,#b07827); }
  #wb-mobile [data-wb-pro-progress]::-webkit-progress-value { background:linear-gradient(180deg,#cbb4ef,#75539f); }
  #wb-mobile [data-wb-pro-progress]::-moz-progress-bar { background:linear-gradient(180deg,#cbb4ef,#75539f); }
  #wb-mobile label { color:#c7d5df; font-size:13px; }
  #wb-mobile input:not([type=checkbox]), #wb-mobile select, #wb-mobile textarea { border:1px solid #445866; background:linear-gradient(180deg,#06121d,#101f2c); color:#f0f4f7; box-shadow:inset 0 2px 6px #0006,inset 0 -1px 0 #ffffff08; font-size:15px; }
  #wb-mobile input::placeholder, #wb-mobile textarea::placeholder { color:#9fb0bf; opacity:1; }
  #wb-mobile input:disabled, #wb-mobile select:disabled, #wb-mobile textarea:disabled { color:#b8c5d2; opacity:1; }
  #wb-mobile .wb-member-card { border-left:3px solid #7395b2; background:linear-gradient(135deg,#132939,#08131e); }
  #wb-mobile .wb-member-heading { display:flex; align-items:flex-start; gap:10px; margin-bottom:6px; }
  #wb-mobile .wb-member-heading strong { flex:1; line-height:1.4; font-size:15px; }
  #wb-mobile .wb-rank { flex:none; min-width:35px; text-align:center; padding:3px 7px; border-radius:3px; font-size:11px; font-weight:800; color:#c5ddec; border:1px solid #58758a; background:linear-gradient(#2c465b,#14283a); box-shadow:inset 0 1px 0 #fff1; }
  #wb-mobile .wb-member-card[data-member-rank="5"], #wb-mobile .wb-member-card[data-member-rank="4"] { border-left-color:var(--gold); }
  #wb-mobile .wb-member-card[data-member-rank="5"] .wb-rank, #wb-mobile .wb-member-card[data-member-rank="4"] .wb-rank { color:#ffe0a0; border-color:#9b7338; background:linear-gradient(#62451f,#302312); }
  #wb-mobile .wb-member-card small { font-size:12px; line-height:1.65; }
  #wb-mobile [data-wb-view=members] > label { padding:10px 12px; margin-bottom:10px; border:1px solid #334f62; border-radius:4px; background:linear-gradient(135deg,#112333,#07151f); }
  #wb-mobile [data-wb-view=members] > small { display:block; margin:12px 0; color:#d3b984; }
  #wb-mobile .wb-status { color:#f4d495; padding:9px 12px; border-left:2px solid #b68b3f; background:#9b743915; font-size:13px; }
  #wb-mobile .wb-bottom { border-top:1px solid #a67936; background:linear-gradient(180deg,#101f2df5,#030b13fa); box-shadow:0 -5px 20px #0008,inset 0 1px 0 #f8c4651a; }
  #wb-mobile .wb-bottom button { color:#b4c3cf; border-radius:2px; box-shadow:none; background:transparent; position:relative; min-height:54px; }
  #wb-mobile .wb-bottom button span { font-size:24px; line-height:27px; filter:drop-shadow(0 1px 2px #000); }
  #wb-mobile .wb-bottom button[aria-current=page] { color:#ffcd6a; background:linear-gradient(180deg,#b8872524,#b8872504); box-shadow:inset 0 2px 0 var(--gold); border:0; border-radius:0; }
  #wb-mobile .wb-bottom button:active { background:#ad782833; }
  @media (prefers-reduced-motion:reduce) { #wb-mobile button { transition:none; } }
}

@media (max-width:760px) {
  #wb-mobile .wb-war-alert { display:flex; align-items:center; gap:14px; width:100%; margin:0 0 12px; padding:15px 16px; min-height:82px; border:1px solid #548660; border-radius:4px; background:linear-gradient(135deg,#173e2c,#0b241c 65%,#081c18); box-shadow:inset 0 1px 0 #b4d4a52b,inset 0 -4px 12px #0005,0 5px 12px #0004; color:#e0e8c7; }
  #wb-mobile .wb-war-alert strong { display:block; font-size:18px; letter-spacing:.05em; color:#e4dfba; }
  #wb-mobile .wb-war-alert small { display:block; color:#b8cbb6; font-size:12px; }
  #wb-mobile .wb-war-alert .wb-war-shield { flex:none; font-size:34px; line-height:1.2; filter:drop-shadow(0 2px 3px #000); }
  #wb-mobile .wb-war-alert:active { background:linear-gradient(#245039,#102c21); box-shadow:inset 0 2px 8px #0009; }
  #wb-mobile [data-wb-view=warAlert] [role=status] { white-space:pre-line; overflow-wrap:anywhere; }
}