/* Component colour layer. Load after existing component sheets and theme-system.css.
   Layout, chat chrome, video overlays, photo artwork and avatar cosmetics stay intact. */

/* Profile, account settings, personal statistics and albums. */
.profile-overview,.profile-info,.profile-editor,.profile-results,.album{
 background:var(--surface);color:var(--text);border-color:var(--line);
}
.profile-banner{background:var(--surface-alt);border-color:var(--line)}
.profile-banner h1,.profile-info h2,.profile-intro h2,.profile-editor summary,
.profile-details-form h3,.profile-facts h3{color:var(--text)}
.profile-photo,.profile-photo.without-photo .avatar{background:var(--surface-alt);color:var(--accent)}
.profile-form .row,.profile-details-form{border-color:var(--line)}
.profile-region,.profile-bio,.profile-info p,.profile-details-form small,
.profile-facts h3,.profile-results>p{color:var(--muted)}
.profile-symbol{color:var(--accent)}
.profile-chips span,.profile-chips.interests span{background:var(--tint);color:var(--text)}
.result-metrics>div{background:var(--surface-alt);color:var(--text)}
.result-metrics strong{color:var(--accent)}
.result-metrics span{color:var(--muted)}
.profile-sections button{background:var(--surface);color:var(--muted);border-color:var(--line)}
.profile-sections button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}
.profile-fields input,.profile-fields select,.profile-details-form input,
.profile-details-form select,.profile-form input,.profile-form textarea,.profile-form select{
 background:var(--surface-alt);color:var(--text);border-color:var(--line);
}
.profile-photo .avatar-change{background:var(--surface);color:var(--text);border-color:var(--line)}
.photo-input input::file-selector-button{background:var(--tint);color:var(--text)}
.album-add{background:var(--surface-alt);color:var(--text);border-color:var(--line)}

/* Discovery photo scrims retain white labels; only empty cards and controls adapt. */
.discovery-card,.person-tile{background:var(--surface-alt)}
.person-tile.no-photo>.avatar{background:var(--surface-alt);color:var(--accent)}
.swipe-actions span,.swipe-hint{color:var(--muted)}
.swipe-actions #like{background:var(--accent);color:var(--accent-ink)}
.swipe-verdict{background:var(--surface)}
.discovery-card:focus-visible{outline-color:var(--accent)}

/* Hero inventory and genuine game progress. Rarity/aura colours are game data. */
.linked-hero,.game-avatar-choice{background:var(--surface);color:var(--text);border-color:var(--line)}
.hero-identity img,.hero-equipment article{background:var(--surface-alt)}
.hero-equipment h4,.hero-equipment p{color:var(--text)}
.hero-equipment span,.hero-identity p,.game-avatar-choice small{color:var(--muted)}
.game-avatar-choice[aria-pressed=true]{background:var(--tint);outline-color:var(--accent)}
.avatar-choice-state{color:var(--accent)}
.game-avatar-choice[aria-pressed=true] .avatar-choice-state{color:var(--text)}
.hero-preview{background:var(--surface-alt);color:var(--accent);border-color:var(--line)}

/* Service collection rows and earlier tile variant. Cover overlays are intentional. */
.service-tile,.service-collection,.service-coming{background:var(--surface);color:var(--text);border-color:var(--line)}
.service-tile h2,.service-coming h2,.service-link strong{color:var(--text)}
.service-tile p,.service-state,.service-link small,.service-coming small{color:var(--muted)}
.service-symbol,.service-arrow{background:var(--tint);color:var(--accent)}
.service-action,.service-eyebrow{color:var(--accent)}
.service-tile.available:hover{background:var(--surface-alt);border-color:var(--accent)}
.service-link{color:var(--text);border-color:var(--line)}
.service-link:hover .service-arrow{background:var(--accent);color:var(--accent-ink)}

/* Quiz answers, catalog detail, solo/duels, event editor and host screens. */
.catalog-detail,.quiz-question,.event-question,.er-code,.er-lobby,.er-question,
.er-member-result,.er-leaders ol,.er-join-form{background:var(--surface);color:var(--text);border-color:var(--line)}
.catalog-tools input,.catalog-tools select,#event-editor input,#event-editor textarea,
#event-editor select{background:var(--surface-alt);color:var(--text);border-color:var(--line)}
.quiz-options button,.catalog-answers button,.er-options button{background:var(--surface-alt);color:var(--text);border-color:var(--line)}
.quiz-options button:hover:not(:disabled),.catalog-answers button:hover:not(:disabled),
.er-options button:hover:not(:disabled){background:var(--tint);border-color:var(--accent)}
.er-options button.chosen{border-color:var(--accent);background:var(--tint)}
.er-options button.correct{background:var(--surface-alt)}
.er-options button.correct em{color:var(--text)}
.er-options button>span,.er-clock{background:var(--tint);color:var(--accent)}
.er-options button.correct>span{background:var(--accent);color:var(--accent-ink)}
.duel-toolbar span,.catalog-count,.er-kicker,.er-meta,.er-answer-state,
.er-result-heading p,.er-member-result dt,.er-member-result dd small{color:var(--muted)}
.er-member-result dd{color:var(--text)}
.er-member-result dl>div:first-child dd{color:var(--accent)}
.er-leaders li,.er-member-result dl>div{border-color:var(--line)}
.er-presentation{background:var(--surface-alt);color:var(--text)}
.er-error{background:var(--surface-alt);color:var(--text);border-color:var(--line)}

/* Photo Studio: no fixed light violet panels or unreadable accent text. */
.photo-studio .ps-upload,.photo-studio .ps-result-empty{background:var(--surface-alt)}
.photo-studio .ps-upload>span,.photo-studio .ps-placeholder>span,
.photo-studio .ps-result-empty span,.photo-studio .ps-file-link{color:var(--accent)}
.photo-studio .ps-styles button{background:var(--surface);color:var(--text);border-color:var(--line)}
.photo-studio .ps-styles button.selected{background:var(--tint);border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}
.photo-studio .ps-consent input{accent-color:var(--accent)}
.photo-studio .ps-error{background:var(--surface-alt);border-color:var(--line);color:var(--text)}
.photo-studio .ps-tabs [aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:inset 0 0 0 1px var(--line)}
.photo-studio .ps-label textarea,.photo-studio .ps-label select{background:var(--surface-alt);color:var(--text);border-color:var(--line)}

/* Sticker collection/editor; artwork itself is never recoloured or filtered. */
.sticker-pack-tile,.sticker-file-label{background:var(--surface);color:var(--text);border-color:var(--line)}
.sticker-pack-tile:hover{background:var(--surface-alt);border-color:var(--accent)}
.sticker-pack-tabs button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}
.sticker-edit input,.sticker-edit textarea,.sticker-create input{background:var(--surface-alt);color:var(--text);border-color:var(--line)}
.sticker-heading>span,.sticker-upload>span,.sticker-pack-tile small,
.sticker-source-note,.sticker-upload-note{color:var(--muted)}
.sticker-empty-icon,.sticker-source-note a{color:var(--accent)}
.sticker-pick-grid button:hover{background:var(--tint)}

/* Entry screens use the same palette as signed-in components. */
.auth p,.guest-lead,.guest-features p{color:var(--muted)}
.auth-tabs [aria-pressed=true],.guest-actions .primary{background:var(--accent);color:var(--accent-ink)}
.guest-features article>span:first-child{color:var(--accent)}