/* Signature School of Music — Paper & Teal Studio.
   Presentation-only overrides; app behaviour and permissions stay unchanged. */
:root {
  --ink:#123f43; --ink-soft:#1b5a60; --marigold:#dca83c;
  --marigold-deep:#a87316; --paper:#fbfaf5; --line:#dce5df; --muted:#667b78;
  --studio-canvas:#f7f6f0; --studio-card:#fffefa;
}
body { background:var(--paper); color:var(--ink); }
.btn { border-radius:10px; box-shadow:0 2px 6px rgba(18,63,67,.06); }
.btn.accent,.btn.toggled { color:#18383a; box-shadow:0 5px 12px rgba(174,126,28,.18); }
.btn.accent:hover:not(:disabled) { background:#edbd56; }

/* Home library */
.home,.home-main { background:var(--studio-canvas); }
.home-side {
  width:246px; padding:22px 15px 18px;
  background:linear-gradient(180deg,#123f43 0%,#0d3438 100%);
  border-right:1px solid rgba(255,255,255,.08);
}
.home-side-brand { padding:0 8px 25px; }
.home-side-brand .logo-mark { background:var(--marigold); color:var(--ink); box-shadow:0 0 0 5px rgba(220,168,60,.12); }
.home-side-brand .tag { color:#e7c86d; letter-spacing:.16em; }
.home-side-brand .side-title { letter-spacing:-.015em; }
.home-side-nav { gap:5px; }
.side-nav-item { padding:11px 12px; border-radius:11px; color:#bad0cc; }
.side-nav-item:hover { background:rgba(255,255,255,.09); color:#fff; }
.side-nav-item.active { background:var(--marigold); color:#17383a; box-shadow:0 5px 14px rgba(220,168,60,.22); }
.home-side-actions { gap:9px; padding-top:17px; border-top-color:rgba(255,255,255,.13); }
.home-side-actions .btn { min-height:42px; padding-left:13px; text-align:left; }
.home-side-actions .btn:not(.accent) { background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.08); color:#edf4ef; }
.home-side-actions .btn:not(.accent):hover { background:rgba(255,255,255,.16); }
.home-search { max-width:680px; padding:24px 34px 6px; }
.home-search input {
  max-width:620px; padding:13px 16px 13px 40px; background:rgba(255,255,255,.9);
  border-color:#d4dfd9; border-radius:13px; box-shadow:0 8px 25px rgba(18,63,67,.06);
}
.home-search input:focus { border-color:var(--marigold); outline:none; box-shadow:0 0 0 4px rgba(220,168,60,.14); }
.home-inner { max-width:1320px; padding:18px 34px 70px; }
.welcome-banner {
  position:relative; overflow:hidden; margin:8px 0 28px; padding:24px 28px; border-radius:18px;
  background:linear-gradient(115deg,#123f43 0%,#24666a 75%,#327b7b 100%);
  box-shadow:0 18px 34px -22px rgba(18,63,67,.55);
}
.welcome-banner::after { content:"\266a"; position:absolute; right:28px; bottom:-25px; color:rgba(255,255,255,.08); font:140px/1 "Fraunces",serif; }
.welcome-banner .welcome-hi { font-size:1.55rem; letter-spacing:-.02em; }
.welcome-banner .welcome-quote { color:#d3e8e1; }
.home-h2 { margin:18px 0 8px; font-size:1.38rem; letter-spacing:-.015em; }
.folder-grid { grid-template-columns:repeat(auto-fit,minmax(205px,1fr)); gap:16px; margin:16px 0 30px; }
.folder-card {
  min-height:148px; padding:21px; background:rgba(255,255,255,.84); border-color:#dbe5df;
  border-radius:17px; box-shadow:0 6px 18px rgba(18,63,67,.045);
}
.folder-card:hover { transform:translateY(-2px); box-shadow:0 14px 28px -16px rgba(18,63,67,.35); }
.folder-ic { width:48px; height:48px; background:#e9f0ea; color:var(--ink); border-radius:14px; }
.folder-card.all-songs { background:#f8efd6; border-color:#e9d59a; }
.folder-card.all-songs .folder-ic { background:var(--marigold); }
.folder-card .fname { font-size:1.04rem; }
.song-table { border-spacing:0 6px; border-collapse:separate; }
.song-table tr { background:rgba(255,255,255,.74); border:0; }
.song-table tr:hover { background:#eef3eb; }
.song-table td { padding:14px 12px; border-top:1px solid #e1e8e1; border-bottom:1px solid #e1e8e1; }
.song-table td:first-child { border-left:1px solid #e1e8e1; border-radius:11px 0 0 11px; }
.song-table td:last-child { border-right:1px solid #e1e8e1; border-radius:0 11px 11px 0; }

/* Notation and practice workspace */
.topbar { padding:11px 18px; background:#123f43; box-shadow:0 5px 20px rgba(18,63,67,.16); }
.topbar .tag { color:#e7c86d; }
.topbar .nav-song,.topbar .btn:not(.accent) { background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.12); color:#edf4ef; }
.topbar .nav-song:hover,.topbar .btn:not(.accent):hover { background:rgba(255,255,255,.17); }
.topbar .btn.accent { color:#193b3c; }
.sound-chip { color:#c5ddd7; border-color:rgba(255,255,255,.18); }
.score-wrap { background:var(--studio-canvas); }
#alphaTab { background:var(--studio-card); border:1px solid #e8e6dc; border-radius:14px; box-shadow:0 8px 26px rgba(18,63,67,.05); }
.controls { background:#123f43; border-top-color:rgba(255,255,255,.14); box-shadow:0 -8px 24px rgba(18,63,67,.14); }
.controls .btn,body.playing .primary-actions .btn,body.playing .secondary-actions .btn {
  background:rgba(255,255,255,.10); border-color:rgba(255,255,255,.14); color:#eef6f0;
}
.controls #playPause,.controls .btn.accent,body.playing #playPause { background:var(--marigold); border-color:var(--marigold); color:#193b3c; }
body.playing .controls,body.playing .controls .tempo-label,body.playing .controls #tempoUnit,body.playing .controls #timePos { color:rgba(255,255,255,.84); }
body.playing .btn.toggled { background:#efd27e!important; border-color:#efd27e!important; color:#193b3c!important; }
.learn-song-panel .syncbox,.dockpanel .syncbox { border-color:#d9e4dc; box-shadow:0 18px 40px rgba(18,63,67,.18); }
.learn-song-panel .synchead,.dockpanel .synchead { background:#123f43; }
.learn-song-panel .learn-progress-card,.learn-song-panel .learn-next-card,
.learn-song-panel .learn-section-picker,.learn-song-panel .learn-range-card,
.learn-song-panel .learn-insight-card,.learn-song-panel .learn-problems { background:var(--studio-card); border-color:#e0e7df; }
.learn-song-panel .learn-actions .btn,.learn-song-panel #learnNextBtn { background:#edf3ed; border-color:#d8e3da; color:var(--ink); }
.learn-song-panel #learnPracticeBtn,
.learn-song-panel #learnNotesOnlyBtn,
.learn-song-panel #learnAnalyseBtn { display:none!important; }
.learn-song-panel .btn.learn-action-active { background:#1b5a60!important; border-color:#1b5a60!important; color:#fff!important; }
.learn-song-panel .learn-reset-btn {
  padding:6px 10px; color:#f6dfaa; background:rgba(255,255,255,.07);
  border-color:rgba(246,223,170,.34); box-shadow:none;
}
.learn-song-panel .learn-reset-btn:hover { color:#fff4d7; background:rgba(220,168,60,.18); }
.results-card { border:1px solid #e1e7df; box-shadow:0 24px 70px rgba(18,63,67,.25); }
.library,.settings,.gearpanel { background:var(--paper); }
.library-head,.gear-head { background:#123f43; }

@media (max-width:760px) {
  .home-side { width:auto; padding:10px 12px; }
  .home-search { padding:16px 16px 5px; }
  .home-inner { padding:12px 16px 55px; }
  .welcome-banner { padding:20px; }
  .folder-card { min-height:132px; }
  .learn-song-panel .learn-reset-btn { padding:6px 8px; }
  #alphaTab { border-left:0; border-right:0; border-radius:0; }
}
@media (prefers-reduced-motion:reduce) { .folder-card,.btn,.side-nav-item { transition:none!important; } }