/* Rankings, news, guide and tasks. Loaded only for these four page families. */
.wars-ui .w-rank-controls { display:block; width:100%; border:0; margin:0; }
.wars-ui .w-rank-controls > tbody { display:block; }
.wars-ui .w-rank-controls tr { display:flex; flex-wrap:wrap; gap:6px; }
.wars-ui .w-rank-controls td { display:block; flex:1 1 88px; min-width:0; width:auto; padding:0; }
.wars-ui .w-rank-controls td:empty { display:none; }
.wars-ui .w-rank-controls form { margin:0; }
.wars-ui .w-rank-controls .buttont { width:100%; min-height:44px; padding:6px 8px; background:var(--w-alt); color:var(--w-ink); border-color:var(--w-line); font-size:13px !important; }
.wars-ui .w-rank-controls input[style*="#996633"] { background:var(--w-action) !important; color:var(--w-on-action); border-color:var(--w-action); }
.wars-ui .w-rank-controls input[style*="#004d00"] { background:var(--w-action) !important; color:var(--w-on-action); }
.wars-ui .w-rank-table { width:100%; table-layout:fixed; border-collapse:collapse; font-size:14px; font-variant-numeric:tabular-nums; }
.wars-ui .w-rank-table td { padding:8px 4px; border-bottom:1px solid var(--w-line); color:var(--w-ink); vertical-align:middle; text-align:left; overflow-wrap:anywhere; }
.wars-ui .w-rank-table tr:first-child td { background:var(--w-alt); font-weight:600; font-size:12px; }
.wars-ui .w-rank-table td:first-child { width:38px; }
.wars-ui .w-rank-table td:nth-child(3) { width:26%; text-align:right; }
.wars-ui .w-rank-table img { max-width:100%; vertical-align:middle; }
.wars-ui .w-family-rankings { min-width:0; }
.wars-ui.w-family-rankings .lenta > form { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:0; text-align:left; }
.wars-ui.w-family-rankings .lenta > form input[name=name] { flex:1 1 160px; width:auto; }
.wars-ui.w-family-rankings .next { display:inline-flex; align-items:center; justify-content:center; min-width:36px; min-height:36px; height:auto; width:auto; padding:6px 10px; margin:3px; border:1px solid var(--w-action); border-radius:4px; background:var(--w-action); color:var(--w-on-action); font-size:14px; text-decoration:none; line-height:1.2; }
.wars-ui.w-family-rankings .next#pressed { background:var(--w-alt); border-color:var(--w-line); color:var(--w-ink); }
.wars-ui.w-family-rankings .lenta > img { max-width:100%; height:auto; }
.wars-ui .w-news-entry { font-size:14px; line-height:1.6; }
.wars-ui .w-news-entry img { max-width:100%; height:auto; }
.wars-ui .w-vote { display:inline-flex; align-items:center; justify-content:center; min-width:36px; min-height:36px; vertical-align:middle; border:1px solid var(--w-line); border-radius:4px; background:var(--w-alt); margin:6px 3px 0 0; }
.wars-ui.w-family-news form { margin:8px 0; text-align:left; }
.wars-ui.w-family-news form .button { margin-top:8px; }
.wars-ui.w-family-news font[color="#edd300"] { color:var(--w-ink); }
.wars-ui #app > .w-guide-shell { width:100%; margin:0; border:0; border-radius:0; }
.wars-ui #app > .w-guide-shell > .w-page-bottom, .wars-ui #app > .w-guide-shell > .CFooter { width:100%; margin-inline:0; }
.wars-ui.w-family-guide .section h2 { margin:0; color:var(--w-ink); font:600 15px/1.4 var(--w-font); }
.wars-ui.w-family-guide .section ul { list-style:none; margin:0; padding:0; }
.wars-ui.w-family-guide .section li { margin:0; }
.wars-ui.w-family-guide .section li > a, .wars-ui.w-family-guide .section > .accordion { display:flex; align-items:center; min-height:44px; padding:8px 6px; border-bottom:1px solid var(--w-line); text-decoration:none; font-size:14px; }
.wars-ui.w-family-guide .accordion { cursor:pointer; }
.wars-ui.w-family-guide .section > .accordion { background:var(--w-alt); margin-top:8px; }
.wars-ui.w-family-guide .accordion::after { content:'+'; margin-left:auto; padding-left:8px; font-size:18px; font-weight:400; }
.wars-ui.w-family-guide .accordion.active::after { content:'−'; }
.wars-ui.w-family-guide .panel { display:none; margin-left:12px; }
.wars-ui.w-family-guide .panel .panel { margin-left:12px; }
.wars-ui .w-table-scroll { width:100%; max-width:100%; overflow:auto; overscroll-behavior-x:contain; margin:8px 0; border:1px solid var(--w-line); border-radius:4px; }
.wars-ui .w-table-scroll table { width:100%; border-collapse:collapse; font-size:13px; font-variant-numeric:tabular-nums; }
.wars-ui .w-table-scroll td { padding:6px 5px; border-bottom:1px solid var(--w-line); vertical-align:middle; }
.wars-ui .w-table-scroll tr:first-child td { background:var(--w-alt); }
.wars-ui .w-table-scroll [data-w-table=w-guide-cost] { min-width:520px; }
.wars-ui .w-table-scroll select { width:100%; min-width:90px; }
.wars-ui.w-family-guide .lenta img { max-width:100%; height:auto; }
.wars-ui .w-task { padding:10px 0; border-bottom:1px solid var(--w-line); }
.wars-ui .w-task:first-child { padding-top:0; }
.wars-ui .w-task > img { width:18px; height:18px; vertical-align:middle; }
.wars-ui .w-task-reward { display:flex; align-items:center; flex-wrap:wrap; gap:4px; margin:6px 0; font-size:13px; font-variant-numeric:tabular-nums; }
.wars-ui .w-task-reward img { width:16px; height:16px; object-fit:contain; }
.wars-ui .w-task form { margin:6px 0 0; }
.wars-ui .w-task form .button { max-width:100%; }
.wars-ui .w-task-locked { color:var(--w-muted); }