@font-face{font-family:Zisa;src:url('../../assets/fonts/Nunito-Variable.ttf') format('truetype');font-display:swap}
.child-studio{font-family:Zisa,Arial,sans-serif;background:#fff9ed;color:#35334d;--purple:#6550b9;--line:#e3dceb}
.child-studio .shell{max-width:1120px;padding:20px 28px 28px}
.child-studio header{margin-bottom:28px;flex-wrap:wrap}
.child-studio .brand{font-size:22px}.child-studio .logo{background:#7b62c4;border-radius:18px;transform:rotate(-7deg)}
.back-home{color:#514661;text-decoration:none;font-weight:800;padding:12px;background:white;border-radius:16px;border:1px solid #e7dfd1}
.child-studio #teacherButton{font-size:13px;color:#6d637a;min-height:44px}
.child-welcome{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px}
.child-welcome h1{font-size:clamp(32px,5vw,48px);line-height:1.1;color:#524091;margin:8px 0}
.child-welcome p{margin:0;font-size:19px}.child-welcome .eyebrow{font-size:11px;color:#8c6b3a;letter-spacing:1.5px}
.help-button{background:#fff0bb;border:2px solid #efd272;border-radius:20px;min-height:56px;white-space:nowrap}
.choose-title{font-size:21px;display:flex;gap:10px;align-items:center;margin:0 0 12px}
.choose-title>span{display:inline-grid;place-items:center;width:32px;height:32px;flex-shrink:0;background:#f1e9ff;color:#6b50a6;border-radius:50%;font-size:18px}
.child-studio .instrument-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 10px}
.child-studio .instrument-tabs button{display:flex;justify-content:center;align-items:center;gap:12px;min-height:86px;white-space:normal;border:2px solid #e5deef;border-bottom-width:5px;border-radius:22px;font-size:18px;background:#fff;padding:12px;color:#4a405b}
.instrument-icon{font-size:36px;line-height:1.2}
.child-studio .instrument-tabs button[aria-pressed=true]{border-color:#8063c1;background:#eee5ff;padding:12px;box-shadow:0 0 0 3px #8063c122}
.more-instruments{margin-bottom:16px}.more-instruments summary{cursor:pointer;font-size:15px;font-weight:800;color:#685681;padding:8px;width:fit-content;min-height:44px}.more-instruments .instrument-tabs{margin-top:8px;grid-template-columns:repeat(3,1fr)}
.child-studio .instrument-panel{border:2px solid #e4daef;border-radius:28px;box-shadow:0 8px 0 #e8dece70;padding:20px 24px;background:white;overflow:hidden}
.child-studio .instrument-heading{flex-direction:row;align-items:center}.child-studio .instrument-heading h2{font-size:24px;color:#544484}.child-studio .instrument-heading p{font-size:17px;color:#685e75}.play-sticker{font-size:42px;color:#dcaf44;transform:rotate(12deg)}
.child-studio .play-surface{margin:22px auto 12px;min-height:180px}
.child-studio .tube{height:var(--height);min-width:44px;max-width:88px;border-radius:18px}.child-studio .tube b,.child-studio .bar b{font-size:24px}
.child-studio .strings{gap:8px}.child-studio .string{height:44px;min-height:44px;font-size:15px}
.child-studio .keyboard{height:190px}.child-studio .drumpads{margin:12px auto;gap:14px}.child-studio .drumpad{max-height:170px}.child-studio .instrument-footer{border:0;font-size:15px;min-height:24px;padding:0}
.recording-area{margin:16px -24px -20px;padding:18px 24px;background:#f8f4ff;border-top:2px solid #eee5f7}
.recording-area .choose-title{margin-bottom:5px}.recording-area>p{font-size:16px;margin:4px 0 12px;color:#6b5c7f}
.child-studio .transport{padding:0;gap:10px}.child-studio .transport button{min-height:58px;border-radius:18px;font-size:18px;padding:12px 20px;border-bottom-width:4px}
.child-studio .record{background:#d33d60;border-color:#b12e4d}.child-studio .play{background:#6950b5;border-color:#503896}.child-studio #stop{background:#fff5d6;border-color:#dcc46d}
.child-studio .status-row{padding:12px 0 0;font-size:16px;align-items:center;color:#534169;min-height:40px}.child-studio #clock{font-size:19px}
.child-studio[data-phase=count] #clock{display:grid;place-items:center;background:#ffe695;color:#574016;border-radius:18px;font-size:42px;min-width:68px;min-height:60px}
.child-studio[data-phase=record] .recording-area{background:#fff1f2}.child-studio[data-phase=record] #status{font-weight:800;color:#ae234a}
#recordProgress{display:block;width:100%;height:16px;accent-color:#d33d60;margin-top:10px}#nextStep{background:#e7f5e7;border-radius:12px;padding:12px;color:#32643e}
.my-recordings{border:2px solid #e4daef;border-radius:20px;background:#fff;margin-top:22px;overflow:hidden}.my-recordings>summary{padding:16px;font-size:18px;font-weight:800;cursor:pointer}.my-recordings #trackCount{font-size:14px;color:#746480;margin-left:12px}.my-recordings .mix{border:0;border-radius:0}
.child-studio .track-controls{width:152px;gap:5px}.child-studio .track-controls button{min-height:44px;width:44px;font-size:17px}.child-studio .track-controls input{width:48px;min-height:32px}.child-studio .track-name b{font-size:15px}
.other-games{margin-top:30px}.other-games h2{font-size:22px;margin-bottom:14px}.activity-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.activity-grid>a,.activity-grid>button{display:grid;grid-template-columns:48px 1fr;text-align:left;align-items:center;column-gap:10px;padding:18px;text-decoration:none;border:2px solid #e8decc;border-bottom-width:5px;border-radius:22px;background:#fff;color:#51405f;min-height:100px}.activity-grid>a:first-child{background:#fff0d5}.activity-grid>a:nth-child(2){background:#e6f4ed}.activity-grid>button{background:#efe8fc}.activity-grid span{grid-row:span 2;font-size:36px}.activity-grid strong{font-size:18px}.activity-grid small{font-size:14px;font-weight:400;margin-top:4px}
.child-studio footer{font-size:14px;color:#78694f;display:block;text-align:center;margin-top:24px}
.teacher-settings{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:18px;background:#f4f0fc;border-radius:16px}.teacher-settings label{display:flex;align-items:center;gap:10px;font-size:15px}.teacher-settings input[type=range]{max-width:100px}
@media(max-width:650px){.child-studio .shell{padding:14px}.child-studio header{gap:8px;margin-bottom:20px}.child-studio .brand{font-size:17px;gap:6px}.child-studio .logo{width:32px;height:36px;font-size:25px}.child-studio #teacherButton{font-size:11px;padding:6px}.back-home{font-size:13px;padding:8px}.child-welcome{align-items:flex-start;flex-direction:column;gap:12px}.child-welcome p{font-size:17px}.child-studio .instrument-tabs{grid-template-columns:repeat(2,1fr);gap:9px}.child-studio .instrument-tabs button{font-size:17px;min-height:76px;padding:9px}.child-studio .instrument-tabs button[aria-pressed=true]{padding:9px}.instrument-icon{font-size:30px}.more-instruments .instrument-tabs{grid-template-columns:repeat(2,1fr)}.child-studio .instrument-panel{padding:16px 12px}.child-studio .instrument-heading p{font-size:15px}.play-sticker{display:none}.child-studio .tubes,.child-studio .xylo{gap:5px}.child-studio .tube{min-width:0;border-radius:10px;height:calc(var(--height)*.85)}.child-studio .tube b,.child-studio .bar b{font-size:18px}.child-studio .play-surface{min-height:165px}.child-studio .keyboard{height:165px}.recording-area{margin:14px -12px -16px;padding:16px 12px}.choose-title{font-size:18px}.child-studio .transport{display:grid;grid-template-columns:1fr 1fr}.child-studio .transport button{font-size:16px;padding:10px;min-height:56px}.child-studio .transport #record{grid-column:1/-1}.child-studio .status-row{font-size:15px}.activity-grid{grid-template-columns:1fr;gap:10px}.activity-grid>a,.activity-grid>button{min-height:84px;padding:12px 18px}.teacher-settings{grid-template-columns:1fr}.song-title{flex-wrap:wrap;gap:6px}.child-studio .track{flex-wrap:wrap}.child-studio .track-name{width:120px}.child-studio .track-visual{min-width:85px}.child-studio .track-controls{width:100%;justify-content:flex-end}.child-studio .track-controls input{order:0;width:90px}.child-studio .mix-heading{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.child-studio *{transition:none!important;scroll-behavior:auto!important}}
.child-studio .instrument-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
.child-studio .electric-strings{background:#29223e;border:4px solid #7561aa;border-radius:22px;padding:15px}
.child-studio .electric-strings .string{background:#443854;border-color:#8f7cb0;color:#fff}
.child-studio .electric-strings .string:after{background:#d6c6ee;box-shadow:0 0 5px #e5c9ff}
@media(max-width:650px){.child-studio .instrument-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.child-studio .instrument-tabs button{font-size:15px;gap:7px}.child-studio .instrument-tabs button span:last-child{min-width:0;overflow-wrap:anywhere}}
@media(min-width:900px) and (max-height:950px){.child-studio .shell{padding-top:12px}.child-studio header{margin-bottom:14px}.child-welcome{margin-bottom:16px}.child-welcome h1{font-size:36px}.child-welcome .eyebrow{display:none}.child-studio .instrument-tabs button{min-height:68px}.more-instruments{margin-bottom:8px}.child-studio .instrument-panel{padding-top:14px}.child-studio .play-surface{margin-top:14px;min-height:155px}.child-studio .tube{height:calc(var(--height)*.82)}.child-studio .keyboard{height:155px}.recording-area{margin-top:10px;padding-top:12px}.child-studio .instrument-heading h2{font-size:22px}}

.child-studio header{flex-wrap:wrap;gap:12px}.child-studio .qr-entry{display:inline-flex;align-items:center;min-height:44px;padding:10px 16px;border-radius:14px;background:#eee6fb;color:#59438c;font-weight:800;text-decoration:none}.child-studio .qr-entry:focus-visible{outline:3px solid #b47b16;outline-offset:3px}

.band-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0 20px;padding:0;list-style-position:inside}.band-steps li{padding:12px;border-radius:12px;background:#f2ecff;font-size:17px;line-height:1.5}@media(max-width:650px){.band-steps{grid-template-columns:1fr}}