.routes-stops {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:.8rem;margin:.85rem 0}
.routes-ticket {min-height:78px;display:grid;grid-template-columns:42px minmax(0,1fr) 18px;gap:.55rem;align-items:center;text-align:left;color:#241b3b;background:var(--route-color,#83e3df);border:2px solid #ffedff;border-radius:1rem;padding:.65rem;box-shadow:0 4px 0 #563b77;font:inherit}
.routes-ticket:hover {border-color:#ffe966}
.routes-ticket strong,.routes-ticket small {display:block}
.routes-ticket small {font-weight:750;line-height:1.22}
.routes-ticket-icon {background:#1e1535;color:var(--route-color);border-radius:.75rem;display:grid;place-items:center;aspect-ratio:1}
.routes-ticket-icon svg,.routes-ticket .arrow {width:22px;height:22px}
.routes-source {display:inline-block;margin-top:.6rem}
.routes-guidance {margin:.35rem 0 .75rem}
.routes-level {display:block;margin:.6rem 0;color:#f1e8ff;font-weight:800}
.routes-level select {min-height:44px;max-width:100%;font:inherit;border:1px solid #9c85b0;background:#231a35;color:inherit;border-radius:.65rem;padding:.3rem .45rem}
.routes-progress {width:100%;height:.75rem;accent-color:#83e3df}
.routes-song-label {color:#fff2c4;font-weight:750;margin:.7rem 0}
.routes-mix {display:flex;flex-wrap:wrap;gap:1rem;margin:.6rem 0}
.routes-mix label {display:grid;flex:1 1 150px;gap:.35rem;max-width:260px;font-weight:800}
.routes-mix input {width:100%;accent-color:#e6b3ff}
.routes-beats {display:grid;grid-template-columns:repeat(4,1fr);gap:.35rem;margin:.65rem 0;max-width:350px}
.routes-beats span,.routes-rhythm-grid button {display:grid;place-items:center;font-weight:950;color:#f6ebff;background:#231935;border:2px solid #7a5f98;border-radius:.55rem;min-height:44px}
.routes-beats span.active,.routes-rhythm-grid button.active {border-color:#ffdf67;box-shadow:inset 0 -4px 0 #ffdf67}
.routes-layer-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;margin:1rem 0}
.routes-layer-grid:has(.routes-layer:nth-child(2):last-child) {grid-template-columns:repeat(2,minmax(0,1fr))}
.routes-layer {padding:.7rem;display:flex;flex-direction:column;align-items:flex-start;min-width:0;gap:.32rem;border:2px solid #755d90;border-radius:1rem;background:#201631}
.routes-layer.layer-on {border-color:var(--route-color);box-shadow:inset 0 -4px 0 var(--route-color)}
.routes-layer h2 {font-size:clamp(1rem,3vw,1.55rem);letter-spacing:-.025em}
.routes-layer p,.routes-layer small {font-size:.88rem;overflow-wrap:anywhere}
.routes-layer-art {display:grid;place-items:center;width:min(76px,100%);aspect-ratio:1;border-radius:.8rem;background:var(--route-color)}
.routes-layer-art svg {width:90%}
.routes-layer-actions {display:flex;flex-wrap:wrap;gap:.3rem;margin-top:auto;padding-top:.45rem}
.routes-layer-actions .btn {min-height:44px;padding:.45rem .55rem}
.routes-instrument {display:grid;grid-template-columns:minmax(80px,155px) 1fr;gap:1rem;align-items:center;margin:.7rem 0}
.routes-instrument>svg {width:100%;background:var(--route-color);border-radius:1rem}
.routes-instrument p {margin-top:.45rem}
.routes-rhythm-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem;margin:.75rem 0}
.routes-rhythm-grid button[aria-pressed="true"] {background:#acf0d7;color:#171125;border-color:#acf0d7}
.routes-rhythm-grid button[aria-pressed="true"].active {border-color:#ffdf67}
.routes-challenge,.routes-passport {border:1px solid #ac83ce;border-radius:1rem;padding:.85rem;margin:.8rem 0;background:#271938}
.routes-challenge h2,.routes-fact h2 {margin:.5rem 0}
.routes-feedback {font-weight:800;color:#ffedaf;margin-top:.7rem}
.routes-feedback:empty {display:none}
.routes-passport-facts {margin-top:1rem}
.routes-passport-facts details {margin-top:.6rem}
.routes-passport-facts summary {font-weight:850;cursor:pointer}
.classroom-shell .routes-board {max-width:100%}
.classroom-shell .routes-layer h2,.classroom-shell .routes-rhythm-grid button,.classroom-shell .routes-beats span {font-size:clamp(1.3rem,3vw,2.3rem)}
@media(max-width:650px){.routes-layer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.routes-ticket{min-height:68px}.routes-layer-actions .btn{min-width:44px}}