/* ============================================================================
   SMART CHART THEME — INDUSTRIAL
   PORTED VERBATIM from industrial-final.html. Every value copied unchanged.
   Only mechanical changes: selectors renamed to live DOM, 2-class container
   prefix + targeted !important on the few properties the base sheet forces
   (display, dark-mode bg/color, section pill). steel=DARK, concrete=LIGHT.
   Source map: .panel->.lyric-sheet-container.cp-theme-industrial |
   .section->.section-marker | .tick->::before | .label->__name |
   .rule->::after | .plate->.lyric-title-plate | .spec-*->.lyric-meta-*
   ============================================================================ */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700&family=Stardos+Stencil:wght@400;700&family=JetBrains+Mono:wght@400;500;700&display=swap');

/* palettes verbatim — steel=dark, concrete=light; --chordcolor included */
.cp-theme-industrial.steel {
  --ground:#15171a; --ground-2:#1c1f23; --surface:#22262b; --line:#34393f; --line-bright:#4a5158;
  --text:#e8eaec; --text-dim:#8b9197; --chord:#f2f4f5; --accent:#ff5b1f; --accent-dim:#c7461a; --redorange:#ff6a3d;
  --chordcolor:#ff7a1f;
  --lyric:#e8eaec; --chord:#ff7a1f; --songmsg:#ff5b1f; --harmony:#e8eaec;
}
.cp-theme-industrial.concrete {
  --ground:#d4d1cb; --ground-2:#c9c6bf; --surface:#ddd9d2; --line:#aaa59c; --line-bright:#8a857c;
  --text:#1a1c1e; --text-dim:#615f59; --chord:#15171a; --accent:#e8470d; --accent-dim:#b8390b; --redorange:#d83a0a;
  --chordcolor:#d83a0a;
  --lyric:#1a1c1e; --chord:#d83a0a; --songmsg:#e8470d; --harmony:#1a1c1e;
}

/* .panel + .content merged onto container (content padding 40 46 34 verbatim) */
.cp-theme-industrial.lyric-sheet-container {
  position:relative; padding:40px 46px 34px; background:var(--ground); color:var(--text);
  font-family:'Archivo',sans-serif; -webkit-font-smoothing:antialiased;
  animation:cp-ind-rise .5s cubic-bezier(.2,.7,.3,1) both; transition:background .4s; overflow:hidden;
}
.cp-theme-industrial.steel.lyric-sheet-container,
.cp-theme-industrial.lyric-sheet-container.dark-mode {
  background-color:var(--ground) !important; padding:40px 46px 34px !important; border-radius:0 !important; color:var(--text) !important;
}
.cp-theme-industrial.concrete.lyric-sheet-container { background-color:var(--ground) !important; padding:40px 46px 34px !important; }
.cp-theme-industrial.steel.lyric-sheet-container {
  background-image:
    repeating-linear-gradient(96deg, transparent, transparent 2px, rgba(0,0,0,.05) 2px, rgba(0,0,0,.05) 3px),
    repeating-linear-gradient(91deg, transparent, transparent 40px, rgba(255,255,255,.012) 40px, rgba(255,255,255,.012) 41px),
    radial-gradient(ellipse at 12% 8%, rgba(0,0,0,.35) 0%, transparent 30%),
    radial-gradient(ellipse at 88% 95%, rgba(0,0,0,.4) 0%, transparent 35%),
    linear-gradient(135deg, rgba(255,255,255,.02) 0%, transparent 45%);
  box-shadow:0 1px 0 rgba(255,255,255,.04) inset, 0 24px 60px rgba(0,0,0,.6);
}
.cp-theme-industrial.concrete.lyric-sheet-container {
  background-image:
    radial-gradient(circle at 20% 30%, rgba(0,0,0,.04) 0%, transparent 7%),
    radial-gradient(circle at 70% 60%, rgba(0,0,0,.03) 0%, transparent 5%),
    radial-gradient(circle at 45% 85%, rgba(0,0,0,.035) 0%, transparent 6%),
    radial-gradient(ellipse at 90% 90%, rgba(0,0,0,.08) 0%, transparent 30%);
  box-shadow:0 24px 60px rgba(0,0,0,.25);
}
@keyframes cp-ind-rise { from{opacity:0;transform:translateY(8px);} to{opacity:1;transform:none;} }
.cp-theme-industrial.lyric-sheet-container > *:not(.lsc-drawing-canvas):not(.cp-ornament):not(.lyric-section-rail) { position:relative; z-index:1; }
.cp-theme-industrial.lyric-sheet-container > .lsc-drawing-canvas { position:absolute !important; top:0 !important; left:0 !important; z-index:10; }
.cp-theme-industrial.lyric-sheet-container { align-self:flex-start !important; align-self:start !important; height:fit-content !important; min-height:0 !important; }

/* .frame -> ::before; .reg crop-marks -> injected .cp-reg (verbatim) */
.cp-theme-industrial.lyric-sheet-container::before { content:""; position:absolute; inset:14px; border:1px solid var(--line); pointer-events:none; z-index:0; }
.cp-theme-industrial .cp-reg { position:absolute; width:16px; height:16px; pointer-events:none; z-index:3; }
.cp-theme-industrial .cp-reg::before,.cp-theme-industrial .cp-reg::after { content:""; position:absolute; background:var(--accent); }
.cp-theme-industrial .cp-reg::before { width:16px; height:2px; } .cp-theme-industrial .cp-reg::after { width:2px; height:16px; }
.cp-theme-industrial .cp-reg.tl{top:9px;left:9px;} .cp-theme-industrial .cp-reg.tr{top:9px;right:9px;} .cp-theme-industrial .cp-reg.tr::before{right:0;} .cp-theme-industrial .cp-reg.tr::after{right:0;}
.cp-theme-industrial .cp-reg.bl{bottom:9px;left:9px;} .cp-theme-industrial .cp-reg.bl::before{bottom:0;} .cp-theme-industrial .cp-reg.bl::after{bottom:0;}
.cp-theme-industrial .cp-reg.br{bottom:9px;right:9px;} .cp-theme-industrial .cp-reg.br::before{bottom:0;right:0;} .cp-theme-industrial .cp-reg.br::after{bottom:0;right:0;}

/* .plate -> title plate (verbatim) */
.cp-theme-industrial .lyric-title-plate { border-bottom:2px solid var(--accent); padding-bottom:16px; margin-bottom:6px; }
.cp-theme-industrial .lyric-title-plate__title { font-family:'Stardos Stencil',sans-serif; font-weight:700; font-size:52px; line-height:.9; letter-spacing:.01em; color:var(--text); margin:0; text-transform:uppercase; }
.cp-theme-industrial.steel .lyric-title-plate__title { text-shadow:0 2px 0 rgba(0,0,0,.4); }
.cp-theme-industrial .lyric-title-plate__link { color:inherit; text-decoration:none; }
.cp-theme-industrial .lyric-title-plate__link:hover { color:var(--accent); }

/* .spec-row -> meta strip (verbatim sizes) */
.cp-theme-industrial .lyric-meta-strip { display:flex; margin-top:14px; border:1px solid var(--line); width:fit-content; max-width:100%; font-family:'JetBrains Mono',monospace; flex-wrap:wrap; padding:0; }
.cp-theme-industrial .lyric-meta-item { padding:5px 14px; border-right:1px solid var(--line); display:flex; flex-direction:column; }
.cp-theme-industrial .lyric-meta-item:last-child { border-right:0; }
.cp-theme-industrial .lyric-meta-label { font-size:9px; letter-spacing:.16em; color:var(--text-dim); text-transform:uppercase; }
.cp-theme-industrial .lyric-meta-value { font-size:16px; font-weight:700; color:var(--text); line-height:1.3; }
.cp-theme-industrial .lyric-meta-key .lyric-meta-value { color:var(--accent); }
.cp-theme-industrial .lyric-meta-time-select { background:transparent; border:0; color:var(--text); font-family:'JetBrains Mono',monospace; font-size:16px; font-weight:700; cursor:pointer; padding:0; }
.cp-theme-industrial .lyric-state-pill { align-self:center; margin-left:12px; padding:4px 11px; background:transparent; border:1px solid var(--accent-dim); color:var(--accent); font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.06em; cursor:pointer; }

/* .section -> .section-marker (verbatim flex row; !important beats base block) */
.cp-theme-industrial.lyric-sheet-container .section-marker,
.cp-theme-industrial.lyric-sheet-container.dark-mode .section-marker {
  display:flex !important; align-items:center !important; gap:12px !important; margin:16px 0 6px !important; padding:0 !important; background:transparent !important; border:0 !important;
}
.cp-theme-industrial .section-marker:first-child { margin-top:6px !important; }
/* .tick -> ::before (10x10 accent square, verbatim) */
.cp-theme-industrial .section-marker::before { content:""; position:static !important; width:10px; height:10px; background:var(--accent); flex-shrink:0; border-radius:0; display:inline-block; }
/* .label -> __name (15px mono uppercase, verbatim; beat base pill + dark color) */
.cp-theme-industrial.lyric-sheet-container .section-marker__name,
.cp-theme-industrial.lyric-sheet-container.dark-mode .section-marker__name,
.cp-theme-industrial .section-marker__name {
  font-family:'JetBrains Mono',monospace !important; font-weight:700 !important; font-size:15px !important;
  letter-spacing:.18em !important; text-transform:uppercase !important; color:var(--text) !important;
  background:transparent !important; border:0 !important; border-radius:0 !important; padding:0 !important;
}
.cp-theme-industrial .section-marker__name::before { content:none !important; }
/* .rule -> ::after with the little end tick (verbatim) */
.cp-theme-industrial .section-marker::after { content:""; flex:1; height:1px; background:var(--line); position:relative; }
.cp-theme-industrial .section-marker__repeat,
.cp-theme-industrial.lyric-sheet-container .section-marker__repeat { font-family:'JetBrains Mono',monospace !important; font-weight:700 !important; font-size:12px !important; color:var(--accent) !important; background:transparent !important; padding:0 !important; border-radius:0 !important; margin-left:10px; }
.cp-theme-industrial .section-marker__note { font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--accent); text-transform:uppercase; letter-spacing:.04em; margin-left:10px; }

/* .lyrics + .chord -> verbatim (19px / line-height 3.0; chord top -1.25em 0.78em) */
.cp-theme-industrial .lyrics { font-family:'Archivo',sans-serif; font-weight:400; font-size:19px; line-height:var(--clh); margin:0; color:var(--text); letter-spacing:.005em; }
.cp-theme-industrial.lyric-sheet-container.dark-mode .lyrics { color:var(--text) !important; }
.cp-theme-industrial .lyrics .chord { position:relative; display:inline-block; height:1.2em; vertical-align:baseline; }
.cp-theme-industrial .lyrics .chord .chord-text {
  position:absolute; top:var(--ctop); left:0; line-height:1; white-space:nowrap;
  font-family:'JetBrains Mono',monospace; font-weight:700; font-size:0.78em; letter-spacing:.01em; color:var(--chordcolor);
}
.cp-theme-industrial.lyric-sheet-container.dark-mode .lyrics .chord .chord-text { color:var(--chordcolor) !important; }
.cp-theme-industrial .chords { font-family:'JetBrains Mono',monospace; color:var(--text); line-height:1.3; }
.cp-theme-industrial.lyric-sheet-container.dark-mode .chords { color:var(--text) !important; }

/* .notation + .directive -> verbatim */
.cp-theme-industrial .notation,
.cp-theme-industrial .style-chords { font-family:'JetBrains Mono',monospace; font-weight:500; font-size:15px; line-height:1.4; letter-spacing:.02em; color:var(--text); background:var(--surface); border:1px solid var(--line); border-left:3px solid var(--accent); padding:8px 14px; margin:10px 0; display:inline-block; }
.cp-theme-industrial .directive { font-family:'JetBrains Mono',monospace; font-weight:700; font-size:.82em; letter-spacing:.04em; text-transform:uppercase; color:var(--accent); }

/* .endplate -> verbatim */
.cp-theme-industrial .endplate { margin-top:34px; border-top:1px solid var(--line); padding-top:12px; display:flex; justify-content:space-between; align-items:center; font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-dim); }
.cp-theme-industrial .endplate .end-mark { color:var(--accent); font-weight:700; }

/* ============================================================================
   INJECTED CHROME (not in your prototype) — same idiom.
   ============================================================================ */
.cp-theme-industrial .lyric-controls { font-family:'JetBrains Mono',monospace; margin:18px 0 0; background:transparent !important; }
.cp-theme-industrial.lyric-sheet-container.dark-mode .lyric-controls { background:transparent !important; }
.cp-theme-industrial .tools-toggle { background:#d35400; color:#fff; border:0; padding:10px 18px; font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; }
.cp-theme-industrial .tools-toggle[aria-expanded="true"] { background:#b8470a; color:#fff; }
.cp-theme-industrial .tools-panel { margin-top:10px; padding:14px; background:var(--ground-2); border:1px solid var(--line); display:flex; flex-wrap:wrap; gap:14px 18px; align-items:center; }
.cp-theme-industrial .tools-panel > div { display:flex; align-items:center; gap:7px; }
.cp-theme-industrial .tools-panel label { font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-dim); }
.cp-theme-industrial .tools-panel button, .cp-theme-industrial .tools-panel select, .cp-theme-industrial .lyric-theme-select { background:var(--surface); color:var(--text); border:1px solid var(--line); font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:500; padding:5px 10px; cursor:pointer; letter-spacing:.04em; }
.cp-theme-industrial .tools-panel button:hover, .cp-theme-industrial .lyric-theme-select:hover { border-color:var(--accent); color:var(--accent); }
.cp-theme-industrial .lyric-section-ribbon { display:flex; flex-wrap:wrap; gap:5px; margin:16px 0 0; }
.cp-theme-industrial.lyric-sheet-container .lyric-ribbon-chip,
.cp-theme-industrial.lyric-sheet-container.dark-mode .lyric-ribbon-chip { background:var(--surface) !important; color:var(--text) !important; border:1px solid var(--line) !important; border-bottom:2px solid var(--accent) !important; font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:700; letter-spacing:.05em; padding:4px 9px; }
.cp-theme-industrial .lyric-chord-cheats { display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:14px 0 0; }
.cp-theme-industrial .lyric-chord-cheats-label { font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-dim); margin-right:4px; }
.cp-theme-industrial .lyric-chord-cheat { font-family:'JetBrains Mono',monospace; font-size:13px; font-weight:700; color:var(--chordcolor); padding:3px 8px; border:1px solid var(--line); background:var(--ground-2); }
.cp-theme-industrial .section-vocalist-chip { font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; margin-left:9px; padding:2px 7px; background:var(--accent); color:var(--ground); }
.cp-theme-industrial .personal-note { font-family:'JetBrains Mono',monospace; font-size:.66em; font-weight:500; background:rgba(255,91,31,.10); border-left:2px solid var(--accent-dim); color:var(--redorange); padding:1px 6px; margin:0 4px; cursor:pointer; letter-spacing:.02em; vertical-align:middle; }
.cp-theme-industrial.lyric-sheet-container .section-marker[data-section-type] { background:transparent !important; border-left:0 !important; padding:0 !important; }

/* CENTERED variant — block centered on page, lines left-aligned to a common
   left edge. Lyric lines are bare text nodes + <br> (no .lyrics wrapper), so
   shrink the container to its widest line and auto-center that block. */
.cp-theme-industrial.cp-centered.lyric-sheet-container {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  text-align: left;
}
.cp-theme-industrial.cp-centered .lyrics { text-align:left; }
.cp-theme-industrial.cp-centered .tools-panel,
.cp-theme-industrial.cp-centered .theme-picker-controls,
.cp-theme-industrial.cp-centered .lyric-controls,
.cp-theme-industrial.cp-centered .lyric-meta-strip,
.cp-theme-industrial.cp-centered .lyric-section-ribbon,
.cp-theme-industrial.cp-centered .personal-note { text-align:left; }
.cp-theme-industrial.cp-centered .section-marker { justify-content:flex-start !important; }
.cp-theme-industrial.cp-centered .section-marker::after { display:none; }

/* section rail (sticky right-edge jump nav) — themed to match */
.cp-theme-industrial .lyric-section-rail-item { color:var(--text-dim) !important; font-family:'JetBrains Mono',monospace; font-size:10px; font-weight:700; letter-spacing:.08em; }
.cp-theme-industrial .lyric-section-rail-item:hover { color:var(--accent) !important; }