/* Moonfly: ink-blue night surfaces with moonlit cyan and soft violet accents. */
  :root{--bg:#0b1020;--panel:#111a2d;--line:#26334d;--ink:#e7edf8;--mut:#9aa9c4;
        --accent:#c9c8ff;--hacker-primary:#9bd68b;--hacker-secondary:#a7b9f5;--hacker-muted:#b4c7e8;
        --hacker-bg:#24351f;--hacker-hover:#283d2b;--hacker-primary-rgb:155,214,139;
        --hacker-secondary-rgb:167,185,245;--hacker-bg-rgb:24,48,57;
        --mint:var(--hacker-secondary);--au:var(--hacker-primary);--warn:#f0bd8a;--red:#ff8c9c;
        --yellow:#d9c7f4;
        --song-title:#b4e6a5;--song-time:#a7b9f5;--song-length:#a7b9f5;
        --release-blue:#9dbbe8;--release-green:#9fd8c5;--release-orange:#e7b88d;
        --genre-soft-0:#e3aebe;--genre-soft-1:#c9b7f0;--genre-soft-2:#9fd8c5;
        --genre-soft-3:#9fc9e8;--genre-soft-4:#e7c99c;--genre-soft-5:#b4c7e8;
        --genre-soft-6:#d6d29e;--genre-soft-7:#dfa8b4;}
  *{box-sizing:border-box}
  body{margin:0;background:var(--bg);color:var(--ink);
       font:17.25px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
  header{position:sticky;top:0;z-index:5;background:rgba(11,16,32,.96);
         backdrop-filter:blur(6px);border-bottom:1px solid var(--line);padding:14px 0}
  /* The header's own side padding is 0 and .wrap carries 12px, matching main below, so the
     headline totals end exactly on the table's right edge on a wide screen (with 18px here
     and 12px there they sat 6px inside it) - see the totals rule further down. */
  .wrap{max-width:1680px;margin:0 auto;padding:0 12px}
  .head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;flex-wrap:wrap}
  .hleft{min-width:0}
  h1{margin:0;font-size:19.55px;letter-spacing:.2px;font-weight:650}
  h1 .dot{color:var(--accent)}
  .meta{margin-top:5px;color:var(--mut);font-size:14.4px;display:flex;gap:12px;flex-wrap:wrap;align-items:center}
  .meta a[aria-current="page"]{color:var(--ink)!important;font-weight:650;text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:4px}
  .live{color:var(--accent)}
  .cov{color:var(--mut)}
  .cov.ok{color:var(--au)}
  .cov.bad{color:var(--warn)}
  /* headline totals, top right: total songs | how many are AU | % of total */
  .totals{font-size:19.55px;font-weight:650;letter-spacing:.2px;white-space:nowrap;
          text-align:right;font-variant-numeric:tabular-nums;cursor:default}
  .totals .sep{color:var(--mut);opacity:.65;font-weight:400;margin:0 4px}
  .totals .pct{color:var(--au)}
  /* Keep the show's totals on the left and its stream observations on the right. */
  .showbar-content{display:flex;align-items:baseline;justify-content:space-between;gap:4px 16px;flex-wrap:wrap}
  .showbar-main{min-width:0}
  .showbar-stats{display:flex;align-items:baseline;gap:12px;margin-left:auto;white-space:nowrap}
  .showbar .stat{font-weight:400;font-size:13.225px;
                 white-space:nowrap;font-variant-numeric:tabular-nums;cursor:default}
  .showbar .stat.pk{opacity:.9;color:var(--mint)}
  /* right-hand header column: the headline totals (the only summary that stayed in the
     header - the per-day figures moved into the monthly strip below) */
  .hright{text-align:right;min-width:0}
  /* ---- Monthly AU% strip: one tile per day of the shown month, sitting between the
     header and the log and spanning the content width. It is a compact DATA ROW, not a
     calendar card: the same --panel/--line colours, 1px borders and 4px radius the
     origin tags use, and the header's own type scale. The green is the AU accent at a
     low alpha scaled by the day's percentage, so a month reads at a glance without the
     page turning into a heatmap; a day with nothing to divide by shows a dash. */
  .mstrip{background:var(--panel);border-bottom:1px solid var(--line)}
  .mrow{display:flex;align-items:center;gap:8px;padding:7px 0 6px;flex-wrap:wrap}
  .mbtn{background:transparent;border:1px solid var(--line);border-radius:4px;color:var(--mut);
        font:inherit;font-size:14.4px;line-height:1;padding:3px 9px;cursor:pointer}
  .mbtn:hover{color:var(--ink);border-color:rgba(160,160,160,.75)}
  .mtitle{font-size:15.525px;font-weight:650;letter-spacing:.2px;cursor:pointer}
  .mtitle:hover{color:var(--accent)}
  .msum{margin-left:auto;color:var(--mut);font-size:13.225px;font-variant-numeric:tabular-nums}
  .mpick{display:flex;gap:4px;flex-wrap:wrap;padding:0 0 8px}
  .mpick button{background:transparent;border:1px solid var(--line);border-radius:4px;color:var(--mut);
                font:inherit;font-size:12.65px;line-height:1.3;padding:2px 7px;cursor:pointer}
  .mpick button:hover{color:var(--ink);border-color:rgba(160,160,160,.75)}
  .mpick button.on{color:var(--ink);border-color:var(--accent)}
  /* 72px minimum, not 78: at a 1280px viewport that is 16 columns, so a 31-day month is
     TWO rows rather than three - the whole point of a strip this thin. */
  .mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:3px;padding:0 0 9px}
  .mday{display:flex;flex-direction:column;gap:0;min-height:38px;padding:3px 6px 4px;
        border:1px solid var(--line);border-radius:4px;font-variant-numeric:tabular-nums}
  .mday .dn{font-size:12.075px;color:var(--mut);line-height:1.2}
  .mday .dp{font-size:14.4px;font-weight:650;color:var(--mut);line-height:1.25}
  .mday.none{border-color:rgba(80,80,80,.75)}   /* nothing to divide by: fainter, no fill */
  .mday.none .dp{opacity:.45}
  .mday.has{background:rgba(var(--hacker-bg-rgb),var(--g,.05));cursor:pointer}
  .mday.has .dp{color:var(--au)}
  .mday.has.zero .dp{color:var(--mut)}          /* 0% is a figure, not a good score */
  .mday.has:hover{border-color:rgba(var(--hacker-secondary-rgb),.75)}
  .mday.today{border-color:rgba(255,199,153,.7)}  /* today: a thin orange edge, no fill */
  .mday.sel{border-color:var(--accent);box-shadow:inset 0 0 0 1px rgba(255,199,153,.4)}
  .mday.sel .dn{color:var(--ink)}
  /* A day with rows is clickable even when its percentage is not a number: a tile picks
     WHICH DAY THE LOG SHOWS, so a day whose songs have no known country must still open. */
  .mday.rows{cursor:pointer}
  .mday.rows:hover{border-color:var(--accent)}
  /* the day whose tile was clicked: mark its header row in the log below */
  tr.day.sel td{color:var(--ink);box-shadow:inset 3px 0 0 var(--accent)}
  main{max-width:1680px;margin:0 auto;padding:10px 0 60px}
  table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
  thead th{position:sticky;top:0;z-index:4;background:var(--bg);text-align:left;font-size:13.225px;
           text-transform:uppercase;letter-spacing:.08em;color:var(--mut);
           font-weight:600;padding:10px 10px;border-bottom:1px solid var(--line);box-shadow:0 2px 4px rgba(0,0,0,.28)}
  td{padding:8px 10px;border-bottom:1px solid rgba(80,80,80,.75);vertical-align:top}
  tr:hover td{background:rgba(255,199,153,.07)}
  .t{white-space:nowrap;color:var(--song-time);font-weight:550;width:62px}
  .ann{white-space:nowrap;width:140px}
  .show{white-space:normal;min-width:190px;max-width:190px;color:var(--yellow)}
  /* The show column is PINNED at 190px rather than sized by its longest entry. Sized by
     content it took 315px, because one 31-character name ("Overnight Music, News &
     Weather", 3 rows) is twice the width of the next longest ("Overnight Country",
     160px) - which starved the artist–song column AND left a wide empty gap after every
     shorter show name. At 190px every show name still fits on one line except that one,
     which wraps to two. box-sizing is border-box, so the pin includes the 20px padding.
     min-width is what HOLDS the pin: with the flexible column below claiming width:100%,
     a max-width alone is not enough - the browser squeezes a wrap-capable column down to
     its longest word to make room. */
  .song{font-weight:520;width:100%}
  /* The song column is the flexible one, so every extra pixel of the page width goes to
     the artist and title instead of being shared out among the narrow columns. */
  /* Tighten the show -> artist–song boundary: 20px of padding across two columns reads as
     a gap when the show name is short. The header cells take the same padding so the
     labels stay over their own columns. Desktop only - the narrow layout stacks cells. */
  @media(min-width:761px){
    thead th:nth-child(3),td:nth-child(3){padding-right:4px}
    thead th:nth-child(4),td:nth-child(4){padding-left:8px}
  }
  .song .art{color:var(--song-title);font-weight:400}
  .len{white-space:nowrap;text-align:right;width:64px;color:var(--song-length);font-weight:500}
  .org{white-space:nowrap;text-align:left;width:72px}
  .rel{white-space:nowrap;text-align:right;width:56px;color:var(--mut)}
  .gen{white-space:nowrap;width:150px;color:var(--mut)}
  .rel.year-blue{color:var(--release-blue)}
  .rel.year-green{color:var(--release-green)}
  .rel.year-orange{color:var(--release-orange)}
  .gen.genre-soft-0{color:var(--genre-soft-0)}
  .gen.genre-soft-1{color:var(--genre-soft-1)}
  .gen.genre-soft-2{color:var(--genre-soft-2)}
  .gen.genre-soft-3{color:var(--genre-soft-3)}
  .gen.genre-soft-4{color:var(--genre-soft-4)}
  .gen.genre-soft-5{color:var(--genre-soft-5)}
  .gen.genre-soft-6{color:var(--genre-soft-6)}
  .gen.genre-soft-7{color:var(--genre-soft-7)}
  .tag{display:inline-block;min-width:28px;margin-right:4px;padding:1px 5px;border-radius:4px;
       font-size:12.075px;font-weight:700;letter-spacing:.06em;text-align:center;vertical-align:1px}
  .tag.au{background:rgba(var(--hacker-primary-rgb),.14);color:var(--au);border:1px solid rgba(var(--hacker-primary-rgb),.52)}
  .tag.other{background:rgba(160,160,160,.13);color:var(--mut);border:1px solid rgba(160,160,160,.4)}
  .tag.fp{background:rgba(var(--hacker-secondary-rgb),.10);color:var(--mint);border:1px solid rgba(var(--hacker-secondary-rgb),.44);font-variant-numeric:tabular-nums}
  .tag.na{background:rgba(160,160,160,.08);color:var(--mut);border:1px dashed rgba(160,160,160,.5)}
  /* an act with no single country (library / various artists / internet release):
     a real answer, so solid and tinted, unlike the dashed blank of "unknown" */
  .tag.gl{background:rgba(var(--hacker-secondary-rgb),.11);color:var(--mint);border:1px solid rgba(var(--hacker-secondary-rgb),.44)}
  /* not music at all (the news bed): the row stays in the log as evidence of the airtime,
     dimmed, and every total on the page skips it */
  .tag.news{background:rgba(255,199,153,.13);color:var(--warn);border:1px solid rgba(255,199,153,.45);
            letter-spacing:.02em;text-transform:none}
  tr.news .song{opacity:.75;font-weight:400}
  tr.news .len,tr.news .rel,tr.news .gen{opacity:.6}
  /* country reached by a name/spelling match, not an exact artist record: same
     tag, dotted border, tooltip names the source and calls it medium confidence */
  .tag.wk{border-style:dotted;border-width:1.5px;opacity:.92}
  /* How the identification was CONFIRMED - a different axis from the country tag, so a
     different shape: same row, labelled doubt. "1 engine" is a lone match (muted,
     dashed - the row is still a real airing); "disputed" is two engines naming different
     songs (amber - a real conflict), and its row gets an amber dotted underline so it is
     visible in a scan and not only on hover. */
  .tag.lone{background:rgba(160,160,160,.08);color:var(--mut);border:1px dashed rgba(160,160,160,.5);
            min-width:0;letter-spacing:.02em;text-transform:none}
  .tag.disp{background:rgba(255,199,153,.13);color:var(--warn);border:1px solid rgba(255,199,153,.45);
            min-width:0;letter-spacing:.02em;text-transform:none}
  /* A row the engines could NOT settle but a human did (verdicts.py). Not amber - there is
     no open conflict any more - and not unmarked either, because it is still not two
     engines agreeing: the tag says so and its tooltip carries the station's note. */
  .tag.settled{background:rgba(var(--hacker-primary-rgb),.10);color:var(--au);border:1px solid rgba(var(--hacker-primary-rgb),.42);
               min-width:0;letter-spacing:.02em;text-transform:none}
  tr.disputed .song{text-decoration:underline dotted rgba(255,199,153,.76);text-underline-offset:3px}
  /* A row that needs a verdict: its retained recording plays on click, so the one thing
     that can settle it - a listening human - is one click away instead of a file hunt. */
  td.song.playable{cursor:pointer}
  td.song.playable:hover{background:var(--hacker-hover)}
  td.song.playable .play{display:inline-block;min-width:13px;margin-right:3px;color:var(--au);
                         font-size:10px;opacity:.7;vertical-align:1px;user-select:none}
  td.song.playable:hover .play,td.song.playable.playing .play{opacity:1}
  td.song.playable.playing{background:rgba(var(--hacker-secondary-rgb),.14)}
  .day td{background:var(--panel);color:var(--accent);font-size:13.8px;
          text-transform:uppercase;letter-spacing:.08em;padding:7px 10px}
  /* show bars were already bumped 15% (12.5px -> 14.4px); left as-is */
  tr.showbar td{background:rgba(255,199,153,.10);color:var(--yellow);font-size:14.4px;font-weight:600;
                letter-spacing:.02em;padding:9px 10px;border-top:1px solid rgba(255,199,153,.36);
                border-bottom:1px solid rgba(80,80,80,.75)}
  tr.showbar .au{color:var(--au)}
  tr.showbar .mut{color:var(--mut);font-weight:400}
  tr.unverified .song{opacity:.6;text-decoration:underline dotted rgba(160,160,160,.72);text-underline-offset:3px}
  tr.origin-corrected .song{color:var(--ink);opacity:1}
  tr.origin-corrected .len{opacity:1}
  tr.unverified .len{opacity:.6}
  .empty{padding:28px 10px;color:var(--mut)}
  .dashboard{border-bottom:1px solid var(--line);background:var(--panel)}
  .dashgrid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:1px;background:var(--line)}
  .dashstat{min-width:0;border:0;background:var(--panel);color:var(--ink);text-align:left;padding:8px 10px;cursor:pointer}
  .dashstat:hover,.dashstat.active{background:#24201d}
  .dashstat .value{display:block;font-size:19px;font-weight:650;font-variant-numeric:tabular-nums;line-height:1.12}
  .dashstat .label{display:block;margin-top:2px;color:var(--mut);font-size:12px;line-height:1.2}
  .dashstat.warn .value{color:var(--warn)} .dashstat.au .value{color:var(--au)}
  .toolbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:0 0 9px}
  .toolbar input,.toolbar select,.toolbar button{background:var(--panel);border:1px solid var(--line);border-radius:4px;color:var(--ink);font:inherit;font-size:13px;padding:5px 8px;min-height:32px}
  .toolbar input{flex:1 1 210px;min-width:150px}.toolbar select{max-width:190px}
  .toolbar button{cursor:pointer}.toolbar button[aria-pressed="true"]{border-color:var(--accent);color:var(--accent)}
  .toolbar .view-switch{display:flex;gap:4px;margin-right:auto}
  .table-wrap{overflow-x:auto} .rec,.src{white-space:nowrap;width:95px;font-size:12px;color:var(--mut)}
  .conf{white-space:nowrap;width:66px;text-align:center;font-variant-numeric:tabular-nums;color:var(--ink);font-size:inherit}
  .conf.low{color:var(--red)}.conf.mid{color:var(--warn)}.conf.high{color:var(--au)}
  .rec .tag{margin-right:0}.source-code{font-size:12px;color:var(--yellow)}
  .detail-trigger{background:none;border:0;color:var(--accent);cursor:pointer;font:inherit;font-size:12px;padding:0 0 0 6px;text-decoration:underline;text-underline-offset:2px}
  .filter-note{color:var(--mut);font-size:12px;margin-left:auto;font-variant-numeric:tabular-nums}
  .explain-line{font-size:12px;color:var(--mut);padding:0 0 8px}.explain-line b{color:var(--yellow);font-weight:600}
  .verification{display:none}.verification.active{display:block}.song-view.hidden{display:none}
  .verification-head{display:flex;justify-content:space-between;gap:12px;align-items:end;margin-bottom:9px}
  .verification-head h2{font-size:18px;margin:0;font-weight:650}.verification-head p{margin:2px 0 0;color:var(--mut);font-size:12px}
  .verification-meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--mut);font-size:12px;margin:0 0 9px}
  .verification-table th{position:static;box-shadow:none}.verification-table td{font-size:13px;padding:7px 9px}.verification-table .candidate{font-weight:550}
  .provider-performance{margin:0 0 14px}.provider-performance h3{font-size:13px;margin:0 0 5px;color:var(--ink)}
  .provider-performance p{font-size:12px;color:var(--mut);margin:0 0 6px}
  .provider-performance table{width:100%;font-size:12px}.provider-performance th,.provider-performance td{padding:5px 8px;white-space:nowrap}
  .provider-performance th{color:var(--mut);font-weight:550}.provider-performance td:first-child{font-weight:600;color:var(--ink)}
  .provider-performance .trend-details{margin-top:6px;color:var(--yellow);font-size:12px}.provider-performance .trend-details summary{cursor:pointer;color:var(--accent)}
  .provider-performance .trend-details .table-wrap{max-height:440px;overflow:auto}
  .duplicate-review{margin:14px 0}.duplicate-review h3{font-size:13px;margin:0 0 5px;color:var(--ink)}.duplicate-review p{font-size:12px;color:var(--mut);margin:3px 0 6px}
  .duplicate-review .table-wrap{max-height:500px;overflow:auto}.duplicate-review table{font-size:12px}.duplicate-review td,.duplicate-review th{padding:6px 8px;vertical-align:top}.duplicate-review summary{cursor:pointer;color:var(--accent);white-space:nowrap}.duplicate-airings{padding:6px 0;line-height:1.7;color:var(--ink);min-width:320px}
  .pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:10px 0;color:var(--mut);font-size:12px}
  .pager button{background:var(--panel);border:1px solid var(--line);color:var(--ink);padding:4px 10px;border-radius:4px;cursor:pointer}.pager button:disabled{opacity:.4;cursor:default}
  .detail-backdrop{position:fixed;inset:0;background:rgba(8,10,12,.75);z-index:19;display:none}.detail-backdrop.open{display:block}
  .detail-panel{position:fixed;right:0;top:0;bottom:0;width:min(620px,100%);overflow:auto;background:var(--panel);border-left:1px solid var(--line);z-index:20;display:none;padding:18px 20px 30px;box-shadow:-16px 0 40px rgba(0,0,0,.45)}
  .detail-panel.open{display:block}.detail-panel h2{font-size:20px;line-height:1.2;margin:2px 34px 5px 0}.detail-panel h3{font-size:13px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em;margin:18px 0 7px}
  .detail-panel p{margin:4px 0;font-size:13px}.detail-panel .muted{color:var(--mut)}
  .detail-close{position:absolute;right:16px;top:13px;background:none;border:1px solid var(--line);border-radius:4px;color:var(--ink);font-size:18px;line-height:1;padding:4px 8px;cursor:pointer}
  .evidence-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.evidence-item{border:1px solid var(--line);border-radius:4px;padding:7px 9px;min-width:0}.evidence-item b{display:block;font-size:12px}.evidence-item span{font-size:12px;color:var(--mut)}
  .detail-panel .basis{border-left:2px solid var(--accent);padding-left:9px;margin-top:10px}
  .candidate-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.candidate-item{min-width:0;border:1px solid var(--line);padding:7px 9px;border-radius:4px}.candidate-item b,.candidate-item span,.candidate-item small{display:block}.candidate-item b{font-size:12px;color:var(--yellow)}.candidate-item span{font-size:13px;overflow-wrap:anywhere}.candidate-item small{font-size:11px;color:var(--mut)}.detail-panel audio{width:100%;height:38px}
  @media(max-width:900px){.dashgrid{grid-template-columns:repeat(4,minmax(0,1fr))}.rec,.src{width:auto}}
  @media(max-width:760px){ .song-view .table-wrap{overflow-x:auto;overscroll-behavior-x:contain}
    .song-view table{min-width:1260px} .show{min-width:190px;max-width:190px} .ann{width:140px}
    .song-view td{padding:7px 8px;border-bottom:1px solid rgba(80,80,80,.75)}
    .rec,.src,.conf{display:inline-block;padding:2px 10px;width:auto}.evidence-grid,.candidate-grid{grid-template-columns:1fr}
    .dashgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .totals{text-align:left;font-size:17.25px}
    .msum{margin-left:0;width:100%}
    .mgrid{grid-template-columns:repeat(auto-fill,minmax(62px,1fr))} }
  /* Keep the data view dense without shrinking its text into illegibility. */
  body{font-family:Inter,"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,Arial,sans-serif;font-size:15px;line-height:1.45}
  header{padding:10px 0}
  .head{align-items:center;gap:10px 18px}
  h1{font-size:18px}
  .meta{gap:7px 11px;font-size:13px}
  .totals{font-size:18px}
  .mrow{gap:6px;padding-block:6px 5px}
  .mgrid{padding-bottom:7px}
  main{padding-top:9px}
  .dashstat{padding:8px 9px}
  .dashstat .value{font-size:18px}
  .dashstat .label{font-size:11px}
  .toolbar input,.toolbar select,.toolbar button{min-height:36px}
  .explain-line{font-size:12px;line-height:1.45}
  thead th{padding:8px 8px;font-size:12px}
  td{padding:7px 8px}
  @media(max-width:760px){
    header{padding:9px 0}
    .head{align-items:flex-start}
    .meta{gap:6px 9px}
    .hright{margin-left:auto}
    .totals{font-size:16px}
    .dashstat{padding:8px}
    .toolbar{gap:6px}
    .toolbar input{flex-basis:100%}
    .toolbar select{flex:1 1 145px;max-width:none}
    .filter-note{width:100%;margin:0;text-align:right}
    .showbar-content{width:calc(100vw - 44px);align-items:flex-start}
    .showbar-stats{width:100%;justify-content:flex-end}
    tr{padding-block:7px}
    td{padding:2px 8px}
    td.song{font-size:15px;line-height:1.4}
    .rec,.src,.conf{padding:3px 8px 2px 0}
    .verification-head{align-items:flex-start;flex-direction:column}
    .provider-performance .table-wrap,.verification .table-wrap{overscroll-behavior-x:contain}
  }
  .lyrics-testing{border:1px solid var(--line);border-radius:5px;padding:12px;margin:0 0 15px}
  .lyrics-testing-controls,.lyrics-test-players{display:flex;gap:12px;flex-wrap:wrap;margin:9px 0}
  .lyrics-testing-controls label,.lyrics-test-players label{display:flex;flex-direction:column;gap:5px;min-width:210px;flex:1;font-size:12px;color:var(--mut)}
  .lyrics-testing input,.lyrics-testing select{max-width:100%;background:var(--panel);border:1px solid var(--line);border-radius:4px;color:var(--ink);font:inherit;padding:5px}
  .lyrics-test-players audio{width:100%;max-width:360px}
  .lyrics-test-transcripts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:10px 0}
  .lyrics-test-transcript{border:1px solid var(--line);border-radius:4px;padding:9px;min-width:0}
  .lyrics-test-transcript h4{margin:0 0 5px;font-size:12px;color:var(--accent)}
  .lyrics-test-transcript p{font-size:13px;color:var(--ink);white-space:pre-wrap;overflow-wrap:anywhere}
  .lyrics-test-transcript small{font-size:11px;color:var(--mut)}
  .lyrics-testing td{white-space:normal;min-width:95px;vertical-align:top;overflow-wrap:anywhere}
  @media(max-width:760px){.lyrics-test-transcripts{grid-template-columns:1fr}}
  /* Moonlit states: keep the original dense log layout while carrying the palette
     through hover, warnings, selection and focus. */
  tr:hover td{background:rgba(167,185,245,.055)}
  .mday.today{border-color:rgba(201,200,255,.68)}
  .mday.sel{box-shadow:inset 0 0 0 1px rgba(201,200,255,.34)}
  .mday.has:hover{border-color:rgba(167,185,245,.72)}
  .day td{background:#111a2d}
  tr.showbar td{background:rgba(201,200,255,.075);border-top-color:rgba(201,200,255,.28);border-bottom-color:var(--line)}
  .dashstat:hover,.dashstat.active{background:#1a2740}
  .tag.news,.tag.disp{background:rgba(240,189,138,.12);border-color:rgba(240,189,138,.42)}
  .tag.au,.tag.fp,.tag.gl,.tag.settled{box-shadow:inset 0 0 0 1px rgba(155,214,139,.035)}
  :focus-visible{outline:2px solid var(--accent);outline-offset:2px}