/* Shared phone/tablet contract, applied after each imported application's styles. */
html{ -webkit-text-size-adjust:100%; scroll-padding-block:80px; }
body{overflow-wrap:break-word;}
button,a,input,select,textarea,[role=button]{touch-action:manipulation;}
input,textarea{user-select:text;-webkit-user-select:text;}
img,video{max-width:100%;}
.learning-home-bar{box-sizing:border-box;position:relative;z-index:40;display:flex;align-items:center;min-height:64px;padding:4px max(12px,env(safe-area-inset-right)) 4px max(12px,env(safe-area-inset-left));background:#fff9ef;border-bottom:1px solid #d3ddcf;}
.learning-home-link{display:inline-flex;align-items:center;gap:8px;min-height:56px;padding:0 12px;color:#244c43;font:600 18px system-ui;text-decoration:none;}
.learning-home-link img{width:32px;height:32px;}
@media(max-width:1366px),(pointer:coarse){
  html{--touch-target:56px;}
  button,select,[role=button]{min-height:var(--touch-target);}
  input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select{font-size:max(16px,1em);max-width:100%;}
  button{white-space:normal;}
  :focus-visible{outline:3px solid #1d64a8;outline-offset:3px;}
  .touch-mini header,.touch-mini nav{flex-wrap:wrap;gap:12px;}
  .touch-mini nav a,.touch-mini .btn,.touch-mini .tab,.touch-mini .back-btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;}
  .touch-mini .container,.touch-mini main{min-width:0;max-width:100%;box-sizing:border-box;}
  .touch-mini .flashcard{max-width:100%;}
  .touch-reading .back-btn{width:56px;height:56px;}
  .touch-reading .bottom-nav{padding-bottom:env(safe-area-inset-bottom);}
  .touch-reading .app-container{padding-bottom:calc(96px + env(safe-area-inset-bottom));}
  .touch-reading .nav-item{min-height:56px;}
  .touch-admin .top-actions{flex-wrap:wrap;}
  .touch-admin .identity{flex-wrap:wrap;}
  .touch-admin .pager{flex-wrap:wrap;justify-content:center;}
  .touch-admin .search-form{width:100%;min-width:0;}
  .touch-admin .search-form input{min-width:0;flex:1;}
  .touch-admin .table-scroll{overscroll-behavior-inline:contain;}
  .touch-admin dialog{max-height:calc(100dvh - 24px);max-width:calc(100vw - 24px);}
  .touch-admin input[type=checkbox]{min-width:24px;min-height:24px;}
  .touch-admin .check-row label{min-height:48px;}
  .touch-admin fieldset{min-width:0;}
  .touch-admin .login-layout{margin-block:24px;}
}
@media(max-width:600px){
  .touch-mini header{padding-inline:16px;}
  .touch-mini .hero h1{font-size:clamp(26px,7vw,36px);}
  .touch-mini .toolbar,.touch-mini .controls,.touch-mini .actions{flex-wrap:wrap;gap:12px;}
  .touch-mini .flashcard{min-width:0;width:100%;}
  .touch-admin .login-story>p{font-size:16px;margin-block:8px;}
  .touch-admin .login-story h1{font-size:26px;margin-block:8px;}
  .touch-admin .login-panel{padding:20px;}
  .touch-admin .actions>button{flex:1 1 140px;}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
html[data-learning-module=joye-preschool] .learning-home-bar{position:sticky;top:0;z-index:60;}
html[data-learning-module=joye-preschool] .fixed.top-0{top:64px;}
html[data-learning-module=kids-learning-games] body{height:100dvh;overflow:hidden;}
html[data-learning-module=kids-learning-games] #root{height:calc(100dvh - 64px);min-height:0;}
html[data-learning-module=kids-learning-games] .control-guide{display:none;}
@media(max-width:600px){
 html[data-learning-module=cword] .px-6{padding-inline:16px;}
 html[data-learning-module=cword] .p-8{padding:20px;}
 html[data-learning-module=joye-preschool] .mantine-Button-label{white-space:normal;line-height:1.4;}
 html[data-learning-module=joye-preschool] .mantine-ActionIcon-root{min-width:56px;min-height:56px;}
}
@media(max-width:760px){
 .touch-mini .nav-inner{height:auto;min-height:56px;flex-wrap:wrap;padding-block:8px;}
 .touch-mini .nav-links{flex:1 1 100%;flex-wrap:wrap;overflow:visible;min-width:0;}
 .touch-mini #progressCharts{grid-template-columns:minmax(0,1fr)!important;}
 .touch-mini .cat-progress-item{flex-wrap:wrap;gap:8px;}
 .touch-mini .cat-name{flex:1;}
}
.touch-admin .dialog-heading{position:sticky;top:-20px;z-index:2;background:#fff;padding-block:12px;}
