.trainer-variants{display:grid;grid-template-columns:auto minmax(0,360px) auto;justify-content:center;align-items:stretch;gap:10px;width:100%;margin:0 auto 14px}
/* Never paint the previous instrument while its replacement is still loading. */
html:not([data-variant-ready=true]) .stage,html:not([data-variant-ready=true]) .character-frame,html:not([data-drum-ready=true]) .stage,html:not([data-drum-ready=true]) .character-frame{visibility:hidden}
.trainer-variants .drum-switch{display:flex;min-width:0;width:auto;max-width:none;margin:0}
.trainer-variants .drum-tab{flex:1;min-width:0}
.trainer-variants a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 16px;border:1px solid var(--line);border-radius:10px;color:var(--ink);background:var(--panel);font:600 14px system-ui,sans-serif;text-decoration:none;white-space:nowrap}
.trainer-variants a[aria-current="page"]{border-color:var(--acid);box-shadow:inset 0 0 0 1px var(--acid)}
.trainer-variants a:focus-visible{outline:3px solid #287f78;outline-offset:3px}
.recording-name{display:grid;gap:6px;margin:12px 0;font-size:.82rem}
.recording-name input{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--panel);color:var(--ink);font:inherit}
.pwa-help{margin:24px auto 12px;max-width:680px;padding:14px;border:1px solid var(--line);border-radius:10px;font-size:.85rem;line-height:1.6}
.pwa-help summary{cursor:pointer;font-weight:600;min-height:30px}
.pwa-help p{margin:10px 0 0}
@media(max-width:520px){.trainer-variants{grid-template-columns:auto minmax(0,1fr) auto;gap:6px}.trainer-variants a{padding:8px 7px;font-size:12px}.trainer-variants .drum-tab{padding:8px 4px;font-size:13px}}
/* Keep the homepage instrument fixed inside its frame, on the same axis as the page button. */
html.embed,html.embed body{height:100%;min-height:0;overflow:hidden}
.embed .pwa-help{display:none!important}
.embed[data-variant=adult] .trainer{width:min(620px,100%,calc(100vh - 68px));width:min(620px,100%,calc(100dvh - 68px));margin:0 auto}
.embed[data-variant=adult] .stage{width:100%;margin-inline:auto}
.embed[data-variant=adult] .play-center{min-width:44px;left:50%;top:50%;transform:translate(-50%,-50%)}