/* Shared small-screen workspace. Exported documents have their own layout. */
.q-mobile-preview-note{display:none}
[hidden]{display:none!important}
@media screen and (max-width:768px){
  :root{--pad:clamp(14px,4vw,24px)}
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{min-width:0}
  button,a,input,select,textarea,summary{touch-action:manipulation}
  img,svg,video{max-width:100%}
  fieldset{min-inline-size:0;max-width:100%}
  legend{max-width:100%;white-space:normal}
  :is(.workshop,.teacher-planner,.shell,.connection-card,.launchpad) :is(input:not([type=checkbox],[type=radio],[type=hidden],[type=file],[type=range]),select,textarea){
    box-sizing:border-box;min-width:0;max-width:100%;font-size:16px;line-height:1.5
  }
  :is(.workshop,.teacher-planner,.shell,.connection-card,.launchpad) select{min-height:48px;text-overflow:ellipsis}
  :is(.workshop,.teacher-planner,.shell,.connection-card,.teacher-tools-section,.launchpad) button{
    min-height:44px;max-width:100%;white-space:normal;overflow-wrap:anywhere;line-height:1.5
  }
  :is(.workshop,.teacher-planner,.shell,.launchpad) :is(p,h2,h3,h4,small,label,strong,a){overflow-wrap:anywhere}
  .header-v2{padding-inline:max(var(--pad),env(safe-area-inset-left)) max(var(--pad),env(safe-area-inset-right))}
  .header-v2 .header-inner{min-height:72px;gap:12px}
  .header-v2 .menu-button{width:46px;height:46px;flex-shrink:0}
  .header-v2>.mobile-menu:not([hidden]){max-height:calc(100dvh - 130px);overflow-y:auto;overscroll-behavior:contain}
  .header-v2>.mobile-menu a{min-height:48px;display:flex;align-items:center}
  .hero-v4 .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .hero-v4 .hero-actions .button{min-height:48px;padding:13px 10px;justify-content:space-between}
  .launch-top,.launch-foot{flex-wrap:wrap}
  .launch-top a{min-height:44px;display:inline-flex;align-items:center}
  .launch-roles{display:flex;flex-wrap:wrap;gap:8px}
  .launch-roles button{flex:1 1 110px;font-size:15px}
  .workshop-main{padding:24px 16px}
  .workshop-sidebar{padding:16px}
  .workshop-tool-list{grid-template-columns:repeat(3,minmax(0,1fr))}
  .workshop-form-heading{flex-wrap:wrap;align-items:flex-start}
  .workshop-form-heading button{white-space:normal;font-size:13px}
  .workshop-fields,.q-settings-grid,.q-identity,.q-school-grid,.q-structured-edit,.q-options{grid-template-columns:minmax(0,1fr)}
  .workshop-fields>div{grid-column:auto!important;grid-row:auto!important}
  .question-workspace{margin-top:24px;padding-top:22px}
  .q-generation-settings,.q-type-mix{padding:14px}
  .q-generation-settings legend,.q-school-picker legend{font-size:13px;letter-spacing:0;line-height:1.6}
  .q-mix-heading{align-items:flex-start;flex-wrap:wrap}
  .q-mix-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
  .q-mix-grid input{min-height:48px;font-size:18px}
  .q-bank-toolbar{align-items:stretch;flex-direction:column;gap:12px}
  .q-bank-toolbar>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .q-bank-toolbar strong{font-size:14px;line-height:1.7}
  .q-bank-toolbar button,.q-bank-filters button{font-size:13px;padding:10px}
  .q-bank-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .q-card{padding:15px;margin-bottom:16px}
  .q-card-top{align-items:stretch;flex-direction:column;gap:8px}
  .question-workspace .q-select,.question-workspace .q-review{display:flex;gap:12px;min-height:44px;align-items:center;font-size:14px;line-height:1.6}
  .question-workspace .q-select input,.question-workspace .q-review input{width:22px;height:22px;min-width:22px;min-height:22px;margin:0;flex:0 0 22px}
  .q-card-meta{text-align:left;font-size:12px}
  .q-source-goal{max-height:none;font-size:13px}
  .q-card>a,.q-school-actions a{display:inline-flex;align-items:center;min-height:44px;font-size:13px}
  .q-edit-field>span{font-size:13px}
  .question-workspace .q-edit-field textarea{font-size:16px;padding:11px;line-height:1.6}
  .q-card-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .q-card-actions button:last-child{grid-column:1/-1;margin-left:0}
  .q-answer summary{min-height:44px;font-size:14px;padding-block:10px}
  .q-answer select{width:100%;max-width:100%}
  .q-test-builder{padding:16px;margin-top:24px}
  .q-total-control,.q-layout-controls{max-width:none}
  .q-layout-controls{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px}
  .q-layout-controls select{padding:11px 8px}
  .q-school-picker{padding:12px}
  .q-school-grid label,.q-identity label{font-size:13px}
  .q-school-current{font-size:14px;line-height:1.7;overflow-wrap:anywhere}
  .q-school-actions{gap:8px;align-items:stretch;flex-direction:column}
  .q-school-actions button{font-size:13px}
  .question-workspace #q-create-test{width:100%;font-size:15px}
  .question-workspace .q-review{align-items:flex-start;padding-block:10px}
  .question-workspace .q-review input{margin-top:2px}
  .q-downloads{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
  .q-downloads button{width:100%;min-height:50px;font-size:15px}
  .q-download-status{font-size:14px;overflow-wrap:anywhere}
  .q-ready-download{display:flex;align-items:center;justify-content:center;min-height:52px;width:100%;text-align:center;font-size:15px;line-height:1.6;overflow-wrap:anywhere}
  .q-note{font-size:13px;line-height:1.7}
  .q-test-preview{padding:12px}
  .q-mobile-preview-note{display:block;font-size:13px;line-height:1.7;color:#586b5d;margin:14px 0}
  .q-preview-face{padding:14px}
  .q-preview-grid,.q-preview-grid[data-columns="2"],.q-preview-grid[data-columns="1"]{display:block}
  .q-preview-grid[data-columns="2"]>article:nth-child(n+3){border-left:0;padding-left:0!important}
  #q-test-content .q-preview-grid article h4{font-size:16px;line-height:1.65}
  #q-test-content .q-preview-grid article p{font-size:15px;line-height:1.7}
  .q-face-label{font-size:12px;line-height:1.7}
  .planner-controls{grid-template-columns:repeat(2,minmax(0,1fr))}
  .planner-controls,.planner-week-panel,.lesson-editor,.daily-agenda{padding:20px 16px}
  .planner-week-nav{grid-template-columns:44px minmax(0,1fr) 44px}
  .planner-week-nav select{font-size:16px;padding-inline:6px}
  .planner-calendar{grid-template-columns:minmax(0,1fr)}
  .planner-calendar #planner-today{justify-self:start}
  .lesson-download-buttons,.planner-editor-actions{display:grid;grid-template-columns:minmax(0,1fr);width:100%}
  .lesson-download-buttons button{width:100%;font-size:15px!important}
  .lesson-download-buttons span{display:inline;margin-left:8px}
  .lesson-studio-bridge{padding:20px 16px}
  .planner-small,.planner-controls-note,.workshop-disclosure{font-size:12px;line-height:1.7}
  .teacher-tool-filters button{font-size:13px}
  .teacher-tool-card summary{min-height:44px;padding-block:8px;font-size:14px}
  /* The class studio shares the same touch and text sizing. */
  .shell{padding-inline:max(16px,env(safe-area-inset-left)) max(16px,env(safe-area-inset-right));padding-bottom:max(40px,env(safe-area-inset-bottom))}
  .shell :is(.prepare-main,.prepare-grid,.record-grid,.slide-workbench,.results-tools,.field,.section-heading){min-width:0;max-width:100%}
  .shell .steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  .shell .steps button{font-size:14px;padding:12px}
  .shell .steps button b{display:inline;margin-right:7px}
  .workspace-bar .actions,.shell .export-row{display:grid;grid-template-columns:minmax(0,1fr);width:100%;gap:10px}
  .workspace-bar button{font-size:14px;min-height:48px}
  .shell .two-fields,.shell .prompt-settings{grid-template-columns:minmax(0,1fr)}
  .shell .question-head,.shell .student-item,.shell .saved-item{flex-wrap:wrap}
  .shell .question-card,.shell .context-box,.shell .import-box{padding:18px 14px}
  .shell .results-tools .field{min-width:0;width:100%}
  .shell .table-wrap{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain}
  .shell .section-heading{flex-wrap:wrap}
  .shell .question-card textarea,.shell details textarea{font-size:16px}
  #classroom-player{padding:16px max(14px,env(safe-area-inset-left)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-right))}
  #classroom-player[open]{display:flex;flex-direction:column;gap:12px}
  #classroom-player .player-toolbar{flex-wrap:wrap;flex-shrink:0;margin:0}
  #classroom-player .player-controls{flex-shrink:0;margin:0;gap:8px}
  #classroom-player #player-content{height:auto;min-height:0;flex:1 1 auto}
  #classroom-player :is(.player-hint,#player-status){flex-shrink:0;margin:0}
  #classroom-player button{min-height:44px;font-size:14px}
  #classroom-player .present-slide{padding:18px}
  .connection-card{padding:22px 16px}
}
@media screen and (max-width:380px){
  .header-v2 .brand-original{gap:7px}
  .brand-original .brand-wordmark{width:115px;height:auto}
  .brand-original .brand-emblem{width:40px;height:auto}
  .mobile-program-shortcut{flex-wrap:wrap;gap:3px;font-size:11px}
  .hero-v4 h1{font-size:clamp(48px,16vw,60px)}
  .workshop-main{padding-inline:12px}
  .q-card,.q-test-builder{padding:12px}
  .q-bank-filters{grid-template-columns:minmax(0,1fr)}
  .workshop-tool-list{grid-template-columns:minmax(0,1fr)}
  .workshop-tool-list button{display:flex;min-height:48px;padding:12px;gap:12px}
  .workshop-tool-list .tool-index{margin:0;font-size:11px}
  .workshop-tool-list button strong{font-size:14px}
  .shell .metrics{grid-template-columns:minmax(0,1fr)}
  .shell .metric+.metric{border-left:0;border-top:1px solid var(--line)}
  .topbar{padding-inline:14px;gap:10px}
  .topbar .brand{font-size:15px}
  .topbar button{padding-inline:12px}
}
@media screen and (max-height:500px) and (max-width:950px){
  .header-v2{position:relative}
  .header-v2>.mobile-menu:not([hidden]){max-height:none}
  #classroom-player .player-hint{display:none}
}
