/* musicatmos v2 · Music Studio "studio after dark" atmosphere (music-studio.html only). LOCAL build 2026-11-03 ~19:40 AEST.
   Original NextRising AI CSS. Design references only (licence UNCLEAR, no code/markup/images/copy/fonts reused):
   Hollis & Vine (template_A), Voxenora (template_B), and Rowan's component shortlist (G-Bars, Animated Accordion, Cards Deck, Aurora). See CREDITS.txt.
   Foundation kept: header, menus, glass, colour tokens, site fonts (--font / --font-d only), radii, orange buttons #BF5508 / hover #A64508, original Ted art.
   Motion: only while a preview plays; none under prefers-reduced-motion or the site's Reduce-motion button (html.rm-user). No-JS: everything static and readable.
   Rollback: point the <link>/<script> back to ?v=1 files in _bak_pre_atmos_v2_1910/ (or remove both tags). */

/* ---------- 0 · page-scoped: real notes that used the dashed site .ph look become SOLID notes (shared .ph CSS untouched) ---------- */
body[data-page="music-studio"] .ph{border:1px solid #D6DCE8;border-radius:18px;background:#fff;color:#3E4866;
  box-shadow:var(--gl-rim,none),0 6px 18px rgba(20,32,74,.06)}
body[data-page="music-studio"] .ph .ph-ic{background:#F3F1FF;color:#5534C9}
body[data-page="music-studio"] .ph a{color:#14204A}

/* ---------- 1 · the dark studio stage (#student-showcase) ---------- */
.ms-show.sa2{padding-top:0;background:#fff;
  --st-bg:#15133C;--st-bg2:#1C1850;--st-desk:#100F30;--st-row:#1D1C4C;--st-line:#3A3878;--st-tx:#F2F3FB;--st-mu:#C5CAE8;--st-vi:#C9BBFF;--st-or:#F57E20;--st-ye:#FEC623;--st-cy:#4DBAE5}
.sa2-stage{position:relative;isolation:isolate;overflow:hidden;color:var(--st-tx);padding:104px 0 132px;
  background:var(--st-bg) linear-gradient(180deg,#121034 0%,var(--st-bg2) 46%,#141240 100%)}
.sa2-bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.sa2-spot{position:absolute;inset:0;background:
  radial-gradient(42% 58% at 50% -6%,rgba(201,187,255,.30),rgba(122,90,248,.10) 46%,transparent 72%),
  radial-gradient(30% 40% at 6% 70%,rgba(245,126,32,.16),transparent 70%),
  radial-gradient(30% 40% at 96% 60%,rgba(77,186,229,.16),transparent 70%)}
.sa2-word{position:absolute;left:50%;top:38px;transform:translateX(-50%);white-space:nowrap;
  font:800 clamp(78px,17vw,236px)/.86 var(--font-d,inherit);letter-spacing:-.04em;text-transform:uppercase;
  color:transparent;-webkit-text-stroke:1.5px rgba(201,187,255,.20);opacity:.95}
.sa2-curtain{position:absolute;left:0;right:0;bottom:0;height:150px;display:flex;align-items:flex-end;justify-content:space-between;gap:4px;padding:0 10px;opacity:.8}
.sa2-curtain i{flex:0 1 14px;min-width:3px;border-radius:6px 6px 0 0;height:30%;transform-origin:bottom;
  background:linear-gradient(180deg,rgba(245,126,32,.50),rgba(122,90,248,.24) 60%,rgba(122,90,248,0))}
.sa2-curtain i:nth-child(2n){height:52%}.sa2-curtain i:nth-child(3n){height:74%}.sa2-curtain i:nth-child(5n){height:40%}
.sa2-curtain i:nth-child(7n){height:88%}.sa2-curtain i:nth-child(4n+1){height:22%}
.sa2-stage .wrap{position:relative}
.sa2-badge{position:absolute;right:0;top:-58px;display:grid;justify-items:center;gap:4px;width:92px;padding:14px 8px 10px;
  border:1px solid rgba(201,187,255,.45);border-radius:46px 46px 10px 10px;color:var(--st-vi);
  font:700 11px/1 var(--font,inherit);letter-spacing:.14em;text-transform:uppercase}
.sa2-badge b{width:10px;height:10px;border-radius:50%;background:var(--st-or);box-shadow:0 0 0 4px rgba(245,126,32,.18)}
.ms-show.sa-on .sa2-badge b{box-shadow:0 0 0 4px rgba(245,126,32,.25),0 0 18px 4px rgba(245,126,32,.55)}

/* heading on the stage */
.sa2 .sa2-stage .sec-head{position:relative;margin-bottom:34px;text-align:center;max-width:780px;margin-left:auto;margin-right:auto}
.sa2 .sa2-stage .sec-head h2{color:#fff;font-size:clamp(32px,4.6vw,52px)}
.sa2 .sa2-stage .sec-head p{color:var(--st-mu)}
.sa2 .sa2-stage .sec-head h2::after{margin-left:auto;margin-right:auto}
.sa2 .sa2-stage .ms-k{color:var(--st-vi);letter-spacing:.16em}
.sa2 .sa2-stage .ms-k::before{content:"";display:inline-block;width:28px;height:1px;margin:0 10px 0 0;vertical-align:middle;background:currentColor}
.sa2 .sa2-stage .ms-k::after{content:"";display:inline-block;width:28px;height:1px;margin:0 0 0 10px;vertical-align:middle;background:currentColor}

/* ---------- 2 · the mixing desk (panel) ---------- */
.sa2 .ms-panel{display:grid;grid-template-columns:292px minmax(0,1fr);gap:18px 26px;align-items:start;padding:22px;border-radius:24px;
  background:linear-gradient(180deg,#1B1A4A,var(--st-desk));border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -20px rgba(5,4,24,.7),0 0 0 6px rgba(255,255,255,.03);
  -webkit-backdrop-filter:none;backdrop-filter:none}
.sa2 .ms-panel .ms-list,.sa2 .ms-panel .ms-fine{grid-column:2}
.sa2-deck{grid-column:1;grid-row:1 / span 2;display:grid;gap:16px;padding:18px;border-radius:18px;background:#0C0B26;border:1px solid var(--st-line)}
.sa2-tt{position:relative;aspect-ratio:1;border-radius:14px;background:radial-gradient(circle at 50% 50%,#1A1946 0 60%,#121139 61%);display:grid;place-items:center;overflow:hidden}
.sa2-rec{position:relative;width:84%;aspect-ratio:1;border-radius:50%;
  background:
   radial-gradient(circle,#F57E20 0 3%,#7A5AF8 3.5% 21%,#0A0A1E 21.5% 23%,transparent 23.5%),
   conic-gradient(from 20deg,rgba(255,255,255,.10),transparent 18%,rgba(255,255,255,.07) 34%,transparent 52%,rgba(255,255,255,.10) 70%,transparent 86%),
   repeating-radial-gradient(circle,#0B0B20 0 2px,#16153A 2px 3px);
  box-shadow:0 0 0 2px #26245E,0 14px 30px rgba(0,0,0,.45)}
.sa2-lbl{position:absolute;left:50%;top:50%;width:30%;height:30%;transform:translate(-50%,-50%);border-radius:50%;
  background:repeating-conic-gradient(rgba(255,255,255,.18) 0 6deg,transparent 6deg 30deg)}
.sa2-arm{position:absolute;right:9%;top:8%;width:8px;height:52%;border-radius:4px;background:linear-gradient(180deg,#D7DBEF,#8A90B8);
  transform-origin:50% 6%;transform:rotate(-24deg);transition:transform .9s cubic-bezier(.2,.8,.2,1);box-shadow:0 4px 10px rgba(0,0,0,.4)}
.sa2-arm::before{content:"";position:absolute;left:50%;top:-6px;width:20px;height:20px;transform:translateX(-50%);border-radius:50%;background:#2C2A66;border:3px solid #C5CAE8}
.sa2-arm::after{content:"";position:absolute;left:50%;bottom:-8px;width:14px;height:20px;transform:translateX(-50%);border-radius:3px;background:#F57E20}
.ms-show.sa-on .sa2-arm{transform:rotate(4deg)}
.ms-show.sa-on .sa2-rec{animation:sa2spin 1.8s linear infinite}
@keyframes sa2spin{to{transform:rotate(360deg)}}
.sa2-read{display:grid;gap:4px;min-width:0}
.sa2-k{display:flex;align-items:center;gap:8px;color:var(--st-ye);font:700 11px/1 var(--font,inherit);letter-spacing:.16em;text-transform:uppercase}
.sa2-k::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--st-or)}
.sa2-now{color:#fff;font:800 19px/1.25 var(--font-d,inherit);overflow-wrap:anywhere}
.sa2-tc{color:var(--st-mu);font:600 12.5px/1.2 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;letter-spacing:.06em}
/* VU meters (L/R): segmented, still until a preview plays */
.sa2-vu{display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 10px;align-items:center}
.sa2-vu b{color:var(--st-mu);font:700 11px/1 var(--font,inherit);letter-spacing:.1em}
.sa2-ch{display:flex;gap:3px;height:12px}
.sa2-ch i{flex:1 1 0;border-radius:2px;background:#2A2960}
.sa2-ch i:nth-child(-n+3){background:#3BA88C}
.ms-show.sa-on .sa2-ch i:nth-child(-n+8){background:#4BCB8F}
.ms-show.sa-on .sa2-ch i:nth-child(n+9):nth-child(-n+11){background:var(--st-ye)}
.ms-show.sa-on .sa2-ch i:nth-child(12){background:var(--st-or)}
.ms-show.sa-on .sa2-ch{-webkit-mask-image:linear-gradient(90deg,#000 var(--vu,60%),rgba(0,0,0,.18) var(--vu,60%));mask-image:linear-gradient(90deg,#000 var(--vu,60%),rgba(0,0,0,.18) var(--vu,60%))}
@property --vu{syntax:"<percentage>";inherits:false;initial-value:60%}
.ms-show.sa-on .sa2-ch{animation:sa2vu .7s ease-in-out infinite alternate}
.ms-show.sa-on .sa2-ch + b + .sa2-ch{animation-duration:.55s;animation-delay:-.25s}
@keyframes sa2vu{0%{--vu:34%}50%{--vu:78%}100%{--vu:58%}}

/* ---------- 3 · channel strips (the 4 previews). Rows are SOLID (no blur) so text stays crisp. ---------- */
.sa2 .ms-list{grid-template-columns:minmax(0,1fr);gap:10px}
.sa2 .ms-track{background:var(--st-row);border:1px solid var(--st-line);border-radius:16px;padding:14px 16px;color:var(--st-tx);
  box-shadow:inset 3px 0 0 transparent;transition:border-color .2s,box-shadow .2s}
.sa2 .ms-track.is-playing{border-color:#8F79FF;box-shadow:inset 3px 0 0 var(--st-or),0 0 0 1px rgba(143,121,255,.35),0 10px 30px -10px rgba(122,90,248,.6)}
.sa2.ms-js .ms-track,.ms-js.sa2 .ms-track{grid-template-columns:auto minmax(0,1fr) minmax(0,1.25fr);gap:6px 16px}
.sa2 .ms-play{grid-row:auto;width:48px;height:48px;background:#BF5508;color:#fff;box-shadow:0 6px 16px -6px rgba(191,85,8,.8)}
.sa2 .ms-play:hover{background:#A64508}
.sa2 .ms-play:focus-visible{outline:3px solid #A996FF;outline-offset:3px}
.sa2 .ms-n{color:var(--st-ye);font:700 12px/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.08em}
.sa2 .ms-n::before{content:"CH "}
.sa2 .ms-title{color:#fff;font-size:17px}
.sa2 .ms-style{color:var(--st-vi);padding:3px 9px;border:1px solid rgba(201,187,255,.4);border-radius:999px;font-size:12.5px}
.sa2 .ms-eq i{background:var(--st-or)}
.sa2 .ms-meta{row-gap:6px}
/* waveform progress: the bar is masked to a waveform, the fill (orange) shows how far the preview has played */
.sa2 .ms-bar{height:30px;border-radius:0;background:rgba(201,187,255,.30);
  -webkit-mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20400%2040'%20preserveAspectRatio='none'%3E%3Crect%20x='0.8'%20y='12.7'%20width='3.2'%20height='14.7'%20rx='1.6'/%3E%3Crect%20x='6.4'%20y='9.6'%20width='3.2'%20height='20.7'%20rx='1.6'/%3E%3Crect%20x='11.9'%20y='9.9'%20width='3.2'%20height='20.3'%20rx='1.6'/%3E%3Crect%20x='17.5'%20y='11.0'%20width='3.2'%20height='18.0'%20rx='1.6'/%3E%3Crect%20x='23.0'%20y='10.6'%20width='3.2'%20height='18.9'%20rx='1.6'/%3E%3Crect%20x='28.6'%20y='8.0'%20width='3.2'%20height='24.1'%20rx='1.6'/%3E%3Crect%20x='34.1'%20y='5.1'%20width='3.2'%20height='29.7'%20rx='1.6'/%3E%3Crect%20x='39.7'%20y='4.9'%20width='3.2'%20height='30.2'%20rx='1.6'/%3E%3Crect%20x='45.2'%20y='8.8'%20width='3.2'%20height='22.4'%20rx='1.6'/%3E%3Crect%20x='50.8'%20y='15.5'%20width='3.2'%20height='8.9'%20rx='1.6'/%3E%3Crect%20x='56.4'%20y='12.1'%20width='3.2'%20height='15.8'%20rx='1.6'/%3E%3Crect%20x='61.9'%20y='9.2'%20width='3.2'%20height='21.5'%20rx='1.6'/%3E%3Crect%20x='67.5'%20y='10.6'%20width='3.2'%20height='18.9'%20rx='1.6'/%3E%3Crect%20x='73.0'%20y='14.2'%20width='3.2'%20height='11.7'%20rx='1.6'/%3E%3Crect%20x='78.6'%20y='16.9'%20width='3.2'%20height='6.2'%20rx='1.6'/%3E%3Crect%20x='84.1'%20y='16.4'%20width='3.2'%20height='7.1'%20rx='1.6'/%3E%3Crect%20x='89.7'%20y='16.4'%20width='3.2'%20height='7.2'%20rx='1.6'/%3E%3Crect%20x='95.2'%20y='16.1'%20width='3.2'%20height='7.7'%20rx='1.6'/%3E%3Crect%20x='100.8'%20y='15.1'%20width='3.2'%20height='9.7'%20rx='1.6'/%3E%3Crect%20x='106.4'%20y='9.7'%20width='3.2'%20height='20.6'%20rx='1.6'/%3E%3Crect%20x='111.9'%20y='4.3'%20width='3.2'%20height='31.5'%20rx='1.6'/%3E%3Crect%20x='117.5'%20y='2.0'%20width='3.2'%20height='35.9'%20rx='1.6'/%3E%3Crect%20x='123.0'%20y='4.5'%20width='3.2'%20height='30.9'%20rx='1.6'/%3E%3Crect%20x='128.6'%20y='10.4'%20width='3.2'%20height='19.3'%20rx='1.6'/%3E%3Crect%20x='134.1'%20y='16.4'%20width='3.2'%20height='7.3'%20rx='1.6'/%3E%3Crect%20x='139.7'%20y='14.2'%20width='3.2'%20height='11.6'%20rx='1.6'/%3E%3Crect%20x='145.2'%20y='13.6'%20width='3.2'%20height='12.8'%20rx='1.6'/%3E%3Crect%20x='150.8'%20y='13.9'%20width='3.2'%20height='12.3'%20rx='1.6'/%3E%3Crect%20x='156.4'%20y='12.5'%20width='3.2'%20height='15.1'%20rx='1.6'/%3E%3Crect%20x='161.9'%20y='8.6'%20width='3.2'%20height='22.8'%20rx='1.6'/%3E%3Crect%20x='167.5'%20y='4.0'%20width='3.2'%20height='31.9'%20rx='1.6'/%3E%3Crect%20x='173.0'%20y='1.8'%20width='3.2'%20height='36.3'%20rx='1.6'/%3E%3Crect%20x='178.6'%20y='4.1'%20width='3.2'%20height='31.9'%20rx='1.6'/%3E%3Crect%20x='184.1'%20y='10.1'%20width='3.2'%20height='19.9'%20rx='1.6'/%3E%3Crect%20x='189.7'%20y='16.8'%20width='3.2'%20height='6.3'%20rx='1.6'/%3E%3Crect%20x='195.2'%20y='12.9'%20width='3.2'%20height='14.2'%20rx='1.6'/%3E%3Crect%20x='200.8'%20y='12.4'%20width='3.2'%20height='15.1'%20rx='1.6'/%3E%3Crect%20x='206.4'%20y='14.4'%20width='3.2'%20height='11.2'%20rx='1.6'/%3E%3Crect%20x='211.9'%20y='16.0'%20width='3.2'%20height='7.9'%20rx='1.6'/%3E%3Crect%20x='217.5'%20y='15.4'%20width='3.2'%20height='9.1'%20rx='1.6'/%3E%3Crect%20x='223.0'%20y='13.2'%20width='3.2'%20height='13.6'%20rx='1.6'/%3E%3Crect%20x='228.6'%20y='11.9'%20width='3.2'%20height='16.2'%20rx='1.6'/%3E%3Crect%20x='234.1'%20y='13.9'%20width='3.2'%20height='12.2'%20rx='1.6'/%3E%3Crect%20x='239.7'%20y='14.6'%20width='3.2'%20height='10.8'%20rx='1.6'/%3E%3Crect%20x='245.2'%20y='8.0'%20width='3.2'%20height='24.1'%20rx='1.6'/%3E%3Crect%20x='250.8'%20y='3.7'%20width='3.2'%20height='32.6'%20rx='1.6'/%3E%3Crect%20x='256.4'%20y='3.9'%20width='3.2'%20height='32.2'%20rx='1.6'/%3E%3Crect%20x='261.9'%20y='7.8'%20width='3.2'%20height='24.4'%20rx='1.6'/%3E%3Crect%20x='267.5'%20y='12.6'%20width='3.2'%20height='14.7'%20rx='1.6'/%3E%3Crect%20x='273.0'%20y='15.6'%20width='3.2'%20height='8.7'%20rx='1.6'/%3E%3Crect%20x='278.6'%20y='16.2'%20width='3.2'%20height='7.7'%20rx='1.6'/%3E%3Crect%20x='284.1'%20y='16.0'%20width='3.2'%20height='8.1'%20rx='1.6'/%3E%3Crect%20x='289.7'%20y='16.3'%20width='3.2'%20height='7.3'%20rx='1.6'/%3E%3Crect%20x='295.2'%20y='11.7'%20width='3.2'%20height='16.6'%20rx='1.6'/%3E%3Crect%20x='300.8'%20y='5.6'%20width='3.2'%20height='28.9'%20rx='1.6'/%3E%3Crect%20x='306.4'%20y='1.2'%20width='3.2'%20height='37.6'%20rx='1.6'/%3E%3Crect%20x='311.9'%20y='1.1'%20width='3.2'%20height='37.7'%20rx='1.6'/%3E%3Crect%20x='317.5'%20y='5.5'%20width='3.2'%20height='29.0'%20rx='1.6'/%3E%3Crect%20x='323.0'%20y='11.7'%20width='3.2'%20height='16.6'%20rx='1.6'/%3E%3Crect%20x='328.6'%20y='16.4'%20width='3.2'%20height='7.3'%20rx='1.6'/%3E%3Crect%20x='334.1'%20y='16.2'%20width='3.2'%20height='7.7'%20rx='1.6'/%3E%3Crect%20x='339.7'%20y='17.0'%20width='3.2'%20height='6.0'%20rx='1.6'/%3E%3Crect%20x='345.2'%20y='16.5'%20width='3.2'%20height='7.0'%20rx='1.6'/%3E%3Crect%20x='350.8'%20y='15.8'%20width='3.2'%20height='8.5'%20rx='1.6'/%3E%3Crect%20x='356.4'%20y='12.1'%20width='3.2'%20height='15.8'%20rx='1.6'/%3E%3Crect%20x='361.9'%20y='9.1'%20width='3.2'%20height='21.9'%20rx='1.6'/%3E%3Crect%20x='367.5'%20y='9.4'%20width='3.2'%20height='21.1'%20rx='1.6'/%3E%3Crect%20x='373.0'%20y='14.0'%20width='3.2'%20height='11.9'%20rx='1.6'/%3E%3Crect%20x='378.6'%20y='13.1'%20width='3.2'%20height='13.7'%20rx='1.6'/%3E%3Crect%20x='384.1'%20y='7.6'%20width='3.2'%20height='24.8'%20rx='1.6'/%3E%3Crect%20x='389.7'%20y='5.8'%20width='3.2'%20height='28.3'%20rx='1.6'/%3E%3Crect%20x='395.2'%20y='7.8'%20width='3.2'%20height='24.4'%20rx='1.6'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%20400%2040'%20preserveAspectRatio='none'%3E%3Crect%20x='0.8'%20y='12.7'%20width='3.2'%20height='14.7'%20rx='1.6'/%3E%3Crect%20x='6.4'%20y='9.6'%20width='3.2'%20height='20.7'%20rx='1.6'/%3E%3Crect%20x='11.9'%20y='9.9'%20width='3.2'%20height='20.3'%20rx='1.6'/%3E%3Crect%20x='17.5'%20y='11.0'%20width='3.2'%20height='18.0'%20rx='1.6'/%3E%3Crect%20x='23.0'%20y='10.6'%20width='3.2'%20height='18.9'%20rx='1.6'/%3E%3Crect%20x='28.6'%20y='8.0'%20width='3.2'%20height='24.1'%20rx='1.6'/%3E%3Crect%20x='34.1'%20y='5.1'%20width='3.2'%20height='29.7'%20rx='1.6'/%3E%3Crect%20x='39.7'%20y='4.9'%20width='3.2'%20height='30.2'%20rx='1.6'/%3E%3Crect%20x='45.2'%20y='8.8'%20width='3.2'%20height='22.4'%20rx='1.6'/%3E%3Crect%20x='50.8'%20y='15.5'%20width='3.2'%20height='8.9'%20rx='1.6'/%3E%3Crect%20x='56.4'%20y='12.1'%20width='3.2'%20height='15.8'%20rx='1.6'/%3E%3Crect%20x='61.9'%20y='9.2'%20width='3.2'%20height='21.5'%20rx='1.6'/%3E%3Crect%20x='67.5'%20y='10.6'%20width='3.2'%20height='18.9'%20rx='1.6'/%3E%3Crect%20x='73.0'%20y='14.2'%20width='3.2'%20height='11.7'%20rx='1.6'/%3E%3Crect%20x='78.6'%20y='16.9'%20width='3.2'%20height='6.2'%20rx='1.6'/%3E%3Crect%20x='84.1'%20y='16.4'%20width='3.2'%20height='7.1'%20rx='1.6'/%3E%3Crect%20x='89.7'%20y='16.4'%20width='3.2'%20height='7.2'%20rx='1.6'/%3E%3Crect%20x='95.2'%20y='16.1'%20width='3.2'%20height='7.7'%20rx='1.6'/%3E%3Crect%20x='100.8'%20y='15.1'%20width='3.2'%20height='9.7'%20rx='1.6'/%3E%3Crect%20x='106.4'%20y='9.7'%20width='3.2'%20height='20.6'%20rx='1.6'/%3E%3Crect%20x='111.9'%20y='4.3'%20width='3.2'%20height='31.5'%20rx='1.6'/%3E%3Crect%20x='117.5'%20y='2.0'%20width='3.2'%20height='35.9'%20rx='1.6'/%3E%3Crect%20x='123.0'%20y='4.5'%20width='3.2'%20height='30.9'%20rx='1.6'/%3E%3Crect%20x='128.6'%20y='10.4'%20width='3.2'%20height='19.3'%20rx='1.6'/%3E%3Crect%20x='134.1'%20y='16.4'%20width='3.2'%20height='7.3'%20rx='1.6'/%3E%3Crect%20x='139.7'%20y='14.2'%20width='3.2'%20height='11.6'%20rx='1.6'/%3E%3Crect%20x='145.2'%20y='13.6'%20width='3.2'%20height='12.8'%20rx='1.6'/%3E%3Crect%20x='150.8'%20y='13.9'%20width='3.2'%20height='12.3'%20rx='1.6'/%3E%3Crect%20x='156.4'%20y='12.5'%20width='3.2'%20height='15.1'%20rx='1.6'/%3E%3Crect%20x='161.9'%20y='8.6'%20width='3.2'%20height='22.8'%20rx='1.6'/%3E%3Crect%20x='167.5'%20y='4.0'%20width='3.2'%20height='31.9'%20rx='1.6'/%3E%3Crect%20x='173.0'%20y='1.8'%20width='3.2'%20height='36.3'%20rx='1.6'/%3E%3Crect%20x='178.6'%20y='4.1'%20width='3.2'%20height='31.9'%20rx='1.6'/%3E%3Crect%20x='184.1'%20y='10.1'%20width='3.2'%20height='19.9'%20rx='1.6'/%3E%3Crect%20x='189.7'%20y='16.8'%20width='3.2'%20height='6.3'%20rx='1.6'/%3E%3Crect%20x='195.2'%20y='12.9'%20width='3.2'%20height='14.2'%20rx='1.6'/%3E%3Crect%20x='200.8'%20y='12.4'%20width='3.2'%20height='15.1'%20rx='1.6'/%3E%3Crect%20x='206.4'%20y='14.4'%20width='3.2'%20height='11.2'%20rx='1.6'/%3E%3Crect%20x='211.9'%20y='16.0'%20width='3.2'%20height='7.9'%20rx='1.6'/%3E%3Crect%20x='217.5'%20y='15.4'%20width='3.2'%20height='9.1'%20rx='1.6'/%3E%3Crect%20x='223.0'%20y='13.2'%20width='3.2'%20height='13.6'%20rx='1.6'/%3E%3Crect%20x='228.6'%20y='11.9'%20width='3.2'%20height='16.2'%20rx='1.6'/%3E%3Crect%20x='234.1'%20y='13.9'%20width='3.2'%20height='12.2'%20rx='1.6'/%3E%3Crect%20x='239.7'%20y='14.6'%20width='3.2'%20height='10.8'%20rx='1.6'/%3E%3Crect%20x='245.2'%20y='8.0'%20width='3.2'%20height='24.1'%20rx='1.6'/%3E%3Crect%20x='250.8'%20y='3.7'%20width='3.2'%20height='32.6'%20rx='1.6'/%3E%3Crect%20x='256.4'%20y='3.9'%20width='3.2'%20height='32.2'%20rx='1.6'/%3E%3Crect%20x='261.9'%20y='7.8'%20width='3.2'%20height='24.4'%20rx='1.6'/%3E%3Crect%20x='267.5'%20y='12.6'%20width='3.2'%20height='14.7'%20rx='1.6'/%3E%3Crect%20x='273.0'%20y='15.6'%20width='3.2'%20height='8.7'%20rx='1.6'/%3E%3Crect%20x='278.6'%20y='16.2'%20width='3.2'%20height='7.7'%20rx='1.6'/%3E%3Crect%20x='284.1'%20y='16.0'%20width='3.2'%20height='8.1'%20rx='1.6'/%3E%3Crect%20x='289.7'%20y='16.3'%20width='3.2'%20height='7.3'%20rx='1.6'/%3E%3Crect%20x='295.2'%20y='11.7'%20width='3.2'%20height='16.6'%20rx='1.6'/%3E%3Crect%20x='300.8'%20y='5.6'%20width='3.2'%20height='28.9'%20rx='1.6'/%3E%3Crect%20x='306.4'%20y='1.2'%20width='3.2'%20height='37.6'%20rx='1.6'/%3E%3Crect%20x='311.9'%20y='1.1'%20width='3.2'%20height='37.7'%20rx='1.6'/%3E%3Crect%20x='317.5'%20y='5.5'%20width='3.2'%20height='29.0'%20rx='1.6'/%3E%3Crect%20x='323.0'%20y='11.7'%20width='3.2'%20height='16.6'%20rx='1.6'/%3E%3Crect%20x='328.6'%20y='16.4'%20width='3.2'%20height='7.3'%20rx='1.6'/%3E%3Crect%20x='334.1'%20y='16.2'%20width='3.2'%20height='7.7'%20rx='1.6'/%3E%3Crect%20x='339.7'%20y='17.0'%20width='3.2'%20height='6.0'%20rx='1.6'/%3E%3Crect%20x='345.2'%20y='16.5'%20width='3.2'%20height='7.0'%20rx='1.6'/%3E%3Crect%20x='350.8'%20y='15.8'%20width='3.2'%20height='8.5'%20rx='1.6'/%3E%3Crect%20x='356.4'%20y='12.1'%20width='3.2'%20height='15.8'%20rx='1.6'/%3E%3Crect%20x='361.9'%20y='9.1'%20width='3.2'%20height='21.9'%20rx='1.6'/%3E%3Crect%20x='367.5'%20y='9.4'%20width='3.2'%20height='21.1'%20rx='1.6'/%3E%3Crect%20x='373.0'%20y='14.0'%20width='3.2'%20height='11.9'%20rx='1.6'/%3E%3Crect%20x='378.6'%20y='13.1'%20width='3.2'%20height='13.7'%20rx='1.6'/%3E%3Crect%20x='384.1'%20y='7.6'%20width='3.2'%20height='24.8'%20rx='1.6'/%3E%3Crect%20x='389.7'%20y='5.8'%20width='3.2'%20height='28.3'%20rx='1.6'/%3E%3Crect%20x='395.2'%20y='7.8'%20width='3.2'%20height='24.4'%20rx='1.6'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
.sa2 .ms-bar i{border-radius:0;background:linear-gradient(90deg,var(--st-or),var(--st-ye))}
.sa2 .ms-time{color:var(--st-mu);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px}
.sa2 .ms-track audio{color-scheme:dark}
.sa2 .ms-fine{color:var(--st-mu);margin:4px 2px 0}

/* ---------- 4 · after the stage (light): liner-note teaser + CTA with a small Ted corner hint ---------- */
.sa2-after{padding-top:48px}
.sa2 .sa-teaser{margin:0;position:relative;background:#FFFDF8;border:1px solid #E6DED0;border-left:4px solid #7A5AF8}
.sa2 .sa-teaser-k{font-size:20px}
.sa2 .sa-hook span{border-radius:999px;padding:10px 14px}
.sa2 .ms-cta-row{position:relative}
.sa2-ted{display:inline-grid;place-items:center;width:76px;height:76px;border-radius:50%;background:#F3F1FF;border:1px solid #E3DDFB;overflow:hidden}
.sa2-ted img{width:68px;height:auto;display:block;margin-top:10px}

/* ---------- 5 · lesson titles as a set list (static; titles only) ---------- */
.sa-tl-list{background:#fff;border:1px solid var(--line,#D6DCE8)}
.sa-tl-list li{grid-template-columns:56px minmax(0,1fr) auto;padding:16px 20px}
.sa-tl-n{font:800 22px/1 var(--font-d,inherit);color:#5534C9;letter-spacing:-.02em}
.sa-tl-n::before{content:"Nº ";font:700 11px/1 var(--font,inherit);letter-spacing:.08em;color:#5A6283;vertical-align:4px}
.sa-tl-list li:hover{background:#FAF9FF}

/* ---------- 6 · free extras as a calm card deck (four equal cards; no carousel) ---------- */
.sa-deck .pp-incl{padding:0;background:none;box-shadow:none}
.sa-deck .pp-incl ul{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sa-deck .pp-incl li{grid-template-columns:minmax(0,1fr);gap:12px;align-content:start;padding:18px;border-radius:18px;background:#fff;border:1px solid var(--line,#D6DCE8);
  box-shadow:var(--gl-rim,none),var(--gl-drop,none),6px 6px 0 -1px #F3F1FF,6px 6px 0 0 #E3DDFB}
@media (max-width:1100px){.sa-deck .pp-incl ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.sa-deck .pp-incl ul{grid-template-columns:minmax(0,1fr)}.sa-deck .pp-incl li{grid-template-columns:36px minmax(0,1fr);box-shadow:var(--gl-rim,none),var(--gl-drop,none)}}

/* ---------- 7 · teaser card base + drum-pad glow (kept from v1) ---------- */
.sa-teaser{margin:28px 0 0;display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px 40px;align-items:center;padding:26px 30px;
  border:1px solid var(--line,#D6DCE8);border-radius:var(--r-card,22px);background:#fff;box-shadow:var(--gl-rim,none),var(--gl-drop,none)}
.sa-teaser-k{margin:0 0 8px;color:var(--ink,#14204A);font:800 18px/1.3 var(--font-d,inherit)}
.sa-teaser-txt p:last-child{margin:0;color:#3E4866;font-size:16px;line-height:1.6;max-width:64ch}
.sa-hook{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;font:600 13px/1 var(--font,inherit)}
.sa-hook span{padding:9px 12px;border-radius:10px}
.sa-hook-r{background:#5534C9;color:#fff}
.sa-hook-v{background:#F3F5F9;color:#3E4866;border:1px solid var(--line,#D6DCE8)}
.sa-tl{margin:6px 0 18px}
.sa-tl h3{margin:0 0 10px}
.sa-tl-list{list-style:none;margin:0;padding:0;border-radius:18px;box-shadow:var(--gl-rim,none),var(--gl-drop,none);overflow:hidden}
.sa-tl-list li{display:grid;align-items:center;gap:12px;margin:0;border-top:1px solid #EDF0F6}
.sa-tl-list li:first-child{border-top:0}
.sa-tl-t{color:var(--ink,#14204A);font:700 16px/1.35 var(--font,inherit)}
.sa-tl-d{color:var(--muted,#4A5578);font-size:13px;white-space:nowrap}
#try-it{position:relative;isolation:isolate;overflow:hidden}
#try-it::before{content:"";position:absolute;inset:-10% -5%;z-index:-1;pointer-events:none;opacity:.7;
  background:radial-gradient(38% 42% at 18% 30%,rgba(122,90,248,.16),transparent 70%),radial-gradient(34% 40% at 82% 26%,rgba(77,186,229,.16),transparent 70%),radial-gradient(40% 36% at 55% 88%,rgba(245,126,32,.10),transparent 70%);
  animation:saAurora 32s ease-in-out infinite alternate}
@keyframes saAurora{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(2%,-2%,0) scale(1.04)}100%{transform:translate3d(-2%,1.5%,0) scale(1.02)}}

/* ---------- 8 · responsive ---------- */
@media (max-width:1060px){
  .sa2 .ms-panel{grid-template-columns:minmax(0,1fr)}
  .sa2 .ms-panel .ms-list,.sa2 .ms-panel .ms-fine{grid-column:1}
  .sa2-deck{grid-row:auto;grid-template-columns:120px minmax(0,1fr);align-items:center}
  .sa2-vu{grid-column:1 / -1}
}
@media (max-width:860px){.sa-teaser{grid-template-columns:minmax(0,1fr)}.sa-hook{justify-content:flex-start}
  .sa2.ms-js .ms-track,.ms-js.sa2 .ms-track{grid-template-columns:auto minmax(0,1fr)}
  .sa2 .ms-play{grid-row:1 / span 2}}
@media (max-width:640px){
  .sa2-stage{padding:84px 0 112px}
  .sa2-badge{top:-60px;width:78px;padding:10px 6px 8px;font-size:10px}
  .sa2-word{top:26px}
  .sa2-curtain{height:96px;gap:4px}
  .sa2 .sa2-stage .ms-k::before,.sa2 .sa2-stage .ms-k::after{width:16px;margin:0 6px}
  .sa2 .ms-panel{padding:12px;border-radius:20px;gap:12px}
  .sa2-deck{grid-template-columns:84px minmax(0,1fr);gap:12px;padding:12px}
  .sa2-now{font-size:16px}
  .sa2 .ms-track{padding:12px}
  .sa2-after{padding-top:36px}
  .sa-teaser{padding:22px 18px}
  .sa-tl-list li{grid-template-columns:48px minmax(0,1fr);padding:12px 14px}.sa-tl-d{display:none}
}
@media (max-width:360px){.sa2-deck{grid-template-columns:72px minmax(0,1fr)}.sa2 .ms-title{font-size:15.5px}.sa2-badge{display:none}}

/* ---------- 9 · reduced motion: nothing moves ---------- */
@media (prefers-reduced-motion:reduce){
  #try-it::before,.ms-show.sa-on .sa2-rec,.ms-show.sa-on .sa2-ch{animation:none!important}
  .sa2-arm,.sa2 .ms-track{transition:none}
}
html.rm-user #try-it::before,html.rm-user .ms-show.sa-on .sa2-rec,html.rm-user .ms-show.sa-on .sa2-ch{animation:none!important}
html.rm-user .sa2-arm,html.rm-user .sa2 .ms-track{transition:none}

/* ---------- 10 · tap targets >=44px (QA resume 19:43, page-scoped; shared files untouched) ---------- */
#echo-player .gbars-pause,.ma-tk-pause{min-height:44px}
#music-projects .cf-dots{gap:0}
#music-projects .cf-dot{width:44px;height:44px}
.sbar .sbar-seg button{min-height:44px}