[hidden] { display: none !important; }
.learning-page, .privacy-page { width: min(100% - 32px, 1040px); text-align: left; }
.learning-page > h1, .privacy-page > h1 { font-size: clamp(2rem, 5vw, 3rem); }
.privacy-page p { max-width: none; overflow-wrap: anywhere; }
.privacy-page a { text-decoration: underline; }
.credits p a { display: inline-block; min-height: 44px; line-height: 44px; }
.learning-content > h2 { color: #fff4cf; font-size: 1.5rem; }
.learning-content a { color: #f5d36f; }
.learning-content :is(button, select, a, .chart-scroll):focus-visible { outline: 3px solid #f5d36f; outline-offset: 3px; }
.learning-page .learning-note { max-width: none; margin: 16px 0; }
.learning-content { text-align: left; }
.learning-content .learning-eyebrow { display: block; margin: 0 0 10px; color: #e7c66d; font-size: .72rem; font-weight: 800; letter-spacing: .12em; }
.learning-content h1 { font-size: clamp(2rem, 5vw, 3.1rem); line-height: 1.12; margin-bottom: 14px; }
.learning-content .learning-lead { max-width: 580px; margin: 0 0 28px; font-size: 1.05rem; }
.lesson-grid { display: grid; gap: 10px; margin-bottom: 28px; }
.lesson-card, .glossary-card { padding: 18px; border: 1px solid #426451; border-radius: 12px; background: #103b29; }
.lesson-card summary { display: flex; align-items: center; gap: 14px; cursor: pointer; color: #fff4cf; font-size: 1.06rem; font-weight: 700; }
.lesson-card summary::after { content: '+'; margin-left: auto; color: #e7c66d; font-size: 1.4rem; }
.lesson-card[open] summary::after { content: '−'; }
.lesson-number { color: #e7c66d; font-size: .8rem; }
.learning-content .lesson-card p { margin: 15px 0 0; max-width: none; }
.learning-content .lesson-tip { padding: 12px; border-left: 3px solid #e7c66d; background: #184932; color: #fff4cf; font-size: .9rem; }
.learning-quiz { border: 1px solid #a48d52; border-radius: 16px; padding: clamp(18px, 4vw, 28px); background: radial-gradient(ellipse at top, #285c3d, #0b2c20); }
.learning-quiz h2 { margin: 0 0 12px; color: #fff4cf; font-size: 1.6rem; }
.learning-content .quiz-rules { margin: 0 0 16px; font-size: .88rem; }
.learning-content .quiz-progress { margin: 0 0 18px; color: #e7c66d; font-size: .85rem; }
.quiz-table { display: grid; grid-template-columns: 1.4fr 1fr; align-items: center; gap: 12px; margin-bottom: 22px; }
.quiz-table > div { padding: 20px 12px; background: #09281c; border-radius: 10px; text-align: center; }
.quiz-table .quiz-hand { display: block; margin-bottom: 9px; color: #fff8e5; font-size: clamp(1.7rem, 6vw, 2.5rem); }
.quiz-table > h3 { grid-column: 1 / -1; line-height: 1.5; color: #fff4cf; }
.quiz-choices, .glossary-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.learning-content .learning-button { min-height: 44px; padding: 10px 16px; margin: 0; border: 1px solid #80987b; border-radius: 8px; background: #183e2c; color: #fff4cf; font: inherit; font-weight: 700; cursor: pointer; }
.learning-content .learning-button:hover:not(:disabled), .learning-content .learning-button[aria-pressed='true'] { background: #e7c66d; border-color: #e7c66d; color: #173d2d; }
.learning-content .learning-button:disabled { opacity: .65; cursor: default; }
.learning-content :is(button, summary, input):focus-visible { outline: 3px solid #f5d36f; outline-offset: 4px; }
.learning-content .quiz-feedback { margin: 18px 0; min-height: 1.4em; }
.quiz-feedback[data-correct='true'] { color: #c2f1c4; }
.quiz-feedback[data-correct='false'] { color: #fff4cf; }
.glossary-label { display: block; margin-bottom: 8px; font-weight: 700; color: #fff4cf; }
.glossary-search { box-sizing: border-box; width: 100%; padding: 14px; margin-bottom: 15px; border: 1px solid #81967b; border-radius: 9px; background: #09281c; color: #fff; font: inherit; min-height: 48px; }
.glossary-search::placeholder { color: #b8cec0; }
.learning-content .glossary-count { margin: 18px 0; font-size: .85rem; }
.glossary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.glossary-card h2 { margin: 0 0 10px; color: #fff4cf; font-size: 1.16rem; }
.learning-content .glossary-card p { margin: 0; font-size: .92rem; }
.glossary-empty { grid-column: 1 / -1; }
@media (max-width: 520px) { .glossary-grid { grid-template-columns: 1fr; } .quiz-choices .learning-button { flex: 1 1 28%; } .lesson-card { padding: 15px; } }
.learning-toolbar, .chart-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 20px 0; }
.learning-toolbar label { color: #fff4cf; font-weight: 700; }
.learning-toolbar select { padding: 10px; border: 1px solid #80987b; border-radius: 8px; background: #09281c; color: #fff4cf; font: inherit; min-height: 44px; }
.learning-content .learning-note { max-width: none; margin: 16px 0; padding: 14px; background: #184932; border-left: 3px solid #e7c66d; font-size: .9rem; }
.learning-card { margin: 20px 0; padding: 20px; border: 1px solid #426451; border-radius: 12px; background: #103b29; }
.chart-scroll { overflow-x: auto; margin: 18px 0; border: 1px solid #426451; border-radius: 10px; }
.strategy-table { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .86rem; }
.strategy-table th, .strategy-table td { padding: 5px; border: 1px solid #426451; text-align: center; }
.strategy-table th { color: #fff4cf; background: #09281c; font-weight: 700; padding: 10px 5px; }
.strategy-table th:first-child { min-width: 78px; }
.chart-action { width: 100%; min-height: 36px; border: 1px solid transparent; border-radius: 5px; font: inherit; font-weight: 800; cursor: pointer; padding: 5px; color: #13251b; background: #dae8df; }
.chart-action[data-action='hit'], .chart-action.hit { background: #bce4ca; }
.chart-action[data-action='stand'], .chart-action.stand { background: #f1cccc; }
.chart-action[data-action='double'], .chart-action.double { background: #eed786; }
.chart-action[data-action='split'], .chart-action.split { background: #bcd6ed; }
.chart-action[data-action='surrender'], .chart-action.surrender { background: #dac8ed; }
.chart-action[aria-pressed='true'] { outline: 3px solid #fff; outline-offset: -3px; }
.chart-action:hover { filter: brightness(1.12); }
.chart-legend > span { padding: 6px 9px; border: 1px solid #426451; border-radius: 6px; color: #fff4cf; font-size: .8rem; }
@media (max-width: 780px) {
    .account-bar { gap: 8px; padding: 4px 8px; }
    .account-actions button { min-height: 44px; }
    .account-actions { margin-left: auto; }
    .account-nav { display: flex; flex-wrap: wrap; flex: 1; min-width: 0; margin: 0; gap: 0; }
    .account-nav :is(button, a) { display: flex; align-items: center; justify-content: center; gap: 4px; box-sizing: border-box; flex: 1 0 auto; min-height: 44px; padding: 6px; font-size: .8rem; }
    .learning-page { padding: 22px 16px; }
}
@media (max-width: 360px) {
    .account-nav :is(button, a) { padding-inline: 4px; font-size: .75rem; }
}
@media (max-width: 560px) {
    .account-bar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 4px; }
    .account-nav { display: contents; }
    .account-bar .account-actions { justify-content: center; flex-wrap: wrap; min-width: 0; margin: 0; gap: 2px; }
    .account-bar .account-name { max-width: 100%; }
}

.topic-view { margin: 20px 0; }
.topic-index, .related-topics { margin: 28px 0 20px; padding: 20px; border: 1px solid #426451; border-radius: 12px; background: #103b29; }
:is(.topic-index, .related-topics) h2 { margin: 0 0 16px; color: #fff4cf; font-size: 1.3rem; }
:is(.topic-index, .related-topics) ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.topic-index summary { display: flex; align-items: center; box-sizing: border-box; min-height: 44px; gap: 12px; color: #fff4cf; cursor: pointer; }
.topic-index summary::after { content: '+'; margin-left: auto; color: #e7c66d; }
.topic-index details[open] summary { margin-bottom: 16px; }
.topic-index details[open] summary::after { content: '−'; }
.topic-index summary:is(:hover, :focus-visible) { color: #e7c66d; }
.topic-link, .topic-link:visited, .learning-content .topic-link, .learning-content .topic-link:visited {
    display: inline-flex; align-items: center; box-sizing: border-box; min-height: 44px; max-width: 100%; padding: 10px 14px;
    border: 1px solid #426451; border-radius: 10px; background: #09281c; color: #fff4cf; text-decoration: none; overflow-wrap: anywhere;
}
:is(.topic-index, .related-topics) .topic-link { display: flex; }
.lesson-card > .topic-link, .glossary-card > .topic-link { margin-top: 14px; }
.topic-link:is(:hover, :focus-visible), .learning-content .topic-link:is(:hover, :focus-visible) { color: #e7c66d; border-color: #e7c66d; }
.topic-link:focus-visible, .learning-content .topic-link:focus-visible, .topic-index summary:focus-visible { outline: 3px solid #e7c66d; outline-offset: 3px; }
.ad-placement { box-sizing: border-box; margin: 160px auto 40px; width: 100%; min-height: 320px; text-align: center; }
.ad-placement p { margin: 0 0 12px; font-size: .75rem; line-height: 20px; color: #b8cec0; }
.ad-placement ins { display: block; height: 280px; min-height: 280px; text-decoration: none; }
#reviewPage .ad-placement p { color: #52625a; }
.ad-placement[data-placement='learning-incontent'], .ad-placement[data-placement='review-summary'] { margin-bottom: 160px; }
.glossary-grid > .ad-placement { grid-column: 1 / -1; }
#gamePage > .ad-placement { display: block; clear: both; margin-bottom: 160px; }
.ad-placement[data-suppressed] { visibility: hidden; }

.breadcrumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; margin: 0 0 12px; padding: 0; list-style: none; color: #fff4cf; }
.breadcrumbs li { display: flex; align-items: center; gap: 10px; min-height: 44px; min-width: 0; overflow-wrap: anywhere; }
.breadcrumbs li + li::before { content: '›'; color: #e7c66d; }
.breadcrumbs a, .breadcrumbs a:visited { display: inline-flex; align-items: center; min-height: 44px; color: #e7c66d; text-underline-offset: 3px; }
.in-text-link, .in-text-link:visited, .learning-content .in-text-link, .learning-content .in-text-link:visited { color: #e7c66d; text-decoration: underline; text-underline-offset: 3px; }
.breadcrumbs a:focus-visible, .in-text-link:focus-visible, .learning-content .in-text-link:focus-visible { outline: 3px solid #e7c66d; outline-offset: 3px; }
