.tdd-class-traits{display:grid;gap:.75rem;margin:0;padding-left:1.5rem}.tdd-class-group{margin-bottom:1.5rem}.tdd-class-group h4{margin:0;color:var(--tdd-gold,#c9a96e);font-family:Cinzel,serif}.tdd-class-group__meta{margin:.35rem 0 .75rem;color:rgba(255,255,255,.62)}.tdd-class-inline-table{width:100%;border-collapse:collapse}.tdd-class-inline-table th,.tdd-class-inline-table td{padding:.7rem;border-bottom:1px solid rgba(201,169,110,.18);text-align:left;vertical-align:top}.tdd-class-inline-table th{font-family:Cinzel,serif;color:#c9a96e}.tdd-class-configuration-help{margin-top:1rem;padding:1rem;border:1px solid rgba(201,169,110,.22);background:rgba(0,0,0,.18)}.tdd-class-passive-editor{display:grid;gap:.75rem;margin-bottom:1rem}.tdd-class-passive-row{display:grid;grid-template-columns:minmax(180px,.7fr) minmax(260px,1.3fr);gap:.75rem}.tdd-class-passive-row input{width:100%}@media(max-width:760px){.tdd-class-passive-row{grid-template-columns:1fr}.tdd-class-inline-table{font-size:.92rem}}

.tdd-class-spell-list{margin:.75rem 0 0;padding-left:1.25rem;display:grid;gap:.35rem;color:rgba(255,255,255,.72)}.tdd-class-spell-list strong{color:var(--tdd-gold,#c9a96e)}

.tdd-class-element-link{
    appearance:none;border:0;padding:0;background:none;color:var(--tdd-gold,#c9a96e);
    font:inherit;font-weight:700;text-align:left;cursor:pointer;text-decoration:underline;
    text-decoration-color:rgba(201,169,110,.35);text-underline-offset:.2em
}
.tdd-class-element-link:hover,.tdd-class-element-link:focus-visible{color:#f0d79b;text-decoration-color:currentColor}
.tdd-class-inline-table--nested{margin-top:.85rem;background:rgba(0,0,0,.14)}
.tdd-class-inline-table--nested th,.tdd-class-inline-table--nested td{padding:.55rem .65rem}
.tdd-class-element-dialog{width:min(92vw,620px);padding:0;border:0;background:transparent;color:inherit}
.tdd-class-element-dialog::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(3px)}
.tdd-class-element-dialog .tdd-card{min-height:0}
.tdd-class-element-dialog__close{display:flex;justify-content:flex-end;margin-top:.75rem}

/* Présentation compacte des recommandations et formations de classe. */
.tdd-class-recommendations {
    display: grid;
    gap: .65rem;
}

.tdd-class-recommendation-line {
    margin: 0;
    line-height: 1.6;
}

.tdd-class-recommendation-line strong {
    color: var(--detail-accent, var(--tdd-gold, #c9a96e));
    font-family: Cinzel, serif;
}

.tdd-class-training-links {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .65rem;
    margin-top: .75rem;
}

.tdd-class-training-link {
    display: inline-flex;
    align-items: center;
    min-height: 2.25rem;
    padding: .4rem .8rem;
    border: 1px solid color-mix(in srgb, var(--detail-accent, #c9a96e) 55%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--detail-accent, #c9a96e) 12%, transparent);
    color: var(--detail-accent, var(--tdd-gold, #c9a96e));
    font-weight: 700;
    text-decoration: none;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

.tdd-class-training-link:hover,
.tdd-class-training-link:focus-visible {
    border-color: var(--detail-accent, #c9a96e);
    background: color-mix(in srgb, var(--detail-accent, #c9a96e) 22%, transparent);
    transform: translateY(-1px);
}

@media (max-width: 760px) {
    .tdd-class-training-links {
        align-items: stretch;
    }

    .tdd-class-training-link {
        justify-content: center;
        flex: 1 1 calc(50% - .65rem);
    }
}

/* Bibliothèque SVG des formations martiales. */
.tdd-class-training-links {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .75rem;
    width: 100%;
}

.tdd-class-training-link {
    justify-content: flex-start;
    gap: .6rem;
    min-width: 0;
    border-radius: .65rem;
    padding: .55rem .7rem;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--detail-accent, #c9a96e) 8%, transparent);
}

.tdd-class-training-link span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tdd-class-training-icon {
    width: 1.35rem;
    height: 1.35rem;
    flex: 0 0 1.35rem;
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(79%) sepia(27%) saturate(600%) hue-rotate(359deg) brightness(90%);
}

@media (max-width: 980px) {
    .tdd-class-training-links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .tdd-class-training-links {
        grid-template-columns: 1fr;
    }
}

/* Correctif prioritaire : neutralise les styles globaux des liens et images. */
.tdd-class-training-links > a.tdd-class-training-link,
.tdd-class-training-links > a.tdd-class-training-link:link,
.tdd-class-training-links > a.tdd-class-training-link:visited {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .6rem !important;
    min-width: 0 !important;
    min-height: 2.5rem !important;
    padding: .55rem .75rem !important;
    border: 1px solid color-mix(in srgb, var(--detail-accent, #c9a96e) 60%, transparent) !important;
    border-radius: .65rem !important;
    background: color-mix(in srgb, var(--detail-accent, #c9a96e) 13%, transparent) !important;
    color: var(--detail-accent, var(--tdd-gold, #c9a96e)) !important;
    font-family: inherit !important;
    font-size: .95rem !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--detail-accent, #c9a96e) 8%, transparent) !important;
}

.tdd-class-training-links > a.tdd-class-training-link:hover,
.tdd-class-training-links > a.tdd-class-training-link:focus-visible {
    color: var(--detail-accent, var(--tdd-gold, #c9a96e)) !important;
    text-decoration: none !important;
    border-color: var(--detail-accent, #c9a96e) !important;
    background: color-mix(in srgb, var(--detail-accent, #c9a96e) 24%, transparent) !important;
}

.tdd-class-training-links > a.tdd-class-training-link > img.tdd-class-training-icon {
    display: block !important;
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    min-height: 20px !important;
    max-width: 20px !important;
    max-height: 20px !important;
    flex: 0 0 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: contain !important;
    object-position: center !important;
}

.tdd-class-training-links > a.tdd-class-training-link > span {
    color: inherit !important;
    text-decoration: none !important;
}

/* Couleur propre à chaque classe dans les deux vues de la liste. */
.tdd-class-card-view > .tdd-card {
    border-color: color-mix(in srgb, var(--card-accent, #c9a96e) 58%, #171009);
    box-shadow:
        0 12px 28px rgba(0, 0, 0, .28),
        inset 0 0 22px var(--card-accent-soft, rgba(201, 169, 110, .14));
}

.tdd-class-card-view > .tdd-card .tdd-card__eyebrow,
.tdd-class-card-view > .tdd-card .tdd-card__title {
    color: var(--card-accent, #c9a96e);
}

.tdd-class-card-view > .tdd-card .tdd-card__seal {
    border-color: var(--card-accent, #c9a96e);
    background: radial-gradient(
        circle at 35% 28%,
        color-mix(in srgb, var(--card-accent, #c9a96e) 35%, #2c190b),
        #160d08 68%
    );
}

.tdd-class-card-view > .tdd-card .tdd-card__seal svg {
    stroke: color-mix(in srgb, var(--card-accent, #c9a96e) 80%, #fff0bf);
}

.tdd-class-table-row {
    position: relative;
    box-shadow: inset 4px 0 0 var(--class-color, #c9a96e);
}

.tdd-class-table-row:hover {
    background: color-mix(in srgb, var(--class-color, #c9a96e) 9%, transparent);
}

.tdd-class-table-row .tdd-table__title {
    color: var(--class-color, #c9a96e);
}

.tdd-class-table-row .tdd-table__title:hover,
.tdd-class-table-row .tdd-table__title:focus-visible {
    color: color-mix(in srgb, var(--class-color, #c9a96e) 72%, white);
}

/* Administration — éléments liés depuis la modification d'une classe */
.tdd-class-linked-elements {
    display: grid;
    gap: .65rem;
    margin: .75rem 0 1.35rem;
}

.tdd-class-linked-element {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem .85rem;
    border: 1px solid rgba(201, 169, 110, .22);
    background: rgba(20, 13, 10, .35);
}

.tdd-class-linked-element > span {
    min-width: 0;
}

.tdd-class-linked-group + .tdd-class-linked-group {
    margin-top: 1.5rem;
}

@media (max-width: 720px) {
    .tdd-class-linked-element {
        align-items: flex-start;
        flex-direction: column;
    }
}