/* PUZLANG 표현사전 v32.1 - 그룹 탐색 / 인라인 상세 */
.pze{
  --ink:#15203a;--dim:#718096;--line:#f5f5f5;--card:#fff;--paper:#f7f9fc;
  --accent:#303238;--accent-dark:#303238;--navy:#15285f;--soft:#e5e5e7;
  max-width:1200px;margin:32px auto 56px;color:var(--ink)
}
.pze *{box-sizing:border-box}.pze button,.pze a{font:inherit}
.pze_hero{padding:28px 30px;border-radius:22px;background:linear-gradient(135deg,#15285f,#213f7d);color:#fff;box-shadow:0 16px 42px rgba(21,32,58,.08)}
.pze_eyebrow{display:block;margin-bottom:8px;font-size:16px;font-weight:900;letter-spacing:.09em;opacity:.72}
.pze_hero h2{margin:0 0 8px;font-size:29px;line-height:1.4;letter-spacing:-.035em}
.pze_hero p{margin:0;max-width:900px;font-size:16px;line-height:1.75;opacity:.88}

.pze_active_head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin:24px 2px 14px}
.pze_active_group{display:block;margin-bottom:4px;color:var(--accent-dark);font-size:16px;font-weight:900}
.pze_active_head h3{margin:0 0 5px;font-size:25px;letter-spacing:-.02em}
.pze_active_head p{margin:0;color:var(--dim);font-size:16px}.pze_active_head p b{color:var(--ink)}
.pze_current_range{flex:none;padding:8px 12px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--dim);font-size:16px;font-weight:900}

/* 왼쪽 콘텐츠 + 오른쪽 범위 레일 */
.pze_browser{display:grid;grid-template-columns:minmax(0,1fr) 126px;gap:16px;align-items:start}
.pze_results{min-width:0;padding:18px;border:1px solid var(--line);border-radius:22px;background:var(--paper);box-shadow:0 10px 30px rgba(21,32,58,.05)}
.pze_results_head{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:13px;padding:0 2px}
.pze_results_head strong{font-size:18px;letter-spacing:-.02em}.pze_results_head span{color:var(--dim);font-size:16px;text-align:right}

.pze_list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}
.pze_item_wrap{min-width:0;border:1px solid var(--line);border-radius:15px;background:var(--card);overflow:hidden;transition:border-color .14s,box-shadow .14s,background .14s}
.pze_item_wrap:hover{border-color:#f5f5f5}.pze_item_wrap.on{border-color:#f5f5f5;background:#f5f5f7;box-shadow:0 8px 24px rgba(16,185,129,.10)}
.pze_item{display:grid;grid-template-columns:38px minmax(0,.95fr) minmax(0,1.15fr) 24px;align-items:center;gap:9px;width:100%;min-height:66px;padding:10px 11px;border:0;background:transparent;color:var(--ink);text-align:left;cursor:pointer}
.pze_item:focus-visible{outline:3px solid rgba(16,185,129,.28);outline-offset:-3px}
.pze_item .no{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;background:#eef2f7;color:#68758a;font-size:16px;font-weight:900}
.pze_item .ko{min-width:0;font-size:16px;font-weight:850;line-height:1.42;word-break:keep-all}
.pze_item .en{min-width:0;font-size:16px;font-weight:850;line-height:1.42;color:#303238;overflow-wrap:anywhere}
.pze_item .open_mark{justify-self:end;display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#f0f4f8;color:#718096;font-size:17px;font-weight:700;line-height:1}
.pze_item_wrap.on .open_mark{background:#f5f5f7;color:#303238}

/* 선택한 행 바로 아래 펼쳐지는 상세 */
.pze_inline_detail{padding:0 13px 13px;border-top:1px solid #f5f5f5;animation:pzeOpen .14s ease-out}
@keyframes pzeOpen{from{opacity:.5;transform:translateY(-4px)}to{opacity:1;transform:none}}
.pze_inline_top{position:relative;padding-top:13px}.pze_inline_pair{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px;padding:14px;border-radius:13px;background:#fff;border:1px solid var(--line)}
.pze_inline_pair small{display:block;margin-bottom:5px;color:var(--dim);font-size:16px;font-weight:800}
.pze_inline_pair strong{display:block;font-size:21px;line-height:1.35;letter-spacing:-.025em;word-break:keep-all}
.pze_inline_en strong{color:#303238}.pze_inline_arrow{color:#a5afbd;font-size:19px;font-weight:900}
.pze_inline_counter{position:absolute;right:9px;top:7px;padding:3px 7px;border-radius:999px;background:#f3f6f9;color:#8290a4;font-size:16px;font-weight:800;transform:translateY(-50%)}
.pze_inline_audio{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:9px;padding:10px 11px;border:1px solid #f5f5f5;border-radius:12px;background:#f5f5f7}
.pze_inline_audio>strong{margin-right:2px;color:#303238;font-size:16px}.pze_audio_btn{min-height:38px;padding:7px 10px;border:1px solid #f5f5f5;border-radius:10px;background:#fff;color:#26344e;font-size:16px;font-weight:800;cursor:pointer}.pze_audio_btn:disabled{opacity:.38;cursor:not-allowed}.pze_audio_wait{color:#8290a4;font-size:16px}
.pze_inline_example{margin-top:9px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}.pze_inline_example>span{display:block;margin-bottom:4px;color:var(--dim);font-size:16px;font-weight:900}.pze_inline_example .ko{margin:3px 0;color:var(--ink);font-size:16px;line-height:1.55}.pze_inline_example .en{margin:4px 0 0;color:#334155;font-size:16px;font-weight:800;line-height:1.6}.pze_inline_example .en.pzl-role-sentence{display:flex;gap:7px 8px;flex-wrap:wrap}
.pze_inline_close{display:block;margin:9px 0 0 auto;padding:6px 10px;border:0;border-radius:9px;background:#eef2f7;color:#64748b;font-size:16px;font-weight:800;cursor:pointer}

/* 오른쪽: 범위 선택 전용 */
.pze_group_col{min-width:0}.pze_group_rail{position:sticky;top:128px;padding:12px;border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 8px 24px rgba(21,32,58,.06);max-height:calc(100vh - 154px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.pze_group_head{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:9px;padding:0 2px}.pze_group_head strong{font-size:16px}.pze_group_head span{color:var(--dim);font-size:16px;font-weight:800}
.pze_group_buttons{display:grid;gap:7px}.pze_group_btn{display:grid;grid-template-columns:25px 1fr;align-items:center;gap:6px;min-height:46px;padding:6px 7px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--ink);text-decoration:none;transition:.13s}
.pze_group_btn:hover{border-color:#f5f5f5;background:#f5f5f7}.pze_group_btn small{display:flex;align-items:center;justify-content:center;width:25px;height:25px;border-radius:7px;background:#eef2f7;color:#718096;font-size:16px;font-weight:900}.pze_group_btn b{font-size:16px;letter-spacing:-.02em;white-space:nowrap}
.pze_group_btn.on{border-color:#f5f5f5;background:#f5f5f7;color:#303238;box-shadow:0 5px 16px rgba(16,185,129,.09)}.pze_group_btn.on small{background:#303238;color:#fff}

.pze_empty{padding:40px 24px;border:1px dashed var(--line);border-radius:18px;background:var(--paper);text-align:center}.pze_empty strong{font-size:19px}.pze_empty p{margin:7px 0 0;color:var(--dim);font-size:16px}

/* Dark mode */
html.pzl-dark .pze,body.pzl-dark .pze{--ink:#e6e9ed;--dim:#98a2b1;--line:#f5f5f5;--card:#171b21;--paper:#0f1216;--accent:#303238;--accent-dark:#303238;--soft:#303238}
html.pzl-dark .pze_results,body.pzl-dark .pze_results{background:var(--paper)}
html.pzl-dark .pze_item_wrap,html.pzl-dark .pze_group_rail,html.pzl-dark .pze_group_btn,html.pzl-dark .pze_inline_pair,html.pzl-dark .pze_inline_example,html.pzl-dark .pze_audio_btn,body.pzl-dark .pze_item_wrap,body.pzl-dark .pze_group_rail,body.pzl-dark .pze_group_btn,body.pzl-dark .pze_inline_pair,body.pzl-dark .pze_inline_example,body.pzl-dark .pze_audio_btn{background:var(--card);color:var(--ink)}
html.pzl-dark .pze_item_wrap.on,body.pzl-dark .pze_item_wrap.on{background:#303238;border-color:#f5f5f5}html.pzl-dark .pze_inline_audio,body.pzl-dark .pze_inline_audio{background:#303238;border-color:#f5f5f5}html.pzl-dark .pze_inline_example .en,body.pzl-dark .pze_inline_example .en{color:#dbe4ee}html.pzl-dark .pze_group_btn.on,body.pzl-dark .pze_group_btn.on{background:#303238;border-color:#f5f5f5;color:#303238}

/* Tablet */
@media (min-width:769px) and (max-width:1100px){
  .pze{margin:26px 22px 46px}.pze_hero{padding:25px 26px}.pze_hero h2{font-size:27px}.pze_browser{grid-template-columns:minmax(0,1fr) 116px;gap:12px}.pze_results{padding:15px}.pze_item{grid-template-columns:36px minmax(0,.9fr) minmax(0,1.1fr) 22px;padding:9px}.pze_group_rail{top:120px;padding:10px}.pze_group_btn{grid-template-columns:23px 1fr;padding:6px}.pze_group_btn small{width:23px;height:23px}.pze_group_btn b{font-size:16px}
}

/* Mobile: 오른쪽 범위 레일은 유지하고 왼쪽 목록만 1열 */
@media (max-width:768px){
  .pze{margin:18px 0 36px}.pze_hero{margin:0 12px;padding:21px 18px;border-radius:18px}.pze_eyebrow{font-size:16px}.pze_hero h2{font-size:23px}.pze_hero p{font-size:16px;line-height:1.65}
  .pze_active_head{margin:22px 14px 12px;align-items:flex-start}.pze_active_head h3{font-size:22px}.pze_active_head p{font-size:16px}.pze_current_range{padding:7px 9px;font-size:16px}
  .pze_browser{grid-template-columns:minmax(0,1fr) 72px;gap:7px;padding:0 7px 0 10px}.pze_results{padding:9px;border-radius:16px}.pze_results_head{display:block;margin:3px 3px 9px}.pze_results_head strong{font-size:16px}.pze_results_head span{display:block;margin-top:3px;font-size:16px;text-align:left}
  .pze_list{grid-template-columns:1fr;gap:7px}.pze_item{grid-template-columns:32px minmax(0,.92fr) minmax(0,1.08fr) 20px;gap:7px;min-height:62px;padding:8px}.pze_item .no{width:29px;height:29px;font-size:16px}.pze_item .ko{font-size:16px}.pze_item .en{font-size:16px}.pze_item .open_mark{width:20px;height:20px;font-size:16px}
  .pze_group_rail{top:102px;padding:7px 5px;border-radius:13px;max-height:calc(100vh - 118px)}.pze_group_head{display:block;text-align:center;margin-bottom:6px}.pze_group_head strong{font-size:16px}.pze_group_head span{display:block;margin-top:1px;font-size:16px}.pze_group_buttons{gap:5px}.pze_group_btn{display:block;min-height:43px;padding:5px 2px;text-align:center;border-radius:9px}.pze_group_btn small{display:none}.pze_group_btn b{display:block;font-size:16px;line-height:1.2;white-space:normal}.pze_group_btn.on b{font-size:16px}
  .pze_inline_detail{padding:0 9px 10px}.pze_inline_pair{grid-template-columns:1fr;padding:11px;gap:5px}.pze_inline_arrow{transform:rotate(90deg);justify-self:start}.pze_inline_pair strong{font-size:19px}.pze_inline_counter{right:5px}.pze_inline_audio{padding:8px}.pze_inline_audio>strong{width:100%;font-size:16px}.pze_audio_btn{min-height:39px;padding:7px 8px;font-size:16px}.pze_inline_example{padding:9px}.pze_inline_example .ko{font-size:16px}.pze_inline_example .en{font-size:16px}
}

@media (max-width:430px){
  .pze_hero{margin:0 8px}.pze_active_head{display:block;margin-left:11px;margin-right:11px}.pze_current_range{display:inline-flex;margin-top:8px}.pze_browser{grid-template-columns:minmax(0,1fr) 62px;gap:5px;padding:0 5px 0 7px}.pze_results{padding:7px}.pze_item{grid-template-columns:29px minmax(0,1fr) 18px;gap:6px}.pze_item .no{grid-row:1/3}.pze_item .ko,.pze_item .en{grid-column:2}.pze_item .open_mark{grid-column:3;grid-row:1/3}.pze_group_rail{padding:6px 4px}.pze_group_btn{min-height:42px}.pze_group_btn b{font-size:16px}
}

@media(prefers-reduced-motion:reduce){.pze_item_wrap,.pze_group_btn,.pze_inline_detail{transition:none;animation:none}}

.pze_results>.pze_active_head{margin:0 0 18px;align-items:flex-start;gap:12px}.pze_results .pze_active_group{color:var(--accent-dark);font-size:16px;font-weight:900}.pze_results .pze_active_head h3{margin:4px 0 0;font-size:25px;line-height:1.35}.pze_results .pze_current_range{background:transparent;border:0;padding:0;border-radius:0;color:var(--dim);font-weight:800;font-size:16px;white-space:nowrap}
@media(min-width:769px){.pze_results{padding:24px}}
.pze_results>.pze_active_head{display:flex}.pze_results .pze_current_range{margin-top:0}

/* 표현별 예문은 넓게 펼치고 작은 화면에서는 한 열로 읽는다. */
.pze_item_wrap.on{grid-column:1/-1}
.pze_inline_detail{padding:16px 18px 18px}
.pze_examples_title{margin:22px 0 12px;font-size:16px;color:var(--ink)}
.pze_examples_grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch}
.pze_examples_grid .pze_inline_example{margin:0;padding:16px;min-width:0}
.pze_inline_example>strong{display:block;margin-bottom:8px;font-size:16px;color:var(--dim)}
.pze_inline_example .ko{margin:0 0 10px;line-height:1.65}
.pze_inline_example .en{margin:0 0 14px;line-height:1.75;overflow-wrap:anywhere}
.pze_inline_example .pze_audio_btn{margin:0 7px 0 0;min-height:40px}
.pze_inline_example .pze_audio_wait{display:block;margin-top:8px;line-height:1.5}
.pze_inline_close{margin-top:16px;min-height:40px}
@media(max-width:640px){.pze_examples_grid{grid-template-columns:1fr;gap:12px}.pze_inline_detail{padding:12px}.pze_examples_grid .pze_inline_example{padding:14px}.pze_examples_title{margin-top:18px}}

@media(max-width:640px){
 .pze_browser{display:flex;flex-direction:column;gap:12px}
 .pze_group_col{order:-1;width:100%;position:static}
 .pze_group_rail{position:static;padding:10px 12px}
 .pze_group_head{margin-bottom:8px}
 .pze_group_buttons{display:flex;gap:8px;overflow-x:auto}
 .pze_group_btn{flex:1;min-width:82px;min-height:42px;margin:0}
 .pze_results{width:100%;padding:12px}
}

.pze_mobile_nav{display:none}@media(max-width:768px){.pze_mobile_nav:not([hidden]){position:fixed;left:10px;right:10px;bottom:calc(8px + env(safe-area-inset-bottom));z-index:50;display:flex;gap:9px;padding:9px;border:1px solid #f5f5f5;border-radius:15px;background:var(--card,#fff);box-shadow:0 10px 28px #0f172329}.pze_mobile_nav button{flex:1;min-height:46px;border:1px solid #f5f5f5;border-radius:12px;background:var(--card,#fff);color:var(--ink,#192545);font:inherit}.pze_mobile_nav button:last-child{background:#303238;color:#fff}.pze_mobile_nav button:disabled{opacity:.45}body:has(.pze_mobile_nav:not([hidden])){padding-bottom:100px}}
.pze_section_head:has(#pzeCategoryGuide){display:block}#pzeCategoryGuide{font-size:16px;font-weight:500;line-height:1.85;margin:0 0 12px;max-width:900px;color:var(--ink);text-align:left;flex-basis:100%}div:has(>#pzeCategoryGuide){flex-wrap:wrap;align-items:flex-start}
/* 범위가 많은 분류도 내부 스크롤 없이 페이지와 함께 읽는다. */
.pze_group_rail{position:static;max-height:none;overflow:visible;overscroll-behavior:auto}
@media(max-width:640px){
 .pze_group_buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(82px,1fr));overflow:visible}
 .pze_group_btn{min-width:0}
}

/* 범위 선택은 작고 균형 있게, 재생 상태는 본문보다 한 단계 작게. */
.pze_group_buttons{justify-items:center}
.pze_group_btn{box-sizing:border-box;width:100%;max-width:112px;min-height:40px;padding:5px 6px;grid-template-columns:22px minmax(0,1fr);gap:5px;margin-inline:auto;text-align:center}
.pze_group_btn small{width:22px;height:22px;font-size:14px}
.pze_group_btn b,.pze_group_btn.on b{font-size:14px;text-align:center}
.pze_group_head strong,.pze_group_head span{font-size:14px}
.pze_inline_example .pze_audio_wait,.pze_inline_audio .pze_audio_wait{font-size:15px;font-weight:400;min-height:23px;line-height:1.5}
@media(max-width:640px){.pze_group_btn{max-width:none;min-height:40px}}