/* /explore — the public-domain catalogue pages (scripts/seo/build-explore-pages.mjs). Site tokens only. */
.xpage .xby{font-family:var(--mono);font-size:12px;letter-spacing:.4px;color:var(--ink-soft);margin:-6px 0 22px;}

/* the player: one button, the waveform, the time — explore.js drives it */
.xp{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--surface);border:1px solid var(--rule-strong);}
.xp-btn{flex:0 0 46px;width:46px;height:46px;border-radius:50%;border:1px solid var(--ink);background:var(--ink);color:var(--paper);
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;}
.xp-btn:hover{background:var(--accent);border-color:var(--accent);}
.xp-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
.xp-ico{width:0;height:0;border-style:solid;border-width:8px 0 8px 13px;border-color:transparent transparent transparent currentColor;margin-left:3px;}
.xp.on .xp-ico{width:12px;height:14px;border:0;margin:0;background:linear-gradient(90deg,currentColor 0 4px,transparent 4px 8px,currentColor 8px 12px);}
.xp.wait .xp-ico{width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;margin:0;animation:xp-spin .8s linear infinite;}
@keyframes xp-spin{to{transform:rotate(360deg);}}
.xp-wave{position:relative;flex:1 1 auto;height:44px;cursor:pointer;min-width:60px;}
.xp-wave svg{display:block;width:100%;height:100%;}
.xp-wave path{stroke-width:1.2;fill:none;}
.xp-bg path{stroke:var(--rule-strong);}
.xp-bg,.xp-fg{position:absolute;inset:0;}   /* both layers fill the wave box: an in-flow layer has no height, its svg overflows */
.xp-fg{clip-path:inset(0 100% 0 0);}
.xp-fg path{stroke:var(--accent);}
.xp-time{flex:0 0 auto;font-family:var(--mono);font-size:12px;color:var(--ink-soft);min-width:44px;text-align:right;font-variant-numeric:tabular-nums;}
.xp-s{padding:6px 10px;gap:10px;background:transparent;border:0;}
.xp-s .xp-btn{flex-basis:32px;width:32px;height:32px;}
.xp-s .xp-ico{border-width:6px 0 6px 10px;}
.xp-s.on .xp-ico{width:10px;height:11px;background:linear-gradient(90deg,currentColor 0 3px,transparent 3px 7px,currentColor 7px 10px);}
.xp-s .xp-wave{height:26px;}
.xp-s .xp-time{display:none;}
.xp-gap{display:inline-block;width:32px;}
.xp-err{font-family:var(--mono);font-size:11px;color:var(--coral);}
.xrec{margin:8px 0 26px;}
.xrec .xcap{font-family:var(--mono);font-size:11px;letter-spacing:.4px;color:var(--ink-mute);margin:8px 0 0;}
.xrec-none{padding:16px 18px;border:1px dashed var(--rule-strong);color:var(--ink-soft);}
.xcta h3{margin-top:0;}
.xmood{font-size:15px;color:var(--ink-soft);}
.xmood b{font-family:var(--mono);font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--ink);font-weight:600;margin-right:4px;}

/* the facts */
.xf{display:grid;grid-template-columns:1fr;gap:0;margin:0 0 26px;border-top:1px solid var(--rule);}
.xf div{display:grid;grid-template-columns:170px 1fr;gap:14px;padding:10px 0;border-bottom:1px solid var(--rule);}
.xf dt{font-family:var(--mono);font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--ink-mute);padding-top:3px;}
.xf dd{margin:0;}
@media (max-width:560px){.xf div{grid-template-columns:1fr;gap:2px;}}

/* editions */
.xe{list-style:none;padding:0;margin:0 0 26px;border-top:1px solid var(--rule);}
.xe li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) auto;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule);}
.xe-h b{display:block;font-weight:600;}
.xe-h small,.xl-t small,.xh-t small{display:block;font-family:var(--mono);font-size:11px;color:var(--ink-mute);letter-spacing:.3px;margin-top:2px;}
.xe-none{font-family:var(--mono);font-size:11px;color:var(--ink-mute);}
.xe-midi,.xl-go{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.8px;text-transform:uppercase;text-decoration:none;
  padding:7px 12px;border:1px solid var(--ink);color:var(--ink);white-space:nowrap;}
.xe-midi:hover,.xl-go:hover{background:var(--ink);color:var(--paper);}
@media (max-width:640px){.xe li{grid-template-columns:1fr auto;}.xe li .xp,.xe li .xe-none{grid-column:1 / -1;grid-row:2;}}

/* the catalogue list + search */
.xs{position:sticky;top:0;z-index:2;background:var(--paper);padding:14px 0 10px;margin-top:26px;border-bottom:1px solid var(--rule);}
.xs input{width:100%;box-sizing:border-box;font:inherit;font-size:17px;padding:13px 16px;border:1px solid var(--rule-strong);background:var(--surface);color:var(--ink);}
.xs input:focus{outline:2px solid var(--accent);outline-offset:-1px;}
.xcs{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px;}
.xc{font-family:var(--mono);font-size:11px;letter-spacing:.6px;padding:6px 10px;border:1px solid var(--rule-strong);background:transparent;color:var(--ink-soft);cursor:pointer;}
.xc.on,.xc:hover{background:var(--ink);border-color:var(--ink);color:var(--paper);}
.xs-n{font-family:var(--mono);font-size:11px;color:var(--ink-mute);margin:8px 0 0;}
.xl{list-style:none;padding:0;margin:0 0 30px;}
.xl li{display:grid;grid-template-columns:minmax(120px,1.1fr) minmax(0,1.6fr) auto auto;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--rule);}
.xl li[hidden]{display:none;}
.xl-t a{font-weight:600;color:var(--ink);text-decoration:none;}
.xl-t a:hover{text-decoration:underline;}
.xl-len{font-family:var(--mono);font-size:12px;color:var(--ink-mute);font-variant-numeric:tabular-nums;}
.xl li .xp-s,.xl li .xp-gap{grid-column:1;grid-row:1;}
.xl li .xl-t{grid-column:2;}
@media (max-width:640px){
  .xl li{grid-template-columns:minmax(0,1fr) auto auto;}
  .xl li .xp-s,.xl li .xp-gap{grid-column:1 / -1;grid-row:2;}
  .xl li .xl-t{grid-column:1;grid-row:1;}
  .xl li .xp-gap{display:none;}
}
.xhol{margin:18px 0 6px;}
.xhol-h{font-family:var(--mono);font-size:12px;letter-spacing:.8px;text-transform:uppercase;margin:0 0 6px;}
.xhol-h a{color:var(--accent);text-decoration:none;}
.xh-m{color:var(--ink-soft) !important;font-family:var(--sans) !important;font-size:13px !important;letter-spacing:0 !important;}
.xh-hold .xl-t a,.xh-hold .xh-t a{color:var(--ink-soft);}
