
/* Isolated catalogue navigation: inherits the original app's theme tokens. */
.ped-browser { color:var(--v3-navy,var(--ink,#172c4b)); background:var(--v3-paper,var(--paper,#fff)); border:1px solid var(--v3-line,var(--line,#e1e7f0)); border-radius:16px; padding:20px; margin:0 0 20px; min-width:0; }
.ped-browser *, .ped-browser *::before, .ped-browser *::after { box-sizing:border-box; }
.ped-browser-heading h2 { margin:0 0 7px; font-size:18px; line-height:1.4; }
.ped-browser-heading p { margin:0 0 16px; font-size:12px; line-height:1.65; color:var(--v3-muted,var(--muted,#66758a)); }
.ped-browser-search { display:grid; gap:6px; font-size:12px; font-weight:600; }
.ped-browser-search input { width:100%; min-height:44px; min-width:0; border:1px solid var(--v3-line,var(--line,#e1e7f0)); border-radius:10px; padding:10px 12px; background:var(--v3-bg,var(--bg,#f5f7fb)); color:inherit; font:inherit; font-weight:400; }
.ped-browser-toolbar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; margin:12px 0 8px; }
.ped-browser-select-tools { display:flex; gap:6px; flex-wrap:wrap; }
.ped-browser :is(button,input) { font-family:inherit; }
.ped-browser-toolbar button, .ped-browser-jump { min-height:44px; padding:9px 12px; border:1px solid var(--v3-line,var(--line,#e1e7f0)); border-radius:10px; font-size:12px; line-height:1.4; cursor:pointer; }
.ped-browser-toolbar .fx-secondary, .ped-browser-jump { background:var(--v3-paper,var(--paper,#fff)); color:var(--v3-navy,var(--ink,#172c4b)); }
.ped-browser-review { background:var(--v3-blue,var(--green,#2463eb)); border-color:var(--v3-blue,var(--green,#2463eb))!important; color:#fff; }
.ped-browser button:disabled { cursor:default; opacity:.48; }
.ped-browser-status { color:var(--v3-muted,var(--muted,#66758a)); margin:6px 0 12px; font-size:12px; line-height:1.65; }
.ped-browser :is(ul,li) { margin:0; padding:0; list-style:none; }
.ped-browser .ped-browser-children { margin-left:21px; padding-left:12px; border-left:1px solid var(--v3-line,var(--line,#e1e7f0)); }
.ped-browser [hidden] { display:none!important; }
.ped-browser-row, .ped-browser-card { display:flex; align-items:center; gap:4px; min-width:0; border-bottom:1px solid var(--v3-line,var(--line,#e1e7f0)); }
.ped-browser-subject + .ped-browser-subject { margin-top:5px; }
.ped-browser-check { position:relative; width:38px; min-width:38px; min-height:44px; display:flex; justify-content:center; align-items:center; cursor:pointer; margin:0; }
.ped-browser-check input { position:absolute; width:20px; height:20px; margin:0; opacity:0; cursor:pointer; }
.ped-browser-check > span { display:block; width:18px; height:18px; background:var(--v3-paper,var(--paper,#fff)); border:1.5px solid var(--v3-muted,var(--muted,#66758a)); border-radius:4px; pointer-events:none; }
.ped-browser-check input:checked + span, .ped-browser-check input[aria-checked=mixed] + span { border-color:var(--v3-blue,var(--green,#2463eb)); background:var(--v3-blue,var(--green,#2463eb)); }
.ped-browser-check input:checked + span::after { content:""; display:block; width:5px; height:9px; border:solid #fff; border-width:0 2px 2px 0; transform:translate(5px,1px) rotate(45deg); }
.ped-browser-check input[aria-checked=mixed] + span::after { content:""; display:block; width:8px; border-top:2px solid #fff; transform:translate(3.5px,6px); }
.ped-browser-check input:focus-visible + span { outline:3px solid #79a2ff; outline-offset:4px; }
.ped-browser-disclosure, .ped-browser-card-open { flex:1; display:flex; align-items:center; min-width:0; min-height:48px; text-align:left; background:transparent; border:0; color:inherit; font:inherit; font-size:13px; line-height:1.55; padding:9px 5px; cursor:pointer; gap:7px; }
.ped-browser-disclosure > span { flex:1; min-width:0; overflow-wrap:anywhere; word-break:keep-all; }
.ped-browser-disclosure > svg { flex:0 0 16px; width:16px; height:16px; color:var(--v3-muted,var(--muted,#66758a)); transition:transform .15s ease; }
.ped-browser-disclosure[aria-expanded=true] > svg { transform:rotate(90deg); }
.ped-browser-disclosure > small { flex:none; font-size:11px; font-weight:400; color:var(--v3-muted,var(--muted,#66758a)); }
.ped-browser-subject > .ped-browser-row .ped-browser-disclosure { font-weight:750; }
.ped-browser-chapter > .ped-browser-row .ped-browser-disclosure { font-weight:650; }
.ped-browser-jump { flex:0 0 auto; font-weight:500; margin-left:3px; }
.ped-browser-card-open { flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; padding:10px 4px; overflow-wrap:anywhere; word-break:keep-all; }
.ped-browser-card-open > small { font-size:11px; color:var(--v3-muted,var(--muted,#66758a)); line-height:1.5; }
.ped-browser-current { flex:none; font-size:10px; padding:3px 6px; margin-right:3px; border-radius:5px; color:var(--v3-blue,var(--green,#2463eb)); background:var(--v3-soft,var(--soft,#eef4ff)); }
.ped-browser-card.is-current { background:var(--v3-soft,var(--soft,#eef4ff)); border-radius:8px; }
.ped-browser button:not(:disabled):hover { color:var(--v3-blue,var(--green,#2463eb)); background:var(--v3-soft,var(--soft,#eef4ff)); }
.ped-browser .ped-browser-review:not(:disabled):hover { background:var(--v3-blue-hover,#1b50c6); color:#fff; }
.ped-browser :is(button,input):focus-visible { outline:3px solid #79a2ff; outline-offset:2px; }
.ped-browser-empty { margin:16px 0 4px; padding:16px; border-radius:10px; background:var(--v3-bg,var(--bg,#f5f7fb)); color:var(--v3-muted,var(--muted,#66758a)); font-size:13px; line-height:1.7; }
.ped-browser-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:560px) {
  .ped-browser { padding:14px 10px; border-radius:12px; }
  .ped-browser .ped-browser-children { margin-left:14px; padding-left:5px; }
  .ped-browser-check { width:30px; min-width:30px; }
  .ped-browser-disclosure { gap:4px; font-size:12px; }
  .ped-browser-disclosure > svg { width:13px; flex-basis:13px; }
  .ped-browser-jump { padding:8px; min-width:42px; }
  .ped-browser-card-open { font-size:12px; }
}
@media (prefers-reduced-motion:reduce) { .ped-browser-disclosure > svg { transition:none; } }

