/* 사용자 화면 공통 기준: 본문 1200px, 모바일 바깥 여백 16px. */
html body #container_wr{width:calc(100% - 40px);max-width:1200px;padding:0;box-sizing:border-box;margin-left:auto;margin-right:auto}
html body .pz_bar_in,html body .pz_ft_in,html body .pz_secondary_shell{width:calc(100% - 40px);max-width:1200px;box-sizing:border-box;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
html body #container :is(.pzl-wrap,.pz2,.pzc,.pze,.plk,.pzv,.pz-payment,.pzo,.pzs,.wb,.pz_reading_page,#pzPolicies,#pzSettingsPage){width:100%;max-width:1200px;box-sizing:border-box;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
html body .pv-site main,html body .pv-header{width:calc(100% - 40px);max-width:1200px;box-sizing:border-box;margin-left:auto;margin-right:auto}
#container :is(p,li,dd){word-break:keep-all;overflow-wrap:anywhere;text-wrap:pretty;line-height:1.8}
html:not(.pzl-dark) #pzSettingsPage .pz_settings_hero small{color:#fff}
#pzSettingsPage .pz_settings_hero small{font-size:16px;letter-spacing:.06em}
@media(max-width:600px){
 html body #container_wr,html body .pz_bar_in,html body .pz_ft_in,html body .pz_secondary_shell,html body .pv-site main,html body .pv-header{width:calc(100% - 32px)}
 .poh_steps{grid-template-columns:1fr}
 .poh_demo_bottom{flex-wrap:wrap}
 .poh_bank,.poh_slots{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* 설명 글씨만 진하게: 성분별 학습 색상과 버튼/배너의 대비는 보존한다. */
html:not(.pzl-dark) #container :is(.poh_copy>p,.poh_points>span,.poh_demo>p,.poh_demo_top>small,.poh_demo_bottom>span,.poh_demo_bottom>button,.poh_section_head p,.poh_step>p,.poh_step_top>span,.poh_step_bottom>small,.poh_preview,.pz2_meta,.pz2_hint,.pzc_hero>p,.pze_hero>p,.pz_settings_sub,.pzo-card>p,.pz-payment-card>p){color:#222}
/* 설정의 보조문구 규칙보다 우선하는 어두운 배너 전용 색상. */
html:not(.pzl-dark) #pzSettingsPage .pz_settings_hero small{color:#fff!important}
/* small 기본값(0.83em)과 동적 학습 조각의 설명도 본문 최소 크기를 유지. */
#container small,#container .pzc label,#container .plk label,#container .pzk_status,#container #wbInstruction{font-size:16px!important;line-height:1.7}
html:not(.pzl-dark) #container #wbInstruction,html:not(.pzl-dark) #container .pzk_status{color:#222}
/* 다크 모드에서 설명과 입력 배경에 밝은 화면의 대체값이 섞이지 않게 한다. */
html.pzl-dark #pzSettingsPage,html.pzl-dark .pzo{--text:#e5eaf0;--card:#171b21;--paper:#1d2530;--line:#f5f5f5;color:#e5eaf0}
html.pzl-dark #pzSettingsPage :is(.pz_settings_sub,.pz_explain_list,.pz_pass_note p,#pzReferralStatus,#pzStudyState){color:#e5eaf0}
html.pzl-dark #pzSettingsPage .pz_study_checks label{background:#171b21;color:#e5eaf0}
html body{font-size:16px}
.pz_nav_primary a,.pz_secondary_shell a,.pz_ft_in,.poh_path>p{font-size:16px}
html:not(.pzl-dark){--dim:#222;--muted:#222}
html:not(.pzl-dark) #container :is(.pz2_stat,.pz2_rec,.pz2_msg,.pz2_repeat>p,.pz2_repeat>small){color:#222}

/* 모든 학습 영역은 공통 컨테이너의 1200px 기준선을 따릅니다. */
html body #container :is(.pzs_library,.pzs_check){width:100%;max-width:1200px;box-sizing:border-box;margin-left:auto;margin-right:auto}
html body #pz2Root>.pz2_toolbar:first-of-type,html body #pz2Root>.pz2_unified_toolbar{border-radius:18px 18px 0 0!important}
html body #pz2Root .pz2_main{border-radius:0 0 18px 18px!important}
html body #pz2Root .pz2_learning_notes{margin-top:24px;margin-bottom:24px;line-height:1.8}
html body #pz2Root .pz2_learning_notes p{margin-top:10px;margin-bottom:10px}
html body #container .pzs_check{margin-top:24px;margin-bottom:28px}

/* 학습 카드 공통 여백과 배색 */
html body #container .plk{margin-top:34px}
html:not(.pzl-dark) #container :is(.plk_intro,.pzs_selected,.pzs_full_audio,.pzs_options_unified,.pzc_viewer,.pzc_en,.pzc_audio,.pg-card,.pg-how,.pg-step){background:#f5f5f7}
html:not(.pzl-dark) #container :is(.pzs_selected,.pzs_full_audio){--reader-soft:#f5f5f7;color:#303238}
html:not(.pzl-dark) #container .pzs_selected :is(p,span){color:#4b5059}
html:not(.pzl-dark) #container .pg-guide :is(.pg-number,.pg-card>strong,.pg-how b,.pg-step-label,.pg-step-number,.pg-step-arrow){color:#303238}
html:not(.pzl-dark) #container .pg-guide .pg-step-number{background:#fff}
html:not(.pzl-dark) #container .pg-card p .pg-menu{background:transparent;color:inherit;padding:0}
html:not(.pzl-dark) #container .pg-menu-order{background:#fff0bb;color:#795a13}
@media(max-width:700px){html body #container .plk{margin-top:24px}}

/* 상황별 회화 구간 이동 버튼 */
#container .cafe-jumps a{border:1px solid #e0e0e0}
