.unique-study-route[hidden]{display:none}
.unique-study-route-card{margin:0}
.unique-study-route-body{min-width:0;padding:16px;border-top:1px solid var(--line);background:#fff}
.unique-study-route-track{display:flex;align-items:center;gap:12px;min-width:0;overflow-x:auto;padding:4px 2px 12px;scrollbar-width:thin;scroll-snap-type:x proximity}
.study-route-node{--route-fill:#f6c344;--route-stroke:#a97500;display:flex;flex:0 0 210px;min-width:0;aspect-ratio:1;box-sizing:border-box;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:20px;border:3px solid var(--route-stroke);border-radius:50%;background:var(--route-fill);color:#171738;text-align:center;scroll-snap-align:center;box-shadow:0 8px 18px #15153b1a}
.study-route-node--tonic{--route-fill:#ef5350;--route-stroke:#b92f35;color:#fff}
.study-route-node--scale{--route-fill:#fb8c00;--route-stroke:#c25e00}
.study-route-node--raga{--route-fill:#f6c344;--route-stroke:#a97500}
.study-route-node--direction{--route-fill:#7cb342;--route-stroke:#4c7c1d}
.study-route-node>span{font-size:.72rem;font-weight:900;letter-spacing:.03em;text-transform:uppercase}
.study-route-node h4{max-width:100%;margin:0;font:800 1rem/1.15 Inter,system-ui,sans-serif;overflow-wrap:anywhere}
.study-route-node p{max-width:100%;margin:0;font-size:.7rem;font-weight:750;line-height:1.25;overflow-wrap:anywhere}
.study-route-connector{flex:0 0 auto;color:#aaaab8;font-size:1.8rem;font-weight:900}
@media(max-width:620px){
  .unique-study-route-body{padding:12px 8px}
  .unique-study-route-track{gap:8px}
  .study-route-node{flex-basis:186px;padding:16px}
  .study-route-node h4{font-size:.92rem}
  .study-route-node p{font-size:.66rem}
  .study-route-connector{font-size:1.4rem}
}