:root{
  --bg:#0f1115;
  --dark:#101216;
  --dark2:#171a20;
  --card:#1d2028;
  --card2:#232733;
  --text:#f7f3ec;
  --muted:#a9a196;
  --cream:#fff6e7;
  --creamText:#261f18;
  --line:rgba(255,255,255,.10);
  --orange:#f0a526;
  --orange2:#df8b35;
  --green:#51a46b;
  --shadow:0 24px 70px rgba(0,0,0,.35);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Arial,sans-serif;
  background:var(--dark);
  color:var(--text);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(1180px,calc(100% - 36px));margin:0 auto}

.site-header{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(15,17,21,.88);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line);
}

.header-shell{
  min-height:72px;
  display:flex;
  align-items:center;
  gap:18px;
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
}

.brand-mark{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:linear-gradient(135deg,var(--orange),#ffcf67);
  color:#21170c;
  font-weight:900;
}

.brand-text{
  font-size:20px;
  font-weight:900;
  letter-spacing:-.04em;
}

.brand-text span{
  color:var(--orange);
}

.main-nav{
  display:flex;
  align-items:center;
  gap:18px;
  color:var(--muted);
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
}

.main-nav a:hover{
  color:var(--text);
}

.header-search{
  flex:1 1 auto;
  max-width:270px;
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:6px;
  padding:5px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid var(--line);
}

.header-search input{
  width:100%;
  min-height:34px;
  border:0;
  outline:0;
  color:var(--text);
  background:transparent;
  padding:0 10px;
}

.header-search button{
  width:34px;
  height:34px;
  border:0;
  border-radius:999px;
  background:var(--orange);
  color:#1d160d;
  font-weight:900;
  cursor:pointer;
}

.header-right{
  display:flex;
  align-items:center;
  gap:9px;
  flex:0 0 auto;
}

.lang-switch{
  display:flex;
  gap:4px;
}

.lang-switch a{
  min-width:32px;
  height:32px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:var(--muted);
  border:1px solid var(--line);
  font-size:12px;
  font-weight:900;
}

.lang-switch a.is-active{
  color:#1b140c;
  background:var(--orange);
  border-color:var(--orange);
}

.account-link{
  color:var(--muted);
  font-size:14px;
  font-weight:800;
  white-space:nowrap;
}

.shop-cta{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:999px;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
  box-shadow:0 12px 28px rgba(240,165,38,.22);
}

.mobile-toggle{
  display:none;
  width:42px;
  height:42px;
  border:1px solid var(--line);
  border-radius:14px;
  color:var(--text);
  background:rgba(255,255,255,.07);
  font-size:20px;
}

.mobile-panel{
  display:none;
  border-top:1px solid var(--line);
  background:rgba(15,17,21,.96);
}

.mobile-panel.is-open{
  display:block;
}

.mobile-search{
  display:flex;
  gap:8px;
  padding:16px 0;
}

.mobile-search input{
  flex:1;
  min-height:44px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.07);
  color:var(--text);
  padding:0 16px;
}

.mobile-search button{
  border:0;
  border-radius:999px;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
  padding:0 16px;
}

.mobile-nav{
  display:grid;
  gap:0;
  padding-bottom:16px;
}

.mobile-nav a{
  padding:13px 0;
  border-top:1px solid var(--line);
  color:var(--muted);
  font-weight:900;
}

/* HERO */

.hero-banner{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 80% 20%, rgba(240,165,38,.24), transparent 34%),
    linear-gradient(180deg,#11141a 0%,#0f1115 100%);
}

.hero-bg{
  position:absolute;
  inset:0;
  opacity:.16;
  background:
    linear-gradient(120deg, transparent 0%, rgba(255,255,255,.16) 50%, transparent 100%);
  pointer-events:none;
}

.hero-grid{
  position:relative;
  z-index:2;
  min-height:680px;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:42px;
  align-items:center;
  padding:72px 0;
}

.hero-pill{
  display:inline-flex;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(240,165,38,.14);
  color:#ffc46b;
  font-size:13px;
  font-weight:900;
  margin-bottom:24px;
}

.hero-copy h1{
  max-width:720px;
  margin:0;
  font-size:clamp(56px,8vw,110px);
  line-height:.92;
  letter-spacing:-.075em;
}

.hero-copy p{
  max-width:620px;
  color:var(--muted);
  font-size:20px;
  line-height:1.7;
  margin:26px 0 30px;
}

.hero-search{
  max-width:660px;
  display:flex;
  gap:10px;
  padding:9px;
  border-radius:999px;
  background:#fff;
  box-shadow:var(--shadow);
}

.hero-search input{
  flex:1;
  min-height:54px;
  border:0;
  outline:0;
  padding:0 18px;
  background:transparent;
  color:#1f1a14;
  font-size:17px;
}

.hero-search button{
  border:0;
  border-radius:999px;
  padding:0 24px;
  background:var(--orange2);
  color:#fff;
  font-weight:900;
  font-size:16px;
  cursor:pointer;
}

.hero-tags{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:18px;
}

.hero-tags a{
  display:inline-flex;
  min-height:34px;
  align-items:center;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid var(--line);
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.hero-feature-card{
  overflow:hidden;
  border-radius:34px;
  background:linear-gradient(180deg,#232733,#181b22);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}

.hero-card-image{
  height:340px;
  background:
    radial-gradient(circle at 45% 30%, rgba(255,255,255,.18), transparent 28%),
    linear-gradient(135deg,#2a313d,#0e1015 60%,#7d4e20);
}

.hero-card-body{
  padding:26px;
}

.hero-card-body span{
  color:#ffc46b;
  font-size:13px;
  font-weight:900;
}

.hero-card-body h2{
  margin:8px 0 6px;
  font-size:32px;
  line-height:1;
  letter-spacing:-.05em;
}

.hero-card-body p{
  margin:0;
  color:var(--muted);
}

.hero-card-chords{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:18px 0;
}

.hero-card-chords b{
  display:inline-grid;
  place-items:center;
  min-width:42px;
  height:38px;
  border-radius:12px;
  background:rgba(240,165,38,.14);
  color:#ffc46b;
}

.hero-card-button{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:0 18px;
  border-radius:999px;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
}

.home-strip{
  background:#151820;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}

.home-strip-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
}

.home-strip-grid a{
  padding:22px;
  background:rgba(255,255,255,.03);
}

.home-strip-grid strong{
  display:block;
  color:var(--text);
  margin-bottom:6px;
}

.home-strip-grid span{
  color:var(--muted);
  font-size:14px;
}

.section{
  padding:86px 0;
}

.section--dark{
  background:#101216;
}

.section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin-bottom:30px;
}

.section-head h2{
  margin:0;
  font-size:clamp(36px,5vw,64px);
  line-height:1;
  letter-spacing:-.06em;
}

.section-head p{
  margin:12px 0 0;
  color:var(--muted);
}

.ghost-link{
  color:#ffc46b;
  font-weight:900;
}

.artist-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}

.artist-card{
  overflow:hidden;
  border-radius:28px;
  background:#1b1f28;
  border:1px solid var(--line);
  box-shadow:0 14px 34px rgba(0,0,0,.22);
}

.artist-card__image{
  display:block;
  aspect-ratio:16/10;
  overflow:hidden;
  background:#2a2e38;
}

.artist-card__image img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.artist-card__body{
  padding:22px;
}

.artist-card h3{
  margin:0 0 7px;
  font-size:23px;
  line-height:1.1;
  letter-spacing:-.04em;
}

.artist-card p{
  margin:0;
  color:var(--muted);
}

.top-mini-title{
  margin-top:16px;
  color:#ffc46b;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.top-song-list{
  display:grid;
  gap:7px;
  margin:10px 0 0;
  padding:0;
  list-style:none;
}

.top-song-list a{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:9px 11px;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  color:var(--text);
}

.top-song-list small{
  color:var(--muted);
  font-weight:800;
}

.empty-songs{
  margin-top:16px;
  padding:12px;
  border-radius:14px;
  background:rgba(255,255,255,.06);
  color:var(--muted);
}

.artist-card__more{
  display:inline-flex;
  margin-top:16px;
  color:#ffc46b;
  font-weight:900;
}

/* reuse light pages */
.page-section,
.artist-hero{
  background:var(--cream);
  color:var(--creamText);
}

.page-section{
  padding:110px 0 72px;
}

.footer{
  padding:34px 0;
  color:var(--muted);
  background:#0f1115;
  border-top:1px solid var(--line);
}

.footer__inner{
  display:flex;
  justify-content:space-between;
  gap:20px;
}

/* keep existing common form/list/song elements usable */
.btn,.btn--primary{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:999px;
  border:0;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
}

.btn--full{width:100%}

@media(max-width:1180px){
  .header-search{display:none}
  .main-nav{gap:13px}
}

@media(max-width:980px){
  .main-nav,.account-link,.shop-cta,.lang-switch{display:none}
  .mobile-toggle{display:inline-grid;place-items:center;margin-left:auto}
  .hero-grid{grid-template-columns:1fr;min-height:auto;padding:58px 0}
  .hero-feature-card{max-width:560px}
  .home-strip-grid{grid-template-columns:repeat(2,1fr)}
  .artist-grid{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:640px){
  .container{width:min(100% - 28px,1180px)}
  .header-shell{min-height:66px}
  .brand-text{font-size:18px}
  .hero-copy h1{font-size:56px}
  .hero-copy p{font-size:18px}
  .hero-search{border-radius:22px;flex-direction:column}
  .hero-search button{min-height:48px}
  .hero-card-image{height:240px}
  .home-strip-grid,.artist-grid{grid-template-columns:1fr}
  .section{padding:62px 0}
}

/* HERO: song of the day */
.hero-banner--song-day .hero-grid{
  min-height:650px;
}

.hero-banner--song-day .hero-copy p{
  margin-bottom:0;
}

.hero-feature-card--today{
  position:relative;
}

.hero-card-image--photo{
  background-size:cover;
  background-position:center;
}

.hero-feature-card--today .hero-card-body{
  position:relative;
}

.hero-feature-card--today .hero-card-body h2{
  max-width:460px;
}

@media(max-width:760px){
  .hero-banner--song-day .hero-grid{
    min-height:auto;
  }
}


/* Home section under hero */
.home-quick{
  position:relative;
  overflow:hidden;
  padding:58px 0 64px;
  background:
    radial-gradient(circle at 8% 12%, rgba(240,165,38,.18), transparent 32%),
    linear-gradient(180deg,#fff4df 0%,#f7ead2 100%);
  color:#261f18;
  border-top:1px solid rgba(255,255,255,.08);
}

.home-quick:before{
  content:'♪';
  position:absolute;
  right:clamp(22px,8vw,120px);
  top:-54px;
  color:rgba(38,31,24,.055);
  font-size:210px;
  font-weight:900;
  line-height:1;
  transform:rotate(-10deg);
  pointer-events:none;
}

.home-quick-head{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,420px);
  gap:34px;
  align-items:end;
  margin-bottom:22px;
}

.home-quick-head span{
  display:inline-flex;
  margin-bottom:10px;
  color:#98620d;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-quick-head h2{
  margin:0;
  max-width:720px;
  font-size:clamp(32px,4.6vw,58px);
  line-height:.98;
  letter-spacing:-.06em;
}

.home-quick-head p{
  margin:0;
  color:rgba(38,31,24,.68);
  font-size:17px;
  line-height:1.55;
}

.home-quick-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:14px;
}

.home-quick-card{
  min-height:190px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:20px;
  border-radius:28px;
  background:rgba(255,255,255,.58);
  color:#261f18;
  border:1px solid rgba(38,31,24,.10);
  box-shadow:0 16px 42px rgba(82,55,18,.10);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.home-quick-card:hover{
  transform:translateY(-3px);
  border-color:rgba(240,165,38,.42);
  box-shadow:0 22px 54px rgba(82,55,18,.16);
}

.home-quick-card--primary{
  grid-column:span 2;
  background:linear-gradient(135deg,#1a1d24,#2a2018 64%,#503410);
  color:var(--cream);
  border-color:rgba(255,255,255,.10);
}

.home-quick-card i{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:18px;
  background:rgba(240,165,38,.18);
  color:#3a2912;
}

.home-quick-card--primary i{
  background:rgba(240,165,38,.22);
  color:#ffc46b;
}

.home-quick-card i svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-quick-card strong{
  display:block;
  margin-bottom:8px;
  font-size:21px;
  line-height:1.05;
  letter-spacing:-.04em;
}

.home-quick-card small{
  display:block;
  color:rgba(38,31,24,.66);
  font-size:14px;
  line-height:1.42;
}

.home-quick-card--primary small{
  color:rgba(255,246,231,.72);
}

.home-quick-card em{
  margin-top:auto;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(240,165,38,.18);
  color:#744906;
  font-size:11px;
  font-style:normal;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}

@media(max-width:980px){
  .home-quick-head{
    grid-template-columns:1fr;
    gap:12px;
    align-items:start;
  }

  .home-quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .home-quick-card--primary{
    grid-column:span 2;
  }
}

@media(max-width:640px){
  .home-quick{
    padding:42px 0 48px;
  }

  .home-quick-head{
    margin-bottom:16px;
  }

  .home-quick-head p{
    font-size:16px;
  }

  .home-quick-grid{
    grid-template-columns:1fr;
  }

  .home-quick-card,
  .home-quick-card--primary{
    grid-column:auto;
    min-height:168px;
    border-radius:24px;
  }
}

/* Quick start fine tuning */
.home-quick-card > *{
  position:relative;
  z-index:1;
}

.home-quick-card--primary:before{
  content:'♪';
  position:absolute;
  right:-18px;
  bottom:-62px;
  z-index:0;
  color:rgba(255,196,107,.12);
  font-size:190px;
  font-weight:900;
  line-height:1;
  transform:rotate(-11deg);
  pointer-events:none;
}

.home-quick-card--primary:after{
  content:'';
  position:absolute;
  inset:auto -20% -55% 18%;
  z-index:0;
  height:170px;
  background:radial-gradient(circle, rgba(240,165,38,.26), transparent 66%);
  pointer-events:none;
}

/* Most played songs under quick start */
.home-popular{
  position:relative;
  overflow:hidden;
  padding:62px 0 68px;
  background:
    radial-gradient(circle at 86% 10%, rgba(240,165,38,.14), transparent 30%),
    linear-gradient(180deg,#17130f 0%,#101216 100%);
  color:var(--cream);
}

.home-popular:before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent);
}

.home-popular-head{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,410px);
  gap:32px;
  align-items:end;
  margin-bottom:22px;
}

.home-popular-head span{
  display:inline-flex;
  margin-bottom:10px;
  color:#ffc46b;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-popular-head h2{
  margin:0;
  max-width:760px;
  font-size:clamp(30px,4.1vw,54px);
  line-height:1;
  letter-spacing:-.058em;
}

.home-popular-head p{
  margin:0;
  color:rgba(255,246,231,.66);
  font-size:17px;
  line-height:1.55;
}

.home-popular-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.home-popular-card{
  position:relative;
  overflow:hidden;
  min-height:82px;
  display:grid;
  grid-template-columns:42px 54px minmax(0,1fr) auto auto;
  gap:10px;
  align-items:center;
  padding:12px 14px;
  border-radius:22px;
  background:rgba(255,255,255,.052);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 16px 42px rgba(0,0,0,.13);
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.home-popular-card:hover{
  transform:translateY(-2px);
  border-color:rgba(240,165,38,.42);
  background:rgba(255,255,255,.074);
}

.home-popular-card--featured{
  background:
    linear-gradient(135deg, rgba(240,165,38,.18), rgba(255,255,255,.055) 58%),
    rgba(255,255,255,.055);
}

.home-popular-card--featured:after{
  content:'Top 1';
  position:absolute;
  right:14px;
  top:-8px;
  color:rgba(240,165,38,.13);
  font-size:42px;
  font-weight:950;
  letter-spacing:-.07em;
  line-height:1;
  transform:rotate(-5deg);
  pointer-events:none;
}

.home-popular-card > *{
  position:relative;
  z-index:1;
}

.home-popular-card b{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  border-radius:14px;
  background:rgba(240,165,38,.16);
  color:#ffc46b;
  font-size:13px;
}

.home-popular-photo{
  overflow:hidden;
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:18px;
  background:linear-gradient(135deg, rgba(240,165,38,.20), rgba(255,255,255,.08));
  border:1px solid rgba(255,255,255,.10);
}

.home-popular-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.home-popular-photo svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:#ffc46b;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.92;
}

.home-popular-main{
  min-width:0;
}

.home-popular-main strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-bottom:5px;
  font-size:18px;
  line-height:1.1;
  letter-spacing:-.035em;
}

.home-popular-main small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(255,246,231,.58);
  font-size:13px;
}

.home-popular-chords{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:5px;
  max-width:150px;
}

.home-popular-chords span{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(255,246,231,.10);
  color:rgba(255,246,231,.82);
  font-size:11px;
  font-weight:900;
}

.home-popular-card em{
  display:inline-flex;
  justify-content:flex-end;
  min-width:82px;
  color:rgba(255,246,231,.48);
  font-size:12px;
  font-style:normal;
  font-weight:800;
  white-space:nowrap;
}

.home-popular-empty{
  position:relative;
  z-index:1;
  margin:0;
  padding:22px;
  border-radius:24px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(255,246,231,.66);
}

.home-popular-more{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  margin-top:22px;
}

.home-popular-more a{
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  color:#ffc46b;
  border:1px solid rgba(240,165,38,.26);
  font-weight:900;
}

@media(max-width:1100px){
  .home-popular-card{
    grid-template-columns:38px 50px minmax(0,1fr) auto;
  }

  .home-popular-chords{
    display:none;
  }
}

@media(max-width:980px){
  .home-popular-head{
    grid-template-columns:1fr;
    gap:12px;
    align-items:start;
  }

  .home-popular-grid{
    grid-template-columns:1fr;
  }

  .home-popular-card{
    min-height:78px;
  }
}

@media(max-width:640px){
  .home-popular{
    padding:46px 0 52px;
  }

  .home-popular-card{
    grid-template-columns:34px 48px minmax(0,1fr);
    gap:10px;
    min-height:74px;
    padding:11px 12px;
    border-radius:20px;
  }

  .home-popular-card b{
    width:34px;
    height:34px;
    border-radius:13px;
    font-size:12px;
  }

  .home-popular-photo{
    width:48px;
    height:48px;
    border-radius:16px;
  }

  .home-popular-card em{
    grid-column:3;
    justify-content:flex-start;
    min-width:0;
    margin-top:-2px;
    font-size:11px;
  }

  .home-popular-main strong{
    font-size:17px;
  }
}

/* Home learning steps under Top 10 */
.home-learn{
  position:relative;
  overflow:hidden;
  padding:64px 0 70px;
  background:
    radial-gradient(circle at 10% 18%, rgba(240,165,38,.14), transparent 30%),
    linear-gradient(180deg,#fffaf1 0%,#f7ead2 100%);
  color:#261f18;
}

.home-learn:before{
  content:'ukulele';
  position:absolute;
  right:clamp(18px,6vw,92px);
  bottom:-18px;
  color:rgba(38,31,24,.045);
  font-size:clamp(58px,10vw,148px);
  font-weight:950;
  letter-spacing:-.08em;
  line-height:1;
  pointer-events:none;
}

.home-learn-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(270px,.9fr) minmax(0,1.35fr);
  gap:28px;
  align-items:stretch;
}

.home-learn-copy{
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:32px;
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,.42));
  border:1px solid rgba(38,31,24,.10);
  box-shadow:0 18px 48px rgba(82,55,18,.10);
}

.home-learn-copy span{
  display:inline-flex;
  margin-bottom:12px;
  color:#98620d;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-learn-copy h2{
  margin:0;
  font-size:clamp(32px,4vw,52px);
  line-height:1;
  letter-spacing:-.06em;
}

.home-learn-copy p{
  margin:18px 0 0;
  color:rgba(38,31,24,.68);
  font-size:17px;
  line-height:1.55;
}

.home-learn-button{
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:26px;
  padding:0 18px;
  border-radius:999px;
  background:#1a1d24;
  color:var(--cream);
  font-weight:900;
  box-shadow:0 15px 34px rgba(26,29,36,.18);
}

.home-learn-cards{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.home-learn-card{
  position:relative;
  overflow:hidden;
  min-height:176px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:20px;
  border-radius:28px;
  background:rgba(255,255,255,.60);
  color:#261f18;
  border:1px solid rgba(38,31,24,.10);
  box-shadow:0 16px 42px rgba(82,55,18,.09);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.home-learn-card:hover{
  transform:translateY(-3px);
  border-color:rgba(240,165,38,.42);
  box-shadow:0 22px 54px rgba(82,55,18,.15);
}

.home-learn-card--warm{
  background:linear-gradient(135deg,#fff0ce,#ffffff 70%);
}

.home-learn-card i{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  margin-bottom:18px;
  border-radius:18px;
  background:rgba(240,165,38,.18);
  color:#6c4308;
}

.home-learn-card i svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-learn-card strong{
  display:block;
  margin-bottom:8px;
  font-size:21px;
  line-height:1.08;
  letter-spacing:-.04em;
}

.home-learn-card small{
  display:block;
  max-width:250px;
  color:rgba(38,31,24,.66);
  font-size:14px;
  line-height:1.45;
}

@media(max-width:980px){
  .home-learn-grid{
    grid-template-columns:1fr;
  }

  .home-learn-copy{
    padding:28px;
  }
}

@media(max-width:640px){
  .home-learn{
    padding:46px 0 52px;
  }

  .home-learn-copy{
    padding:24px;
    border-radius:28px;
  }

  .home-learn-cards{
    grid-template-columns:1fr;
  }

  .home-learn-card{
    min-height:160px;
    border-radius:24px;
  }
}


/* Newest added songs under learning steps */
.home-recent{
  position:relative;
  overflow:hidden;
  padding:62px 0 68px;
  background:#fffaf1;
  color:#261f18;
}

.home-recent:before{
  content:'♪';
  position:absolute;
  right:clamp(18px,7vw,110px);
  top:-46px;
  color:rgba(240,165,38,.095);
  font-size:clamp(120px,18vw,230px);
  font-weight:950;
  line-height:1;
  transform:rotate(8deg);
  pointer-events:none;
}

.home-recent-head{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,430px);
  gap:32px;
  align-items:end;
  margin-bottom:22px;
}

.home-recent-head span{
  display:inline-flex;
  margin-bottom:10px;
  color:#98620d;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-recent-head h2{
  margin:0;
  max-width:760px;
  font-size:clamp(30px,4vw,52px);
  line-height:1;
  letter-spacing:-.058em;
}

.home-recent-head p{
  margin:0;
  color:rgba(38,31,24,.66);
  font-size:17px;
  line-height:1.55;
}

.home-recent-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}

.home-recent-card{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto auto;
  gap:10px;
  align-items:center;
  min-height:78px;
  padding:12px 14px;
  border-radius:22px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(38,31,24,.10);
  color:#261f18;
  box-shadow:0 16px 42px rgba(82,55,18,.08);
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.home-recent-card:hover{
  transform:translateY(-2px);
  border-color:rgba(240,165,38,.42);
  box-shadow:0 20px 50px rgba(82,55,18,.13);
}

.home-recent-photo{
  overflow:hidden;
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:18px;
  background:linear-gradient(135deg, rgba(240,165,38,.20), rgba(38,31,24,.055));
  border:1px solid rgba(38,31,24,.08);
}

.home-recent-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.home-recent-photo svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:#98620d;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-recent-main{
  min-width:0;
}

.home-recent-main strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-bottom:5px;
  font-size:18px;
  line-height:1.1;
  letter-spacing:-.035em;
}

.home-recent-main small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(38,31,24,.58);
  font-size:13px;
}

.home-recent-chords{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:5px;
  max-width:168px;
}

.home-recent-chords i{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:0 8px;
  border-radius:999px;
  background:rgba(240,165,38,.14);
  color:#6c4308;
  font-size:11px;
  font-style:normal;
  font-weight:900;
}

.home-recent-card em{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:27px;
  padding:0 9px;
  border-radius:999px;
  background:#1a1d24;
  color:var(--cream);
  font-size:11px;
  font-style:normal;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  white-space:nowrap;
}

.home-recent-empty{
  position:relative;
  z-index:1;
  margin:0;
  padding:22px;
  border-radius:24px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(38,31,24,.10);
  color:rgba(38,31,24,.66);
}

.home-recent-more{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  margin-top:22px;
}

.home-recent-more a{
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  background:#1a1d24;
  color:var(--cream);
  font-weight:900;
  box-shadow:0 15px 34px rgba(26,29,36,.13);
}

@media(max-width:1120px){
  .home-recent-card{
    grid-template-columns:52px minmax(0,1fr) auto;
  }

  .home-recent-chords{
    display:none;
  }
}

@media(max-width:980px){
  .home-recent-head{
    grid-template-columns:1fr;
    gap:12px;
    align-items:start;
  }

  .home-recent-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:640px){
  .home-recent{
    padding:46px 0 52px;
  }

  .home-recent-card{
    grid-template-columns:48px minmax(0,1fr) auto;
    gap:10px;
    min-height:72px;
    padding:11px 12px;
    border-radius:20px;
  }

  .home-recent-photo{
    width:48px;
    height:48px;
    border-radius:16px;
  }

  .home-recent-main strong{
    font-size:17px;
  }

  .home-recent-card em{
    min-height:25px;
    padding:0 8px;
    font-size:10px;
  }
}


/* Popular artists refreshed for homepage */
.home-artists{
  position:relative;
  overflow:hidden;
  padding:64px 0 70px;
  background:
    radial-gradient(circle at 14% 16%, rgba(240,165,38,.14), transparent 32%),
    radial-gradient(circle at 84% 4%, rgba(255,255,255,.055), transparent 28%),
    linear-gradient(180deg,#111419 0%,#0f1115 100%);
  color:var(--cream);
}

.home-artists:before{
  content:'♫';
  position:absolute;
  left:clamp(18px,6vw,100px);
  bottom:-70px;
  color:rgba(255,255,255,.045);
  font-size:clamp(150px,20vw,270px);
  font-weight:950;
  line-height:1;
  transform:rotate(-12deg);
  pointer-events:none;
}

.home-artists-head{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,430px);
  gap:32px;
  align-items:end;
  margin-bottom:24px;
}

.home-artists-head span{
  display:inline-flex;
  margin-bottom:10px;
  color:#ffc46b;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-artists-head h2{
  margin:0;
  max-width:760px;
  font-size:clamp(30px,4vw,52px);
  line-height:1;
  letter-spacing:-.058em;
}

.home-artists-head p{
  margin:0;
  color:rgba(255,246,231,.66);
  font-size:17px;
  line-height:1.55;
}

.home-artists .artist-grid{
  position:relative;
  z-index:1;
  gap:14px;
}

.home-artists .artist-card{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 48px rgba(0,0,0,.18);
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.home-artists .artist-card:hover{
  transform:translateY(-3px);
  border-color:rgba(240,165,38,.42);
  background:rgba(255,255,255,.072);
}

.home-artists .artist-card__image{
  aspect-ratio:16/9;
  background:linear-gradient(135deg, rgba(240,165,38,.22), rgba(255,255,255,.055));
}

.home-artists .artist-card__image img{
  opacity:.94;
  transition:transform .22s ease, opacity .22s ease;
}

.home-artists .artist-card:hover .artist-card__image img{
  transform:scale(1.035);
  opacity:1;
}

.home-artists .artist-card__body{
  padding:18px;
}

.home-artists .artist-card h3{
  font-size:22px;
}

.home-artists .artist-card p{
  color:rgba(255,246,231,.54);
  font-size:14px;
}

.home-artists .top-mini-title{
  color:#ffc46b;
}

.home-artists .top-song-list a{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.065);
}

.home-artists .top-song-list a:hover{
  background:rgba(240,165,38,.12);
}

.home-artists .empty-songs{
  background:rgba(255,255,255,.055);
  color:rgba(255,246,231,.56);
}

.home-artists .artist-card__more{
  color:#ffc46b;
}

.home-artists-more{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:center;
  margin-top:24px;
}

.home-artists-more a{
  display:inline-flex;
  align-items:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  color:#ffc46b;
  border:1px solid rgba(240,165,38,.26);
  font-weight:900;
}

/* Forum community section */
.home-forum{
  position:relative;
  overflow:hidden;
  padding:64px 0 70px;
  background:
    radial-gradient(circle at 86% 18%, rgba(240,165,38,.16), transparent 32%),
    linear-gradient(180deg,#fffaf1 0%,#f7ead2 100%);
  color:#261f18;
}

.home-forum:before{
  content:'?';
  position:absolute;
  right:clamp(22px,7vw,110px);
  bottom:-76px;
  color:rgba(38,31,24,.055);
  font-size:clamp(170px,22vw,300px);
  font-weight:950;
  line-height:1;
  transform:rotate(8deg);
  pointer-events:none;
}

.home-forum-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(270px,.85fr) minmax(0,1.25fr);
  gap:24px;
  align-items:stretch;
}

.home-forum-copy{
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:32px;
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.76),rgba(255,255,255,.45));
  border:1px solid rgba(38,31,24,.10);
  box-shadow:0 18px 48px rgba(82,55,18,.10);
}

.home-forum-copy span{
  display:inline-flex;
  margin-bottom:12px;
  color:#98620d;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-forum-copy h2{
  margin:0;
  font-size:clamp(32px,4vw,52px);
  line-height:1;
  letter-spacing:-.06em;
}

.home-forum-copy p{
  margin:18px 0 0;
  color:rgba(38,31,24,.68);
  font-size:17px;
  line-height:1.55;
}

.home-forum-button{
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:26px;
  padding:0 18px;
  border-radius:999px;
  background:#1a1d24;
  color:var(--cream);
  font-weight:900;
  box-shadow:0 15px 34px rgba(26,29,36,.18);
}

.home-forum-list{
  display:grid;
  gap:10px;
  align-content:center;
}

.home-forum-card,
.home-forum-empty{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:52px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  min-height:82px;
  padding:13px 14px;
  border-radius:24px;
  background:rgba(255,255,255,.72);
  border:1px solid rgba(38,31,24,.10);
  color:#261f18;
  box-shadow:0 16px 42px rgba(82,55,18,.08);
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.home-forum-card:hover{
  transform:translateY(-2px);
  border-color:rgba(240,165,38,.42);
  box-shadow:0 20px 50px rgba(82,55,18,.13);
}

.home-forum-icon{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:18px;
  background:rgba(240,165,38,.16);
  color:#6c4308;
}

.home-forum-icon svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-forum-main{
  min-width:0;
}

.home-forum-main strong,
.home-forum-empty strong{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-bottom:5px;
  font-size:18px;
  line-height:1.1;
  letter-spacing:-.035em;
}

.home-forum-main small,
.home-forum-empty small{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(38,31,24,.58);
  font-size:13px;
}

.home-forum-card em{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:27px;
  padding:0 9px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  color:#6c4308;
  font-size:11px;
  font-style:normal;
  font-weight:900;
  white-space:nowrap;
}

.home-forum-empty{
  grid-template-columns:52px minmax(0,1fr);
}

@media(max-width:980px){
  .home-artists-head,
  .home-forum-grid{
    grid-template-columns:1fr;
    gap:14px;
    align-items:start;
  }

  .home-forum-copy{
    padding:28px;
  }
}

@media(max-width:640px){
  .home-artists,
  .home-forum{
    padding:46px 0 52px;
  }

  .home-artists .artist-card__body,
  .home-forum-copy{
    padding:24px;
  }

  .home-artists .artist-card,
  .home-forum-copy,
  .home-forum-card,
  .home-forum-empty{
    border-radius:24px;
  }

  .home-forum-card,
  .home-forum-empty{
    grid-template-columns:48px minmax(0,1fr);
    gap:10px;
    min-height:76px;
    padding:12px;
  }

  .home-forum-icon{
    width:48px;
    height:48px;
    border-radius:16px;
  }

  .home-forum-card em{
    grid-column:2;
    justify-self:start;
    margin-top:-3px;
  }
}

/* Bottom social + newsletter section */
.home-connect{
  position:relative;
  overflow:hidden;
  padding:64px 0 72px;
  background:
    radial-gradient(circle at 15% 20%, rgba(240,165,38,.16), transparent 34%),
    radial-gradient(circle at 82% 18%, rgba(64,120,255,.10), transparent 30%),
    linear-gradient(180deg,#111419 0%,#0d0f13 100%);
  color:var(--cream);
}

.home-connect:before{
  content:'';
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.14), transparent);
}

.home-connect-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:18px;
}

.home-connect-card{
  position:relative;
  overflow:hidden;
  min-height:330px;
  padding:32px;
  border-radius:34px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 22px 70px rgba(0,0,0,.24);
}

.home-connect-card--social{
  background:
    linear-gradient(135deg, rgba(24,119,242,.18), rgba(255,255,255,.055) 58%),
    rgba(255,255,255,.055);
}

.home-connect-card--newsletter{
  background:
    linear-gradient(135deg, rgba(240,165,38,.16), rgba(255,255,255,.055) 58%),
    rgba(255,255,255,.055);
}

.home-connect-card:before{
  content:'♪';
  position:absolute;
  right:-18px;
  top:-50px;
  color:rgba(255,255,255,.055);
  font-size:200px;
  font-weight:900;
  line-height:1;
  transform:rotate(-12deg);
  pointer-events:none;
}

.home-connect-icon{
  position:relative;
  z-index:1;
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  margin-bottom:22px;
  border-radius:20px;
  background:rgba(240,165,38,.18);
  color:#ffc46b;
}

.home-connect-card--social .home-connect-icon{
  background:rgba(24,119,242,.18);
  color:#7fb7ff;
}

.home-connect-icon svg,
.home-connect-button svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.home-connect-button svg{
  width:19px;
  height:19px;
  fill:currentColor;
  stroke:none;
}

.home-connect-card span,
.home-connect-card h2,
.home-connect-card p,
.home-connect-card form,
.home-connect-card small,
.home-connect-card a{
  position:relative;
  z-index:1;
}

.home-connect-card span{
  display:inline-flex;
  margin-bottom:10px;
  color:#ffc46b;
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.home-connect-card--social span{
  color:#8ec0ff;
}

.home-connect-card h2{
  margin:0 0 12px;
  max-width:560px;
  font-size:clamp(28px,3.2vw,46px);
  line-height:1.02;
  letter-spacing:-.055em;
}

.home-connect-card p{
  max-width:560px;
  margin:0 0 24px;
  color:rgba(255,246,231,.72);
  font-size:16px;
  line-height:1.6;
}

.home-connect-button{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  background:#1877f2;
  color:#fff;
  font-weight:900;
  text-decoration:none;
  box-shadow:0 14px 34px rgba(24,119,242,.22);
}

.home-newsletter-form{
  display:flex;
  gap:10px;
  max-width:560px;
  margin:0 0 12px;
}

.home-newsletter-form input{
  min-width:0;
  flex:1;
  height:52px;
  padding:0 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
  color:var(--cream);
  font-size:16px;
  outline:none;
}

.home-newsletter-form input::placeholder{
  color:rgba(255,246,231,.48);
}

.home-newsletter-form input:focus{
  border-color:rgba(240,165,38,.64);
  box-shadow:0 0 0 4px rgba(240,165,38,.12);
}

.home-newsletter-form button{
  height:52px;
  padding:0 18px;
  border:0;
  border-radius:18px;
  background:var(--amber);
  color:#19120a;
  font-weight:950;
  cursor:pointer;
  white-space:nowrap;
}

.home-connect-card small{
  display:block;
  color:rgba(255,246,231,.52);
  font-size:13px;
}

@media(max-width:860px){
  .home-connect-grid{
    grid-template-columns:1fr;
  }

  .home-connect-card{
    min-height:auto;
  }
}

@media(max-width:560px){
  .home-connect{
    padding:48px 0 56px;
  }

  .home-connect-card{
    padding:24px;
    border-radius:28px;
  }

  .home-newsletter-form{
    flex-direction:column;
  }

  .home-newsletter-form button{
    width:100%;
  }
}

/* Forum page – zjednotené s tmavým vzhľadom stránky */
.forum-page{
  position:relative;
  overflow:hidden;
  padding:48px 0 76px;
  background:
    radial-gradient(circle at 14% 0%, rgba(240,165,38,.14), transparent 34%),
    radial-gradient(circle at 92% 8%, rgba(81,164,107,.14), transparent 30%),
    linear-gradient(180deg,#11141a 0%,#0f1115 56%,#101216 100%);
  color:var(--text);
}

.forum-page:before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px);
  background-size:34px 34px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.58), transparent 72%);
}

.forum-page .container{
  position:relative;
  z-index:1;
}

.forum-hero{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,390px);
  gap:22px;
  align-items:start;
  margin-bottom:22px;
  padding:32px;
  border-radius:34px;
  background:
    radial-gradient(circle at 86% 12%, rgba(240,165,38,.20), transparent 34%),
    radial-gradient(circle at 6% 100%, rgba(81,164,107,.16), transparent 38%),
    linear-gradient(145deg,rgba(43,48,41,.96),rgba(19,25,25,.94));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 24px 70px rgba(0,0,0,.34);
  color:var(--cream);
}

.forum-hero:after{
  content:'♪';
  position:absolute;
  right:28px;
  bottom:-70px;
  color:rgba(255,255,255,.045);
  font-size:210px;
  font-weight:950;
  line-height:1;
  transform:rotate(-10deg);
  pointer-events:none;
}

.forum-hero-copy,
.forum-search,
.forum-hero-stats{
  position:relative;
  z-index:1;
}

.forum-kicker,
.forum-hero span,
.forum-section-head span,
.forum-topic-titlebar span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  color:#ffd37a;
  font-size:13px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.forum-hero h1{
  max-width:760px;
  margin:0 0 12px;
  font-size:clamp(42px,6vw,78px);
  line-height:.94;
  letter-spacing:-.07em;
}

.forum-hero p{
  max-width:760px;
  margin:0 0 22px;
  color:rgba(247,243,236,.74);
  font-size:18px;
  line-height:1.58;
}

.forum-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.forum-hero a,
.forum-soft-button,
.forum-login-note a,
.forum-form button,
.forum-search button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border:0;
  border-radius:999px;
  background:var(--orange);
  color:#21160d;
  font-weight:950;
  text-decoration:none;
  box-shadow:0 14px 34px rgba(240,165,38,.20);
  cursor:pointer;
}

.forum-hero .forum-hero-secondary{
  background:rgba(255,255,255,.08);
  color:#fff6e7;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);
}

.forum-search{
  align-self:start;
  padding:16px;
  border-radius:24px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(12px);
}

.forum-search label{
  display:block;
  margin-bottom:10px;
  color:rgba(247,243,236,.82);
  font-size:13px;
  font-weight:950;
}

.forum-search div{
  display:flex;
  gap:8px;
}

.forum-search input{
  min-width:0;
  width:100%;
  height:46px;
  padding:0 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(15,17,21,.36);
  color:#fff6e7;
  font:inherit;
  outline:none;
}

.forum-search input::placeholder{
  color:rgba(247,243,236,.48);
}

.forum-search input:focus{
  border-color:rgba(240,165,38,.70);
  box-shadow:0 0 0 4px rgba(240,165,38,.13);
}

.forum-search button{
  min-height:46px;
  white-space:nowrap;
}

.forum-hero-stats{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  max-width:620px;
  margin-top:2px;
}

.forum-hero-stats div{
  padding:14px 16px;
  border-radius:20px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.09);
}

.forum-hero-stats strong{
  display:block;
  color:#fff6e7;
  font-size:24px;
  line-height:1;
}

.forum-hero-stats span{
  margin:5px 0 0;
  color:rgba(247,243,236,.56);
  font-size:12px;
  font-weight:850;
  letter-spacing:0;
  text-transform:none;
}

.forum-layout{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);
  gap:18px;
}

.forum-panel{
  margin-top:18px;
  padding:26px;
  border-radius:30px;
  background:linear-gradient(145deg,rgba(36,42,36,.92),rgba(20,26,26,.90));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 20px 58px rgba(0,0,0,.25);
}

.forum-panel--latest{
  align-self:start;
  position:sticky;
  top:98px;
}

.forum-section-head{
  margin-bottom:18px;
}

.forum-section-head--split{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}

.forum-section-head h2,
.forum-topic-titlebar h2{
  margin:0;
  color:#fff7e7;
  font-size:clamp(27px,3.4vw,44px);
  line-height:1.04;
  letter-spacing:-.045em;
}

.forum-section-head p,
.forum-topic-titlebar p{
  max-width:760px;
  margin:8px 0 0;
  color:rgba(247,243,236,.62);
  font-size:15px;
  line-height:1.55;
}

.forum-category-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.forum-category-card,
.forum-topic-row,
.forum-empty,
.forum-login-note,
.forum-post,
.forum-rules{
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.085);
  box-shadow:0 14px 40px rgba(0,0,0,.16);
}

.forum-category-card{
  display:flex;
  min-height:212px;
  flex-direction:column;
  padding:18px;
  border-radius:24px;
  color:#fff7e7;
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.forum-category-card:hover,
.forum-topic-row:hover{
  transform:translateY(-2px);
  border-color:rgba(240,165,38,.32);
  box-shadow:0 18px 46px rgba(0,0,0,.24);
  background:rgba(255,255,255,.075);
}

.forum-card-icon{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  margin-bottom:14px;
  border-radius:18px;
  background:rgba(240,165,38,.16);
  color:#ffd37a;
}

.forum-card-icon svg,
.forum-topic-dot svg{
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.forum-category-card--music .forum-card-icon{background:rgba(81,164,107,.15);color:#91e0a5;}
.forum-category-card--tuner .forum-card-icon{background:rgba(93,151,191,.14);color:#9ed4ff;}
.forum-category-card--rhythm .forum-card-icon{background:rgba(240,165,38,.16);color:#ffd37a;}

.forum-category-card strong{
  color:#fff7e7;
  font-size:19px;
  line-height:1.16;
}

.forum-category-card p{
  margin:8px 0 14px;
  color:rgba(247,243,236,.62);
  font-size:14px;
  line-height:1.48;
}

.forum-category-card small{
  margin-top:auto;
  color:rgba(247,243,236,.52);
  font-size:13px;
  font-weight:850;
}

.forum-topic-list{
  display:grid;
  gap:10px;
}

.forum-topic-row{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  min-height:78px;
  padding:12px;
  border-radius:22px;
  color:#fff7e7;
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}

.forum-topic-dot{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(240,165,38,.15);
  color:#ffd37a;
  font-size:21px;
  font-weight:900;
}

.forum-topic-main{
  min-width:0;
}

.forum-topic-main strong{
  display:block;
  overflow:hidden;
  color:#fff7e7;
  font-size:16px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.forum-topic-main small{
  display:block;
  overflow:hidden;
  margin-top:4px;
  color:rgba(247,243,236,.55);
  font-size:13px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.forum-topic-row em{
  color:rgba(247,243,236,.50);
  font-size:12px;
  font-style:normal;
  font-weight:900;
  white-space:nowrap;
}

.forum-rules{
  margin-top:14px;
  padding:16px;
  border-radius:22px;
  background:rgba(240,165,38,.08);
}

.forum-rules strong{
  display:block;
  color:#fff7e7;
  font-size:16px;
}

.forum-rules p{
  margin:6px 0 0;
  color:rgba(247,243,236,.62);
  font-size:14px;
  line-height:1.5;
}

.forum-breadcrumb{
  display:flex;
  align-items:center;
  gap:10px;
  margin:20px 0 0;
  color:rgba(247,243,236,.45);
  font-size:14px;
  font-weight:850;
}

.forum-breadcrumb a{
  color:#ffd37a;
  text-decoration:none;
}

.forum-soft-button{
  min-height:42px;
  background:var(--orange);
  color:#21160d;
  box-shadow:0 14px 34px rgba(240,165,38,.18);
  white-space:nowrap;
}

.forum-topic-detail{
  overflow:hidden;
}

.forum-topic-titlebar{
  margin-bottom:18px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.09);
}

.forum-posts{
  display:grid;
  gap:12px;
}

.forum-post{
  display:grid;
  grid-template-columns:52px minmax(0,1fr);
  gap:10px;
  padding:15px;
  border-radius:24px;
}

.forum-post-avatar{
  width:52px;
  height:52px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,#f6c66e,#f0a526);
  color:#24180f;
  font-weight:950;
  text-transform:uppercase;
}

.forum-post-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.forum-post-body{
  min-width:0;
}

.forum-post-body header{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px;
  margin-bottom:8px;
}

.forum-post-body header strong{
  color:#fff7e7;
}

.forum-post-body header small{
  color:rgba(247,243,236,.48);
  font-size:12px;
  font-weight:800;
}

.forum-post-content{
  color:rgba(247,243,236,.76);
  font-size:15px;
  line-height:1.68;
  overflow-wrap:anywhere;
  word-break:normal;
}

.forum-post-content a{
  color:#ffd37a;
  font-weight:850;
}

.forum-form-panel{
  scroll-margin-top:112px;
}

.forum-form{
  display:grid;
  gap:10px;
}

.forum-form label{
  color:#fff7e7;
  font-size:13px;
  font-weight:950;
}

.forum-form input,
.forum-form textarea{
  width:100%;
  padding:14px 15px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.055);
  color:#fff7e7;
  font:inherit;
  font-size:16px;
  outline:none;
}

.forum-form input::placeholder,
.forum-form textarea::placeholder{
  color:rgba(247,243,236,.42);
}

.forum-form textarea{
  resize:vertical;
  min-height:150px;
}

.forum-form input:focus,
.forum-form textarea:focus{
  border-color:rgba(240,165,38,.68);
  box-shadow:0 0 0 4px rgba(240,165,38,.14);
}

.forum-form button{
  justify-self:start;
  min-height:48px;
  padding:0 20px;
}

.forum-hp{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
}

.forum-login-note,
.forum-empty{
  padding:20px;
  border-radius:24px;
}

.forum-login-note strong,
.forum-empty strong{
  display:block;
  color:#fff7e7;
  font-size:18px;
}

.forum-login-note p,
.forum-empty p{
  margin:7px 0 14px;
  color:rgba(247,243,236,.62);
  line-height:1.55;
}

.forum-empty--small{
  padding:16px;
}

.forum-empty--setup{
  margin-top:18px;
}

.forum-errors{
  margin:18px 0 0;
  padding:14px 16px;
  border-radius:18px;
  background:rgba(210,77,48,.12);
  border:1px solid rgba(210,77,48,.22);
  color:#ffb7a6;
  font-weight:800;
}

.forum-errors p{
  margin:0;
}

.forum-errors p + p{
  margin-top:6px;
}

@media(max-width:1100px){
  .forum-hero{
    grid-template-columns:1fr;
  }

  .forum-search{
    max-width:680px;
  }

  .forum-hero-stats{
    max-width:none;
  }
}

@media(max-width:1020px){
  .forum-layout{
    grid-template-columns:1fr;
  }

  .forum-panel--latest{
    position:static;
  }
}

@media(max-width:760px){
  .forum-category-grid{
    grid-template-columns:1fr;
  }

  .forum-category-card{
    min-height:auto;
  }
}

@media(max-width:620px){
  .forum-page{
    padding:34px 0 56px;
  }

  .forum-hero,
  .forum-panel{
    padding:22px;
    border-radius:28px;
  }

  .forum-hero h1{
    font-size:42px;
  }

  .forum-hero p{
    font-size:16px;
  }

  .forum-hero-actions,
  .forum-search div{
    display:grid;
    grid-template-columns:1fr;
  }

  .forum-hero a,
  .forum-search button{
    width:100%;
  }

  .forum-hero-stats{
    grid-template-columns:1fr;
  }

  .forum-section-head--split{
    display:block;
  }

  .forum-soft-button{
    width:100%;
    margin-top:14px;
  }

  .forum-topic-row{
    grid-template-columns:40px minmax(0,1fr);
    align-items:start;
  }

  .forum-topic-main strong,
  .forum-topic-main small{
    white-space:normal;
  }

  .forum-topic-row em{
    grid-column:2;
    justify-self:start;
    margin-top:-4px;
  }

  .forum-post{
    grid-template-columns:1fr;
  }

  .forum-post-avatar{
    width:44px;
    height:44px;
    border-radius:15px;
  }
}

/* AUTH / ACCOUNT */
.auth-shell,
.account-page{
  position:relative;
  overflow:hidden;
  padding:76px 0 92px;
  background:
    radial-gradient(circle at 12% 18%, rgba(240,165,38,.18), transparent 34%),
    radial-gradient(circle at 86% 14%, rgba(81,164,107,.13), transparent 32%),
    linear-gradient(180deg,#11141a 0%,#0f1115 100%);
}

.auth-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,440px);
  gap:38px;
  align-items:center;
}

.auth-copy h1,
.account-head h1{
  margin:10px 0 14px;
  max-width:620px;
  font-size:clamp(34px,5vw,58px);
  line-height:.96;
  letter-spacing:-.055em;
}

.auth-copy p,
.account-head p{
  max-width:640px;
  color:var(--muted);
  font-size:18px;
  line-height:1.65;
}

.auth-benefits{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:24px;
}

.auth-benefits span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:9px 13px;
  background:rgba(255,255,255,.05);
  color:var(--cream);
  font-size:13px;
  font-weight:900;
}

.auth-benefits span:before{
  content:'♪';
  color:var(--orange);
}

.auth-card,
.account-panel{
  border:1px solid var(--line);
  border-radius:30px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:var(--shadow);
}

.auth-card--form{
  padding:30px;
}

.clean-form{
  display:grid;
  gap:11px;
}

.clean-form label{
  color:var(--cream);
  font-size:13px;
  font-weight:900;
}

.clean-form input,
.inline-form input{
  width:100%;
  min-height:48px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  font:inherit;
  outline:none;
  padding:0 15px;
}

.clean-form input:focus,
.inline-form input:focus{
  border-color:rgba(240,165,38,.65);
  box-shadow:0 0 0 4px rgba(240,165,38,.12);
}

.clean-form input[disabled]{
  opacity:.68;
  cursor:not-allowed;
}

.form-hint{
  color:var(--muted);
  margin-top:-5px;
}

.check-row{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  color:var(--muted) !important;
  line-height:1.45;
  margin:4px 0 8px;
}

.check-row input{
  width:auto;
  min-height:auto;
  margin-top:3px;
  accent-color:var(--orange);
}

.form-message{
  border-radius:18px;
  padding:12px 14px;
  margin-bottom:16px;
  font-weight:900;
  line-height:1.45;
}

.form-message--error{
  background:rgba(229,83,83,.13);
  border:1px solid rgba(229,83,83,.24);
  color:#ffd8d8;
}

.form-message--success{
  background:rgba(81,164,107,.15);
  border:1px solid rgba(81,164,107,.30);
  color:#dff7e7;
}

.auth-switch{
  margin:18px 0 0;
  color:var(--muted);
  text-align:center;
}

.auth-switch a{
  color:var(--orange);
  font-weight:900;
}

.account-head{
  align-items:flex-end;
}

.account-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
}

.account-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:26px 0 22px;
}

.account-stats div{
  border:1px solid var(--line);
  border-radius:24px;
  background:rgba(255,255,255,.055);
  padding:18px;
}

.account-stats strong{
  display:block;
  color:var(--orange);
  font-size:32px;
  line-height:1;
  letter-spacing:-.04em;
}

.account-stats span{
  display:block;
  margin-top:7px;
  color:var(--muted);
  font-size:13px;
  font-weight:900;
}

.account-grid{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:18px;
  align-items:start;
}

.account-panel{
  padding:24px;
}

.account-panel h2{
  margin:0 0 16px;
  font-size:24px;
  letter-spacing:-.035em;
}

.inline-form{
  display:flex;
  gap:10px;
  margin-bottom:14px;
}

.inline-form input{
  flex:1 1 auto;
}

.account-list{
  display:grid;
  gap:10px;
}

.account-list-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.045);
  padding:14px 15px;
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}

.account-list-item:hover{
  transform:translateY(-2px);
  border-color:rgba(240,165,38,.38);
  background:rgba(255,255,255,.07);
}

.account-list-item span,
.muted-text{
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.account-panel--tip{
  background:
    radial-gradient(circle at 90% 16%, rgba(240,165,38,.16), transparent 35%),
    linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.032));
}

.account-panel--tip p{
  margin:0;
  color:var(--muted);
  line-height:1.65;
}

@media (max-width: 860px){
  .auth-shell,
  .account-page{
    padding:52px 0 70px;
  }

  .auth-grid,
  .account-grid{
    grid-template-columns:1fr;
  }

  .account-head{
    align-items:flex-start;
  }

  .account-actions{
    justify-content:flex-start;
  }
}

@media (max-width: 620px){
  .auth-card--form,
  .account-panel{
    padding:20px;
    border-radius:24px;
  }

  .account-stats{
    grid-template-columns:1fr;
  }

  .inline-form{
    display:grid;
  }
}

/* Patch 024 - password reset small auth additions */
.auth-small-link{
  margin:12px 0 0;
  text-align:center;
  color:var(--muted);
  font-size:14px;
  font-weight:800;
}

.auth-small-link a{
  color:var(--cream);
  opacity:.82;
}

.auth-small-link a:hover{
  color:var(--orange);
  opacity:1;
}

/* Patch 031 - prehľadnejší účet, fotka, spevníky a moje skladby */
.clean-form textarea,
.clean-form select{
  width:100%;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  font:inherit;
  outline:none;
  padding:13px 15px;
}

.clean-form textarea{
  resize:vertical;
  min-height:220px;
  line-height:1.55;
}

.clean-form select{
  min-height:48px;
  cursor:pointer;
}

.clean-form textarea:focus,
.clean-form select:focus{
  border-color:rgba(240,165,38,.65);
  box-shadow:0 0 0 4px rgba(240,165,38,.12);
}

.clean-form input[type="file"]{
  min-height:auto;
  padding:12px;
  cursor:pointer;
}

.account-page--new{
  padding:58px 0 86px;
}

.account-layout{
  display:grid;
  grid-template-columns:minmax(280px,340px) minmax(0,1fr);
  gap:24px;
  align-items:start;
}

.account-sidebar{
  display:grid;
  gap:16px;
  position:sticky;
  top:92px;
}

.account-profile-card{
  border:1px solid var(--line);
  border-radius:32px;
  background:
    radial-gradient(circle at 82% 8%, rgba(240,165,38,.18), transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.035));
  box-shadow:var(--shadow);
  padding:24px;
}

.account-profile-card h1{
  margin:12px 0 10px;
  font-size:clamp(30px,4vw,42px);
  line-height:1;
  letter-spacing:-.045em;
}

.account-profile-card p{
  margin:0;
  color:var(--muted);
  line-height:1.62;
}

.account-avatar-xl,
.account-avatar-md{
  overflow:hidden;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 18px 44px rgba(0,0,0,.24);
}

.account-avatar-xl{
  width:96px;
  height:96px;
  border-radius:30px;
  margin-bottom:18px;
}

.account-avatar-md{
  flex:0 0 auto;
  width:74px;
  height:74px;
  border-radius:24px;
}

.account-avatar-xl img,
.account-avatar-md img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.account-actions--stacked{
  display:grid;
  justify-content:stretch;
  margin-top:20px;
}

.account-stats--side{
  grid-template-columns:1fr;
  margin:0;
}

.account-content{
  display:grid;
  gap:18px;
}

.account-section-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:18px;
  align-items:start;
}

.account-panel--wide{
  padding:24px;
}

.account-panel-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:18px;
}

.account-panel-head h2{
  margin-bottom:6px;
}

.account-panel-head p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.account-photo-row{
  display:grid;
  grid-template-columns:74px minmax(0,1fr);
  gap:14px;
  align-items:center;
  margin-bottom:4px;
}

.account-create-form{
  margin-bottom:18px;
}

.songbook-dashboard-list{
  display:grid;
  gap:12px;
}

.songbook-dashboard-card{
  border:1px solid var(--line);
  border-radius:22px;
  background:rgba(255,255,255,.045);
  padding:16px;
}

.songbook-dashboard-top{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  margin-bottom:12px;
}

.songbook-dashboard-top strong{
  display:block;
  color:var(--cream);
  font-size:18px;
  letter-spacing:-.02em;
}

.songbook-dashboard-top span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.songbook-dashboard-top a{
  flex:0 0 auto;
  color:var(--orange);
  font-weight:900;
  font-size:13px;
}

.songbook-song-preview{
  display:grid;
  gap:8px;
}

.songbook-song-preview a{
  display:flex;
  justify-content:space-between;
  gap:14px;
  border-radius:15px;
  padding:10px 12px;
  background:rgba(255,255,255,.045);
  color:var(--cream);
}

.songbook-song-preview a:hover{
  background:rgba(255,255,255,.075);
}

.songbook-song-preview span{
  font-weight:900;
}

.songbook-song-preview small{
  color:var(--muted);
  font-weight:800;
  text-align:right;
}

.my-song-list{
  display:grid;
  gap:10px;
}

.my-song-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:20px;
  background:rgba(255,255,255,.045);
  padding:14px;
}

.my-song-main strong{
  display:block;
  color:var(--cream);
  font-size:17px;
}

.my-song-main > span{
  display:block;
  margin-top:3px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.mini-chords{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:8px;
}

.mini-chords i{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  border-radius:999px;
  background:rgba(240,165,38,.13);
  color:#ffd796;
  font-style:normal;
  font-size:12px;
  font-weight:900;
  padding:2px 8px;
}

.form-two-cols{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.song-edit-grid{
  grid-template-columns:minmax(260px,430px) minmax(0,680px);
  align-items:start;
}

.song-edit-card{
  width:100%;
}

@media (max-width: 980px){
  .account-layout{
    grid-template-columns:1fr;
  }

  .account-sidebar{
    position:static;
  }

  .account-stats--side{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .account-section-grid,
  .song-edit-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 680px){
  .account-page--new{
    padding:42px 0 66px;
  }

  .account-profile-card,
  .account-panel--wide{
    border-radius:24px;
    padding:20px;
  }

  .account-stats--side{
    grid-template-columns:1fr;
  }

  .account-panel-head,
  .songbook-dashboard-top,
  .songbook-song-preview a,
  .my-song-row{
    display:grid;
    grid-template-columns:1fr;
  }

  .songbook-song-preview small{
    text-align:left;
  }

  .form-two-cols,
  .account-photo-row{
    grid-template-columns:1fr;
  }

  .account-avatar-md{
    width:82px;
    height:82px;
  }
}

/* Patch 033 – účet: čistejší profil, spevníky a zoznam mojich pesničiek */
.account-panel,
.account-profile-card{
  min-width:0;
}

.account-section-grid{
  grid-template-columns:minmax(0,1fr) minmax(300px,.86fr);
}

.account-photo-row{
  align-items:flex-start;
}

.account-photo-row .form-hint{
  display:block;
  margin-top:7px;
}

.account-page--new .clean-form input[type="file"]{
  width:100%;
  max-width:100%;
  min-height:44px;
  padding:9px 10px;
  font-size:15px;
  line-height:1.25;
  border-radius:18px;
}

.account-panel-head{
  align-items:center;
}

.account-panel-action,
.songbook-open-link,
.my-song-edit{
  white-space:nowrap;
}

.account-panel-action{
  min-width:178px;
  padding-inline:22px;
}

.songbook-dashboard-list--simple{
  gap:10px;
}

.songbook-dashboard-card--simple{
  padding:14px 16px;
}

.songbook-dashboard-card--simple .songbook-dashboard-top{
  align-items:center;
  margin-bottom:0;
}

.songbook-open-link{
  display:inline-flex;
  min-height:38px;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(240,165,38,.11);
  border:1px solid rgba(240,165,38,.22);
  padding:0 14px;
}

.my-song-list{
  gap:8px;
}

.my-song-row--simple{
  padding:12px 14px;
  border-radius:18px;
}

.my-song-row--simple .my-song-main strong{
  font-size:16px;
  line-height:1.25;
}

.my-song-row--simple .my-song-main > span{
  margin-top:4px;
}

.my-song-edit{
  min-width:104px;
}

@media (max-width: 1180px){
  .account-section-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 680px){
  .account-panel-action{
    width:100%;
    min-width:0;
  }

  .songbook-dashboard-card--simple .songbook-dashboard-top,
  .my-song-row--simple{
    grid-template-columns:1fr;
  }

  .songbook-open-link,
  .my-song-edit{
    width:100%;
  }
}

/* Patch 034 – účet: finálne upratanie layoutu bez bočného sticky panelu */
.account-page--clean{
  padding:50px 0 84px;
}

.account-dashboard-clean{
  width:100%;
  max-width:1180px;
  margin:0 auto;
  display:grid;
  gap:18px;
}

.account-hero-clean{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px) auto;
  gap:20px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:32px;
  background:
    radial-gradient(circle at 92% 10%, rgba(240,165,38,.18), transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.035));
  box-shadow:var(--shadow);
  padding:24px;
}

.account-hero-main{
  min-width:0;
  display:grid;
  grid-template-columns:96px minmax(0,1fr);
  gap:20px;
  align-items:center;
}

.account-hero-main h1{
  margin:8px 0 8px;
  max-width:100%;
  font-size:clamp(32px,4vw,48px);
  line-height:1;
  letter-spacing:-.045em;
  overflow-wrap:anywhere;
}

.account-hero-main p{
  margin:0;
  max-width:520px;
  color:var(--muted);
  line-height:1.55;
}

.account-hero-avatar{
  margin:0;
}

.account-hero-stats{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.account-hero-stats div{
  min-width:0;
  border:1px solid var(--line);
  border-radius:20px;
  background:rgba(255,255,255,.05);
  padding:14px 12px;
}

.account-hero-stats strong{
  display:block;
  color:var(--orange);
  font-size:28px;
  line-height:1;
  letter-spacing:-.04em;
}

.account-hero-stats span{
  display:block;
  margin-top:6px;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  line-height:1.25;
}

.account-hero-actions{
  display:grid;
  gap:10px;
  min-width:180px;
}

.account-hero-actions .btn{
  width:100%;
  white-space:nowrap;
}

.account-settings-grid-clean{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:18px;
  align-items:start;
}

.account-card-clean{
  min-width:0;
  padding:26px;
  border-radius:30px;
}

.account-card-clean h2{
  margin:0 0 18px;
}

.account-photo-row--clean{
  grid-template-columns:82px minmax(0,1fr);
  gap:16px;
  align-items:start;
  margin-bottom:8px;
}

.account-file-wrap{
  min-width:0;
}

.account-file-wrap label{
  display:block;
  margin-bottom:7px;
}

.account-page--clean .clean-form input[type="file"]{
  display:block;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  min-height:46px;
  padding:9px 10px;
  overflow:hidden;
  text-overflow:ellipsis;
}

.account-panel-head--clean{
  align-items:center;
  margin-bottom:16px;
}

.account-create-form--clean{
  align-items:center;
  margin-bottom:16px;
}

.account-create-form--clean input{
  min-width:0;
}

.account-create-form--clean .btn{
  flex:0 0 auto;
  white-space:nowrap;
  min-width:132px;
}

.songbook-dashboard-list--clean,
.my-song-list--clean{
  display:grid;
  gap:8px;
}

.songbook-dashboard-row,
.my-song-row--clean{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.045);
  padding:12px 14px;
}

.songbook-dashboard-info,
.my-song-main{
  min-width:0;
}

.songbook-dashboard-info strong,
.my-song-row--clean .my-song-main strong{
  display:block;
  color:var(--cream);
  font-size:16px;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.songbook-dashboard-info span,
.my-song-row--clean .my-song-main > span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.songbook-open-link,
.my-song-edit{
  flex:0 0 auto;
  white-space:nowrap;
}

.account-panel-head--songs .account-panel-action{
  min-width:170px;
  white-space:nowrap;
}

@media (max-width: 1100px){
  .account-hero-clean{
    grid-template-columns:1fr;
  }

  .account-hero-actions{
    grid-template-columns:repeat(2,minmax(0,1fr));
    min-width:0;
  }
}

@media (max-width: 820px){
  .account-settings-grid-clean{
    grid-template-columns:1fr;
  }

  .account-hero-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width: 620px){
  .account-page--clean{
    padding:38px 0 64px;
  }

  .account-hero-clean,
  .account-card-clean{
    border-radius:24px;
    padding:20px;
  }

  .account-hero-main{
    grid-template-columns:76px minmax(0,1fr);
    gap:14px;
  }

  .account-hero-avatar,
  .account-avatar-xl{
    width:76px;
    height:76px;
    border-radius:24px;
  }

  .account-hero-stats{
    grid-template-columns:1fr;
  }

  .account-hero-actions,
  .account-create-form--clean,
  .songbook-dashboard-row,
  .my-song-row--clean,
  .account-panel-head--songs{
    grid-template-columns:1fr;
  }

  .account-panel-head--clean{
    display:grid;
    gap:12px;
    align-items:start;
  }

  .account-panel-head--songs .account-panel-action,
  .songbook-open-link,
  .my-song-edit,
  .account-create-form--clean .btn{
    width:100%;
    min-width:0;
  }

  .account-photo-row--clean{
    grid-template-columns:1fr;
  }
}

/* Patch 041: songs page redesign */
.songs-page--new{
  position:relative;
  overflow:hidden;
  padding:96px 0 84px;
  background:
    radial-gradient(circle at 82% 8%, rgba(240,165,38,.16), transparent 30%),
    radial-gradient(circle at 15% 20%, rgba(255,196,107,.10), transparent 28%),
    linear-gradient(180deg,#111417 0%,#171813 56%,#101216 100%);
  color:var(--text);
}

.songs-page--new:before{
  content:'♪';
  position:absolute;
  right:5vw;
  top:190px;
  font-size:230px;
  line-height:1;
  color:rgba(240,165,38,.055);
  font-weight:900;
  pointer-events:none;
}

.songs-hero-panel,
.songs-filter-panel,
.songs-list-card,
.songs-side-panel > div,
.songs-artists-section{
  position:relative;
  z-index:1;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
  box-shadow:0 24px 70px rgba(0,0,0,.22);
  backdrop-filter:blur(14px);
}

.songs-hero-panel{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:28px;
  align-items:center;
  padding:34px;
  border-radius:34px;
}

.songs-hero-copy h1{
  margin:14px 0 0;
  font-size:clamp(42px,6.2vw,82px);
  line-height:.95;
  letter-spacing:-.07em;
}

.songs-hero-copy p{
  max-width:690px;
  margin:18px 0 0;
  color:rgba(255,246,231,.72);
  font-size:19px;
  line-height:1.55;
}

.songs-hero-stats{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}

.songs-hero-stats span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.13);
  color:#ffc46b;
  border:1px solid rgba(240,165,38,.23);
  font-weight:900;
}

.songs-hero-stats strong{
  color:#fff6e7;
}

.songs-hero-card{
  display:grid;
  gap:14px;
  padding:18px;
  border-radius:26px;
  background:linear-gradient(135deg, rgba(255,246,231,.09), rgba(255,255,255,.045));
  border:1px solid rgba(255,255,255,.10);
}

.songs-main-search{
  display:flex;
  gap:10px;
  padding:7px;
  border-radius:999px;
  background:rgba(15,17,21,.52);
  border:1px solid rgba(255,255,255,.12);
}

.songs-main-search input{
  width:100%;
  min-height:46px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text);
  font-size:16px;
  padding:0 14px;
}

.songs-main-search button,
.songs-add-link{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:999px;
  padding:0 18px;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
  white-space:nowrap;
  cursor:pointer;
}

.songs-add-link{
  width:100%;
}

.songs-filter-panel{
  margin-top:24px;
  padding:20px;
  border-radius:30px;
}

.songs-sort-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.songs-sort-tabs a,
.songs-letter-filter a{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border-radius:999px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(255,246,231,.74);
  font-weight:900;
}

.songs-sort-tabs a.is-active,
.songs-letter-filter a.is-active{
  background:var(--orange);
  border-color:var(--orange);
  color:#1b140c;
}

.songs-letter-filter{
  margin-top:18px;
}

.songs-letter-filter strong{
  display:block;
  margin-bottom:10px;
  color:rgba(255,246,231,.78);
}

.songs-letter-filter div{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.songs-letter-filter a{
  min-width:38px;
  padding:0 11px;
}

.songs-content-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  gap:22px;
  align-items:start;
  margin-top:24px;
}

.songs-list-card{
  padding:24px;
  border-radius:32px;
}

.songs-list-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}

.songs-list-head h2,
.songs-section-head h2{
  margin:0;
  font-size:clamp(30px,4vw,50px);
  line-height:1;
  letter-spacing:-.055em;
}

.songs-list-head p,
.songs-section-head p{
  margin:10px 0 0;
  color:rgba(255,246,231,.60);
  line-height:1.55;
}

.songs-directory-list{
  display:grid;
  gap:10px;
}

.songs-directory-row{
  display:grid;
  grid-template-columns:58px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:12px;
  border-radius:22px;
  background:rgba(255,255,255,.052);
  border:1px solid rgba(255,255,255,.075);
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}

.songs-directory-row:hover{
  transform:translateY(-2px);
  background:rgba(240,165,38,.10);
  border-color:rgba(240,165,38,.25);
}

.songs-directory-photo{
  width:58px;
  height:58px;
  overflow:hidden;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(240,165,38,.20),rgba(255,255,255,.06));
  border:1px solid rgba(255,255,255,.08);
}

.songs-directory-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.songs-directory-main h3{
  margin:0;
  font-size:20px;
  line-height:1.15;
  letter-spacing:-.035em;
}

.songs-directory-main p{
  margin:5px 0 0;
  color:rgba(255,246,231,.54);
  font-size:14px;
}

.songs-directory-chords{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:9px;
}

.songs-directory-chords span{
  min-height:26px;
  display:inline-flex;
  align-items:center;
  padding:0 9px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  color:#ffc46b;
  font-size:13px;
  font-weight:900;
}

.songs-directory-side{
  display:grid;
  justify-items:end;
  gap:9px;
}

.songs-directory-side small{
  color:rgba(255,246,231,.48);
  white-space:nowrap;
}

.songs-directory-side a{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  color:#ffc46b;
  border:1px solid rgba(240,165,38,.25);
  font-weight:900;
}

.songs-side-panel{
  display:grid;
  gap:16px;
  position:sticky;
  top:94px;
}

.songs-side-panel > div{
  padding:20px;
  border-radius:28px;
}

.songs-tip-box span{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(240,165,38,.18);
  margin-bottom:13px;
}

.songs-tip-box strong,
.songs-myu-box strong{
  display:block;
  font-size:22px;
  line-height:1.1;
  letter-spacing:-.035em;
}

.songs-tip-box p,
.songs-myu-box p{
  margin:10px 0 0;
  color:rgba(255,246,231,.62);
  line-height:1.55;
}

.songs-myu-box{
  background:
    radial-gradient(circle at 88% 88%, rgba(240,165,38,.19), transparent 34%),
    rgba(255,255,255,.055) !important;
}

.songs-myu-box a{
  min-height:42px;
  margin-top:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  border-radius:999px;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
}

.songs-empty-panel{
  padding:26px;
  border-radius:24px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.08);
}

.songs-empty-panel h3{
  margin:0;
  font-size:24px;
}

.songs-empty-panel p{
  margin:8px 0 0;
  color:rgba(255,246,231,.60);
}

.songs-artists-section{
  margin-top:24px;
  padding:24px;
  border-radius:32px;
}

.songs-artists-section .artist-grid{
  margin-top:20px;
}

.songs-artists-section .artist-card{
  background:rgba(255,255,255,.055);
  border-color:rgba(255,255,255,.08);
}

.songs-artists-section .artist-card p,
.songs-artists-section .top-song-list small,
.songs-artists-section .empty-songs{
  color:rgba(255,246,231,.56);
}

@media(max-width:1020px){
  .songs-hero-panel,
  .songs-content-grid{
    grid-template-columns:1fr;
  }

  .songs-side-panel{
    position:static;
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:720px){
  .songs-page--new{
    padding:72px 0 64px;
  }

  .songs-hero-panel,
  .songs-filter-panel,
  .songs-list-card,
  .songs-artists-section{
    border-radius:26px;
    padding:18px;
  }

  .songs-main-search{
    flex-direction:column;
    border-radius:22px;
  }

  .songs-main-search button{
    width:100%;
  }

  .songs-side-panel{
    grid-template-columns:1fr;
  }

  .songs-directory-row{
    grid-template-columns:50px minmax(0,1fr);
    align-items:start;
  }

  .songs-directory-photo{
    width:50px;
    height:50px;
    border-radius:16px;
  }

  .songs-directory-side{
    grid-column:1 / -1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    justify-items:initial;
  }

  .songs-directory-main h3{
    font-size:18px;
  }
}

/* Patch 042: songs page as artist directory first */
.songs-page--artists-first .songs-hero-panel{
  grid-template-columns:minmax(0,1fr) minmax(300px,430px);
}

.songs-filter-panel--artists{
  margin-top:22px;
}

.songs-letter-filter--artists{
  margin-top:0;
}

.songs-artists-section--primary{
  margin-top:24px;
}


.songs-section-note{
  display:inline-flex;
  align-items:center;
  margin-top:12px;
  min-height:34px;
  padding:0 13px;
  border-radius:999px;
  background:rgba(240,165,38,.12);
  border:1px solid rgba(240,165,38,.22);
  color:#ffc46b;
  font-size:14px;
  font-weight:900;
}

.songs-artist-directory{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-top:20px;
}

.songs-artist-row{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
  padding:13px;
  border-radius:24px;
  background:rgba(255,255,255,.052);
  border:1px solid rgba(255,255,255,.075);
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.songs-artist-row:hover{
  transform:translateY(-2px);
  background:rgba(240,165,38,.10);
  border-color:rgba(240,165,38,.26);
}

.songs-artist-photo{
  width:64px;
  height:64px;
  display:block;
  overflow:hidden;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(240,165,38,.22),rgba(255,255,255,.055));
  border:1px solid rgba(255,255,255,.09);
}

.songs-artist-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.songs-artist-main{
  min-width:0;
}

.songs-artist-main h3{
  margin:0;
  font-size:21px;
  line-height:1.12;
  letter-spacing:-.04em;
}

.songs-artist-main h3 a{
  color:var(--text);
}

.songs-artist-main p{
  margin:5px 0 0;
  color:rgba(255,246,231,.55);
  font-weight:800;
}

.songs-artist-topline{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin-top:8px;
  color:rgba(255,246,231,.52);
  font-size:13px;
}

.songs-artist-topline span{
  color:#ffc46b;
  font-weight:900;
}

.songs-artist-topline a{
  color:rgba(255,246,231,.78);
  font-weight:800;
}

.songs-artist-topline em{
  font-style:normal;
  color:rgba(255,246,231,.28);
}

.songs-artist-open{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  border:1px solid rgba(240,165,38,.25);
  color:#ffc46b;
  font-weight:900;
  white-space:nowrap;
}

.songs-content-grid--secondary{
  margin-top:24px;
}

.songs-list-head--with-tabs{
  align-items:flex-start;
}

.songs-sort-tabs--compact{
  justify-content:flex-end;
  min-width:260px;
}

.songs-sort-tabs--compact a{
  min-height:36px;
  padding:0 12px;
  font-size:14px;
}

.songs-directory-list--compact .songs-directory-row{
  grid-template-columns:52px minmax(0,1fr) auto;
}

.songs-directory-list--compact .songs-directory-photo{
  width:52px;
  height:52px;
  border-radius:17px;
}

@media(max-width:1080px){
  .songs-artist-directory{
    grid-template-columns:1fr;
  }

  .songs-list-head--with-tabs{
    display:grid;
  }

  .songs-sort-tabs--compact{
    justify-content:flex-start;
    min-width:0;
  }
}

@media(max-width:720px){
  .songs-artist-row{
    grid-template-columns:54px minmax(0,1fr);
    align-items:start;
  }

  .songs-artist-photo{
    width:54px;
    height:54px;
    border-radius:17px;
  }

  .songs-artist-main h3{
    font-size:19px;
  }

  .songs-artist-open{
    grid-column:1 / -1;
    width:100%;
  }

  .songs-sort-tabs--compact{
    gap:7px;
  }

  .songs-sort-tabs--compact a{
    flex:1 1 auto;
  }
}

/* Patch 044: pesničky SEO, obľúbení interpreti, mobilné doladenie */
.songs-page--new{
  padding-top:72px;
  background:
    radial-gradient(circle at 86% 8%, rgba(240,165,38,.12), transparent 24%),
    radial-gradient(circle at 14% 9%, rgba(255,196,107,.075), transparent 22%),
    linear-gradient(180deg,#15130f 0%,#15130f 18%,#101216 42%,#101216 100%);
}

.songs-page--new:before{
  top:86px;
  opacity:.72;
}

.songs-hero-panel{
  align-items:stretch;
}

.songs-hero-card{
  align-self:center;
}

.songs-hero-copy .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
}

.songs-section-note{
  display:inline-flex;
  max-width:100%;
  height:auto;
  min-height:34px;
  padding:8px 13px;
  line-height:1.35;
}

.songs-list-card{
  scroll-margin-top:110px;
}

@media(max-width:1020px){
  .songs-page--artists-first .songs-hero-panel{
    grid-template-columns:1fr;
  }
}

@media(max-width:720px){
  .songs-page--new{
    padding:42px 0 58px;
    background:
      radial-gradient(circle at 86% 0%, rgba(240,165,38,.10), transparent 22%),
      linear-gradient(180deg,#15130f 0%,#15130f 13%,#101216 34%,#101216 100%);
  }

  .songs-page--new:before{
    top:68px;
    right:-35px;
    font-size:150px;
  }

  .songs-page--artists-first .songs-hero-panel{
    grid-template-columns:1fr;
    gap:16px;
    padding:20px;
  }

  .songs-hero-copy h1{
    font-size:clamp(38px,13vw,58px);
    line-height:.96;
    letter-spacing:-.06em;
    max-width:8.5em;
  }

  .songs-hero-copy p{
    font-size:16px;
    line-height:1.5;
    max-width:none;
  }

  .songs-hero-card{
    padding:12px;
    border-radius:22px;
    width:100%;
  }

  .songs-main-search{
    width:100%;
    padding:8px;
    gap:8px;
  }

  .songs-main-search input{
    min-height:44px;
    padding:0 12px;
  }

  .songs-main-search button,
  .songs-add-link{
    min-height:44px;
  }

  .songs-filter-panel--artists{
    padding:16px;
  }

  .songs-letter-filter a{
    min-width:35px;
    min-height:36px;
    padding:0 10px;
  }

  .songs-section-head h2,
  .songs-list-head h2{
    font-size:30px;
  }
}

/* Patch 046: pesničky eyebrow zladené s akordmi + detail interpreta */
.songs-hero-copy .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  border:1px solid rgba(240,165,38,.24);
  color:#ffc267;
  font-weight:900;
}

.songs-hero-copy .eyebrow:before{
  content:'♪';
  display:inline-block;
  width:auto;
  height:auto;
  background:none;
  filter:none;
  color:#ffc267;
  font-weight:900;
}

.songs-page--artists-first .songs-hero-copy h1{
  max-width:760px;
}

.songs-directory-main p{
  margin:6px 0 0;
  color:rgba(255,246,231,.58);
  font-weight:800;
}

.artist-detail-page{
  padding:72px 0 84px;
  background:
    radial-gradient(circle at 86% 6%, rgba(240,165,38,.12), transparent 23%),
    radial-gradient(circle at 12% 7%, rgba(255,196,107,.07), transparent 22%),
    linear-gradient(180deg,#15130f 0%,#15130f 16%,#101216 40%,#101216 100%);
  color:var(--text);
}

.artist-detail-hero{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:28px;
  align-items:center;
  padding:32px;
  border-radius:34px;
  background:
    radial-gradient(circle at 16% -10%, rgba(240,165,38,.20), transparent 34%),
    linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.11);
  box-shadow:0 26px 80px rgba(0,0,0,.30);
}

.artist-detail-photo{
  width:220px;
  height:220px;
  overflow:hidden;
  border-radius:34px;
  background:linear-gradient(135deg,rgba(240,165,38,.22),rgba(255,255,255,.055));
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 62px rgba(0,0,0,.24);
}

.artist-detail-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.artist-detail-copy .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  border:1px solid rgba(240,165,38,.24);
  color:#ffc267;
  font-weight:900;
}

.artist-detail-copy h1{
  margin:14px 0 12px;
  font-size:clamp(48px,7vw,92px);
  line-height:.92;
  letter-spacing:-.07em;
}

.artist-detail-copy p{
  max-width:760px;
  margin:0;
  color:rgba(247,243,236,.72);
  font-size:18px;
  line-height:1.65;
}

.artist-detail-stats{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}

.artist-detail-stats span{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);
  color:rgba(247,243,236,.72);
  font-weight:800;
}

.artist-detail-stats strong{
  color:#ffc267;
  margin-right:6px;
}

.artist-detail-primary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:22px;
  padding:0 20px;
  border-radius:999px;
  background:var(--orange);
  color:#17120a;
  font-weight:950;
  box-shadow:0 16px 36px rgba(240,165,38,.24);
}

.artist-detail-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin-top:22px;
}

.artist-detail-actions .artist-detail-primary{
  margin-top:0;
}

.artist-detail-back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.11);
  color:rgba(247,243,236,.78);
  font-weight:900;
}

.artist-detail-back:hover{
  color:var(--text);
  border-color:rgba(240,165,38,.25);
  background:rgba(240,165,38,.10);
}

.artist-detail-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 340px;
  gap:24px;
  align-items:start;
  margin-top:24px;
}

.artist-detail-songs-card,
.artist-detail-side .songs-myu-box{
  border-radius:30px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 18px 52px rgba(0,0,0,.18);
}

.artist-detail-songs-card{
  padding:26px;
}

.artist-detail-section-head{
  margin-bottom:18px;
}

.artist-detail-section-head h2{
  margin:0;
  font-size:clamp(32px,4.5vw,56px);
  line-height:1;
  letter-spacing:-.055em;
}

.artist-detail-section-head p{
  margin:10px 0 0;
  color:rgba(247,243,236,.64);
}

.artist-detail-song-list{
  display:grid;
  gap:10px;
}

.artist-detail-song-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.075);
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}

.artist-detail-song-row:hover{
  transform:translateY(-1px);
  background:rgba(240,165,38,.09);
  border-color:rgba(240,165,38,.22);
}

.artist-detail-song-main h3{
  margin:0;
  font-size:20px;
  line-height:1.14;
  letter-spacing:-.035em;
}

.artist-detail-song-main h3 a{
  color:var(--text);
}

.artist-detail-chords{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-top:8px;
}

.artist-detail-chords span{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 9px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  color:#ffc267;
  font-size:13px;
  font-weight:900;
}

.artist-detail-song-side{
  display:flex;
  align-items:center;
  gap:10px;
}

.artist-detail-song-side small{
  color:rgba(247,243,236,.54);
  font-weight:800;
  white-space:nowrap;
}

.artist-detail-song-side a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.15);
  border:1px solid rgba(240,165,38,.25);
  color:#ffc46b;
  font-weight:900;
}

.artist-detail-side .songs-myu-box{
  padding:22px;
}

@media(max-width:980px){
  .artist-detail-hero,
  .artist-detail-layout{
    grid-template-columns:1fr;
  }

  .artist-detail-photo{
    width:170px;
    height:170px;
    justify-self:center;
    margin:0 auto;
  }
}

@media(max-width:720px){
  .artist-detail-page{
    padding:42px 0 58px;
    background:
      radial-gradient(circle at 86% 0%, rgba(240,165,38,.10), transparent 22%),
      linear-gradient(180deg,#15130f 0%,#15130f 13%,#101216 34%,#101216 100%);
  }

  .artist-detail-hero{
    padding:20px;
    border-radius:28px;
  }

  .artist-detail-photo{
    width:132px;
    height:132px;
    border-radius:26px;
  }

  .artist-detail-copy h1{
    font-size:clamp(42px,13vw,62px);
  }

  .artist-detail-songs-card{
    padding:18px;
    border-radius:26px;
  }

  .artist-detail-song-row{
    grid-template-columns:1fr;
  }

  .artist-detail-song-side{
    justify-content:space-between;
  }

  .artist-detail-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .artist-detail-actions a{
    width:100%;
  }

  .songs-page--artists-first .songs-hero-copy h1{
    max-width:none;
  }
}

/* Patch 049: song detail redesign */
.song-detail-page{
  position:relative;
  overflow:hidden;
  padding:72px 0 86px;
  background:linear-gradient(180deg,#171912 0%,#101513 42%,#0f1115 100%);
}

.song-detail-bg{
  position:absolute;
  inset:0 0 auto 0;
  height:430px;
  background:
    radial-gradient(circle at 20% 20%,rgba(240,165,38,.18),transparent 36%),
    radial-gradient(circle at 78% 8%,rgba(81,164,107,.16),transparent 34%),
    linear-gradient(135deg,rgba(113,81,35,.42),rgba(17,29,26,.10));
  pointer-events:none;
}

.song-detail-page > .container{
  position:relative;
  z-index:1;
}

.song-detail-hero{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.78fr);
  gap:26px;
  align-items:stretch;
  margin-bottom:26px;
}

.song-detail-hero__copy,
.song-detail-hero__card,
.song-play-card,
.song-side-card,
.song-related-section{
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(48,51,42,.90),rgba(28,34,32,.88));
  border-radius:32px;
  box-shadow:0 24px 70px rgba(0,0,0,.26);
}

.song-detail-hero__copy{
  padding:36px;
}

.song-detail-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:38px;
  padding:0 16px;
  border-radius:999px;
  background:rgba(240,165,38,.18);
  border:1px solid rgba(240,165,38,.32);
  color:#ffd37a;
  font-weight:900;
  margin-bottom:18px;
}

.song-detail-eyebrow span{
  color:var(--orange);
}

.song-detail-hero h1{
  margin:0;
  max-width:850px;
  font-size:clamp(44px,7vw,92px);
  line-height:.94;
  letter-spacing:-.07em;
  color:var(--text);
}

.song-detail-hero__copy > p{
  margin:22px 0 0;
  max-width:640px;
  color:rgba(247,243,236,.74);
  font-size:20px;
  line-height:1.65;
}

.song-detail-artist-line{
  margin-top:24px;
}

.song-detail-artist-line a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 16px 8px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.10);
  color:#fff8ec;
  font-weight:900;
}

.song-detail-artist-line img{
  width:42px;
  height:42px;
  border-radius:50%;
  object-fit:cover;
  background:rgba(240,165,38,.14);
}

.song-detail-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:30px;
}

.song-detail-secondary{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  color:#fff7e7;
  font-weight:900;
  background:rgba(255,255,255,.05);
}

.song-detail-secondary:hover{
  border-color:rgba(240,165,38,.42);
}

.song-detail-hero__card{
  position:relative;
  min-height:360px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background-size:cover;
  background-position:center;
}

.song-detail-hero__cardOverlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(15,17,21,.10),rgba(15,17,21,.72)),
    radial-gradient(circle at 50% 12%,rgba(240,165,38,.18),transparent 44%);
}

.song-detail-stat-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  width:100%;
  padding:22px;
}

.song-detail-stat-grid div{
  min-height:82px;
  padding:15px;
  border-radius:22px;
  background:rgba(15,17,21,.72);
  border:1px solid rgba(255,255,255,.11);
  backdrop-filter:blur(10px);
}

.song-detail-stat-grid span{
  display:block;
  margin-bottom:8px;
  color:rgba(247,243,236,.58);
  font-size:13px;
  font-weight:800;
}

.song-detail-stat-grid strong{
  display:block;
  color:#fff6e7;
  font-size:18px;
  line-height:1.2;
}

.song-detail-main{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:24px;
  align-items:start;
}

.song-play-card{
  padding:28px;
}

.song-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:20px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.10);
}

.song-card-head h2,
.song-side-head h2,
.song-related-head h2{
  margin:0;
  font-size:28px;
  line-height:1.05;
  letter-spacing:-.04em;
}

.song-card-head p,
.song-side-head p,
.song-related-head p{
  margin:8px 0 0;
  color:rgba(247,243,236,.62);
  line-height:1.55;
}

.song-mini-controls{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.song-mini-controls button{
  min-height:38px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  padding:0 14px;
  background:rgba(255,255,255,.06);
  color:#fff6e7;
  font-weight:900;
  cursor:pointer;
}

.song-mini-controls button:hover,
.song-mini-controls button.is-active{
  background:var(--orange);
  color:#1d1408;
  border-color:transparent;
}

.song-play-tools{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin:-4px 0 18px;
  padding:14px;
  border-radius:22px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
}

.song-transpose{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.song-transpose strong,
.song-scroll-speed span{
  color:rgba(247,243,236,.76);
  font-size:13px;
  font-weight:900;
}

.song-transpose a,
.song-transpose span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:36px;
  min-height:34px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(255,255,255,.06);
  color:#fff7e7;
  font-weight:950;
}

.song-transpose a:hover{
  background:var(--orange);
  border-color:transparent;
  color:#1d1408;
}

.song-transpose .song-transpose-reset{
  min-width:0;
  color:#ffd37a;
}

.song-scroll-speed{
  display:flex;
  align-items:center;
  gap:10px;
}

.song-scroll-speed input{
  width:130px;
  accent-color:var(--orange);
}

.song-scroll-speed em{
  min-width:32px;
  color:#ffd37a;
  font-style:normal;
  font-weight:950;
}

.song-text--detail{
  font-size:22px;
  line-height:1.45;
  color:#fff9ed;
  padding:8px 0 4px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.song-text--detail .song-line{
  min-height:2.55em;
  white-space:nowrap;
  display:block;
}

.song-text--detail .song-line--empty{
  min-height:1.15em;
}

.song-text--detail .song-lyric{
  display:inline;
  white-space:pre;
  color:#fff7e7;
}

.song-text--detail .song-chord-slot{
  display:inline-block;
  vertical-align:top;
  white-space:pre;
}

.song-text--detail .song-chord-above{
  display:block;
  min-height:1.12em;
  color:#f0a526;
  font-size:.72em;
  line-height:1.05;
  font-weight:950;
  letter-spacing:.01em;
}

.song-text--detail .song-lyric-text{
  display:block;
  min-height:1.22em;
  line-height:1.22;
  white-space:pre;
  color:#fff7e7;
}

.song-text--detail .song-lyric-text--empty{
  color:transparent;
}

.song-video-card{
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.10);
}

.song-video-head{
  margin-bottom:14px;
}

.song-video-head h2{
  margin:0;
  font-size:26px;
  line-height:1.05;
  letter-spacing:-.04em;
}

.song-video-head p{
  margin:8px 0 0;
  max-width:720px;
  color:rgba(247,243,236,.62);
  line-height:1.55;
}

.song-video-frame{
  position:relative;
  overflow:hidden;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.12);
  background:#0f1115;
  box-shadow:0 18px 45px rgba(0,0,0,.22);
}

.song-video-frame:before{
  content:'';
  display:block;
  padding-top:56.25%;
}

.song-video-frame iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}

.song-side-card--video .song-video-card{
  margin-top:0;
  padding-top:0;
  border-top:0;
}

.song-side-card--video .song-video-head{
  margin-bottom:12px;
}

.song-side-card--video .song-video-head h3{
  margin:0;
  font-size:22px;
  line-height:1.08;
  letter-spacing:-.035em;
}

.song-side-card--video .song-video-head p{
  margin:7px 0 0;
  color:rgba(247,243,236,.62);
  font-size:14px;
  line-height:1.5;
}

.song-side-card--video .song-video-frame{
  border-radius:18px;
}

.song-side-stack{
  display:grid;
  gap:16px;
  position:sticky;
  top:98px;
}

.song-side-card{
  padding:22px;
  border-radius:26px;
}

.song-side-head{
  margin-bottom:16px;
}

.song-instrument-switch{
  display:grid;
  gap:12px;
  margin:0 0 18px;
}

.song-instrument-switch strong{
  color:#fff7e7;
  font-size:14px;
}

.song-instrument-switch div{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.song-instrument-switch a{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 13px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  color:#fff7e7;
  font-weight:900;
  font-size:13px;
}

.song-instrument-switch a.is-active{
  background:var(--orange);
  color:#1d1408;
  border-color:transparent;
}

.song-instrument-switch small{
  color:rgba(247,243,236,.58);
  font-weight:800;
}

.song-chord-diagrams--detail{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}

.song-chord-card{
  display:block;
  min-width:0;
  border-radius:20px;
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease;
}

.song-chord-card:hover{
  transform:translateY(-2px);
  box-shadow:0 16px 35px rgba(0,0,0,.20);
}

.song-chord-card .ua-chord-svg{
  width:100%;
  height:auto;
  display:block;
}

.song-chord-pills{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
}

.song-chord-pills span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  color:#ffd37a;
  font-weight:900;
}

.song-side-card--songbook h3{
  margin:0 0 12px;
  font-size:22px;
}

.song-side-card--songbook p{
  margin:0 0 14px;
  color:rgba(247,243,236,.66);
  line-height:1.55;
}

.song-side-card--songbook label{
  display:block;
  margin:0 0 8px;
  color:#fff7e7;
  font-weight:900;
}

.song-side-card--songbook select{
  width:100%;
  min-height:46px;
  margin-bottom:12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.07);
  color:#fff7e7;
  padding:0 12px;
}

.song-side-card--myukulele{
  background:linear-gradient(145deg,rgba(92,64,28,.84),rgba(36,47,38,.88));
}

.song-side-card--myukulele strong{
  display:block;
  margin-bottom:8px;
  font-size:20px;
}

.song-side-card--myukulele p{
  margin:0 0 14px;
  color:rgba(247,243,236,.72);
  line-height:1.55;
}

.song-side-card--myukulele a{
  color:#ffd37a;
  font-weight:900;
}

.song-related-section{
  margin-top:24px;
  padding:26px;
}

.song-related-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}

.song-related-head a{
  flex:0 0 auto;
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  border-radius:999px;
  color:#1d1408;
  background:var(--orange);
  font-weight:900;
}

.song-related-list{
  display:grid;
  gap:10px;
}

.song-related-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px 18px;
  border-radius:22px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
}

.song-related-row:hover{
  border-color:rgba(240,165,38,.28);
  background:rgba(255,255,255,.075);
}

.song-related-row strong{
  display:block;
  color:#fff7e7;
  font-size:17px;
}

.song-related-row small{
  display:block;
  margin-top:5px;
  color:rgba(247,243,236,.58);
  font-weight:800;
}

.song-related-row em{
  font-style:normal;
  color:#ffd37a;
  font-weight:900;
}

@media(max-width:1100px){
  .song-detail-hero,
  .song-detail-main{
    grid-template-columns:1fr;
  }

  .song-side-stack{
    position:static;
    grid-template-columns:1fr 1fr;
  }

  .song-side-card--chords{
    grid-column:1/-1;
  }

  .song-chord-diagrams--detail{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}

@media(max-width:760px){
  .song-detail-page{
    padding:34px 0 58px;
  }

  .song-detail-bg{
    height:300px;
  }

  .song-detail-hero__copy,
  .song-play-card,
  .song-related-section{
    padding:22px;
    border-radius:26px;
  }

  .song-detail-hero__card{
    min-height:300px;
    border-radius:26px;
  }

  .song-detail-hero h1{
    font-size:clamp(42px,14vw,68px);
  }

  .song-detail-hero__copy > p{
    font-size:17px;
  }

  .song-detail-actions,
  .song-card-head,
  .song-related-head{
    flex-direction:column;
    align-items:stretch;
  }

  .song-detail-actions .btn,
  .song-detail-secondary,
  .song-related-head a{
    width:100%;
  }

  .song-detail-stat-grid{
    grid-template-columns:1fr 1fr;
    padding:14px;
  }

  .song-detail-stat-grid div{
    min-height:auto;
    padding:13px;
  }

  .song-card-head h2,
  .song-side-head h2,
  .song-related-head h2{
    font-size:25px;
  }

  .song-mini-controls{
    justify-content:stretch;
  }

  .song-mini-controls button{
    flex:1 1 calc(50% - 8px);
  }

  .song-play-tools{
    align-items:stretch;
    flex-direction:column;
    padding:12px;
  }

  .song-transpose,
  .song-scroll-speed{
    width:100%;
  }

  .song-scroll-speed input{
    flex:1;
    min-width:0;
  }

  .song-text--detail{
    font-size:20px;
    line-height:2.08;
  }

  .song-side-stack{
    grid-template-columns:1fr;
  }

  .song-chord-diagrams--detail{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .song-related-row{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:420px){
  .song-detail-stat-grid,
  .song-chord-diagrams--detail{
    grid-template-columns:1fr;
  }
}

@media print{
  .ua-header,
  .footer,
  .song-detail-bg,
  .song-detail-hero,
  .song-side-stack,
  .song-related-section,
  .song-card-head .song-mini-controls{
    display:none !important;
  }

  .song-detail-page{
    padding:0;
    background:#fff;
    color:#111;
  }

  .song-detail-main,
  .song-play-card{
    display:block;
    box-shadow:none;
    border:0;
    background:#fff;
    color:#111;
  }

  .song-text--detail,
  .song-text--detail .song-lyric{
    color:#111;
  }
}


@media (max-width: 700px){
  .song-text--detail{
    font-size:18px;
    padding-bottom:12px;
  }

  .song-text--detail .song-line{
    min-height:2.55em;
  }
}

/* Patch 052: detail pesničky - presné riadky akordov a sticky autoscroll */
.song-transpose-bar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  flex-wrap:wrap;
  margin:-4px 0 12px;
  padding:13px 14px;
  border-radius:22px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.10);
}

.song-play-tools{
  position:sticky;
  top:92px;
  z-index:12;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin:0 0 20px;
  padding:12px 14px;
  border-radius:22px;
  background:rgba(24,29,26,.94);
  border:1px solid rgba(240,165,38,.20);
  box-shadow:0 16px 40px rgba(0,0,0,.24);
  backdrop-filter:blur(14px);
}

.song-autoscroll-btn{
  min-height:40px;
  border:1px solid rgba(240,165,38,.38);
  border-radius:999px;
  padding:0 18px;
  background:var(--orange);
  color:#1d1408;
  font-weight:950;
  cursor:pointer;
}

.song-autoscroll-btn.is-active{
  background:#fff7e7;
  color:#21170a;
}

.song-youtube-control{
  min-height:40px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  padding:0 16px;
  background:#e94b35;
  color:#fff7e7;
  font-weight:950;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.song-youtube-control:hover,
.song-youtube-control.is-active{
  background:#fff7e7;
  color:#21170a;
}

.song-text--detail{
  line-height:1.25;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

.song-text--detail .song-line-pair{
  display:block;
  width:max-content;
  min-width:100%;
  margin:0 0 .18em;
  white-space:nowrap;
}

.song-text--detail .song-line-pair--empty{
  min-height:1.18em;
}

.song-text--detail .song-chord-row{
  display:block;
  min-height:1.04em;
  color:#f0a526;
  font-size:.72em;
  line-height:1.04;
  font-weight:950;
  letter-spacing:.01em;
  white-space:pre;
}

.song-text--detail .song-lyric-row{
  display:block;
  color:#fff7e7;
  line-height:1.22;
  white-space:pre;
}

@media(max-width:760px){
  .song-transpose-bar{
    margin:0 0 12px;
    padding:11px;
    border-radius:20px;
  }

  .song-play-tools{
    top:72px;
    align-items:stretch;
    padding:10px;
    border-radius:20px;
  }

  .song-autoscroll-btn{
    width:100%;
    min-height:44px;
  }

  .song-youtube-control{
    width:100%;
    min-height:44px;
  }

  .song-scroll-speed{
    width:100%;
  }

  .song-text--detail{
    font-size:18px;
    line-height:1.25;
  }

  .song-text--detail .song-chord-row{
    font-size:.70em;
  }
}

@media print{
  .song-transpose-bar,
  .song-play-tools{
    display:none !important;
  }
}

/* Patch 053: detail pesničky - menší default text a skutočne plávajúci autoscroll */
.song-text--detail{
  font-size:20px;
}

.song-play-tools-placeholder{
  display:block;
  height:0;
  margin:0;
  pointer-events:none;
}

.song-play-tools.is-floating{
  position:fixed;
  left:var(--song-tools-left, 18px);
  top:var(--song-tools-top, 92px);
  width:var(--song-tools-width, calc(100vw - 36px));
  max-width:calc(100vw - 24px);
  margin:0;
  z-index:1200;
}

.song-play-tools.is-floating + .song-play-tools-placeholder{
  height:auto;
}

@media(max-width:760px){
  .song-text--detail{
    font-size:17px;
  }

  .song-play-tools.is-floating{
    left:12px;
    top:var(--song-tools-top, 72px);
    width:calc(100vw - 24px);
    max-width:calc(100vw - 24px);
  }
}

/* Patch 054: detail pesničky - ovládanie bez skoku hore a spoľahlivejší autoscroll na mobile */
.song-transpose a,
.song-instrument-switch a,
.song-autoscroll-btn,
.song-scroll-speed input{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.song-transpose a,
.song-instrument-switch a{
  text-decoration:none;
}

#songPlay{
  scroll-margin-top:110px;
}

@media(max-width:760px){
  #songPlay{
    scroll-margin-top:84px;
  }

  .song-play-tools.is-floating{
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
  }
}

/* Patch 055: detail pesničky - jednotné tlačidlá rýchlosti autoscrollu */
.song-speed-buttons{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.song-speed-choice{
  min-width:42px;
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.06);
  color:rgba(247,243,236,.78);
  font-weight:950;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

.song-speed-choice:hover,
.song-speed-choice.is-active{
  border-color:rgba(240,165,38,.55);
  background:rgba(240,165,38,.18);
  color:#ffd37a;
}

.song-speed-choice.is-active{
  box-shadow:inset 0 0 0 1px rgba(240,165,38,.18);
}

@media(max-width:760px){
  .song-scroll-speed{
    align-items:flex-start;
    gap:8px;
  }

  .song-speed-buttons{
    width:100%;
  }

  .song-speed-choice{
    flex:1 1 0;
    min-width:0;
    min-height:42px;
  }
}

/* Patch 058: detail pesničky - poradie ovládania, pomalší a plynulejší autoscroll, YouTube fallback */
.song-play-tools{
  justify-content:flex-start;
}

.song-scroll-speed{
  flex:0 1 auto;
}

.song-video-fallback{
  display:grid;
  gap:7px;
  margin-top:10px;
}

.song-video-fallback a{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border-radius:999px;
  background:#fff7e7;
  color:#21170a;
  font-weight:950;
  text-decoration:none;
}

.song-video-fallback a:hover{
  background:var(--orange);
  color:#1d1408;
}

.song-video-fallback small{
  display:block;
  color:rgba(247,243,236,.62);
  line-height:1.35;
  font-weight:800;
}

@media(max-width:760px){
  .song-play-tools{
    justify-content:flex-start;
  }

  .song-scroll-speed{
    order:2;
  }

  .song-youtube-control{
    order:3;
  }

  .song-video-fallback a{
    width:100%;
  }
}

/* Patch 059: detail pesničky - YouTube ikony, stav tlačidla a mobilné rozloženie */
.song-detail-main,
.song-play-card,
.song-card-head,
.song-side-stack,
.song-side-card,
.song-text--detail{
  min-width:0;
  max-width:100%;
}

.song-youtube-control{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  white-space:nowrap;
  line-height:1;
}

.song-youtube-control:not(.is-active){
  background:#e94b35;
  color:#fff7e7;
}

.song-youtube-control .song-youtube-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  flex:0 0 20px;
}

.song-youtube-control .song-youtube-icon svg{
  display:block;
  width:20px;
  height:20px;
}

.song-youtube-control .song-youtube-icon--pause{
  display:none;
}

.song-youtube-control.is-active .song-youtube-icon--play{
  display:none;
}

.song-youtube-control.is-active .song-youtube-icon--pause{
  display:inline-flex;
}

.song-youtube-label{
  display:inline-flex;
  align-items:center;
}

@media(max-width:760px){
  html,
  body{
    overflow-x:hidden;
  }

  .song-detail-page .container,
  .song-detail-main,
  .song-play-card{
    width:100%;
    max-width:100%;
    min-width:0;
  }

  .song-play-card{
    padding:18px 14px;
    overflow:hidden;
  }

  .song-card-head{
    gap:12px;
    margin-bottom:14px;
    padding-bottom:14px;
  }

  .song-mini-controls{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    width:100%;
    gap:8px;
  }

  .song-mini-controls button{
    width:100%;
    min-width:0;
    min-height:40px;
    padding:0 8px;
    font-size:13px;
    white-space:nowrap;
  }

  .song-transpose-bar{
    display:block;
    width:100%;
    max-width:100%;
    overflow:hidden;
    padding:10px;
  }

  .song-transpose{
    display:grid;
    grid-template-columns:1fr 42px 48px 42px;
    align-items:center;
    width:100%;
    gap:8px;
  }

  .song-transpose strong{
    grid-column:1/-1;
  }

  .song-transpose a,
  .song-transpose span{
    width:100%;
    min-width:0;
    min-height:40px;
    padding:0 8px;
  }

  .song-transpose .song-transpose-reset{
    grid-column:1/-1;
    justify-content:center;
  }

  .song-play-tools,
  .song-play-tools.is-floating{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    overflow:hidden;
  }

  .song-autoscroll-btn,
  .song-youtube-control{
    width:100%;
    min-width:0;
    min-height:44px;
  }

  .song-scroll-speed{
    display:grid;
    grid-template-columns:1fr;
    align-items:stretch;
    width:100%;
    min-width:0;
    gap:8px;
  }

  .song-speed-buttons{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    width:100%;
    gap:6px;
  }

  .song-speed-choice{
    width:100%;
    min-width:0;
    min-height:40px;
    padding:0 4px;
    font-size:13px;
  }

  .song-text--detail{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    font-size:16px;
    line-height:1.25;
    padding-bottom:14px;
  }

  .song-text--detail .song-line,
  .song-text--detail .song-line-pair{
    width:max-content;
    min-width:100%;
    max-width:none;
    white-space:nowrap;
  }

  .song-text--detail .song-chord-row,
  .song-text--detail .song-lyric-row,
  .song-text--detail .song-lyric,
  .song-text--detail .song-lyric-text{
    white-space:pre;
  }

  .song-side-stack,
  .song-side-card{
    width:100%;
    min-width:0;
    max-width:100%;
  }

  .song-instrument-switch div{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }

  .song-instrument-switch a{
    justify-content:center;
    min-width:0;
    width:100%;
    padding:0 8px;
    text-align:center;
  }

  .song-chord-diagrams--detail{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .song-chord-card{
    min-width:0;
    max-width:100%;
  }

  .song-chord-card .ua-chord-svg,
  .song-chord-card img{
    max-width:100%;
    height:auto;
  }
}

@media(max-width:380px){
  .song-mini-controls{
    grid-template-columns:1fr;
  }

  .song-instrument-switch div,
  .song-chord-diagrams--detail{
    grid-template-columns:1fr;
  }
}

/* Patch 060: detail pesničky - mobilná transpozícia a select spevníka */
.song-side-card--songbook select{
  display:block;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  height:48px;
  min-height:48px;
  line-height:48px;
  padding:0 44px 0 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.16);
  background-color:rgba(255,255,255,.075);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23fff7e7' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6l6 -6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:18px 18px;
  color:#fff7e7;
  font-size:16px;
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  appearance:none;
  -webkit-appearance:none;
}

.song-side-card--songbook select:focus{
  outline:none;
  border-color:rgba(240,165,38,.62);
  box-shadow:0 0 0 3px rgba(240,165,38,.14);
}

.song-side-card--songbook select option{
  background:#1f261f;
  color:#fff7e7;
}

@media(max-width:760px){
  .song-transpose-bar{
    overflow:visible;
  }

  .song-transpose{
    grid-template-columns:44px minmax(0,1fr) 44px;
    gap:8px;
  }

  .song-transpose strong{
    grid-column:1/-1;
    font-size:14px;
  }

  .song-transpose a,
  .song-transpose span{
    min-height:42px;
    padding:0 8px;
    font-size:14px;
    line-height:1.05;
  }

  .song-transpose > a:first-of-type{
    grid-column:1;
  }

  .song-transpose > span{
    grid-column:2;
    white-space:normal;
    text-align:center;
  }

  .song-transpose > a:nth-of-type(2){
    grid-column:3;
  }

  .song-transpose .song-transpose-reset{
    grid-column:1/-1;
    min-height:40px;
    margin-top:2px;
  }

  .song-side-card--songbook form{
    display:grid;
    gap:10px;
  }

  .song-side-card--songbook label{
    margin:0;
  }

  .song-side-card--songbook select{
    margin:0;
  }
}


/* Patch 061: detail pesničky - obraz interpreta bez tóniny a capa */
.song-detail-stat-grid--compact{
  grid-template-columns:repeat(2,minmax(0,1fr));
}

.song-detail-stat-grid--compact div{
  min-height:76px;
}

@media(max-width:560px){
  .song-detail-stat-grid--compact{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .song-detail-stat-grid--compact div{
    min-height:auto;
  }
}

/* Patch 062: podpora stránky v detaile pesničky + podstránka */
.song-side-card--support{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 92% 8%,rgba(240,165,38,.24),transparent 32%),
    linear-gradient(145deg,rgba(38,45,39,.92),rgba(24,31,29,.92));
  border-color:rgba(240,165,38,.22);
}

.song-side-card--support:before{
  content:'';
  position:absolute;
  inset:auto -48px -58px auto;
  width:150px;
  height:150px;
  border-radius:50%;
  background:rgba(240,165,38,.11);
  pointer-events:none;
}

.song-support-mark{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  margin-bottom:13px;
  border-radius:16px;
  background:rgba(240,165,38,.18);
  border:1px solid rgba(240,165,38,.26);
  color:#ffd37a;
  font-size:24px;
  font-weight:900;
}

.song-side-card--support strong{
  position:relative;
  z-index:1;
  display:block;
  margin:0 0 8px;
  font-size:22px;
  line-height:1.12;
  letter-spacing:-.035em;
}

.song-side-card--support p{
  position:relative;
  z-index:1;
  margin:0 0 16px;
  color:rgba(247,243,236,.72);
  line-height:1.55;
}

.song-support-btn{
  position:relative;
  z-index:1;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:0 16px;
  border-radius:999px;
  background:var(--orange);
  color:#1d1408;
  font-weight:950;
  box-shadow:0 16px 34px rgba(240,165,38,.18);
}

.song-support-btn:hover{
  transform:translateY(-1px);
}

.support-page{
  position:relative;
  overflow:hidden;
  min-height:calc(100vh - 72px);
  padding:82px 0 88px;
  background:linear-gradient(180deg,#171912 0%,#101513 45%,#0f1115 100%);
}

.support-bg{
  position:absolute;
  inset:0 0 auto;
  height:520px;
  background:
    radial-gradient(circle at 22% 18%,rgba(240,165,38,.22),transparent 34%),
    radial-gradient(circle at 82% 5%,rgba(81,164,107,.18),transparent 33%),
    linear-gradient(135deg,rgba(113,81,35,.36),rgba(17,29,26,.04));
  pointer-events:none;
}

.support-page > .container{
  position:relative;
  z-index:1;
}

.support-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(320px,420px);
  gap:24px;
  align-items:stretch;
}

.support-hero-card,
.support-payment-card,
.support-info-card{
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(48,51,42,.90),rgba(28,34,32,.88));
  border-radius:32px;
  box-shadow:0 24px 70px rgba(0,0,0,.26);
}

.support-hero-card{
  padding:38px;
}

.support-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:38px;
  padding:0 16px;
  margin-bottom:18px;
  border-radius:999px;
  background:rgba(240,165,38,.18);
  border:1px solid rgba(240,165,38,.32);
  color:#ffd37a;
  font-weight:900;
}

.support-hero-card h1{
  max-width:780px;
  margin:0;
  color:var(--text);
  font-size:clamp(44px,7vw,86px);
  line-height:.95;
  letter-spacing:-.07em;
}

.support-hero-card p{
  max-width:720px;
  margin:22px 0 28px;
  color:rgba(247,243,236,.75);
  font-size:20px;
  line-height:1.7;
}

.support-payment-card{
  padding:26px;
  background:
    radial-gradient(circle at 92% 10%,rgba(240,165,38,.19),transparent 32%),
    linear-gradient(145deg,rgba(35,43,38,.94),rgba(25,31,30,.92));
}

.support-payment-card h2,
.support-info-card h2{
  margin:0 0 10px;
  color:#fff6e7;
  font-size:28px;
  line-height:1.08;
  letter-spacing:-.045em;
}

.support-payment-card > p,
.support-info-card p{
  margin:0 0 18px;
  color:rgba(247,243,236,.70);
  line-height:1.6;
}

.support-qr{
  width:min(260px,100%);
  margin:18px auto;
  padding:14px;
  border-radius:24px;
  background:#fff;
}

.support-qr img{
  width:100%;
  height:auto;
}

.support-payment-list{
  display:grid;
  gap:10px;
  margin:18px 0 0;
}

.support-payment-list div{
  display:grid;
  gap:5px;
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
}

.support-payment-list dt{
  color:rgba(247,243,236,.56);
  font-size:13px;
  font-weight:900;
}

.support-payment-list dd{
  margin:0;
  color:#fff7e7;
  font-size:16px;
  font-weight:900;
  overflow-wrap:anywhere;
}

.support-payment-empty{
  margin-top:18px;
  padding:16px;
  border-radius:20px;
  background:rgba(240,165,38,.12);
  border:1px solid rgba(240,165,38,.22);
  color:#ffd37a;
  font-weight:900;
  line-height:1.45;
}

.support-info-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
  margin-top:24px;
}

.support-info-card{
  padding:28px;
}

.support-info-card ul{
  display:grid;
  gap:11px;
  margin:16px 0 0;
  padding:0;
  list-style:none;
}

.support-info-card li{
  position:relative;
  padding-left:28px;
  color:rgba(247,243,236,.78);
  line-height:1.55;
}

.support-info-card li:before{
  content:'✓';
  position:absolute;
  left:0;
  top:0;
  color:#ffd37a;
  font-weight:950;
}

.support-info-card--thanks{
  background:
    radial-gradient(circle at 92% 10%,rgba(240,165,38,.14),transparent 32%),
    linear-gradient(145deg,rgba(92,64,28,.62),rgba(36,47,38,.82));
}

@media(max-width:860px){
  .support-shell,
  .support-info-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:640px){
  .support-page{
    padding:34px 0 52px;
  }

  .support-hero-card,
  .support-payment-card,
  .support-info-card{
    border-radius:28px;
  }

  .support-hero-card,
  .support-payment-card{
    padding:24px;
  }

  .support-info-card{
    padding:24px;
  }

  .support-hero-card h1{
    font-size:42px;
  }

  .support-hero-card p{
    font-size:17px;
  }
}

/* Online tuner - reference tone player */
.tuner-page{
  position:relative;
  overflow:hidden;
  min-height:calc(100vh - 72px);
  padding:64px 0 86px;
  background:
    radial-gradient(circle at 14% 0%,rgba(240,165,38,.22),transparent 34%),
    radial-gradient(circle at 90% 12%,rgba(92,151,191,.14),transparent 32%),
    linear-gradient(180deg,#171914 0%,#111613 48%,#0f1115 100%);
}

.tuner-page:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.55;
  background:
    linear-gradient(120deg,transparent 0%,rgba(255,255,255,.045) 48%,transparent 100%),
    repeating-linear-gradient(90deg,transparent 0 46px,rgba(255,255,255,.022) 47px 48px);
}

.tuner-page > .container{
  position:relative;
  z-index:1;
}

.tuner-hero-card{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:center;
  border:1px solid rgba(255,255,255,.11);
  border-radius:34px;
  padding:34px;
  margin-bottom:24px;
  color:#fff7eb;
  background:
    radial-gradient(circle at 88% 22%,rgba(245,169,36,.18),transparent 32%),
    linear-gradient(135deg,rgba(67,51,28,.95),rgba(25,34,32,.92));
  box-shadow:0 28px 80px rgba(0,0,0,.28);
}

.tuner-hero-copy h1{
  margin:10px 0 14px;
  max-width:860px;
  font-size:clamp(42px,6vw,82px);
  line-height:.95;
  letter-spacing:-.055em;
}

.tuner-hero-copy p{
  margin:0;
  max-width:760px;
  color:rgba(255,247,235,.78);
  font-size:20px;
  line-height:1.55;
}

.tuner-hero-note{
  display:grid;
  place-items:center;
  width:112px;
  height:112px;
  border-radius:32px;
  color:rgba(255,181,45,.82);
  background:rgba(255,181,45,.12);
  border:1px solid rgba(255,181,45,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}

.tuner-layout{
  display:grid;
  grid-template-columns:minmax(260px,360px) minmax(0,1fr);
  gap:24px;
  align-items:start;
}

.tuner-card{
  border:1px solid rgba(255,255,255,.11);
  border-radius:30px;
  padding:24px;
  color:#fff7eb;
  background:linear-gradient(145deg,rgba(43,48,41,.9),rgba(25,32,30,.88));
  box-shadow:0 24px 70px rgba(0,0,0,.25);
}

.tuner-side{
  display:grid;
  gap:16px;
}

.tuner-card h2{
  margin:0 0 16px;
  font-size:22px;
  line-height:1.15;
  letter-spacing:-.025em;
}

.tuner-presets{
  display:grid;
  gap:10px;
}

.tuner-presets button{
  width:100%;
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  padding:13px 15px;
  color:#fff7eb;
  background:rgba(255,255,255,.055);
  font-size:15px;
  font-weight:850;
  text-align:left;
  cursor:pointer;
  transition:background .18s ease,border-color .18s ease,transform .18s ease,color .18s ease;
}

.tuner-presets button:hover{
  transform:translateY(-1px);
  border-color:rgba(255,181,45,.36);
  background:rgba(255,181,45,.11);
}

.tuner-presets button.is-active{
  color:#15100b;
  border-color:rgba(255,181,45,.84);
  background:linear-gradient(135deg,#ffb72f,#f4a51d);
  box-shadow:0 12px 28px rgba(245,165,29,.18);
}

.tuner-help-card p{
  margin:0;
  color:rgba(255,247,235,.72);
  font-size:16px;
  line-height:1.62;
}

.tuner-main-card{
  position:relative;
  overflow:hidden;
  padding:28px;
  min-height:620px;
  background:
    radial-gradient(circle at 50% 20%,rgba(255,181,45,.14),transparent 34%),
    linear-gradient(145deg,rgba(32,41,38,.94),rgba(21,24,22,.92));
}

.tuner-main-card:before{
  content:"";
  position:absolute;
  right:-58px;
  top:-30px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(255,255,255,.04);
  pointer-events:none;
}

.tuner-card-head{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  margin-bottom:24px;
}

.tuner-card-head h2{
  margin:8px 0 0;
  font-size:clamp(30px,4vw,52px);
  line-height:1;
  letter-spacing:-.045em;
}

.tuner-stop-btn{
  flex:0 0 auto;
  border:0;
  border-radius:999px;
  padding:13px 20px;
  color:#15100b;
  background:linear-gradient(135deg,#ffb72f,#f4a51d);
  font-size:15px;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 14px 36px rgba(245,165,29,.22);
}

.tuner-head-visual{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(120px,1fr) minmax(210px,320px) minmax(120px,1fr);
  gap:22px;
  align-items:center;
  max-width:830px;
  margin:8px auto 28px;
  min-height:410px;
}

.tuner-pegs{
  display:grid;
  gap:18px;
  align-content:center;
}

.tuner-pegs-left{
  justify-items:end;
}

.tuner-pegs-right{
  justify-items:start;
}

.tuner-headstock-body{
  position:relative;
  width:100%;
  min-height:380px;
  border-radius:92px 92px 48px 48px;
  background:
    radial-gradient(circle at 50% 18%,rgba(255,181,45,.26),transparent 22%),
    linear-gradient(160deg,rgba(79,62,34,.98),rgba(22,29,27,.96));
  border:1px solid rgba(255,255,255,.13);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.1),
    0 28px 80px rgba(0,0,0,.35);
}

.tuner-headstock-body:before,
.tuner-headstock-body:after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  pointer-events:none;
}

.tuner-headstock-body:before{
  top:42px;
  width:92px;
  height:92px;
  border-radius:34px;
  background:rgba(0,0,0,.34);
  border:1px solid rgba(255,255,255,.12);
}

.tuner-headstock-body:after{
  bottom:-92px;
  width:118px;
  height:150px;
  border-radius:0 0 32px 32px;
  background:linear-gradient(180deg,rgba(48,38,24,.95),rgba(25,29,26,.96));
  border-left:1px solid rgba(255,255,255,.09);
  border-right:1px solid rgba(255,255,255,.09);
}

.tuner-head-hole{
  position:absolute;
  left:50%;
  top:150px;
  transform:translateX(-50%);
  width:120px;
  height:70px;
  border-radius:50%;
  border:7px solid rgba(255,181,45,.38);
  opacity:.7;
}

.tuner-head-neck{
  position:absolute;
  left:50%;
  bottom:42px;
  transform:translateX(-50%);
  width:148px;
  height:58px;
  border-radius:18px;
  background:rgba(0,0,0,.28);
  border:1px solid rgba(255,255,255,.1);
}

.tuner-head-line{
  position:absolute;
  top:34px;
  bottom:-74px;
  width:2px;
  background:linear-gradient(180deg,rgba(255,238,198,.86),rgba(255,238,198,.32));
  opacity:.55;
  z-index:2;
}

.tuner-head-line-1{left:39%;}
.tuner-head-line-2{left:47%;}
.tuner-head-line-3{left:53%;}
.tuner-head-line-4{left:61%;}

.tuner-head-visual.is-guitar .tuner-headstock-body{
  min-height:430px;
  border-radius:78px 78px 46px 46px;
}

.tuner-head-visual.is-guitar .tuner-headstock-body:before{
  top:36px;
}

.tuner-head-visual.is-guitar .tuner-head-line-1{left:35%;}
.tuner-head-visual.is-guitar .tuner-head-line-2{left:41%;}
.tuner-head-visual.is-guitar .tuner-head-line-3{left:47%;}
.tuner-head-visual.is-guitar .tuner-head-line-4{left:53%;}
.tuner-head-visual.is-guitar .tuner-head-line-4:after,
.tuner-head-visual.is-guitar .tuner-head-line-3:after{
  content:"";
  position:absolute;
  top:0;
  bottom:0;
  width:2px;
  background:inherit;
}
.tuner-head-visual.is-guitar .tuner-head-line-3:after{left:28px;}
.tuner-head-visual.is-guitar .tuner-head-line-4:after{left:28px;}

.tuner-peg{
  position:relative;
  display:grid;
  grid-template-columns:auto auto;
  grid-template-areas:"note play" "meta meta";
  align-items:center;
  column-gap:10px;
  row-gap:2px;
  min-width:128px;
  border:1px solid rgba(255,181,45,.35);
  border-radius:24px;
  padding:13px 15px;
  color:#fff7eb;
  background:linear-gradient(145deg,rgba(255,181,45,.14),rgba(255,255,255,.055));
  box-shadow:0 18px 40px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.08);
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,background .18s ease,color .18s ease;
}

.tuner-peg:hover{
  transform:translateY(-2px);
  border-color:rgba(255,181,45,.72);
  background:linear-gradient(145deg,rgba(255,181,45,.22),rgba(255,255,255,.08));
}

.tuner-peg.is-playing{
  color:#15100b;
  border-color:rgba(255,181,45,.92);
  background:linear-gradient(135deg,#ffbd39,#f4a51d);
  box-shadow:0 20px 52px rgba(245,165,29,.24);
}

.tuner-peg-note{
  grid-area:note;
  font-size:32px;
  line-height:1;
  font-weight:1000;
  letter-spacing:-.04em;
}

.tuner-peg-play{
  grid-area:play;
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:999px;
  color:#15100b;
  background:#ffb72f;
}

.tuner-peg.is-playing .tuner-peg-play{
  color:#ffb72f;
  background:#15100b;
}

.tuner-icon-pause{display:none;}
.tuner-peg.is-playing .tuner-icon-play{display:none;}
.tuner-peg.is-playing .tuner-icon-pause{display:block;}

.tuner-peg-meta{
  grid-area:meta;
  color:rgba(255,247,235,.66);
  font-size:13px;
  font-weight:850;
}

.tuner-peg.is-playing .tuner-peg-meta{
  color:rgba(21,16,11,.72);
}

.tuner-active-panel{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:24px;
  padding:18px;
  background:rgba(0,0,0,.2);
}

.tuner-active-panel div{
  border-radius:18px;
  padding:15px 16px;
  background:rgba(255,255,255,.055);
}

.tuner-active-panel small{
  display:block;
  margin-bottom:5px;
  color:rgba(255,247,235,.56);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.tuner-active-panel strong{
  display:block;
  color:#ffb72f;
  font-size:30px;
  line-height:1;
  font-weight:1000;
}

.tuner-active-panel p{
  grid-column:1/-1;
  margin:0;
  color:rgba(255,247,235,.75);
  font-size:16px;
  line-height:1.5;
}

@media(max-width:1040px){
  .tuner-layout{
    grid-template-columns:1fr;
  }

  .tuner-side{
    grid-template-columns:1fr 1fr;
  }

  .tuner-side .tuner-card:first-child{
    grid-column:1/-1;
  }
}

@media(max-width:760px){
  .tuner-page{
    padding:34px 0 58px;
  }

  .tuner-hero-card{
    grid-template-columns:1fr;
    padding:24px;
    border-radius:28px;
  }

  .tuner-hero-note{
    display:none;
  }

  .tuner-hero-copy h1{
    font-size:42px;
  }

  .tuner-hero-copy p{
    font-size:17px;
  }

  .tuner-card{
    padding:18px;
    border-radius:24px;
  }

  .tuner-side{
    grid-template-columns:1fr;
  }

  .tuner-main-card{
    min-height:0;
  }

  .tuner-card-head{
    display:block;
  }

  .tuner-stop-btn{
    margin-top:14px;
    width:100%;
  }

  .tuner-head-visual{
    grid-template-columns:1fr;
    gap:14px;
    min-height:0;
    margin:18px 0 22px;
  }

  .tuner-headstock-body{
    display:none;
  }

  .tuner-pegs,
  .tuner-pegs-left,
  .tuner-pegs-right{
    justify-items:stretch;
  }

  .tuner-pegs{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .tuner-head-visual.is-guitar .tuner-pegs{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }

  .tuner-peg{
    min-width:0;
    border-radius:18px;
    padding:13px;
  }

  .tuner-peg-note{
    font-size:28px;
  }

  .tuner-peg-play{
    width:30px;
    height:30px;
  }

  .tuner-active-panel{
    grid-template-columns:1fr;
  }
}

@media(max-width:430px){
  .tuner-hero-copy h1{
    font-size:36px;
  }

  .tuner-head-visual.is-guitar .tuner-pegs,
  .tuner-pegs{
    grid-template-columns:1fr 1fr;
  }

  .tuner-peg-meta{
    display:none;
  }
}

/* Patch 066: sekcia Uč sa hrať */
.learn-page{
  position:relative;
  overflow:hidden;
  min-height:calc(100vh - 72px);
  padding:70px 0 86px;
  background:
    radial-gradient(circle at 14% 0%,rgba(240,165,38,.22),transparent 34%),
    radial-gradient(circle at 90% 8%,rgba(81,164,107,.16),transparent 32%),
    linear-gradient(180deg,#181913 0%,#111613 46%,#0f1115 100%);
}

.learn-bg{
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.7;
  background:
    linear-gradient(120deg,transparent 0%,rgba(255,255,255,.05) 48%,transparent 100%),
    repeating-linear-gradient(90deg,transparent 0 46px,rgba(255,255,255,.024) 47px 48px);
}

.learn-page > .container{
  position:relative;
  z-index:1;
}

.learn-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,420px);
  gap:28px;
  align-items:stretch;
}

.learn-hero-copy,
.learn-hero-card,
.learn-step-card,
.learn-tip-card,
.learn-rhythm-card,
.learn-week-card,
.learn-cta{
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(43,48,41,.92),rgba(25,32,30,.88));
  box-shadow:0 24px 70px rgba(0,0,0,.25);
}

.learn-hero-copy{
  padding:40px;
  border-radius:34px;
}

.learn-eyebrow,
.learn-section-head span,
.learn-rhythm-card > span,
.learn-week-card > span{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:0 15px;
  margin-bottom:16px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  border:1px solid rgba(240,165,38,.28);
  color:#ffd37a;
  font-size:13px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.learn-hero-copy h1{
  max-width:840px;
  margin:0;
  color:#fff7e7;
  font-size:clamp(42px,6vw,82px);
  line-height:.96;
  letter-spacing:-.075em;
}

.learn-hero-copy p{
  max-width:760px;
  margin:22px 0 0;
  color:rgba(247,243,236,.74);
  font-size:20px;
  line-height:1.68;
}

.learn-hero-actions,
.learn-cta-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
}

.learn-btn{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 19px;
  border-radius:999px;
  font-size:15px;
  font-weight:950;
  text-decoration:none;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}

.learn-btn:hover{
  transform:translateY(-1px);
}

.learn-btn--primary{
  background:var(--orange);
  color:#1d1408;
  box-shadow:0 16px 34px rgba(240,165,38,.17);
}

.learn-btn--ghost{
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.13);
  color:#fff7e7;
}

.learn-hero-card{
  position:relative;
  overflow:hidden;
  min-height:390px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:26px;
  border-radius:34px;
  background:
    radial-gradient(circle at 75% 20%,rgba(240,165,38,.24),transparent 36%),
    linear-gradient(145deg,rgba(41,52,41,.94),rgba(23,29,30,.92));
}

.learn-ukulele-neck{
  position:absolute;
  inset:28px 28px 118px;
  overflow:hidden;
  border-radius:28px;
  background:linear-gradient(90deg,rgba(255,244,215,.11),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.10);
}

.learn-ukulele-neck i{
  position:absolute;
  top:0;
  bottom:0;
  width:2px;
  background:linear-gradient(180deg,rgba(255,246,220,.78),rgba(255,246,220,.20));
  box-shadow:0 0 12px rgba(255,246,220,.18);
}

.learn-ukulele-neck i:nth-child(1){left:20%}
.learn-ukulele-neck i:nth-child(2){left:40%}
.learn-ukulele-neck i:nth-child(3){left:60%}
.learn-ukulele-neck i:nth-child(4){left:80%}

.learn-ukulele-neck:before,
.learn-ukulele-neck:after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  height:1px;
  background:rgba(255,255,255,.15);
}

.learn-ukulele-neck:before{top:33%}
.learn-ukulele-neck:after{top:66%}

.learn-ukulele-neck span{
  position:absolute;
  left:var(--x);
  top:var(--y);
  transform:translate(-50%,-50%);
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:#f0a526;
  color:#1d1408;
  font-size:16px;
  font-weight:950;
  box-shadow:0 16px 34px rgba(240,165,38,.24);
}

.learn-hero-card strong{
  position:relative;
  z-index:1;
  color:#fff7e7;
  font-size:34px;
  line-height:1;
  letter-spacing:-.055em;
}

.learn-hero-card small{
  position:relative;
  z-index:1;
  display:block;
  margin-top:8px;
  color:rgba(247,243,236,.60);
  font-size:16px;
  font-weight:900;
  letter-spacing:.14em;
}

.learn-section{
  margin-top:28px;
}

.learn-section-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,420px);
  gap:24px;
  align-items:end;
  margin-bottom:18px;
}

.learn-section-head h2,
.learn-rhythm-card h2,
.learn-week-card h2,
.learn-cta h2{
  margin:0;
  color:#fff7e7;
  font-size:clamp(30px,4vw,52px);
  line-height:1;
  letter-spacing:-.06em;
}

.learn-section-head p,
.learn-rhythm-card p,
.learn-cta p{
  margin:0;
  color:rgba(247,243,236,.70);
  font-size:17px;
  line-height:1.6;
}

.learn-path-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.learn-step-card{
  min-height:290px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:22px;
  border-radius:28px;
  color:#fff7e7;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.learn-step-card:hover{
  transform:translateY(-3px);
  border-color:rgba(240,165,38,.34);
  background:linear-gradient(145deg,rgba(58,63,49,.95),rgba(27,35,31,.92));
}

.learn-step-card em{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin-bottom:20px;
  border-radius:18px;
  background:rgba(240,165,38,.15);
  color:#ffd37a;
  font-style:normal;
  font-weight:950;
}

.learn-step-card h3,
.learn-tip-card h3{
  margin:0 0 10px;
  color:#fff7e7;
  font-size:24px;
  line-height:1.06;
  letter-spacing:-.045em;
}

.learn-step-card p,
.learn-tip-card p{
  margin:0;
  color:rgba(247,243,236,.68);
  font-size:15px;
  line-height:1.55;
}

.learn-step-card strong{
  margin-top:auto;
  padding-top:20px;
  color:#ffd37a;
  font-size:14px;
  font-weight:950;
}


/* Patch 067: blok prvej pesničky */
.learn-first-song{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(280px,.92fr);
  gap:18px;
  align-items:stretch;
  margin-top:28px;
}

.learn-first-song-copy,
.learn-first-song-play{
  border:1px solid rgba(255,255,255,.11);
  background:linear-gradient(145deg,rgba(43,48,41,.92),rgba(25,32,30,.88));
  box-shadow:0 24px 70px rgba(0,0,0,.25);
  border-radius:32px;
  padding:30px;
}

.learn-first-song-copy{
  background:
    radial-gradient(circle at 0% 0%,rgba(240,165,38,.21),transparent 34%),
    linear-gradient(145deg,rgba(66,53,32,.82),rgba(29,42,35,.88));
}

.learn-first-song-copy span,
.learn-first-song-play small{
  display:inline-flex;
  align-items:center;
  min-height:31px;
  padding:0 12px;
  margin-bottom:16px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  border:1px solid rgba(240,165,38,.24);
  color:#ffd37a;
  font-size:12px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.learn-first-song-copy h2{
  margin:0;
  color:#fff7e7;
  font-size:clamp(32px,4vw,56px);
  line-height:1;
  letter-spacing:-.06em;
}

.learn-first-song-copy p,
.learn-first-song-play p{
  margin:16px 0 0;
  color:rgba(247,243,236,.72);
  font-size:17px;
  line-height:1.62;
}

.learn-first-song-copy .learn-btn{
  margin-top:24px;
}

.learn-first-song-play{
  display:grid;
  gap:14px;
  background:
    radial-gradient(circle at 95% 0%,rgba(81,164,107,.18),transparent 36%),
    linear-gradient(145deg,rgba(42,52,43,.92),rgba(22,29,29,.88));
}

.learn-first-song-chords,
.learn-first-song-rhythm{
  padding:18px;
  border-radius:24px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.08);
}

.learn-first-song-chords{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
}

.learn-first-song-chords small,
.learn-first-song-rhythm small{
  margin:0 4px 0 0;
}

.learn-first-song-chords strong{
  min-width:68px;
  min-height:58px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:#f0a526;
  color:#1d1408;
  font-size:28px;
  font-weight:950;
  box-shadow:0 16px 34px rgba(240,165,38,.20);
}

.learn-first-song-rhythm b{
  display:block;
  margin-top:13px;
  color:#fff0c8;
  font-size:clamp(30px,4vw,52px);
  line-height:1;
  font-weight:950;
  letter-spacing:.08em;
  white-space:nowrap;
}

.learn-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.learn-tip-card{
  min-height:218px;
  padding:22px;
  border-radius:28px;
}

.learn-tip-card span{
  display:inline-flex;
  min-height:31px;
  align-items:center;
  padding:0 12px;
  margin-bottom:16px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:#ffd37a;
  font-size:12px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.learn-bottom-grid{
  display:grid;
  grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr);
  gap:18px;
  margin-top:28px;
}

.learn-rhythm-card,
.learn-week-card{
  padding:30px;
  border-radius:32px;
}

.learn-rhythm-card{
  background:
    radial-gradient(circle at 90% 8%,rgba(240,165,38,.18),transparent 34%),
    linear-gradient(145deg,rgba(48,50,40,.92),rgba(27,34,31,.88));
}

.learn-rhythm-pattern{
  margin:24px 0 14px;
  padding:22px;
  border-radius:24px;
  background:rgba(240,165,38,.14);
  border:1px solid rgba(240,165,38,.25);
  color:#fff0c8;
  font-size:clamp(23px,3vw,38px);
  line-height:1.18;
  font-weight:950;
  letter-spacing:-.05em;
}

.learn-rhythm-card small{
  display:block;
  color:rgba(247,243,236,.64);
  line-height:1.55;
}

.learn-week-card ol{
  display:grid;
  gap:9px;
  margin:22px 0 0;
  padding:0;
  list-style:none;
  counter-reset:learn-days;
}

.learn-week-card li{
  counter-increment:learn-days;
  position:relative;
  min-height:42px;
  display:flex;
  align-items:center;
  padding:10px 12px 10px 46px;
  border-radius:16px;
  background:rgba(255,255,255,.055);
  color:rgba(247,243,236,.78);
  line-height:1.35;
}

.learn-week-card li:before{
  content:counter(learn-days);
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:rgba(240,165,38,.18);
  color:#ffd37a;
  font-size:12px;
  font-weight:950;
}

.learn-cta{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:center;
  margin-top:28px;
  padding:30px;
  border-radius:32px;
  background:
    radial-gradient(circle at 4% 0%,rgba(240,165,38,.21),transparent 34%),
    linear-gradient(145deg,rgba(66,53,32,.82),rgba(29,42,35,.88));
}

.learn-cta p{
  margin-top:12px;
  max-width:720px;
}

@media(max-width:1040px){
  .learn-hero,
  .learn-section-head,
  .learn-bottom-grid,
  .learn-cta,
  .learn-first-song{
    grid-template-columns:1fr;
  }

  .learn-path-grid,
  .learn-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .learn-hero-card{
    min-height:330px;
  }
}

@media(max-width:640px){
  .learn-page{
    padding:34px 0 56px;
  }

  .learn-hero-copy,
  .learn-hero-card,
  .learn-rhythm-card,
  .learn-week-card,
  .learn-cta{
    border-radius:28px;
  }

  .learn-hero-copy,
  .learn-rhythm-card,
  .learn-week-card,
  .learn-cta{
    padding:24px;
  }

  .learn-hero-copy h1{
    font-size:42px;
  }

  .learn-hero-copy p{
    font-size:17px;
  }

  .learn-hero-actions,
  .learn-cta-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .learn-btn{
    width:100%;
  }

  .learn-hero-card{
    min-height:285px;
    padding:22px;
  }

  .learn-ukulele-neck{
    inset:22px 22px 96px;
    border-radius:24px;
  }

  .learn-ukulele-neck span{
    width:42px;
    height:42px;
    border-radius:15px;
    font-size:14px;
  }

  .learn-hero-card strong{
    font-size:28px;
  }

  .learn-path-grid,
  .learn-card-grid{
    grid-template-columns:1fr;
  }

  .learn-step-card,
  .learn-tip-card{
    min-height:auto;
    padding:20px;
    border-radius:24px;
  }

  .learn-section-head{
    gap:10px;
  }

  .learn-section-head p{
    font-size:16px;
  }

  .learn-rhythm-pattern{
    padding:18px;
    font-size:26px;
  }

  .learn-first-song{
    gap:14px;
  }

  .learn-first-song-copy,
  .learn-first-song-play{
    padding:24px;
    border-radius:28px;
  }

  .learn-first-song-copy p,
  .learn-first-song-play p{
    font-size:16px;
  }

  .learn-first-song-chords strong{
    min-width:58px;
    min-height:52px;
    border-radius:18px;
    font-size:25px;
  }

  .learn-first-song-rhythm b{
    font-size:34px;
    letter-spacing:.04em;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }
}

/* Patch 069: finálne doladenie sekcie Uč sa hrať */
.learn-section[id],
.learn-bottom-grid[id]{
  scroll-margin-top:118px;
}

.learn-eyebrow{
  gap:9px;
}

.learn-eyebrow i{
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

.learn-eyebrow svg{
  width:18px;
  height:18px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.learn-first-song-chords{
  display:block;
}

.learn-first-song-chords > small{
  margin:0 0 14px;
}

.learn-first-song-diagrams{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,132px));
  gap:12px;
  align-items:start;
}

.learn-first-song-card{
  width:100%;
  max-width:132px;
  background:transparent;
  box-shadow:none;
}

.learn-first-song-card:hover{
  transform:none;
  box-shadow:none;
}

.learn-first-song-card .ua-chord-svg,
.learn-first-song-card img{
  width:100%;
  height:auto;
  display:block;
}

@media(max-width:640px){
  .learn-section[id],
  .learn-bottom-grid[id]{
    scroll-margin-top:96px;
  }

  .learn-first-song-diagrams{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .learn-first-song-card{
    max-width:none;
  }
}

/* Patch 070: postupnejší kurz Uč sa hrať */
.learn-section[id],
.learn-first-song[id],
.learn-bottom-grid[id]{
  scroll-margin-top:118px;
}

.learn-first-song-lyrics{
  padding:18px;
  border-radius:24px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.08);
}

.learn-first-song-lyrics > small{
  margin:0 0 14px;
}

.learn-song-lines{
  display:grid;
  gap:8px;
}

.learn-song-line{
  display:grid;
  grid-template-columns:76px minmax(0,1fr);
  gap:12px;
  align-items:center;
  min-height:42px;
  padding:9px 12px;
  border-radius:16px;
  background:rgba(15,17,21,.24);
  border:1px solid rgba(255,255,255,.065);
}

.learn-song-line span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:0 9px;
  border-radius:999px;
  background:rgba(240,165,38,.18);
  color:#ffd37a;
  font-size:13px;
  font-weight:950;
  white-space:nowrap;
}

.learn-song-line strong{
  color:#fff7e7;
  font-size:17px;
  line-height:1.25;
  font-weight:900;
}

.learn-week-congrats{
  margin-top:16px;
  padding:18px;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(240,165,38,.24),rgba(81,164,107,.14));
  border:1px solid rgba(240,165,38,.30);
  box-shadow:0 18px 40px rgba(0,0,0,.14);
}

.learn-week-congrats strong{
  display:block;
  color:#fff0c8;
  font-size:22px;
  line-height:1.08;
  letter-spacing:-.04em;
}

.learn-week-congrats p{
  margin:8px 0 0;
  color:rgba(247,243,236,.76);
  font-size:15px;
  line-height:1.5;
}

@media(max-width:640px){
  .learn-section[id],
  .learn-first-song[id],
  .learn-bottom-grid[id]{
    scroll-margin-top:96px;
  }

  .learn-song-line{
    grid-template-columns:1fr;
    gap:5px;
  }

  .learn-song-line span{
    justify-content:flex-start;
    width:max-content;
  }

  .learn-song-line strong{
    font-size:16px;
  }
}

/* Patch 071: postupný kurz C · Am · F · G */
.learn-week-wrap{
  margin-top:28px;
}

.learn-week-wrap .learn-week-card{
  border-radius:32px;
}

.learn-progression-card{
  background:
    radial-gradient(circle at 92% 10%,rgba(81,164,107,.20),transparent 34%),
    linear-gradient(145deg,rgba(41,55,45,.92),rgba(24,33,31,.88));
}

.learn-progression-card .learn-rhythm-pattern{
  background:rgba(81,164,107,.14);
  border-color:rgba(81,164,107,.24);
}

@media(max-width:640px){
  .learn-week-wrap{
    margin-top:18px;
  }
}

/* Patch 072: odporúčané známe pesničky a záverečná gratulácia */
.learn-song-picks{
  margin-top:28px;
}

.learn-song-pick-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.learn-song-pick-card{
  min-height:260px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:24px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 90% 0%,rgba(240,165,38,.15),transparent 34%),
    linear-gradient(145deg,rgba(43,48,41,.92),rgba(25,32,30,.88));
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}

.learn-song-pick-card > span{
  display:inline-flex;
  align-items:center;
  min-height:31px;
  padding:0 12px;
  margin-bottom:16px;
  border-radius:999px;
  background:rgba(255,255,255,.07);
  color:#ffd37a;
  font-size:12px;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.learn-song-pick-card h3{
  margin:0;
  color:#fff7e7;
  font-size:clamp(25px,3vw,36px);
  line-height:1;
  letter-spacing:-.055em;
}

.learn-song-pick-card strong{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  margin-top:16px;
  padding:0 13px;
  border-radius:999px;
  background:rgba(240,165,38,.17);
  border:1px solid rgba(240,165,38,.24);
  color:#fff0c8;
  font-size:15px;
  font-weight:950;
  white-space:nowrap;
}

.learn-song-pick-card p{
  margin:16px 0 0;
  color:rgba(247,243,236,.70);
  font-size:15px;
  line-height:1.55;
}

.learn-song-pick-card a{
  margin-top:auto;
  padding-top:20px;
  color:#ffd37a;
  font-size:14px;
  font-weight:950;
  text-decoration:none;
}

.learn-congrats-wrap{
  margin-top:18px;
}

.learn-congrats-card{
  display:block;
  margin:0;
  padding:26px 30px;
  border-radius:32px;
}

.learn-congrats-card strong{
  font-size:clamp(28px,4vw,46px);
}

.learn-congrats-card p{
  max-width:920px;
  font-size:17px;
}

@media(max-width:1040px){
  .learn-song-pick-grid{
    grid-template-columns:1fr;
  }

  .learn-song-pick-card{
    min-height:auto;
  }
}

@media(max-width:640px){
  .learn-song-picks{
    margin-top:20px;
  }

  .learn-song-pick-card{
    padding:22px;
    border-radius:24px;
  }

  .learn-song-pick-card strong{
    white-space:normal;
  }

  .learn-congrats-card{
    padding:22px;
    border-radius:26px;
  }

  .learn-congrats-card p{
    font-size:15px;
  }
}

/* Patch 073 - learn page progression placeholder */
.learn-song-picks-empty {
  background: rgba(255,255,255,.78);
  border: 1px dashed rgba(92,61,34,.24);
  border-radius: 24px;
  padding: 22px;
  box-shadow: 0 16px 40px rgba(68,42,18,.07);
}
.learn-song-picks-empty strong {
  display: block;
  color: var(--brown, #5c3d22);
  font-size: 18px;
  margin-bottom: 8px;
}
.learn-song-picks-empty p {
  margin: 0;
  max-width: 760px;
  color: rgba(92,61,34,.72);
  line-height: 1.65;
}

/* Patch 081: pridanie pesničky */
.song-submit-page{
  padding:74px 0 90px;
}

.song-submit-layout{
  display:grid;
  grid-template-columns:minmax(260px,420px) minmax(0,1fr);
  gap:30px;
  align-items:start;
}

.song-submit-info{
  position:sticky;
  top:100px;
}

.song-submit-info h1{
  margin:10px 0 16px;
  max-width:520px;
  color:var(--cream);
  font-size:clamp(36px,5vw,64px);
  line-height:.94;
  letter-spacing:-.06em;
}

.song-submit-info p{
  color:var(--muted);
  font-size:17px;
  line-height:1.65;
}

.song-submit-guide,
.song-submit-card{
  border:1px solid var(--line);
  border-radius:30px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:var(--shadow);
}

.song-submit-guide{
  margin-top:24px;
  padding:22px;
}

.song-submit-guide h2{
  margin:0 0 10px;
  color:var(--cream);
  font-size:20px;
  letter-spacing:-.02em;
}

.song-submit-guide code{
  display:block;
  margin:14px 0;
  padding:14px;
  border:1px solid rgba(240,165,38,.24);
  border-radius:18px;
  background:rgba(240,165,38,.1);
  color:#ffd796;
  white-space:normal;
  line-height:1.5;
}

.song-submit-guide ul{
  margin:14px 0 0;
  padding-left:18px;
  color:var(--muted);
  line-height:1.7;
}

.song-submit-card{
  padding:28px;
  min-width:0;
}

.form-three-cols{
  display:grid;
  grid-template-columns:1fr 1fr 1.4fr;
  gap:12px;
}

.song-chord-toolbar{
  display:grid;
  gap:10px;
  margin:2px 0 4px;
  padding:14px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:20px;
  background:rgba(255,255,255,.035);
}

.song-chord-toolbar span{
  color:var(--cream);
  font-size:13px;
  font-weight:900;
}

.song-chord-toolbar div{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.song-chord-toolbar button{
  border:1px solid rgba(240,165,38,.25);
  border-radius:999px;
  background:rgba(240,165,38,.1);
  color:#ffd796;
  padding:7px 10px;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}

.song-chord-toolbar button:hover{
  background:rgba(240,165,38,.18);
}

.song-submit-form textarea{
  min-height:360px;
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  line-height:1.55;
}

.song-submit-preview-wrap{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:22px;
  background:rgba(8,22,21,.42);
}

.song-submit-preview-head{
  padding:13px 16px;
  border-bottom:1px solid rgba(255,255,255,.08);
  color:var(--cream);
}

.song-submit-preview{
  max-height:340px;
  overflow:auto;
  padding:16px;
  min-width:0;
}

.song-submit-note{
  display:grid;
  gap:4px;
  padding:14px 16px;
  border:1px solid rgba(51,164,126,.22);
  border-radius:20px;
  background:rgba(51,164,126,.08);
  color:var(--muted);
  line-height:1.55;
}

.song-submit-note strong{
  color:var(--cream);
}

.song-submit-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.song-submit-actions .btn{
  justify-content:center;
}

.song-submit-actions--edit .btn{
  flex:1 1 220px;
}

@media (max-width: 980px){
  .song-submit-layout{
    grid-template-columns:1fr;
  }

  .song-submit-info{
    position:static;
  }

  .form-three-cols{
    grid-template-columns:1fr;
  }
}

@media (max-width: 680px){
  .song-submit-page{
    padding:44px 0 66px;
  }

  .song-submit-card,
  .song-submit-guide{
    border-radius:24px;
    padding:20px;
  }

  .song-submit-main-fields,
  .song-submit-small-fields{
    grid-template-columns:1fr;
  }

  .song-submit-form textarea{
    min-height:300px;
  }

  .song-submit-actions{
    display:grid;
  }

  .song-submit-actions .btn{
    width:100%;
  }
}

.my-song-status{
  display:inline-flex;
  width:max-content;
  margin-top:7px;
  border-radius:999px;
  padding:4px 9px;
  background:rgba(255,255,255,.08);
  color:var(--muted);
  font-style:normal;
  font-size:11px;
  font-weight:900;
}

.my-song-status--pending{
  background:rgba(240,165,38,.13);
  color:#ffd796;
}

.my-song-status--published{
  background:rgba(51,164,126,.14);
  color:#bdf1db;
}

.my-song-status--private{
  background:rgba(255,255,255,.08);
  color:var(--muted);
}

/* Patch 082: pridanie pesničky - verejné publikovanie, žáner, akordový select a konverzia */
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.song-submit-meta-fields--simple{
  grid-template-columns:minmax(160px,.7fr) minmax(0,1.3fr);
}

.song-chord-picker{
  display:grid;
  gap:10px;
  margin:2px 0 4px;
  padding:14px;
  border:1px solid rgba(51,164,126,.2);
  border-radius:20px;
  background:rgba(51,164,126,.07);
}

.song-chord-picker strong{
  color:var(--cream);
  font-size:13px;
  font-weight:900;
}

.song-chord-picker-row{
  display:grid;
  grid-template-columns:minmax(84px,.75fr) minmax(100px,1fr) auto;
  gap:8px;
  align-items:center;
}

.song-chord-picker-row select,
.song-submit-meta-fields--simple select{
  min-height:44px;
}

.song-chord-picker-row .btn{
  min-height:44px;
  justify-content:center;
  white-space:nowrap;
}

.song-convert-box{
  display:flex;
  gap:14px;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  border:1px solid rgba(240,165,38,.2);
  border-radius:20px;
  background:rgba(240,165,38,.08);
  color:var(--muted);
}

.song-convert-box div{
  display:grid;
  gap:3px;
}

.song-convert-box strong{
  color:var(--cream);
  font-size:14px;
}

.song-convert-box span{
  font-size:13px;
  line-height:1.45;
}

.song-submit-actions--single .btn{
  min-width:220px;
}

@media (max-width: 680px){
  .song-submit-meta-fields--simple,
  .song-chord-picker-row{
    grid-template-columns:1fr;
  }

  .song-convert-box{
    display:grid;
  }

  .song-convert-box .btn,
  .song-submit-actions--single .btn{
    width:100%;
  }
}

/* Patch 083: pridať/upraviť pesničku - uhladený formulár a kontrola výsledku */
.song-submit-form{
  gap:18px;
}

.song-submit-form .form-two-cols{
  gap:16px;
}

.song-submit-form .form-two-cols > div,
.song-submit-form .song-submit-main-fields > div,
.song-submit-form .song-submit-meta-fields > div{
  display:grid;
  gap:9px;
  min-width:0;
}

.song-submit-form label:not(.sr-only){
  display:block;
  margin:0 0 8px;
  color:var(--cream);
  font-size:14px;
  font-weight:900;
  letter-spacing:.01em;
}

.song-submit-form input,
.song-submit-form select,
.song-submit-form textarea{
  width:100%;
  color:var(--cream);
  background-color:rgba(255,255,255,.075);
  border-color:rgba(255,255,255,.12);
}

.song-submit-form input::placeholder,
.song-submit-form textarea::placeholder{
  color:rgba(246,238,220,.52);
}

.song-submit-form select{
  appearance:none;
  -webkit-appearance:none;
  padding-right:44px;
  background-image:
    linear-gradient(45deg, transparent 50%, rgba(246,238,220,.78) 50%),
    linear-gradient(135deg, rgba(246,238,220,.78) 50%, transparent 50%);
  background-position:
    calc(100% - 22px) 50%,
    calc(100% - 15px) 50%;
  background-size:7px 7px,7px 7px;
  background-repeat:no-repeat;
}

.song-submit-form select option{
  color:#1d1711;
  background:#fff8ec;
}

.song-chord-picker{
  gap:14px;
  padding:18px;
}

.song-chord-picker strong,
.song-chord-toolbar span{
  font-size:14px;
}

.song-chord-picker-row{
  grid-template-columns:minmax(96px,.8fr) minmax(130px,1fr) auto;
  gap:12px;
}

.song-chord-picker-row select,
.song-submit-meta-fields--simple select{
  color:var(--cream);
}

.song-chord-picker-row .btn{
  padding-inline:22px;
}

.song-chord-toolbar{
  gap:10px;
  padding:18px;
}

.song-chord-toolbar div{
  gap:9px;
}

.song-chord-toolbar button{
  min-width:58px;
  padding:9px 12px;
  border-color:rgba(240,165,38,.34);
  background:rgba(240,165,38,.12);
  color:#ffd796;
  font-size:13px;
}

.song-submit-preview-wrap{
  display:none!important;
}

.song-submit-actions--single{
  align-items:stretch;
}

.song-submit-actions--single .btn{
  min-width:220px;
}

.song-check-open{
  overflow:hidden;
}

.song-check-modal[hidden]{
  display:none!important;
}

.song-check-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:grid;
  place-items:center;
  padding:24px;
}

.song-check-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,8,10,.76);
  backdrop-filter:blur(10px);
}

.song-check-modal__dialog{
  position:relative;
  width:min(980px,100%);
  max-height:min(86vh,920px);
  overflow:auto;
  border:1px solid rgba(255,255,255,.14);
  border-radius:32px;
  background:linear-gradient(180deg,rgba(27,34,36,.98),rgba(16,24,24,.98));
  box-shadow:0 35px 110px rgba(0,0,0,.45);
  padding:28px;
}

.song-check-modal__dialog h2{
  margin:8px 52px 20px 0;
  color:var(--cream);
  font-size:clamp(28px,4vw,46px);
  line-height:1;
  letter-spacing:-.05em;
}

.song-check-modal__close{
  position:absolute;
  top:18px;
  right:18px;
  width:44px;
  height:44px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
  background:rgba(255,255,255,.07);
  color:var(--cream);
  font-size:30px;
  line-height:1;
  cursor:pointer;
}

.song-check-summary{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-bottom:16px;
}

.song-check-summary > div{
  display:grid;
  gap:6px;
  min-width:0;
  border:1px solid rgba(255,255,255,.1);
  border-radius:20px;
  background:rgba(255,255,255,.055);
  padding:14px;
}

.song-check-summary span,
.song-check-video > strong,
.song-check-render-title{
  display:block;
  color:rgba(246,238,220,.62);
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.song-check-summary strong{
  color:var(--cream);
  font-size:15px;
  line-height:1.35;
  overflow-wrap:anywhere;
}

.song-check-summary i{
  display:inline-flex;
  margin:2px 4px 2px 0;
  border-radius:999px;
  padding:4px 8px;
  background:rgba(240,165,38,.14);
  color:#ffd796;
  font-style:normal;
  font-size:12px;
  font-weight:900;
}

.song-check-video{
  margin-bottom:16px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;
  background:rgba(255,255,255,.04);
  padding:16px;
}

.song-check-video p{
  margin:0;
  color:var(--muted);
}

.song-check-video-frame{
  width:100%;
  margin-top:12px;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:18px;
  background:#000;
}

.song-check-video-frame iframe{
  display:block;
  width:100%;
  height:100%;
}

.song-check-render{
  min-width:0;
  overflow:auto;
  max-height:420px;
  border:1px solid rgba(255,255,255,.1);
  border-radius:22px;
  background:rgba(8,22,21,.48);
  padding:16px;
}

.song-check-render-title{
  margin-bottom:14px;
}

.song-check-render .song-line-pair{
  min-width:max-content;
}

@media (max-width: 780px){
  .song-check-summary{
    grid-template-columns:1fr;
  }
}

@media (max-width: 680px){
  .song-submit-form{
    gap:16px;
  }

  .song-submit-form .form-two-cols{
    grid-template-columns:1fr;
  }

  .song-chord-picker-row{
    grid-template-columns:1fr;
  }

  .song-chord-toolbar button{
    min-width:52px;
    flex:1 1 56px;
  }

  .song-submit-actions--single{
    display:grid;
  }

  .song-submit-actions--single .btn{
    width:100%;
    min-width:0;
  }

  .song-check-modal{
    padding:12px;
  }

  .song-check-modal__dialog{
    max-height:88vh;
    border-radius:24px;
    padding:22px;
  }
}

/* Patch 084: pridanie pesničky - povinné polia, žánre, autocomplete interpretov a presnejší náhľad */
.song-submit-form label:not(.sr-only){
  margin:0 0 4px;
  transform:translateY(2px);
}

.song-submit-form .form-two-cols > div,
.song-submit-form .song-submit-main-fields > div,
.song-submit-form .song-submit-meta-fields > div{
  gap:6px;
}

.required-star{
  color:#f0a526;
  font-weight:950;
}

.song-submit-form select option,
.song-submit-form select optgroup{
  color:#1d1711!important;
  background:#fff8ec!important;
}

.song-submit-form select option[disabled],
.song-submit-form select option[value=""]{
  color:#7f7667!important;
}

.song-artist-autocomplete{
  position:relative;
  min-width:0;
}

.song-artist-autocomplete input{
  position:relative;
  z-index:2;
}

.song-artist-suggestions{
  position:absolute;
  z-index:30;
  top:calc(100% + 8px);
  left:0;
  right:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:#fff8ec;
  box-shadow:0 18px 44px rgba(0,0,0,.32);
}

.song-artist-suggestions[hidden]{
  display:none!important;
}

.song-artist-suggestions button{
  display:block;
  width:100%;
  border:0;
  border-bottom:1px solid rgba(33,23,10,.08);
  padding:11px 14px;
  background:transparent;
  color:#21170a;
  text-align:left;
  font-size:15px;
  font-weight:850;
  cursor:pointer;
}

.song-artist-suggestions button:last-child{
  border-bottom:0;
}

.song-artist-suggestions button:hover,
.song-artist-suggestions button:focus{
  background:#f0a526;
  color:#21170a;
}

.song-check-render.song-text--detail{
  font-size:22px;
  line-height:1.25;
}

.song-check-render.song-text--detail .song-check-render-title{
  font-size:12px;
  line-height:1.2;
}

.song-check-render.song-text--detail .song-line-pair{
  margin:0 0 .18em;
}

.song-check-render.song-text--detail .song-chord-row{
  color:#f0a526;
  font-size:.72em;
  line-height:1.04;
  font-weight:950;
  letter-spacing:.01em;
  white-space:pre;
}

.song-check-render.song-text--detail .song-lyric-row{
  color:#fff7e7;
  line-height:1.22;
  white-space:pre;
}

@media (max-width: 680px){
  .song-artist-suggestions{
    top:calc(100% + 6px);
    border-radius:16px;
  }

  .song-check-render.song-text--detail{
    font-size:18px;
  }
}

/* Patch 085: presné umiestnenie akordov nad slabiku podľa zápisu [C]text */
.song-text--detail .song-line{
  display:block;
  width:max-content;
  min-width:100%;
  white-space:pre;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

.song-text--detail .song-line--plain{
  min-height:1.28em;
  margin:0 0 .08em;
  line-height:1.28;
  color:#fff7e7;
}

.song-text--detail .song-line--empty{
  min-height:1.15em;
  line-height:1.15;
}

.song-text--detail .song-line--chorded{
  position:relative;
  min-height:2.22em;
  margin:0 0 .16em;
  padding-top:1.04em;
  line-height:1.22;
}

.song-text--detail .song-chords-layer{
  position:absolute;
  top:0;
  left:0;
  display:block;
  width:100%;
  height:1.04em;
  font-size:inherit;
  line-height:1;
  white-space:pre;
  pointer-events:none;
}

.song-text--detail .song-chord-token{
  position:absolute;
  top:0;
  left:calc(var(--chord-pos) * 1ch);
  display:block;
  font-size:inherit;
  line-height:1;
  white-space:nowrap;
}

.song-text--detail .song-chord-token > span{
  display:block;
  color:#f0a526;
  font-size:.72em;
  font-weight:950;
  line-height:1.05;
  letter-spacing:.01em;
}

.song-text--detail .song-lyrics-layer{
  display:block;
  color:#fff7e7;
  line-height:1.22;
  white-space:pre;
}

.song-check-render.song-text--detail .song-line{
  min-width:max-content;
}

@media (max-width:760px){
  .song-text--detail .song-line--chorded{
    min-height:2.12em;
    padding-top:1em;
  }

  .song-text--detail .song-chord-token > span{
    font-size:.70em;
  }
}

/* Patch 087: akordový riadok bez textu, napr. [Db][Dbm][G] */
.song-text--detail .song-line--chords-only{
  width:max-content;
  min-width:max(100%, calc(var(--song-line-chars, 1) * 1ch));
  min-height:1.36em;
  padding-top:0;
  margin-bottom:.28em;
}

.song-text--detail .song-line--chords-only .song-chords-layer{
  position:relative;
  top:auto;
  left:auto;
  display:block;
  width:calc(var(--song-line-chars, 1) * 1ch);
  height:1.12em;
}

.song-text--detail .song-line--chords-only .song-lyrics-layer{
  display:block;
  height:0;
  overflow:hidden;
  visibility:hidden;
}

/* Patch 091: účet a spevník - malé fotky interpretov pri zoznamoch piesní */
.account-song-row-main{
  min-width:0;
  display:grid;
  grid-template-columns:44px minmax(0,1fr);
  gap:12px;
  align-items:center;
}

.account-song-thumb{
  width:44px;
  height:44px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}

.account-song-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.my-song-row--with-photo{
  padding:8px 10px;
}

.my-song-row--with-photo .my-song-main strong{
  font-size:15px;
  line-height:1.2;
}

.my-song-row--with-photo .my-song-main > span{
  margin-top:2px;
  font-size:12px;
}

.my-song-row--with-photo .mini-chords{
  margin-top:5px;
  gap:4px;
}

.my-song-row--with-photo .mini-chords i{
  font-size:11px;
  padding:3px 7px;
}

@media (max-width:680px){
  .account-song-row-main{
    grid-template-columns:40px minmax(0,1fr);
    gap:10px;
  }

  .account-song-thumb{
    width:40px;
    height:40px;
    border-radius:13px;
  }
}

/* Patch 093 - samostatné vyhľadávanie */
.search-page{
  position:relative;
}
.search-hero-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,430px);
  gap:24px;
  align-items:end;
  padding:28px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:28px;
  background:linear-gradient(135deg, rgba(255,255,255,.08), rgba(255,255,255,.035));
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}
.search-hero-panel h1{
  margin:8px 0 10px;
  font-size:clamp(32px,5vw,58px);
  line-height:.96;
}
.search-hero-panel p{
  margin:0;
  max-width:720px;
  color:rgba(255,250,238,.72);
  line-height:1.7;
}
.search-page-form{
  display:flex;
  gap:10px;
  padding:8px;
  border-radius:999px;
  background:rgba(0,0,0,.24);
  border:1px solid rgba(255,255,255,.12);
}
.search-page-form input{
  min-width:0;
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  color:#fffaf0;
  padding:12px 14px;
  font:inherit;
}
.search-page-form input::placeholder{
  color:rgba(255,250,238,.45);
}
.search-page-form button{
  border:0;
  border-radius:999px;
  padding:12px 18px;
  background:#f5b75d;
  color:#20170e;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
}
.search-query-note{
  display:inline-flex;
  gap:10px;
  align-items:center;
  margin:18px 0 0;
  padding:9px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
  color:rgba(255,250,238,.68);
}
.search-query-note strong{
  color:#fffaf0;
}
.search-results-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,360px);
  gap:22px;
  margin-top:22px;
  align-items:start;
}
.search-results-section,
.search-empty-panel{
  border:1px solid rgba(255,255,255,.10);
  border-radius:26px;
  background:rgba(255,255,255,.055);
  box-shadow:0 18px 50px rgba(0,0,0,.18);
}
.search-results-section{
  padding:18px;
}
.search-results-head{
  display:flex;
  gap:14px;
  justify-content:space-between;
  align-items:center;
  margin-bottom:14px;
}
.search-results-head h2{
  margin:0;
  font-size:22px;
}
.search-results-head span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(245,183,93,.13);
  color:#f5d6a7;
  font-weight:800;
  font-size:13px;
  white-space:nowrap;
}
.search-song-list .songs-directory-row{
  background:rgba(0,0,0,.16);
}
.search-artist-list{
  display:grid;
  gap:10px;
}
.search-artist-row{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:12px;
  align-items:center;
  padding:10px;
  border-radius:18px;
  background:rgba(0,0,0,.16);
  border:1px solid rgba(255,255,255,.075);
}
.search-artist-photo{
  width:42px;
  height:42px;
  border-radius:14px;
  overflow:hidden;
  background:rgba(255,255,255,.07);
}
.search-artist-photo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.search-artist-row h3{
  margin:0 0 3px;
  font-size:15px;
}
.search-artist-row h3 a{
  color:#fffaf0;
  text-decoration:none;
}
.search-artist-row p{
  margin:0;
  color:rgba(255,250,238,.58);
  font-size:13px;
}
.search-artist-open{
  grid-column:1 / -1;
  justify-self:start;
  color:#f5d6a7;
  text-decoration:none;
  font-weight:800;
  font-size:13px;
}
.search-empty-panel{
  margin-top:22px;
  padding:28px;
}
.search-empty-panel h2{
  margin:0 0 8px;
}
.search-empty-panel p,
.search-mini-empty{
  color:rgba(255,250,238,.68);
  line-height:1.65;
}
.search-mini-empty{
  padding:14px;
  border-radius:16px;
  background:rgba(0,0,0,.14);
}
@media (max-width:860px){
  .search-hero-panel,
  .search-results-grid{
    grid-template-columns:1fr;
  }
  .search-hero-panel{
    padding:20px;
    border-radius:24px;
  }
  .search-page-form{
    border-radius:22px;
    flex-direction:column;
  }
  .search-page-form button{
    width:100%;
  }
  .search-results-section{
    padding:14px;
    border-radius:22px;
  }
}

/* Patch 098: song contributor + public user songs */
.song-side-card--contributor{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.song-contributor-label{
  display:block;
  color:rgba(247,243,236,.62);
  font-size:13px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.song-contributor-person{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  color:#fff7e7;
}

.song-contributor-person img{
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:15px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.08);
}

.song-contributor-person strong{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:17px;
}

.song-side-card--contributor p{
  margin:0;
  color:rgba(247,243,236,.68);
  line-height:1.5;
}

.song-contributor-link{
  color:#ffd37a;
  font-weight:900;
}

.song-related-thumb{
  width:52px;
  height:52px;
  flex:0 0 52px;
  border-radius:16px;
  object-fit:cover;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
}

.song-related-copy{
  min-width:0;
  flex:1 1 auto;
}

.user-songs-page{
  position:relative;
  background:
    radial-gradient(circle at top left, rgba(240,165,38,.14), transparent 32%),
    linear-gradient(180deg, #10130f 0%, #151a14 100%);
}

.user-songs-hero,
.user-songs-list-card{
  border:1px solid rgba(255,255,255,.10);
  border-radius:34px;
  background:linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  box-shadow:0 28px 90px rgba(0,0,0,.28);
}

.user-songs-hero{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:30px;
  margin-bottom:24px;
}

.user-songs-person{
  display:flex;
  align-items:center;
  gap:20px;
  min-width:0;
}

.user-songs-person > img{
  width:92px;
  height:92px;
  flex:0 0 92px;
  border-radius:28px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.15);
  background:rgba(255,255,255,.08);
}

.user-songs-person h1{
  margin:4px 0 10px;
  color:#fff7e7;
  font-size:clamp(32px, 5vw, 62px);
  line-height:.98;
  letter-spacing:-.055em;
}

.user-songs-person p{
  max-width:760px;
  margin:0;
  color:rgba(247,243,236,.72);
  font-size:18px;
  line-height:1.55;
}

.user-songs-meta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}

.user-songs-meta span{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:34px;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.14);
  color:#ffd37a;
  font-weight:900;
}

.user-songs-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:wrap;
  flex:0 0 auto;
}

.user-songs-back{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#fff7e7;
  font-weight:900;
  border:1px solid rgba(255,255,255,.12);
}

.user-songs-list-card{
  padding:24px;
}

.user-songs-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:16px;
}

.user-songs-head h2{
  margin:0;
  color:#fff7e7;
  font-size:30px;
  letter-spacing:-.03em;
}

.user-songs-head span{
  flex:0 0 auto;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  border-radius:999px;
  background:rgba(240,165,38,.14);
  color:#ffd37a;
  font-weight:900;
}

.user-public-song-list{
  display:grid;
  gap:12px;
}

.user-public-song-row{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.10);
}

.user-songs-empty{
  padding:24px;
  border-radius:24px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
}

.user-songs-empty h3{
  margin:0 0 8px;
  color:#fff7e7;
  font-size:24px;
}

.user-songs-empty p{
  margin:0;
  color:rgba(247,243,236,.72);
}

@media(max-width:760px){
  .user-songs-hero{
    align-items:flex-start;
    flex-direction:column;
    padding:22px;
    border-radius:28px;
  }

  .user-songs-person{
    align-items:flex-start;
    flex-direction:column;
  }

  .user-songs-person > img{
    width:72px;
    height:72px;
    border-radius:22px;
  }

  .user-songs-actions,
  .user-songs-actions .btn,
  .user-songs-back{
    width:100%;
  }

  .user-songs-list-card{
    padding:18px;
    border-radius:28px;
  }

  .user-songs-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .song-related-row{
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    align-items:center;
  }

  .song-related-thumb{
    width:46px;
    height:46px;
    flex-basis:46px;
    border-radius:14px;
  }

  .song-related-row em{
    grid-column:2;
    justify-self:start;
    margin-top:2px;
  }
}

/* Patch 099: verejná stránka používateľa - zarovnanie a jednotný zoznam pesničiek */
.user-songs-page{
  padding:48px 0 76px;
  color:var(--text);
}

.user-songs-page .container{
  max-width:1180px;
}

.user-songs-hero{
  padding:24px;
  margin-bottom:18px;
  border-radius:30px;
}

.user-songs-person > img{
  width:78px;
  height:78px;
  flex-basis:78px;
  border-radius:24px;
}

.user-songs-person h1{
  font-size:clamp(30px, 4.5vw, 54px);
}

.user-songs-person p{
  font-size:16px;
}

.user-songs-list-card{
  padding:20px;
  border-radius:30px;
}

.user-songs-head{
  margin-bottom:14px;
}

.user-songs-head h2{
  font-size:26px;
}

.user-public-song-list{
  gap:10px;
}

.user-public-song-list .songs-directory-row{
  grid-template-columns:52px minmax(0,1fr) auto;
  padding:10px 12px;
  border-radius:20px;
  background:rgba(255,255,255,.045);
  border-color:rgba(255,255,255,.075);
}

.user-public-song-list .songs-directory-row:hover{
  background:rgba(240,165,38,.10);
  border-color:rgba(240,165,38,.24);
}

.user-public-song-list .songs-directory-photo{
  width:52px;
  height:52px;
  border-radius:17px;
}

.user-public-song-list .songs-directory-main h3{
  font-size:18px;
}

.user-public-song-list .songs-directory-main p{
  margin-top:3px;
  font-size:13px;
}

.user-public-song-list .songs-directory-chords{
  gap:5px;
  margin-top:7px;
}

.user-public-song-list .songs-directory-chords span{
  min-height:24px;
  padding:0 8px;
  font-size:12px;
}

.user-public-song-list .songs-directory-side{
  gap:8px;
}

.user-public-song-list .songs-directory-side a{
  min-height:34px;
  padding:0 13px;
}

@media(max-width:760px){
  .user-songs-page{
    padding:34px 0 62px;
  }

  .user-songs-hero{
    padding:20px;
  }

  .user-songs-list-card{
    padding:16px;
  }

  .user-public-song-list .songs-directory-row{
    grid-template-columns:48px minmax(0,1fr);
    padding:10px;
  }

  .user-public-song-list .songs-directory-photo{
    width:48px;
    height:48px;
    border-radius:16px;
  }

  .user-public-song-list .songs-directory-side{
    grid-column:1 / -1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    justify-items:initial;
  }

  .user-public-song-list .songs-directory-side a{
    min-height:36px;
  }
}

/* Patch 103: visible default user avatar without relying on external image load */
.uk-user-avatar{
  display:inline-grid;
  place-items:center;
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg, rgba(240,165,38,.95), rgba(247,197,106,.95));
  color:#11151a;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}

.uk-user-avatar > img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.uk-user-avatar-fallback{
  display:none;
  width:100%;
  height:100%;
  place-items:center;
  background:radial-gradient(circle at 35% 25%, rgba(255,255,255,.26), transparent 35%), linear-gradient(135deg, #f0a526, #f7c56a);
}

.uk-user-avatar-fallback svg{
  width:72%;
  height:72%;
  display:block;
  fill:#11151a;
  stroke:#11151a;
  stroke-width:3;
  stroke-linecap:round;
  opacity:.92;
}

.uk-user-avatar.is-default > img{
  display:none;
}

.uk-user-avatar.is-default .uk-user-avatar-fallback{
  display:grid;
}

.song-contributor-person .uk-user-avatar,
.song-contributor-avatar{
  width:44px;
  height:44px;
  flex:0 0 44px;
  border-radius:15px;
}

.user-songs-person > .uk-user-avatar,
.user-songs-avatar{
  width:92px;
  height:92px;
  flex:0 0 92px;
  border-radius:28px;
}

@media (max-width: 720px){
  .user-songs-person > .uk-user-avatar,
  .user-songs-avatar{
    width:74px;
    height:74px;
    flex-basis:74px;
    border-radius:24px;
  }
}

/* Footer + contact page */
.ua-footer{
  padding:44px 0 22px;
  background:linear-gradient(180deg,#121610 0%,#0c100d 100%);
  border-top:1px solid rgba(240,165,38,.16);
  color:var(--text);
}

.ua-footer__grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(140px,.7fr) minmax(180px,.8fr) minmax(0,260px);
  gap:26px;
  align-items:flex-start;
}

.ua-footer__logo{
  display:inline-flex;
  align-items:center;
  gap:11px;
  font-weight:950;
  font-size:24px;
  letter-spacing:-.04em;
}

.ua-footer__logo img{
  width:44px;
  height:44px;
  object-fit:contain;
}

.ua-footer__logo span{
  color:var(--orange);
}

.ua-footer__brand p,
.ua-footer__contact p{
  max-width:420px;
  margin:0;
  color:rgba(247,243,236,.68);
  line-height:1.65;
}

.ua-footer h3{
  margin:0 0 15px;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:rgba(247,243,236,.72);
}

.ua-footer__nav{
  display:flex;
  flex-direction:column;
  gap:9px;
}

.ua-footer__nav a,
.ua-footer__links a,
.ua-footer__mail{
  color:#ffd78b;
  font-weight:850;
}

.ua-footer__nav a:hover,
.ua-footer__links a:hover,
.ua-footer__mail:hover{
  color:#fff2cf;
}

.ua-footer__links{
  display:flex;
  flex-wrap:wrap;
  gap:10px 16px;
  margin-top:18px;
}

.ua-footer__studio-column{
  justify-self:end;
  width:100%;
  max-width:250px;
}

.ua-footer__studio{
  display:inline-flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:100%;
  max-width:250px;
  min-width:0;
  box-sizing:border-box;
  padding:10px 12px;
  border-radius:18px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 14px 35px rgba(0,0,0,.14);
  overflow:hidden;
}

.ua-footer__studio span{
  color:rgba(247,243,236,.62);
  font-size:10px;
  font-weight:950;
  letter-spacing:.08em;
  text-align:center;
  white-space:nowrap;
  flex:0 0 auto;
}

.ua-footer__studio img{
  display:block;
  width:118px;
  max-width:100%;
  height:auto;
  object-fit:contain;
}

.ua-footer__bottom{
  display:flex;
  justify-content:space-between;
  gap:16px;
  margin-top:30px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.08);
  color:rgba(247,243,236,.45);
  font-size:14px;
}

.ua-footer__partners{
  margin-top:20px;
}

.ua-footer__partners-title{
  display:block;
  margin-bottom:10px;
  color:rgba(247,243,236,.62);
  font-size:11px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.ua-footer__partner-logos{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}

.ua-footer__partner-logos a{
  display:flex;
  align-items:center;
  gap:11px;
  width:100%;
  color:#ffd78b;
  font-size:12px;
  font-weight:800;
  line-height:1.35;
  opacity:.78;
  transition:opacity .2s ease,color .2s ease;
}

.ua-footer__partner-logos a:hover{
  color:#fff2cf;
  opacity:1;
}

.ua-footer__partner-logos img{
  display:block;
  width:46px;
  height:46px;
  flex:0 0 46px;
  object-fit:contain;
}

.ua-footer__partner-logos img.is-round{
  clip-path:circle(47% at 50% 50%);
}

.contact-page{
  padding:48px 0 76px;
  background:
    radial-gradient(circle at 18% 10%,rgba(240,165,38,.12),transparent 28%),
    radial-gradient(circle at 88% 6%,rgba(81,164,107,.10),transparent 26%),
    var(--dark);
  color:var(--text);
}

.contact-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:24px;
  align-items:end;
  padding:34px;
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:var(--shadow);
}

.contact-eyebrow{
  margin:0 0 9px;
  color:#ffd78b;
  font-size:13px;
  font-weight:950;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.contact-hero h1{
  margin:0;
  font-size:clamp(44px,7vw,86px);
  line-height:.92;
  letter-spacing:-.06em;
}

.contact-hero p:not(.contact-eyebrow){
  max-width:750px;
  margin:18px 0 0;
  color:rgba(247,243,236,.72);
  font-size:20px;
  line-height:1.55;
}

.contact-back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:0 18px;
  border-radius:999px;
  color:#1f160c;
  background:var(--orange);
  font-weight:950;
  white-space:nowrap;
}

.contact-grid{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  gap:24px;
  margin-top:24px;
}

.contact-card{
  padding:28px;
  border-radius:28px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 20px 55px rgba(0,0,0,.20);
}

.contact-form{
  display:grid;
  gap:18px;
}

.contact-form label{
  display:grid;
  gap:9px;
}

.contact-form label span{
  color:rgba(247,243,236,.82);
  font-weight:900;
}

.contact-form input,
.contact-form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.13);
  outline:0;
  border-radius:20px;
  background:rgba(255,255,255,.08);
  color:var(--text);
  font:inherit;
  padding:16px 18px;
}

.contact-form textarea{
  resize:vertical;
  min-height:170px;
  line-height:1.55;
}

.contact-form input:focus,
.contact-form textarea:focus{
  border-color:rgba(240,165,38,.65);
  box-shadow:0 0 0 4px rgba(240,165,38,.12);
}

.contact-alert{
  padding:14px 16px;
  border-radius:18px;
  font-weight:850;
}

.contact-alert--ok{
  background:rgba(81,164,107,.16);
  border:1px solid rgba(81,164,107,.28);
  color:#c9ffd7;
}

.contact-alert--error{
  background:rgba(240,74,65,.14);
  border:1px solid rgba(240,74,65,.25);
  color:#ffd3cf;
}

.ua-hp-field{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.contact-info h2,
.contact-info h3{
  margin:0;
  color:var(--text);
}

.contact-info h2{
  font-size:28px;
  letter-spacing:-.04em;
}

.contact-info p{
  color:rgba(247,243,236,.70);
  line-height:1.65;
}

.contact-email{
  display:inline-flex;
  margin:6px 0 26px;
  color:#ffd78b;
  font-size:18px;
  font-weight:950;
}

.contact-info h3{
  margin-top:4px;
  font-size:18px;
}

.contact-info ul{
  margin:14px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}

.contact-info li{
  position:relative;
  padding-left:22px;
  color:rgba(247,243,236,.74);
}

.contact-info li::before{
  content:'✓';
  position:absolute;
  left:0;
  top:0;
  color:var(--orange);
  font-weight:950;
}

@media(max-width:980px){
  .ua-footer__grid{
    grid-template-columns:1fr 1fr;
  }
  .ua-footer__studio-column{
    justify-self:start;
  }
  .contact-hero,
  .contact-grid{
    grid-template-columns:1fr;
  }
  .contact-back{
    justify-self:start;
  }
}

@media(max-width:640px){
  .ua-footer{
    padding-top:34px;
  }
  .ua-footer__grid{
    grid-template-columns:1fr;
    gap:28px;
  }
  .ua-footer__bottom{
    flex-direction:column;
  }
  .ua-footer__studio{
    width:100%;
    max-width:250px;
    justify-content:center;
  }
  .ua-footer__studio img{
    width:112px;
    max-width:44%;
  }
  .contact-page{
    padding:34px 0 52px;
  }
  .contact-hero,
  .contact-card{
    padding:22px;
    border-radius:26px;
  }
  .contact-hero p:not(.contact-eyebrow){
    font-size:17px;
  }
}

/* Patch 108: homepage community + newsletter */
.home-connect-card--community{
  background:
    linear-gradient(135deg, rgba(240,165,38,.15), rgba(40,68,50,.16) 58%),
    rgba(255,255,255,.055);
}

.home-connect-card--community .home-connect-icon{
  background:rgba(240,165,38,.18);
  color:#ffc46b;
}

.home-connect-card--community span{
  color:#ffc46b;
}

.home-community-actions{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}

.home-community-actions a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(255,255,255,.075);
  border:1px solid rgba(255,255,255,.12);
  color:var(--cream);
  font-weight:950;
  text-decoration:none;
}

.home-community-actions a:first-child{
  background:var(--amber);
  border-color:rgba(240,165,38,.72);
  color:#19120a;
}

.home-community-actions a:hover{
  transform:translateY(-1px);
  border-color:rgba(240,165,38,.46);
}

.home-newsletter-message{
  position:relative;
  z-index:1;
  max-width:560px;
  margin:0 0 12px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.075);
  border:1px solid rgba(255,255,255,.12);
  color:rgba(255,246,231,.82);
  font-weight:850;
  line-height:1.45;
}

.home-newsletter-message.is-ok{
  background:rgba(98,176,44,.12);
  border-color:rgba(142,205,88,.28);
  color:#dff8c9;
}

.home-newsletter-message.is-error{
  background:rgba(238,75,55,.12);
  border-color:rgba(238,75,55,.32);
  color:#ffd9d3;
}

.home-newsletter-form input[readonly]{
  opacity:.78;
  cursor:default;
}

@media(max-width:560px){
  .home-community-actions{
    display:grid;
  }

  .home-community-actions a{
    width:100%;
  }
}

/* Patch 109: jemnejšie a čitateľnejšie tlačidlá v komunitnom/newsletter bloku */
.home-connect .home-community-actions{
  align-items:center;
  gap:12px;
  margin-top:8px;
}

.home-connect .home-community-actions a{
  min-height:52px;
  padding:0 22px;
  border-radius:999px;
  line-height:1;
  font-size:15px;
  font-weight:950;
  letter-spacing:-.01em;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.home-connect .home-community-actions a:first-child{
  background:var(--amber) !important;
  border-color:rgba(240,165,38,.78) !important;
  color:#17110a !important;
  box-shadow:0 14px 34px rgba(240,165,38,.18);
}

.home-connect .home-community-actions a:not(:first-child){
  background:rgba(255,255,255,.085) !important;
  border-color:rgba(255,255,255,.14) !important;
  color:var(--cream) !important;
  box-shadow:none;
}

.home-connect .home-community-actions a:hover{
  transform:translateY(-1px);
  border-color:rgba(240,165,38,.52) !important;
}

.home-connect .home-newsletter-form{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  width:100%;
  max-width:none;
  margin-bottom:12px;
}

.home-connect .home-newsletter-form input{
  width:100%;
  height:56px;
  border-radius:22px;
  padding:0 18px;
}

.home-connect .home-newsletter-form button{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-width:150px;
  height:56px;
  padding:0 24px;
  border:0 !important;
  border-radius:999px !important;
  background:var(--amber) !important;
  color:#17110a !important;
  font-size:15px;
  font-weight:950;
  line-height:1;
  text-align:center;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
  box-shadow:0 14px 34px rgba(240,165,38,.18);
  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.home-connect .home-newsletter-form button:hover{
  transform:translateY(-1px);
  filter:brightness(1.03);
  box-shadow:0 18px 42px rgba(240,165,38,.22);
}

.home-connect .home-newsletter-form button:focus-visible,
.home-connect .home-community-actions a:focus-visible{
  outline:3px solid rgba(240,165,38,.32);
  outline-offset:3px;
}

@media(max-width:680px){
  .home-connect .home-newsletter-form{
    grid-template-columns:1fr;
  }

  .home-connect .home-newsletter-form button{
    width:100%;
  }
}

/* Patch 110: presné tlačidlá v komunitnom a newsletter bloku */
.home-connect .home-community-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:14px;
  margin-top:14px;
}

.home-connect .home-community-actions .home-action-btn{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:0 24px;
  border-radius:999px;
  font-size:16px;
  font-weight:950;
  line-height:1;
  text-decoration:none !important;
  white-space:nowrap;
  opacity:1 !important;
  text-shadow:none !important;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.home-connect .home-community-actions .home-action-btn--primary{
  background:#f0a526 !important;
  border:1px solid #f0a526 !important;
  color:#17110a !important;
  box-shadow:0 16px 38px rgba(240,165,38,.22);
}

.home-connect .home-community-actions .home-action-btn--secondary{
  background:rgba(255,255,255,.10) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  color:#fff6e7 !important;
  box-shadow:none !important;
}

.home-connect .home-community-actions .home-action-btn:hover{
  transform:translateY(-1px);
}

.home-connect .home-community-actions .home-action-btn--primary:hover{
  background:#ffb02d !important;
  border-color:#ffb02d !important;
  box-shadow:0 20px 48px rgba(240,165,38,.26);
}

.home-connect .home-community-actions .home-action-btn--secondary:hover{
  background:rgba(255,255,255,.14) !important;
  border-color:rgba(240,165,38,.45) !important;
}

.home-connect .home-newsletter-form{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:14px;
  max-width:620px;
  margin:0 0 14px;
}

.home-connect .home-newsletter-form input{
  height:56px;
  border-radius:22px;
}

.home-connect .home-newsletter-form .home-newsletter-submit{
  appearance:none;
  -webkit-appearance:none;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  min-width:164px;
  height:56px;
  padding:0 26px;
  border:1px solid #f0a526 !important;
  border-radius:999px !important;
  background:#f0a526 !important;
  color:#17110a !important;
  font-size:16px;
  font-weight:950;
  line-height:1;
  text-align:center;
  white-space:nowrap;
  cursor:pointer;
  opacity:1 !important;
  text-shadow:none !important;
  box-shadow:0 16px 38px rgba(240,165,38,.22);
}

.home-connect .home-newsletter-form .home-newsletter-submit:hover{
  transform:translateY(-1px);
  background:#ffb02d !important;
  border-color:#ffb02d !important;
  box-shadow:0 20px 48px rgba(240,165,38,.26);
}

@media(max-width:720px){
  .home-connect .home-community-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .home-connect .home-community-actions .home-action-btn{
    width:100%;
  }

  .home-connect .home-newsletter-form{
    grid-template-columns:1fr;
  }

  .home-connect .home-newsletter-form .home-newsletter-submit{
    width:100%;
  }
}


/* Patch 111: finálna oprava homepage tlačidiel + bezpečný spevník link */
.home-connect .home-community-actions{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  align-items:stretch;
  gap:12px;
  width:100%;
  max-width:640px;
  margin-top:26px;
}

.home-connect .home-community-actions .home-action-btn{
  display:flex !important;
  width:100%;
  min-width:0;
  min-height:56px;
  padding:0 14px;
  box-sizing:border-box;
  border-radius:999px;
  align-items:center;
  justify-content:center;
  font-size:15px;
  font-weight:950;
  line-height:1.1;
  text-align:center;
  text-decoration:none !important;
  white-space:nowrap;
  opacity:1 !important;
  text-shadow:none !important;
}

.home-connect .home-community-actions .home-action-btn--primary{
  background:var(--amber, #f0a526) !important;
  border:1px solid rgba(240,165,38,.9) !important;
  color:#17110a !important;
  box-shadow:0 14px 34px rgba(240,165,38,.20) !important;
}

.home-connect .home-community-actions .home-action-btn--secondary{
  background:rgba(255,255,255,.09) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  color:var(--cream, #fff6e7) !important;
  box-shadow:none !important;
}

.home-connect .home-community-actions .home-action-btn:hover{
  transform:translateY(-1px);
}

.home-connect .home-community-actions .home-action-btn--primary:hover{
  background:#ffb02d !important;
  border-color:#ffb02d !important;
}

.home-connect .home-community-actions .home-action-btn--secondary:hover{
  background:rgba(255,255,255,.13) !important;
  border-color:rgba(240,165,38,.45) !important;
}

.home-connect .home-newsletter-form{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 190px;
  gap:12px;
  width:100%;
  max-width:660px;
  align-items:center;
}

.home-connect .home-newsletter-form .home-newsletter-submit{
  width:100%;
  min-width:0;
}

@media(max-width:1180px){
  .home-connect .home-community-actions{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:720px){
  .home-connect .home-community-actions,
  .home-connect .home-newsletter-form{
    grid-template-columns:1fr !important;
    max-width:none;
  }
}

/* Patch 112: definitívna oprava homepage tlačidiel */
.home-connect-card--community .home-community-actions > a.home-action-btn.home-action-btn--primary,
.home-connect .home-community-actions > a.home-action-btn.home-action-btn--primary,
.home-connect .home-community-actions > a.home-action-btn:first-child{
  background:#f0a526 !important;
  background-color:#f0a526 !important;
  background-image:none !important;
  border-color:#f0a526 !important;
  color:#17110a !important;
  box-shadow:0 16px 38px rgba(240,165,38,.22) !important;
}

.home-connect-card--community .home-community-actions > a.home-action-btn.home-action-btn--primary:hover,
.home-connect .home-community-actions > a.home-action-btn.home-action-btn--primary:hover,
.home-connect .home-community-actions > a.home-action-btn:first-child:hover{
  background:#ffb02d !important;
  background-color:#ffb02d !important;
  background-image:none !important;
  border-color:#ffb02d !important;
  color:#17110a !important;
}

.home-connect-card--community .home-community-actions > a.home-action-btn.home-action-btn--secondary,
.home-connect .home-community-actions > a.home-action-btn.home-action-btn--secondary{
  background:rgba(255,255,255,.10) !important;
  background-color:rgba(255,255,255,.10) !important;
  background-image:none !important;
  border-color:rgba(255,255,255,.18) !important;
  color:#fff6e7 !important;
}

.home-connect .home-newsletter-form > button.home-newsletter-submit{
  background:#f0a526 !important;
  background-color:#f0a526 !important;
  background-image:none !important;
  border-color:#f0a526 !important;
  color:#17110a !important;
}

.home-connect .home-newsletter-form > button.home-newsletter-submit:hover{
  background:#ffb02d !important;
  background-color:#ffb02d !important;
  border-color:#ffb02d !important;
}

/* Patch 122: ladička s reálnymi tónmi a hlavami nástrojov */
.ear-tuner-page .tuner-main-card{
  overflow:hidden;
}

.ear-tuner-stage{
  position:relative;
  width:min(100%, 760px);
  min-height:660px;
  margin:18px auto 24px;
}

.ear-tuner-stage.is-guitar{
  min-height:860px;
}

.ear-tuner-head{
  position:absolute;
  inset:0;
  background-repeat:no-repeat;
  background-position:center top;
  background-size:auto 100%;
  pointer-events:none;
  user-select:none;
}

.ear-tuner-head--ukulele{
  background-image:url('../img/tuner-ukulele.png');
}

.ear-tuner-head--guitar{
  background-image:url('../img/tuner-guitar.png');
}

.ear-tuner-pegs{
  position:absolute;
  inset:0;
  z-index:2;
}

.ear-tuner-peg{
  position:absolute;
  transform:translate(-50%, -50%);
  width:148px;
  min-height:82px;
  display:grid;
  grid-template-columns:1fr 44px;
  grid-template-areas:'note play' 'meta play';
  column-gap:12px;
  align-items:center;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:24px;
  background:linear-gradient(145deg, rgba(37,42,37,.96), rgba(26,31,28,.96));
  box-shadow:0 16px 38px rgba(0,0,0,.30);
  color:#fff8ec;
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
  z-index:3;
}

.ear-tuner-peg-note{
  grid-area:note;
  font-size:36px;
  line-height:.95;
  font-weight:1000;
  letter-spacing:-.035em;
  color:#fff8ec;
}

.ear-tuner-peg small{
  grid-area:meta;
  color:rgba(255,248,236,.70);
  font-weight:900;
  font-size:14px;
  margin-top:6px;
}

.ear-tuner-peg-play{
  grid-area:play;
  display:inline-flex;
  width:42px;
  height:42px;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:#f5a91f;
  color:#160f08;
  box-shadow:0 10px 24px rgba(245,169,31,.28);
}

.ear-tuner-icon-pause{
  display:none;
}

.ear-tuner-peg:hover,
.ear-tuner-peg.is-active{
  transform:translate(-50%, -50%) translateY(-2px);
  border-color:rgba(250,169,31,.70);
  background:linear-gradient(135deg, rgba(88,62,25,.98), rgba(30,38,33,.98));
  box-shadow:0 0 0 1px rgba(250,169,31,.16), 0 22px 52px rgba(0,0,0,.36);
}

.ear-tuner-peg:hover .ear-tuner-peg-note,
.ear-tuner-peg.is-active .ear-tuner-peg-note{
  color:#ffd989;
}

.ear-tuner-peg.is-active .ear-tuner-icon-play{
  display:none;
}

.ear-tuner-peg.is-active .ear-tuner-icon-pause{
  display:block;
}

.ear-tuner-peg.is-active .ear-tuner-peg-play{
  animation:referenceTonePulse 1.65s ease-in-out infinite;
}

@media (max-width: 980px){
  .ear-tuner-stage{
    min-height:620px;
  }
  .ear-tuner-stage.is-guitar{
    min-height:780px;
  }
}

@media (max-width: 760px){
  .ear-tuner-stage{
    min-height:560px;
  }
  .ear-tuner-stage.is-guitar{
    min-height:700px;
  }
  .ear-tuner-peg{
    width:122px;
    min-height:68px;
    grid-template-columns:1fr 36px;
    padding:10px 10px;
    border-radius:20px;
  }
  .ear-tuner-peg-note{
    font-size:28px;
  }
  .ear-tuner-peg-play{
    width:36px;
    height:36px;
  }
  .ear-tuner-peg small{
    font-size:12px;
  }
}

@media (max-width: 520px){
  .ear-tuner-stage{
    min-height:460px;
  }
  .ear-tuner-stage.is-guitar{
    min-height:580px;
  }
  .ear-tuner-peg{
    width:96px;
    min-height:60px;
    grid-template-columns:1fr 30px;
    column-gap:8px;
    padding:8px 8px;
    border-radius:18px;
  }
  .ear-tuner-peg-note{
    font-size:22px;
  }
  .ear-tuner-peg-play{
    width:30px;
    height:30px;
  }
  .ear-tuner-peg small{
    font-size:11px;
  }
}

/* Patch 127: Uč sa hrať – samostatný lineárny kurz
   Scope: iba .learn-page--linear. Ladička ani main.js nie sú súčasťou tejto úpravy. */
.learn-page--linear #prvy-krok,
.learn-page--linear .learn-course-step{
  scroll-margin-top:112px;
}

.learn-page--linear .learn-linear-intro{
  margin-top:34px;
  margin-bottom:18px;
  text-align:center;
}

.learn-page--linear .learn-linear-intro span{
  display:inline-flex;
  margin-bottom:10px;
  color:#f0a526;
  font-size:13px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.learn-page--linear .learn-linear-intro h2{
  margin:0 0 10px;
  color:#fff8ec;
  font-size:clamp(30px,4vw,48px);
  line-height:1.05;
  letter-spacing:-.04em;
}

.learn-page--linear .learn-linear-intro p{
  max-width:720px;
  margin:0 auto;
  color:rgba(255,248,236,.72);
  font-size:18px;
  line-height:1.65;
}

.learn-page--linear .learn-linear-course{
  display:grid;
  gap:18px;
  margin-top:24px;
}

.learn-page--linear .learn-course-step{
  display:grid;
  gap:22px;
  align-items:center;
  border:1px solid rgba(255,255,255,.10);
  border-radius:30px;
  padding:24px;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:0 24px 70px rgba(0,0,0,.22);
}

.learn-page--linear .learn-course-step--with-chord{
  grid-template-columns:minmax(0,1fr) minmax(190px,260px);
}

.learn-page--linear .learn-course-step--multi-chord{
  grid-template-columns:minmax(0,.82fr) minmax(360px,1.18fr);
}

.learn-page--linear .learn-course-step--plain{
  grid-template-columns:1fr;
}

.learn-page--linear .learn-course-step-copy em{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  margin-bottom:14px;
  border-radius:18px;
  background:rgba(240,165,38,.16);
  color:#f0a526;
  font-style:normal;
  font-weight:1000;
}

.learn-page--linear .learn-course-step-copy h2{
  margin:0 0 10px;
  color:#fff8ec;
  font-size:clamp(28px,3.4vw,42px);
  line-height:1.08;
  letter-spacing:-.04em;
}

.learn-page--linear .learn-course-step-copy > strong{
  display:block;
  max-width:820px;
  margin-bottom:10px;
  color:#fff8ec;
  font-size:19px;
  line-height:1.5;
}

.learn-page--linear .learn-course-step-copy p{
  max-width:860px;
  margin:0;
  color:rgba(255,248,236,.74);
  font-size:17px;
  line-height:1.7;
}

.learn-page--linear .learn-course-step-copy .learn-btn{
  margin-top:18px;
}

.learn-page--linear .learn-course-pattern{
  display:inline-flex;
  margin-top:18px;
  border:1px solid rgba(240,165,38,.32);
  border-radius:18px;
  padding:14px 18px;
  background:rgba(240,165,38,.10);
  color:#ffd989;
  font-size:24px;
  font-weight:1000;
  letter-spacing:.02em;
}

.learn-page--linear .learn-course-placeholder{
  display:inline-flex;
  margin-top:18px;
  border:1px dashed rgba(240,165,38,.42);
  border-radius:18px;
  padding:14px 18px;
  background:rgba(240,165,38,.08);
  color:#ffe4a8;
  font-weight:900;
}

.learn-page--linear .learn-course-chord{
  justify-self:end;
  width:100%;
  max-width:250px;
  min-height:245px;
  display:grid;
  justify-items:center;
  align-content:center;
  border-radius:26px;
  padding:16px;
  background:rgba(0,0,0,.20);
  border:1px solid rgba(255,255,255,.09);
}

.learn-page--linear .learn-course-chord small{
  display:block;
  width:100%;
  margin-bottom:10px;
  color:rgba(255,248,236,.70);
  font-size:12px;
  font-weight:900;
  letter-spacing:.10em;
  text-align:center;
  text-transform:uppercase;
}

.learn-page--linear .learn-course-chord-list{
  width:100%;
  display:grid;
  place-items:center;
  gap:14px;
}

.learn-page--linear .learn-course-chord-card{
  width:100%;
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto;
}

.learn-page--linear .learn-course-chord-card svg,
.learn-page--linear .learn-course-chord-card img{
  display:block;
  width:100%;
  height:auto;
  margin:auto;
}

.learn-page--linear .learn-course-chord-fallback{
  display:grid;
  place-items:center;
  min-height:180px;
  width:100%;
  border-radius:20px;
  background:rgba(255,255,255,.06);
  color:#ffd989;
  font-size:54px;
  font-weight:1000;
}

.learn-page--linear .learn-course-chord--multi{
  max-width:100%;
}

.learn-page--linear .learn-course-chord--multi .learn-course-chord-list{
  grid-template-columns:repeat(4,minmax(118px,1fr));
  gap:14px;
}

.learn-page--linear .learn-course-chord--multi .learn-course-chord-card{
  min-height:168px;
}

.learn-page--linear .learn-course-chord--multi .learn-course-chord-fallback{
  min-height:150px;
}

@media(max-width:980px){
  .learn-page--linear .learn-course-step--with-chord,
  .learn-page--linear .learn-course-step--multi-chord,
  .learn-page--linear .learn-course-step--plain{
    grid-template-columns:1fr;
  }

  .learn-page--linear .learn-course-chord{
    justify-self:stretch;
    max-width:100%;
  }

  .learn-page--linear .learn-course-chord--multi .learn-course-chord-list{
    grid-template-columns:repeat(2,minmax(130px,1fr));
  }
}

@media(max-width:760px){
  .learn-page--linear .learn-course-step{
    padding:20px;
    border-radius:24px;
  }

  .learn-page--linear .learn-course-pattern{
    width:100%;
    justify-content:center;
    text-align:center;
    font-size:20px;
  }
}

@media(max-width:520px){
  .learn-page--linear .learn-course-chord--multi .learn-course-chord-list{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
}

/* Patch 130: homepage – jednoduchý blok Uč sa hrať bez kariet */
.home-learn--simple .home-learn-grid--simple{
  grid-template-columns:minmax(270px,.85fr) minmax(0,1.15fr);
  align-items:center;
}

.home-learn--simple .home-learn-copy{
  min-height:auto;
}

.home-learn-flow{
  position:relative;
  z-index:1;
  display:flex;
  flex-wrap:wrap;
  align-content:center;
  gap:10px;
  min-height:100%;
  padding:28px;
  border-radius:34px;
  background:linear-gradient(135deg,rgba(255,255,255,.72),rgba(255,255,255,.40));
  border:1px solid rgba(38,31,24,.10);
  box-shadow:0 18px 48px rgba(82,55,18,.10);
  color:#261f18;
}

.home-learn-flow span{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:44px;
  padding:0 14px 0 10px;
  border-radius:999px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(38,31,24,.08);
  box-shadow:0 10px 24px rgba(82,55,18,.07);
}

.home-learn-flow b{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:999px;
  background:rgba(240,165,38,.18);
  color:#6c4308;
  font-size:11px;
  font-weight:1000;
}

.home-learn-flow strong{
  color:#261f18;
  font-size:15px;
  line-height:1;
  font-weight:950;
  letter-spacing:-.02em;
}

.home-learn-flow:hover span{
  border-color:rgba(240,165,38,.36);
}

@media(max-width:980px){
  .home-learn--simple .home-learn-grid--simple{
    grid-template-columns:1fr;
  }

  .home-learn-flow{
    min-height:auto;
    padding:24px;
  }
}

@media(max-width:640px){
  .home-learn-flow{
    border-radius:28px;
    padding:20px;
    gap:8px;
  }

  .home-learn-flow span{
    min-height:40px;
    padding-right:12px;
  }

  .home-learn-flow strong{
    font-size:14px;
  }
}

/* 404 page */
.error-page{
  min-height:calc(100vh - 70px);
  display:flex;
  align-items:center;
  padding:92px 0 86px;
  background:
    radial-gradient(circle at 82% 18%, rgba(240,165,38,.18), transparent 32%),
    linear-gradient(180deg, #fff6e7 0%, #f7ead5 100%);
}

.error-card{
  position:relative;
  overflow:hidden;
  min-height:430px;
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(260px,.75fr);
  align-items:center;
  gap:34px;
  padding:46px;
  border-radius:34px;
  background:rgba(255,255,255,.62);
  border:1px solid rgba(38,31,24,.10);
  box-shadow:0 28px 80px rgba(38,31,24,.12);
}

.error-card:before{
  content:"";
  position:absolute;
  inset:auto -80px -120px auto;
  width:300px;
  height:300px;
  border-radius:999px;
  background:rgba(240,165,38,.18);
}

.error-card__content{
  position:relative;
  z-index:2;
  max-width:720px;
}

.error-card .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:16px;
  padding:8px 13px;
  border-radius:999px;
  background:rgba(240,165,38,.16);
  color:#7b4c06;
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.error-card h1{
  margin:0;
  max-width:720px;
  color:#141414;
  font-size:clamp(40px,6vw,76px);
  line-height:.98;
  letter-spacing:-.06em;
}

.error-card p{
  max-width:640px;
  margin:20px 0 0;
  color:#5d5044;
  font-size:19px;
  line-height:1.65;
}

.error-search{
  width:min(100%,620px);
  margin-top:28px;
  display:flex;
  gap:8px;
  padding:7px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(38,31,24,.12);
  box-shadow:0 14px 40px rgba(38,31,24,.08);
}

.error-search input{
  flex:1 1 auto;
  min-width:0;
  min-height:48px;
  border:0;
  outline:0;
  background:transparent;
  color:#261f18;
  padding:0 18px;
  font-size:16px;
}

.error-search button{
  min-height:48px;
  border:0;
  border-radius:999px;
  padding:0 22px;
  background:var(--orange);
  color:#1b140c;
  font-weight:900;
  cursor:pointer;
}

.error-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:22px;
}

/* Patch 085: scoped ghost buttons - 404 page is light, account/song pages are dark */
.btn--ghost{
  background:rgba(255,255,255,.075);
  color:var(--cream);
  border:1px solid rgba(255,255,255,.14);
}

.btn--ghost:hover,
.btn--ghost:focus-visible{
  background:rgba(240,165,38,.14);
  color:#ffd796;
  border-color:rgba(240,165,38,.34);
}

.error-card .btn--ghost{
  background:rgba(38,31,24,.07);
  color:#261f18;
  border:1px solid rgba(38,31,24,.10);
}

.error-card .btn--ghost:hover,
.error-card .btn--ghost:focus-visible{
  background:rgba(38,31,24,.11);
  color:#261f18;
  border-color:rgba(38,31,24,.18);
}

.error-card__visual{
  position:relative;
  z-index:1;
  min-height:290px;
  display:grid;
  place-items:center;
}

.error-card__visual span{
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:230px;
  height:230px;
  border-radius:48px;
  background:linear-gradient(135deg,#101216,#242833);
  color:var(--orange);
  font-size:62px;
  font-weight:1000;
  letter-spacing:-.08em;
  box-shadow:0 24px 70px rgba(16,18,22,.28);
  transform:rotate(-4deg);
}

.error-card__visual span:before,
.error-card__visual span:after{
  content:"";
  position:absolute;
  top:26px;
  bottom:26px;
  width:2px;
  border-radius:999px;
  background:rgba(240,165,38,.42);
}

.error-card__visual span:before{left:72px}
.error-card__visual span:after{right:72px}

.error-card__visual i{
  position:absolute;
  width:190px;
  height:190px;
  border:22px solid rgba(240,165,38,.18);
  border-radius:999px;
  transform:translate(44px,38px);
}

.error-card__visual b{
  position:absolute;
  right:8%;
  top:5%;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:var(--orange);
  color:#1b140c;
  font-size:30px;
  box-shadow:0 16px 40px rgba(240,165,38,.28);
}

@media(max-width:900px){
  .error-card{
    grid-template-columns:1fr;
    padding:32px;
  }

  .error-card__visual{
    order:-1;
    min-height:170px;
    place-items:start;
  }

  .error-card__visual span{
    width:150px;
    height:150px;
    border-radius:32px;
    font-size:42px;
  }

  .error-card__visual span:before{left:48px}
  .error-card__visual span:after{right:48px}
}

@media(max-width:560px){
  .error-page{
    padding:64px 0 58px;
  }

  .error-card{
    padding:24px;
    border-radius:26px;
  }

  .error-card h1{
    font-size:42px;
  }

  .error-card p{
    font-size:16px;
  }

  .error-search{
    flex-direction:column;
    border-radius:22px;
  }

  .error-search button{
    width:100%;
  }
}

/* Patch 085: explicit readable buttons in account and song editor dark panels */
.account-page .btn--ghost,
.songbook-page .btn--ghost,
.song-submit-page .btn--ghost,
.song-submit-form .btn--ghost,
.song-convert-box .btn--ghost,
.song-submit-actions .btn--ghost,
.song-submit-actions--single .btn--ghost{
  background:rgba(255,255,255,.075);
  color:var(--cream);
  border-color:rgba(255,255,255,.14);
}

.account-page .btn--ghost:hover,
.account-page .btn--ghost:focus-visible,
.songbook-page .btn--ghost:hover,
.songbook-page .btn--ghost:focus-visible,
.song-submit-page .btn--ghost:hover,
.song-submit-page .btn--ghost:focus-visible,
.song-submit-form .btn--ghost:hover,
.song-submit-form .btn--ghost:focus-visible,
.song-convert-box .btn--ghost:hover,
.song-convert-box .btn--ghost:focus-visible,
.song-submit-actions .btn--ghost:hover,
.song-submit-actions .btn--ghost:focus-visible,
.song-submit-actions--single .btn--ghost:hover,
.song-submit-actions--single .btn--ghost:focus-visible{
  background:rgba(240,165,38,.14);
  color:#ffd796;
  border-color:rgba(240,165,38,.34);
}

/* Patch 110: isolated search page contrast fix
   Scope is intentionally limited to .page-section.search-page so light 404 and account buttons stay untouched. */
.page-section.search-page{
  background:
    radial-gradient(circle at 18% 8%, rgba(240,165,38,.14), transparent 34%),
    radial-gradient(circle at 82% 16%, rgba(255,196,107,.10), transparent 30%),
    linear-gradient(180deg,#101418 0%, #0f1317 100%);
  color:var(--cream);
}

.page-section.search-page .container{
  position:relative;
  z-index:1;
}

.search-page .eyebrow{
  color:#ffc46b;
}

.search-page .search-hero-panel{
  border-color:rgba(255,255,255,.11);
  background:linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.035));
  color:var(--cream);
}

.search-page .search-hero-panel h1,
.search-page .search-results-head h2,
.search-page .search-empty-panel h2{
  color:var(--cream);
}

.search-page .search-hero-panel p{
  color:rgba(255,250,238,.72);
}

.search-page .search-page-form{
  background:rgba(0,0,0,.28);
  border-color:rgba(255,255,255,.13);
}

.search-page .search-page-form input{
  color:#fffaf0;
}

.search-page .search-page-form input::placeholder{
  color:rgba(255,250,238,.50);
}

.search-page .search-query-note{
  background:rgba(0,0,0,.22);
  border-color:rgba(255,255,255,.12);
  color:rgba(255,250,238,.72);
}

.search-page .search-query-note strong{
  color:#fffaf0;
}

.search-page .search-results-section,
.search-page .search-empty-panel{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.11);
  color:var(--cream);
}

.search-page .search-song-list .songs-directory-row,
.search-page .search-artist-row{
  background:rgba(0,0,0,.18);
  border-color:rgba(255,255,255,.08);
}

.search-page .search-song-list .songs-directory-row:hover,
.search-page .search-artist-row:hover{
  background:rgba(240,165,38,.10);
  border-color:rgba(240,165,38,.25);
}

.search-page .songs-directory-main h3,
.search-page .songs-directory-main h3 a,
.search-page .search-artist-row h3,
.search-page .search-artist-row h3 a{
  color:#fffaf0;
}

.search-page .songs-directory-main p,
.search-page .search-artist-row p,
.search-page .songs-directory-side small{
  color:rgba(255,250,238,.62);
}

.search-page .songs-directory-chords span{
  background:rgba(240,165,38,.18);
  color:#ffc46b;
}

.search-page .songs-directory-side a,
.search-page .search-artist-open{
  background:rgba(240,165,38,.14);
  color:#ffc46b;
  border-color:rgba(240,165,38,.26);
}

.search-page .songs-directory-side a:hover,
.search-page .search-artist-open:hover{
  background:rgba(240,165,38,.22);
  color:#ffd796;
}

.search-page .search-mini-empty,
.search-page .search-empty-panel p{
  color:rgba(255,250,238,.70);
}