/* EFLIS mobile integration 2026-10: progressive layout layer. */
@media(max-width:850px){
  html{scroll-padding-top:76px;-webkit-text-size-adjust:100%}
  body{overflow-x:clip}
  #applicationScreen,#applicationContent{width:100%;max-width:100%;min-width:0}
  #applicationScreen .app-header{width:100%;max-width:100%;position:relative;z-index:100}
  #applicationScreen .app-header-inner{display:flex;align-items:center;gap:8px;min-width:0;width:100%;padding:8px 10px}
  #applicationScreen .eflis-brand-87a{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:7px}
  #applicationScreen .eflis-brand-copy-87a{min-width:0;overflow:hidden}
  #applicationScreen .app-school-name{font-size:clamp(10px,3vw,14px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #applicationScreen #eflTopActions{display:flex;flex:0 0 auto;gap:5px;align-items:center}
  #applicationScreen #systemHubButton,#applicationScreen #logoutButton{min-width:42px!important;width:42px!important;height:42px!important;padding:9px!important;display:inline-flex;align-items:center;justify-content:center}
  #applicationScreen #systemHubButton.hidden{display:none!important}
  #applicationScreen #eflTopActions button span{display:none!important}
  #applicationScreen #eflTopActions svg{width:21px;height:21px;flex:none}
  #applicationContent{padding-inline:0}
  .efl-hub-panel,.efl-hub-actions,.efl-hub-card{min-width:0}
  .efl-hub-card{min-height:64px;touch-action:manipulation}
  .efl-hub-card:focus-visible,.eflis-combined-bubble:focus-visible,.efl-meal-hit:focus-visible{outline:3px solid #268bcd;outline-offset:3px}
  .eflis-combined-assistant{contain:layout style;max-width:100%;isolation:isolate}
  .eflis-combined-assistant .eflis-combined-art{max-width:100%;height:100%;object-fit:contain}
  .eflis-combined-assistant .eflis-combined-bubble{min-height:0!important;touch-action:manipulation;overflow:hidden}
  .eflis-combined-assistant .eflis-combined-bubble span{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;overflow:hidden;overflow-wrap:anywhere}
  .eflis-combined-assistant .efl-meal-hit{touch-action:manipulation}
  .eflis-combined-assistant .efl-meal-fly{max-width:40vw;overflow-wrap:anywhere}
  .efli-identity-fields{grid-template-columns:minmax(0,1fr)!important}
  .efli-identity-preview{flex-wrap:wrap}
  .efli-identity-preview img{width:75px}
  .efli-identity-editor input,.efli-identity-editor textarea{font-size:16px!important;min-width:0}
  .eflis-editor-toolbar,.ef-rte-toolbar,.eflis-rte__toolbar,.ef-editor-toolbar{overflow-x:auto!important;overscroll-behavior-x:contain;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch}
  .eflis-editor-toolbar button,.ef-rte-toolbar button,.eflis-rte__toolbar button,.ef-editor-toolbar button{flex:0 0 auto}
  .table-wrap,.table-responsive,.ef-table-wrap{overscroll-behavior-x:contain}
  img{object-fit:contain}
}
@media(max-width:430px){
  #applicationScreen .app-header-inner{padding:7px 6px;gap:4px}
  #applicationScreen .eflis-logo-87a{width:43px;max-width:43px;height:auto}
  #applicationScreen #eflTopActions{gap:3px}
  #applicationScreen #systemHubButton,#applicationScreen #logoutButton{width:40px!important;min-width:40px!important;height:40px!important}
  body.efl-system-hub .efl-hub{padding:10px 8px 22px!important}
  body.efl-system-hub .efl-hub-panel{padding:17px 10px!important}
  body.efl-system-hub .eflis-combined-assistant{width:min(290px,90vw)!important;margin:12px auto 0!important}
}
@media(prefers-reduced-motion:reduce){
  .eflis-combined-assistant,.efl-hub-card{animation:none!important;transition:none!important}
}


/* EFLIS iPhone/Android compact main header - 2026-10-08 */
@media (max-width:700px) {
  #applicationScreen #eflis-main-header-87a {
    min-height:58px!important;
    height:auto!important;
  }
  #applicationScreen #eflis-main-header-87a .app-header-inner {
    min-height:58px!important;
    padding:5px 9px!important;
    gap:6px!important;
  }
  #applicationScreen #eflis-main-header-87a #eflisShellMenuBtn {
    width:36px!important;height:36px!important;
    min-width:36px!important;min-height:36px!important;
    flex:0 0 36px!important;
    margin-right:3px!important;
    padding:0!important;
    border-radius:10px!important;
    font-size:19px!important;
  }
  #applicationScreen #eflis-main-header-87a .eflis-logo-87a {
    width:42px!important;height:42px!important;
    min-width:42px!important;max-width:42px!important;
    flex:0 0 42px!important;
  }
  #applicationScreen #eflis-main-header-87a .eflis-brand-87a {
    gap:6px!important;min-width:0!important;
    flex:1 1 auto!important;
  }
  #applicationScreen #eflis-main-header-87a .eflis-brand-copy-87a {
    min-width:0!important;overflow:hidden!important;
  }
  #applicationScreen #eflis-main-header-87a .app-school-name {
    font-size:clamp(10px,2.8vw,13px)!important;
    line-height:1.1!important;
    letter-spacing:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #applicationScreen #eflis-main-header-87a .app-title {
    font-size:9px!important;line-height:1.05!important;
    letter-spacing:.3px!important;
  }
  #applicationScreen #eflis-main-header-87a #eflTopActions {
    gap:3px!important;margin-left:3px!important;
  }
  #applicationScreen #eflis-main-header-87a #eflTopActions button,
  #applicationScreen #eflis-main-header-87a #systemHubButton,
  #applicationScreen #eflis-main-header-87a #logoutButton {
    width:36px!important;min-width:36px!important;
    height:36px!important;min-height:36px!important;
    padding:0!important;border-radius:10px!important;
    display:inline-flex!important;align-items:center!important;
    justify-content:center!important;
    flex:0 0 36px!important;
  }
  #applicationScreen #eflis-main-header-87a #systemHubButton.hidden {display:none!important}
  #applicationScreen #eflis-main-header-87a #eflTopActions button span {display:none!important}
  #applicationScreen #eflis-main-header-87a #eflTopActions svg {
    width:18px!important;height:18px!important;
  }
}
@media (max-width:380px) {
  #applicationScreen #eflis-main-header-87a .app-header-inner{padding:5px 6px!important;gap:3px!important}
  #applicationScreen #eflis-main-header-87a .eflis-logo-87a{width:37px!important;height:37px!important;min-width:37px!important;flex-basis:37px!important}
  #applicationScreen #eflis-main-header-87a .app-school-name{font-size:10px!important}
}