/* oyun-hakkinda.php — kirilloid tarzı asker rehberi */
body.ztv-about-page {
    margin: 0;
    padding: 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    line-height: 1.45;
    color: #2a2a2a;
    background: #e8e0d0;
}
body.ztv-about-page.ztv-about-embed {
    background: #f4f0e8;
}
body.ztv-about-page.ztv-about-embed .ztv-about-topbar {
    display: none;
}
.ztv-about-shell {
    max-width: 1100px;
    margin: 0 auto;
    padding: 16px 14px 28px;
}
body.ztv-about-embed .ztv-about-shell {
    max-width: none;
    padding: 8px 10px 16px;
}
.ztv-about-topbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px 16px;
    background: linear-gradient(180deg, #fff 0%, #f0ebe0 100%);
    border: 1px solid #c9c1a4;
    border-radius: 6px;
}
.ztv-about-topbar h1 {
    margin: 0;
    font-size: 20px;
    color: #5a8f1a;
}
.ztv-about-topbar .sub {
    font-size: 12px;
    color: #666;
    margin-top: 4px;
}
.ztv-about-toplinks a {
    display: inline-block;
    margin-left: 8px;
    padding: 6px 12px;
    font-weight: bold;
    font-size: 12px;
    color: #fff;
    text-decoration: none;
    background: linear-gradient(to bottom, #7cb029, #5a8f1a);
    border: 1px solid #4a7a14;
    border-radius: 4px;
}
.ztv-about-toplinks a.secondary {
    background: #e8e2d4;
    color: #333;
    border-color: #c9c1a4;
}
.ztv-about-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 14px;
}
.ztv-about-nav a {
    padding: 8px 14px;
    font-weight: bold;
    font-size: 12px;
    text-decoration: none;
    color: #4a4a4a;
    background: #fff;
    border: 1px solid #c9c1a4;
    border-radius: 4px;
}
.ztv-about-nav a:hover {
    background: #f5f0e6;
}
.ztv-about-nav a.active {
    color: #fff;
    background: linear-gradient(to bottom, #7cb029, #5a8f1a);
    border-color: #4a7a14;
}
.ztv-about-panel {
    background: #fff;
    border: 1px solid #c9c1a4;
    border-radius: 6px;
    padding: 14px 16px 18px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}
.ztv-about-panel h2 {
    margin: 0 0 10px;
    font-size: 16px;
    color: #3d5c12;
}
.ztv-about-panel p {
    margin: 0 0 10px;
}
.ztv-about-tribe-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 12px;
}
.ztv-about-tribe-tabs a {
    padding: 5px 10px;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    color: #444;
    background: #f0ebe0;
    border: 1px solid #c9c1a4;
    border-radius: 3px;
}
.ztv-about-tribe-tabs a.active {
    background: #5a8f1a;
    color: #fff;
    border-color: #4a7a14;
}
.ztv-about-troops-wrap {
    overflow-x: auto;
}
table.ztv-about-troops {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
}
table.ztv-about-troops th,
table.ztv-about-troops td {
    border: 1px solid #d8d0c0;
    padding: 5px 7px;
    text-align: center;
    vertical-align: middle;
}
table.ztv-about-troops th {
    background: #e8e2d4;
    font-weight: bold;
    white-space: nowrap;
}
table.ztv-about-troops td.name {
    text-align: left;
    white-space: nowrap;
    font-weight: bold;
}
table.ztv-about-troops tr:nth-child(even) td {
    background: #faf8f4;
}
table.ztv-about-troops tr.ztv-about-row-highlight td {
    background: #fff3d6;
}
table.ztv-about-troops img.unit {
    vertical-align: middle;
}
.ztv-about-stat-atk { color: #8b1a1a; font-weight: bold; }
.ztv-about-stat-def { color: #1a4a8b; }
.ztv-about-eff { color: #5a5a5a; font-size: 11px; }
.ztv-about-note {
    margin-top: 10px;
    padding: 8px 10px;
    font-size: 11px;
    color: #555;
    background: #f5f0e6;
    border-left: 3px solid #5a8f1a;
}
.ztv-about-tribe-card {
    margin-bottom: 14px;
    padding: 12px 14px;
    background: #faf8f4;
    border: 1px solid #e0d8c8;
    border-radius: 4px;
}
.ztv-about-tribe-card h3 {
    margin: 0 0 6px;
    font-size: 15px;
    color: #5a8f1a;
}
.ztv-about-tribe-card ul {
    margin: 0;
    padding-left: 18px;
}
.ztv-about-build-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 8px;
}
.ztv-about-build-grid a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    text-decoration: none;
    color: #333;
    background: #faf8f4;
    border: 1px solid #e0d8c8;
    border-radius: 4px;
    font-size: 12px;
}
.ztv-about-build-grid a:hover {
    background: #f0ebe0;
}
.ztv-about-warsim-cta {
    text-align: center;
    padding: 24px 16px;
}
.ztv-about-warsim-cta a.big {
    display: inline-block;
    padding: 14px 28px;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    background: linear-gradient(to bottom, #7cb029, #5a8f1a);
    border: 1px solid #4a7a14;
    border-radius: 6px;
}
.ztv-about-warsim-cta p {
    max-width: 520px;
    margin: 12px auto 0;
    color: #666;
    font-size: 12px;
}

.ztv-about-lead {
    font-size: 14px;
    color: #444;
    margin-bottom: 16px;
}
.ztv-about-game-section {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px dotted #d8d0c0;
}
.ztv-about-game-section:last-of-type {
    border-bottom: none;
}
.ztv-about-game-section h3 {
    margin: 0 0 8px;
    font-size: 15px;
    color: #5a8f1a;
}
.ztv-about-game-section ul {
    margin: 0;
    padding-left: 20px;
}
.ztv-about-game-section li {
    margin-bottom: 6px;
}
.ztv-about-muted {
    font-size: 12px;
    color: #666;
    font-style: italic;
}
table.ztv-about-compare {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    margin: 10px 0;
}
table.ztv-about-compare th,
table.ztv-about-compare td {
    border: 1px solid #d8d0c0;
    padding: 8px 10px;
    text-align: left;
    vertical-align: top;
}
table.ztv-about-compare th {
    background: #e8e2d4;
    font-weight: bold;
}
table.ztv-about-compare tbody tr:nth-child(even) td {
    background: #faf8f4;
}
.ztv-about-tribe-links {
    margin: 10px 0;
    line-height: 1.8;
}
.ztv-about-tribe-links a {
    font-weight: bold;
    color: #4a7a14;
}
h3.ztv-about-build-cat {
    margin-top: 18px;
    font-size: 14px;
    color: #5a8f1a;
}
.ztv-about-build-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ztv-about-build-card {
    padding: 12px 14px;
    background: #faf8f4;
    border: 1px solid #e0d8c8;
    border-radius: 6px;
}
.ztv-about-build-card__head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 10px;
}
.ztv-about-build-card__titles strong {
    display: block;
    font-size: 14px;
    margin-bottom: 4px;
}
.ztv-about-build-meta {
    font-size: 11px;
    color: #777;
}
.ztv-about-build-blurb {
    margin: 6px 0 0;
    font-size: 12px;
    line-height: 1.45;
    color: #555;
}
.ztv-about-build-section h4 {
    margin: 0 0 6px;
    font-size: 12px;
    color: #5a8f1a;
}
.ztv-about-build-cost {
    margin-top: 8px;
}
.ztv-about-build-cost summary {
    cursor: pointer;
    font-weight: bold;
    font-size: 12px;
    color: #4a7a14;
    padding: 6px 0;
}
.ztv-about-req-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
}
.ztv-about-req-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    background: #fff;
    border: 1px solid #e8e2d4;
    border-radius: 4px;
    padding: 4px 8px;
}
.ztv-about-req-level {
    color: #666;
    white-space: nowrap;
}
.ztv-about-req-note {
    margin: 0;
    font-size: 12px;
    color: #666;
}
.ztv-about-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 8px 0;
}
table.ztv-about-cost-table {
    width: 100%;
    min-width: 520px;
    border-collapse: collapse;
    font-size: 11px;
}
table.ztv-about-cost-table th,
table.ztv-about-cost-table td {
    padding: 5px 8px;
    border: 1px solid #e0d8c8;
    text-align: right;
    white-space: nowrap;
}
table.ztv-about-cost-table th:first-child,
table.ztv-about-cost-table td:first-child {
    text-align: center;
}
table.ztv-about-cost-table thead th {
    background: #e8e2d4;
}
table.ztv-about-cost-table tbody tr:nth-child(even) td {
    background: #fff;
}
.ztv-about-cost-note {
    font-size: 11px;
    margin: 4px 0 0;
}
.ztv-about-troop-req {
    min-width: 140px;
    vertical-align: top;
}
.ztv-about-troop-req .ztv-about-req-list {
    flex-direction: column;
    gap: 4px;
}
.ztv-about-troop-req .ztv-about-req-item {
    padding: 3px 6px;
}
.ztv-about-build-img {
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    object-fit: contain;
    object-position: center bottom;
    background: transparent;
}
.ztv-eff-help {
    margin: 12px 0;
    padding: 12px 14px;
    background: #f4f0e8;
    border: 1px solid #e0d8c8;
    border-radius: 6px;
    font-size: 12px;
    line-height: 1.5;
}
.ztv-eff-help-list {
    margin: 8px 0 0;
    padding-left: 18px;
}
.ztv-eff-rank-caption {
    margin: 0 0 8px;
    padding: 8px 10px;
    font-size: 12px;
    color: #ccc;
    background: #2a2a2a;
    border-radius: 4px 4px 0 0;
}
.ztv-eff-rank {
    color: #aaa;
    text-align: center;
    width: 2em;
}
.ztv-eff-tribe {
    color: #b8d4a0;
    white-space: nowrap;
}
.ztv-eff-stat {
    color: #bbb;
    text-align: right;
}

body.ztv-about-page--rtl {
    direction: rtl;
}
body.ztv-about-page--rtl .ztv-about-shell,
body.ztv-about-page--rtl .ztv-about-panel {
    text-align: right;
}
body.ztv-about-page--rtl .ztv-about-table-wrap {
    direction: ltr;
}
body.ztv-about-page--rtl table.ztv-about-cost-table {
    direction: rtl;
}

/* Kirilloid tarzı verim sıralaması */
.ztv-eff-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 12px;
}
.ztv-eff-sidebar {
    flex: 0 0 240px;
    max-width: 100%;
    padding: 12px 14px;
    background: #2a2a2a;
    color: #e8e8e8;
    border-radius: 6px;
    font-size: 12px;
}
.ztv-eff-sidebar-title {
    margin: 0 0 8px;
    font-weight: bold;
    color: #b8d4a0;
}
.ztv-eff-presets {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 12px;
}
.ztv-eff-presets button {
    padding: 6px 8px;
    font-size: 11px;
    text-align: left;
    cursor: pointer;
    background: #3d3d3d;
    color: #eee;
    border: 1px solid #555;
    border-radius: 3px;
}
.ztv-eff-presets button:hover {
    background: #4a5a3a;
    border-color: #6a8f4a;
}
.ztv-eff-label {
    display: block;
    margin-bottom: 10px;
}
.ztv-eff-label select,
.ztv-eff-label input[type="text"] {
    width: 100%;
    margin-top: 4px;
    box-sizing: border-box;
}
.ztv-eff-label input[type="range"] {
    width: 100%;
    margin-top: 4px;
}
.ztv-eff-main {
    flex: 1 1 400px;
    min-width: 0;
    max-height: 70vh;
    overflow: auto;
    background: #1e1e1e;
    border-radius: 6px;
    border: 1px solid #444;
}
table.ztv-eff-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 12px;
    color: #eee;
}
table.ztv-eff-table th {
    position: sticky;
    top: 0;
    background: #333;
    padding: 8px 10px;
    text-align: left;
    z-index: 1;
}
table.ztv-eff-table td {
    padding: 5px 10px;
    border-bottom: 1px solid #333;
    vertical-align: middle;
}
td.ztv-eff-name {
    font-weight: bold;
}
td.ztv-eff-score {
    text-align: right;
    font-variant-numeric: tabular-nums;
    color: #ffd080;
}
tr.ztv-eff-tribe-roman td { background: rgba(220, 220, 220, 0.12); }
tr.ztv-eff-tribe-teuton td { background: rgba(80, 160, 80, 0.15); }
tr.ztv-eff-tribe-gaul td { background: rgba(160, 160, 160, 0.12); }
tr.ztv-eff-tribe-egypt td { background: rgba(180, 140, 90, 0.15); }
tr.ztv-eff-tribe-hun td { background: rgba(220, 200, 80, 0.12); }
tr.ztv-eff-tribe-spartan td { background: rgba(120, 180, 220, 0.18); }
tr.ztv-eff-tribe-viking td { background: rgba(80, 120, 200, 0.2); }

/* build.php — Oyun hakkında (bilgi ikonu; ampul = answersButton / yönerge) */
body.build div#center a#ztvAboutButton:before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='10' fill='none' stroke='%23fdefcc' stroke-width='2'/%3E%3Ctext x='12' y='16' text-anchor='middle' fill='%23fdefcc' font-size='13' font-family='Georgia,serif' font-weight='bold'%3Ei%3C/text%3E%3C/svg%3E") no-repeat center;
    background-size: 16px 16px;
}