.candy-topic-index { max-width: 1280px; margin: 58px auto 0; padding: 0 32px; }
.candy-topic-index h2 { font-size: 24px; line-height: 1.35; margin-bottom: 18px; }
.candy-topic-index nav { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 24px; border-top: 1px solid #302832; }
.candy-topic-index a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 0; border-bottom: 1px solid #302832; font-size: 14px; }
.candy-topic-index a:hover { color: var(--candy-pink); }
.candy-topic-index .candy-icon { width: 13px; height: 13px; opacity: .6; }
.candy-home-topic-links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.candy-home-topic-links a { font-size: 14px; line-height: 1.8; }
.candy-reading-frame { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 44px; max-width: 1280px; margin: 0 auto; padding: 32px 32px 0; }
.candy-reading-frame--wide { display: block; max-width: 1100px; }
.candy-article { min-width: 0; overflow-wrap: break-word; }
.candy-article-header { margin-bottom: 32px; }
.candy-breadcrumb { margin-bottom: 24px; color: #a99fab; font-size: 12px; line-height: 1.7; }
.candy-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 5px 10px; list-style: none; padding: 0; margin: 0; }
.candy-breadcrumb li { min-width: 0; }
.candy-breadcrumb li + li::before { content: '/'; padding-right: 10px; color: #776b7a; }
.candy-breadcrumb a:hover { color: #f35b85; }
.candy-breadcrumb [aria-current] { color: #c3b8c6; }
.candy-article h1 { font-size: 36px; font-weight: 600; line-height: 1.2; margin: 0 0 20px; text-wrap: balance; }
.candy-article-intro { font-size: 17px; line-height: 1.8; color: #c6bdc9; max-width: 800px; }
.candy-article-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 15px 24px; margin-top: 24px; }
.candy-article-actions:empty { display: none; }
.candy-text-link { display: inline-flex; align-items: center; color: #ee8eaa; text-decoration: underline; text-underline-offset: 4px; font-size: 14px; }
.candy-text-link:hover { color: #fff; }
.candy-article-section, .candy-article-questions, .candy-article-related { margin-top: 36px; padding-top: 28px; border-top: 1px solid #2f2732; }
.candy-article h2 { font-size: 24px; line-height: 1.4; font-weight: 600; margin-bottom: 20px; text-wrap: balance; }
.candy-article-section p, .candy-answer > div p { color: #bcb3bf; font-size: 15px; line-height: 1.85; margin-top: 16px; }
.candy-article-section p:first-child { margin-top: 0; }
.candy-article-section ul, .candy-article-section ol { padding-left: 25px; color: #c7beca; font-size: 15px; line-height: 1.85; }
.candy-article-section li { padding-left: 5px; margin-block: 10px; }
.candy-task-steps li::marker { color: #f18aa7; font-weight: 600; }
.candy-topic-points li::marker { color: #dd819c; }
.candy-comparison-scroll { overflow-x: auto; width: 100%; margin: 20px 0; scrollbar-width: thin; }
.candy-comparison-scroll table { width: 100%; min-width: 500px; border-collapse: collapse; text-align: left; font-size: 14px; line-height: 1.65; }
.candy-comparison-scroll caption { text-align: left; font-size: 12px; color: #a99caa; margin-bottom: 14px; }
.candy-comparison-scroll th, .candy-comparison-scroll td { padding: 15px 14px; vertical-align: top; border-bottom: 1px solid #352a37; }
.candy-comparison-scroll th { font-weight: 500; color: #f4edf6; }
.candy-comparison-scroll thead { background: #231c26; }
.candy-comparison-scroll tbody th { width: 25%; color: #ddb9c7; }
.candy-comparison-scroll td { color: #beb3c2; }
.candy-topic-visual { display: grid; grid-template-columns: repeat(3, minmax(0, 150px)); gap: 12px; margin: 30px 0 34px; max-width: 100%; }
.candy-topic-visual img { width: 100%; aspect-ratio: 3 / 5; border-radius: 8px; object-fit: cover; object-position: center top; background: #1c1720; }
.candy-topic-visual--app { grid-template-columns: repeat(2, minmax(0, 335px)); }
.candy-topic-visual--app img { height: auto; aspect-ratio: auto; object-fit: contain; border-radius: 8px; }
.candy-reading-navigation { align-self: start; position: sticky; top: 94px; padding: 9px 0 0 18px; border-left: 1px solid #372b3c; }
.candy-reading-navigation h2 { color: #b4a4b8; font-size: 12px; font-weight: 500; line-height: 1.5; margin: 0 0 13px; }
.candy-reading-navigation nav { display: flex; flex-direction: column; gap: 16px; }
.candy-reading-navigation a { color: #b2a4b7; font-size: 12px; line-height: 1.7; }
.candy-reading-navigation a:hover { color: #f2a5bb; }
.candy-answer { border-top: 1px solid #342b37; }
.candy-answer:last-child { border-bottom: 1px solid #342b37; }
.candy-answer summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 0; color: #f2eaf5; font-size: 15px; font-weight: 500; line-height: 1.7; cursor: pointer; list-style: none; }
.candy-answer summary::-webkit-details-marker { display: none; }
.candy-answer summary .candy-icon { width: 12px; height: 12px; transition: transform .15s; }
.candy-answer[open] summary .candy-icon { transform: rotate(180deg); }
.candy-answer > div { padding-bottom: 21px; }
.candy-answer > div p { margin-top: 0; }
.candy-answer-link { display: inline-flex; align-items: center; gap: 8px; color: #ec92ad; font-size: 13px; line-height: 1.65; margin-top: 16px; }
.candy-answer-link .candy-icon { width: 11px; height: 11px; }
.candy-answer-link:hover { color: #fff; }
.candy-related-topics, .candy-topic-directory { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 25px; }
.candy-related-topics li, .candy-topic-directory li { min-width: 0; border-bottom: 1px solid #302633; }
.candy-related-topics a, .candy-topic-directory a { display: flex; align-items: center; justify-content: space-between; height: 100%; gap: 14px; padding: 15px 0; font-size: 14px; line-height: 1.7; color: #d3bed8; }
.candy-related-topics a:hover, .candy-topic-directory a:hover { color: #f8a8c2; }
.candy-related-topics a > span, .candy-topic-directory a > span { font-size: 22px; flex-shrink: 0; font-weight: 400; color: #ab7792; }
.candy-question-finder { display: flex; gap: 12px; margin-top: 30px; }
.candy-question-search { display: flex; align-items: center; gap: 10px; border: 1px solid #4a384f; border-radius: 7px; background: #211a25; min-width: 0; flex: 1; padding: 8px 12px; height: 46px; }
.candy-question-search input { background: transparent; border: 0; outline: none; color: #f3e8f5; width: 100%; min-width: 0; font-size: 14px; }
.candy-question-search input::placeholder { color: #aa9fb1; }
.candy-question-search input::-webkit-search-cancel-button { display: none; }
.candy-question-search .candy-tool { width: 26px; height: 26px; }
.candy-question-search .candy-tool .candy-icon { width: 13px; height: 13px; }
.candy-question-finder select { min-width: 0; width: 220px; padding: 9px 32px 9px 12px; border: 1px solid #4a384f; border-radius: 7px; background: #211a25; color: #e7dce9; font-size: 14px; }
.candy-question-count { margin-top: 14px; color: #aa9aaf; font-size: 12px; }
.candy-question-empty { color: #bcadbF; padding-block: 35px; font-size: 15px; }
.candy-question-group { margin-top: 45px; }
.candy-question-group > h2 { padding-bottom: 16px; border-bottom: 1px solid #4c354d; color: #ee94af; }
.candy-question-topic { margin-top: 28px; }
.candy-question-topic > h3 { font-size: 17px; line-height: 1.7; font-weight: 500; color: #d0bbd6; margin: 0 0 12px; }
.candy-question-topic > h3 a:hover { color: #f2a8c2; }
.candy-resource-page .candy-footer { margin-top: 65px; }

@media (max-width: 1199px) { .candy-reading-frame { display: block; max-width: 980px; }.candy-reading-navigation { display: none; } }
@media (max-width: 767px) {
  .candy-topic-index { padding-inline: 15px; margin-top: 32px; }
  .candy-topic-index h2 { font-size: 20px; }
  .candy-topic-index nav { grid-template-columns: 1fr 1fr; gap: 0 16px; }
  .candy-topic-index a { font-size: 13px; padding-block: 14px; }
  .candy-reading-frame { padding: 23px 17px 0; }
  .candy-article-header { margin-bottom: 24px; }
  .candy-breadcrumb { margin-bottom: 20px; }
  .candy-breadcrumb ol { gap: 4px 7px; }
  .candy-breadcrumb li + li::before { padding-right: 7px; }
  .candy-article h1 { font-size: 28px; line-height: 1.25; margin-bottom: 17px; }
  .candy-article-intro { font-size: 15px; line-height: 1.8; }
  .candy-article-actions { margin-top: 22px; gap: 14px 20px; }
  .candy-article-actions .candy-action { font-size: 13px; }
  .candy-article h2 { font-size: 21px; line-height: 1.4; margin-bottom: 17px; }
  .candy-article-section, .candy-article-questions, .candy-article-related { margin-top: 28px; padding-top: 23px; }
  .candy-article-section p, .candy-answer > div p { font-size: 14px; line-height: 1.85; }
  .candy-article-section ul, .candy-article-section ol { font-size: 14px; line-height: 1.85; padding-left: 22px; }
  .candy-topic-visual { gap: 8px; margin-block: 24px; }
  .candy-topic-visual--app { grid-template-columns: 1fr; justify-items: start; gap: 14px; }
  .candy-topic-visual--app img { max-width: 335px; }
  .candy-comparison-scroll th, .candy-comparison-scroll td { padding: 12px 10px; }
  .candy-answer summary { font-size: 14px; padding-block: 16px; }
  .candy-related-topics, .candy-topic-directory { grid-template-columns: 1fr; }
  .candy-question-finder { flex-direction: column; gap: 10px; }
  .candy-question-search { flex-basis: 46px; flex-shrink: 0; }
  .candy-question-finder select { width: 100%; height: 44px; }
  .candy-question-group { margin-top: 35px; }
  .candy-question-topic > h3 { font-size: 16px; }
  .candy-resource-page .candy-footer { margin-top: 42px; }
}
@media (max-width: 359px) { .candy-article h1 { font-size: 26px; }.candy-reading-frame { padding-inline: 14px; } }
/* Searchable covers are a library, not links to unavailable playback pages. */
.candy-series-library { margin-top: 36px; scroll-margin-top: 90px; }
.candy-series-search { display: grid; gap: 8px; max-width: 440px; margin: 20px 0 12px; }
.candy-series-search label { font-size: 14px; font-weight: 600; }
.candy-series-search input { width: 100%; min-height: 44px; padding: 10px 14px; border: 1px solid #6c5260; border-radius: 8px; background: #211b20; color: #fff; font: inherit; }
.candy-series-count, .candy-series-empty { font-size: 14px; color: #c6b8c2; }
.candy-series-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr)); gap: 20px 14px; }
.candy-series-item { min-width: 0; margin: 0; scroll-margin-top: 90px; }
.candy-series-item[hidden] { display: none; }
.candy-series-item > img { width: 100%; aspect-ratio: 3 / 5; object-fit: cover; border-radius: 8px; }
.candy-series-item > h3 { margin: 10px 0 0; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
article.media-card:hover { transform: none; }
