/* Semantic foreground/background pairs. Accent is for decoration, action is
   deliberately darker so white button labels remain readable in every skin. */
:root{--ta-action:#326e7d;--ta-on-action:#fff;--ta-link:#286b80;--ta-danger:#a53636}
html:not(.dark){--ta-subcopy:#506c77}
html[data-ta-skin=forest]{--ta-action:#286452;--ta-link:#286452}
html[data-ta-skin=sand]{--ta-action:#80532f;--ta-link:#80532f}
html.dark{--ta-link:#a0dfeb;--ta-danger:#ffb4b4}
html.dark[data-ta-skin=forest]{--ta-link:#a6e6ce}
html.dark[data-ta-skin=sand]{--ta-link:#f0cfa8}

/* Readable shared helper text; do not change disabled controls or game answers. */
html .headBar .opc6,html .headBar .el-breadcrumb__inner,
html .ta-filing a,html .page .color999 {
  color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important;opacity:1!important;
}
html .ta-purchase-agreement,html .ta-purchase-agreement span{color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important}
html .ta-purchase-agreement a{color:var(--ta-link)!important;-webkit-text-fill-color:var(--ta-link)!important;text-decoration:underline;text-underline-offset:3px}
html .ta-purchase-agreement input{accent-color:var(--ta-action)}

/* Buttons and selected filters must not use the pale night-mode accent as a fill. */
html body .ta-membership-card .ta-buy,
html body .ta-filter-row button.selected,
html body .galssPop :is(.btn,.btnMain,.submit-button),
html body :is(.botbtn,.viewBtn,.submit-button),
html body #talk-page-root :is(.btn,.create,.choose.act),
html body .el-button--primary:not(.is-plain),
html body .ta-start,
html body #ta-promotion-agreement-modal button {
  background:var(--ta-action)!important;border-color:var(--ta-action)!important;
  color:var(--ta-on-action)!important;-webkit-text-fill-color:var(--ta-on-action)!important;
}
html body .galssPop :is(.btn,.btnMain,.submit-button) *,
html body #talk-page-root :is(.btn,.create,.choose.act) *,
html body .el-button--primary:not(.is-plain) *,html body .ta-start * {
  color:var(--ta-on-action)!important;-webkit-text-fill-color:var(--ta-on-action)!important;
}
html body .el-button--primary.is-plain{background:var(--ta-surface-soft)!important;color:var(--ta-link)!important;border-color:var(--ta-link)!important}

/* Dashboard helper copy was double-faded by gray color plus opacity. */
html .home :is(.ta-welcome p,.ta-shortcuts p,.ta-shortcut small,.ta-metric small),
html .homeStats .txt .tag,html .homeStats .txt .tag *,
html .homeStats .topBox .size28,html .homeStats .top>.opc6,
html .homeStats .mr50.hand,html .homeChart .size25,
html .homeRank :is(.rankTips,.rankTime,.tips) {
  color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important;opacity:1!important;
}
html .homeStats .mr50.hand.act{color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important}
html:not(.dark) .homeSign,html:not(.dark) .homeSign *{color:#72503c!important;-webkit-text-fill-color:#72503c!important}
html.dark .homeSign,html.dark .homeSign *{color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important}
html.dark .homeSign .signBtn{background:var(--ta-surface-soft)!important}
html .home .mr50.hand.act{color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important}
html .ta-quick-actions button{background:var(--ta-surface-soft)!important;color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important;border-color:var(--ta-edge)!important}

/* AI help text is normal readable copy, not a disabled state. */
html #talk-page-root :is(.opc5,.opc6){opacity:1!important;color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important}
html #talk-page-root :is(.opc5,.opc6) *{color:inherit!important;-webkit-text-fill-color:inherit!important}
html #talk-page-root .wait .cellItem{background:var(--ta-surface-soft)!important;color:var(--ta-copy)!important}

/* Dialogs: use matching surface/text for native fields as well as labels. */
html .van-popup .galssPop :is(input:not([type=checkbox]):not([type=radio]),textarea),
html .questionnaire-popup :is(textarea,.question-item,.form-footer) {
  background:var(--ta-surface-soft)!important;border-color:var(--ta-edge)!important;
  color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important;box-shadow:none!important;
}
html .questionnaire-popup :is(.question-title,.answer-option,.answer-option.selected),
html .questionnaire-popup .questionnaire-content{color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important}
html .questionnaire-popup .introduction-count,
html .van-popup .galssPop :is(input,textarea)::placeholder {
  color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important;opacity:1!important;
}
html .questionnaire-popup .radio-indicator{border-color:var(--ta-subcopy)!important;background:var(--ta-surface)!important}
html .questionnaire-popup .answer-option.selected .radio-indicator{background:var(--ta-action)!important;border-color:var(--ta-action)!important;box-shadow:inset 0 0 0 3px var(--ta-surface)!important}
html #ta-promotion-agreement-modal article{background:var(--ta-surface)!important;color:var(--ta-copy)!important}
html #ta-promotion-agreement-modal :is(h2,h3){color:var(--ta-copy)!important}
html #ta-promotion-agreement-modal header p{color:var(--ta-subcopy)!important}
html #ta-promotion-agreement-modal :is(header,footer){border-color:var(--ta-edge)!important}

/* Small links/tags need more contrast than the original pastel swatches. */
html .page .el-link--info{--el-link-text-color:var(--ta-subcopy);--el-link-hover-text-color:var(--ta-link)}
html:not(.dark) .page .el-tag--danger{color:#a53636!important;background:#fff0f0!important;border-color:#e7b3b3!important}
html.dark .page .el-tag--danger{color:#ffb4b4!important;background:#512e35!important;border-color:#99616b!important}
html:not(.dark) .page .el-tag--danger *,html.dark .page .el-tag--danger *{color:inherit!important;-webkit-text-fill-color:inherit!important}

/* Catalogue/navigation labels are available controls, not disabled text. */
html .sideBar .opc6,
html .page .cate.gray,html .page .oneCate.opc6,
html[data-ta-route^="/courseMall/"] .page .flex.ac.opc6,
html[data-ta-route^="/phoneticCourse/"] .page .flex.ac.opc6,
html[data-ta-route^="/myCourse/"] .page .opc6,
html[data-ta-route^="/learnPlay/"] .page .size28.opc6.hand,
html[data-ta-route^="/noteBooks/"] .page .size-20.opc6,
html[data-ta-route^="/rank/"] .page .item.gray,
html .ta-plan-section p,html .ta-plan-price small {
  opacity:1!important;color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important;
}
html .ta-memberships>header small,html #talk-page-root .tips,
html #talk-page-root .tips .size-22{color:var(--ta-link)!important;-webkit-text-fill-color:var(--ta-link)!important}
html #talk-page-root .rel.size24.bold6{color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important}
html .page .cardtag{background:#3b4f58!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html:not(.dark) .page .el-button--danger.is-plain{background:#fff0f0!important;color:#a53636!important;border-color:#e7b3b3!important}
html.dark .page .el-button--danger.is-plain{background:#512e35!important;color:#ffb4b4!important;border-color:#99616b!important}
html .page .el-button--danger.is-plain *{color:inherit!important;-webkit-text-fill-color:inherit!important}
html .van-popup .red{color:var(--ta-danger)!important;-webkit-text-fill-color:var(--ta-danger)!important}
html[data-ta-route="/home/index"] body .homeStats>.flex.ac.size24>.mr50.hand.act{
  background:var(--ta-surface-soft)!important;color:var(--ta-copy)!important;-webkit-text-fill-color:var(--ta-copy)!important;
}
html .page .twoCate.opc6,html[data-ta-route^="/courseMall/"] .page .name.opc6{
  opacity:1!important;color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important;
}
html[data-ta-route^="/setting/"] .page :is(.mt40.mb20.opc6,.opc6.mb20.mt20){
  opacity:1!important;color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important;
}
html body .ta-account .ta-profile{background:var(--ta-action)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html .ta-plan-price,html .ta-plan-price>div{background:var(--ta-surface)!important;border-color:var(--ta-edge)!important}
html .ta-plan-price .featured{background:var(--ta-surface-soft)!important}
html .ta-plan-price b{color:var(--ta-copy)!important}
html .ta-plan-price strong{color:var(--ta-link)!important}
html .el-popover:has(.red[data-v-da9cfbe5]){background:var(--ta-surface)!important;color:var(--ta-copy)!important;border-color:var(--ta-edge)!important}
html .el-popover .red[data-v-da9cfbe5]{color:var(--ta-danger)!important;-webkit-text-fill-color:var(--ta-danger)!important}
html[data-ta-route^="/words/"] body .page .tr.gray.desc{color:var(--ta-subcopy)!important;-webkit-text-fill-color:var(--ta-subcopy)!important}
html .page .twoCate.cate.act{background:var(--ta-action)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
html .page .oneCate.linearTab,
html[data-ta-route^="/learnPlay/"] .page .size28.bold.mr46.act,
html[data-ta-route^="/myCourse/"] .page .size28.bold.mr46.act,
html[data-ta-route^="/setting/"] .page :is(.linearTab,.linearTabReverse){
  background:none!important;color:var(--ta-link)!important;-webkit-text-fill-color:var(--ta-link)!important;
}
