/* 타자연습 on wide screens: settings column + practice area, one screen, no page scroll. */
@media (min-width:960px) and (min-height:560px){
  html,body{height:100%;overflow:hidden}
  .game-shell{height:100dvh;max-width:1240px!important;box-sizing:border-box;margin:0 auto;padding:0 24px!important;display:grid;grid-template-columns:380px minmax(0,1fr);grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-areas:"top top" "title title" "setup battle" "note note";column-gap:20px;row-gap:10px}
  .topbar{grid-area:top;margin:0!important;padding:6px 0!important;min-height:0}
  .title-row{grid-area:title;margin:0!important;display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
  .title-row h1{font-size:1.625rem!important;line-height:1.2!important;margin:0}
  .title-row .subtitle{font-size:.9375rem!important;margin:4px 0 0}
  .title-actions .icon-button{min-height:38px}
  #setup{grid-area:setup;min-height:0;overflow:auto;margin:0!important;padding:16px!important;box-sizing:border-box;display:flex;flex-direction:column;gap:12px;scrollbar-width:thin}
  #setup>*{margin:0!important}
  #setup .setup-grid{grid-template-columns:1fr 1fr!important;gap:10px}
  #setup .setup-grid select{min-width:0}
  #setup .mode-options{gap:8px}
  #setup .mode{min-height:48px;padding:8px 10px}
  #setup .content-level-row{row-gap:6px}
  #setup #level-help,#setup .setup-bottom p{font-size:.8125rem!important;line-height:1.5}
  #setup .content-status,#setup .profile-status{font-size:.8125rem}
  #setup .profile-status:empty,#setup .content-status:empty{display:none}
  .help{grid-area:setup;z-index:3;min-height:0;overflow:auto;margin:0!important;box-shadow:0 12px 30px #12352518}
  .battle{grid-area:battle;min-height:0;margin:0!important;display:flex;flex-direction:column;overflow:hidden}
  .battle>*{flex:none}
  .battle .typing-hud{padding-block:8px!important}
  .battle .arena-overlay>div{padding:12px 20px!important;gap:6px}
  .battle .arena-overlay .overlay-symbol{display:none}
  .battle .arena-overlay h2{margin:0!important}.battle .arena-overlay p{margin:0!important}
  .battle .target-panel{padding-block:4px!important}
  .battle .arena,.battle.stationary .arena{flex:1 1 auto;height:auto!important;min-height:150px}
  .battle .typing-status{min-height:0}
  .battle.stationary #enemies{padding:10px 16px!important}
  .battle.stationary .enemy{padding:14px 22px!important}
  body.playing .title-row .subtitle{display:none}
  #results{grid-area:battle;z-index:4;min-height:0;overflow:auto;margin:0!important;box-sizing:border-box;scrollbar-width:thin}
  /* metric note and source share the bottom line */
  .metric-note{grid-area:note;margin:0!important;padding:4px 300px 10px 0!important;font-size:.75rem!important;line-height:1.5}
  .game-shell>footer{grid-area:note;justify-self:end;align-self:start;margin:0!important;padding:4px 0 10px!important;border:0!important;font-size:.75rem}
}