/* HitAmp: the playlist of choruses, drawn like a desktop MP3 player from the early 2000s (16.10.2026) */
.ha-section{background:var(--navy-deep)}
.ha-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:clamp(28px,5vw,64px);align-items:center}
.ha-note{font-size:13px;color:#9FB6C1;margin:14px 0 0;max-width:52ch}
@media (max-width:900px){.ha-grid{grid-template-columns:1fr}.ha{justify-self:center}}

.ha{--row:30px;width:min(100%,380px);display:grid;gap:6px;font-family:"Archivo",system-ui,sans-serif;user-select:none;-webkit-user-select:none}
.ha-win{background:linear-gradient(180deg,#3B3B4F 0%,#28283A 100%);border:1px solid #11111A;box-shadow:inset 1px 1px 0 #5C5C78,inset -1px -1px 0 #18182A,0 18px 40px rgba(0,0,0,.45);padding:6px 8px 9px}
.ha-bar{display:flex;align-items:center;gap:8px;height:18px;margin-bottom:6px;background:repeating-linear-gradient(180deg,#C9A23A 0 1px,transparent 1px 3px);background-size:100% 9px;background-repeat:no-repeat;background-position:0 50%}
.ha-bar__t{background:#28283A;color:#E8E3C8;font:800 12px/1 "Archivo",sans-serif;font-stretch:75%;letter-spacing:.18em;padding:0 8px;margin:0 auto}
.ha-bar__logo{width:12px;height:12px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#FFD86B,#E86A12);flex:none;box-shadow:0 0 0 2px #28283A}
.ha-bar__dots{display:flex;gap:3px;background:#28283A;padding-left:6px}.ha-bar__dots i{width:9px;height:9px;background:#5A5A74;box-shadow:inset 1px 1px 0 #8A8AA8}
.ha-pl__sum{background:#28283A;color:#9FB6C1;font:600 12px/1 "Archivo",sans-serif;padding:0 6px}

.ha-body{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px}
.ha-lcd{background:#000;border:1px solid #11111A;box-shadow:inset 1px 1px 0 #000,1px 1px 0 #5C5C78;padding:5px 7px;display:grid;gap:4px;min-width:112px}
.ha-time{display:flex;align-items:center;gap:8px;color:#2BE23B;font:400 30px/1 "Bebas Neue",Impact,sans-serif;letter-spacing:.06em;text-shadow:0 0 6px rgba(43,226,59,.55)}
.ha-state{font-size:12px;width:12px;text-align:center}
.ha-vis{width:112px;height:28px;display:block;image-rendering:pixelated}
.ha-info{display:grid;gap:6px;min-width:0}
.ha-marquee{background:#000;border:1px solid #11111A;box-shadow:1px 1px 0 #5C5C78;color:#2BE23B;font:600 13px/26px "Archivo",sans-serif;height:28px;overflow:hidden;white-space:nowrap;padding:0 6px}
.ha-title{display:inline-block;padding-left:100%;animation:ha-scroll 14s linear infinite}
@keyframes ha-scroll{from{transform:translateX(0)}to{transform:translateX(-100%)}}
.ha-tech{color:#2BE23B;font:600 11px/1 "Archivo",sans-serif;letter-spacing:.04em;opacity:.85}
.ha-tech b{color:#E8E3C8;font-weight:700}
.ha-mono,.ha-stereo{opacity:.3;margin-left:4px}.ha-stereo.on{opacity:1}

.ha-seek{width:100%;margin:8px 0 6px;accent-color:#C9A23A;height:16px}
.ha-ctrl{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.ha-btns{display:flex;gap:3px}
.ha-b{width:38px;height:34px;display:grid;place-items:center;background:linear-gradient(180deg,#D5D5E0,#9C9CB2);border:1px solid #1B1B2A;box-shadow:inset 1px 1px 0 #F4F4FA,inset -1px -1px 0 #6C6C84;color:#202030;cursor:pointer;padding:0}
.ha-b svg{width:16px;height:16px;fill:currentColor}
.ha-b:active{background:linear-gradient(180deg,#9C9CB2,#C5C5D2);box-shadow:inset 1px 1px 0 #6C6C84}
.ha-b:focus-visible,.ha-t:focus-visible,.ha-row:focus-visible,.ha-vol__in:focus-visible,.ha-seek:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:2px}
.ha.is-playing .ha-play{color:#0E7A1A}
.ha-toggles{display:flex;gap:3px}
.ha-t{height:34px;padding:0 8px;background:#1E1E2C;border:1px solid #11111A;color:#8A8AA8;font:800 12px/1 "Archivo",sans-serif;font-stretch:75%;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.ha-t[aria-pressed="true"]{color:#2BE23B;text-shadow:0 0 6px rgba(43,226,59,.5)}
.ha-vol{flex:1 1 90px;display:flex;align-items:center;min-width:90px}
.ha-vol__in{width:100%;accent-color:#2BE23B}

.ha-list{list-style:none;margin:0;padding:4px 0;background:#000;border:1px solid #11111A;box-shadow:1px 1px 0 #5C5C78;max-height:calc(var(--row) * 4 + 8px);overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#5A5A74 #11111A}
.ha-row{width:100%;display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:6px;align-items:center;min-height:var(--row);padding:3px 8px;background:none;border:0;color:#2BE23B;font:600 13px/1.25 "Archivo",sans-serif;text-align:left;cursor:pointer}
.ha-row:hover{background:#0B1A40}
.ha-row.on{background:#0A2AA6;color:#fff}
.ha-row__n{opacity:.8;text-align:right}
.ha-row__t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ha-row__d{opacity:.8;font-variant-numeric:tabular-nums}
@media (pointer:coarse){.ha{--row:44px}.ha-b{height:44px}.ha-t{height:44px}}

html.hf-paused .ha-title{animation:none;padding-left:0}
@media (prefers-reduced-motion:reduce){.ha-title{animation:none;padding-left:0}}
@media (max-width:420px){.ha-body{grid-template-columns:1fr}.ha-lcd{grid-template-columns:auto 1fr;align-items:center}.ha-vis{width:100%}.ha-b{width:40px}}

/* the mini player at the bottom (16.10.2026, Ioana: „fă asta ca un player, cu butoanele de player”) */
.ha-mini{position:fixed;z-index:95;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));width:min(calc(100vw - 32px),430px);display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px 10px 12px;background:linear-gradient(180deg,#3B3B4F,#28283A);border:1px solid #11111A;border-radius:10px;box-shadow:inset 1px 1px 0 #5C5C78,0 14px 34px rgba(0,0,0,.5);font-family:"Archivo",system-ui,sans-serif;animation:ha-mini-in .35s cubic-bezier(.2,.9,.25,1.2)}
.ha-mini[hidden]{display:none}
@keyframes ha-mini-in{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}
.ha-mini__eq{display:flex;align-items:flex-end;gap:2px;height:22px;width:20px;padding:4px 3px;background:#000;border:1px solid #11111A;box-sizing:content-box}
.ha-mini__eq i{flex:1;background:#2BE23B;height:30%}
.ha-mini.is-playing .ha-mini__eq i{animation:hf-eq .9s ease-in-out infinite}
.ha-mini.is-playing .ha-mini__eq i:nth-child(2){animation-delay:-.3s}.ha-mini.is-playing .ha-mini__eq i:nth-child(3){animation-delay:-.6s}
.ha-mini__t{min-width:0;display:grid;text-align:left;background:#000;border:1px solid #11111A;padding:4px 8px;cursor:pointer;color:#2BE23B;min-height:44px;align-content:center}
.ha-mini__n{font:700 14px/1.2 "Archivo",sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 0 6px rgba(43,226,59,.45)}
.ha-mini__a{font:600 11px/1.3 "Archivo",sans-serif;color:#9FD9A4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ha-mini__btns{display:flex;gap:3px}
.ha-mini__b{width:44px;height:44px;display:grid;place-items:center;padding:0;background:linear-gradient(180deg,#D5D5E0,#9C9CB2);border:1px solid #1B1B2A;box-shadow:inset 1px 1px 0 #F4F4FA,inset -1px -1px 0 #6C6C84;color:#202030;cursor:pointer}
.ha-mini__b svg{width:15px;height:15px;fill:currentColor}
.ha-mini__b:active{background:linear-gradient(180deg,#9C9CB2,#C5C5D2)}
.ha-mini__pp{color:#0E7A1A}
.ha-mini__x{color:#B8243A}
.ha-mini__b:focus-visible,.ha-mini__t:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:2px}
.ha-mini__bar{position:absolute;left:10px;right:10px;bottom:5px;height:3px;background:#11111A;overflow:hidden}
.ha-mini__bar i{display:block;height:100%;background:#C9A23A;transform-origin:0 50%;transform:scaleX(0)}
@media (max-width:420px){.ha-mini{grid-template-columns:minmax(0,1fr) auto;gap:8px}.ha-mini__eq{display:none}.ha-mini__b{width:42px}}
html.hf-paused .ha-mini.is-playing .ha-mini__eq i{animation:none;height:70%}
@media (prefers-reduced-motion:reduce){.ha-mini{animation:none}.ha-mini.is-playing .ha-mini__eq i{animation:none;height:70%}}
/* folded: a round button with the equaliser, at the same corner (19.10.2026, mobile audit) */
.ha-mini__fold{position:absolute;top:-31px;right:12px;width:48px;height:32px;display:grid;place-items:center;padding:0;background:linear-gradient(180deg,#3B3B4F,#28283A);border:1px solid #11111A;border-bottom:0;border-radius:10px 10px 0 0;color:#D5D5E0;cursor:pointer}
.ha-mini__fold svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.ha-mini__fold:focus-visible,.ha-mini__open:focus-visible{outline:2px solid var(--neon-cyan);outline-offset:2px}
.ha-mini__open{display:none}
.ha-mini.is-folded{width:64px;height:64px;padding:0;grid-template-columns:1fr;place-items:center;border-radius:50%;animation:none}
.ha-mini.is-folded .ha-mini__t,.ha-mini.is-folded .ha-mini__btns,.ha-mini.is-folded .ha-mini__bar,.ha-mini.is-folded .ha-mini__fold{display:none}
.ha-mini.is-folded .ha-mini__eq{display:flex;width:24px;height:24px}
.ha-mini.is-folded .ha-mini__open{display:block;position:absolute;inset:0;width:100%;height:100%;padding:0;background:transparent;border:0;border-radius:50%;cursor:pointer}
/* the two sliders are easier to catch with a finger: a taller target, the same thin track (19.10.2026, mobile audit) */
@media (pointer:coarse){.ha-seek{height:32px;margin:2px 0 0}.ha-vol__in{height:32px}}