#amar-lr {
  --ground: #f1f0ec;
  --white: #ffffff;
  --ink: #22221f;
  --muted: #595955;
  --line: #a8a8a0;
  --accent: #ce5a36;
  --accent-deep: #a8432a;
  --gold: #cba54c;
  --vinyl: #141413;
  --font: 'Manrope', Arial, sans-serif;
  --font-ar: 'Noto Sans Arabic', Tahoma, sans-serif;
  --edge: clamp(16px, 3vw, 40px);
    --player: 68px;
  --rule: 2px solid var(--ink);
  --row: clamp(15px, 1.6vw, 21px);
  --ease: cubic-bezier(.76, 0, .24, 1);
  color-scheme: light;
}
#amar-lr, #amar-lr * { box-sizing: border-box; }
#amar-lr { -webkit-text-size-adjust: 100%; }
#amar-lr {
  position: relative; display: block; margin: 0; max-width: none;
  background: var(--ground);
  color: var(--ink);
  font: 500 16px/1.5 var(--font);
  letter-spacing: normal; text-align: start;
  -webkit-font-smoothing: antialiased;
}
#amar-lr[lang="ar"] { font-family: var(--font-ar); }
/* neutralise theme typography that would leak in (entry-content, ev-page) */
#amar-lr p, #amar-lr h1, #amar-lr h2, #amar-lr h3, #amar-lr ul, #amar-lr ol, #amar-lr li, #amar-lr dl, #amar-lr dd, #amar-lr figure { max-width: none; margin: 0; padding: 0; }
#amar-lr ul, #amar-lr ol, #amar-lr li { list-style: none; }
#amar-lr a { text-decoration: none; }
#amar-lr .note a, #amar-lr .about-body a { text-decoration: underline; text-underline-offset: 3px; }
#amar-lr button, #amar-lr select, #amar-lr input { font-family: inherit; letter-spacing: normal; text-transform: none; line-height: normal; box-shadow: none; }
#amar-lr .about-body p { margin: 0; }
#amar-lr.has-player { padding-bottom: calc(var(--player) + env(safe-area-inset-bottom, 0px)); }
#amar-lr [hidden] { display: none !important; }
#amar-lr a { color: inherit; }
#amar-lr button { font: inherit; color: inherit; }
#amar-lr img, #amar-lr svg { max-width: 100%; }
#amar-lr :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
#amar-lr .sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
#amar-lr .i { width: 1em; height: 1em; display: block; flex: none; }
#amar-lr[dir="rtl"] .flip { transform: scaleX(-1); }
#amar-lr [lang="ar"] { font-family: var(--font-ar); }
#amar-lr bdi[lang="en"], #amar-lr span[lang="en"] { font-family: var(--font); }
/* section tabs (inside the app) */
#amar-lr .alr-tabs { display: flex; align-items: center; gap: clamp(2px, 1.2vw, 14px); padding: 8px var(--edge); border-bottom: var(--rule); flex-wrap: wrap; background: var(--ground); }
#amar-lr .alr-tabs a {
  display: inline-flex; align-items: center; gap: 7px; min-height: 42px; padding: 0 12px;
  text-transform: uppercase; letter-spacing: .06em; font-size: 13px; font-weight: 800; color: var(--ink);
  border-bottom: 3px solid transparent;
}
#amar-lr[lang="ar"] .alr-tabs a { text-transform: none; letter-spacing: 0; font-size: 15px; }
#amar-lr .alr-tabs a[aria-current="page"] { border-bottom-color: var(--accent); }
#amar-lr .alr-tabs a:hover { color: var(--accent-deep); }
#amar-lr .onair-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--line); }
#amar-lr.radio-online .onair-dot { background: var(--accent); }
#amar-lr.radio-playing .onair-dot { animation: pulse 1.6s ease-in-out infinite; }
#amar-lr .wrap { padding-inline: var(--edge); }
#amar-lr .eyebrow { margin: 0; text-transform: uppercase; letter-spacing: .1em; font-size: 12px; font-weight: 700; color: var(--accent-deep); }
#amar-lr[lang="ar"] .eyebrow { letter-spacing: 0; font-size: 14px; text-transform: none; }
#amar-lr .chip {
  display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px;
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap;
}
#amar-lr[lang="ar"] .chip { text-transform: none; letter-spacing: 0; font-size: 13px; }
#amar-lr .loading, #amar-lr .empty { padding: 48px var(--edge); font-size: 18px; color: var(--muted); }
#amar-lr .tnum { font-variant-numeric: tabular-nums; }
#amar-lr .pbtn {
  position: relative; flex: none; display: inline-grid; place-items: center;
  width: 1.5em; height: 1.5em; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--ink); color: var(--ground); font-size: inherit; padding: 0;
  transition: background .15s, color .15s, transform .15s;
}
#amar-lr .pbtn .i { width: .62em; height: .62em; grid-area: 1 / 1; }
#amar-lr .pbtn .i-pause, #amar-lr .pbtn .i-stop { display: none; }
#amar-lr .pbtn:hover { background: var(--accent-deep); color: var(--white); }
#amar-lr .pbtn:active { transform: scale(.94); }
#amar-lr .pbtn .spin { display: none; grid-area: 1 / 1; width: 100%; height: 100%; border-radius: 50%; border: 2px solid transparent; border-top-color: currentColor; animation: turn .8s linear infinite; }
#amar-lr .pbtn.is-loading .spin { display: block; }
#amar-lr .pbtn.is-loading .i { opacity: .25; }
#amar-lr .pbtn.is-playing { background: var(--accent); color: var(--white); }
#amar-lr .pbtn.is-playing .i-play { display: none; }
#amar-lr .pbtn.is-playing .i-pause { display: block; }
#amar-lr .pbtn.is-radio.is-playing .i-pause { display: none; }
#amar-lr .pbtn.is-radio.is-playing .i-stop { display: block; }
#amar-lr .pbtn-lg { font-size: 30px; }
#amar-lr .ibtn { display: inline-grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; border-radius: 50%; cursor: pointer; font-size: 20px; }
#amar-lr .ibtn:hover { background: rgba(255,255,255,.12); }
#amar-lr .btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 20px; border-radius: 999px;
  border: 1.5px solid var(--ink); background: transparent; cursor: pointer; text-decoration: none;
  font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: .06em;
}
#amar-lr[lang="ar"] .btn { text-transform: none; letter-spacing: 0; font-size: 15px; }
#amar-lr .btn:hover { background: var(--ink); color: var(--ground); }
#amar-lr .btn-solid { background: var(--ink); color: var(--ground); }
#amar-lr .btn-solid:hover { background: var(--accent-deep); border-color: var(--accent-deep); color: var(--white); }
#amar-lr .btn .i { width: 18px; height: 18px; }
#amar-lr .intro { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: clamp(20px, 4vw, 64px); padding-block: clamp(28px, 5vw, 64px) 28px; align-items: end; }
#amar-lr .intro h1 {
  margin: 0; font-size: clamp(40px, 7.4vw, 112px); line-height: .9; font-weight: 700; letter-spacing: -.045em; text-transform: uppercase; text-wrap: balance;
}
#amar-lr[lang="ar"] .intro h1 { letter-spacing: 0; line-height: 1.15; font-size: clamp(40px, 6.4vw, 96px); }
#amar-lr .intro p { margin: 0; font-size: clamp(16px, 1.4vw, 19px); max-width: 46ch; color: var(--ink); }
#amar-lr .stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: var(--rule); }
#amar-lr .stat { padding: 14px var(--edge) 16px; border-inline-end: 1px solid var(--line); }
#amar-lr .stat:last-child { border-inline-end: 0; }
#amar-lr .stat b { display: block; font-size: clamp(24px, 3vw, 40px); font-weight: 700; letter-spacing: -.03em; line-height: 1.1; font-variant-numeric: tabular-nums; }
#amar-lr .stat span { font-size: 13px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
#amar-lr[lang="ar"] .stat span { text-transform: none; letter-spacing: 0; font-size: 14px; }
#amar-lr .controls { position: sticky; top: var(--alr-top, 0px); z-index: 50; background: var(--ground); border-top: var(--rule); border-bottom: var(--rule); padding: 12px var(--edge); display: grid; gap: 10px; }
#amar-lr .controls-top { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
#amar-lr .search { flex: 1 1 280px; min-width: 0; position: relative; }
#amar-lr .search input {
  width: 100%; height: 44px; border: 1.5px solid var(--ink); border-radius: 999px; background: var(--white);
  padding: 0 18px; font: inherit; font-size: 16px;
}
#amar-lr .search input::placeholder { color: var(--muted); }
#amar-lr .sort { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
#amar-lr[lang="ar"] .sort { text-transform: none; letter-spacing: 0; font-size: 14px; }
#amar-lr .sort select { height: 44px; border: 1.5px solid var(--ink); border-radius: 999px; background: var(--white); padding: 0 14px; font: inherit; font-size: 14px; text-transform: none; letter-spacing: 0; }
#amar-lr .count { font-size: 13px; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
#amar-lr .chips { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
#amar-lr .chips::-webkit-scrollbar { display: none; }
#amar-lr .fchip {
  flex: none; display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 13px; border-radius: 999px;
  border: 1.5px solid var(--ink); background: transparent; cursor: pointer; font-size: 13px; font-weight: 700; white-space: nowrap;
}
#amar-lr .fchip small { font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; }
#amar-lr .fchip { --c: var(--ink); border-color: var(--c); }
#amar-lr .fchip:hover { background: color-mix(in srgb, var(--c) 12%, transparent); }
#amar-lr .fchip[aria-pressed="true"] { background: var(--c); color: var(--white); border-color: var(--c); }
#amar-lr .fchip[aria-pressed="true"] small { color: rgba(255,255,255,.75); }
#amar-lr .fchip.is-podcast[aria-pressed="true"] { background: var(--gold); color: var(--ink); border-color: var(--gold); }
#amar-lr .fchip.is-podcast[aria-pressed="true"] small { color: var(--ink); }
#amar-lr .rows { list-style: none; margin: 0; padding: 0; }
#amar-lr .row {
  --c: var(--ink);
  position: relative; display: flex; align-items: center; gap: .55em; min-height: 2.35em;
  padding-inline: var(--edge); border-bottom: 1px solid var(--ink); font-size: var(--row); background: var(--ground);
  box-shadow: inset 3px 0 0 var(--c);
  transition: background .2s, color .2s;
  content-visibility: auto; contain-intrinsic-size: auto 2.35em;
}
#amar-lr[dir="rtl"] .row { box-shadow: inset -3px 0 0 var(--c); }
#amar-lr .row .pbtn:not(.is-playing):not(.pbtn-disc) { background: var(--c); color: var(--white); }
#amar-lr .row:hover, #amar-lr .row:focus-within { background: var(--c); color: var(--white); }
#amar-lr .row:hover .pbtn:not(.is-playing):not(.pbtn-disc), #amar-lr .row:focus-within .pbtn:not(.is-playing):not(.pbtn-disc) { background: var(--white); color: var(--c); }
#amar-lr .row.is-current, #amar-lr .row.is-onair { background: color-mix(in srgb, var(--c) 14%, var(--ground)); }
#amar-lr .row.is-current:hover, #amar-lr .row.is-onair:hover, #amar-lr .row.is-current:focus-within, #amar-lr .row.is-onair:focus-within { background: var(--c); }
#amar-lr .row-air { display: none; flex: none; background: var(--accent-deep); color: var(--white); position: relative; z-index: 2; }
#amar-lr .row.is-onair .row-air { display: inline-flex; }
#amar-lr .row-link { flex: 1; min-width: 0; text-decoration: none; position: static; padding-block: .32em; }
#amar-lr .row-link::after { content: ""; position: absolute; inset: 0; }
#amar-lr .row .pbtn { position: relative; z-index: 2; font-size: .92em; }
#amar-lr .row-go { flex: none; width: 1.15em; height: 1.15em; display: grid; place-items: center; border-radius: 50%; border: 1px solid currentColor; opacity: .7; }
#amar-lr .row-go .i { width: .6em; height: .6em; }
#amar-lr .tick { display: block; overflow: hidden; white-space: nowrap; }
#amar-lr .tick > span { display: inline-block; padding-inline-end: .4em; }
#amar-lr .tick.ticks.in-view > span { animation: tick var(--t, 20s) var(--delay, 0s) ease-in-out infinite; }
#amar-lr .row:hover .tick > span, #amar-lr .row:focus-within .tick > span { animation-play-state: paused; }
@keyframes tick { 0%, 16% { transform: translateX(0); } 84%, 100% { transform: translateX(var(--d, 0)); } }
#amar-lr .row-artist { font-weight: 600; }
#amar-lr .row-title { font-weight: 400; }
/* Rows "Stickers" (user choice 2026-10-12): coloured dots between the parts, the other-script title in the form's
   colour, the form as a tilted sticker (--tilt per row), the record company, the year in a stamp. */
#amar-lr .row-title, #amar-lr .row-alt { margin-inline-start: .42em; }
#amar-lr .row-alt { font-weight: 400; color: var(--c); }
#amar-lr .row-alt bdi[lang="ar"], #amar-lr[lang="ar"] .row-artist, #amar-lr[lang="ar"] .row-title { font-size: .94em; }
#amar-lr .row-title::before, #amar-lr .row-alt::before {
  content: ""; display: inline-block; width: .17em; height: .17em; margin-inline-end: .45em; border-radius: 50%; background: var(--c); vertical-align: .2em;
}
#amar-lr .row-form, #amar-lr .row-year { display: inline-block; vertical-align: middle; line-height: 1.35; white-space: nowrap; }
#amar-lr .row-form {
  margin-inline-start: .8em; padding: .18em .7em .22em; border-radius: 999px; background: var(--c); color: var(--white);
  font-size: max(10px, .5em); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; transform: rotate(var(--tilt, -2deg));
}
#amar-lr .row-co { margin-inline-start: .7em; vertical-align: middle; font-size: max(10px, .5em); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
#amar-lr .row-year {
  margin-inline-start: .6em; padding: .05em .5em; border: 1px solid currentColor; border-radius: 4px;
  font-size: max(10.5px, .55em); font-weight: 500; font-variant-numeric: tabular-nums; transform: rotate(calc(var(--tilt, -2deg) / -2));
}
#amar-lr[lang="ar"] .row-form { text-transform: none; letter-spacing: 0; font-size: .56em; }
#amar-lr[lang="ar"] .row-co { text-transform: none; letter-spacing: 0; font-size: .58em; }
#amar-lr .row:hover .row-alt, #amar-lr .row:focus-within .row-alt { color: inherit; }
#amar-lr .row:hover .row-title::before, #amar-lr .row:hover .row-alt::before, #amar-lr .row:focus-within .row-title::before, #amar-lr .row:focus-within .row-alt::before { background: var(--white); }
#amar-lr .row:hover .row-form, #amar-lr .row:focus-within .row-form { background: var(--white); color: var(--c); }
#amar-lr .row:hover .row-co, #amar-lr .row:focus-within .row-co { color: rgba(255,255,255,.85); }
/* the play button is a 78: grooves, a centre label in the form's colour, the icon on the label */
#amar-lr .row .pbtn.pbtn-disc {
  font-size: .92em; color: var(--white);
  background: repeating-radial-gradient(circle at 50% 50%, var(--vinyl) 0 1.6px, #34342f 1.6px 2.6px); box-shadow: none;
}
#amar-lr .pbtn-disc::before { content: ""; grid-area: 1 / 1; width: 52%; height: 52%; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 2px var(--vinyl); transition: background .15s; }
#amar-lr .pbtn-disc .i { width: .36em; height: .36em; position: relative; }
#amar-lr .row:hover .pbtn.pbtn-disc, #amar-lr .row:focus-within .pbtn.pbtn-disc, #amar-lr .row .pbtn.pbtn-disc:hover { color: var(--c); }
#amar-lr .row:hover .pbtn-disc::before, #amar-lr .row:focus-within .pbtn-disc::before, #amar-lr .pbtn-disc:hover::before { background: var(--white); }
#amar-lr .pbtn-disc .spin { border-top-color: var(--white); }
/* sound bars beside the record that is playing */
#amar-lr .row-eq { display: none; flex: none; align-items: flex-end; gap: 3px; height: .8em; position: relative; z-index: 2; }
#amar-lr .row-eq i { display: block; width: 2.5px; height: 100%; border-radius: 2px; background: var(--c); transform-origin: bottom; animation: alr-eq .9s ease-in-out infinite; }
#amar-lr .row-eq i:nth-child(2) { animation-delay: -.3s; } #amar-lr .row-eq i:nth-child(3) { animation-delay: -.6s; } #amar-lr .row-eq i:nth-child(4) { animation-delay: -.15s; }
#amar-lr .row.is-current:has(.pbtn.is-playing) .row-eq, #amar-lr .row.is-onair .row-eq { display: inline-flex; }
#amar-lr .row:hover .row-eq i, #amar-lr .row:focus-within .row-eq i { background: var(--white); }
@keyframes alr-eq { 0%, 100% { transform: scaleY(.35); } 50% { transform: scaleY(1); } }
#amar-lr .il { display: flex; align-items: center; gap: 16px; padding: 14px var(--edge); border-bottom: var(--rule); text-decoration: none; cursor: pointer; font-size: clamp(16px, 1.6vw, 21px); font-weight: 600; letter-spacing: -.01em; min-height: 2.6em; width: 100%; border-inline: 0; border-top: 0; text-align: start; }
#amar-lr .il > span:first-child { flex: 1; min-width: 0; }
#amar-lr .il small { display: block; font-size: 14px; font-weight: 600; letter-spacing: 0; margin-top: 2px; }
#amar-lr .il .il-go { flex: none; width: 1.3em; height: 1.3em; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid currentColor; }
#amar-lr .il .il-go .i { width: .6em; height: .6em; }
#amar-lr .il-accent { background: var(--accent-deep); color: var(--white); }
#amar-lr .il-gold { background: var(--gold); color: var(--ink); }
#amar-lr .il-ink { background: var(--ink); color: var(--ground); }
#amar-lr .il-ink small { color: var(--line); }
#amar-lr .il-line { background: var(--white); color: var(--ink); }
#amar-lr .il:hover { filter: brightness(1.08); }
#amar-lr .il-radio { cursor: default; }
#amar-lr .il-radio > span { flex: 1; min-width: 0; }
#amar-lr .il-radio .pbtn { font-size: 1.1em; background: var(--accent); color: var(--white); }
#amar-lr .il-radio a { text-decoration: none; }
#amar-lr .il-radio .il-title { display: block; }
#amar-lr .record { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-bottom: var(--rule); }
#amar-lr .stage { padding: clamp(24px, 4vw, 56px) var(--edge); display: grid; justify-items: center; gap: 22px; border-inline-end: var(--rule); background: var(--white); align-content: start; }
#amar-lr .turntable { position: relative; width: min(100%, 520px); aspect-ratio: 1; }
#amar-lr .disc {
  position: absolute; inset: 3%; border-radius: 50%;
  background:
    radial-gradient(circle, transparent 0 33%, rgba(255,255,255,.035) 33.4% 34%, transparent 34.4%),
    repeating-radial-gradient(circle, #191918 0 1.1px, #121211 1.1px 2.6px);
  box-shadow: 0 0 0 1px #000 inset;
  animation: turn 7.7s linear infinite; animation-play-state: paused;
}
#amar-lr .turntable.is-spinning .disc { animation-play-state: running; }
#amar-lr .disc-label { position: absolute; inset: 31%; border-radius: 50%; overflow: hidden; }
#amar-lr .disc-label svg { display: block; width: 100%; height: 100%; }
#amar-lr .sheen { position: absolute; inset: 3%; border-radius: 50%; pointer-events: none; background: conic-gradient(from 20deg, transparent 0 8%, rgba(255,255,255,.10) 13%, transparent 20% 52%, rgba(255,255,255,.07) 60%, transparent 68%); }
#amar-lr .sheen::after { content: ""; position: absolute; inset: 31%; border-radius: 50%; background: conic-gradient(from 20deg, transparent 0 8%, rgba(255,255,255,.08) 13%, transparent 20%); }
#amar-lr .arm { position: absolute; top: -2%; right: -3%; width: 34%; transform-origin: 74% 11%; transform: rotate(-17deg); transition: transform .7s var(--ease); pointer-events: none; }
#amar-lr .turntable.is-armed .arm { transform: rotate(2deg); }
#amar-lr .turntable.is-spinning .arm { transform: rotate(7deg); }
#amar-lr .deck { display: grid; justify-items: center; gap: 12px; width: min(100%, 520px); }
#amar-lr .deck-buttons { display: flex; align-items: center; gap: 18px; }
#amar-lr .deck .ibtn { width: 52px; height: 52px; font-size: 22px; border: 1.5px solid var(--ink); }
#amar-lr .deck .ibtn:hover { background: var(--ink); color: var(--ground); }
#amar-lr .deck .pbtn { font-size: 46px; }
#amar-lr .deck-time { font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; min-height: 1.5em; }
#amar-lr .progress { width: 100%; height: 4px; background: rgba(34,34,31,.15); position: relative; overflow: hidden; }
#amar-lr .progress > i { position: absolute; inset-block: 0; inset-inline-start: 0; width: 0; background: var(--accent); }
#amar-lr .deck-pos { font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
#amar-lr .deck-time.is-paused { animation: blink 1.2s steps(2, jump-none) infinite; }
#amar-lr .elsewhere { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: center; padding: 8px 14px; border: 1.5px solid var(--ink); border-radius: 999px; font-size: 14px; max-width: 100%; }
#amar-lr .elsewhere .chip { background: var(--ink); color: var(--ground); height: 22px; }
#amar-lr .elsewhere .chip.is-live, #amar-lr .elsewhere.is-air .chip { background: var(--accent-deep); color: var(--white); }
#amar-lr .elsewhere a { text-decoration: none; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#amar-lr .elsewhere a:hover { text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .elsewhere.is-air { border-color: var(--accent-deep); color: var(--accent-deep); font-weight: 700; }
#amar-lr .cartel { padding: clamp(24px, 4vw, 56px) var(--edge); display: grid; gap: 18px; align-content: start; }
#amar-lr .cartel h1 { margin: 0; font-size: clamp(30px, 4vw, 58px); line-height: 1.02; letter-spacing: -.03em; font-weight: 700; text-wrap: balance; }
#amar-lr .cartel h1[lang="ar"] { line-height: 1.35; letter-spacing: 0; }
#amar-lr .alt { margin: -6px 0 0; font-size: clamp(18px, 1.8vw, 24px); color: var(--muted); }
#amar-lr .alt[lang="ar"] { font-size: clamp(20px, 2vw, 28px); }
#amar-lr .artist-line { margin: 0; font-size: clamp(20px, 2vw, 28px); font-weight: 800; }
#amar-lr .artist-line span { font-weight: 500; color: var(--muted); margin-inline-start: .4em; }
#amar-lr .meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 6px 0 0; border-top: var(--rule); }
#amar-lr .meta div { padding: 12px 0 14px; border-bottom: 1px solid var(--line); }
#amar-lr .meta div:nth-child(odd) { padding-inline-end: 16px; }
#amar-lr .meta dt { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--muted); }
#amar-lr[lang="ar"] .meta dt { text-transform: none; letter-spacing: 0; font-size: 13px; }
#amar-lr .meta dd { margin: 2px 0 0; font-size: 18px; font-weight: 600; font-variant-numeric: tabular-nums; }
#amar-lr .gloss { margin: 0; font-size: 16px; color: var(--muted); }
#amar-lr .ep { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--gold); color: var(--ink); text-decoration: none; font-weight: 700; }
#amar-lr .ep small { display: block; font-weight: 600; font-size: 14px; }
#amar-lr .ep .i { width: 20px; height: 20px; margin-inline-start: auto; }
#amar-lr .ep:hover { background: #d8b664; }
#amar-lr .note { margin: 0; font-size: 15px; color: var(--muted); max-width: 52ch; }
#amar-lr .note a { color: var(--ink); font-weight: 700; }
#amar-lr .more { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-bottom: var(--rule); }
#amar-lr .more section { padding-block: 22px 8px; }
#amar-lr .more section + section { border-inline-start: var(--rule); }
#amar-lr .more h2 { margin: 0 var(--edge) 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
#amar-lr[lang="ar"] .more h2 { text-transform: none; letter-spacing: 0; font-size: 15px; }
#amar-lr .more .row { font-size: clamp(16px, 1.4vw, 20px); }
#amar-lr .more .row:last-child { border-bottom: 0; }
#amar-lr .radio { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); border-bottom: var(--rule); }
#amar-lr .radio .stage { background: var(--ink); color: var(--ground); border-inline-end: var(--rule); }
#amar-lr .radio .cartel { gap: 16px; }
#amar-lr .onair { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
#amar-lr .onair .chip { background: var(--line); color: var(--ink); }
#amar-lr.radio-online .onair .chip { background: var(--accent-deep); color: var(--white); }
#amar-lr .radio-play { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
#amar-lr .radio-play .pbtn { font-size: 54px; background: var(--ink); color: var(--ground); }
#amar-lr .radio-play .pbtn.is-playing { background: var(--accent); color: var(--white); }
#amar-lr .radio-play-label { font-size: 15px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
#amar-lr[lang="ar"] .radio-play-label { text-transform: none; letter-spacing: 0; }
#amar-lr .vol { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--muted); }
#amar-lr .vol input { width: 140px; accent-color: var(--accent); }
#amar-lr .radio .progress { background: rgba(241,240,236,.18); }
#amar-lr .radio .deck-time { color: var(--ground); }
#amar-lr .msg { margin: 0; padding: 12px 14px; background: #fbe3da; color: #6b2513; font-weight: 600; font-size: 15px; }
#amar-lr .nextup { margin: 0; padding: 14px 0 0; border-top: 1px solid var(--line); font-size: 15px; color: var(--muted); }
#amar-lr .nextup b { color: var(--ink); }
#amar-lr .history { padding: 22px 0 8px; border-bottom: var(--rule); }
#amar-lr .history h2 { margin: 0 var(--edge) 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
#amar-lr[lang="ar"] .history h2 { text-transform: none; letter-spacing: 0; font-size: 15px; }
#amar-lr .history .row { font-size: clamp(16px, 1.4vw, 20px); }
#amar-lr .history .empty { padding-block: 8px 20px; font-size: 16px; }
#amar-lr .history time { flex: none; font-size: .75em; color: var(--muted); font-variant-numeric: tabular-nums; }
#amar-lr .row:hover time { color: var(--line); }
#amar-lr .browse-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; padding-block: 28px 18px; flex-wrap: wrap; }
#amar-lr .browse-head h1 { margin: 0; font-size: clamp(36px, 5vw, 72px); line-height: .95; text-transform: uppercase; letter-spacing: -.04em; }
#amar-lr[lang="ar"] .browse-head h1 { letter-spacing: 0; line-height: 1.2; }
#amar-lr .browse-head p { margin: 0; color: var(--muted); }
#amar-lr .gallery-wrap { position: relative; border-bottom: var(--rule); }
#amar-lr .gallery {
  display: grid; grid-auto-flow: column; grid-auto-columns: clamp(250px, 27vw, 340px);
  overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; overscroll-behavior-x: contain;
}
#amar-lr .gallery:focus-visible { outline-offset: -3px; }
#amar-lr .col { --c: var(--ink); border-top: 6px solid var(--c); scroll-snap-align: start; border-inline-end: var(--rule); display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto auto 1fr auto; gap: 10px; padding: 20px 20px 22px; background: var(--ground); min-width: 0; }
#amar-lr .col:hover { background: var(--white); }
#amar-lr .col-disc { position: relative; width: 78%; aspect-ratio: 1; justify-self: center; margin-bottom: 6px; }
#amar-lr .col-disc .disc { inset: 0; }
#amar-lr .col-disc .sheen { inset: 0; }
#amar-lr .col h3 { margin: 0; font-size: 21px; line-height: 1.15; letter-spacing: -.01em; }
#amar-lr .col h3 a { text-decoration: none; }
#amar-lr .col h3 a:hover { text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .col .col-alt { margin: -4px 0 0; color: var(--muted); font-size: 16px; }
#amar-lr .col-artist { margin: 0; font-weight: 800; }
#amar-lr .col dl { margin: 0; font-size: 14px; color: var(--muted); display: grid; gap: 2px; align-content: start; }
#amar-lr .col dl div { display: flex; gap: 6px; }
#amar-lr .col dt { font-weight: 700; color: var(--ink); }
#amar-lr .col dd { margin: 0; }
#amar-lr .col-actions { display: flex; align-items: center; gap: 10px 12px; flex-wrap: wrap; }
#amar-lr .col-actions a { white-space: nowrap; }
#amar-lr .col-actions .pbtn { font-size: 30px; }
#amar-lr .col-actions a { font-weight: 700; font-size: 14px; text-transform: uppercase; letter-spacing: .06em; }
#amar-lr[lang="ar"] .col-actions a { text-transform: none; letter-spacing: 0; }
#amar-lr .col .badge { justify-self: start; background: var(--gold); color: var(--ink); }
#amar-lr .garrow {
  position: absolute; top: clamp(90px, 11vw, 140px); z-index: 5; width: 54px; height: 54px; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--ink); color: var(--ground); display: grid; place-items: center; font-size: 22px;
}
#amar-lr .garrow:hover { background: var(--accent-deep); }
#amar-lr .garrow.prev { inset-inline-start: 10px; }
#amar-lr .garrow.next { inset-inline-end: 10px; }
#amar-lr .garrow.prev .i { transform: scaleX(-1); }
#amar-lr[dir="rtl"] .garrow.prev .i { transform: none; }
#amar-lr[dir="rtl"] .garrow.next .i { transform: scaleX(-1); }
#amar-lr .about { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); padding-block: clamp(28px, 5vw, 64px); border-bottom: var(--rule); }
#amar-lr .about h1 { margin: 0; font-size: clamp(36px, 5vw, 72px); line-height: .95; text-transform: uppercase; letter-spacing: -.04em; text-wrap: balance; }
#amar-lr[lang="ar"] .about h1 { letter-spacing: 0; line-height: 1.2; }
#amar-lr .about-body { display: grid; gap: 16px; font-size: 18px; max-width: 62ch; }
#amar-lr .about-body p { margin: 0; }
#amar-lr .about-body h2 { margin: 12px 0 0; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
#amar-lr[lang="ar"] .about-body h2 { text-transform: none; letter-spacing: 0; font-size: 15px; }
#amar-lr .keys { display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; margin: 0; font-size: 16px; }
#amar-lr .keys dt kbd { display: inline-block; min-width: 2.2em; text-align: center; padding: 2px 8px; border: 1.5px solid var(--ink); border-radius: 6px; font: 700 13px/1.6 var(--font); }
#amar-lr .keys dd { margin: 0; }
#amar-lr .proto { display: inline-block; margin-top: 8px; padding: 6px 12px; background: var(--white); border: 1px dashed var(--muted); font-size: 14px; color: var(--muted); }
#amar-lr .player {
  position: fixed; inset: auto 0 0 0; z-index: 120; min-height: var(--player);
  padding: 8px var(--edge) calc(8px + env(safe-area-inset-bottom, 0px));
  display: flex; align-items: center; gap: 14px; background: var(--ink); color: var(--ground);
}
#amar-lr .player .pbtn-lg { font-size: 40px; background: var(--ground); color: var(--ink); }
#amar-lr .player .pbtn-lg.is-playing { background: var(--accent); color: var(--white); }
#amar-lr .player-dot { flex: none; width: 34px; height: 34px; border-radius: 50%; background: repeating-radial-gradient(circle at 50% 50%, var(--vinyl) 0 1.4px, #34342f 1.4px 2.3px); box-shadow: 0 0 0 1px #444 inset; position: relative; }
#amar-lr .player-dot::after { content: ""; position: absolute; inset: 30%; border-radius: 50%; background: var(--dot, var(--accent)); }
#amar-lr.is-playing .player-dot { animation: turn 3s linear infinite; }
#amar-lr .player-text { flex: 0 1 auto; min-width: 0; text-decoration: none; display: grid; line-height: 1.25; }
#amar-lr .player-tags { flex: 1 0 auto; display: flex; align-items: center; gap: 10px; --tilt: -3deg; }
#amar-lr .player-tags .row-form { margin: 0; font-size: 11.5px; background: var(--dot, var(--accent)); color: var(--white); box-shadow: none; }
#amar-lr .player-tags .row-year { margin: 0; font-size: 13px; color: var(--ground); }
#amar-lr .player-title { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#amar-lr .player-artist { font-size: 14px; color: var(--line); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#amar-lr .player-text:hover .player-title { text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .player-mode { background: var(--ground); color: var(--ink); }
#amar-lr .player-mode.is-live { background: var(--accent-deep); color: var(--white); }
#amar-lr .player-time { font-weight: 700; font-variant-numeric: tabular-nums; min-width: 4.2em; text-align: end; }
#amar-lr .player.is-paused .player-time { animation: blink 1.2s steps(2, jump-none) infinite; }
#amar-lr .switch { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13px; color: var(--line); user-select: none; }
#amar-lr .switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
#amar-lr .switch-track { width: 34px; height: 20px; border-radius: 999px; background: #55554f; position: relative; transition: background .15s; }
#amar-lr .switch-track::after { content: ""; position: absolute; top: 3px; inset-inline-start: 3px; width: 14px; height: 14px; border-radius: 50%; background: var(--ground); transition: transform .15s; }
#amar-lr .switch input:checked + .switch-track { background: var(--accent); }
#amar-lr .switch input:checked + .switch-track::after { transform: translateX(14px); }
#amar-lr[dir="rtl"] .switch input:checked + .switch-track::after { transform: translateX(-14px); }
#amar-lr .switch input:focus-visible + .switch-track { outline: 2px solid var(--accent); outline-offset: 2px; }
#amar-lr .player.is-radio .switch { display: none; }
#amar-lr .splash { position: fixed; inset: 0; z-index: 400; background: var(--ink); color: var(--ground); display: grid; place-items: center; text-align: center; transition: opacity .9s ease; }
#amar-lr .splash.is-leaving { opacity: 0; }
#amar-lr .splash-inner { display: grid; justify-items: center; gap: 6px; padding: 24px; }
#amar-lr .splash-disc { width: min(42vw, 220px); aspect-ratio: 1; border-radius: 50%; margin-bottom: 18px; background: radial-gradient(circle, var(--ink) 0 3%, var(--accent) 3.4% 30%, transparent 30.4%), repeating-radial-gradient(circle, #1c1c1a 0 1.2px, #111110 1.2px 3px); animation: turn 6s linear infinite; }
#amar-lr .splash-mark { margin: 0; font-size: clamp(48px, 9vw, 110px); font-weight: 800; line-height: .9; letter-spacing: -.02em; font-family: var(--font); }
#amar-lr .splash-room { margin: 0; font-size: clamp(16px, 2vw, 22px); text-transform: uppercase; letter-spacing: .2em; }
#amar-lr[lang="ar"] .splash-room { letter-spacing: 0; }
#amar-lr .splash-sub { margin: 10px 0 0; color: var(--line); font-size: 15px; }
#amar-lr .splash-enter { margin-top: 22px; border: 1.5px solid var(--ground); background: transparent; color: var(--ground); border-radius: 999px; padding: 10px 26px; cursor: pointer; font-weight: 700; text-transform: uppercase; letter-spacing: .1em; font-size: 13px; }
#amar-lr .splash-enter:hover { background: var(--ground); color: var(--ink); }
/* the disc from AMAR's collection: the scan turns as the record */
#amar-lr .disc.has-photo { background: #111; }
#amar-lr .disc-photo { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; margin: 0; border-radius: 50%; object-fit: cover; }
/* record sheet: every side of the disc, zoomable, and what its label says */
#amar-lr .sheet { border-bottom: var(--rule); background: var(--white); }
#amar-lr .sheet-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 16px; padding: 22px var(--edge) 4px; }
#amar-lr .sheet-head h2 { margin: 0; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
#amar-lr[lang="ar"] .sheet-head h2 { font-size: 15px; letter-spacing: 0; }
#amar-lr .sheet-head p { margin: 0; color: var(--muted); font-size: 14px; }
#amar-lr .sheet-strip { list-style: none; margin: 0; padding: 10px var(--edge) 4px; display: flex; gap: 10px; overflow-x: auto; scrollbar-width: thin; }
#amar-lr .sheet-strip li { margin: 0; flex: none; }
#amar-lr .sheet .sheet-side {
  display: grid; justify-items: center; gap: 6px; width: 150px; min-height: 0; margin: 0; padding: 8px 6px;
  border: 1.5px solid transparent; border-radius: 12px; background: transparent; color: var(--ink); cursor: pointer;
  font: inherit; text-transform: none; letter-spacing: 0; box-shadow: none;
}
#amar-lr .sheet .sheet-side:hover { background: var(--ground); color: var(--ink); }
#amar-lr .sheet .sheet-side[aria-pressed="true"] { border-color: var(--ink); background: var(--ground); }
#amar-lr .sheet-side img { display: block; width: 96px; height: 96px; max-width: none; margin: 0; border-radius: 50%; box-shadow: 0 2px 6px rgba(0,0,0,.25); }
#amar-lr .sheet-side.is-other img { opacity: .7; }
#amar-lr .sheet-side span { font-size: 12.5px; line-height: 1.3; text-align: center; font-weight: 600; }
#amar-lr .sheet-side small { margin-top: -4px; color: var(--muted); font-size: 12px; line-height: 1.2; }
#amar-lr .sheet-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(20px, 4vw, 56px); padding: 14px var(--edge) 28px; align-items: start; }
#amar-lr .sheet-view { display: grid; justify-items: center; gap: 12px; }
#amar-lr .sheet .sheet-zoom {
  position: relative; display: block; width: min(100%, 560px); aspect-ratio: 1; min-height: 0; margin: 0; padding: 0;
  border: 0; border-radius: 50%; overflow: hidden; background: #111; cursor: zoom-in; box-shadow: 0 12px 34px rgba(0,0,0,.22);
}
#amar-lr .sheet .sheet-zoom:hover { background: #111; }
#amar-lr .sheet .sheet-zoom.is-zoomed { cursor: zoom-out; }
#amar-lr .sheet-img { display: block; width: 100%; height: 100%; max-width: none; margin: 0; border-radius: 0; transition: transform .35s var(--ease); }
#amar-lr .sheet-zoom.is-zoomed .sheet-img { transform: scale(2.4); }
#amar-lr .sheet-cap { margin: 0; max-width: 560px; text-align: center; font-size: 15px; line-height: 1.5; }
#amar-lr .sheet-cap span { color: var(--muted); font-size: 14px; }
#amar-lr .sheet-read h3 { margin: 2px 0 10px; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; }
#amar-lr[lang="ar"] .sheet-read h3 { font-size: 15px; letter-spacing: 0; }
#amar-lr .sheet-dl { margin: 0; border-top: var(--rule); }
#amar-lr .sheet-dl > div { display: grid; grid-template-columns: minmax(104px, 32%) minmax(0, 1fr); gap: 6px 14px; padding: 10px 0; border-bottom: 1px solid var(--line); }
#amar-lr .sheet-dl dt { padding-top: 3px; color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
#amar-lr[lang="ar"] .sheet-dl dt { font-size: 14px; text-transform: none; letter-spacing: 0; }
#amar-lr .sheet-dl dt small { display: block; font-size: 12px; font-weight: 600; text-transform: none; letter-spacing: 0; }
#amar-lr .sheet-dl dd { margin: 0; font-size: 17px; line-height: 1.5; overflow-wrap: anywhere; }
#amar-lr .sheet-dl .ln { display: block; text-align: left; }
#amar-lr[dir="rtl"] .sheet-dl .ln, #amar-lr[dir="rtl"] .sheet-dl dd { text-align: right; }
#amar-lr .sheet-dl bdi[lang="ar"], #amar-lr .sheet-dl .ln[lang="ar"] { font-family: var(--font-ar); font-size: 1.1em; }
#amar-lr .sheet-dl .sep { color: var(--muted); }
@keyframes turn { to { transform: rotate(360deg); } }
@keyframes pulse { 50% { opacity: .35; } }
@keyframes blink { 50% { opacity: 0; } }
@media (max-width: 900px) {
#amar-lr .record, #amar-lr .radio, #amar-lr .about, #amar-lr .more, #amar-lr .intro, #amar-lr .sheet-body { grid-template-columns: minmax(0, 1fr); }
#amar-lr .stage { border-inline-end: 0; border-bottom: var(--rule); }
#amar-lr .radio .stage { border-bottom: var(--rule); }
#amar-lr .more section + section { border-inline-start: 0; border-top: var(--rule); }
#amar-lr .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#amar-lr .stat:nth-child(2) { border-inline-end: 0; }
#amar-lr .stat:nth-child(-n+2) { border-bottom: 1px solid var(--line); }

}
@media (max-width: 640px) {
#amar-lr { --player: 64px; }
#amar-lr .alr-tabs { justify-content: space-between; padding-inline: calc(var(--edge) - 8px); }
#amar-lr .alr-tabs a { padding: 0 6px; font-size: 12px; letter-spacing: .03em; }
#amar-lr[lang="ar"] .alr-tabs a { font-size: 14px; }
#amar-lr .switch-label, #amar-lr .player-mode { display: none; }
#amar-lr .player { gap: 10px; }
#amar-lr .player-dot { display: none; }
#amar-lr .player-tags { display: none; }
#amar-lr .player-text { flex: 1; }
#amar-lr .sort span { display: none; }
#amar-lr .garrow { width: 44px; height: 44px; font-size: 18px; }
#amar-lr .row-go { display: none; }
#amar-lr .deck-buttons { gap: 12px; }

}
@media (prefers-reduced-motion: reduce) {
#amar-lr *, #amar-lr *::before, #amar-lr *::after { transition-duration: .01ms !important; }
#amar-lr .tick.ticks > span, #amar-lr .row-eq i, #amar-lr .disc, #amar-lr .splash-disc, #amar-lr.is-playing .player-dot, #amar-lr .player.is-paused .player-time, #amar-lr.radio-playing .onair-dot { animation: none !important; }
#amar-lr .sheet-img { transition: none; }

}
#amar-lr .eyebrow-c { color: var(--c, var(--accent-deep)); }
#amar-lr .record .cartel { border-top: 6px solid var(--c, var(--ink)); }
#amar-lr .record .progress > i { background: var(--c, var(--accent)); }
#amar-lr .controls.is-filtered { box-shadow: inset 0 -5px 0 var(--c); }
#amar-lr .grp { --c: var(--ink); --cf: #ffffff; }
#amar-lr .grp-head {
  display: flex; align-items: center; gap: 14px; padding: 10px var(--edge); background: var(--c); color: var(--cf);
  border-bottom: var(--rule); position: relative;
}
#amar-lr .grp-head h2 { margin: 0; flex: 1; min-width: 0; display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; font-size: clamp(20px, 2vw, 27px); line-height: 1.1; letter-spacing: -.015em; font-weight: 700; }
#amar-lr[lang="ar"] .grp-head h2 { letter-spacing: 0; }
#amar-lr .grp-sub { font-size: 14px; font-weight: 500; letter-spacing: 0; opacity: .85; }
#amar-lr .grp-count { font-size: clamp(20px, 2vw, 27px); font-weight: 600; font-variant-numeric: tabular-nums; opacity: .9; }
#amar-lr .grp-head .pbtn { font-size: 28px; background: var(--cf); color: var(--c); }
#amar-lr .grp-head .pbtn:hover { background: var(--ink); color: var(--white); }
#amar-lr .grp-more {
  display: flex; width: 100%; align-items: center; justify-content: center; gap: 10px; min-height: 52px;
  border: 0; border-bottom: var(--rule); background: color-mix(in srgb, var(--c) 10%, var(--ground)); color: var(--ink);
  font-weight: 800; font-size: 15px; text-transform: uppercase; letter-spacing: .08em; cursor: pointer;
}
#amar-lr[lang="ar"] .grp-more { text-transform: none; letter-spacing: 0; font-size: 16px; }
#amar-lr .grp-more::after { content: ""; width: 9px; height: 9px; border-right: 2.5px solid currentColor; border-bottom: 2.5px solid currentColor; transform: translateY(-3px) rotate(45deg); }
#amar-lr .grp-more[aria-expanded="true"]::after { transform: translateY(2px) rotate(-135deg); }
#amar-lr .grp-more:hover { background: var(--c); color: var(--white); }
#amar-lr .legend { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 18px; font-size: 16px; }
#amar-lr .legend li { display: flex; align-items: baseline; gap: 10px; }
#amar-lr .legend .sw { flex: none; width: 14px; height: 14px; background: var(--c); transform: translateY(2px); }
#amar-lr .legend small { color: var(--muted); font-size: 14px; }
@media (max-width: 640px) {
#amar-lr .grp-head { gap: 10px; padding-block: 12px; }
#amar-lr .grp-head .pbtn { font-size: 28px; }
#amar-lr .grp-sub { font-size: 13px; }
#amar-lr .row-air { display: none !important; }

}

#amar-lr .intro--plain { grid-template-columns: minmax(0, 1fr); padding-block: clamp(20px, 3vw, 36px) 22px; }
#amar-lr .intro--plain p { font-size: clamp(18px, 1.6vw, 22px); max-width: 60ch; }
/* the theme also styles these class names (.record = glossary record view, .chip, .badge, .gallery) and all
   headings (uppercase): undo what would leak into the room */
#amar-lr h1, #amar-lr h2, #amar-lr h3 { text-transform: none; letter-spacing: normal; font-family: inherit; color: inherit; }
#amar-lr .record, #amar-lr .radio { width: auto; max-width: none; margin: 0; container-type: normal; position: relative; }
#amar-lr .chip { min-height: 0; border: 0; border-radius: 999px; }
#amar-lr .badge { padding: 0 10px; line-height: normal; border-radius: 999px; text-decoration: none; }
#amar-lr .gallery { grid-template-columns: none; gap: 0; margin: 0; }

/* the tabs inside the AMAR site's coloured head (tools-in-the-head preview): the on-air dot */
.ed-strip .alr-tabs a { display: inline-flex; align-items: center; gap: 7px; }
.ed-strip .alr-tabs .onair-dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; opacity: .4; }
.ed-strip .alr-tabs.radio-online .onair-dot { background: #a8432a; opacity: 1; }
.ed-strip .alr-tabs.radio-playing .onair-dot { animation: pulse 1.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .ed-strip .alr-tabs.radio-playing .onair-dot { animation: none; } }

/* phones: the tonearm hangs past the turntable's right edge; a slightly smaller turntable keeps the arm on screen
   (the page scrolled 23 px sideways, and the arm was cut in Arabic) */
@media (max-width: 640px) { #amar-lr .turntable { width: min(84%, 520px); } }

/* What the podcast presenters say about the recording (composer, lyricist, maqam, rhythm, musicians, notes) */
#amar-lr .podfacts { margin-top: 22px; }
#amar-lr .podfacts h2 { margin: 0 0 4px; font-size: 13px; text-transform: uppercase; letter-spacing: .08em; font-weight: 700; color: var(--c, var(--muted)); }
#amar-lr[lang="ar"] .podfacts h2 { text-transform: none; letter-spacing: 0; font-size: 15px; }
#amar-lr .podfacts .role { color: var(--muted); font-size: .92em; }
#amar-lr .pf-notes { margin: 12px 0 0; padding-inline-start: 18px; display: grid; gap: 6px; font-size: 14px; line-height: 1.5; }
#amar-lr .pf-src { margin: 10px 0 0; font-size: 12.5px; color: var(--muted); }

/* ===== Recordings (the register) + the shelf — 2026-10-12, the user chose mock-ups A + B's shelf =====
   White ground (no cream). The room is the Music dimension (navy); the five other dimensions keep the home doors'
   colours: people terracotta, works orange, musical language ochre, record companies olive, places & periods
   powder blue. Nothing turns. */
#amar-lr { --ground: #ffffff; --navy: #32365f; --soft: #f3f4f9; --hair: #e3e3df; }
html.alr-lock { overflow: hidden; }

/* the layout: wide = filters | list | panel; medium = list | panel (filters folded); narrow = one column */
#amar-lr .reg { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 28px; padding: 22px var(--edge) 48px; align-items: start; }
#amar-lr.is-wide .reg { grid-template-columns: 216px minmax(0, 1fr) minmax(360px, 410px); }
#amar-lr:not(.is-wide):not(.is-narrow) .reg { grid-template-columns: minmax(0, 1fr) minmax(330px, 370px); }
#amar-lr .reg-ftoggle {
  display: none; grid-column: 1 / -1; justify-self: start; align-items: center; gap: 8px; min-height: 44px; margin-bottom: 14px; padding: 0 18px;
  border: 1.5px solid var(--ink); border-radius: 22px; background: #fff; font-size: 14px; font-weight: 800; cursor: pointer;
}
#amar-lr .reg-ftoggle::after { content: ""; width: 7px; height: 7px; border: solid currentColor; border-width: 0 1.8px 1.8px 0; transform: translateY(-2px) rotate(45deg); }
#amar-lr.facets-open .reg-ftoggle::after { transform: translateY(2px) rotate(225deg); }
#amar-lr .reg-ftoggle:hover { background: var(--ink); color: #fff; }
#amar-lr:not(.is-wide) .reg-ftoggle { display: inline-flex; }
#amar-lr .reg-facets { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
#amar-lr:not(.is-wide) .reg-facets { display: none; grid-column: 1 / -1; }
#amar-lr:not(.is-wide).facets-open .reg-facets {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 20px 26px; align-items: start;
  margin-bottom: 22px; padding-bottom: 22px; border-bottom: var(--rule);
}

/* the filters */
#amar-lr .fct-h { display: flex; align-items: center; gap: 9px; margin: 0 0 6px; font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
#amar-lr[lang="ar"] .fct-h { letter-spacing: 0; text-transform: none; font-size: 15px; }
#amar-lr .fct-h .sw { flex: none; width: 14px; height: 14px; background: var(--dc); }
#amar-lr .fct-sub { margin: 10px 0 4px; font-size: 11.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
#amar-lr[lang="ar"] .fct-sub { letter-spacing: 0; text-transform: none; font-size: 13px; }
#amar-lr .fct-list { border-top: 2px solid var(--ink); }
#amar-lr .fct-opt {
  display: flex; justify-content: space-between; align-items: baseline; gap: 10px; width: 100%; min-height: 36px; padding: 6px 8px;
  border: 0; border-bottom: 1px solid var(--hair); background: transparent; color: var(--ink); font-size: 14px; font-weight: 600; line-height: 1.3; text-align: start; cursor: pointer;
}
#amar-lr .fct-opt:hover { background: color-mix(in srgb, var(--dc) 16%, #ffffff); }
#amar-lr .fct-opt[aria-pressed="true"] { background: var(--dc); color: var(--df); }
#amar-lr .fct-l { min-width: 0; overflow-wrap: anywhere; }
#amar-lr .fct-l small { display: block; font-size: 13px; font-weight: 500; opacity: .8; }
#amar-lr .fct-n { flex: none; font-size: 12.5px; font-weight: 700; opacity: .72; font-variant-numeric: tabular-nums; }
#amar-lr .fct-more { margin-top: 4px; min-height: 36px; padding: 4px 8px; border: 0; background: none; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

/* the list */
#amar-lr .reg-list { min-width: 0; }
#amar-lr .reg-head { display: flex; justify-content: space-between; align-items: baseline; gap: 6px 14px; flex-wrap: wrap; padding-bottom: 8px; border-bottom: var(--rule); }
#amar-lr .reg-head h2 { font-size: clamp(19px, 1.6vw, 24px); font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
#amar-lr .reg-head h2 { flex: 1 1 auto; }
#amar-lr .reg-clear { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 14px; border: 1.5px solid var(--ink); border-radius: 18px; background: #ffffff; color: var(--ink); font-size: 13px; font-weight: 800; cursor: pointer; }
#amar-lr .reg-clear:hover { background: var(--ink); color: #ffffff; }
#amar-lr.is-narrow .reg-clear { min-height: 44px; }
#amar-lr[lang="ar"] .reg-head h2 { letter-spacing: 0; }
#amar-lr .reg-row {
  --c: var(--ink); position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 14px; align-items: center;
  padding: 9px 8px; border-bottom: 1px solid var(--hair); transition: background .15s; content-visibility: auto; contain-intrinsic-size: auto 72px;
}
#amar-lr .reg-row:hover { background: var(--soft); }
#amar-lr .reg-row.is-current, #amar-lr .reg-row.is-onair { background: color-mix(in srgb, var(--c) 9%, #ffffff); }
#amar-lr .reg-row.is-sel { background: #e9eaf3; box-shadow: inset 4px 0 0 var(--navy); }
#amar-lr[dir="rtl"] .reg-row.is-sel { box-shadow: inset -4px 0 0 var(--navy); }
#amar-lr .reg-disc {
  position: relative; z-index: 2; display: grid; place-items: center; width: 52px; height: 52px; padding: 0; border: 0; border-radius: 50%;
  background: var(--vinyl); overflow: hidden; cursor: pointer; transition: box-shadow .15s;
}
#amar-lr .reg-disc img, #amar-lr .reg-drawn, #amar-lr .reg-drawn svg { grid-area: 1 / 1; display: block; width: 100%; height: 100%; max-width: none; border-radius: 50%; object-fit: cover; }
#amar-lr .reg-ico {
  grid-area: 1 / 1; z-index: 1; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%;
  background: rgba(255,255,255,.94); color: var(--ink); opacity: 0; transition: opacity .15s;
}
#amar-lr .reg-ico .i { grid-area: 1 / 1; width: 12px; height: 12px; }
#amar-lr .reg-ico .i-pause { display: none; }
#amar-lr .reg-ico .spin { display: none; grid-area: 1 / 1; width: 100%; height: 100%; border-radius: 50%; border: 2px solid var(--c); animation: pulse 1s ease-in-out infinite; }
#amar-lr .reg-row:hover .reg-ico, #amar-lr .reg-disc:focus-visible .reg-ico, #amar-lr .reg-disc.is-playing .reg-ico, #amar-lr .reg-disc.is-loading .reg-ico { opacity: 1; }
@media (hover: none) { #amar-lr .reg-ico { opacity: 1; } }
#amar-lr .reg-disc.is-playing { box-shadow: 0 0 0 3px #ffffff, 0 0 0 5px var(--c); }
#amar-lr .reg-disc.is-playing .i-play { display: none; }
#amar-lr .reg-disc.is-playing .i-pause { display: block; }
#amar-lr .reg-disc.is-loading .spin { display: block; }
#amar-lr .reg-link { display: block; min-width: 0; padding-block: 2px; }
#amar-lr .reg-link::after { content: ""; position: absolute; inset: 0; }
#amar-lr .reg-link:focus-visible { outline: none; }
#amar-lr .reg-link:focus-visible::after { outline: 2px solid var(--accent); outline-offset: -2px; }
#amar-lr .reg-l1 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
#amar-lr .reg-t { font-size: 16.5px; font-weight: 700; line-height: 1.3; }
#amar-lr .reg-alt { font-size: 16px; line-height: 1.3; color: var(--c); }
#amar-lr .reg-l2 { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 0; margin-top: 3px; font-size: 13.5px; color: #3d3d39; }
#amar-lr .reg-a { font-weight: 600; color: var(--ink); }
#amar-lr .reg-l2 .row-form { font-size: 11px; margin-inline-start: .8em; }
#amar-lr .reg-l2 .row-co { font-size: 11px; }
#amar-lr .reg-l2 .row-year { font-size: 11.5px; }
#amar-lr[lang="ar"] .reg-l2 .row-form, #amar-lr[lang="ar"] .reg-l2 .row-co { font-size: 12.5px; }
#amar-lr .reg-dur { font-size: 13px; color: var(--muted); }
#amar-lr .reg-more {
  display: block; width: 100%; min-height: 48px; margin-top: 18px; border: var(--rule); background: #ffffff; color: var(--ink);
  font-size: 14px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; cursor: pointer;
}
#amar-lr[lang="ar"] .reg-more { letter-spacing: 0; text-transform: none; font-size: 15px; }
#amar-lr .reg-more:hover { background: var(--ink); color: #ffffff; }

/* the record panel */
#amar-lr .reg-sheet {
  --top: calc(var(--head-b, var(--alr-top, 0px)) + var(--alr-ctl, 0px) + 14px);
  position: sticky; top: var(--top); max-height: calc(100vh - var(--top) - 14px - var(--pl, 0px)); overflow: auto; overscroll-behavior: contain;
  border: var(--rule); background: #ffffff; scrollbar-width: thin;
}
#amar-lr.has-player .reg-sheet { --pl: var(--player); }
#amar-lr .reg-sheet:focus { outline: none; }
#amar-lr .sh-bar { display: flex; align-items: center; gap: 8px; padding: 4px 8px; background: var(--ink); color: #ffffff; }
#amar-lr .sh-back { display: none; align-items: center; gap: 8px; min-height: 44px; padding: 0 8px; font-size: 14px; font-weight: 700; }
#amar-lr .sh-back .i { width: 18px; height: 18px; }
#amar-lr .sh-back-i { transform: scaleX(-1); }
#amar-lr[dir="rtl"] .sh-back-i { transform: none; }
#amar-lr .sh-nav { display: flex; gap: 2px; margin-inline-start: auto; }
#amar-lr .sh-nav .ibtn { width: 44px; height: 44px; color: #ffffff; font-size: 16px; }
#amar-lr .vw { display: grid; justify-items: center; gap: 10px; padding: 8px 18px 14px; background: var(--ink); color: #ffffff; }
#amar-lr .vw-zoom { position: relative; width: min(100%, 330px); aspect-ratio: 1; padding: 0; border: 0; border-radius: 4px; background: #111111; overflow: hidden; cursor: zoom-in; }
#amar-lr .vw-zoom.is-disc { border-radius: 50%; background: transparent; }
#amar-lr .vw-zoom.is-zoomed { cursor: zoom-out; }
#amar-lr .vw-img { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; transition: transform .35s var(--ease); }
#amar-lr .vw-zoom.is-zoomed .vw-img { transform: scale(2.4); }
#amar-lr .vw-drawn { width: min(100%, 290px); }
#amar-lr .vw-drawn svg { display: block; width: 100%; height: auto; }
#amar-lr .vw-sides { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
#amar-lr .vw-side, #amar-lr .vw-turn {
  display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 13px; border: 1px solid rgba(255,255,255,.75); border-radius: 18px;
  background: transparent; color: #ffffff; font-size: 12.5px; font-weight: 700; cursor: pointer;
}
#amar-lr .vw-turn { min-height: 42px; padding: 0 18px; font-size: 13.5px; font-weight: 800; }
#amar-lr .vw-turn .i { width: 16px; height: 16px; }
#amar-lr .vw-side[aria-pressed="true"], #amar-lr .vw-side:hover, #amar-lr .vw-turn:hover { background: #ffffff; color: var(--ink); }
#amar-lr .vw-cap { max-width: 44ch; font-size: 13px; line-height: 1.45; text-align: center; color: #d9d9d4; }
#amar-lr .vw-cap b { color: #ffffff; }
#amar-lr .vw-cap span { color: #b5b5b0; }
#amar-lr .sh-body { padding: 16px 20px 6px; }
#amar-lr .sh-kick { font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
#amar-lr[lang="ar"] .sh-kick { letter-spacing: 0; font-size: 13px; }
#amar-lr .reg-sheet h2 { margin-top: 4px; font-size: clamp(22px, 1.9vw, 28px); line-height: 1.12; font-weight: 700; letter-spacing: -.025em; }
#amar-lr .reg-sheet h2[lang="ar"], #amar-lr .shelf-drawer h3[lang="ar"] { letter-spacing: 0; line-height: 1.35; }
#amar-lr .sh-alt { margin-top: 4px; font-size: 20px; line-height: 1.35; color: var(--c); }
#amar-lr .sh-by { margin-top: 6px; font-size: 16px; font-weight: 700; }
#amar-lr .sh-by span { font-weight: 500; color: var(--muted); }
#amar-lr .sh-play { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 14px 0 4px; }
#amar-lr .sh-play .pbtn { font-size: 44px; background: var(--navy); color: #ffffff; }
#amar-lr .sh-play .pbtn.is-playing { background: var(--accent-deep); }
#amar-lr .sh-play-l { font-size: 14px; font-weight: 800; }
#amar-lr .sh-radio { margin-inline-start: auto; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .sh-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; margin-top: 12px; }
#amar-lr .sh-facts > div { padding: 7px 0; border-top: 1px solid var(--hair); }
#amar-lr .sh-facts > .wide { grid-column: 1 / -1; }
#amar-lr .sh-facts dt { font-size: 11.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
#amar-lr[lang="ar"] .sh-facts dt { letter-spacing: 0; text-transform: none; font-size: 13px; }
#amar-lr .sh-facts dd { margin: 2px 0 0; font-size: 14.5px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere; }
#amar-lr .sh-facts .role { color: var(--muted); font-weight: 500; }
#amar-lr .sh-body .pf-notes { margin-top: 10px; }
#amar-lr .sh-read:not(:empty) { margin-top: 12px; padding: 12px 14px; background: var(--soft); }
#amar-lr .sh-read h3 { margin: 0 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--navy); }
#amar-lr[lang="ar"] .sh-read h3 { letter-spacing: 0; text-transform: none; font-size: 14px; }
#amar-lr .sh-read .sheet-dl { border-top: 1px solid var(--ink); }
#amar-lr .sh-read .sheet-dl > div { grid-template-columns: minmax(92px, 34%) minmax(0, 1fr); padding: 7px 0; }
#amar-lr .sh-read .sheet-dl dt { font-size: 11px; }
#amar-lr .sh-read .sheet-dl dd { font-size: 14px; }
#amar-lr .sh-follow { margin-top: 14px; }
#amar-lr .sh-follow h3 { padding: 0 20px 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
#amar-lr[lang="ar"] .sh-follow h3 { letter-spacing: 0; text-transform: none; font-size: 14px; }
#amar-lr .fl-band { background: var(--dc); color: var(--df); }
#amar-lr .fl-go { display: flex; align-items: center; gap: 12px; width: 100%; padding: 11px 20px; border: 0; background: transparent; color: inherit; font: inherit; text-align: start; }
#amar-lr button.fl-go { cursor: pointer; }
#amar-lr button.fl-go:hover { background: rgba(0,0,0,.08); }
#amar-lr .fl-txt { display: grid; flex: 1; min-width: 0; }
#amar-lr .fl-dim { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
#amar-lr[lang="ar"] .fl-dim { letter-spacing: 0; text-transform: none; font-size: 12.5px; }
#amar-lr .fl-v { font-size: 15.5px; font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
#amar-lr .fl-sub { font-size: 12.5px; line-height: 1.35; opacity: .92; }
#amar-lr .fl-arrow { width: 18px; height: 18px; transition: translate .2s; }
#amar-lr button.fl-go:hover .fl-arrow { translate: 4px 0; }
#amar-lr[dir="rtl"] button.fl-go:hover .fl-arrow { translate: -4px 0; }
#amar-lr .fl-pages { display: flex; flex-wrap: wrap; gap: 2px 16px; padding: 0 20px 10px; margin-top: -4px; }
#amar-lr .fl-page { display: inline-flex; align-items: center; min-height: 32px; font-size: 13px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .fl-ep { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 20px; border-top: var(--rule); font-size: 14px; font-weight: 700; }
#amar-lr .fl-ep small { display: block; font-size: 13px; font-weight: 500; color: var(--muted); }
#amar-lr .fl-ep .i { width: 16px; height: 16px; }

/* narrow: the panel opens over the list */
#amar-lr.is-narrow .reg-sheet { display: none; }
#amar-lr.is-narrow.sheet-open .reg-sheet {
  display: block; position: fixed; inset: 0; z-index: 9990; max-height: none; border: 0; padding-bottom: calc(var(--pl, 0px) + 24px);
}
#amar-lr.is-narrow .sh-back { display: inline-flex; }
#amar-lr.is-narrow .sh-bar { position: sticky; top: 0; z-index: 3; }
#amar-lr.sheet-open .player { z-index: 9995; }
#amar-lr.is-narrow .fct-opt { min-height: 44px; }

/* the toolbar in the site's head: chips with dark text on light colours; the "Arrange by" label */
.ed-strip .alr-tools .ed-chip[data-dark][aria-pressed="true"] { color: #1d1d1b; }
.ed-strip .alr-tools .ed-chip .x { margin-inline-start: 2px; font-size: .9em; }
.ed-strip .alr-tools .alr-arr-l { font-size: 12.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; opacity: .85; }
.lang-ar .ed-strip .alr-tools .alr-arr-l { letter-spacing: 0; text-transform: none; font-size: 14px; }
#amar-lr .fchip[data-dark][aria-pressed="true"] { color: var(--ink); }

/* the shelf */
#amar-lr .shelves { padding: 6px var(--edge) 56px; }
#amar-lr .shelf { margin-top: 30px; }
#amar-lr .shelf-h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; }
#amar-lr .shelf-h h2 { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; flex: 1 1 auto; }
#amar-lr .shelf-name { padding: 2px 10px; background: var(--dc); color: var(--df); font-size: clamp(19px, 1.7vw, 24px); font-weight: 800; letter-spacing: -.02em; }
#amar-lr[lang="ar"] .shelf-name { letter-spacing: 0; }
#amar-lr .shelf-other { font-size: 18px; font-weight: 600; }
#amar-lr .shelf-n { font-size: 13.5px; color: var(--muted); }
#amar-lr .shelf-list { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 14px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
#amar-lr .shelf-list .i { width: 14px; height: 14px; }
#amar-lr .shelf-rail { position: relative; }
#amar-lr .shelf-row { display: flex; align-items: flex-end; gap: 16px; overflow-x: auto; padding: 24px 4px 0; border-bottom: 6px solid var(--ink); scrollbar-width: thin; scroll-snap-type: x proximity; }
#amar-lr .shelf-row li { flex: none; scroll-snap-align: start; }
#amar-lr .shelf-disc { display: block; width: 128px; padding: 0 0 10px; border: 0; background: transparent; color: var(--ink); text-align: center; cursor: pointer; transition: transform .25s cubic-bezier(.3,.7,.3,1); }
#amar-lr .shelf-disc:hover { transform: translateY(-8px); }
#amar-lr .shelf-disc.is-out { transform: translateY(-16px); }
#amar-lr .sd-disc { display: block; width: 120px; height: 120px; margin: 0 auto; border-radius: 50%; overflow: hidden; background: var(--vinyl); box-shadow: 0 6px 14px rgba(0,0,0,.2); }
#amar-lr .sd-disc img, #amar-lr .sd-draw, #amar-lr .sd-draw svg { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
#amar-lr .shelf-disc.is-out .sd-disc { box-shadow: 0 0 0 4px #ffffff, 0 0 0 7px var(--navy); }
#amar-lr .shelf-disc.is-current .sd-disc { box-shadow: 0 0 0 4px #ffffff, 0 0 0 7px var(--c); }
#amar-lr .sd-who { display: block; margin-top: 8px; font-size: 12.5px; font-weight: 700; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#amar-lr .sd-sub { display: block; font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#amar-lr .shelf-rail .garrow { top: 58px; width: 44px; height: 44px; font-size: 18px; }
#amar-lr .shelf-rail .garrow.prev { inset-inline-start: -10px; }
#amar-lr .shelf-rail .garrow.next { inset-inline-end: -10px; }
#amar-lr .shelf-drawer { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); background: var(--ink); color: #ffffff; }
#amar-lr .shelf-drawer .vw { align-content: start; padding: 28px 24px; }
#amar-lr .shelf-drawer .vw-zoom { width: min(100%, 400px); }
#amar-lr .dr-body { position: relative; min-width: 0; padding: 26px 30px 28px; }
#amar-lr .dr-close { position: absolute; top: 10px; inset-inline-end: 10px; width: 44px; height: 44px; color: #ffffff; }
#amar-lr .shelf-drawer .sh-kick { color: #e8c26a; }
#amar-lr .shelf-drawer h3 { margin-top: 6px; padding-inline-end: 44px; font-size: clamp(24px, 2.4vw, 34px); line-height: 1.08; font-weight: 700; letter-spacing: -.03em; }
#amar-lr .shelf-drawer .sh-alt { color: #ffffff; opacity: .9; }
#amar-lr .shelf-drawer .sh-by span { color: #cfcfca; }
#amar-lr .shelf-drawer .sh-play .pbtn { background: #ffffff; color: var(--ink); }
#amar-lr .shelf-drawer .sh-play .pbtn.is-playing { background: #e8c26a; }
#amar-lr .shelf-drawer .sh-radio { color: #ffffff; }
#amar-lr .shelf-drawer .sh-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#amar-lr .shelf-drawer .sh-facts > div { border-top-color: rgba(255,255,255,.2); }
#amar-lr .shelf-drawer .sh-facts dt { color: #b5b5b0; }
#amar-lr .dr-fh { margin: 18px 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #b5b5b0; }
#amar-lr[lang="ar"] .dr-fh { letter-spacing: 0; text-transform: none; font-size: 14px; }
#amar-lr .dr-follow { display: flex; flex-wrap: wrap; gap: 8px; }
#amar-lr .dr-follow .fl-band { flex: 0 1 auto; max-width: 100%; }
#amar-lr .dr-follow .fl-go { padding: 8px 14px; }
#amar-lr .dr-follow .fl-sub, #amar-lr .dr-follow .fl-arrow, #amar-lr .dr-follow .fl-ep small, #amar-lr .dr-follow .fl-ep .i { display: none; }
#amar-lr .dr-follow .fl-ep { padding: 8px 14px; border: 0; background: #ffffff; color: var(--ink); }
#amar-lr .dr-open { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 14px; font-size: 14.5px; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .dr-open .i { width: 16px; height: 16px; }
@media (max-width: 760px) {
#amar-lr .shelf-drawer { grid-template-columns: minmax(0, 1fr); }
#amar-lr .shelf-drawer .sh-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#amar-lr .dr-body { padding: 20px 18px 24px; }
#amar-lr .shelf-disc { width: 104px; }
#amar-lr .sd-disc { width: 96px; height: 96px; }
#amar-lr .shelf-rail .garrow { display: none; }
#amar-lr .reg-row { grid-template-columns: 48px minmax(0, 1fr); gap: 12px; }
#amar-lr .reg-disc { width: 48px; height: 48px; }
#amar-lr .reg-dur { display: none; }
}
@media (prefers-reduced-motion: reduce) {
#amar-lr .shelf-disc, #amar-lr .vw-img, #amar-lr .fl-arrow { transition: none; }
#amar-lr .reg-ico .spin { animation: none; }
}

/* the AMAR Radio band (amar-radio radio-links.css) inside the room: undo the room's link reset on its button */
#amar-lr .amr-band { margin: 14px 0 6px; }
#amar-lr a.amr-btn { color: var(--c); text-decoration: none; }
#amar-lr a.amr-btn:hover { text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .shelf-drawer .amr-band { box-shadow: 0 0 0 1px rgba(255,255,255,.25); }
/* when the band says which programme plays the record, the plain "full recording on AMAR Radio" link is redundant */
#amar-lr .sh-play:has(+ .amr:not([hidden])) .sh-radio { display: none; }

/* ===== Al-Khizāna «الخزانة» (preview, 2026-10-13; mock-up G): boxes, finding aid, your slip, evenings, the desk ===== */
#amar-lr .kz { padding: 24px var(--edge) 56px; }
#amar-lr .kz-mono { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; direction: ltr; unicode-bidi: isolate; letter-spacing: .02em; }
#amar-lr .kz-kick { font-size: 12.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
#amar-lr[lang="ar"] .kz-kick { letter-spacing: 0; text-transform: none; font-size: 13.5px; }
/* the wall of boxes */
#amar-lr .kz-boxes { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 10px; align-items: end; padding-top: 14px; border-bottom: 8px solid var(--ink); }
#amar-lr .kz-box {
  display: flex; flex-direction: column; height: var(--h, 180px); border: 2px solid var(--ink); border-bottom: 0; background: #ffffff; color: var(--ink);
  text-decoration: none; transition: transform .2s; overflow: hidden;
}
#amar-lr .kz-box:hover { transform: translateY(-5px); }
#amar-lr .kz-box.is-open { transform: translateY(-12px); box-shadow: 0 0 0 3px #ffffff, 0 0 0 6px var(--navy); }
#amar-lr .kz-box-band { display: block; height: 10px; flex: none; background: var(--bc); }
#amar-lr .kz-code { padding: 10px 10px 0; font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; font-size: 21px; font-weight: 600; letter-spacing: .04em; direction: ltr; text-align: start; }
#amar-lr .kz-bname { padding: 4px 10px 0; font-size: 13px; font-weight: 700; line-height: 1.3; }
#amar-lr .kz-bother { padding: 2px 10px 0; font-size: 12.5px; color: var(--muted); line-height: 1.3; }
#amar-lr .kz-bfoot { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 8px 10px 10px; font-size: 12px; font-weight: 700; color: var(--muted); }
#amar-lr .kz-bfoot img { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; object-position: top; flex: none; }
#amar-lr .kz-bfoot img.is-face, #amar-lr .kz-aid-h img.is-face { filter: grayscale(1); }
/* the open box and the slip */
#amar-lr .kz-cols { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 34px; align-items: start; margin-top: 26px; }
#amar-lr .kz-aid-h { display: flex; gap: 18px; align-items: center; padding-bottom: 14px; border-bottom: var(--rule); }
#amar-lr .kz-aid-h img { width: 76px; height: 92px; object-fit: cover; object-position: top; flex: none; }
#amar-lr .kz-aid-h h2 { margin-top: 2px; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.15; font-weight: 700; letter-spacing: -.03em; }
#amar-lr[lang="ar"] .kz-aid-h h2 { letter-spacing: 0; }
#amar-lr .kz-aid-h h2 span { font-weight: 600; color: var(--muted); letter-spacing: 0; }
#amar-lr .kz-scope { margin-top: 6px; font-size: 14.5px; color: #3d3d39; }
#amar-lr .kz-tr, #amar-lr .kz-row { display: grid; grid-template-columns: 100px minmax(0, 1fr) 190px 150px 60px 140px; gap: 12px; align-items: center; padding: 9px 8px; border-bottom: 1px solid var(--hair); font-size: 14px; }
#amar-lr .kz-th { border-bottom-color: var(--ink); font-size: 11px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
#amar-lr[lang="ar"] .kz-th { letter-spacing: 0; text-transform: none; font-size: 13px; }
#amar-lr .kz-row:hover { background: var(--soft); }
#amar-lr .kz-row.is-open { background: var(--soft); box-shadow: inset 4px 0 0 var(--c); }
#amar-lr[dir="rtl"] .kz-row.is-open { box-shadow: inset -4px 0 0 var(--c); }
#amar-lr .kz-call { color: var(--navy); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; font-size: 14px; }
#amar-lr .kz-t b { font-size: 15px; }
#amar-lr .kz-alt { color: var(--c); }
#amar-lr .kz-dim { color: #3d3d39; }
#amar-lr .kz-act { display: flex; gap: 6px; align-items: center; }
#amar-lr .kz-act .pbtn { font-size: 34px; background: var(--navy); color: #ffffff; }
#amar-lr .kz-slipbtn { min-height: 34px; padding: 0 10px; border: 1px solid var(--ink); background: #ffffff; color: var(--ink); font-size: 12.5px; font-weight: 800; cursor: pointer; white-space: nowrap; }
#amar-lr .kz-slipbtn[aria-pressed="true"] { background: var(--gold); border-color: var(--gold); }
#amar-lr .sh-play .kz-slipbtn { min-height: 40px; margin-inline-start: auto; }
#amar-lr .kz-item { border-bottom: var(--rule); background: var(--soft); }
#amar-lr .kz-item-in { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 26px; padding: 18px 16px 22px; }
#amar-lr .kz-item .vw { padding: 14px; border-radius: 4px; }
#amar-lr .kz-item h3 { margin-top: 4px; font-size: 24px; line-height: 1.15; font-weight: 700; letter-spacing: -.02em; }
#amar-lr .kz-fh { margin: 14px 0 6px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
#amar-lr .kz-follow .fl-ep { background: var(--ink); color: #ffffff; }
#amar-lr .kz-item .dr-open { color: var(--ink); }
#amar-lr .kz-foot { margin-top: 14px; font-size: 14px; color: var(--muted); }
#amar-lr .kz-slip { position: sticky; top: calc(var(--head-b, var(--alr-top, 0px)) + 14px); border: var(--rule); background: #ffffff; max-height: calc(100vh - var(--head-b, var(--alr-top, 0px)) - 28px - var(--pl, 0px)); overflow: auto; }
#amar-lr.has-player .kz-slip { --pl: var(--player); }
#amar-lr .kz-slip-h { padding: 14px 16px 10px; border-bottom: 2px dashed var(--ink); }
#amar-lr .kz-slipkick { font-size: 12px; font-weight: 600; letter-spacing: .1em; color: var(--muted); }
#amar-lr .kz-slip-h h2 { margin-top: 4px; font-size: 21px; font-weight: 700; line-height: 1.25; }
#amar-lr .kz-slip-h p:last-child { margin-top: 2px; font-size: 13.5px; color: #3d3d39; }
#amar-lr .kz-sliplist li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px; align-items: start; padding: 10px 14px; border-bottom: 1px solid var(--hair); }
#amar-lr .kz-sliplist li.is-current { background: var(--soft); box-shadow: inset 4px 0 0 var(--accent-deep); }
#amar-lr .kz-n { font-weight: 800; color: var(--navy); }
#amar-lr .kz-sliplist li.is-current .kz-n { color: var(--accent-deep); }
#amar-lr .kz-slipplay { display: grid; gap: 1px; padding: 0; border: 0; background: none; color: var(--ink); text-align: start; font-size: 13.5px; line-height: 1.35; cursor: pointer; }
#amar-lr .kz-slipplay .kz-mono { color: var(--navy); font-weight: 600; font-size: 12.5px; }
#amar-lr .kz-slipplay:hover b { text-decoration: underline; }
#amar-lr .kz-slipr { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; font-size: 13px; }
#amar-lr .kz-x { width: 30px; height: 30px; border: 1px solid #c9cce3; background: #ffffff; cursor: pointer; font-size: 13px; }
#amar-lr .kz-slip-f { display: grid; gap: 8px; padding: 14px; }
#amar-lr .kz-slipgo { min-height: 48px; border: 0; background: var(--navy); color: #ffffff; font-size: 14.5px; font-weight: 800; cursor: pointer; }
#amar-lr .kz-slip-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
#amar-lr .kz-slip-2 button { min-height: 40px; border: 1px solid var(--ink); background: #ffffff; font-size: 13px; font-weight: 700; cursor: pointer; }
#amar-lr .kz-copied { font-size: 12.5px; color: var(--muted); min-height: 1em; }
/* evenings */
#amar-lr .kz-ev { margin-top: 40px; }
#amar-lr .kz-sec-h { display: flex; justify-content: space-between; align-items: baseline; gap: 6px 16px; flex-wrap: wrap; padding-bottom: 10px; border-bottom: var(--rule); }
#amar-lr .kz-sec-h h2 { font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; letter-spacing: -.02em; text-transform: uppercase; }
#amar-lr[lang="ar"] .kz-sec-h h2 { text-transform: none; letter-spacing: 0; }
#amar-lr .kz-sec-h p { font-size: 14.5px; color: var(--muted); max-width: 70ch; }
#amar-lr .kz-cards { margin-top: 16px; display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
#amar-lr .kz-card { display: flex; flex-direction: column; gap: 8px; padding: 16px; border: 2px solid var(--ink); background: #ffffff; color: var(--ink); text-align: start; cursor: pointer; transition: transform .2s, box-shadow .2s; }
#amar-lr .kz-card:hover { transform: translateY(-4px); box-shadow: 0 10px 22px rgba(0,0,0,.14); }
#amar-lr .kz-card.is-on { border-color: var(--navy); background: var(--soft); }
#amar-lr .kz-discs { display: flex; padding-inline-start: 10px; }
#amar-lr .kz-discs img, #amar-lr .kz-dd { width: 54px; height: 54px; border-radius: 50%; margin-inline-start: -10px; border: 3px solid #ffffff; display: block; flex: none; background: var(--vinyl); overflow: hidden; }
#amar-lr .kz-dd svg { width: 100%; height: 100%; display: block; }
#amar-lr .kz-ct { font-size: 18px; font-weight: 800; line-height: 1.2; }
#amar-lr .kz-co { font-size: 14px; color: var(--muted); }
#amar-lr .kz-cl { font-size: 13.5px; color: #3d3d39; }
#amar-lr .kz-cm { margin-top: auto; display: flex; justify-content: space-between; gap: 8px; padding-top: 10px; border-top: 1px solid var(--hair); font-size: 13px; font-weight: 700; }
#amar-lr .kz-cm span:last-child { color: var(--navy); }
/* the five doors, the radio */
#amar-lr .kz-all { margin-top: 30px; }
#amar-lr .kz-allin { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; padding: 18px 20px; border: var(--rule); }
#amar-lr .kz-allin p { flex: 1 1 320px; font-size: 15px; }
#amar-lr .kz-door { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; font-size: 13.5px; font-weight: 800; text-decoration: none; }
#amar-lr .kz-alllink { font-size: 14px; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
#amar-lr .kz-radio { margin-top: 16px; font-size: 14.5px; }
#amar-lr .kz-radio a { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
/* the desk: above the player bar */
#amar-lr .desk {
  position: fixed; inset: auto 0 calc(var(--player) + env(safe-area-inset-bottom, 0px)) 0; z-index: 119; max-height: min(38vh, 330px); overflow: auto;
  background: var(--ink); color: #ffffff; border-top: 1px solid rgba(255,255,255,.2); box-shadow: 0 -12px 30px rgba(0,0,0,.25); overscroll-behavior: contain;
}
#amar-lr .desk-in { display: grid; grid-template-columns: 150px minmax(0, 1fr) 320px; gap: 26px; align-items: start; max-width: 1324px; margin: 0 auto; padding: 14px var(--edge); }
#amar-lr .desk .vw-turn { min-height: 34px; padding: 0 12px; font-size: 12px; }
#amar-lr .desk .vw-cap { font-size: 12px; }
#amar-lr .desk-notes { max-height: calc(min(38vh, 330px) - 30px); overflow: auto; }
#amar-lr .desk .vw { padding: 0; background: transparent; }
#amar-lr .desk .vw-zoom { width: 100%; }
#amar-lr .desk .kz-kick { color: var(--gold); }
#amar-lr .desk h2 { margin-top: 4px; font-size: clamp(20px, 2vw, 28px); line-height: 1.1; font-weight: 700; letter-spacing: -.03em; }
#amar-lr .desk h2[lang="ar"] { letter-spacing: 0; line-height: 1.35; }
#amar-lr .desk-alt { margin-top: 4px; font-size: 20px; color: #e3e5f2; }
#amar-lr .desk-by { margin-top: 6px; font-size: 16px; font-weight: 700; }
#amar-lr .desk-meta { margin-top: 2px; font-size: 14px; color: #cfcfca; }
#amar-lr .desk-wave { display: flex; align-items: center; gap: 2px; height: 52px; margin-top: 10px; direction: ltr; cursor: pointer; }
#amar-lr .desk-wave span { flex: 1; background: #5a5a55; border-radius: 1px; }
#amar-lr .desk-wave span.is-played { background: var(--gold); }
#amar-lr .desk-wave:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
#amar-lr .desk-line { height: 6px; margin: 34px 0 10px; background: #4a4a4a; direction: ltr; }
#amar-lr .desk-line > i { display: block; height: 100%; width: 0; background: var(--gold); }
#amar-lr .desk-time { display: flex; justify-content: space-between; margin-top: 6px; font-size: 13px; color: #b5b5b0; }
#amar-lr .desk-notes { border-inline-start: 1px solid rgba(255,255,255,.2); padding-inline-start: 22px; }
#amar-lr .desk-notes .sh-facts { grid-template-columns: minmax(0, 1fr); }
#amar-lr .desk-notes .sh-facts > div { border-top-color: rgba(255,255,255,.16); }
#amar-lr .desk-notes .sh-facts dt { color: #b5b5b0; }
#amar-lr .desk-notes .pf-src, #amar-lr .desk-notes .pf-notes { color: #cfcfca; }
#amar-lr .desk-word { margin-bottom: 14px; padding-inline-start: 12px; border-inline-start: 4px solid var(--gold); }
#amar-lr .desk-word p:not(.kz-kick) { margin: 4px 0 10px; font-size: 15px; line-height: 1.5; }
#amar-lr.desk-open { padding-bottom: calc(var(--player) + min(38vh, 330px)); }
#amar-lr .player .desk-toggle { flex: none; min-height: 38px; padding: 0 14px; border: 1px solid currentColor; border-radius: 19px; background: transparent; color: inherit; font-size: 13px; font-weight: 700; cursor: pointer; white-space: nowrap; }
#amar-lr .player-slip { font-size: 13px; white-space: nowrap; opacity: .85; }
@media (max-width: 1100px) {
#amar-lr .kz-cols { grid-template-columns: minmax(0, 1fr); }
#amar-lr .kz-slip { position: static; max-height: none; }
#amar-lr .desk-in { grid-template-columns: 130px minmax(0, 1fr); }
#amar-lr .desk-notes { grid-column: 1 / -1; border-inline-start: 0; padding-inline-start: 0; max-height: none; }
}
@media (max-width: 760px) {
#amar-lr .kz-boxes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#amar-lr .kz-tr, #amar-lr .kz-row { grid-template-columns: 70px minmax(0, 1fr) auto; gap: 8px; }
#amar-lr .kz-hide { display: none; }
#amar-lr .kz-act .kz-slipbtn { padding: 0 6px; font-size: 12px; }
#amar-lr .kz-item-in { grid-template-columns: minmax(0, 1fr); }
#amar-lr .desk-in { grid-template-columns: 96px minmax(0, 1fr); gap: 12px; }
#amar-lr .desk .vw-turn, #amar-lr .desk .vw-cap { display: none; }
#amar-lr .desk-alt, #amar-lr .desk-meta { display: none; }
#amar-lr .player-slip { display: none; }
#amar-lr .player .desk-toggle { padding: 0 10px; font-size: 12px; }
}

/* the head's links column: one line per link (Arabic «كلّ التسجيلات» wrapped) */
body:has(#amar-lr) .alr-tabs a { white-space: nowrap; }
/* About: the closing section of the page (no longer a view of its own) */
#amar-lr .about--in { margin-top: clamp(32px, 5vw, 64px); border-top: var(--rule); border-bottom: 0; scroll-margin-top: calc(var(--alr-top, 0px) + 16px); }
#amar-lr .about--in .about-h { margin: 0; font-size: clamp(26px, 3vw, 40px); line-height: 1.05; text-transform: uppercase; letter-spacing: -.03em; text-wrap: balance; }
#amar-lr[lang="ar"] .about--in .about-h { letter-spacing: 0; line-height: 1.3; text-transform: none; }
#amar-lr.desk-open .about--in { margin-bottom: 0; }

/* the finding aid follows its own width, not the window's (user, 2026-10-13: titles squeezed to one letter
   between 1150 and 1500 px, where the slip sits beside the list): form and length go first, then the company */
#amar-lr .kz-aid { container: aid / inline-size; min-width: 0; }
@container aid (max-width: 940px) {
  #amar-lr .kz-tr, #amar-lr .kz-row { grid-template-columns: 88px minmax(0, 1fr) minmax(120px, 170px) auto; gap: 10px; }
  #amar-lr .kz-c-form, #amar-lr .kz-c-len { display: none; }
  #amar-lr .kz-item-in { grid-template-columns: 200px minmax(0, 1fr); gap: 20px; }
}
@container aid (max-width: 620px) {
  #amar-lr .kz-tr, #amar-lr .kz-row { grid-template-columns: 70px minmax(0, 1fr) auto; gap: 8px; }
  #amar-lr .kz-c-co { display: none; }
  #amar-lr .kz-item-in { grid-template-columns: minmax(0, 1fr); }
}
/* Where to start (2026-10-14): above the list until a search or filter is used, or it is closed */
#amar-lr .reg-start { position: relative; margin: 0 0 18px; padding: 16px 18px 16px; background: var(--soft); border-top: 3px solid var(--navy); }
#amar-lr .rs-h { margin: 0 0 10px; font-size: 18px; font-weight: 800; letter-spacing: -.01em; padding-inline-end: 40px; }
#amar-lr .rs-ways { display: flex; flex-wrap: wrap; gap: 8px; }
#amar-lr .rs-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 0; border-radius: 22px; background: var(--navy); color: #ffffff; font: inherit; font-size: 14px; font-weight: 800; cursor: pointer; }
#amar-lr .rs-btn .i { width: 18px; height: 18px; fill: currentColor; }
#amar-lr .rs-btn small { font-weight: 600; opacity: .8; }
#amar-lr .rs-pod { background: #ffffff; color: var(--navy); box-shadow: inset 0 0 0 1.5px var(--navy); }
#amar-lr .rs-btn:hover { filter: brightness(1.12); }
#amar-lr .rs-pod:hover { background: #e9eaf3; filter: none; }
#amar-lr .rs-sub { margin: 14px 0 8px; font-size: 13.5px; font-weight: 700; color: var(--muted); }
#amar-lr .rs-voices { display: flex; flex-wrap: wrap; gap: 6px; }
#amar-lr .rs-voice { min-height: 38px; padding: 0 12px; border: 1px solid #c9cce3; border-radius: 19px; background: #ffffff; color: var(--ink); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
#amar-lr .rs-voice small { color: var(--muted); font-weight: 600; margin-inline-start: 2px; }
#amar-lr .rs-voice:hover { border-color: var(--navy); background: #e9eaf3; }
#amar-lr .rs-close { position: absolute; top: 8px; inset-inline-end: 8px; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; border-radius: 50%; cursor: pointer; display: grid; place-items: center; color: var(--ink); }
#amar-lr .rs-close .i { width: 18px; height: 18px; fill: currentColor; }
#amar-lr .rs-close:hover { background: #e3e5f0; }
/* the podcast episode that talks about the record */
#amar-lr .reg-ep { display: inline-block; vertical-align: middle; margin-inline-start: 6px; padding: 0 7px; border-radius: 3px; background: var(--navy); color: #ffffff; font-size: 11.5px; font-weight: 700; line-height: 1.7; white-space: nowrap; }
@media (max-width: 640px) {
  #amar-lr .reg-start { padding: 14px 14px 14px; }
  #amar-lr .rs-btn { flex: 1 1 100%; justify-content: center; }
}

/* responsive QA 2026-11-05: 'Where to start' voices: 44px touch targets, counts readable */
@media (pointer: coarse) { #amar-lr .rs-voices { gap: 8px; } #amar-lr .rs-voice { min-height: 44px; } }
#amar-lr .rs-voice small, #amar-lr .rs-btn small { font-size: 12px; }