.rep-page {
  --rep-accent: var(--theme-accent, var(--ibo-gold, #f3ae62));
  --rep-surface: linear-gradient(180deg,rgba(255,255,255,.026),rgba(255,255,255,.012)),rgba(12,15,21,.48);
  --rep-surface-2: rgba(8,12,18,.54);
  display: grid;
  width: min(100%,1180px);
  min-width: 0;
  margin: 0 auto;
  gap: 16px;
  padding: 2px 2px 28px;
}

.rep-hero {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 7px 3px 10px;
}

.rep-hero-copy { min-width: 0; }
.rep-hero h2 { margin: 6px 0 7px; color: var(--ui-text-strong,var(--ink)); font-family: var(--ff-title,var(--f-serif)); font-size: clamp(27px,3vw,36px); font-weight: 560; line-height: 1; letter-spacing: -.03em; }
.rep-hero p { max-width: 680px; margin: 0!important; }
.rep-eyebrow,.rep-section-kicker { color: var(--rep-accent); font: 750 9px/1.2 var(--f-mono,monospace); letter-spacing: .19em; text-transform: uppercase; }
.rep-page p,.rep-dialog p { margin: 6px 0 18px; color: var(--muted,#9aa6b7); font-size: 13px; line-height: 1.6; }
.rep-page h3 { margin: 4px 0 4px; color: var(--ui-text-strong,var(--ink)); font-size: 16px; font-weight: 680; letter-spacing: -.015em; }

.rep-refresh {
  flex: none;
  min-height: 40px;
  padding-inline: 14px!important;
  border-color: color-mix(in oklch,var(--rep-accent) 18%,var(--line));
  background: rgba(255,255,255,.018)!important;
  color: var(--ui-text-main,var(--ink))!important;
}

.rep-card {
  min-width: 0;
  padding: 20px;
  border: 1px solid rgba(148,163,184,.14);
  border-radius: 14px;
  background: var(--rep-surface);
  box-shadow: 0 14px 38px rgba(0,0,0,.12);
}

.rep-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.rep-stats > div {
  position: relative;
  display: flex;
  min-height: 82px;
  flex-direction: column;
  justify-content: space-between;
  gap: 9px;
  padding: 15px 16px;
  overflow: hidden;
  border: 1px solid rgba(148,163,184,.13);
  border-radius: 12px;
  background: linear-gradient(130deg,rgba(var(--theme-accent-rgb),.045),rgba(255,255,255,.012) 56%),rgba(8,12,18,.48);
}
.rep-stats > div::after { content:""; position:absolute; inset:auto 0 0; height:2px; background:linear-gradient(90deg,var(--rep-accent),transparent 70%); opacity:.5; }
.rep-stats strong { color: var(--ui-text-strong,var(--ink)); font-size: 27px; line-height: 1; letter-spacing: -.045em; }
.rep-stats span { color: var(--muted,#9aa6b7); font-size: 10px; font-weight: 680; line-height: 1.2; letter-spacing: .07em; text-transform: uppercase; }

.rep-section-head {
  display: grid;
  grid-template-columns: 42px minmax(0,1fr);
  align-items: start;
  gap: 13px;
  min-width: 0;
}
.rep-section-head > div { min-width: 0; }
.rep-section-head p { max-width: 720px; margin: 4px 0 0!important; font-size: 12px; line-height: 1.48; }
.rep-section-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(var(--theme-accent-rgb),.2);
  border-radius: 11px;
  background: rgba(var(--theme-accent-rgb),.065);
  color: var(--rep-accent);
  font-size: 19px;
}
.rep-section-head--review { grid-template-columns: 42px minmax(0,1fr) auto; }
.rep-context-pill {
  align-self: center;
  max-width: 330px;
  padding: 7px 10px;
  overflow: hidden;
  border: 1px solid rgba(148,163,184,.14);
  border-radius: 999px;
  background: rgba(255,255,255,.02);
  color: var(--ui-text-soft,var(--muted));
  font-size: 10.5px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.rep-filter-card form { margin-top: 20px; }

.rep-grid { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 15px; }
.rep-grid .rep-field:nth-child(1),.rep-grid .rep-field:nth-child(2),.rep-grid .rep-field:nth-child(3) { grid-column: span 2; }
.rep-grid .rep-field:nth-child(4),.rep-grid .rep-field:nth-child(5) { grid-column: span 3; }
.rep-export .rep-grid .rep-field { grid-column: span 2; }

.rep-field { display: flex; min-width: 0; flex-direction: column; gap: 7px; color: var(--ink); font-size: 12px; font-weight: 650; }
.rep-field input,.rep-field select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  min-height: 43px;
  padding: 10px 12px;
  border: 1px solid var(--line,#343b46);
  border-radius: 10px;
  outline: 0;
  background: var(--rep-surface-2);
  color: var(--ink,#d5dde5);
  font: inherit;
  font-weight: 450;
  transition: border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.rep-field input::placeholder { color:color-mix(in oklch,var(--muted) 72%,transparent); font-style:italic; }
.rep-field input:focus,.rep-field select:focus { border-color:color-mix(in oklch,var(--rep-accent) 62%,var(--line)); box-shadow:0 0 0 3px color-mix(in oklch,var(--rep-accent) 10%,transparent); }
.rep-field small { color:var(--muted); font-size:11px; font-weight:400; }

.rep-review-goals {
  min-width: 0;
  margin: 19px 0 0;
  padding: 16px 0 0;
  border: 0;
  border-top: 1px solid rgba(148,163,184,.12);
}
.rep-review-goals legend { float:left; width:100%; padding:0; color:var(--ui-text-main,var(--ink)); font-size:12px; font-weight:680; }
.rep-review-goals > p { clear:both; margin:4px 0 11px!important; font-size:11px; }
.rep-review-goals .rep-checks { margin:0; }

.rep-checks { display:flex; flex-wrap:wrap; gap:9px; margin:19px 0; }
.rep-check {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  gap: 8px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(255,255,255,.018);
  color: var(--ui-text-soft,var(--muted));
  font-size: 11.5px;
  font-weight: 550;
  cursor: pointer;
  transition: border-color .15s ease,color .15s ease,background .15s ease;
}
.rep-check:hover { border-color:color-mix(in oklch,var(--rep-accent) 34%,var(--line)); color:var(--ink); }
.rep-check:has(input:checked) { border-color:color-mix(in oklch,var(--rep-accent) 44%,var(--line)); background:color-mix(in oklch,var(--rep-accent) 7%,transparent); color:var(--rep-accent); }
.rep-check input,.rep-song-select input { width:16px; height:16px; flex:none; accent-color:var(--rep-accent); }
.rep-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.rep-page .btn,.rep-dialog .btn { min-height:39px; padding-inline:14px; border-radius:10px; font-size:11px; white-space:normal; }
.rep-page .btn-secondary,.rep-dialog .btn-secondary { border-color:var(--line); background:rgba(255,255,255,.018); color:var(--ink); }
.rep-page .btn-secondary:hover,.rep-dialog .btn-secondary:hover { border-color:color-mix(in oklch,var(--rep-accent) 28%,var(--line)); background:color-mix(in oklch,var(--rep-accent) 5%,transparent); }

.rep-form-footer { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:18px; padding-top:16px; border-top:1px solid rgba(148,163,184,.12); }
.rep-form-note { display:inline-flex; min-width:0; align-items:center; gap:8px; color:var(--ui-text-soft,var(--muted)); font-size:11px; line-height:1.4; }
.rep-form-note .ms { flex:none; color:var(--rep-accent); font-size:16px; }

.rep-export { padding: 0; overflow:hidden; }
.rep-export summary { display:flex; min-height:72px; align-items:center; justify-content:space-between; gap:16px; padding:0 20px; color:var(--ink); cursor:pointer; list-style:none; }
.rep-export summary::-webkit-details-marker { display:none; }
.rep-summary-main { display:flex; min-width:0; align-items:center; gap:12px; }
.rep-summary-main > span:last-child { min-width:0; }
.rep-summary-main strong,.rep-summary-main small { display:block; }
.rep-summary-main strong { color:var(--ui-text-strong,var(--ink)); font-size:13.5px; font-weight:680; }
.rep-summary-main small { margin-top:4px; color:var(--ui-text-soft,var(--muted)); font-size:10.5px; font-weight:450; }
.rep-summary-icon { display:inline-flex; width:38px; height:38px; flex:none; align-items:center; justify-content:center; border:1px solid rgba(var(--theme-accent-rgb),.19); border-radius:10px; background:rgba(var(--theme-accent-rgb),.055); color:var(--rep-accent); font-size:18px; }
.rep-summary-toggle { flex:none; color:var(--muted); font-size:19px; transition:transform .16s ease; }
.rep-export[open] .rep-summary-toggle { transform:rotate(180deg); }
.rep-export form { padding:20px 22px 22px; border-top:1px solid var(--line); }
.rep-muted { margin-bottom:0!important; font-size:11px!important; }

.rep-review-card { min-height:270px; }
.rep-selection { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:18px 0 12px; padding:12px 13px; border:1px solid rgba(148,163,184,.12); border-radius:11px; background:rgba(255,255,255,.018); color:var(--muted); font-size:11px; }
.rep-selection[hidden] { display:none!important; }
.rep-selection #rep-selection-count { color:var(--ink); font-weight:650; white-space:nowrap; }
#rep-results { display:grid; gap:8px; margin-top:18px; }
.rep-song { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:18px; min-height:96px; padding:14px; border:1px solid rgba(148,163,184,.12); border-radius:12px; background:rgba(255,255,255,.018); transition:border-color .16s ease,background .16s ease; }
.rep-song:hover { border-color:rgba(var(--theme-accent-rgb),.22); background:rgba(var(--theme-accent-rgb),.035); }
.rep-song-main { display:flex; min-width:0; align-items:flex-start; gap:13px; }
.rep-song-main > div { min-width:0; flex:1; }
.rep-song-select { display:inline-flex; min-width:32px; min-height:32px; align-items:center; justify-content:center; padding-top:1px; }
.rep-song h4 { margin:0 0 4px; overflow-wrap:anywhere; color:var(--ui-text-strong,var(--ink)); font-size:13.5px; line-height:1.4; }
.rep-song p { margin:0 0 9px; font-size:11.5px; line-height:1.4; }
.rep-song small { display:block; margin-top:8px; color:var(--muted); font-size:10.5px; }
.rep-song > .rep-actions { justify-content:flex-end; }
.rep-badges { display:flex; flex-wrap:wrap; gap:6px; }
.rep-badges span { display:inline-flex; min-height:23px; align-items:center; padding:0 8px; border:1px solid rgba(148,163,184,.13); border-radius:999px; background:rgba(255,255,255,.014); color:var(--muted); font-size:9.5px; line-height:1.2; }
.rep-duplicate { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:12px; padding:10px 11px; border:1px solid color-mix(in oklch,var(--rep-accent) 28%,var(--line)); border-radius:9px; background:color-mix(in oklch,var(--rep-accent) 5%,transparent); color:var(--muted); font-size:11px; line-height:1.45; }

.rep-pagination { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:18px; padding-top:16px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; }
.rep-pagination[hidden] { display:none!important; }
.rep-review-idle { display:grid; min-height:168px; place-items:center; align-content:center; gap:12px; margin-top:18px; padding:26px; border:1px dashed rgba(148,163,184,.15); border-radius:12px; background:rgba(255,255,255,.01); text-align:center; }
.rep-review-idle > div { max-width:510px; }
.rep-review-idle strong,.rep-empty strong { display:block; color:var(--ui-text-main,var(--ink)); font-size:13px; }
.rep-review-idle p,.rep-empty p { margin:6px 0 0!important; font-size:11.5px; line-height:1.5; }
.rep-idle-icon { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; border:1px solid rgba(var(--theme-accent-rgb),.2); border-radius:12px; background:rgba(var(--theme-accent-rgb),.055); color:var(--rep-accent); font-size:20px; }
.rep-empty,.rep-loading { padding:44px 12px; color:var(--muted); text-align:center; font-size:13px; }
.rep-empty > .ms { display:block; margin:0 auto 10px; color:var(--rep-accent); font-size:23px; }
.rep-empty--error > .ms,.rep-empty--error strong { color:#ff9da1; }
.rep-error { color:#ff8d91!important; }
.rep-spinner { display:inline-block; width:16px; height:16px; margin-right:8px; border:2px solid #707c8d; border-top-color:var(--rep-accent); border-radius:50%; vertical-align:middle; animation:rep-spin 1s linear infinite; }
#rep-pdf-status { color:var(--muted); font-size:11px; line-height:1.5; }

.rep-dialog { width:min(960px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; border:1px solid var(--line); border-radius:16px; background:var(--cream); color:var(--ink); }
.rep-dialog::backdrop { background:rgba(0,0,0,.72); backdrop-filter:blur(4px); }
.rep-dialog form { display:flex; max-height:calc(100dvh - 34px); flex-direction:column; }
.rep-dialog header,.rep-dialog footer { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; gap:12px; padding:18px 22px; flex-wrap:wrap; }
.rep-dialog header { border-bottom:1px solid var(--line); }
.rep-dialog footer { border-top:1px solid var(--line); }
.rep-dialog h2 { margin:0; font-size:20px; }
.rep-dialog-body { min-height:0; padding:22px; overflow:auto; overscroll-behavior:contain; }
.rep-dialog ul { padding-left:20px; font-size:13px; line-height:1.8; }
.rep-compare-heading,.rep-compare { display:grid; min-width:0; grid-template-columns:1fr 1fr; gap:18px; }
.rep-compare { margin:18px 0; padding:15px; border:1px solid var(--line); border-radius:10px; }
.rep-compare legend { padding:0 7px; font-size:13px; }
.rep-compare label { min-width:0; }
.rep-compare pre { max-height:250px; margin-top:10px; padding:13px; overflow:auto; border-radius:8px; background:var(--cream-2); font-size:12px; line-height:1.5; overflow-wrap:anywhere; white-space:pre-wrap; }
.rep-notice { padding:11px 14px; border-left:2px solid var(--rep-accent); background:color-mix(in oklch,var(--rep-accent) 5%,transparent); }
.rep-dialog :focus-visible,.rep-page :focus-visible { outline:2px solid var(--rep-accent); outline-offset:3px; }

@keyframes rep-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .rep-spinner { animation:none; } }

@media (max-width:900px) {
  .rep-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rep-grid .rep-field:nth-child(n),.rep-export .rep-grid .rep-field { grid-column:span 1; }
  .rep-song { grid-template-columns:1fr; gap:10px; }
  .rep-song > .rep-actions { padding-left:45px; justify-content:flex-start; }
}

@media (max-width:650px) {
  .rep-page { gap:13px; padding:0 0 24px; }
  .rep-hero { align-items:flex-start; gap:12px; padding:5px 1px 8px; }
  .rep-hero h2 { margin-top:5px; font-size:28px; }
  .rep-hero p { max-width:34ch; font-size:11.5px; line-height:1.45; }
  .rep-refresh { width:40px; min-width:40px; padding:0!important; }
  .rep-refresh > span:last-child { display:none; }
  .rep-card { padding:15px; border-radius:13px; box-shadow:0 10px 28px rgba(0,0,0,.1); }
  .rep-stats { gap:7px; }
  .rep-stats > div { min-height:70px; gap:7px; padding:11px; }
  .rep-stats strong { font-size:23px; }
  .rep-stats span { font-size:8.5px; letter-spacing:.045em; }
  .rep-section-head { grid-template-columns:35px minmax(0,1fr); gap:10px; }
  .rep-section-head--review { grid-template-columns:35px minmax(0,1fr); }
  .rep-section-icon { width:34px; height:34px; border-radius:9px; font-size:17px; }
  .rep-section-head h3 { margin-top:3px; }
  .rep-section-head p { font-size:11px; }
  .rep-context-pill { grid-column:1 / -1; justify-self:start; max-width:100%; margin-top:2px; }
  .rep-filter-card form { margin-top:16px; }
  .rep-grid { grid-template-columns:1fr; gap:13px; }
  .rep-review-goals { margin-top:16px; padding-top:14px; }
  .rep-form-footer { align-items:stretch; flex-direction:column; gap:12px; margin-top:15px; padding-top:14px; }
  .rep-form-footer .rep-actions { display:grid; grid-template-columns:1fr 1fr; }
  .rep-form-footer .btn { justify-content:center; }
  .rep-selection { align-items:flex-start; flex-direction:column; }
  .rep-selection .rep-actions { display:grid; width:100%; grid-template-columns:1fr 1fr; }
  .rep-selection .rep-actions .btn:last-child:nth-child(odd) { grid-column:1 / -1; }
  .rep-export summary { min-height:66px; padding:0 15px; }
  .rep-summary-main { gap:10px; }
  .rep-summary-icon { width:34px; height:34px; }
  .rep-summary-main strong { font-size:12.5px; }
  .rep-summary-main small { font-size:9.5px; }
  .rep-export form { padding:17px; }
  .rep-review-card { min-height:245px; }
  #rep-results { margin-top:15px; }
  .rep-review-idle { min-height:150px; padding:20px 14px; }
  .rep-song { min-height:0; padding:13px; }
  .rep-song > .rep-actions { display:grid; grid-template-columns:1fr 1fr; padding-left:0; }
  .rep-song > .rep-actions .btn { justify-content:center; }
  .rep-duplicate { align-items:stretch; flex-direction:column; }
  .rep-actions > .btn { flex:1 1 auto; }
  .rep-checks { gap:7px; }
  .rep-check { min-height:33px; }
  .rep-compare,.rep-compare-heading { grid-template-columns:1fr; }
  .rep-dialog { width:calc(100vw - 16px); max-height:calc(100dvh - 16px); }
  .rep-dialog form { max-height:calc(100dvh - 18px); }
  .rep-dialog header,.rep-dialog footer,.rep-dialog-body { padding:17px; }
  .rep-pagination { gap:9px; }
}

@media (max-width:390px) {
  .rep-hero p { font-size:11px; }
  .rep-stats > div { padding:10px; }
  .rep-stats strong { font-size:21px; }
  .rep-stats span { font-size:8px; }
  .rep-form-footer .rep-actions,.rep-selection .rep-actions,.rep-song > .rep-actions { grid-template-columns:1fr; }
}
