/* TGReader.css — Standalone TG Reader styles v002 */

#tg-reader-container {
    display: none;
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: #fafaf8; z-index: 1000;
    overflow-y: auto; padding: 1em;
}

.tg-reader-controls {
    display: flex; flex-direction: column; gap: 0.5em;
    padding: 0.5em 0;
}

.tg-dim-btn {
    padding: 0.4em 0.8em; border: 1px solid #999; border-radius: 4px;
    background: #f0ede6; cursor: pointer; font-size: 0.9em;
}
.tg-dim-btn:hover { background: #e0ddd6; }
.tg-reader-close { margin-left: auto; }

.tg-controls-row {
    text-align: center;
}
.tg-controls-label {
    font-size: 0.85em; color: #555; margin-right: 0.3em; white-space: nowrap;
}
.tg-key-table {
    font-size: 0.85em; white-space: nowrap; margin-top: 0.3em;
    border-collapse: collapse;
}
.tg-key-table td { padding: 0.15em 0.5em; border: 1px solid #ccc; }
.tg-key-hide { text-align: center; }
.tg-key-hide input { margin: 0; cursor: pointer; }
.tg-key-header td { font-weight: bold; text-align: center; }

.tg-reader-table {
    border: 2px solid #333; border-collapse: collapse;
    margin: 0.8em 0; width: auto;
}
.tg-reader-table td {
    border: 1px solid #999; padding: 0.3em 0.6em;
    text-align: center; vertical-align: middle;
    font-size: 1.1em;
}

/* Tier row styling */
.tg-tier-s td { font-size: 1.3em; font-weight: bold; }
.tg-tier-r td { color: #555; }
.tg-tier-b td { color: #333; font-style: italic; }
.tg-tier-f td { color: #666; font-size: 0.9em; }
.tg-tier-e td { color: #2a5a2a; }
.tg-tier-p td { color: #2a5a2a; font-style: italic; }
.tg-tier-t td { font-weight: bold; }
.tg-tier-c td { font-style: italic; color: #666; font-size: 0.9em; }
.tg-tier-d td { color: #888; font-size: 0.85em; }

/* Links */
.tg-link       { text-decoration: underline; }
.tg-link:hover { text-decoration: underline; color: #000; }
.tg-link-d { color: #b35900; }
.tg-link-g { color: #2a8c2a; }
.tg-link-t { color: #7744aa; }
.tg-link-m { color: #118855; }
.tg-link-a { color: #555; }
.tg-link-script { color: #c44; text-decoration: underline dotted; }

/* Tier label column (first frame only) */
.tg-tier-label { font-weight: bold; color: #555; font-size: 0.85em; padding: 0.2em 0.4em; }

/* Ditto */
.tg-ditto { color: #bbb; font-style: normal; font-family: sans-serif; }

/* Autosplit: stacked slice tables */
.tg-autosplit-group { margin: 0.8em 0; }
.tg-autosplit-group .tg-reader-table { margin: 0; }
.tg-autosplit-group .tg-reader-table + .tg-reader-table { margin-top: 0.3em; }
