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

#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; gap: 0.5em; padding: 0.5em 0; margin-bottom: 1em;
    position: sticky; top: 0; background: #fafaf8; z-index: 1;
    border-bottom: 1px solid #c9b99a;
}

.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-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: #2266bb; }
.tg-link-t { color: #7744aa; }
.tg-link-m { color: #118855; }
.tg-link-a { color: #555; }
.tg-link-script { color: #c44; text-decoration: underline dotted; }

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