/* GuitarPath 4.18.0 — separate, focused presentation for touch-sized viewports.
   Desktop styles are intentionally unchanged. */
#gpMobileNav,#gpMobileGameBar,#gpMobileMore{display:none}
@media (max-width:760px), (max-height:500px) and (pointer:coarse){
 html.gp-mobile{font-size:15px;overflow-x:hidden;scroll-padding-top:65px}
 .gp-mobile body{min-width:0;overflow-x:hidden;padding-bottom:calc(77px + env(safe-area-inset-bottom));background:#080f1d}
 .gp-mobile .app{display:block;min-height:100dvh;width:100%;overflow:clip}
 .gp-mobile .sidebar{display:none!important}
 .gp-mobile .main{padding:0 10px 18px;min-width:0;width:100%;max-width:100vw}
 .gp-mobile .topbar{position:relative;min-height:51px;margin:0 -10px 7px;padding:8px 12px;background:#101a2a;border-bottom:1px solid #28415e;gap:8px;align-items:center}
 .gp-mobile .topbar h1{font-size:17px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw}
 .gp-mobile .topbar .muted.small{display:none}
 .gp-mobile .topbar-status{gap:5px;flex-wrap:nowrap;min-width:0;max-width:54vw}
 .gp-mobile .gp-support-topbar-link,.gp-mobile .gp-feedback-topbar{display:none!important}
 .gp-mobile #micStatus{font-size:10px;padding:6px;min-width:0;max-width:54vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .gp-mobile #gpVersionBadge{display:none}
 .gp-mobile .screen{min-width:0}
 .gp-mobile .screen.active{display:block}
 .gp-mobile .card{padding:12px;border-radius:13px;box-shadow:none}
 .gp-mobile .grid.cols2,.gp-mobile .grid.cols3,.gp-mobile .form-grid,.gp-mobile .form-grid.two{grid-template-columns:minmax(0,1fr);gap:9px}
 .gp-mobile .controls{gap:7px}
 .gp-mobile button,.gp-mobile select,.gp-mobile input[type=search]{min-height:42px;touch-action:manipulation}
 .gp-mobile input,.gp-mobile select,.gp-mobile textarea{font-size:16px;max-width:100%}
 .gp-mobile .song-row{align-items:stretch;flex-direction:column;padding:11px;gap:8px}
 .gp-mobile .song-meta{min-width:0}.gp-mobile .song-meta>div:last-child{min-width:0;overflow-wrap:anywhere}
 .gp-mobile .song-row .row-actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}
 .gp-mobile .song-row .row-actions button:first-child{grid-column:1/-1;min-height:48px}
 .gp-mobile .library-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
 .gp-mobile .library-tools>.field:first-child{grid-column:1/-1}
 .gp-mobile #library .library-head-actions{width:100%}
 .gp-mobile #library .library-head-actions button{flex:1}
 .gp-mobile #home .ui41-page-intro,.gp-mobile #arcade .ui41-page-intro{display:none}
 .gp-mobile #home .card{margin-top:9px!important}
 .gp-mobile .home-header-actions,.gp-mobile .home-hero-actions{flex-wrap:wrap}
 /* Always-on touch navigation, separate from the desktop sidebar. */
 .gp-mobile #gpMobileNav{position:fixed;bottom:0;left:0;right:0;z-index:1100;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:3px;min-height:68px;padding:6px 5px calc(6px + env(safe-area-inset-bottom));background:#101a2bf5;border-top:1px solid #395474;box-shadow:0 -10px 30px #0008}
 .gp-mobile #gpMobileNav button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;min-width:0;padding:5px 2px;border-radius:11px;background:transparent;color:#b3c5d9;font-weight:700;font-size:10px;line-height:1.1}
 .gp-mobile #gpMobileNav button.active{background:#173f40;color:#a4f6d4}
 .gp-mobile #gpMobileNav .gp-mobile-nav-icon{font-size:21px;line-height:1.3}
 /* The game toolbar replaces the desktop toolbar when a song or arcade is open. */
 .gp-mobile #gpMobileGameBar:not([hidden]){display:flex;align-items:center;gap:6px;position:sticky;top:0;z-index:1050;margin:0 -10px 6px;padding:6px 9px;background:#101b2af9;border-bottom:1px solid #3e5670;box-shadow:0 7px 15px #0006;min-height:54px}
 .gp-mobile #gpMobileGameBar>[hidden]{display:none!important}
 .gp-mobile .gp-mobile-game-title{flex:1;min-width:0;max-width:30%;font-size:12px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .gp-mobile #gpMobileGameBar button{min-height:40px;white-space:nowrap;padding:8px;border-radius:9px;font-size:12px;font-weight:800}
 .gp-mobile #gpMobileMic{background:#20405a;border:1px solid #4389aa;color:white}
 .gp-mobile #gpMobileMic[aria-pressed=true]{background:#1b6047;border-color:#5dd09b}
 .gp-mobile #gpMobilePlay{background:#299d51;color:white}
 .gp-mobile #gpMobileOptions{background:#26364c}
 .gp-mobile #gpMobileBack{background:#233042}
 .gp-mobile #gpMobileMore{display:none;position:fixed;inset:0 0 calc(68px + env(safe-area-inset-bottom));z-index:1150;background:#07101bee;overflow-y:auto;padding:16px}
 .gp-mobile.gp-mobile-more #gpMobileMore{display:block}
 .gp-mobile .gp-mobile-more-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
 .gp-mobile .gp-mobile-more-head h2{margin:0}
 .gp-mobile .gp-mobile-more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .gp-mobile .gp-mobile-more-grid button{min-height:72px;background:#152337;border:1px solid #334b67;font-weight:800;text-align:center;padding:10px}
 .gp-mobile .gp-mobile-more-actions{display:grid;gap:10px;margin-top:20px}
 .gp-mobile .gp-mobile-more-actions button,.gp-mobile .gp-mobile-more-actions a{display:block;width:100%;min-height:44px;padding:12px;background:#1c2c40;border-radius:10px;color:#dbefff;text-decoration:none;text-align:center;border:1px solid #354961}
 /* Playing a song: tabulature sits directly underneath the sticky quick controls. */
 .gp-mobile #trainer.gp-mobile-stage{display:flex;flex-direction:column;gap:0}
 .gp-mobile #trainer.gp-mobile-stage > #highwayCard{order:0!important;margin:0!important;padding:0!important;width:100%;overflow:hidden}
 .gp-mobile #trainer.gp-mobile-stage > #karaokeTrainerCard:not(.hidden){order:0!important}
 .gp-mobile #trainer.gp-mobile-stage:has(#karaokeTrainerCard:not(.hidden)) > #highwayCard{display:none}
 .gp-mobile #trainer.gp-mobile-stage > :not(#highwayCard):not(#karaokeTrainerCard){display:none!important}
 .gp-mobile.gp-mobile-options #trainer.gp-mobile-stage > :not(#highwayCard):not(#karaokeTrainerCard):not(.hidden){display:block!important;order:2}
 .gp-mobile #trainer.gp-mobile-stage #highwayChordCoach{display:none!important}
 .gp-mobile #trainer.gp-mobile-stage .trainer-wrap{margin:0!important;max-width:100%;overflow-x:hidden;overflow-y:hidden;border-radius:12px}
 .gp-mobile #trainer.gp-mobile-stage .tab-canvas{min-width:0!important;width:100%!important;height:clamp(255px,45dvh,450px)!important;overflow:hidden}
 .gp-mobile #trainer.gp-mobile-stage .highway-transport{padding:8px 6px;display:flex;flex-wrap:wrap;gap:6px}
 .gp-mobile #trainer.gp-mobile-stage .highway-transport>button:not(#highwayPlayBtn):not(.highway-stop-btn),.gp-mobile #trainer.gp-mobile-stage .highway-transport>label,.gp-mobile #trainer.gp-mobile-stage .highway-transport>#highwayPrepareInfo{display:none!important}
 .gp-mobile #trainer.gp-mobile-stage #highwayPlayBtn,.gp-mobile #trainer.gp-mobile-stage .highway-stop-btn{flex:1;min-height:44px}
 .gp-mobile #trainer.gp-mobile-stage .song-navigator{padding:8px 10px!important}
 .gp-mobile #trainer.gp-mobile-stage .song-navigator .song-nav-actions,.gp-mobile #trainer.gp-mobile-stage .song-navigator .song-nav-hint,.gp-mobile #trainer.gp-mobile-stage .song-navigator .song-nav-loop{display:none}
 .gp-mobile #trainer.gp-mobile-stage .song-navigator-head{font-size:12px}
 .gp-mobile #trainer.gp-mobile-stage .chord-coach-card{display:none!important}
 /* Arcade cards switch to a usable one-column launcher; a running game becomes full-width. */
 .gp-mobile #arcade .arcade-main-card,#arcadeHubCard{margin-top:0!important;padding:7px!important;min-width:0}
 .gp-mobile #arcade .arcade-game-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
 .gp-mobile #arcade .arcade-game-card{min-width:0;padding:12px}
 .gp-mobile #arcade .arcade-hero{display:none}
 .gp-mobile #arcade .arcade-game-actions{flex-wrap:wrap}
 .gp-mobile #arcade .arcade-game-actions .primary{min-height:46px;flex:1}
 .gp-mobile #arcade .arcade-game-record{gap:4px;flex-wrap:wrap}
 .gp-mobile #arcade.gp-mobile-stage .arcade-toolbar{display:none}
 .gp-mobile #arcade.gp-mobile-stage .ga-shell,.gp-mobile #arcade.gp-mobile-stage .gpr-shell,.gp-mobile #arcade.gp-mobile-stage .fs-shell{width:100%;max-width:100%;margin:0;padding:8px;border-radius:12px}
 .gp-mobile #arcade.gp-mobile-stage .ga-topline{flex-wrap:wrap;gap:4px}
 .gp-mobile #arcade.gp-mobile-stage .ga-topline p,.gp-mobile #arcade.gp-mobile-stage .gpr-top p{display:none}
 .gp-mobile #arcade.gp-mobile-stage .gpr-top h2,.gp-mobile #arcade.gp-mobile-stage .ga-topline h2{font-size:17px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-hud{padding:5px;gap:4px;font-size:11px;margin:2px 0}
 .gp-mobile #arcade.gp-mobile-stage .gpr-hud span{font-size:11px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-feedback{height:24px;font-size:12px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-road{height:clamp(280px,55dvh,570px)}
 .gp-mobile #arcade.gp-mobile-stage .ga-ninja-stage{height:clamp(250px,50dvh,390px)}
 .gp-mobile #arcade.gp-mobile-stage .mini-string-board{max-width:100%}
 .gp-mobile #arcade.gp-mobile-stage .ga-tower-scene{height:180px;max-width:100%}
 .gp-mobile #arcade.gp-mobile-stage .arcade-hud-row{gap:4px}
 .gp-mobile #arcade.gp-mobile-stage .special-mini-head{gap:5px}
 .gp-mobile #arcade.gp-mobile-stage .special-mini-stats{gap:3px}
 .gp-mobile #arcade.gp-mobile-stage .special-mini-stage{max-width:100%}
 /* Microphone-first settings, no PC amp/cable controls on phones. */
 .gp-mobile #audioSetup .audio-monitor-card,.gp-mobile #audioSetup .amp-controls,.gp-mobile #audioSetup .amp-monitor-controls,.gp-mobile #audioSetup .electric-only,.gp-mobile #audioSetup .amp-only{display:none!important}
 .gp-mobile #audioSetup .form-grid{grid-template-columns:minmax(0,1fr)}
 .gp-mobile #tuner .tuner-wrap{max-width:100%}
 .gp-mobile #editor .form-grid{grid-template-columns:minmax(0,1fr)}
 .gp-mobile .gp-welcome-dialog,.gp-mobile .gp-feedback-dialog{max-height:90dvh}
}
@media (max-width:430px){
 .gp-mobile .gp-mobile-game-title{max-width:22%;font-size:11px}
 .gp-mobile #gpMobileGameBar button{padding:7px 5px;font-size:11px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-road{height:clamp(285px,52dvh,470px)}
}
@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){
 .gp-mobile .topbar{display:none}
 .gp-mobile #gpMobileNav{min-height:52px;padding:2px 7px calc(2px + env(safe-area-inset-bottom))}
 .gp-mobile #gpMobileNav button{font-size:9px}.gp-mobile #gpMobileNav .gp-mobile-nav-icon{font-size:16px}
 .gp-mobile body{padding-bottom:calc(58px + env(safe-area-inset-bottom))}
 .gp-mobile #trainer.gp-mobile-stage .tab-canvas{height:clamp(185px,60dvh,300px)!important}
 .gp-mobile #arcade.gp-mobile-stage .gpr-road{height:clamp(190px,62dvh,310px)}
 .gp-mobile #arcade.gp-mobile-stage .ga-ninja-stage{height:clamp(190px,61dvh,290px)}
}
/* The highway's six lane positions are absolute pixels (72..302).
   Compact landscape scales the visuals without altering note timing or playback. */
@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){
 .gp-mobile #trainer.gp-mobile-stage .tab-canvas{height:191px!important}
 .gp-mobile #trainer.gp-mobile-stage #highwayLanes,
 .gp-mobile #trainer.gp-mobile-stage #laneLabels,
 .gp-mobile #trainer.gp-mobile-stage #tabTrack{scale:1 .55;transform-origin:top left}
 .gp-mobile #trainer.gp-mobile-stage .song-navigator{display:none}
 .gp-mobile #trainer.gp-mobile-stage .highway-transport{padding:5px}
 .gp-mobile #trainer.gp-mobile-stage .highway-transport #highwayPlayBtn,
 .gp-mobile #trainer.gp-mobile-stage .highway-transport .highway-stop-btn{min-height:40px}
}
@media (max-width:760px), (max-height:500px) and (pointer:coarse){
 .gp-mobile #audioSetup #profile-acoustic-pickup,
 .gp-mobile #audioSetup #profile-acoustic-magnetic,
 .gp-mobile #audioSetup #profile-electric-interface{display:none!important}
 .gp-mobile #audioSetup .device-row>.field:nth-child(2){display:none}
 .gp-mobile .gp-mobile-only{display:block!important}
}
.gp-mobile-only{display:none}
@media (max-width:760px), (max-height:500px) and (pointer:coarse){
 /* One compact game header instead of a duplicate site title. */
 .gp-mobile.gp-mobile-playing .topbar{display:none}
 .gp-mobile #arcade.gp-mobile-stage .gpr-road{height:clamp(285px,43dvh,430px)}
 .gp-mobile #arcade.gp-mobile-stage .gpr-shell{padding:6px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-keyboard{display:none}
 .gp-mobile #arcade.gp-mobile-stage .gpr-top{gap:4px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-kicker{font-size:9px;margin-bottom:2px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-controls{gap:5px;margin-top:4px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-controls button{min-height:39px}
}
@media (orientation:landscape) and (max-height:500px) and (pointer:coarse){
 .gp-mobile #arcade.gp-mobile-stage .gpr-road{height:clamp(164px,46dvh,220px)}
 .gp-mobile #arcade.gp-mobile-stage .gpr-top p,.gp-mobile #arcade.gp-mobile-stage .gpr-feedback{display:none}
 .gp-mobile #arcade.gp-mobile-stage .gpr-hud{padding:2px 7px}
 .gp-mobile #arcade.gp-mobile-stage .gpr-shell{padding:4px}
}