:root{--bg:#11131a;--surface:#191c25;--surface-2:#212530;--line:#303541;--text:#f4f1e8;--muted:#9ca3b2;--accent:#dfff59;--accent-2:#b9d83d;--warm:#ff8d6b;--pico-font-family:"DM Sans",sans-serif;--pico-form-element-background-color:#151820;--pico-form-element-border-color:#353b48;--pico-form-element-color:var(--text);--pico-form-element-active-border-color:var(--accent);--pico-form-element-focus-color:rgba(223,255,89,.18);--pico-primary:var(--accent);--pico-primary-background:var(--accent);--pico-primary-border:var(--accent);--pico-primary-hover-background:var(--accent-2);--pico-primary-hover-border:var(--accent-2);--pico-primary-inverse:#11131a}
*{box-sizing:border-box}body{min-height:100vh;margin:0;color:var(--text);background:radial-gradient(circle at 85% -10%,rgba(223,255,89,.09),transparent 30rem),var(--bg);font-size:15px}.shell{width:min(1080px,calc(100% - 40px));margin:auto;padding:30px 0 70px}.app-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:42px}.brand{display:flex;align-items:center;gap:12px;color:var(--text);font-family:"Syne",sans-serif;font-weight:700;text-decoration:none}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--accent);color:#11131a;font:700 12px "Syne",sans-serif;transform:rotate(-3deg)}.eyebrow,.live-badge{color:var(--muted);font-size:.73rem;letter-spacing:.13em;text-transform:uppercase}.live-badge{display:flex;align-items:center;gap:8px}.live-badge i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px rgba(223,255,89,.1)}
.hero{display:grid;grid-template-columns:1.4fr .8fr;align-items:end;gap:40px;margin:25px 0 55px}.kicker,.card-label{margin:0 0 12px;color:var(--accent);font-size:.7rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase}.hero h1{margin:0;font:700 clamp(2.7rem,6vw,5.5rem)/.93 "Syne",sans-serif;letter-spacing:-.055em}.hero h1 em{display:inline-block;overflow:visible;padding:0 .04em .2em;color:var(--accent);font:700 1em/1.3 "DM Sans",sans-serif;letter-spacing:-.055em;vertical-align:top}.hero>p{max-width:390px;margin:0;color:var(--muted);line-height:1.7}
.settings-card{margin-bottom:16px;padding:30px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9));box-shadow:0 16px 50px rgba(0,0,0,.12)}.primary-settings{border-top-color:rgba(223,255,89,.55)}.section-title{display:flex;gap:18px;margin-bottom:28px}.section-title>span{display:grid;place-items:center;flex:0 0 36px;height:36px;border:1px solid var(--line);border-radius:50%;color:var(--accent);font-size:.72rem;font-weight:700}.section-title h2{overflow:visible;margin:0 0 4px;padding-bottom:.1em;font:600 1.2rem/1.25 "Syne",sans-serif}.section-title p{margin:0;color:var(--muted);font-size:.85rem}.form-grid{display:grid;grid-template-columns:1.5fr .7fr;gap:16px}.form-grid.compact{grid-template-columns:.45fr .55fr}.form-grid.three{grid-template-columns:repeat(3,1fr)}label{margin:0 0 18px;color:#d9dbe2;font-size:.78rem;font-weight:600;letter-spacing:.02em}label b,.form-actions b{color:var(--warm)}label small{float:right;color:var(--muted);font-weight:400}select,input{height:52px;margin-top:8px!important;border-radius:11px!important;font-size:.93rem!important}.form-actions{display:flex;align-items:center;justify-content:space-between;padding-top:18px}.form-actions p{margin:0;color:var(--muted);font-size:.78rem}.form-actions>div{display:flex;gap:10px}.form-actions [role=button],.form-actions button{width:auto;margin:0;border-radius:12px;padding:13px 20px;font-weight:700;text-decoration:none}.secondary-action{border-color:var(--line)!important;background:var(--surface)!important;color:var(--text)!important}.start-action span{padding-left:20px}.phrase-card{position:relative;overflow:hidden;min-height:260px;padding:38px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,#20242e,#181b23);text-align:center}.phrase-card:after{content:"";position:absolute;right:-80px;bottom:-120px;width:280px;height:280px;border:55px solid rgba(223,255,89,.04);border-radius:50%;pointer-events:none}.phrase-card #cintv{margin:30px 0 8px;font:600 clamp(2.1rem,6vw,4.4rem) "Syne",sans-serif;letter-spacing:.08em}.phrase-card #csolmin{color:var(--accent);font-size:1.05rem;letter-spacing:.12em;text-transform:uppercase}.phrase-card #ctone{margin-top:20px;color:var(--muted);font-size:1.05rem;letter-spacing:.12em}
.transport{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}.control-button{display:flex;flex-direction:column;align-items:flex-start;min-height:118px;margin:0;padding:18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);color:var(--text);text-align:left}.control-button:hover{border-color:#505767;background:var(--surface-2)}.control-button span{margin-bottom:auto;color:var(--accent);font-size:1.15rem}.control-button small{color:var(--muted);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase}.control-button.featured{border-color:var(--accent);background:var(--accent);color:#11131a}.control-button.featured span,.control-button.featured small{color:#11131a}.control-button.is-playing{border-color:var(--warm);box-shadow:inset 0 0 0 1px var(--warm)}.control-button.is-playing .play-state{color:var(--warm)}.control-button.featured.is-playing .play-state{color:#11131a}.metronome-card{display:flex;align-items:center;justify-content:space-between;margin-top:14px;padding:25px 30px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.metronome-card p{display:flex;align-items:baseline;gap:8px;margin:0}.metronome-card #tempo{font:600 2.3rem "Syne",sans-serif}.metronome-card p small{color:var(--muted);font-size:.65rem;letter-spacing:.12em}.tempo-controls{display:flex;gap:7px}.tempo-controls button{width:auto;min-width:48px;margin:0;padding:10px 14px;border-color:var(--line);border-radius:10px;background:transparent;color:var(--text)}.tempo-controls .metro-play{min-width:85px;background:var(--text);color:var(--bg)}.tempo-controls .metro-play.is-playing{border-color:var(--warm);background:var(--warm)}.trainer-footer{display:flex;align-items:center;justify-content:space-between;padding-top:24px}.trainer-footer a{color:var(--muted);text-decoration:none}.countdown{width:auto;margin:0;padding:9px 15px;border-color:var(--line);border-radius:99px;background:transparent;color:var(--text);font-size:.78rem}
@media(max-width:720px){.shell{width:min(100% - 24px,1080px);padding-top:18px}.app-header{padding-bottom:25px}.eyebrow{display:none}.hero{grid-template-columns:1fr;gap:20px;margin:25px 0 35px}.hero h1{font-size:clamp(2.6rem,13vw,4rem)}.settings-card{padding:22px 18px}.form-grid,.form-grid.compact,.form-grid.three{grid-template-columns:1fr}.form-actions{align-items:flex-start;gap:20px}.form-actions>div{flex-direction:column;width:100%}.form-actions [role=button],.form-actions button{width:100%;text-align:center}.form-actions p{display:none}.phrase-card{min-height:230px;padding:28px 16px}.transport{grid-template-columns:repeat(2,1fr)}.control-button{min-height:105px}.metronome-card{align-items:flex-start;flex-direction:column;gap:20px;padding:22px}.tempo-controls{width:100%}.tempo-controls button{flex:1;min-width:0;padding-inline:8px}.tempo-controls .metro-play{flex:1.7;min-width:0}}
@media(max-width:380px){.transport{grid-template-columns:1fr}.control-button{min-height:88px}.tempo-change[data-change="-5"],.tempo-change[data-change="5"]{display:none}}
.header-tools{display:flex;align-items:center;gap:22px}.language-switch{display:flex;gap:3px;padding:3px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}.language-switch a{display:grid;place-items:center;min-width:34px;height:28px;padding:0 8px;border-radius:7px;color:var(--muted);font-size:.68rem;font-weight:700;text-decoration:none}.language-switch a.active{background:var(--accent);color:var(--bg)}
select,input{height:56px!important;padding-top:0!important;padding-bottom:0!important;line-height:1.25!important}select{vertical-align:middle!important}.control-button b{color:inherit;font-size:inherit}
@media(max-width:720px){.header-tools{gap:10px}}
.save-status{align-self:center;color:var(--muted);font-size:.72rem;opacity:.55;transition:opacity .2s}.save-status.saving,.save-status.visible{opacity:1}.save-status.saving{color:var(--accent)}[hidden]{display:none!important}
.start-session{width:auto;margin:0;padding:9px 14px;border-radius:10px;font-size:.78rem;white-space:nowrap}.start-session:disabled{opacity:.45}
@media(min-width:1051px){.trainer .start-session{order:3}}
.guitar-tab{position:relative;z-index:1;margin:18px auto 0;padding-top:13px;border-top:1px solid var(--line);text-align:left}.guitar-tab>.card-label{display:block;margin-bottom:7px}.tab-scroll{overflow-x:auto}.guitar-tab table{width:100%;min-width:480px;margin:0;border-collapse:collapse;font-family:"DM Sans",sans-serif;font-size:.66rem}.guitar-tab th,.guitar-tab td{height:19px;padding:0 5px;border:0;background:transparent;text-align:center}.guitar-tab th:first-child{width:28px;color:var(--muted);font-weight:600}.guitar-tab thead th{height:22px;color:var(--accent);font-weight:700}.guitar-tab tbody td{position:relative;border-top:1px solid #505663}.guitar-tab tbody td span{position:relative;z-index:1;display:inline-grid;place-items:center;min-width:18px;height:16px;border-radius:8px;background:var(--surface-2);color:var(--text);font-size:.6rem}.guitar-tab tbody td span:empty{background:transparent}

/* Compact settings layout: keep the controls comfortable while reducing scrolling. */
#options .settings-card{margin-bottom:10px;padding:20px 24px}
#options .section-title{align-items:center;margin-bottom:14px}
#options .section-title>span{flex-basis:32px;height:32px}
#options .section-title h2{font-size:1.05rem}
#options .section-title p{font-size:.78rem}
#options label{margin-bottom:8px}
#options select,#options input{height:48px!important;margin-top:5px!important}
#options .form-grid{gap:10px 14px}
.hero{margin-top:10px;margin-bottom:34px}
.hero h1{font-size:clamp(2.5rem,5vw,4.5rem)}
.app-header{padding-bottom:26px}
@media(max-width:720px){#options .settings-card{padding:18px 16px}#options .section-title{margin-bottom:16px}#options select,#options input{height:52px!important}.hero{margin-bottom:26px}.app-header{padding-bottom:20px}}

/* Desktop dashboard: distribute the three setting groups across the viewport. */
.shell{width:min(1240px,calc(100% - 48px))}
#options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:stretch}
#options .settings-card{display:flex;flex-direction:column;min-width:0;margin:0}
#options .form-grid,#options .form-grid.compact,#options .form-grid.three{grid-template-columns:1fr;gap:5px}
#options .form-actions{grid-column:1/-1}
@media(min-width:721px) and (max-width:1050px){#options{grid-template-columns:repeat(2,minmax(0,1fr))}#options .settings-card:last-of-type{grid-column:1/-1}#options .settings-card:last-of-type .form-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}}
@media(max-width:720px){.shell{width:min(100% - 24px,1240px)}#options{grid-template-columns:1fr;gap:10px}#options .settings-card:last-of-type{grid-column:auto}#options .settings-card:last-of-type .form-grid{grid-template-columns:1fr}}

/* Fit the complete settings home in a standard desktop viewport. */
@media(min-width:1051px){
  .shell{padding-top:10px;padding-bottom:12px}
  .app-header{height:42px;padding-bottom:4px}
  .hero{display:block;margin:8px 0 14px}
  .hero .kicker{margin-bottom:3px}
  .hero h1{overflow:visible;font-size:42px!important;line-height:1.22!important;letter-spacing:-1.8px;white-space:nowrap;padding:0 .08em .16em 0}
  .hero h1 br{display:none}
  .hero h1 br+em{margin-left:.18em}
  .hero>p{display:none}
  #options .settings-card{padding:14px 18px}
  #options .section-title{gap:12px;margin-bottom:8px}
  #options .section-title>span{flex-basis:28px;height:28px}
  #options .section-title h2{font-size:.96rem}
  #options .section-title p{font-size:.7rem;line-height:1.25}
  #options label{position:relative;display:flex;height:100%;min-width:0;flex-direction:column;margin-bottom:3px;font-size:11px!important;line-height:1.2;white-space:nowrap}
  #options label>b,#options label>small{position:absolute;top:0;right:0}
  #options select,#options input{height:42px!important;margin-top:3px!important;font-size:.82rem!important}
  #options label>select,#options label>input{margin-top:auto!important}
  #options .form-grid,#options .form-grid.compact,#options .form-grid.three{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 10px}
  #options .form-actions{padding-top:8px}
  .form-actions [role=button],.form-actions button{padding:10px 16px}

  .trainer .app-header{margin-bottom:0}
  .trainer .phrase-card{display:flex;flex-direction:column;justify-content:center;min-height:150px;padding:18px 24px;border-radius:18px}
  .trainer .phrase-card .card-label{margin-bottom:0}
  .trainer .phrase-card #cintv{margin:12px 0 3px;font-size:38px}
  .trainer .phrase-card #csolmin,.trainer .phrase-card #ctone{font-size:.82rem}
  .trainer .phrase-card #ctone{margin-top:8px}
  .trainer .transport{gap:10px;margin:10px 0}
  .trainer .control-button{display:grid;grid-template-columns:28px 1fr;grid-template-rows:auto auto;align-content:center;column-gap:8px;min-height:72px;padding:12px 14px}
  .trainer .control-button span{grid-row:1/3;margin:auto 0}
  .trainer .control-button small,.trainer .control-button b{grid-column:2;text-align:left}
  .trainer .metronome-card{margin-top:0;padding:12px 18px;border-radius:14px}
  .trainer .metronome-card #tempo{font-size:1.65rem}
  .trainer .tempo-controls button{padding:7px 11px}
  .trainer .trainer-footer{padding-top:10px}
}

/* The two shared fretboard preferences add a third row to Jazz controls. */
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:292px auto minmax(0,1fr)}
  .standards-dashboard .standards-hero{height:292px!important;padding-bottom:16px!important}
  .standards-dashboard .standards-hero .trainer-selectors{flex:0 0 140px}
  .standards-dashboard .chart-sections{margin-top:0!important}
}
.chords-page .inversion-card .focused-keyboard{height:112px;border:1px solid #46505f;border-radius:8px;overflow:hidden;background:#0d1016;box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}
.chords-page .inversion-card .focused-keyboard .piano-key.white{min-width:0}
.chords-page .inversion-card h3{display:flex;align-items:center;min-height:22px;color:#d9e7f7;font-size:.82rem}
.chords-page .inversion-card>p{margin:8px 0;color:#9fc8ed;font-size:.72rem;letter-spacing:.06em}
.chords-page .inversion-card .chord-play{height:36px;padding:5px 12px;border-color:#394556;background:#222936}
.chords-page .chords-workspace{grid-template-columns:minmax(450px,500px) minmax(0,1fr)}
.chords-page .chord-picker{padding:12px}
.chords-page .chord-picker .chord-toolbar{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px 9px;margin-bottom:10px;padding-bottom:10px}
.chords-page .chord-toolbar .chord-settings-title{grid-column:1/-1;margin-bottom:0;padding-bottom:7px;border-bottom:1px solid var(--line)}
.chords-page .chord-toolbar .chord-instrument-row-start{grid-column:1}
.chords-page .chord-toolbar label{width:auto;min-width:0}
.chords-page .chord-toolbar select{width:100%;min-width:0;height:36px!important;margin-top:3px!important;padding:5px 10px;font-size:.8rem}
.chords-page .chord-toolbar label{font-size:.68rem}
.chords-page .chord-picker section+section{margin-top:9px;padding-top:9px}
.chords-page .chord-picker h2{margin-bottom:6px}
@media(max-width:1050px){.chords-page .chords-workspace{grid-template-columns:1fr}.chords-page .chord-picker .chord-toolbar{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.chords-page .chord-picker .chord-toolbar{grid-template-columns:1fr}.chords-page .chord-toolbar .chord-instrument-row-start{grid-column:auto}}

/* Fretboard is the fourth settings block; save status is always last. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options{grid-template-rows:auto auto auto auto auto!important}
  .training-dashboard #options .instrument-settings-card{grid-column:1!important;grid-row:3!important}
  .training-dashboard #options .settings-card:nth-of-type(4){grid-column:1!important;grid-row:4!important}
  .training-dashboard #options .form-actions{grid-column:1!important;grid-row:5!important;position:relative!important}
}





/* Matching control hierarchy on Chords and Jazz Standards. */
.chords-page .chord-settings-title{grid-column:1/-1;color:#8fd8ff!important;margin:0 0 2px!important;padding-bottom:7px;border-bottom:1px solid rgba(143,216,255,.22)}





/* Three-column settings grids reduce the dashboard's vertical footprint. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options .settings-card .form-grid,
  .training-dashboard #options .settings-card .form-grid.compact,
  .training-dashboard #options .settings-card .form-grid.three,
  .training-dashboard #options .settings-card:first-of-type .form-grid,
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:nth-of-type(2) .form-grid,
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid,
  .training-dashboard #options .instrument-settings-card .form-grid,
  .training-dashboard #options .settings-card:nth-of-type(4) .form-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid label:first-child{grid-column:auto!important}
}

/* Training section hierarchy. */



.training-dashboard #options .fret-settings-card{grid-column:1/-1!important;padding-block:9px!important}
.training-dashboard #options .fret-settings-card .section-title{margin-bottom:5px!important}

.training-dashboard #options .fret-settings-card .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options .fret-settings-card{grid-row:4!important}
  .training-dashboard #options .form-actions{grid-row:5!important}
}
#charmony{margin-top:7px;color:var(--warm);font-size:.78rem;font-weight:600;letter-spacing:.05em}
#charmony .harmony-inversion{display:inline-block;padding:2px 7px;border:1px solid rgba(223,255,89,.5);border-radius:999px;background:rgba(223,255,89,.1);color:var(--accent);letter-spacing:.02em}#charmony .harmony-equivalent{color:var(--text);letter-spacing:.02em}
#cintv .harmony-root-label,#csolmin .harmony-root-label,#ctone .harmony-root-label{color:#79f28f;font-weight:800;text-shadow:0 0 10px rgba(66,235,117,.35)}
#cintv .harmony-tone-label,#csolmin .harmony-tone-label,#ctone .harmony-tone-label{color:#ffd84d;font-weight:700}
@media(min-width:721px){.trainer .transport{grid-template-columns:repeat(7,minmax(108px,1fr));gap:7px;overflow-x:auto}.trainer .control-button{grid-template-columns:20px minmax(0,1fr);column-gap:6px;min-height:68px;padding:9px 10px}.trainer .control-button span{font-size:1rem}.trainer .control-button b{font-size:.69rem;line-height:1.1;letter-spacing:-.015em;white-space:nowrap}.trainer .control-button small{font-size:.52rem;white-space:nowrap}}
.transport{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:720px){.transport{grid-template-columns:repeat(2,1fr)}}
@media(max-width:380px){.transport{grid-template-columns:1fr}}
.piano-tab{position:relative;z-index:1;margin:18px auto 0;padding-top:13px;border-top:1px solid var(--line);text-align:left}.piano-tab>.card-label{display:block;margin-bottom:7px}.piano-tab table{width:100%;min-width:480px;margin:0;border-collapse:collapse;font-size:.66rem}.piano-tab th,.piano-tab td{height:20px;padding:0 5px;border:0;text-align:center}.piano-tab thead th{color:var(--accent);background:transparent}.piano-tab tbody th{width:42px;border:1px solid #4b5260;border-radius:2px;color:#11131a;background:#e9e7df}.piano-tab tbody th.black-key{color:#f4f1e8;background:#242832}.piano-tab tbody td{border-top:1px solid #343a46;background:transparent}.piano-tab tbody td span{color:var(--accent);font-size:.72rem}
.piano-now{height:20px;margin-bottom:5px;color:var(--accent);font:600 .72rem "Syne",sans-serif;text-align:center}.piano-keyboard{position:relative;height:62px;margin:0 auto;overflow:hidden;border:2px solid #08090c;border-radius:5px;background:#08090c;box-shadow:0 5px 12px rgba(0,0,0,.32)}.white-keys{display:flex;height:100%}.piano-key{min-width:0;margin:0;padding:0;border-radius:0;pointer-events:none;transition:background .06s,box-shadow .06s,transform .06s}.piano-key.white{position:relative;flex:1;border:0;border-right:1px solid #8e8e8a;background:linear-gradient(90deg,#e8e7e1 0%,#fff 16%,#faf9f4 78%,#d1d0ca 100%);box-shadow:inset 0 -3px 4px rgba(0,0,0,.16)}.piano-key.white:last-child{border-right:0}.piano-key.white span{position:absolute;right:0;bottom:2px;left:0;color:#767676;font-size:.43rem}.piano-key.black{position:absolute;z-index:2;top:0;width:calc(62% / var(--white-count));height:64%;border:1px solid #050505;border-radius:0 0 3px 3px;background:linear-gradient(90deg,#050505 0%,#292929 48%,#070707 100%);box-shadow:1px 3px 4px rgba(0,0,0,.72);transform:translateX(-50%)}.piano-key.white.active{background:var(--accent);box-shadow:inset 0 0 18px rgba(17,19,26,.3)}.piano-key.black.active{background:var(--accent);box-shadow:0 0 16px rgba(223,255,89,.75);transform:translateX(-50%) translateY(2px)}

/* PVPortal-inspired entry menu and jazz charts. */
.portal-header{display:flex;align-items:center;justify-content:space-between;min-height:96px;padding:20px max(32px,calc((100vw - 1240px)/2));border-bottom:1px solid var(--line);background:rgba(17,19,26,.8)}.portal-brand{display:flex;align-items:center;gap:14px;color:var(--text);text-decoration:none}.portal-brand-copy{display:flex;flex-direction:column}.portal-brand-copy strong{font:700 1rem "Syne",sans-serif}.portal-brand-copy small{color:var(--muted);font-size:.62rem;letter-spacing:.13em;text-transform:uppercase}.portal-nav{display:flex;align-items:center;gap:20px}.portal-nav>a{color:var(--muted);font-size:.75rem;text-decoration:none}.portal-nav .language-switch{display:flex}
.entry-shell,.standards-shell{width:min(1240px,calc(100% - 64px));margin:auto}.entry-shell{padding:clamp(55px,8vh,100px) 0}.entry-hero{max-width:850px}.entry-hero h1,.standards-hero h1{overflow:visible;margin:0;padding-bottom:.12em;font:700 clamp(3rem,6vw,6rem)/1.04 "Syne",sans-serif;letter-spacing:-.055em}.entry-hero>p:last-child,.standards-hero>div>p:last-child{max-width:680px;margin:12px 0 0;color:var(--muted)}
.entry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:55px}.entry-card{position:relative;min-height:285px;padding:34px;border:1px solid var(--line);border-radius:20px;background:linear-gradient(145deg,var(--surface-2),var(--surface));color:var(--text);text-decoration:none;transition:.2s}.entry-card:before{content:"";position:absolute;top:-1px;right:20px;left:20px;height:1px;background:var(--accent)}.entry-card:hover{transform:translateY(-4px);border-color:#525968}.entry-number{color:var(--muted);font-size:.65rem}.entry-icon{position:absolute;top:26px;right:30px;color:var(--accent);font:700 1.4rem "Syne",sans-serif}.entry-card h2{margin:50px 0 8px;font:600 2rem "Syne",sans-serif}.entry-card p{color:var(--muted);font-size:.9rem}.entry-open{position:absolute;right:34px;bottom:30px;left:34px;display:flex;justify-content:space-between;color:var(--accent);font-size:.68rem;font-weight:700;text-transform:uppercase}.standards-entry:before{background:var(--warm)}.standards-entry .entry-icon,.standards-entry .entry-open{color:var(--warm)}
.standards-shell{padding:50px 0 80px}.standards-hero{display:grid;grid-template-columns:1.25fr .75fr;align-items:end;gap:50px}.standards-hero h1{font-size:clamp(3rem,5vw,5rem)}.standards-filter{display:grid;grid-template-columns:1fr 110px;gap:12px;margin:0}.standards-filter label{margin:0}.standards-filter select{margin-bottom:0}
.chart-sections{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:18px}.chart-section{margin:0;padding:22px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.chart-section>header{display:flex;align-items:center;gap:10px;margin-bottom:15px}.chart-section>header span{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--line);border-radius:50%;color:var(--accent);font-size:.62rem}.chart-section h3{margin:0;font:600 1rem "Syne",sans-serif}.chord-bars{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #3a404d;border-left:1px solid #3a404d}.chord-bar{min-height:68px;padding:9px;border-right:1px solid #3a404d;border-bottom:1px solid #3a404d}.chord-bar small{display:block;color:#747d8e;font-size:.52rem}.chord-bar strong{display:block;margin-top:7px;font-size:.8rem;white-space:nowrap}
@media(max-width:720px){.portal-header{min-height:78px;padding:14px 18px}.portal-brand-copy small,.portal-nav>a{display:none}.entry-shell,.standards-shell{width:min(100% - 28px,1240px)}.entry-grid,.chart-sections{grid-template-columns:1fr}.standards-hero{grid-template-columns:1fr;gap:25px}.standards-filter{grid-template-columns:1fr 95px}.chord-bars{grid-template-columns:repeat(2,1fr)}}

/* Common compact header and root typography. */
.portal-header,.unified-header{min-height:72px}.unified-header{display:flex!important;align-items:center;justify-content:space-between;height:72px!important;margin-bottom:0;padding:10px 0!important;border-bottom:1px solid var(--line)}
.entry-shell{padding:clamp(38px,5vh,68px) 0}.entry-hero h1{max-width:780px;font-size:clamp(2.6rem,4.4vw,4.7rem);line-height:1.06}.entry-grid{margin-top:38px}
.backing-controls{display:flex;align-items:center;gap:18px;margin:18px 0 2px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.backing-controls>div{display:flex;flex:1;flex-direction:column}.backing-controls small{color:var(--muted);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase}.backing-controls label{width:90px;margin:0;font-size:.62rem}.backing-controls input{height:40px!important;margin:3px 0 0!important}.backing-controls button{width:auto;min-width:170px;margin:0;padding:10px 16px;border-radius:10px;font-size:.75rem;font-weight:700}.backing-controls button.is-playing{border-color:var(--warm);background:var(--warm);color:var(--bg)}.chord-bar{transition:background .12s,box-shadow .12s}.chord-bar.is-playing{position:relative;z-index:1;background:rgba(223,255,89,.13);box-shadow:inset 0 0 0 2px var(--accent)}.chord-bar.is-playing strong{color:var(--accent)}
@media(max-width:720px){.portal-header,.unified-header{min-height:64px;height:64px!important}.entry-hero h1{font-size:clamp(2.35rem,11vw,3.35rem)}.backing-controls{align-items:flex-end;flex-wrap:wrap}.backing-controls>div{flex-basis:100%}.backing-controls button{flex:1;min-width:150px}}
@media(max-width:720px){.portal-nav>a{display:inline;font-size:.65rem;white-space:nowrap}.portal-nav{gap:8px}.unified-header .portal-brand-copy small{display:none}}
.chord-trainer{container-type:inline-size;margin:18px 0;padding:22px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,var(--surface-2),var(--surface))}.chord-trainer-head{display:flex;align-items:end;justify-content:space-between;gap:20px}.chord-trainer-head>div{display:grid;grid-template-columns:auto auto;align-items:baseline;gap:2px 14px}.chord-trainer-head small{grid-column:1/-1;color:var(--accent);font-size:.6rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.chord-trainer-head strong{font:600 2rem "Syne",sans-serif}.chord-trainer-head span{color:var(--muted);font-size:.7rem}.chord-trainer-head label{width:170px;margin:0}.chord-trainer-head select,.chord-trainer-head input{height:42px!important;margin:4px 0 0!important}.standard-fretboard{margin:18px 0}.fret-caption{margin-bottom:5px;color:var(--accent);font-size:.65rem;font-weight:700;text-align:center}.fret-grid{display:grid;grid-template-columns:28px repeat(var(--frets),1fr);min-width:520px;border:1px solid #764520;border-radius:9px;background:linear-gradient(#55301d,#382014);overflow:hidden}.fret-grid>b{padding:4px;color:var(--accent);font-size:.58rem;text-align:center}.fret-grid>strong{display:grid;place-items:center;color:var(--text);font-size:.62rem}.fret-grid>i{position:relative;display:grid;place-items:center;min-height:23px;border-top:1px solid #c2b8a6;border-right:1px solid #9b795d;font-style:normal}.fret-grid>i span{position:relative;z-index:1;display:grid;place-items:center;width:22px;height:22px;border:1px solid #6a7280;border-radius:50%;background:#171b23;color:#fff;font-size:.6rem;font-weight:700}.fret-grid>i span.root{border:3px solid #ff7680;background:#d94555}.song-run-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.song-run-controls button{margin:0;padding:10px;border:1px solid var(--line);border-radius:10px;background:#171a22;color:var(--text);font-size:.72rem}.song-run-controls button:last-child{background:var(--accent);color:var(--bg);font-weight:700}.song-run-controls button.is-playing{background:var(--warm)}.shape-missing{margin:35px;color:var(--muted);text-align:center}
@media(max-width:720px){.chord-trainer{padding:16px}.chord-trainer-head{align-items:flex-start;flex-direction:column}.chord-trainer-head label{width:100%}.standard-fretboard{overflow-x:auto}.song-run-controls{grid-template-columns:repeat(2,1fr)}}
.trainer-selectors{display:flex!important;grid-template-columns:none!important;align-items:stretch!important;flex-wrap:nowrap;gap:10px!important}.trainer-selectors label{display:flex;flex-direction:column;align-items:stretch;width:145px;min-width:0;white-space:nowrap}.trainer-selectors label:first-child{width:86px}.trainer-selectors label:nth-child(2){width:170px}.trainer-selectors select{display:block;width:100%;min-width:0;text-overflow:ellipsis}.trainer-selectors input{display:block;width:100%;min-width:0;text-overflow:clip}.chord-trainer-head em{grid-column:1/-1;color:var(--accent);font-size:.7rem;font-style:normal}.fret-grid>i span:not(.root){border-color:var(--accent);background:var(--accent);color:var(--bg);box-shadow:0 0 10px rgba(223,255,89,.28)}
@media(max-width:1100px){.chord-trainer-head{align-items:stretch!important;flex-direction:column}.trainer-selectors{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;width:100%}.trainer-selectors label,.trainer-selectors label:first-child{width:auto}}
@container (max-width:820px){.chord-trainer-head{align-items:stretch!important;flex-direction:column}.trainer-selectors{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;width:100%}.trainer-selectors label,.trainer-selectors label:first-child{width:auto}}
@media(min-width:900px){.standards-shell{padding:14px 0 28px}.standards-hero{grid-template-columns:.9fr 1.1fr;gap:28px}.standards-hero h1{font-size:38px}.standards-hero .kicker{margin-bottom:2px}.standards-hero>div>p:last-child{display:none}.standards-filter select{height:42px!important}.chord-trainer{margin:8px 0;padding:12px 16px}.chord-trainer-head strong{font-size:1.45rem}.chord-trainer-head select,.chord-trainer-head input{height:36px!important}.standard-fretboard{margin:8px 0}.fret-grid>i{min-height:27px}.song-run-controls button{padding:7px}.chart-sections{grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}.chart-section{padding:10px}.chart-section>header{margin-bottom:6px}.chord-bar{min-height:42px;padding:5px}.chord-bar strong{margin-top:2px;font-size:.67rem}.chord-bars{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.trainer-selectors{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%}.trainer-selectors label,.trainer-selectors label:first-child{width:auto}.chord-trainer-head em{font-size:.62rem}}
.piano-key.scale-note.white{background:linear-gradient(#eff6da,#d8ddca)}.piano-key.scale-note.black{background:linear-gradient(#3b4330,#151912)}.piano-key.chord-note{background:var(--accent)!important;box-shadow:inset 0 0 12px rgba(0,0,0,.25)}.piano-key.root-note{background:#d83f4a!important;box-shadow:inset 0 0 0 3px #ff7a80,0 0 12px rgba(216,63,74,.45)}
.chart-sections.single-section{grid-template-columns:1fr}.chart-sections.single-section .chart-section{width:100%}.chart-sections.single-section .chord-bars{grid-template-columns:repeat(6,minmax(0,1fr))}.chart-sections.single-section .chord-bar{min-height:58px;padding:8px 10px}.chart-sections.single-section .chord-bar strong{font-size:.78rem}
@media(max-width:720px){.chart-sections.single-section .chord-bars{grid-template-columns:repeat(2,minmax(0,1fr))}}
.entry-card h2{overflow:visible;padding-bottom:.16em;line-height:1.22}.chart-section>header{margin:0 0 8px!important;padding:0!important;border:0!important;background:transparent!important}.chart-section>header span{flex:0 0 28px}.chart-sections{position:relative;z-index:0}.chord-trainer{position:relative;z-index:1}
.chord-bar{cursor:pointer}.chord-bar[role=button]{display:block;width:auto;margin:0;border-radius:0;background:#171c26;color:var(--text);box-shadow:none}.chord-bar[role=button]:hover{background:#202733}.chord-bar:hover,.chord-bar:focus-visible{border-color:var(--accent);outline:none;box-shadow:inset 0 0 0 1px rgba(223,255,89,.38)}.chord-bar[role=button].is-playing{background:linear-gradient(135deg,rgba(223,255,89,.16),rgba(223,255,89,.07));box-shadow:inset 0 0 0 2px var(--accent)}.chord-bar[role=button] small{color:#8791a3}.chord-bar[role=button].is-playing small{color:#c9dc75}
.walking-line{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px}.walking-line span{display:flex;align-items:center;justify-content:center;gap:9px;min-height:70px;border:1px solid var(--line);border-radius:10px;background:#171a22;color:var(--accent);font:600 1.2rem "Syne",sans-serif}.walking-line b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--accent);color:var(--bg);font:700 .62rem "DM Sans",sans-serif}
.shared-instrument .walking-tone{border-color:#697282;background:#171b23;color:#d7dde7;box-shadow:none;transition:background .08s,color .08s,box-shadow .08s,transform .08s}.shared-instrument .walking-tone.walking-beat-active{border-color:var(--accent);background:var(--accent);color:var(--bg);box-shadow:0 0 15px rgba(223,255,89,.75);transform:scale(1.18)}
.shared-practice-transport{position:relative;z-index:1;margin:16px 0 0;padding-top:16px;border-top:1px solid var(--line)}
.harmony-palette{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;width:min(100%,680px);margin:16px auto 4px;padding-bottom:9px;border-bottom:1px solid var(--line)}.harmony-palette button{flex:0 0 var(--harmony-width,calc(14.285% - 4px));min-width:0;height:42px;margin:0;padding:5px 4px;border:1px solid var(--line);border-radius:7px;background:rgba(10,13,18,.34);color:var(--text);overflow:hidden}.harmony-palette button small{display:block;color:var(--muted);font-size:.48rem;line-height:1}.harmony-palette button strong{display:block;margin-top:3px;overflow:hidden;font-size:.56rem;line-height:1;text-overflow:ellipsis;white-space:nowrap}.harmony-palette button.sequence-chord{border-color:color-mix(in srgb,var(--sequence-color) 72%,transparent);background:color-mix(in srgb,var(--sequence-color) 13%,transparent)}.harmony-palette button.sequence-chord small{color:var(--sequence-color)}.harmony-palette button[data-sequence-order="1"]{--sequence-color:#79f28f}.harmony-palette button[data-sequence-order="2"]{--sequence-color:#67cfff}.harmony-palette button[data-sequence-order="3"]{--sequence-color:#ffd151}.harmony-palette button[data-sequence-order="4"]{--sequence-color:#ff8b70}.harmony-palette button[data-sequence-order="5"]{--sequence-color:#c99cff}.harmony-palette button[data-sequence-order="6"]{--sequence-color:#59e2d0}.harmony-palette button[data-sequence-order="7"]{--sequence-color:#ff82b2}.harmony-palette button:hover,.harmony-palette button.is-playing{border-color:var(--sequence-color,var(--accent));background:color-mix(in srgb,var(--sequence-color,var(--accent)) 24%,transparent)}@media(max-width:720px){.harmony-palette button{flex-basis:calc((100% - 12px)/4)}}

/* Studio Rizzi identity and jazz atmosphere shared by every app header. */
.portal-header,.unified-header{position:relative;isolation:isolate;overflow:hidden;background:#0a1016 url("/static/images/jazz-header.png") 68% 52%/cover no-repeat;border-bottom-color:rgba(223,255,89,.2);box-shadow:0 10px 28px rgba(0,0,0,.22)}
.portal-header::before,.unified-header::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(6,10,15,.97) 0%,rgba(8,13,19,.9) 40%,rgba(8,13,19,.52) 72%,rgba(8,13,19,.72) 100%);pointer-events:none}
.portal-header>*,.unified-header>*{position:relative}
.portal-header .brand-mark,.unified-header .brand-mark{display:block;width:clamp(132px,13vw,184px);height:46px;border-radius:0;background:transparent url("/static/images/studiorizzi-logo.png") left center/contain no-repeat;color:transparent;font-size:0;transform:none;filter:drop-shadow(0 3px 8px rgba(0,0,0,.5))}
.portal-brand-copy{padding-left:14px;border-left:1px solid rgba(255,255,255,.2)}
.portal-brand-copy small{color:#bec6b3}
.portal-header .language-switch,.unified-header .language-switch{border-color:rgba(255,255,255,.16);background:rgba(10,14,20,.72);backdrop-filter:blur(8px)}
.portal-nav>a{color:#e2e4dc}
@media(max-width:720px){.portal-header .brand-mark,.unified-header .brand-mark{width:118px;height:36px}.portal-brand{gap:10px}.portal-brand-copy{padding-left:10px}.portal-brand-copy strong{font-size:.8rem}}
@media(max-width:480px){.portal-brand-copy{display:none}.portal-header,.unified-header{background-position:64% center}}

/* Full-width, borderless header treatment on every page. */
.portal-header,.unified-header{min-height:92px!important;height:92px!important;border:0!important;box-shadow:none!important}
.unified-header{left:50%;width:100vw;margin-left:-50vw;padding-right:max(24px,calc((100vw - 1240px)/2))!important;padding-left:max(24px,calc((100vw - 1240px)/2))!important}
.portal-header .brand-mark,.unified-header .brand-mark{opacity:.72}
@media(max-width:720px){.portal-header,.unified-header{min-height:78px!important;height:78px!important}.unified-header{padding-right:12px!important;padding-left:12px!important}.portal-header .brand-mark,.unified-header .brand-mark{opacity:.78}}

/* Compact jazz-page intro so the complete trainer fits in a desktop viewport. */
@media(min-width:900px){
  .standards-shell{padding-top:6px;padding-bottom:14px}
  .standards-hero{min-height:52px;gap:20px}
  .standards-hero h1{font-size:28px;line-height:1;margin:0;padding:0}
  .standards-filter{grid-template-columns:minmax(300px,1fr) 110px;gap:10px}
  .standards-filter label{font-size:.66rem;line-height:1}
  .standards-filter select{height:36px!important;margin-top:4px!important}
}

/* One-screen training dashboard: settings and live exercise side by side. */
.training-panel{min-width:0}
.training-placeholder{display:grid;place-content:center;min-height:420px;padding:30px;border:1px dashed var(--line);border-radius:18px;text-align:center}
.training-placeholder h2{font:600 1.5rem "Syne",sans-serif}
.training-placeholder p:last-child{color:var(--muted)}
@media(min-width:900px) and (min-height:720px){
  body.training-dashboard{height:100vh;overflow:hidden}
  .training-dashboard .shell{display:grid;grid-template-columns:minmax(470px,.92fr) minmax(560px,1.08fr);grid-template-rows:92px minmax(0,1fr);gap:10px 14px;width:min(1500px,calc(100% - 32px));height:100vh;padding:0 0 10px}
  .training-dashboard .unified-header{grid-column:1/-1}
  .training-dashboard>.shell>.hero{display:none}
  .training-dashboard #options{grid-column:1;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr) auto auto;gap:8px;height:100%;min-height:0;overflow:hidden}
  .training-dashboard #options .settings-card{padding:11px 13px;border-radius:13px}
  .training-dashboard #options .settings-card:nth-of-type(3){grid-column:1/-1}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
  .training-dashboard #options .section-title{gap:8px;margin-bottom:5px}
  .training-dashboard #options .section-title>span{flex-basis:24px;height:24px;font-size:.58rem}
  .training-dashboard #options .section-title h2{font-size:.88rem}
  .training-dashboard #options .section-title p{display:none}
  .training-dashboard #options label{margin-bottom:3px;font-size:.66rem}
  .training-dashboard #options select,.training-dashboard #options input{height:38px!important;margin-top:3px!important;padding-inline:9px!important;font-size:.76rem!important}
  .training-dashboard #options .form-grid,.training-dashboard #options .form-grid.compact{gap:2px 8px}
  .training-dashboard #options .form-actions{grid-column:1/-1;padding-top:0}
  .training-dashboard #options .form-actions [role=button]{padding:7px 13px;font-size:.7rem}
  .training-dashboard .training-panel{grid-column:2;grid-row:2;display:flex;flex-direction:column;min-height:0;overflow:hidden}
  .training-dashboard .phrase-card{display:flex;flex:1 1 auto;flex-direction:column;min-height:0;padding:12px 14px;border-radius:16px}
  .shared-practice-transport{grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin-top:auto;padding-top:8px}
  .shared-practice-transport .control-button{min-height:65px;padding:7px 8px}
  .shared-practice-transport .control-button span{font-size:.9rem}
  .shared-practice-transport .control-button b{font-size:.58rem;line-height:1.05}
  .shared-practice-transport .control-button small{font-size:.47rem}
  .training-dashboard .tempo-controls button{padding:6px 9px}
  .training-dashboard .countdown{align-self:flex-end;margin-top:4px;padding:5px 10px}
}


/* DM Sans keeps descenders intact in compact headings (g, p, q, y). */
body h1,body h2,body h3,
body .portal-brand-copy strong,
body .section-title h2,
body .training-placeholder h2,
body .chart-section h3{font-family:"DM Sans",sans-serif!important;overflow:visible!important}

/* Let three-digit jazz tempos breathe. */
.chord-trainer .trainer-selectors label:first-child{width:112px;min-width:112px}
.chord-trainer .trainer-selectors label:first-child input{padding-inline:14px!important;font-variant-numeric:tabular-nums}
@media(max-width:1100px){.chord-trainer .trainer-selectors label:first-child{width:auto;min-width:0}}

/* Roomier controls, all aligned with the left edge of their section title. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard .shell{grid-template-columns:minmax(470px,.78fr) minmax(650px,1.22fr)}
  .training-dashboard #options .settings-card,
  .training-dashboard #options .settings-card:first-of-type,
  .training-dashboard #options .settings-card:nth-of-type(3){display:block;padding:14px 16px}
  .training-dashboard #options .section-title{display:block;width:100%;margin:0 0 10px;padding:0 0 7px}
  .training-dashboard #options .section-title h2{margin:0;text-align:left}
  .training-dashboard #options .form-grid,
  .training-dashboard #options .form-grid.compact,
  .training-dashboard #options .form-grid.three,
  .training-dashboard #options .settings-card:first-of-type .form-grid,
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:nth-of-type(2) .form-grid,
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{width:100%;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 12px;margin:0}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact{margin-bottom:9px}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid label:first-child{grid-column:1/-1}
  .training-dashboard #options label{width:100%;font-size:.66rem}
  .training-dashboard #options select,.training-dashboard #options input{width:100%;height:44px!important;padding-inline:11px!important;font-size:.8rem!important}
}

/* Balanced columns: headings above fields and launch controls in a fourth card. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options{height:100%;grid-template-rows:auto auto auto minmax(76px,1fr);align-content:stretch}
  .training-dashboard #options .settings-card,
  .training-dashboard #options .settings-card:first-of-type,
  .training-dashboard #options .settings-card:nth-of-type(3){grid-template-columns:1fr;align-content:start;gap:7px;padding:11px 14px}
  .training-dashboard #options .section-title{grid-column:1/-1;align-self:auto;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.07)}
  .training-dashboard #options .section-title h2{font-size:.82rem}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:first-of-type .form-grid:last-child,
  .training-dashboard #options .settings-card .form-grid{grid-column:1;width:100%}
  .training-dashboard #options .settings-card:first-of-type .form-grid,
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:nth-of-type(2) .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid label:first-child{grid-column:auto}
  .training-dashboard #options .form-actions{grid-column:1;grid-row:4;align-self:stretch;display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;margin:0;padding:12px 14px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9))}
  .training-dashboard #options .form-actions>div{align-items:center}
  .training-dashboard #options .start-action{border-color:#28657a!important;background:#28657a!important;color:#f4f7f6!important;box-shadow:none}
  .training-dashboard #options .start-action:hover{border-color:#347c92!important;background:#347c92!important}
}
@media(max-width:899px), (max-height:719px){body.training-dashboard{overflow:auto}.training-dashboard .training-panel{margin-top:18px}}

/* Dense single-column settings rail: compact cards with horizontal controls. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard .shell{grid-template-columns:minmax(500px,.88fr) minmax(600px,1.12fr)}
  .training-dashboard #options{grid-template-columns:1fr;grid-template-rows:auto auto auto 1fr;align-content:start;gap:7px}
  .training-dashboard #options .settings-card,
  .training-dashboard #options .settings-card:nth-of-type(3){grid-column:1;display:grid;grid-template-columns:118px minmax(0,1fr);align-items:end;gap:8px 12px;min-height:0;padding:9px 12px}
  .training-dashboard #options .settings-card:first-of-type{grid-template-columns:118px minmax(150px,.72fr) minmax(220px,1.28fr)}
  .training-dashboard #options .section-title{align-self:center;margin:0}
  .training-dashboard #options .section-title>span{display:none}
  .training-dashboard #options .section-title h2{font-size:.8rem;line-height:1.1}
  .training-dashboard #options .form-grid,
  .training-dashboard #options .form-grid.compact,
  .training-dashboard #options .form-grid.three,
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:first-of-type .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
  .training-dashboard #options label{min-width:0;margin:0;font-size:.6rem;line-height:1.05}
  .training-dashboard #options select,.training-dashboard #options input{height:34px!important;margin-top:2px!important;padding-inline:7px!important;font-size:.68rem!important}
  .training-dashboard #options .form-actions{grid-row:4;align-self:end}
}
@media(min-width:900px) and (max-width:1180px){
  .training-dashboard .shell{grid-template-columns:minmax(440px,.9fr) minmax(500px,1.1fr)}
  .training-dashboard #options .settings-card,
  .training-dashboard #options .settings-card:first-of-type,
  .training-dashboard #options .settings-card:nth-of-type(3){grid-template-columns:92px minmax(0,1fr)}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact{grid-column:2}
  .training-dashboard #options .settings-card:first-of-type .form-grid:last-child{grid-column:2}
}

/* Narrower, taller settings cards; give the exercise panel more width. */
@media(min-width:1181px) and (min-height:720px){
  .training-dashboard .shell{grid-template-columns:minmax(410px,.7fr) minmax(680px,1.3fr)}
  .training-dashboard #options{grid-template-rows:repeat(3,minmax(118px,auto)) 1fr}
  .training-dashboard #options .settings-card,
  .training-dashboard #options .settings-card:first-of-type,
  .training-dashboard #options .settings-card:nth-of-type(3){grid-template-columns:96px minmax(0,1fr);align-items:center;padding:12px 14px}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact{grid-column:2}
  .training-dashboard #options .settings-card:first-of-type .form-grid:last-child{grid-column:2}
  .training-dashboard #options .form-grid,
  .training-dashboard #options .form-grid.compact,
  .training-dashboard #options .form-grid.three,
  .training-dashboard #options .settings-card:first-of-type .form-grid,
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 9px}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid label:first-child{grid-column:1/-1}
  .training-dashboard #options select,.training-dashboard #options input{height:38px!important;font-size:.72rem!important}
}

/* One continuous execution surface: remove the stepped heading/card edge. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard .training-panel{padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#20242e,#181b23)}
  .training-dashboard .phrase-card{padding:10px 0 0;border:0;border-radius:0;background:transparent;box-shadow:none}
  .training-dashboard .phrase-card::after{display:none}
}
@media(min-width:900px){.standards-hero{align-items:center}.standards-hero .kicker{display:none}.standards-hero h1{font-size:34px;line-height:1}.standards-filter{align-items:end}.chord-trainer{margin-top:6px}.chord-trainer-head{align-items:center}.chord-trainer-head label{font-size:.58rem}.chord-trainer-head select{margin-top:2px!important}}

/* Chord map */
.chords-shell{width:min(1460px,calc(100% - 40px));margin:auto;padding:20px 0 40px}.chords-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:18px}.chords-heading h1{margin:0;font:700 clamp(2rem,4vw,3.6rem)/1 "DM Sans",sans-serif}.chords-heading p{margin:5px 0 0;color:var(--muted)}.chord-toolbar{display:grid;grid-template-columns:150px 190px;gap:10px}.chord-toolbar label{margin:0}.chord-toolbar select{height:44px!important;margin-top:4px!important}.chords-workspace{display:grid;grid-template-columns:minmax(310px,390px) 1fr;gap:14px}.chord-picker,.chord-display{border:1px solid var(--line);border-radius:18px;background:linear-gradient(145deg,#20242e,#181b23)}.chord-picker{padding:16px}.chord-picker section+section{margin-top:13px;padding-top:13px;border-top:1px solid var(--line)}.chord-picker h2{display:flex;align-items:center;gap:9px;margin:0 0 9px;font-size:.8rem}.chord-picker h2 span{color:var(--accent);font-size:.6rem}.chord-options{display:flex;flex-wrap:wrap;gap:6px}.chord-options button{width:auto;margin:0;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:#151820;color:var(--muted);font-size:.65rem}.chord-options button:hover,.chord-options button.active{border-color:var(--accent);background:rgba(223,255,89,.12);color:var(--accent)}.chord-display{min-width:0;padding:18px}.chord-display>header{display:flex;align-items:end;justify-content:space-between;margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--line)}.chord-display h2{margin:0;color:var(--accent);font-size:2.1rem}.chord-display header small,.chord-display header p{color:var(--muted)}.chord-display header p{margin:0;letter-spacing:.09em}.inversion-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.inversion-card{min-width:0;margin:0;padding:12px;border:1px solid var(--line);border-radius:13px;background:rgba(10,13,18,.32)}.inversion-card h3{margin:0 0 8px;font-size:.75rem}.inversion-card>p{margin:6px 0 0;color:var(--muted);font-size:.65rem;text-align:center}.inversion-card .piano-keyboard{height:82px}.inversion-card .guitar-tab{width:100%;margin:0;padding:0;border:0}.inversion-card .guitar-tab .fretboard table{min-width:500px;height:110px}.inversion-card.unavailable{display:grid;place-content:center;min-height:142px;border-style:dashed;text-align:center;opacity:.6}.entry-grid:has(.chords-entry){grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:900px){.chords-heading{align-items:stretch;flex-direction:column}.chord-toolbar{grid-template-columns:1fr 1fr}.chords-workspace{grid-template-columns:1fr}.inversion-grid{grid-template-columns:1fr}.entry-grid:has(.chords-entry){grid-template-columns:1fr}}
.chords-page .chord-toolbar{grid-template-columns:repeat(2,minmax(130px,170px));gap:8px 10px}
.chords-page .inversion-card h3 small{color:var(--muted);font-size:.56rem;font-weight:500}.chords-page .inversion-card .tab-scroll{overflow:hidden}.chords-page .inversion-card .guitar-tab .fretboard table{width:100%;min-width:0;height:110px}.chords-page .inversion-card .guitar-tab .fretboard th:first-child{width:25px}.chords-page .inversion-card .guitar-tab .fretboard th,.chords-page .inversion-card .guitar-tab .fretboard td{padding:0}.chords-page .inversion-card .guitar-tab .fretboard td span:not(:empty){width:23px;height:23px;font-size:.62rem}.chords-page .inversion-card .guitar-tab td.double-marker::before{width:7px;height:7px}
.chords-page .chords-shell{padding-top:12px}.chords-page .chords-workspace{align-items:stretch;min-height:calc(100vh - 116px)}.chords-page .chord-picker,.chords-page .chord-display{height:100%}.chords-page .chord-picker .chord-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 10px;margin:0 0 14px;padding:0 0 14px;border-bottom:1px solid var(--line)}.chords-page .chord-picker .chord-toolbar+section{margin-top:0;padding-top:0;border-top:0}.chords-page .standard-fretboard.guitar-tab td span.bass-note{border:3px solid #ff7a80;background:#d83f4a;color:#fff;box-shadow:0 0 0 3px rgba(216,63,74,.18),0 0 14px rgba(255,79,93,.55)}.chords-page .standard-fretboard.guitar-tab td span.tonic-marker{border:3px solid #79f28f;background:#20b85a;color:#07130b;box-shadow:0 0 0 3px rgba(32,184,90,.18),0 0 14px rgba(66,235,117,.6)}.chords-page .standard-fretboard.guitar-tab td span.chord-tone{border-color:#ffd84d;background:#ffd84d;color:#11131a;box-shadow:0 0 12px rgba(255,216,77,.45)}.chords-page .piano-key.bass-note{background:#d83f4a!important;box-shadow:inset 0 0 0 3px #ff7a80!important}.chords-page .piano-key.tonic-note{background:#20b85a!important;box-shadow:inset 0 0 0 3px #79f28f!important}.chords-page .piano-key.chord-note{background:#ffd84d!important}
.chords-page .chord-play{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:34px;margin:8px 0 0;padding:5px 12px;border:1px solid var(--line);border-radius:8px;background:#202630;color:var(--text);font-size:.68rem;font-weight:700}.chords-page .chord-play span{color:var(--accent)}.chords-page .chord-play:hover,.chords-page .chord-play.is-playing{border-color:var(--accent);background:rgba(223,255,89,.12)}

/* Compact home launch cards with stronger section symbols. */
.portal-page .entry-card{min-height:220px;padding:24px 26px;border-radius:16px}.portal-page .entry-icon{top:18px;right:24px;font-size:2.45rem;line-height:1}.portal-page .entry-card h2{margin:36px 0 6px;font-size:1.55rem}.portal-page .entry-card p{max-width:90%;font-size:.8rem;line-height:1.45}.portal-page .entry-open{right:26px;bottom:20px;left:26px}
.chords-page .chord-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.chords-page .chord-options button{width:100%;min-width:0;height:32px;padding:5px 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chord-options button.pro-locked{display:inline-flex;align-items:center;justify-content:center;gap:4px;opacity:.45;cursor:not-allowed}.chord-options button.pro-locked small{font-size:.45rem;letter-spacing:.06em}.standard-catalog-results button.pro-locked{opacity:.48;cursor:not-allowed}.standard-catalog-results button.pro-locked small{color:var(--muted)}
@media(max-width:520px){.chords-page .chord-options{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Definitive desktop settings layout. Keep this last to avoid legacy cascade conflicts. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard .shell{grid-template-columns:minmax(500px,42%) minmax(0,58%)!important}
  .training-dashboard #options{grid-template-columns:1fr!important;grid-template-rows:auto auto auto minmax(76px,1fr)!important;align-content:stretch!important}
  .training-dashboard #options .settings-card,
  .training-dashboard #options .settings-card:first-of-type,
  .training-dashboard #options .settings-card:nth-of-type(3){display:block!important;grid-column:1!important;min-width:0!important;padding:14px 16px!important}
  .training-dashboard #options .section-title{display:block!important;width:100%!important;margin:0 0 10px!important;padding:0 0 7px!important;border-bottom:1px solid rgba(255,255,255,.07)}
  .training-dashboard #options .section-title h2{margin:0!important;font-size:.88rem!important;text-align:left!important}
  .training-dashboard #options .form-grid,
  .training-dashboard #options .form-grid.compact,
  .training-dashboard #options .form-grid.three,
  .training-dashboard #options .settings-card:first-of-type .form-grid,
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:nth-of-type(2) .form-grid,
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid{display:grid!important;grid-column:auto!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;gap:10px 14px!important;margin:0!important}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact{margin-bottom:10px!important}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid label:first-child{grid-column:1/-1!important}
  .training-dashboard #options label{display:block!important;width:100%!important;min-width:0!important;margin:0!important;font-size:.68rem!important;line-height:1.15!important}
  .training-dashboard #options select,
  .training-dashboard #options input{display:block!important;width:100%!important;min-width:0!important;height:44px!important;margin:4px 0 0!important;padding:0 12px!important;font-size:.82rem!important}
  .training-dashboard #options .form-actions{grid-column:1!important;grid-row:4!important;align-self:stretch!important;margin:0!important}
}

/* Equal column bottoms and clearer two-row playback controls. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options,
  .training-dashboard .training-panel{height:100%!important;max-height:100%!important}
  .training-dashboard #options .form-actions,
  .training-dashboard .training-panel{box-sizing:border-box}
  .shared-practice-transport{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
  .shared-practice-transport .control-button{min-height:56px!important;padding:7px 10px!important}
  .shared-practice-transport .control-button b{overflow:visible!important;font-size:.62rem!important;line-height:1.15!important;white-space:normal!important;text-overflow:clip!important}
  .shared-practice-transport .control-button small{font-size:.48rem!important}
  .shared-practice-transport .control-button:nth-last-child(-n+3){min-height:50px!important}
  .training-dashboard .countdown{display:none!important}
}

@media(min-width:900px) and (min-height:720px){
  .shared-practice-transport{grid-template-columns:repeat(8,minmax(0,1fr))!important}
  .shared-practice-transport .control-button{grid-column:span 2}
  .shared-practice-transport .control-button:nth-child(5){grid-column:2/span 2}
  .shared-practice-transport .control-button:nth-child(6){grid-column:4/span 2}
  .shared-practice-transport .control-button:nth-child(7){grid-column:6/span 2}
}

/* The unified dashboard is already live: no separate start action is needed. */
.training-dashboard #start-training{display:none!important}
.training-dashboard #options .form-actions{grid-template-columns:1fr auto!important}
.training-dashboard #options .form-actions>div{justify-content:flex-end}

/* Give heading descenders room and spend the spare height on the useful cards. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options{grid-template-rows:1fr 1fr 1.25fr auto!important}
  .training-dashboard #options .section-title{border-bottom:1px solid rgba(255,255,255,.07)!important;padding-bottom:7px!important}
  .training-dashboard #options .section-title h2{overflow:visible!important;padding-bottom:.16em!important;line-height:1.3!important}
  .training-dashboard #options .form-actions{min-height:72px!important;max-height:82px!important;padding-block:10px!important}
}

/* Keep the two-column desktop dashboard, but always let the settings cards
   determine their row height. Fixed fractional rows made controls spill into
   the following card at intermediate window sizes and browser zoom levels. */
@media(min-width:900px) and (min-height:720px){
  body.training-dashboard{height:auto;overflow:auto}
  .training-dashboard .shell{height:auto;min-height:100vh;grid-template-rows:92px auto;padding-bottom:16px}
  .training-dashboard #options{
    height:auto!important;
    max-height:none!important;
    align-self:stretch!important;
    overflow:visible;
    grid-template-rows:auto auto auto auto!important;
    align-content:start!important;
    gap:0!important;
    padding:0 0 12px;
    border:1px solid var(--line);
    border-top-color:rgba(223,255,89,.55);
    border-radius:18px;
    background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9));
  }
  .training-dashboard #options .settings-card{
    min-height:max-content;
    margin:0!important;
    padding:8px 16px!important;
    border:0!important;
    border-bottom:1px solid var(--line)!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
  }
  .training-dashboard #options .section-title{margin-bottom:5px!important;padding-bottom:4px!important}
  .training-dashboard #options .form-grid,
  .training-dashboard #options .form-grid.compact,
  .training-dashboard #options .form-grid.three{gap:4px 14px!important}
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact{margin-bottom:4px!important}
  .training-dashboard #options label{font-size:.63rem!important;line-height:1.05!important}
  .training-dashboard #options select,
  .training-dashboard #options input{height:36px!important;margin-top:2px!important;font-size:.76rem!important}
  .training-dashboard #options .form-actions{
    align-self:auto!important;
    min-height:42px!important;
    margin:0!important;
    padding:6px 16px 0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
  }
  .training-dashboard .training-panel{height:100%!important;max-height:none!important;min-height:0;align-self:stretch;overflow:visible}
}

/* Hide dashboard scrollbars without disabling wheel, trackpad or touch scroll. */
.training-dashboard,
.training-dashboard *{scrollbar-width:none}
.training-page{scrollbar-width:none}
.training-page::-webkit-scrollbar,
.training-dashboard::-webkit-scrollbar,
.training-dashboard *::-webkit-scrollbar{display:none;width:0;height:0}

@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options select:not([multiple]):not([size]){
    padding-right:1.75rem!important;
    background-position:right .7rem center!important;
    background-size:.62rem auto!important;
    font-size:.69rem!important;
  }
  .training-dashboard #options select option,
  .training-dashboard #options select optgroup{font-size:.69rem}
}

/* Full-height Jazz Standards dashboard: chord chart on the left, live trainer
   on the right, with both main surfaces sharing the same top and bottom. */
@media(min-width:900px) and (min-height:720px){
  .jazz-page,
  body.standards-dashboard{height:100%;overflow:hidden;scrollbar-width:none}
  .jazz-page::-webkit-scrollbar,
  body.standards-dashboard::-webkit-scrollbar,
  body.standards-dashboard *::-webkit-scrollbar{display:none;width:0;height:0}
  .standards-dashboard .standards-shell{
    display:grid;
    grid-template-columns:minmax(380px,42%) minmax(0,58%);
    grid-template-rows:70px auto minmax(0,1fr);
    gap:8px 14px;
    width:min(1500px,calc(100% - 32px));
    height:calc(100vh - 92px);
    padding:6px 0 12px;
  }
  .standards-dashboard .standards-hero{
    grid-column:1/-1;
    grid-row:1;
    min-height:0;
    height:70px!important;
    padding:6px 16px;
    border:1px solid var(--line);
    border-top-color:rgba(223,255,89,.55);
    border-radius:16px;
    background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9));
  }
  .standards-dashboard .chart-sections{
    grid-column:1;
    grid-row:3;
    align-content:start;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0;
    min-height:0;
    margin:0;
    padding:8px;
    overflow:auto;
    border:1px solid var(--line);
    border-top:1px solid rgba(255,255,255,.07);
    border-radius:0 0 18px 18px;
    background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9));
    scrollbar-width:none;
  }
  .standards-dashboard .chart-sections::-webkit-scrollbar{display:none}
  .standards-dashboard .chart-section{
    padding:9px 10px;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.07);
    border-radius:0;
    background:transparent;
  }
  .standards-dashboard .chart-sections.single-section{grid-template-columns:1fr}
  .standards-dashboard .chord-trainer{
    grid-column:2;
    grid-row:2/4;
    display:flex;
    min-height:0;
    height:100%;
    margin:0;
    flex-direction:column;
    overflow:hidden;
  }
  .standards-dashboard .song-run-controls{margin-top:auto}
}

/* Jazz controls belong to the chart column; the right panel stays focused on
   the live instrument and transport. */
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:142px auto minmax(0,1fr)}
  .standards-dashboard .standards-hero{
    grid-column:1;
    height:142px!important;
    display:grid;
    grid-template-columns:1fr;
    grid-template-rows:30px 43px 43px;
    align-items:end;
    gap:4px;
    padding:8px 12px;
  }
  .standards-dashboard .standards-hero>div{align-self:center}
  .standards-dashboard .standards-hero h1{font-size:1.35rem!important;line-height:1!important}
  .standards-dashboard .standards-filter{grid-template-columns:minmax(0,1fr) 76px;gap:8px}
  .standards-dashboard .standards-hero .trainer-selectors{
    display:grid!important;
    grid-template-columns:74px repeat(4,minmax(0,1fr))!important;
    align-items:end!important;
    gap:7px!important;
    width:100%;
  }
  .standards-dashboard .standards-hero label,
  .standards-dashboard .standards-hero .trainer-selectors label,
  .standards-dashboard .standards-hero .trainer-selectors label:first-child{
    width:auto!important;
    min-width:0!important;
    margin:0;
    font-size:.56rem;
    line-height:1;
  }
  .standards-dashboard .standards-hero select,
  .standards-dashboard .standards-hero input{
    width:100%;
    height:32px!important;
    margin-top:3px!important;
    padding-inline:9px!important;
    font-size:.67rem!important;
  }
  .standards-dashboard .chord-trainer{grid-row:1/4}
  .standards-dashboard .chord-trainer-head{align-items:flex-start!important}
}

@media(min-width:900px) and (max-width:1499px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:202px auto minmax(0,1fr)}
  .standards-dashboard .standards-hero{
    display:flex!important;
    height:202px!important;
    flex-direction:column;
    align-items:stretch!important;
    justify-content:flex-start;
    gap:7px;
  }
  .standards-dashboard .standards-hero>div:first-child{flex:0 0 28px}
  .standards-dashboard .standards-filter{flex:0 0 42px}
  .standards-dashboard .standards-hero .trainer-selectors{
    flex:0 0 94px;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    align-content:start!important;
    gap:5px 8px!important;
  }
  .standards-dashboard .standards-hero .trainer-selectors input,
  .standards-dashboard .standards-hero .trainer-selectors select{height:30px!important;margin-top:2px!important}
  .standards-dashboard .chart-section{padding:6px 8px}
  .standards-dashboard .chart-section>header{margin-bottom:4px!important}
  .standards-dashboard .chord-bar{min-height:36px;padding:3px 5px}
}

/* Final layout overrides: eight Jazz controls and clearer chord-picker groups. */
.chords-page .chord-picker h2{color:var(--warm);letter-spacing:.025em}
.chords-page .chord-picker h2 span{color:var(--accent)}
.chords-page .chord-toolbar label{color:#8fd8ff}
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:292px auto minmax(0,1fr)}
  .standards-dashboard .standards-hero{height:292px!important;padding-bottom:16px!important}
  .standards-dashboard .standards-hero .trainer-selectors{flex:0 0 140px}
  .standards-dashboard .chart-sections{margin-top:0!important}
}

/* Definitive training settings order and compact three-column layout. */
@media(min-width:900px) and (min-height:720px){
  .training-dashboard #options{grid-template-rows:auto auto auto auto auto!important}
  .training-dashboard #options .instrument-settings-card{grid-column:1!important;grid-row:3!important}
  .training-dashboard #options .settings-card:nth-of-type(4){grid-column:1!important;grid-row:4!important}
  .training-dashboard #options .form-actions{grid-column:1!important;grid-row:5!important;position:relative!important}
  .training-dashboard #options .settings-card .form-grid,
  .training-dashboard #options .settings-card .form-grid.compact,
  .training-dashboard #options .settings-card .form-grid.three,
  .training-dashboard #options .settings-card:first-of-type .form-grid,
  .training-dashboard #options .settings-card:first-of-type .form-grid.compact,
  .training-dashboard #options .settings-card:nth-of-type(2) .form-grid,
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid,
  .training-dashboard #options .instrument-settings-card .form-grid,
  .training-dashboard #options .settings-card:nth-of-type(4) .form-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .training-dashboard #options .settings-card:nth-of-type(3) .form-grid label:first-child{grid-column:auto!important}
  .training-dashboard #options .settings-card{padding:11px 17px!important}
  .training-dashboard #options .section-title{margin-bottom:8px!important;padding-bottom:6px!important}
  .training-dashboard #options .settings-card .form-grid{gap:8px 13px!important}
  .training-dashboard #options label{line-height:1.15!important}
}

/* Shared back-to-menu action. */
.portal-nav>a{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:7px 13px;
  border:1px solid rgba(223,255,89,.58);
  border-radius:10px;
  background:rgba(223,255,89,.09);
  color:var(--accent)!important;
  font-size:.7rem!important;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  transition:background .16s,border-color .16s,transform .16s;
}
.portal-nav>a::before{content:'←';margin-right:7px;font-size:.8rem}
.portal-nav>a:hover{border-color:var(--accent);background:var(--accent);color:var(--bg)!important;transform:translateY(-1px)}

/* One palette and one set of semantic rules for every screen. */
.theme-toggle{display:grid;place-items:center;width:34px;height:34px;margin:0;padding:0;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--accent);font-size:1rem;line-height:1}
.theme-toggle:hover{border-color:var(--accent);background:var(--surface-2)}
.theme-toggle-floating{position:fixed;z-index:1000;top:14px;right:14px}
html[data-theme="light"]{--bg:#eef2f5;--surface:#fff;--surface-2:#e7edf2;--line:#c8d1da;--text:#17202a;--muted:#65717e;--accent:#587900;--accent-2:#456100;--warm:#bf4d2d;--pico-background-color:var(--bg);--pico-color:var(--text);--pico-muted-color:var(--muted);--pico-card-background-color:var(--surface);--pico-form-element-background-color:var(--surface);--pico-form-element-border-color:var(--line);--pico-form-element-color:var(--text);--pico-form-element-active-border-color:var(--accent);--pico-form-element-focus-color:rgba(88,121,0,.18);--pico-primary:var(--accent);--pico-primary-background:var(--accent);--pico-primary-border:var(--accent);--pico-primary-hover-background:var(--accent-2);--pico-primary-hover-border:var(--accent-2);--pico-primary-inverse:#fff}
html[data-theme="light"] body{background:radial-gradient(circle at 85% -10%,rgba(88,121,0,.1),transparent 30rem),var(--bg);color:var(--text)}
html[data-theme="light"] :is(.portal-header,.unified-header){border-color:var(--line);background-color:var(--surface);box-shadow:0 8px 24px rgba(31,45,58,.13)}
html[data-theme="light"] :is(article,section,aside,dialog>article,.settings-card,.phrase-card,.entry-card){border-color:var(--line);color:var(--text)}
html[data-theme="light"] :is(input,select,textarea,button,.control-button,.chord-bar){border-color:var(--line);background-color:var(--surface);color:var(--text)}
html[data-theme="light"] :is(label,.portal-brand,.portal-brand-copy strong,.chord-bar strong){color:var(--text)}
html[data-theme="light"] :is(small,.portal-brand-copy small,.chord-bar small){color:var(--muted)}
html[data-theme="light"] :is(.featured,.active,.is-playing){border-color:var(--accent)}
/* Semantic groups for the Jazz choices. */
.standards-dashboard .selector-group-title{
  grid-column:1/-1;
  margin:0;
  padding:0 0 4px;
  border-bottom:1px solid var(--line);
  font:700 .72rem/1.2 "Syne",sans-serif;
  letter-spacing:.02em;
}








@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:344px auto minmax(0,1fr)}
  .standards-dashboard .standards-hero{height:344px!important}
  .standards-dashboard .standards-filter{flex-basis:64px!important;align-content:start}
  .standards-dashboard .standards-hero .trainer-selectors{flex-basis:190px!important;align-content:start!important}
  .standards-dashboard .selector-group-title{font-size:.68rem}
  .standards-dashboard .chart-sections{gap:7px!important;padding:8px!important}
  .standards-dashboard .chart-section{padding:6px 8px!important}
  .standards-dashboard .chart-section>header{min-height:24px;margin-bottom:3px!important}
  .standards-dashboard .chart-section>header span{width:24px;height:24px}
  .standards-dashboard .chart-section h3{font-size:.88rem}
  .standards-dashboard .chord-bar{min-height:27px!important;padding:2px 5px!important}
  .standards-dashboard .chord-bar small{font-size:.4rem;line-height:1}
  .standards-dashboard .chord-bar strong{margin-top:1px;font-size:.64rem;line-height:1.05}
}
.training-dashboard #options .instrument-settings-card .guitar-options-start{grid-column:1!important}
.standards-dashboard .chord-bars{border-color:var(--accent)!important}
.standards-dashboard .chord-bar{border-color:var(--accent)!important}
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:410px auto minmax(0,1fr)!important}
  .standards-dashboard .standards-hero{height:410px!important}
  .standards-dashboard .standards-hero .trainer-selectors{flex-basis:250px!important}
}

/* Shared desktop geometry for the three working areas. */
@media(min-width:1100px){
  :root{--function-left-panel:630px}
  .training-dashboard .shell,
  .chords-page .chords-workspace,
  .standards-dashboard .standards-shell{
    grid-template-columns:var(--function-left-panel) minmax(0,1fr)!important;
  }
  .training-dashboard #options .instrument-settings-card .form-grid,
  .chords-page .chord-picker .chord-toolbar,
  .standards-dashboard .standards-hero .trainer-selectors{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

.context-nav{display:flex;align-items:center;height:42px;padding:3px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--surface) 82%,transparent);backdrop-filter:blur(8px)}
.context-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:7px 10px;border-radius:8px;color:var(--text);font-size:.68rem;font-weight:700;line-height:1;text-decoration:none;white-space:nowrap}
.context-nav a:hover{color:var(--accent)}
.context-nav a.active{background:var(--accent);color:var(--bg)}
.context-nav a{box-sizing:border-box;border:0;font-variation-settings:"wght" 700}
.play-state{display:inline-block!important;width:1.15em;line-height:1;text-align:center}

/* Shared compact selector geometry for Training and Songs. */
.training-dashboard #options label,
.standards-dashboard .standards-filter label,
.standards-dashboard .trainer-selectors label{
  min-width:0!important;
  margin:0!important;
  font-size:.55rem!important;
  line-height:1!important;
}
.training-dashboard #options :is(select,input:not([type="hidden"])),
.standards-dashboard .standards-filter :is(select,input:not([type="hidden"])),
.standards-dashboard .trainer-selectors :is(select,input:not([type="hidden"])){
  display:block!important;
  width:100%!important;
  min-width:0!important;
  height:30px!important;
  margin:2px 0 0!important;
  padding:0 7px!important;
  font-size:.66rem!important;
}
.chords-page .chord-toolbar label{min-width:0!important;margin:0!important;font-size:.63rem!important;line-height:1.05!important}.chords-page .chord-toolbar :is(select,input:not([type="hidden"])){display:block!important;width:100%!important;min-width:0!important;height:36px!important;margin:2px 0 0!important;padding:0 9px!important;font-size:.76rem!important}
@media(max-width:900px){.portal-nav>a{display:none}.portal-nav{gap:8px}.context-nav a{padding:6px 8px;font-size:.62rem}}
@media(max-width:620px){.portal-brand-copy{display:none}.context-nav a{padding:5px 6px;font-size:.56rem}.portal-header .portal-nav,.unified-header .portal-nav{margin-left:auto}}
@media(max-width:480px){.portal-header .brand-mark,.unified-header .brand-mark{width:76px}.language-switch{display:none!important}.portal-nav{gap:5px}.context-nav a{padding:5px;font-size:.52rem}}

/* One fretboard geometry across Training, Chords and Standards. */
.guitar-tab .fretboard table{width:100%!important;min-width:0!important;height:auto!important;min-height:0!important;table-layout:fixed}
.guitar-tab .fretboard th:first-child{width:34px!important}
.guitar-tab .fretboard thead th{height:18px;padding:0!important}
.guitar-tab .fretboard tbody th,.guitar-tab .fretboard tbody td{height:18px;padding:0!important}
.guitar-tab .fretboard td span:not(:empty){width:25px!important;height:25px!important;font-size:.67rem!important}
.guitar-now.fretboard-warning{display:block!important;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:rgba(255,255,255,.025);color:var(--muted)!important;font-size:.68rem!important;line-height:1.35;text-align:left!important}.guitar-now.fretboard-warning::before{content:"ⓘ";margin-right:7px;color:var(--accent)}

/* Full header rail: identity left, context controls right. */
.portal-header,.unified-header{width:100vw!important;max-width:none!important;padding-right:24px!important;padding-left:24px!important}
.portal-header .portal-brand,.unified-header .portal-brand{margin-right:auto}
.portal-header .portal-nav,.unified-header .portal-nav{margin-left:auto}
@media(max-width:720px){.portal-header,.unified-header{padding-right:12px!important;padding-left:12px!important}}

/* Accounts and commercial administration. */
.account-page,.admin-page{min-height:100vh}.account-shell{width:min(460px,calc(100% - 32px));margin:auto;padding:50px 0}.account-shell>.portal-brand{margin-bottom:28px}.account-card,.admin-create,.admin-user{border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:0 16px 50px rgba(0,0,0,.14)}.account-card{padding:28px}.account-card h1{margin:0 0 22px}.account-error{padding:10px;border-radius:8px;background:rgba(255,141,107,.12);color:var(--warm)}.admin-shell{width:min(1200px,calc(100% - 32px));margin:auto;padding:28px 0 60px}.admin-create{padding:20px}.admin-create h1{margin-top:0}.admin-create form{display:grid;grid-template-columns:1fr 1.4fr 1fr auto;gap:10px}.admin-create input,.admin-create button,.grant-form input,.grant-form button,.admin-user form button,.portal-nav form,.portal-nav form button{margin:0!important}.admin-users{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px}.admin-user{padding:18px}.admin-user>header{display:flex;align-items:center;justify-content:space-between}.admin-user>header div{display:flex;flex-direction:column}.admin-user small{color:var(--muted)}.plan-badge{padding:5px 9px;border-radius:999px;background:#303541;color:var(--muted);font-size:.65rem;font-weight:800}.plan-badge.pro{background:var(--accent);color:var(--bg)}.grant-list{margin:14px 0}.grant-list>div{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px solid var(--line);font-size:.72rem}.grant-form{display:grid;grid-template-columns:1fr 145px auto;gap:8px;margin:12px 0}.grant-form input{height:40px!important}.admin-user button{width:auto;padding:8px 11px;font-size:.7rem}.admin-user .secondary{border-color:var(--line);background:transparent;color:var(--text)}@media(max-width:760px){.admin-create form,.grant-form,.admin-users{grid-template-columns:1fr}.admin-users{display:grid}}
.songs-admin-heading{display:flex;align-items:end;justify-content:space-between}.songs-admin-heading h1,.songs-admin-heading p{margin:0}.song-admin-list{margin-top:14px;border:1px solid var(--line);border-radius:16px;background:var(--surface);overflow:hidden}.song-admin-row{display:grid;grid-template-columns:minmax(210px,2fr) 80px minmax(130px,1fr) 120px minmax(130px,1fr) 150px;align-items:center;gap:12px;margin:0;padding:13px 18px;border-bottom:1px solid var(--line)}.song-admin-row:last-child{border-bottom:0}.song-admin-row>div:first-child,.song-admin-row>span{display:flex;flex-direction:column}.song-admin-row small{color:var(--muted);font-size:.65rem}.song-admin-labels{background:rgba(255,255,255,.025);color:var(--muted);font-size:.62rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.song-admin-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px}.song-admin-actions a,.song-admin-actions button,.visibility-form button{width:auto;margin:0!important;padding:7px 10px;font-size:.68rem}.song-admin-actions form,.visibility-form{margin:0}.visibility-form button{padding:2px 0!important;border:0;background:transparent;color:var(--accent);font-size:.6rem}.song-admin-actions .secondary{border-color:var(--line);background:transparent;color:var(--warm)}.admin-empty{padding:28px;text-align:center;color:var(--muted)}@media(max-width:850px){.song-admin-labels{display:none}.song-admin-row{grid-template-columns:1fr 1fr}.song-admin-actions{justify-content:flex-start}.songs-admin-heading{align-items:flex-start;flex-direction:column;gap:8px}}
.songs-admin-shell .song-admin-row{grid-template-columns:minmax(190px,2fr) 72px 115px 125px 100px 125px 140px;gap:9px}.genre-form,.genre-form select{margin:0!important}.genre-form select{height:34px!important;padding:3px 24px 3px 7px!important;font-size:.65rem!important}@media(max-width:850px){.songs-admin-shell .song-admin-row{grid-template-columns:1fr 1fr}}
.standard-catalog-field{display:flex;flex-direction:column;gap:4px;min-width:0;color:var(--muted);font-size:.66rem;font-weight:700}.standard-catalog-field>button{display:flex;align-items:flex-start;justify-content:center;flex-direction:column;width:100%;height:36px;margin:0;padding:4px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);text-align:left}.standard-catalog-field>button strong{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem}.standard-catalog-field>button small{max-width:100%;overflow:hidden;color:var(--muted);font-size:.52rem;text-overflow:ellipsis;white-space:nowrap}.standard-catalog-modal{width:620px;max-width:calc(100vw - 32px);max-height:72vh;margin:auto;padding:0;border:1px solid var(--line);border-radius:18px;background:var(--surface);color:var(--text);box-shadow:0 24px 80px rgba(0,0,0,.55);overflow:hidden}.standard-catalog-dialog::backdrop{background:rgba(5,7,12,.76);backdrop-filter:blur(5px)}.standard-catalog-modal>header{display:flex;align-items:center;justify-content:space-between;padding:18px 20px 12px;border-bottom:1px solid var(--line)}.standard-catalog-modal h2{margin:1px 0 0;font-size:1.25rem}.standard-catalog-modal header small{color:var(--accent);font-weight:800;letter-spacing:.12em;text-transform:uppercase}.standard-catalog-modal [data-close]{width:34px;height:34px;margin:0;padding:0;border:0;background:transparent;color:var(--muted);font-size:1.5rem}.standard-catalog-filters{display:grid;grid-template-columns:1fr 180px;gap:9px;padding:13px 20px}.standard-catalog-filters input,.standard-catalog-filters select{height:40px!important;margin:0!important}.standard-catalog-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:52vh;padding:0 20px 20px;overflow:auto}.standard-catalog-results button{display:grid;grid-template-columns:1fr auto;gap:2px 10px;margin:0;padding:10px 12px;border:1px solid var(--line);background:var(--bg);color:var(--text);text-align:left}.standard-catalog-results button strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-catalog-results button span{grid-column:1;color:var(--muted);font-size:.65rem}.standard-catalog-results button small{grid-column:2;grid-row:1/3;align-self:center;color:var(--accent);font-size:.58rem}.standard-catalog-results button.selected{border-color:var(--accent);background:rgba(223,255,89,.08)}.standard-catalog-empty{margin:0;padding:25px;text-align:center;color:var(--muted)}@media(max-width:600px){.standard-catalog-filters,.standard-catalog-results{grid-template-columns:1fr}.standard-catalog-results button small{grid-column:1;grid-row:auto}}
.standard-catalog-modal>header{padding:13px 17px 10px}.standard-catalog-modal h2{font-size:1.05rem}.standard-catalog-filters{position:sticky;top:0;z-index:2;padding:11px 17px;background:var(--surface)}.standard-catalog-results{display:flex;max-height:calc(72vh - 128px);flex-direction:column;gap:5px;padding:0 17px 16px;overflow:auto}.standard-catalog-results button{display:grid;grid-template-columns:minmax(160px,1.4fr) minmax(120px,1fr) auto;align-items:center;gap:10px;padding:8px 11px}.standard-catalog-results button strong,.standard-catalog-results button span,.standard-catalog-results button small{grid-column:auto;grid-row:auto;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.standard-catalog-results button span{font-size:.66rem}.standard-catalog-results button small{text-align:right}@media(max-width:600px){.standard-catalog-modal{max-height:78vh}.standard-catalog-filters{grid-template-columns:1fr 130px}.standard-catalog-results{max-height:calc(78vh - 128px)}.standard-catalog-results button{grid-template-columns:1fr auto}.standard-catalog-results button span{grid-column:1}.standard-catalog-results button small{grid-column:2;grid-row:1/3}}
.standard-catalog-dialog{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}.standard-catalog-dialog::backdrop{background:rgba(7,9,13,.5);backdrop-filter:blur(7px) saturate(.8)}.standard-catalog-modal{background:linear-gradient(180deg,#20242e 0,#191d25 100%)}.standard-catalog-modal>header{margin:0!important;padding:16px 18px 13px!important;border-radius:17px 17px 0 0;background:rgba(255,255,255,.018)}.standard-catalog-modal>header small{display:block;margin:0 0 3px;font-size:.56rem;line-height:1.2}.standard-catalog-modal>header h2{line-height:1.2}.standard-catalog-modal [data-close]{display:grid;place-items:center;border-radius:8px}.standard-catalog-modal [data-close]:hover{background:rgba(255,255,255,.06);color:var(--text)}.standard-catalog-filters{background:transparent}.standard-catalog-columns{display:grid;grid-template-columns:minmax(160px,1.4fr) minmax(120px,1fr) auto;gap:10px;margin:0 17px 6px;padding:0 11px;color:var(--muted);font-size:.52rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.standard-catalog-columns span:last-child{text-align:right}.standard-catalog-results{max-height:calc(72vh - 158px)}@media(max-width:600px){.standard-catalog-columns{display:none}.standard-catalog-results{max-height:calc(78vh - 128px)}}
.standard-catalog-field .standard-catalog-selection{display:flex;align-items:center;gap:8px;width:100%;height:36px;margin-top:2px;padding:3px 4px 3px 10px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text)}.standard-catalog-selection>strong{min-width:0;flex:1;overflow:hidden;font-size:.72rem;text-overflow:ellipsis;white-space:nowrap}.standard-catalog-selection>#openSongCatalog{width:auto;height:28px;margin:0;padding:3px 10px;border-color:var(--accent);border-radius:7px;background:transparent;color:var(--accent);font-size:.62rem;font-weight:800}.standard-catalog-selection>#openSongCatalog:hover{background:var(--accent);color:var(--bg)}

/* Section headings carry colour; control labels remain calm and uniform. */
:is(.training-dashboard #options,.standards-dashboard .standards-filter,.standards-dashboard .trainer-selectors) :is(label,.standard-catalog-field){color:var(--text)!important}

/* Songs uses Training's exact title/rule geometry. */
.standards-dashboard .standards-filter,.standards-dashboard .trainer-selectors{width:100%!important;padding-right:4px!important;padding-left:4px!important;row-gap:6px!important}.standards-dashboard .selector-group-title{position:relative;grid-column:1/-1!important;width:100%!important;margin:0 0 8px!important;padding:0 0 6px!important;border-bottom:1px solid var(--line)!important;font-size:.88rem!important;line-height:1.3!important}.standards-dashboard .trainer-selectors>.selector-group-title{margin-top:2px!important;padding-top:11px!important}.standards-dashboard .trainer-selectors>.selector-group-title::before{position:absolute;top:0;right:-16px;left:-16px;height:1px;background:var(--line);content:""}.standards-dashboard .selector-group-title+label,.standards-dashboard .selector-group-title+.standard-catalog-field{margin-top:0!important}

.account-nav-link{display:inline-flex;align-items:center;min-height:34px;padding:6px 11px!important;border:1px solid var(--accent)!important;border-radius:9px;color:var(--accent)!important;font-size:.68rem;font-weight:800;text-decoration:none;white-space:nowrap}
.account-nav-link:hover{background:var(--accent);color:var(--bg)!important}
.logout-nav-form{display:inline-flex;margin:0}.logout-nav-form button.account-nav-link{width:auto;margin:0;background:transparent;line-height:1}.logout-nav-form button.account-nav-link:hover{background:var(--accent)}
.environment-shell{max-width:900px}.environment-shell>.admin-create{margin-bottom:14px}.environment-shell>.admin-create p{margin-bottom:0;color:var(--muted)}.environment-form{display:grid;gap:14px}.environment-form>section{padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.environment-form h2{margin:0 0 14px;font-size:1rem}.environment-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.environment-form input,.environment-form select{margin-bottom:0}.environment-form>button{width:max-content}@media(max-width:650px){.environment-grid{grid-template-columns:1fr}}

/* Splash 2026: product-led, musical and unmistakably IntervalsMaster. */
.splash-page{background:radial-gradient(circle at 78% 16%,rgba(223,255,89,.13),transparent 24%),radial-gradient(circle at 16% 38%,rgba(103,209,255,.09),transparent 28%),linear-gradient(180deg,#101319,#151921 52%,#101319)}
.splash-page:before{position:fixed;z-index:-1;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(to bottom,#000,transparent 75%);content:"";pointer-events:none}
.splash-hero.splash-hero-compact{grid-template-columns:minmax(0,.78fr) minmax(520px,1.22fr);gap:clamp(42px,6vw,94px);min-height:calc(100vh - 86px);padding:54px 0 82px}
.splash-trial-ribbon{display:inline-flex;align-items:center;gap:9px;margin-bottom:22px;padding:6px 12px 6px 7px;border:1px solid rgba(223,255,89,.34);border-radius:999px;background:rgba(223,255,89,.075);color:#eef7c4;font-size:.66rem;font-weight:800}.splash-trial-ribbon span{padding:4px 7px;border-radius:999px;background:var(--accent);color:#11160b;font-size:.55rem;letter-spacing:.12em}
.splash-hero-compact .splash-copy h1{max-width:680px;font-size:clamp(3.15rem,5.25vw,5.7rem);line-height:.92;letter-spacing:-.065em}.splash-hero-compact .splash-copy h1 em{position:relative;color:#ffd151}.splash-hero-compact .splash-copy h1 em:after{position:absolute;right:0;bottom:-7px;left:0;height:4px;border-radius:4px;background:linear-gradient(90deg,#ffd151,var(--accent));content:"";transform:rotate(-1deg)}
.splash-feature-pills{list-style:none!important}.splash-feature-pills li{display:inline-flex;list-style:none!important;background:rgba(18,22,29,.66);backdrop-filter:blur(8px)}.splash-feature-pills li::marker{font-size:0;content:""}.splash-actions .splash-primary{box-shadow:0 14px 40px rgba(223,255,89,.18);transition:transform .2s,box-shadow .2s}.splash-actions .splash-primary:hover{box-shadow:0 18px 52px rgba(223,255,89,.28);transform:translateY(-2px)}
.splash-proof{display:flex;gap:26px;margin-top:28px;padding-top:20px;border-top:1px solid rgba(255,255,255,.08)}.splash-proof span{display:grid;color:var(--muted);font-size:.58rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.splash-proof strong{color:var(--text);font:700 1.35rem/1 "Syne",sans-serif;letter-spacing:-.04em}
.splash-product-stage{position:relative;perspective:1200px}.splash-product-stage .splash-hero-shot{position:relative;z-index:2;padding:0;border-color:#424a58;background:#151922;box-shadow:0 45px 110px rgba(0,0,0,.48),0 0 0 1px rgba(223,255,89,.06);transform:rotateY(-2deg) rotateX(1deg);overflow:hidden}.product-window-bar{display:flex;align-items:center;gap:6px;height:36px;padding:0 13px;border-bottom:1px solid #323945;background:#1b2029}.product-window-bar i{width:8px;height:8px;border-radius:50%;background:#ff746c}.product-window-bar i:nth-child(2){background:#ffd151}.product-window-bar i:nth-child(3){background:#79f28f}.product-window-bar span{margin-left:7px;color:#7f899a;font-size:.56rem;font-weight:800;letter-spacing:.08em}.splash-product-stage .splash-hero-shot img{border-radius:0}.splash-product-stage .splash-hero-shot figcaption{display:flex;align-items:center;gap:7px;padding:11px 14px}.live-dot{width:7px;height:7px;border-radius:50%;background:#79f28f;box-shadow:0 0 12px #79f28f;animation:splash-pulse 1.8s infinite}
.floating-feature{position:absolute;z-index:3;display:flex;align-items:center;gap:9px;padding:9px 12px;border:1px solid #444d5b;border-radius:12px;background:rgba(24,29,38,.9);box-shadow:0 16px 40px rgba(0,0,0,.35);backdrop-filter:blur(12px);animation:splash-float 4.6s ease-in-out infinite}.floating-feature b{display:grid;place-items:center;min-width:34px;height:30px;padding:0 6px;border-radius:8px;background:rgba(223,255,89,.12);color:var(--accent);font:800 .7rem "Syne",sans-serif}.floating-feature span{color:#dce1eb;font-size:.61rem;font-weight:800;white-space:nowrap}.floating-bh{top:10%;right:-26px}.floating-slash{right:-38px;bottom:21%;animation-delay:-1.4s}.floating-walk{bottom:4%;left:-34px;animation-delay:-2.8s}.floating-walk b{color:#8fd8ff;background:rgba(103,209,255,.12)}
@keyframes splash-float{50%{transform:translateY(-8px)}}@keyframes splash-pulse{50%{opacity:.45;transform:scale(.78)}}
.splash-showcase-grid>a,.splash-highlight-grid article,.splash-fretboard-grid figure{box-shadow:0 18px 55px rgba(0,0,0,.16)}.splash-showcase-grid>a{overflow:hidden}.splash-showcase-grid>a>span{display:inline-flex;margin-left:10px;padding:4px 7px;border:1px solid rgba(223,255,89,.28);border-radius:999px}
.splash-closing{position:relative;overflow:hidden;background:radial-gradient(circle at 50% 120%,rgba(223,255,89,.18),transparent 48%),linear-gradient(135deg,rgba(103,209,255,.08),rgba(223,255,89,.07))}.splash-closing>p:not(.kicker){position:relative;max-width:620px;margin:-12px auto 28px;color:var(--muted)}.splash-closing .closing-orbit{position:absolute;top:18px;right:25px;color:rgba(223,255,89,.13);font:800 clamp(1.5rem,4vw,3.8rem) "Syne",sans-serif;letter-spacing:.12em;transform:rotate(-4deg)}
@media(max-width:1150px){.splash-hero.splash-hero-compact{grid-template-columns:1fr;min-height:auto}.splash-product-stage{max-width:820px}.floating-bh,.floating-slash{right:-12px}}
@media(max-width:650px){.splash-hero-compact .splash-copy h1{font-size:clamp(2.75rem,14vw,4.3rem)}.splash-proof{gap:17px}.floating-feature{display:none}.splash-product-stage .splash-hero-shot{transform:none}.splash-trial-ribbon{font-size:.58rem}.splash-closing .closing-orbit{display:none}}

/* Public interactive demo. */
.demo-page{min-height:100vh;background:radial-gradient(circle at 70% 25%,rgba(223,255,89,.12),transparent 30%),radial-gradient(circle at 15% 70%,rgba(103,209,255,.08),transparent 28%),#11141b}.demo-shell{display:grid;grid-template-columns:minmax(280px,.62fr) minmax(580px,1.38fr);align-items:center;gap:clamp(40px,6vw,90px);width:min(1280px,calc(100% - 64px));min-height:calc(100vh - 150px);margin:auto;padding:50px 0 70px}.demo-intro h1{margin:10px 0 22px;font:700 clamp(3rem,5vw,5.4rem)/.93 "Syne",sans-serif;letter-spacing:-.06em}.demo-intro h1 em{color:#ffd151;font-style:normal}.demo-intro>p:last-child{max-width:500px;color:var(--muted);font-size:.92rem;line-height:1.7}.demo-lab{margin:0;border:1px solid #404855;border-radius:22px;background:linear-gradient(155deg,#202530,#171b23);box-shadow:0 35px 95px rgba(0,0,0,.38);overflow:hidden}.demo-lab>header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--line)}.demo-lab>header small{color:var(--accent);font-size:.55rem;font-weight:900;letter-spacing:.15em}.demo-lab h2{margin:3px 0 0;font:700 1.25rem "Syne",sans-serif}.demo-lab>header label{display:grid;grid-template-columns:auto 110px 34px;align-items:center;gap:8px;margin:0;color:var(--muted);font-size:.58rem}.demo-lab input[type=range]{margin:0}.demo-lab output{color:var(--text);font-weight:800}.demo-presets{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:16px 18px}.demo-presets button{display:flex;align-items:flex-start;flex-direction:column;min-height:82px;margin:0;padding:11px 12px;border-color:var(--line);background:#151922;color:var(--text);text-align:left}.demo-presets button span{color:var(--accent);font-size:.5rem;font-weight:900}.demo-presets button strong{margin:5px 0 3px;font-size:.72rem}.demo-presets button small{color:var(--muted);font-size:.55rem}.demo-presets button.active{border-color:var(--accent);background:rgba(223,255,89,.07);box-shadow:inset 0 0 0 1px rgba(223,255,89,.18)}.demo-display{display:grid;place-items:center;min-height:285px;margin:0 18px;padding:30px;border:1px solid rgba(255,255,255,.065);border-radius:16px;background:radial-gradient(circle at 50% 42%,rgba(223,255,89,.06),transparent 45%),#12161d}.demo-display>p{margin:0 0 28px;color:#ffd151;font:700 clamp(1.35rem,2.6vw,2.3rem) "Syne",sans-serif;letter-spacing:.1em;text-align:center}.demo-notes{display:flex;flex-wrap:wrap;justify-content:center;gap:9px;min-height:48px}.demo-notes span{display:grid;place-items:center;min-width:42px;height:42px;padding:0 10px;border:1px solid #46505e;border-radius:12px;background:#1b2029;color:#dce2ed;font-weight:800;transition:.12s}.demo-notes span.active{border-color:var(--accent);background:var(--accent);color:#11160b;box-shadow:0 0 25px rgba(223,255,89,.42);transform:translateY(-3px) scale(1.05)}.demo-play{width:auto;margin:27px 0 0;padding:11px 23px;border-color:var(--accent);background:var(--accent);color:#11160b;font-weight:900}.demo-play.playing{border-color:#ffd151;background:#ffd151}.demo-lab>footer{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 22px;border-top:1px solid var(--line);color:var(--muted);font-size:.65rem}.demo-lab>footer a{color:var(--accent);font-weight:900;text-decoration:none}.demo-lab>footer b{margin-left:8px}.demo-unlocks{width:min(1280px,calc(100% - 64px));margin:0 auto 70px;padding-top:25px;border-top:1px solid var(--line)}.demo-unlocks>div{display:flex;flex-wrap:wrap;gap:8px}.demo-unlocks span{padding:7px 11px;border:1px solid rgba(223,255,89,.2);border-radius:999px;color:var(--muted);font-size:.62rem;font-weight:800}@media(max-width:980px){.demo-shell{grid-template-columns:1fr;min-height:auto}.demo-intro{max-width:720px}.demo-lab{max-width:820px}}@media(max-width:620px){.demo-shell,.demo-unlocks{width:calc(100% - 28px)}.demo-presets{grid-template-columns:1fr}.demo-presets button{min-height:65px}.demo-lab>header{align-items:flex-start;flex-direction:column;gap:14px}.demo-display{min-height:250px;margin:0 10px;padding:22px 10px}.demo-notes{gap:5px}.demo-notes span{min-width:34px;height:37px;padding:0 7px}.demo-lab>footer{align-items:flex-start;flex-direction:column}}
.site-footer{display:flex;align-items:center;justify-content:center;gap:12px;width:min(1280px,calc(100% - 32px));margin:0 auto;padding:18px 0;border-top:1px solid rgba(255,255,255,.07);color:var(--muted);font-size:.62rem}.site-footer span:after{margin-left:12px;color:var(--line);content:"·"}.site-footer a{color:var(--accent);font-weight:800;text-decoration:none}.site-footer a:hover{text-decoration:underline}
@media(max-width:900px){.portal-nav>a.account-nav-link{display:inline-flex}}

/* Public presentation page. */
.splash-page{min-height:100vh;background:radial-gradient(circle at 78% 12%,rgba(223,255,89,.1),transparent 26%),radial-gradient(circle at 15% 52%,rgba(103,209,255,.08),transparent 28%),var(--bg);color:var(--text)}
.splash-header{display:flex;align-items:center;justify-content:space-between;width:min(1320px,calc(100% - 48px));min-height:86px;margin:auto}.splash-nav{display:flex;align-items:center;gap:15px}.splash-nav>a{color:var(--muted);font-size:.72rem;font-weight:700;text-decoration:none}.splash-nav .splash-small-cta{padding:9px 14px;border:1px solid var(--accent);border-radius:10px;color:var(--accent)}
.splash-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);align-items:center;gap:clamp(45px,7vw,110px);width:min(1320px,calc(100% - 64px));min-height:calc(100vh - 86px);margin:auto;padding:60px 0 90px}.splash-copy h1{margin:10px 0 24px;font:700 clamp(3.7rem,7vw,7.2rem)/.93 "Syne",sans-serif;letter-spacing:-.065em}.splash-copy h1 em{color:var(--accent);font-style:normal}.splash-copy>p:not(.kicker){max-width:690px;color:var(--muted);font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.65}.splash-actions{display:flex;align-items:center;gap:24px;margin-top:35px}.splash-actions>a:not(.splash-primary){color:var(--text);font-size:.78rem;font-weight:700}.splash-primary{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:16px 20px;border-radius:12px;background:var(--accent);color:#10140a!important;font-size:.8rem;font-weight:900;text-decoration:none;box-shadow:0 13px 36px rgba(223,255,89,.14)}
.splash-demo{position:relative;padding:42px;border:1px solid #3a414e;border-radius:26px;background:linear-gradient(145deg,rgba(34,39,50,.96),rgba(19,22,29,.96));box-shadow:0 35px 90px rgba(0,0,0,.34);text-align:center}.splash-demo:before{position:absolute;inset:-1px 14% auto;height:1px;background:var(--accent);content:""}.demo-label{color:var(--accent);font-size:.65rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}.splash-demo>strong{display:block;margin:28px 0 4px;color:#ffd151;font:700 clamp(2.5rem,5vw,4.8rem)/1 "Syne",sans-serif;letter-spacing:.14em}.splash-demo>p{margin:0;color:#7af29c;font-weight:800;letter-spacing:.15em}.demo-chord{display:inline-block;margin:24px 0;padding:7px 14px;border:1px solid #789520;border-radius:999px;color:var(--text);font-weight:800}.demo-frets{display:grid;grid-template-columns:repeat(7,1fr);align-items:center;height:92px;margin:20px 0;border:1px solid #62401e;border-radius:10px;background:repeating-linear-gradient(to bottom,transparent 0 21px,#98724c 22px 23px),#56361f}.demo-frets i{display:grid;place-items:center;width:30px;height:30px;margin:auto;border:1px solid #67707e;border-radius:50%;background:#17202b;color:#fff;font-style:normal;font-weight:800}.demo-frets i:empty{width:8px;height:8px;border:0;background:#9a8066}.demo-frets .active{background:#52d97d}.demo-frets .warm{background:#ffcf4c;color:#18130a}.demo-frets .accent{background:#ea6071}.splash-demo>small{color:var(--muted);font-weight:700;letter-spacing:.08em}
.splash-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;width:min(1320px,calc(100% - 64px));margin:0 auto;padding:40px 0 120px}.splash-benefits article{margin:0;padding:30px;border:1px solid var(--line);border-radius:18px;background:rgba(27,31,40,.74)}.splash-benefits article>span{color:var(--accent);font-size:.62rem;font-weight:800}.splash-benefits h2{margin:30px 0 10px;font:650 1.45rem "Syne",sans-serif}.splash-benefits p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.6}.splash-closing{width:min(1060px,calc(100% - 48px));margin:0 auto 100px;padding:70px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,rgba(103,209,255,.08),rgba(223,255,89,.08));text-align:center}.splash-closing h2{margin:12px auto 30px;font:700 clamp(2rem,4vw,4rem)/1.05 "Syne",sans-serif;letter-spacing:-.045em}.splash-closing .splash-primary{width:max-content;margin:auto}
@media(max-width:900px){.splash-hero{grid-template-columns:1fr;min-height:auto}.splash-demo{max-width:680px}.splash-benefits{grid-template-columns:1fr}.splash-copy h1{font-size:clamp(3.1rem,12vw,5.4rem)}}
@media(max-width:620px){.splash-header{width:calc(100% - 28px)}.splash-nav>a:not(.splash-small-cta){display:none}.splash-hero{width:calc(100% - 28px);padding:45px 0 70px}.splash-demo{padding:24px 14px}.splash-actions{align-items:stretch;flex-direction:column}.splash-actions .splash-primary{width:100%}.splash-benefits{width:calc(100% - 28px)}.splash-closing{padding:45px 20px}.demo-frets i{width:26px;height:26px}}

/* Public presentation: compact editorial scale and real product previews. */
.splash-hero.splash-hero-compact{grid-template-columns:minmax(0,.82fr) minmax(480px,1.18fr);gap:clamp(35px,5vw,76px);min-height:auto;padding:64px 0 82px}.splash-hero-compact .splash-copy h1{display:flex;flex-wrap:wrap;gap:.08em .22em;max-width:690px;margin:10px 0 20px;font-size:clamp(2.6rem,4vw,3.8rem);line-height:1;letter-spacing:-.048em}.splash-hero-compact .splash-copy h1 span,.splash-hero-compact .splash-copy h1 em{white-space:nowrap}.splash-hero-compact .splash-copy>p:not(.kicker){max-width:610px;font-size:clamp(.92rem,1.15vw,1.08rem);line-height:1.65}.splash-hero-shot{min-width:0;margin:0;padding:10px;border:1px solid #3a414e;border-radius:18px;background:#171a22;box-shadow:0 24px 65px rgba(0,0,0,.3);overflow:hidden}.splash-hero-shot img{display:block;width:100%;aspect-ratio:16/9;border-radius:11px;object-fit:cover;object-position:left top}.splash-hero-shot figcaption{padding:11px 5px 3px;color:var(--muted);font-size:.7rem;font-weight:700}
.splash-showcase,.splash-approach{width:min(1320px,calc(100% - 64px));margin:0 auto;padding:50px 0 95px}.splash-showcase>header,.splash-approach>header{max-width:760px;margin-bottom:30px}.splash-showcase h2,.splash-approach h2{margin:8px 0 0;font:700 clamp(1.8rem,3vw,3rem)/1.08 "Syne",sans-serif;letter-spacing:-.035em}.splash-showcase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.splash-showcase-grid>a{min-width:0;padding:12px 12px 22px;border:1px solid var(--line);border-radius:17px;background:rgba(27,31,40,.78);color:var(--text);text-decoration:none;transition:transform .18s,border-color .18s}.splash-showcase-grid>a:hover{border-color:var(--accent);transform:translateY(-3px)}.splash-showcase-grid figure{margin:0 0 18px;border-radius:11px;overflow:hidden}.splash-showcase-grid img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top left}.splash-showcase-grid>a>span{padding-left:10px;color:var(--accent);font-size:.6rem;font-weight:900}.splash-showcase-grid h3{margin:7px 10px 8px;font:650 1.18rem "Syne",sans-serif}.splash-showcase-grid p{margin:0 10px;color:var(--muted);font-size:.76rem;line-height:1.55}
.splash-fretboards{width:min(1320px,calc(100% - 64px));margin:0 auto;padding:20px 0 95px}.splash-fretboards>header{max-width:790px;margin-bottom:30px}.splash-fretboards h2{margin:8px 0 0;font:700 clamp(1.8rem,3vw,3rem)/1.08 "Syne",sans-serif;letter-spacing:-.035em}.splash-fretboard-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.splash-fretboard-grid figure{min-width:0;margin:0;padding:10px;border:1px solid var(--line);border-radius:17px;background:rgba(27,31,40,.78);overflow:hidden}.splash-fretboard-grid img{display:block;width:100%;aspect-ratio:16/10;border-radius:10px;object-fit:cover;object-position:center 24%}.splash-fretboard-grid figcaption{display:grid;gap:5px;padding:15px 9px 8px}.splash-fretboard-grid strong{font:650 1rem "Syne",sans-serif}.splash-fretboard-grid span{color:var(--muted);font-size:.72rem;line-height:1.45}
.splash-fretboard-grid .harmony-sequence-preview{grid-column:1/-1}.harmony-sequence-preview>div{display:grid;grid-template-columns:1fr 1fr;gap:10px}.splash-fretboard-grid .harmony-sequence-preview img{aspect-ratio:16/8.2}.harmony-sequence-preview figcaption{max-width:820px}.harmony-sequence-preview strong{color:var(--accent);font-size:1.12rem}
.splash-approach{padding-top:25px}.approach-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px}.approach-columns article{margin:0;padding:28px 30px;border:1px solid var(--line);border-radius:18px;background:rgba(27,31,40,.72)}.approach-columns small{display:block;margin-bottom:20px;font-size:.67rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.approach-columns ul{display:grid;gap:13px;margin:0;padding:0;list-style:none}.approach-columns li{position:relative;padding-left:25px;color:var(--muted);font-size:.84rem;line-height:1.45}.approach-columns li:before{position:absolute;left:0;font-weight:900}.theory-only{opacity:.78}.theory-only small{color:#ff8b70}.theory-only li:before{content:"–";color:#ff8b70}.hear-play{border-color:rgba(223,255,89,.42)!important;background:linear-gradient(135deg,rgba(223,255,89,.09),rgba(27,31,40,.78))!important}.hear-play small{color:var(--accent)}.hear-play li:before{content:"✓";color:var(--accent)}
@media(max-width:1150px){.splash-hero.splash-hero-compact{grid-template-columns:1fr}.splash-hero-shot{max-width:820px}.splash-showcase-grid,.splash-fretboard-grid{grid-template-columns:1fr 1fr}.splash-showcase-grid>a:last-child{grid-column:1/-1}.splash-showcase-grid>a:last-child figure{max-height:360px}.splash-fretboard-grid figure:last-child{grid-column:1/-1}}
@media(max-width:650px){.splash-hero.splash-hero-compact{width:calc(100% - 28px);padding:45px 0 65px}.splash-hero-compact .splash-copy h1{font-size:clamp(2.35rem,12vw,3.5rem)}.splash-showcase,.splash-fretboards,.splash-approach{width:calc(100% - 28px);padding-bottom:65px}.splash-showcase-grid,.splash-fretboard-grid,.approach-columns{grid-template-columns:1fr}.harmony-sequence-preview>div{grid-template-columns:1fr}.splash-showcase-grid>a:last-child,.splash-fretboard-grid figure:last-child{grid-column:auto}.approach-columns article{padding:24px 20px}}

.splash-feature-pills{display:flex;flex-wrap:wrap;gap:7px;margin:20px 0 0;padding:0;list-style:none}.splash-feature-pills li{padding:6px 9px;border:1px solid rgba(223,255,89,.25);border-radius:999px;background:rgba(223,255,89,.06);color:var(--text);font-size:.64rem;font-weight:700}
.splash-hero-compact .splash-copy .splash-purpose{margin:15px 0 0;padding:11px 13px;border-left:3px solid var(--accent);border-radius:0 9px 9px 0;background:rgba(223,255,89,.055);font-size:.78rem;line-height:1.5}.splash-purpose strong{color:var(--text)}
.access-tier-note{margin:0 0 10px;padding:9px 11px;border:1px solid rgba(223,255,89,.24);border-radius:9px;background:rgba(223,255,89,.055);color:var(--muted);font-size:.65rem}.access-tier-note a{color:var(--accent);font-weight:800}.standards-hero>.access-tier-note{grid-column:1/-1;margin-bottom:0}

/* Compact tune map: no horizontal scrolling; bars wrap only when needed. */
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-columns:minmax(360px,36%) minmax(0,64%);grid-template-rows:auto auto minmax(0,1fr)!important}
  .standards-dashboard .standards-hero{height:auto!important;min-height:0!important}
  .standards-dashboard .standards-hero .trainer-selectors{flex-basis:auto!important}
  .standards-dashboard .chart-sections{display:flex;align-content:initial;flex-direction:column;gap:0!important;padding:5px 8px!important;overflow-y:auto;overflow-x:hidden}
  .standards-dashboard .chart-sections>.access-tier-note{flex:0 0 auto;margin:1px 0 5px}
  .standards-dashboard .chart-section{display:grid;grid-template-columns:62px minmax(0,1fr);align-items:stretch;gap:6px;padding:5px 0!important}
  .standards-dashboard .chart-section>header{align-items:center;gap:5px;min-height:0;margin:0!important;padding:0 6px 0 0!important;border-right:1px solid var(--line)!important}
  .standards-dashboard .chart-section>header span{width:20px;height:20px;flex:0 0 20px;font-size:.48rem}
  .standards-dashboard .chart-section h3{font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .standards-dashboard .chord-bars{display:grid;grid-template-columns:repeat(auto-fit,minmax(48px,1fr));align-content:start;border:0!important;gap:3px}
  .standards-dashboard .chord-bar{min-height:29px!important;padding:3px 5px!important;border:1px solid var(--line)!important;border-radius:5px!important}
  .standards-dashboard .chord-bar small{font-size:.38rem;line-height:1}
  .standards-dashboard .chord-bar strong{margin-top:2px;font-size:.62rem;line-height:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
.splash-highlights{width:min(1320px,calc(100% - 64px));margin:0 auto;padding:20px 0 95px}.splash-highlights>header{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:8px 50px;align-items:end;margin-bottom:28px}.splash-highlights>header .kicker{grid-column:1/-1}.splash-highlights h2{margin:0;font:700 clamp(1.8rem,3vw,3rem)/1.08 "Syne",sans-serif;letter-spacing:-.035em}.splash-highlights>header>p:last-child{margin:0;color:var(--muted);font-size:.82rem;line-height:1.55}.splash-highlight-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.splash-highlight-grid article{min-width:0;margin:0;padding:22px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,rgba(34,39,50,.82),rgba(20,23,30,.88))}.splash-highlight-grid article>span{display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(223,255,89,.35);border-radius:9px;color:var(--accent);font:800 .75rem "Syne",sans-serif}.splash-highlight-grid h3{margin:22px 0 8px;font:650 1.02rem "Syne",sans-serif}.splash-highlight-grid p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.52}
@media(max-width:950px){.splash-highlight-grid{grid-template-columns:1fr 1fr}.splash-highlights>header{grid-template-columns:1fr}}
@media(max-width:650px){.splash-highlights{width:calc(100% - 28px);padding-bottom:65px}.splash-highlight-grid{grid-template-columns:1fr}.splash-highlight-grid article{padding:20px}}

.portal-nav .dashboard-home{padding:8px 12px;border:1px solid var(--line);border-radius:9px;color:var(--text);font-weight:700}.portal-nav .dashboard-home:hover{border-color:var(--accent);color:var(--accent)}
.splash-fretboard-grid .feature-detail img{aspect-ratio:4/3;object-fit:cover;object-position:center top}
/* Materiale: tonica a capo; tipo e scala sulla riga successiva. */
.training-dashboard #options .material-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.training-dashboard #options .material-settings-grid .tonic-field{grid-column:1/-1!important}
.training-dashboard #options .material-settings-grid .tonic-field select{width:140px;max-width:100%}
@media(max-width:720px){.training-dashboard #options .material-settings-grid .tonic-field select{width:100%}}

.context-nav{max-width:min(790px,68vw);overflow-x:auto;scrollbar-width:none}.context-nav::-webkit-scrollbar{display:none}
.guitar-tab td.palette-chord-playing span{border-color:#ffd151!important;background:#ffd151!important;color:#11131a!important;box-shadow:0 0 12px rgba(255,209,81,.58)!important}.guitar-tab td.palette-root-playing span{border-color:#79f28f!important;background:#20b85a!important;color:#07130b!important;box-shadow:0 0 14px rgba(66,235,117,.68)!important}.piano-key.palette-chord-playing{background:#ffd151!important;box-shadow:inset 0 0 10px rgba(0,0,0,.22),0 0 12px rgba(255,209,81,.62)!important}.piano-key.palette-root-playing{background:#20b85a!important;box-shadow:inset 0 0 0 3px #79f28f,0 0 15px rgba(66,235,117,.7)!important}
.piano-key{pointer-events:auto;cursor:pointer}.guitar-tab td:has(span:not(:empty)){cursor:pointer}
.mini-mixer{display:grid;grid-template-columns:1fr;gap:7px;width:min(330px,36%)}.mini-mixer label{display:grid;grid-template-columns:48px minmax(150px,1fr) 38px;align-items:center;gap:8px;margin:0;color:var(--muted);font-size:.62rem;text-transform:uppercase}.mini-mixer input[type=range]{width:100%;height:auto;margin:0!important;padding:0;accent-color:var(--accent)}.mini-mixer output{color:var(--text);font:600 .62rem "DM Sans",sans-serif;text-align:right}.mini-mixer input[type=range]:focus{outline:1px solid var(--accent);outline-offset:3px}@media(max-width:720px){.mini-mixer{width:100%}}
@media(min-width:900px){.training-dashboard .phrase-card{padding-top:6px}.shared-practice-transport{margin-top:5px!important;padding-top:6px!important}.shared-practice-transport .control-button{min-height:60px}.training-dashboard .mini-mixer{gap:4px}}
@media(min-width:900px){.training-dashboard .phrase-card{flex:0 0 auto!important}.shared-practice-transport{margin-top:8px!important;padding-top:8px!important}.training-dashboard .training-panel{justify-content:flex-start}}
@media

/* Give the live panel the same titled-section rhythm as the settings panel. */

.training-dashboard .phrase-card>.card-label{color:var(--warm)}


.shared-practice-transport::before{
  grid-column:1/-1;
  margin-bottom:2px;
  color:#8fd8ff;
  content:"Riproduzione";
}


html[lang="en"] .shared-practice-transport::before{content:"Playback"}
/* The pulse section is part of the right-hand flow, not a nested card. */



/* Section headings span the live panel; the instrument itself stays centred. */


.walking-preview{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:4px 0 7px}.walking-preview>span{display:flex;min-width:0;align-items:center;justify-content:center;gap:5px;padding:4px 6px;border:1px solid var(--line);border-radius:7px;background:rgba(10,13,18,.28);color:var(--text)}.walking-preview small{color:var(--muted);font-size:.52rem;font-weight:800}.walking-preview strong{overflow:hidden;font-size:.65rem;line-height:1;white-space:nowrap;text-overflow:ellipsis}.walking-preview .walking-approach{border-color:rgba(255,141,107,.7);background:rgba(255,141,107,.1)}.walking-preview .walking-approach small{color:var(--warm)}.walking-preview .walking-next-root{border-color:rgba(122,242,156,.75);background:rgba(32,184,90,.12)}.walking-preview .walking-next-root small{color:#7af29c}.walking-preview .walking-current{box-shadow:inset 0 0 0 1px var(--accent),0 0 9px rgba(223,255,89,.2)}
@media(max-width:560px){.walking-preview{gap:3px}.walking-preview>span{flex-direction:column;gap:1px;padding-inline:2px}.walking-preview strong{font-size:.58rem}}

.shared-practice-transport{
  padding-bottom:10px;
  border-bottom:1px solid rgba(255,255,255,.07);
}
.harmony-palette button[data-sequence-order="8"]{--sequence-color:#f0a868}
.walking-preview .walking-root{border-color:rgba(121,242,143,.9);background:rgba(32,184,90,.18)}.walking-preview .walking-root small,.walking-preview .walking-root strong{color:#79f28f}.walking-preview .walking-chord-tone{border-color:rgba(255,216,77,.75);background:rgba(255,216,77,.1)}.walking-preview .walking-chord-tone small,.walking-preview .walking-chord-tone strong{color:#ffd84d}
@media(min-width:900px) and (min-height:720px){.standards-dashboard .standards-shell{grid-template-rows:470px auto minmax(0,1fr)!important}.standards-dashboard .standards-hero{height:470px!important;padding-bottom:10px!important}.standards-dashboard .standards-hero>div:first-child{flex-basis:22px!important}.standards-dashboard .standards-hero h1{font-size:1.08rem!important}.standards-dashboard .standards-filter,.standards-dashboard .trainer-selectors{row-gap:3px!important}.training-dashboard #options .section-title h2,.standards-dashboard .selector-group-title{font-size:.74rem!important;line-height:1.22!important}.standards-dashboard .selector-group-title{margin-bottom:4px!important;padding-bottom:3px!important}.standards-dashboard .trainer-selectors>.selector-group-title{margin-top:1px!important;padding-top:7px!important}.standards-dashboard .standard-catalog-field{font-size:.55rem!important;line-height:1!important}.standards-dashboard .standard-catalog-field .standard-catalog-selection{height:30px;margin-top:2px;padding:2px 3px 2px 7px}.standards-dashboard .standard-catalog-selection>strong{font-size:.64rem}.standards-dashboard .standard-catalog-selection>#openSongCatalog{height:24px;padding:2px 8px;font-size:.55rem}.standards-dashboard .standards-hero .trainer-selectors{flex-basis:auto!important}}
@media(min-width:900px) and (min-height:720px){.training-dashboard #options :is(select,input:not([type="hidden"])),.standards-dashboard .standards-hero :is(select,input:not([type="hidden"])){height:30px!important;font-size:.66rem!important}}
@media(min-width:900px) and (min-height:720px){.training-dashboard #options :is(select,input:not([type="hidden"])),.standards-dashboard .standards-hero :is(select,input:not([type="hidden"])){font-size:14px!important}}

/* Shared four-step settings hierarchy and compact, one-screen live workspace. */
.training-dashboard #options .section-title>span{display:grid!important;place-items:center;flex:0 0 23px!important;width:23px;height:23px!important;border:1px solid rgba(223,255,89,.45);border-radius:50%;font-size:.58rem!important}
.standards-dashboard .selector-group-title{display:flex;align-items:center;gap:7px}
.standards-dashboard .selector-group-title::before{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border:1px solid rgba(223,255,89,.45);border-radius:50%;color:var(--accent);font-size:.55rem;content:""}
.standards-dashboard .material-title::before{content:"01"}.standards-dashboard .performance-title::before{content:"02"}.standards-dashboard .instrument-title::before{content:"03"}.standards-dashboard .tempo-title::before{content:"04"}
.standards-dashboard .song-chorus-title::before{content:"05"}
.standards-dashboard .song-chorus-title strong{font-size:.74rem}.standards-dashboard .song-chorus-title small{color:var(--muted);font-size:.55rem;font-weight:500}.standards-dashboard .song-chorus-title em{margin-left:auto;color:var(--accent);font-size:.56rem;font-style:normal;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.training-dashboard #options .section-title{display:flex!important;align-items:center!important;gap:8px!important}
.training-dashboard #options .section-title>div{min-width:0}
.chords-page .chord-picker h2 span{display:inline-grid;place-items:center;flex:0 0 23px;width:23px;height:23px;border:1px solid rgba(223,255,89,.45);border-radius:50%;color:var(--accent);font-size:.55rem;line-height:1}
.standards-dashboard .trainer-selectors>.selector-group-title::before{position:static!important;inset:auto!important;width:22px!important;height:22px!important;background:transparent!important}
.standards-dashboard .trainer-selectors>.performance-title::before{content:"02"!important}.standards-dashboard .trainer-selectors>.instrument-title::before{content:"03"!important}.standards-dashboard .trainer-selectors>.tempo-title::before{content:"04"!important}

/* Brani uses the same titled vertical flow as Allenamento. */

.standards-dashboard .song-run-controls{margin-top:4px!important}
.standards-dashboard .song-run-controls::before{grid-column:1/-1;margin-bottom:1px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.09);color:#8fd8ff;content:"Riproduzione"}


html[lang="en"] .standards-dashboard .song-run-controls::before{content:"Playback"}
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .chord-trainer{justify-content:flex-start!important}
  .standards-dashboard .song-run-controls{margin-top:0!important}
}

/* Full-width instruments without distorting their physical proportions. */






@media(min-width:900px) and (min-height:720px){
  body.training-dashboard,html.jazz-page body.standards-dashboard{height:100vh!important;overflow:hidden!important}
  .training-dashboard #options{grid-template-rows:auto auto auto auto auto!important}
  .training-dashboard #options .material-settings-card{grid-row:1!important}
  .training-dashboard #options .flow-settings-card{grid-row:2!important}
  .training-dashboard #options .instrument-settings-card{grid-row:3!important}
  .training-dashboard #options .pulse-settings-card{grid-row:4!important}
  .training-dashboard #options .form-actions{grid-row:5!important}
  .training-dashboard .training-panel{height:calc(100vh - 102px)!important;max-height:calc(100vh - 102px)!important;overflow:hidden!important}
  .training-dashboard .phrase-card{min-height:0!important;padding-top:5px!important}
  .shared-practice-transport{margin-top:5px!important;padding-top:5px!important;padding-bottom:5px!important}
  .shared-practice-transport .control-button{min-height:48px!important;padding-block:5px!important}
  .training-dashboard .mini-mixer,.standards-dashboard .mini-mixer{display:none!important}
  .standards-dashboard .standards-shell{height:calc(100vh - 104px)!important;overflow:hidden!important}
  .standards-dashboard .chord-trainer{min-height:0!important;overflow:hidden!important}
}
@media
@media(min-width:900px) and (min-height:720px){.standards-dashboard .standards-shell{grid-template-rows:526px auto minmax(0,1fr)!important}.standards-dashboard .standards-hero{height:526px!important}}
@media(min-width:900px) and (min-height:720px){.standards-dashboard .standards-hero{display:flex!important;align-items:stretch!important;flex-direction:column!important;justify-content:flex-start!important}.standards-dashboard .standards-hero>div:first-child{flex:0 0 24px!important}.standards-dashboard .standards-filter,.standards-dashboard .trainer-selectors{flex:0 0 auto!important}}
@media
/* Stable clearance for highlighted notes on the two outer strings. */
.guitar-tab .tab-scroll.fretboard{box-sizing:content-box;padding-top:9px!important;padding-bottom:9px!important;overflow-y:hidden}
/* One shared metronome control row, embedded in the left Tempo e pulsazione section. */
.embedded-metronome{display:flex!important;grid-column:1/-1!important;align-items:center!important;justify-content:flex-end!important;width:100%;min-height:0!important;margin:5px 0 0!important;padding:5px 0 0!important;border:0!important;border-top:1px solid rgba(255,255,255,.07)!important;border-radius:0!important;background:transparent!important}
.embedded-metronome::before,.embedded-metronome>div:first-child{display:none!important}
.embedded-metronome .tempo-controls{display:flex;width:auto;gap:5px}
.embedded-metronome .tempo-controls button{flex:0 0 auto;width:auto!important;min-width:38px!important;height:30px!important;margin:0!important;padding:3px 9px!important;border-radius:8px!important;font-size:.68rem!important}
.embedded-metronome .tempo-controls .metro-play,.embedded-metronome .tempo-controls #jazzMetronome{min-width:76px!important}

/* Allenamento reuses the live transport in the left pulse section. */
.training-dashboard .settings-practice-transport{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;width:100%;margin:5px 0 0!important;padding:6px 0 0!important;border-top:1px solid rgba(255,255,255,.07)!important;border-bottom:0!important}
.training-dashboard .settings-practice-transport::before{display:none!important}
.standards-dashboard .song-run-controls button,.training-dashboard .settings-practice-transport .control-button{display:flex!important;grid-column:auto!important;align-items:center!important;justify-content:center!important;flex-direction:row!important;gap:4px!important;min-width:0!important;min-height:32px!important;margin:0!important;padding:7px!important;border:1px solid var(--line)!important;border-radius:10px!important;background:#171a22!important;color:var(--text)!important;font-size:.62rem!important;text-align:center!important}
.training-dashboard .settings-practice-transport .control-button.featured,.standards-dashboard .song-run-controls button:last-child{border-color:var(--accent)!important;background:var(--accent)!important;color:var(--bg)!important;font-weight:700!important}
.training-dashboard .settings-practice-transport .control-button span{margin:0!important;color:inherit!important;font-size:.68rem!important;line-height:1!important}
.training-dashboard .settings-practice-transport .control-button small{display:none!important}
.training-dashboard .settings-practice-transport .control-button b{min-width:0;overflow:hidden;color:inherit!important;font-size:inherit!important;line-height:1!important;letter-spacing:0;white-space:nowrap;text-align:center}
@media(max-width:480px){.training-dashboard .settings-practice-transport{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.training-dashboard .practice-settings-card .settings-practice-transport{margin-top:0!important;padding-top:4px!important;border-top:0!important}
@media(min-width:900px) and (min-height:720px){.training-dashboard #options{grid-template-rows:auto auto auto auto auto auto!important}.training-dashboard #options .practice-settings-card{grid-row:5!important}.training-dashboard #options .form-actions{grid-row:6!important}}
.training-track-note{display:flex;align-items:baseline;gap:8px;margin:-1px 0 8px;padding:0 0 7px;border-bottom:1px solid var(--line)}.training-track-note strong{color:var(--accent);font:700 .72rem "Syne",sans-serif}.training-track-note span{color:var(--muted);font-size:.58rem}
.entry-section{margin-top:28px}.entry-section>header{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding-bottom:9px;border-bottom:1px solid var(--line)}.entry-section>header>span{display:grid;width:24px;height:24px;flex:0 0 24px;place-items:center;border:1px solid rgba(223,255,89,.5);border-radius:50%;color:var(--accent);font-size:.55rem}.entry-section>header h2{margin:0;font:700 1rem "Syne",sans-serif}.entry-section>header p{margin:2px 0 0;color:var(--muted);font-size:.68rem}.entry-section .entry-grid{margin-top:0}.training-track-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.portal-page .entry-grid.entry-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.training-track-refinement:before{background:#c99cff}.training-track-refinement .entry-icon,.training-track-refinement .entry-open{color:#c99cff}.training-track-professional:before{background:var(--warm)}.training-track-professional .entry-icon,.training-track-professional .entry-open{color:var(--warm)}
@media(max-width:800px){.training-track-grid,.portal-page .entry-grid.entry-tools-grid{grid-template-columns:1fr!important}}
.splash-training-plans{width:min(1320px,calc(100% - 64px));margin:0 auto;padding:30px 0 70px}.splash-training-plans>header{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:8px 50px;align-items:end;margin-bottom:22px}.splash-training-plans>header .kicker{grid-column:1/-1}.splash-training-plans>header h2{margin:0;font:700 clamp(1.8rem,3vw,3rem)/1.08 "Syne",sans-serif;letter-spacing:-.035em}.splash-training-plans>header>p:last-child{margin:0;color:var(--muted);font-size:.82rem;line-height:1.55}.splash-plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.splash-plan-grid>a{position:relative;min-height:238px;padding:22px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,rgba(34,39,50,.82),rgba(20,23,30,.88));color:var(--text);text-decoration:none;transition:.18s}.splash-plan-grid>a:hover{transform:translateY(-3px);border-color:var(--accent)}.splash-plan-grid>a.guided-plan{border-color:rgba(223,255,89,.52);background:linear-gradient(145deg,rgba(57,68,38,.72),rgba(20,23,30,.92))}.splash-plan-grid span{display:grid;width:28px;height:28px;place-items:center;border:1px solid rgba(223,255,89,.45);border-radius:50%;color:var(--accent);font-size:.55rem}.splash-plan-grid small{position:absolute;top:27px;right:22px;color:var(--muted);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase}.splash-plan-grid h3{margin:28px 0 7px;font:700 1.18rem "Syne",sans-serif}.splash-plan-grid p{max-width:96%;margin:0;color:var(--muted);font-size:.71rem;line-height:1.48}.splash-plan-grid b{position:absolute;right:22px;bottom:18px;left:22px;color:var(--accent);font-size:.59rem;text-transform:uppercase}.splash-plan-grid>a:nth-child(3) span,.splash-plan-grid>a:nth-child(3) b{color:#c99cff}.splash-plan-grid>a:nth-child(4) span,.splash-plan-grid>a:nth-child(4) b{color:var(--warm)}
@media(max-width:800px){.splash-training-plans{width:calc(100% - 28px)}.splash-training-plans>header{grid-template-columns:1fr}.splash-plan-grid{grid-template-columns:1fr}}

.splash-founder{display:grid;grid-template-columns:110px minmax(0,1.35fr) minmax(260px,.65fr);gap:clamp(24px,4vw,58px);align-items:center;width:min(1180px,calc(100% - 64px));margin:25px auto 105px;padding:clamp(28px,4vw,54px);border:1px solid rgba(223,255,89,.22);border-radius:24px;background:radial-gradient(circle at 10% 20%,rgba(223,255,89,.12),transparent 26%),linear-gradient(135deg,rgba(34,39,50,.94),rgba(17,20,27,.96));box-shadow:0 28px 80px rgba(0,0,0,.28)}.splash-founder-mark{display:grid;width:104px;height:104px;place-items:center;border:1px solid rgba(223,255,89,.48);border-radius:28px;transform:rotate(-4deg);background:rgba(223,255,89,.06);color:var(--accent);font:800 1.8rem "Syne",sans-serif}.splash-founder-mark span{transform:rotate(4deg)}.splash-founder-copy h2{max-width:720px;margin:6px 0 19px;font:700 clamp(1.75rem,3vw,2.8rem)/1.04 "Syne",sans-serif;letter-spacing:-.04em}.splash-founder-copy>p:not(.kicker){max-width:760px;margin:0 0 11px;color:var(--muted);font-size:.79rem;line-height:1.62}.splash-founder-copy footer{display:flex;flex-direction:column;margin-top:21px}.splash-founder-copy footer strong{color:var(--text);font:700 .88rem "Syne",sans-serif}.splash-founder-copy footer span{color:var(--accent);font-size:.62rem}.splash-founder blockquote{margin:0;padding:4px 0 4px 26px;border-left:1px solid rgba(223,255,89,.35);color:var(--text);font:600 clamp(1rem,1.7vw,1.3rem)/1.45 "Syne",sans-serif}.splash-founder blockquote b{color:var(--accent);font-size:1.25em}
@media(max-width:900px){.splash-founder{grid-template-columns:76px 1fr}.splash-founder-mark{width:72px;height:72px;border-radius:20px;font-size:1.2rem}.splash-founder blockquote{grid-column:2}}
@media(max-width:620px){.splash-founder{grid-template-columns:1fr;width:calc(100% - 28px);margin-bottom:70px}.splash-founder-mark{width:58px;height:58px}.splash-founder blockquote{grid-column:auto;padding-left:18px}}

/* Guided courses configure the shared training engine; only the key remains selectable. */
.guided-course-grid{grid-template-columns:minmax(0,1fr)!important}.guided-course-entry{min-height:170px!important}.guided-course-entry:before{background:linear-gradient(90deg,var(--accent),#75cfff)!important}.guided-course-entry .entry-icon,.guided-course-entry .entry-open{color:var(--accent)}
.guided-course-page #options.guided-course-panel{display:flex;grid-column:1;grid-row:2;min-height:0;flex-direction:column;gap:8px;overflow-y:auto}.guided-course-page #options.guided-course-panel>.settings-card{display:block;width:100%;margin:0;padding:11px 14px}.guided-course-panel .section-title{display:flex!important;align-items:center!important;gap:8px!important;margin:0 0 8px!important;padding:0 0 6px!important;border-bottom:1px solid var(--line)}.guided-course-panel .section-title>span{display:grid!important;flex:0 0 24px!important;width:24px!important;height:24px!important;place-items:center;font-size:.58rem}.guided-course-panel .section-title h2{font-size:.86rem!important}.guided-course-panel .section-title p{display:block!important;margin:2px 0 0!important;color:var(--muted)!important;font-size:.61rem!important}.course-progress{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}.course-progress strong{color:var(--accent);font-size:.75rem}.course-progress>div{height:5px;border-radius:99px;background:var(--surface-2);overflow:hidden}.course-progress i{display:block;width:var(--course-progress);height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#75cfff);transition:width .2s}.course-progress small{color:var(--muted);font-size:.55rem}.guided-course-panel .course-tonic{display:grid!important;grid-template-columns:90px minmax(0,1fr);align-items:center;gap:10px;height:auto!important;margin:0!important}.guided-course-panel .course-tonic select{width:100%;height:38px!important;margin:0!important}.course-lesson-copy{display:grid;grid-template-columns:42px 1fr;gap:10px;padding:2px 0 9px}.course-lesson-copy>span{display:grid;width:38px;height:38px;place-items:center;border:1px solid var(--accent);border-radius:12px;color:var(--accent);font-weight:800}.course-lesson-copy h3{margin:0 0 3px;font-size:.78rem}.course-lesson-copy p{margin:0;color:var(--text);font-size:.64rem}.course-lesson-copy small{display:block;margin-top:3px;color:var(--muted);font-size:.56rem;line-height:1.35}.course-syllabus{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin:0;padding:0;list-style:none}.course-syllabus li{margin:0}.course-syllabus a{display:grid;grid-template-columns:24px minmax(0,1fr) 14px;align-items:center;gap:5px;min-height:31px;padding:4px 6px;border:1px solid var(--line);border-radius:7px;color:var(--muted);font-size:.55rem;text-decoration:none}.course-syllabus a>span{color:var(--accent);font-size:.48rem}.course-syllabus a>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.course-syllabus a>i{color:transparent;font-style:normal}.course-syllabus .current a{border-color:var(--accent);background:rgba(223,255,89,.08);color:var(--text)}.course-syllabus .completed a>i{color:#79f28f}.guided-course-panel .pulse-settings-card{flex:0 0 auto}.guided-course-panel .pulse-settings-card .embedded-metronome{margin:0!important;padding:4px 0 0!important;border:0!important;background:transparent!important}.guided-course-panel .pulse-settings-card .embedded-metronome>div:first-child{display:none}.course-navigation{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:3px}.course-navigation a{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:6px 11px;border:1px solid var(--line);border-radius:8px;color:var(--text);font-size:.61rem;font-weight:800;text-decoration:none}.course-navigation .course-complete{margin-left:auto;border-color:var(--accent);background:var(--accent);color:var(--bg)}.guided-course-page .practice-settings-card{margin:0!important;padding:9px 12px!important}.guided-course-page .practice-settings-card .section-title{margin-bottom:5px!important}.guided-course-page .settings-practice-transport{grid-template-columns:repeat(4,minmax(0,1fr))!important;margin:0!important;padding:0!important;border:0!important}.guided-course-page .settings-practice-transport .control-button{min-height:38px!important;padding:5px 7px!important}
@media(max-width:720px){.guided-course-page #options.guided-course-panel{overflow:visible}.course-syllabus{grid-template-columns:1fr}.guided-course-page .settings-practice-transport{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
.standards-dashboard .trainer-selectors{align-content:start!important;grid-auto-rows:max-content}
.instrument-summary{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:14px;width:100%;min-height:34px;margin:0 0 5px!important;text-align:left!important}
.instrument-identity{display:flex;min-width:0;flex-direction:column;gap:1px}
.shared-session-header{display:flex;box-sizing:border-box;width:100%;min-width:0;align-items:center;justify-content:space-between;gap:18px;padding:0 2px 8px;border-bottom:1px solid rgba(255,255,255,.07)}
.shared-session-number{display:grid;width:22px;height:22px;flex:0 0 22px;place-items:center;border:1px solid var(--accent);border-radius:50%;color:var(--accent);font-size:.54rem;font-weight:750}
.shared-session-identity{min-width:0;text-align:left}
.shared-session-header h1{margin:0;padding:0;font:700 clamp(.95rem,1.25vw,1.4rem)/1.05 "Syne",sans-serif;letter-spacing:-.035em;white-space:nowrap}
.shared-session-identity p{margin:2px 0 0;color:var(--muted);font-size:.62rem;line-height:1.1}
.shared-session-context{margin:0;color:var(--accent);font-size:.61rem;font-weight:700;letter-spacing:.13em;text-align:right;text-transform:uppercase;white-space:nowrap}
.chart-sections>.shared-session-header{grid-column:1/-1;flex:0 0 auto;margin-bottom:4px}
.song-sidebar{overflow:hidden;border:1px solid var(--line);border-top-color:rgba(223,255,89,.55);border-radius:16px;background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9))}
.song-sidebar>.standards-hero,.song-sidebar>.chart-sections{border-right:0;border-left:0;border-radius:0;background:transparent}
@media(min-width:900px) and (min-height:720px){
  .standards-dashboard .standards-shell{grid-template-rows:minmax(0,1fr)!important}
  .standards-dashboard .song-sidebar{display:flex;grid-column:1;grid-row:1;min-height:0;flex-direction:column;overflow:hidden;border:1px solid var(--line);border-top-color:rgba(223,255,89,.55);border-radius:16px;background:linear-gradient(145deg,rgba(33,37,48,.8),rgba(25,28,37,.9))}
  .standards-dashboard .song-sidebar>.standards-hero{position:static;flex:0 0 auto;width:100%;height:auto!important;margin:0;border:0;border-radius:0;background:transparent}
  .standards-dashboard .song-sidebar>.chart-sections{position:static;display:flex;flex:1 1 auto;width:100%;min-height:0;margin:0!important;border:0;border-top:1px solid rgba(255,255,255,.07);border-radius:0;background:transparent}
  .standards-dashboard .song-chorus-sections{min-height:0;flex:1 1 auto;overflow-y:auto}
  .standards-dashboard .song-sidebar .chart-section{padding:3px 0!important}
  .standards-dashboard .song-sidebar .chord-bar{min-height:29px!important;padding:1px 4px!important}
  .standards-dashboard .song-sidebar .song-run-controls{position:static;flex:0 0 auto;padding:4px 0 0;background:linear-gradient(145deg,#20242e,#181b23)}
  .standards-dashboard .chord-trainer{grid-column:2;grid-row:1;height:100%}
}
@media(max-width:720px){.shared-session-header{align-items:flex-start;flex-direction:column;gap:4px}.shared-session-header h1,.shared-session-context{white-space:normal}.shared-session-context{text-align:left}}
.instrument-identity strong{overflow:hidden;color:var(--text)!important;font:700 .88rem/1.05 "Syne",sans-serif!important;white-space:nowrap;text-overflow:ellipsis}
.instrument-identity small{overflow:hidden;color:var(--muted);font-size:.58rem;font-weight:650;line-height:1.15;white-space:nowrap;text-overflow:ellipsis}
.instrument-location{flex:0 1 auto;color:var(--accent)!important;font-size:.62rem!important;font-weight:750;line-height:1.15;text-align:right;white-space:nowrap}
.shared-phrase .phrase-section-title{display:block!important;width:100%;padding:0 0 6px!important;border-bottom:1px solid rgba(255,255,255,.09)!important;color:var(--warm)!important;font:600 .82rem/1.25 "Syne",sans-serif!important;text-align:left!important;text-transform:none!important}
.shared-phrase-component{display:block!important;box-sizing:border-box!important;width:100%!important;min-width:0!important;margin:0!important;padding:0!important}
.shared-phrase .phrase-details{display:flex!important;width:100%;min-width:0;align-items:center!important;flex-direction:column;gap:3px!important;padding:6px 0 8px!important;text-align:center!important}
.shared-phrase .phrase-details>*{max-width:100%;margin:0!important;text-align:center!important}
.shared-phrase .phrase-detail-line:empty{display:none!important}


/* The two functions instantiate the same phrase and instrument components. */
.shared-phrase .phrase-detail-line{font-family:"DM Sans",sans-serif!important;font-style:normal!important;text-align:center!important}
.shared-phrase .phrase-detail-1{color:var(--accent)!important;font:800 .61rem/1.1 "DM Sans",sans-serif!important;letter-spacing:.13em!important;text-transform:uppercase!important}
.shared-phrase .phrase-detail-2{color:var(--accent)!important;font:700 clamp(1.1rem,1.65vw,1.55rem)/1.05 "Syne",sans-serif!important;letter-spacing:.045em!important}
.shared-phrase .phrase-detail-3{color:#ffd84d!important;font:600 .72rem/1.15 "DM Sans",sans-serif!important;letter-spacing:.055em!important}
.shared-phrase .phrase-detail-4{color:var(--warm)!important;font:700 .88rem/1.18 "Syne",sans-serif!important}
.shared-phrase .phrase-detail-5{color:var(--accent)!important;font:650 .76rem/1.18 "DM Sans",sans-serif!important}
.shared-phrase .phrase-detail-6{font:650 .7rem/1.2 "DM Sans",sans-serif!important}
.shared-phrase .phrase-detail-7{color:var(--muted)!important;font:500 .6rem/1.15 "DM Sans",sans-serif!important}
.shared-phrase .scale-root-label{display:inline-grid!important;place-items:center!important;min-width:1.45em;height:1.45em;padding:0 .2em;border:1px solid #79f28f;border-radius:999px;color:#79f28f!important;font-weight:800!important;line-height:1!important}
.shared-phrase .scale-chord-label{color:#ffd84d!important;font-weight:750!important}
.shared-phrase :is(.chord-position,.harmony-inversion){display:inline-block!important;padding:2px 8px!important;border:1px solid rgba(223,255,89,.65)!important;border-radius:999px!important;background:rgba(223,255,89,.08)!important;color:var(--accent)!important;font-size:.72rem!important;font-style:normal!important;font-weight:700!important;white-space:nowrap!important}
.shared-instrument{box-sizing:border-box;width:100%!important;max-width:none!important;margin:8px 0 6px!important;padding:7px 0 10px!important;border-top:0!important;border-bottom:1px solid rgba(255,255,255,.07)!important}
.shared-instrument.guitar-tab .tab-scroll.fretboard{box-sizing:border-box!important;width:100%!important;height:auto!important;min-height:calc(var(--string-count,6)*32px + 34px)!important;aspect-ratio:auto!important;padding:7px 0!important;overflow:visible!important}
.shared-instrument.guitar-tab .tab-scroll.fretboard table{width:100%!important;min-width:0!important;height:auto!important;table-layout:fixed}
.shared-instrument.guitar-tab .tab-scroll.fretboard thead th{height:20px!important}
.shared-instrument.guitar-tab .tab-scroll.fretboard tbody :is(th,td){height:32px!important}
.shared-instrument.guitar-tab td.playing span:not(:empty){transform:scale(1.08)}
.shared-instrument.guitar-tab td span.scale-tone{border-color:rgba(223,255,89,.35);background:#202630;color:#c9d0dc}
.shared-instrument.guitar-tab td span.chord-tone{border-color:var(--accent);background:var(--accent);color:var(--bg);box-shadow:0 0 10px rgba(223,255,89,.28)}
.shared-instrument.guitar-tab td span.shape-tone{outline:2px solid #fff;outline-offset:1px}
.shared-instrument.guitar-tab td span.tonic-marker{border-width:3px}
.shared-instrument.piano-tab .piano-keyboard{width:100%!important;height:auto!important;aspect-ratio:8.6/1}
.shared-instrument>.card-label{margin:0 0 7px!important;padding:0 0 6px!important;color:#d79cff!important;font:600 .82rem/1.25 "Syne",sans-serif!important;letter-spacing:0!important;text-align:left!important;text-transform:none!important}
.shared-harmony-controls{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:4px!important;box-sizing:border-box!important;width:100%!important;max-width:none!important;margin:8px 0 6px!important;padding:0 0 8px!important}.shared-harmony-controls>button{flex:0 0 calc((100% - 28px)/8)!important;width:calc((100% - 28px)/8)!important;min-width:0!important;height:42px!important}
.shared-walking-controls{box-sizing:border-box!important;width:100%!important;max-width:none!important;margin:8px 0 6px!important;padding-bottom:8px!important}
@media(max-width:720px){.shared-harmony-controls>button{flex-basis:calc((100% - 12px)/4)!important;width:calc((100% - 12px)/4)!important}}
/* Identical section colour code in Allenamento and Brani. */
.shared-section-01{--section-color:#75cfff}.shared-section-02{--section-color:var(--warm)}.shared-section-03{--section-color:#d79cff}.shared-section-04{--section-color:var(--accent)}
.shared-settings-section :is(.section-title h2,.section-title>span),.shared-settings-section.selector-group-title,.shared-settings-section.selector-group-title::before{color:var(--section-color)!important}
.shared-settings-section .section-title>span,.shared-settings-section.selector-group-title::before{border-color:color-mix(in srgb,var(--section-color) 58%,transparent)!important}
.shared-settings-section label,.shared-section-control{color:var(--section-color)!important}
/* First-party beta analytics */
.login-dialog{width:min(92vw,480px);padding:0;border:1px solid var(--line);border-radius:20px;background:transparent;box-shadow:0 30px 90px #000}.login-dialog::backdrop{background:rgba(3,5,8,.78);backdrop-filter:blur(8px)}.login-dialog article{margin:0;padding:1.35rem;background:var(--panel);border-radius:19px}.login-dialog header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--line);margin-bottom:1rem}.login-dialog h2{margin:.15rem 0 .8rem}.login-dialog-close{font-size:1.7rem;line-height:1;text-decoration:none;color:var(--muted)}.login-dialog form{display:grid;gap:.75rem}.login-dialog footer{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}.account-success{color:var(--accent)}.account-alternative{margin:1rem 0 0}.admin-user-summary,.admin-user-actions{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap}.admin-user-summary{padding:.65rem 0;color:var(--muted)}.admin-user-summary a{margin-left:auto}.admin-user-actions{margin-top:.8rem}.admin-user-actions .grant-form{flex:1}.danger{border-color:#d95f63!important;color:#ff9a9d!important}

/* Shared header: full navigation on desktop, one clean menu on small screens. */
.desktop-header-actions{display:flex;align-items:center;gap:10px;min-height:42px}.mobile-header-menu{display:none}.password-help{display:block;margin:-.35rem 0 .75rem;text-align:right;font-size:.72rem}
@media(max-width:900px){
  .desktop-header-actions{display:none}.mobile-header-menu{display:block;position:relative;margin:0}.mobile-header-menu>summary{display:grid;width:42px;height:42px;padding:10px;border:1px solid var(--line);border-radius:10px;background:rgba(10,14,20,.82);cursor:pointer;list-style:none;align-content:center;gap:4px}.mobile-header-menu>summary::-webkit-details-marker{display:none}.mobile-header-menu>summary span{display:block;width:20px;height:2px;border-radius:2px;background:var(--accent)}
  .mobile-header-panel{position:absolute;z-index:100;top:50px;right:0;width:min(310px,calc(100vw - 24px));padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);box-shadow:0 20px 55px rgba(0,0,0,.55)}.mobile-header-panel .context-nav{display:grid;gap:5px}.mobile-header-panel .context-nav a{display:block;padding:10px 12px;border-radius:8px;font-size:.76rem}.mobile-account-row{display:flex;align-items:center;gap:7px;margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}.mobile-account-row .language-switch{display:flex!important;margin-left:auto}
  .portal-header,.unified-header{overflow:visible!important}.portal-header .portal-nav,.unified-header .portal-nav{display:block;margin-left:auto}
}
.privacy-shell,.analytics-shell{max-width:1180px}.privacy-card{max-width:760px;padding:1.5rem;border:1px solid var(--line);border-radius:18px;background:var(--panel)}.privacy-card form{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}.privacy-toggle{display:flex;align-items:center;gap:.65rem;flex:1 1 100%;margin:0}.privacy-toggle input{width:auto;margin:0}.analytics-heading nav{display:flex;gap:.45rem}.analytics-heading nav a{padding:.4rem .7rem;border:1px solid var(--line);border-radius:999px;text-decoration:none}.analytics-heading nav a.active{color:#111;background:var(--accent);border-color:var(--accent)}.analytics-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem;margin:1rem 0}.analytics-kpis article,.analytics-grid article,.analytics-daily{padding:1rem;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.analytics-kpis small{display:block;text-transform:uppercase;letter-spacing:.08em}.analytics-kpis strong{font-size:2rem;color:var(--accent)}.analytics-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.analytics-grid h2,.analytics-daily h2{font-size:1rem;margin:0 0 .7rem}.analytics-row{display:flex;justify-content:space-between;gap:1rem;padding:.42rem 0;border-bottom:1px solid var(--line)}.analytics-row span{text-transform:capitalize}.analytics-daily{margin-top:1rem}.analytics-bars{display:flex;align-items:flex-end;gap:.35rem;height:150px}.analytics-bars>div{display:flex;flex:1;height:100%;min-width:18px;flex-direction:column;justify-content:flex-end;text-align:center}.analytics-bars span{display:block;min-height:4px;border-radius:4px 4px 0 0;background:var(--accent)}.analytics-bars small{font-size:.65rem;margin-top:.3rem}.analytics-purge{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:1rem}.analytics-purge p{margin:0}@media(max-width:760px){.analytics-kpis{grid-template-columns:1fr 1fr}.analytics-grid{grid-template-columns:1fr}.analytics-bars small{display:none}}