/* Light study shell. Colors mirror shared/tokens/tokens.json; spacing uses its approved subset. */
.cp-study-shell {
  --cp-study-bg:#F7F8FA; --cp-study-panel:#FFFFFF; --cp-study-raised:#EEF1F6;
  --cp-study-text:#1A2130; --cp-study-muted:#5B6472; --cp-study-accent:#0369A1; --cp-study-border:#DFE3EA;
  margin:0; background:var(--cp-study-bg)!important; color:var(--cp-study-text)!important;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important; font-size:1.125rem; line-height:1.5;
}
.cp-study, .cpeh-hub { color:#1A2130; font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-size:1.125rem; line-height:1.5; }
.cp-study *, .cpeh-hub * { box-sizing:border-box; }
.cp-study [hidden], .cpeh-hub [hidden] { display:none!important; }
.cp-study a, .cpeh-hub a { color:#0369A1; text-underline-offset:4px; }
.cp-study a:focus-visible, .cp-study button:focus-visible, .cp-study input:focus-visible, .cp-study select:focus-visible,
.cpeh-hub a:focus-visible, .cpeh-hub button:focus-visible, .cpeh-hub input:focus-visible, .cpeh-hub select:focus-visible { outline:3px solid #0369A1!important; outline-offset:4px; }
.cp-study :where(h1,h2,h3,h4,p,ul,ol), .cpeh-hub :where(h1,h2,h3,p) { margin-top:0; }
.cp-study h1, .cpeh-hub h1 { color:#1A2130; font-size:2rem; line-height:1.2; font-weight:600; margin:0 0 16px; overflow-wrap:anywhere; }
.cp-study h2, .cp-study h3, .cpeh-hub h2, .cpeh-hub h3 { color:#1A2130; font-size:1.25rem; font-weight:600; line-height:1.2; margin:0 0 16px; overflow-wrap:anywhere; }
.cp-study p, .cpeh-hub p { margin-bottom:16px; }
.cp-study-container { width:100%; max-width:1184px; padding:0 32px; margin:0 auto; }
.cp-study-header { border-bottom:1px solid #DFE3EA; background:#FFFFFF; }
.cp-study-header-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:16px; padding-top:16px; padding-bottom:16px; }
.cp-study-brand { display:inline-flex; align-items:center; gap:8px; color:#1A2130!important; font-size:1.25rem; font-weight:600; text-decoration:none; min-height:48px; }
.cp-study-brand-symbol { width:32px; height:32px; display:grid; place-items:center; background:#0369A1; color:#FFFFFF; border-radius:8px; font-size:1.25rem; }
.cp-study-nav { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.cp-study-nav a { min-height:48px; padding:8px; display:inline-flex; align-items:center; color:#5B6472; font-size:.875rem; font-weight:600; text-decoration:none; border-radius:8px; }
.cp-study-nav a:hover { background:#EEF1F6; color:#1A2130; }
.cp-study-main { padding-top:32px; padding-bottom:48px; min-height:65vh; }
.cp-study-skip { position:absolute; left:16px; top:8px; z-index:10000; transform:translateY(-160%); padding:16px; border-radius:8px; background:#FFFFFF; color:#0369A1; }
.cp-study-skip:focus { transform:none; }
.cp-study-home-hero { max-width:760px; padding:16px 0 48px; }
.cp-study-home-hero h1 { max-width:23ch; }
.cp-study-home-hero > p:not(.cpeh-vendor) { max-width:620px; color:#5B6472; }
.cpeh-page-heading { margin-bottom:32px; max-width:840px; }
.cpeh-page-heading > p:not(.cpeh-vendor) { color:#5B6472; }
.cpeh-vendor { margin:0 0 8px!important; font-size:.875rem; font-weight:600; color:#5B6472; }
.cpeh-meta { color:#5B6472; font-size:.875rem; line-height:1.5; }
.cpeh-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:8px 16px; border:1px solid #0369A1; border-radius:8px; background:#0369A1; color:#FFFFFF!important; font:inherit; font-size:.875rem; font-weight:600; text-decoration:none!important; cursor:pointer; text-align:center; }
.cpeh-button:hover { background:#075985; border-color:#075985; color:#FFFFFF; }
.cpeh-button-secondary { background:#FFFFFF; border-color:#DFE3EA; color:#1A2130!important; }
.cpeh-button-secondary:hover { background:#EEF1F6; border-color:#5B6472; color:#1A2130; }
.cpeh-directory { margin-bottom:48px; }
.cpeh-section-heading { margin-bottom:24px; }
.cpeh-section-heading h2 { margin-bottom:8px; }
.cpeh-filters { display:flex; flex-wrap:wrap; align-items:flex-end; gap:16px; padding:24px; margin:0 0 16px; background:#EEF1F6; border:1px solid #DFE3EA; border-radius:16px; }
.cpeh-filters label { display:flex; flex-direction:column; gap:8px; flex:1 1 240px; min-width:0; color:#1A2130; font-size:.875rem; font-weight:600; }
.cpeh-filters label:nth-of-type(2) { flex:0 1 240px; }
.cpeh-filters input, .cpeh-filters select { min-height:48px; padding:8px 16px; width:100%; max-width:100%; border:1px solid #5B6472; border-radius:8px; background:#FFFFFF; color:#1A2130; font-family:inherit; font-size:1.125rem; font-weight:400; }
.cpeh-clear { min-height:48px; display:inline-flex; align-items:center; font-size:.875rem; }
.cpeh-filter-summary { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; margin-bottom:24px; }
.cpeh-filter-summary p { margin:0; }
.cpeh-count { color:#5B6472; font-size:.875rem; }
.cpeh-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:24px; }
.cpeh-card { min-width:0; padding:24px; background:#FFFFFF; border:1px solid #DFE3EA; border-radius:16px; display:flex; flex-direction:column; align-items:flex-start; }
.cpeh-card h2, .cpeh-card h3 { margin-bottom:16px; }
.cpeh-card > p:last-of-type { margin-bottom:24px; }
.cpeh-card > a:last-child { margin-top:auto; }
.cpeh-resource-link { display:inline-flex; align-items:center; gap:8px; min-height:48px; font-size:.875rem; font-weight:600; text-decoration:none; }
.cpeh-resource-link:hover { text-decoration:underline; }
.cpeh-breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:24px; color:#5B6472; font-size:.875rem; }
.cpeh-breadcrumb a { min-height:48px; display:inline-flex; align-items:center; }
.cpeh-choice-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:32px; }
.cpeh-choice { display:flex; flex-direction:column; gap:8px; padding:16px; border:1px solid #DFE3EA; border-radius:12px; background:#FFFFFF; color:#1A2130!important; text-decoration:none; min-height:96px; }
.cpeh-choice strong { font-size:1.25rem; font-weight:600; }
.cpeh-choice span { color:#5B6472; font-size:.875rem; }
.cpeh-choice:hover, .cpeh-choice.is-active { border-color:#0369A1; background:#EEF1F6; }
.cpeh-choice.is-active strong { color:#0369A1; }
.cpeh-resource-section { margin-bottom:32px; }
.cpeh-resource-section > p { color:#5B6472; }
.cpeh-notice, .cpeh-empty { padding:24px; background:#EEF1F6; border:1px solid #DFE3EA; border-radius:12px; }
.cpeh-empty { margin-top:24px; }
.cpeh-empty p { margin-bottom:0; }
.cpeh-apps { padding:32px; border:1px solid #DFE3EA; border-radius:16px; background:#FFFFFF; margin-top:48px; }
.cpeh-apps h2 { margin-bottom:8px; }
.cpeh-apps > p { color:#5B6472; }
.cpeh-apps > p:last-child { margin:16px 0 0; }
.cpeh-stores { display:flex; flex-wrap:wrap; gap:16px; }
.cp-study-content { max-width:840px; margin:0 auto; color:#1A2130; }
.cp-study-content > :not(.cpq-app):not(style):not(script) { max-width:620px; margin-left:auto; margin-right:auto; }
.cp-study-content :where(img,video,iframe) { max-width:100%; }
.cp-study-content img { height:auto; }
.cp-study-content table { width:100%; display:block; overflow:auto; border-collapse:collapse; }
.cp-study-content :where(th,td) { padding:8px; border:1px solid #DFE3EA; text-align:left; }
.cp-study-content pre { overflow:auto; padding:16px; background:#EEF1F6; border-radius:8px; }
.cp-study-content p, .cp-study-content li { overflow-wrap:anywhere; }
.cp-study-footer { border-top:1px solid #DFE3EA; background:#FFFFFF; }
.cp-study-footer-inner { padding-top:24px; padding-bottom:24px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.cp-study-footer p { font-size:.875rem; color:#5B6472; margin:0; }
.cp-study-footer nav { display:flex; flex-wrap:wrap; gap:16px; }
.cp-study-footer a { display:inline-flex; min-height:48px; align-items:center; font-size:.875rem; }
.cp-study-pagination { margin-top:32px; }
.cp-study-pagination :where(a,span) { display:inline-flex; min-width:48px; min-height:48px; padding:8px; align-items:center; justify-content:center; }
.cpeh-visually-hidden { position:absolute!important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(min-width:760px) { .cpeh-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1120px) { .cpeh-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .cpeh-bank-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:759px) { .cp-study-container { padding-left:16px; padding-right:16px; } .cp-study-header-inner { gap:8px; } .cp-study-nav { width:100%; gap:4px; } .cp-study-nav a { padding:8px; } .cp-study-main { padding-top:24px; } .cp-study-home-hero { padding-top:8px; padding-bottom:32px; } .cpeh-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .cpeh-filters, .cpeh-card { padding:16px; } .cpeh-filters label, .cpeh-filters label:nth-of-type(2) { flex:1 1 100%; } .cpeh-apps { padding:24px; } }
@media(max-width:359px) { .cpeh-choice-grid { grid-template-columns:1fr; } .cpeh-stores { display:grid; } .cpeh-stores a { width:100%; } }
@media(prefers-reduced-motion:reduce) { .cp-study *, .cpeh-hub * { scroll-behavior:auto!important; transition:none!important; } }

.cpeh-bank-selector { display:flex; flex-wrap:wrap; gap:16px; align-items:flex-end; margin:24px 0; padding:16px; border:1px solid #DFE3EA; border-radius:12px; background:#EEF1F6; }
.cpeh-bank-selector label { display:grid; gap:8px; min-width:0; flex:1 1 240px; color:#1A2130; font-size:.875rem; font-weight:600; }
.cpeh-bank-selector select { min-height:48px; width:100%; min-width:0; max-width:100%; padding:8px 16px; border:1px solid #5B6472; border-radius:8px; background:#FFFFFF; color:#1A2130; font-size:1.125rem; font-family:inherit; }
/* Writer-owned legacy lesson components within the new reading template. */
.cp-study-content .certpunch-taketest, .cp-study-content .certpunch-explanations details { background:#FFFFFF!important; color:#1A2130!important; border:1px solid #DFE3EA!important; border-radius:12px!important; padding:16px!important; margin:0 0 16px!important; }
.cp-study-content .certpunch-taketest a { color:#0369A1!important; font-weight:600!important; }
.cp-study-content .certpunch-explanations summary { min-height:48px; font-size:1.125rem; font-weight:600; cursor:pointer; }
.cp-study-content .certpunch-explanations { margin:24px 0!important; }
.cp-study-content .certpunch-video { margin:24px 0!important; border-radius:12px!important; }