.mobile-tabs,.mobile-lesson-dock{display:none}
@media(max-width:700px),(max-width:1000px) and (max-height:500px){
  .app-shell{padding:0 14px;padding-bottom:calc(172px + env(safe-area-inset-bottom))}
  .topbar{height:76px;gap:8px}.brand strong{font-size:23px}.brand-pig{width:33px}.header-note,.save-status{display:none}.topbar nav{gap:4px}.nav-button{font-size:12px;padding:8px}.nav-button svg{display:none}.icon-button{min-width:44px;min-height:44px}
  .page-heading{margin:18px 0;gap:10px;align-items:center}.page-heading h1{font-size:24px}.eyebrow{font-size:11px}.attendance{gap:5px;font-size:11px}.attendance>span{display:none}.attendance b{font-size:12px}.inline-edit{min-width:36px;min-height:40px}
  .mobile-tabs{display:flex;gap:5px;padding:4px;border-radius:12px;background:#e9e1ed;margin-bottom:14px}
  .mobile-tabs button{flex:1;min-height:44px;border:0;border-radius:9px;background:transparent;color:#77617f;font-size:14px}.mobile-tabs button[aria-pressed=true]{background:#fffafc;box-shadow:0 2px 6px #59416b12;color:#4f3f58;font-weight:700}
  .game-layout{display:block}.stage{width:100%;height:clamp(330px,48svh,450px);aspect-ratio:auto;margin:0}
  body:not([data-pig-view=classroom]) .stage{display:none}
  .notebook{display:block;padding:18px;box-shadow:0 3px 0 #e5dce9;margin-bottom:16px}
  body[data-pig-view=classroom] .notebook,body:not([data-pig-view=schedule]) .courses-section{display:none}
  body[data-pig-view=schedule] .notebook-tabs,body[data-pig-view=schedule] .pig-profile,body[data-pig-view=schedule] .stat-list,body[data-pig-view=schedule] .coach-note{display:none}
  body[data-pig-view=profile] .queue-heading,body[data-pig-view=profile] .queue,body[data-pig-view=profile] .queue-hint{display:none}
  .notebook-tabs{font-size:15px}.pig-profile{margin:14px 0}.stat-list{display:grid;gap:14px;margin:20px 0}.stat-label,.stat-value{font-size:13px}.coach-note p{font-size:14px}.coach-note small{font-size:12px}
  .queue-heading{margin:0 0 10px}.queue-heading h2{font-size:18px}.queue-heading>span{font-size:12px}.queue{margin:0}.queue li{min-height:48px;font-size:14px}.queue button{min-width:44px;min-height:44px}.queue-hint{font-size:13px;margin:10px 0 0}
  .courses{grid-template-columns:1fr;gap:10px}.course-card{min-height:94px;padding:15px;grid-template-columns:42px 1fr;gap:14px}.course-icon{width:42px;height:46px}.course-card h3{font-size:19px}.course-card p,.course-gains{font-size:12px}.course-plus{right:16px;top:18px}.courses-heading h2{font-size:21px}.courses-heading h2 span{display:block;margin:5px 0;font-size:12px}.duration-note{font-size:12px}
  .mobile-lesson-dock{display:grid;grid-template-columns:1fr auto;gap:8px;position:fixed;bottom:0;left:0;right:0;z-index:30;padding:10px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:#fcf8fdef;border-top:1px solid #ded2e3;backdrop-filter:blur(14px)}
  #mobile-schedule{grid-column:1/-1;display:flex;justify-content:space-between;border:0;background:none;padding:0 4px;color:#856990;font-size:13px;min-height:32px}
  .mobile-lesson-dock .active-lesson{grid-column:1/-1;margin:0}.mobile-lesson-dock .active-lesson>div:first-child{font-size:12px;margin-bottom:5px}
  .mobile-lesson-dock .main-action{margin:0;min-height:48px;font-size:15px;padding:10px}.mobile-lesson-dock .playback{display:flex;margin:0;gap:6px}.mobile-lesson-dock .playback button{min-width:48px;min-height:48px;font-size:13px;padding:8px;border:1px solid #ded2e3;border-radius:9px}.mobile-lesson-dock .playback button svg{width:16px}.mobile-lesson-dock .playback button span{display:none}
  .stage-sound{width:44px;height:44px}.interaction-button{min-height:48px;font-size:15px;padding:10px 20px}.stage-footnote,.stage-bottom{font-size:11px}.lesson-caption{font-size:16px}.idle-caption{font-size:18px}.training-control{bottom:8%}.stage[data-phase=training] .meme-actor{bottom:22%}.stage[data-phase=training] .stage-bottom{display:none}
  .footer{font-size:11px;padding:20px 0}.toast{bottom:calc(178px + env(safe-area-inset-bottom));font-size:14px;width:max-content;max-width:90vw;white-space:normal}
  .dialog{width:calc(100% - 20px);max-height:85dvh;overflow:auto;padding:20px}.dialog button{min-height:44px}.dialog input{font-size:16px}.settings-info,.setting-row p,.memory-card p{font-size:13px}
  .page-heading{display:flex;justify-content:space-between}.attendance{display:flex;flex-direction:column;align-items:flex-end;margin:0;padding:0;width:74px;flex-shrink:0}.attendance-dots,#attendance-dots{display:grid;grid-template-columns:repeat(4,1fr);gap:4px}.page-heading h1{font-size:22px}.page-heading .inline-edit{min-width:26px}
  .mobile-lesson-dock .main-action{grid-column:1;grid-row:auto}.mobile-lesson-dock .playback{grid-column:2;grid-row:auto;padding:0;border:0;align-self:stretch}
  .page-heading{padding:0}.pig-profile{display:flex;gap:14px;width:100%;align-items:center}.pig-profile>div:last-of-type{flex:1}.pig-profile strong{font-size:21px}.pig-profile p{font-size:12px;line-height:1.7}.pig-profile #profile-pig{width:64px;height:64px;flex-shrink:0}.stat-row strong{font-size:14px}
}
@media(max-height:500px) and (min-width:701px) and (max-width:1000px){
  .app-shell{padding:0 12px 12px}.topbar{height:62px}.page-heading,.footer{display:none}.mobile-tabs{position:fixed;top:76px;right:12px;width:31%;z-index:20}.mobile-tabs button{font-size:13px}.game-layout{margin-right:34%;padding-top:8px}.stage{height:calc(100dvh - 82px);min-height:0}.mobile-lesson-dock{left:auto;right:0;width:33%;padding:10px}.mobile-lesson-dock .main-action{font-size:12px;padding:8px}.mobile-lesson-dock .playback{gap:4px}.mobile-lesson-dock .playback button{min-width:40px;font-size:12px}.toast{bottom:20px;max-width:55%;left:32%}.courses-heading h2{font-size:18px}
}