/* ITDA mobile reading layer.
   Screen-only and loaded last: desktop, printing, permissions and APIs stay intact.
   Use rem so browser text preferences can enlarge the interface. */
@media screen and (max-width:760px){
  html{font-size:100%!important;scroll-padding-top:120px}
  body{font-size:1rem!important;line-height:1.65!important;letter-spacing:normal;
    --mobile-readable-text:1rem;--mobile-readable-sub:.875rem;
    --text:#172033;--muted:#475569;--success:#15803d;--warning:#92400e;
    --itda-touch:48px;--itda-mobile-gutter:16px;--control:48px}
  body .page-shell{padding-left:16px!important;padding-right:16px!important}
  body :is(.page-head,.itda-page-head){gap:12px!important;margin-bottom:20px!important}
  body :is(.page-head,.itda-page-head) h1{font-size:1.625rem!important;line-height:1.35!important;overflow-wrap:anywhere}
  body :is(.section-head,.panel-head,.card) :is(h2,h3,h4){font-size:1.125rem!important;line-height:1.45!important}
  body :is(.page-desc,.help,.detail-meta,.field>span,.field>label,.control-label,
    .panel-head .help,.form-note,.reader-head p,.reader-box-title,.radio-card small,
    .workspace-hint,.empty,.itda-pagination-info,.workspace-page-info){
    font-size:.875rem!important;line-height:1.6!important;color:#475569!important}
  body :is(.eyebrow,.itda-eyebrow){font-size:.75rem!important;line-height:1.5!important;letter-spacing:.05em!important}
  body :is(.title-link,.detail-value,.card,.comment-content,.comment-body p){font-size:1rem!important;line-height:1.65!important}
  body :is(.panel,.panel-body,.card,.field,.form-grid,.toolbar,.modal-body){min-width:0}
  body .panel-head{padding:16px!important;gap:12px!important}
  body .panel-body{padding:16px!important}
  body :is(.panel,.card){border-color:#d5deea}
  body :is(.cards-grid,.events-grid,.settings-grid,.prep-list-grid){gap:16px!important}
  body :is(.badge,.read-state,.read-count,.viewer-pill,.reader-state-text,.detail-kind){
    height:auto!important;min-height:26px;font-size:.875rem!important;line-height:1.5!important;
    white-space:normal!important;overflow-wrap:anywhere}
  body .badge-success{color:#166534!important}
  body .badge-warning{color:#92400e!important}
  body .badge-gray{color:#475569!important}

  /* Comfortable controls; labels wrap instead of shrinking into icon-sized pills. */
  body :is(.btn,.btn-sm,.itda-action-button,.itda-action-button.btn-sm,
    .chip,.settings-tab-btn,.tab-btn,.workspace-tab,.mobile-filter-toggle){
    min-height:48px!important;height:auto!important;max-width:100%;padding:10px 14px!important;
    font-size:.875rem!important;line-height:1.5!important;white-space:normal!important;
    overflow-wrap:anywhere;letter-spacing:normal!important;border-radius:11px!important}
  body :is(.icon-btn,.workspace-modal-close,.global-register-close,.global-login-modal-close,
    .attention-bell,.workspace-quick-btn,.mobile-menu,.post-login-detail-close){
    width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;flex-shrink:0}
  body :is(.input,.control,.textarea,.search-wrap input,.workspace-search-input),
  body input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),
  body select,body textarea{
    font-size:1rem!important;line-height:1.5!important;min-height:48px!important;height:auto;
    color:#172033;max-width:100%;min-width:0}
  body :is(.input,.control,.textarea,.search-wrap input,.workspace-search-input){padding:11px 12px!important}
  body textarea{min-height:144px!important}
  body :is(input,textarea)::placeholder{color:#64748b;opacity:1}
  body :is(input[type=checkbox],input[type=radio]){width:20px;min-width:20px;height:20px;accent-color:#2563eb}
  body :is(a,button,input,select,textarea,summary):focus-visible{outline:3px solid #2563eb;outline-offset:3px}
  body .form-grid{gap:18px!important}
  body .field{gap:7px!important}
  body .toolbar{padding:12px!important;gap:10px!important}
  body :is(.toolbar-left,.toolbar-right,.filter-row,.filters,.search-row){gap:10px!important}
  body .toolbar .search-wrap input{height:auto!important;min-height:48px!important}
  body :is(.toolbar-left,.toolbar-right)>:is(select.control,input.control){
    flex-basis:100%!important;width:100%!important}
  body .page-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  body .page-actions .btn:only-child{grid-column:1/-1}

  /* Navigation stays legible and has room for multi-line Korean labels. */
  body .topbar{height:64px!important;padding:0 12px!important;gap:8px!important}
  body .header-actions{gap:6px!important}
  body .server-mobile-nav{top:64px!important;bottom:calc(8px + env(safe-area-inset-bottom,0px))!important}
  body .server-mobile-nav-backdrop{inset:64px 0 0!important}
  body .subbar{top:64px!important}
  body .subbar-inner{height:auto!important;min-height:56px!important;padding:4px 12px!important}
  body .sub-nav .sub-item{min-height:48px!important;height:auto!important;font-size:.875rem!important;line-height:1.5!important;color:#334155}
  body :is(.mobile-nav-main-link,.mobile-nav-section-title){font-size:1rem!important;min-height:52px!important;line-height:1.5!important}
  body .mobile-nav-subgrid{gap:8px}
  body .mobile-nav-subgrid a{font-size:.875rem!important;min-height:52px!important;padding:10px!important;line-height:1.5!important}
  body .server-mobile-nav-foot{flex-wrap:wrap;gap:10px}
  body .mobile-nav-user b{font-size:.875rem!important}
  body .mobile-nav-user small{font-size:.75rem!important;color:#475569!important}
  body :is(.mobile-nav-logout,.mobile-nav-password){font-size:.875rem!important;min-height:48px!important}
  body .mobile-bottom-nav{min-height:72px!important;gap:2px!important;padding:5px!important}
  body .mobile-bottom-nav :is(a,button){min-height:58px!important;gap:5px}
  body .mobile-bottom-nav b{font-size:.875rem!important;line-height:1.3!important;white-space:normal;overflow:visible}
  body .mobile-bottom-nav .mobile-bottom-icon{font-size:20px!important}
  body:not(.modal-open):not(.global-register-open):not(.login-modal-open) .page-shell{
    padding-bottom:calc(108px + env(safe-area-inset-bottom,0px))!important}

  /* Home cards: quiet white backgrounds, distinct titles and readable dates. */
  body .hero-main{padding:22px 18px!important}
  body .hero-main h2{font-size:1.5rem!important;line-height:1.45!important}
  body .hero-main p{font-size:1rem!important;line-height:1.7!important}
  body .quick-card{min-height:124px!important;padding:16px!important;gap:8px!important}
  body .quick-card strong{font-size:1rem!important;line-height:1.5!important}
  body .quick-card span:last-child{font-size:.875rem!important;line-height:1.5!important}
  body :is(.home-notice-focus .notice-main strong,.event-title-row strong,.cover-title){
    font-size:1.125rem!important;line-height:1.5!important;white-space:normal!important;
    overflow-wrap:anywhere;-webkit-line-clamp:unset!important;max-height:none!important}
  body .home-notice-focus .notice-main small{font-size:.875rem!important;line-height:1.6!important;color:#475569!important}
  body .event-title-row{align-items:flex-start;flex-wrap:wrap;gap:8px}
  body .event-body{padding:16px!important}
  body .event-cover{height:auto!important;min-height:140px!important;padding:18px!important}
  body .event-meta{font-size:.875rem!important;line-height:1.65!important;color:#475569!important;gap:8px;flex-wrap:wrap}
  body .event-meta span{font-size:inherit!important;white-space:normal;overflow-wrap:anywhere}
  body :is(.event-card,.event-card[data-open],.event-card[data-type],.note-card,.bible-note-card,
    .sharing-card,.sharing-page-card,.lifeline-card,.poll-list-card,.prep-task-card,.attachment-card){
    background:#fff!important;border-color:#cbd5e1!important;box-shadow:0 2px 7px rgb(15 23 42 / 4%)!important}

  /* Records read top to bottom. One complete field per line, without truncating titles. */
  body table.mobile-card-table{font-size:1rem!important}
  body table.mobile-card-table tbody{gap:16px!important}
  body table.mobile-card-table tr:not(.mobile-card-empty){
    display:grid!important;grid-template-columns:minmax(0,1fr)!important;padding:6px 0!important;
    background:#fff!important;border-color:#cbd5e1!important;border-radius:14px!important;box-shadow:none!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td{
    display:block!important;grid-column:1/-1!important;padding:10px 16px!important;
    font-size:1rem!important;line-height:1.65!important;white-space:normal!important;
    overflow-wrap:anywhere;text-overflow:clip;max-height:none;border-bottom:1px solid #edf1f5!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td::before{
    display:block!important;margin:0 0 4px!important;font-size:.875rem!important;line-height:1.5!important;color:#475569!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td.mobile-card-primary{
    padding:12px 16px!important;border-bottom:1px solid #d5deea!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td.mobile-card-primary::before{display:none!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td.mobile-card-primary :is(.title-link,strong){
    font-size:1.0625rem!important;line-height:1.6!important;white-space:normal!important;
    overflow-wrap:anywhere;max-width:100%;max-height:none;-webkit-line-clamp:unset!important}
  body table.mobile-card-table td :is(small,.help,.muted){font-size:.875rem!important;color:#475569!important;line-height:1.55!important}
  body table.mobile-card-table tr.unread-doc{border-left:4px solid #2563eb!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td.mobile-card-actions-cell{padding:10px 16px!important}
  body table.mobile-card-table tr:not(.mobile-card-empty)>td.mobile-card-actions-cell::before{display:none!important}
  body .mobile-card-more{
    position:static!important;display:inline-flex!important;width:auto!important;height:auto!important;
    min-width:88px!important;min-height:48px!important;padding:10px 14px!important;
    font-size:.875rem!important;line-height:1.5!important;color:#334155;box-shadow:none}
  body .mobile-card-action-menu{
    position:static!important;width:100%!important;margin-top:10px!important;padding:10px!important;
    box-shadow:none!important;gap:10px!important}
  body :is(.itda-page-edge,.collab-page-edge,.workspace-page-edge,.mobile-page-inline-status,
    .workspace-page-mobile-status,.pagination strong){min-height:48px!important;font-size:.875rem!important;line-height:1.5!important}
  body :is(.itda-pagination,.collab-pagination,.workspace-page-actions){grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important}

  /* Sheets use available height; only content scrolls, close/actions remain reachable. */
  body :is(.modal-backdrop,.workspace-modal-backdrop,.global-register-backdrop){
    padding:8px!important;padding-top:max(8px,env(safe-area-inset-top,0px))!important;
    padding-bottom:max(8px,env(safe-area-inset-bottom,0px))!important}
  body :is(.modal:not(.lifeline-detail-modal),.workspace-modal,.global-register-modal,.post-login-detail-modal){
    width:100%!important;max-width:100%!important;min-width:0!important;
    max-height:calc(100vh - 16px)!important;
    max-height:calc(100dvh - max(8px,env(safe-area-inset-top,0px)) - max(8px,env(safe-area-inset-bottom,0px)))!important;
    border-radius:16px!important;overflow:hidden}
  body :is(.modal-head,.workspace-modal-head,.global-register-head,.global-login-modal-head){
    flex-shrink:0;gap:12px!important;padding:14px 16px!important;align-items:flex-start}
  body :is(.modal-head,.workspace-modal-head,.global-register-head,.global-login-modal-head) h2{
    font-size:1.25rem!important;line-height:1.5!important;overflow-wrap:anywhere}
  body :is(.modal-head,.workspace-modal-head)>:first-child{min-width:0}
  body :is(.modal-body,.workspace-modal-body,.post-login-detail-body){
    min-height:0!important;overflow-y:auto!important;padding:16px!important;font-size:1rem!important;line-height:1.7!important}
  body :is(.modal-foot,.modal-form-actions){gap:10px!important;flex-shrink:0}
  body .modal-foot{display:flex!important;flex-wrap:wrap;padding:12px 16px!important;max-height:34dvh;overflow-y:auto}
  body .modal-foot .btn{flex:1 1 120px!important;width:auto!important;min-width:0!important}
  body .post-login-detail-head-right{width:auto!important;order:initial;flex:0 0 auto}
  body .post-login-detail-heading{flex:1 1 0!important}
  body .post-login-detail-actions{width:100%;flex:1 1 100%}
  body .post-login-detail-actions .draft-modal-actionbar{flex-wrap:wrap!important}
  body .post-login-detail-actions .draft-modal-action{min-height:48px!important;height:auto!important;font-size:.875rem!important}
  body :is(.document,.document-detail,.draft-modal-document,.ck-content,.lifeline-detail-copy,
    .message-detail-content,.message-bubble-text,.workspace-lifeline-description){
    font-size:1rem!important;line-height:1.85!important;overflow-wrap:anywhere}
  body :is(.document,.document-detail,.draft-modal-document,.ck-content) :where(p,li,td,th,span){
    font-size:max(1rem,1em)!important;line-height:1.8!important}
  body :is(.document,.document-detail,.draft-modal-document){padding:16px!important;max-width:100%;min-width:0}
  body :is(.document,.document-detail,.draft-modal-document,.ck-content) table{
    display:block;max-width:100%!important;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body :is(.data-wrap,.table-wrap,.table-responsive,.table-scroll,.finance-table-wrap,.draft-detail-table-wrap){
    max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  body :is(.data-table,.finance-table,.draft-detail-table) :is(th,td){font-size:.875rem!important;line-height:1.6!important}
  body .draft-modal-approver{grid-template-columns:auto minmax(0,1fr);gap:8px 12px;padding:12px}
  body .draft-modal-approver>b{font-size:1rem;overflow-wrap:anywhere}
  body .draft-modal-opinion{font-size:.875rem!important;line-height:1.7!important;white-space:pre-wrap}
  body :is(.comment-meta,.comment-meta b,.comment-meta time,.draft-history-meta,.draft-history-content,
    .reader-info,.reader-info b,.reader-info small){font-size:.875rem!important;line-height:1.6!important}

  /* Attention, search, statistics and messages are content rows, never compact buttons. */
  body .login-summary-item{height:auto!important;min-height:72px!important;padding:14px!important;
    display:flex!important;flex-direction:column;align-items:flex-start!important;gap:6px!important;white-space:normal!important}
  body .login-summary-item span{font-size:1rem!important;line-height:1.6!important;white-space:normal!important;overflow-wrap:anywhere}
  body .login-summary-item small{font-size:.875rem!important;line-height:1.6!important;color:#475569!important;white-space:normal!important}
  body .login-summary-section h3{font-size:1.125rem!important;line-height:1.5!important}
  body .workspace-result{padding:16px!important;background:#fff!important;border-color:#cbd5e1!important;margin-bottom:12px!important}
  body :is(.workspace-result-title,.workspace-library-title,.workspace-result-title strong){font-size:1rem!important;line-height:1.6!important;white-space:normal!important;overflow-wrap:anywhere}
  body :is(.workspace-result-meta,.workspace-result-snippet,.workspace-library-meta){font-size:.875rem!important;line-height:1.65!important;color:#475569!important}
  body .workspace-search-wrap{padding:12px 16px!important}
  body .workspace-tabs{padding:8px 16px!important;gap:8px!important}
  body .stats-grid{gap:12px!important}
  body .stat-card{padding:16px!important}
  body .stat-card :is(.label,small){font-size:.875rem!important;line-height:1.5!important;color:#475569}
  body .stats-grid .stat-card strong{font-size:1.75rem!important;line-height:1.4!important}
  body .event-participation-list{gap:12px}
  body .event-participation-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;
    padding:16px!important;gap:12px!important;line-height:1.6!important}
  body .event-participation-name{grid-column:1/-1}
  body .event-participation-name strong{font-size:1rem!important;white-space:normal!important;overflow-wrap:anywhere}
  body .event-participation-metric{text-align:left!important}
  body .event-participation-metric b{font-size:1.25rem!important}
  body :is(.event-participation-name small,.event-participation-metric small,.event-participation-latest){
    font-size:.875rem!important;line-height:1.6!important;color:#475569!important;white-space:normal!important;overflow-wrap:anywhere}
  body .event-participation-row:disabled{opacity:1!important;background:#f8fafc}
  body :is(.stats-rank-name strong,.stats-rate-name strong){font-size:1rem!important}
  body :is(.stats-rank-name small,.stats-rank-value small,.stats-rate-name small,.stats-rate-legend){font-size:.875rem!important;line-height:1.5!important}
  body .message-list-item{padding:14px!important;gap:12px}
  body :is(.message-list-line b,.message-list-preview,.message-user-option b){font-size:1rem!important;line-height:1.6!important}
  body .message-list-preview{white-space:normal!important;overflow-wrap:anywhere}
  body :is(.message-list-line small,.message-list-meta,.message-detail-meta small,.message-user-option small){
    font-size:.875rem!important;line-height:1.55!important;color:#475569!important}
  body .message-list-line{flex-wrap:wrap}
  body :is(.message-inbox-tabs button,.message-inbox-count,.message-field-label){font-size:.875rem!important;line-height:1.5!important}
  body :is(.message-user-results,.reader-columns){grid-template-columns:1fr!important}
  body .message-bubble{max-width:92%;padding:12px 14px!important}
  body :is(.message-bubble-author,.message-bubble-time,.message-bubble-files b,.message-bubble-files small){
    font-size:.75rem!important;line-height:1.6!important;color:#475569!important}
  body :is(.attachment .file-name,.attachment span,.file-info b,.message-detail-files b){
    font-size:1rem!important;line-height:1.6!important;white-space:normal!important;overflow-wrap:anywhere}
  body :is(.attachment b,.file-info small,.message-detail-files small){font-size:.875rem!important;line-height:1.6!important}

  /* Bible text and daily work. Calendar controls keep their seven-column meaning. */
  body :is(.workspace-bible-verse-text,.bible-text,.bible-text-modal-box,.verse-text,.today-word-card p){font-size:1.125rem!important;line-height:1.9!important}
  body .workspace-bible-verse-row{grid-template-columns:28px minmax(0,1fr) 12px;padding:12px 8px;gap:8px}
  body .workspace-bible-verse-number{font-size:.875rem;line-height:2.2}
  body .workspace-bible-tools{padding:16px}
  body :is(.bible-day b,.bible-month .weekday,.fc .fc-col-header-cell-cushion,.fc .fc-daygrid-day-number){font-size:.875rem!important}
  body .fc .fc-button{font-size:.875rem!important;min-height:44px!important}
  body .fc .fc-event{font-size:.75rem!important;line-height:1.5}
  body :is(.prep-task-title,.prep-event-item b,.prep-task h3,.prep-task-head b,.subtask-main b){font-size:1rem!important;line-height:1.6!important;white-space:normal;overflow-wrap:anywhere}
  body :is(.prep-task-meta,.prep-progress-meta,.prep-task small,.prep-event-item small,.subtask-main small){font-size:.875rem!important;line-height:1.6!important;color:#475569!important}
  body .prep-task-head{flex-wrap:wrap;gap:12px}
  body :is(.prep-task,.subtask-row){padding:16px!important}
  body .subtask-progress-row{grid-template-columns:1fr!important;gap:12px!important}
  body :is(.task-progress-edit label,.task-progress-edit b,.subtask-progress-control b,
    .prep-summary-main span,.prep-summary-mini span,.prep-summary-main small,.prep-summary-mini small){
    font-size:.875rem!important;line-height:1.5!important}
  body .task-progress-edit{grid-template-columns:minmax(0,1fr) auto!important;gap:12px!important}
  body .task-progress-edit label{grid-column:1/-1}
  body .task-progress-edit input[type=range]{width:100%;min-height:44px}
  body .subtask-progress-control{display:flex;flex-wrap:wrap;gap:10px}
  body .subtask-progress-control input[type=range]{flex:1;min-width:100px;min-height:44px}
  body :is(.permission-module-title,.permission-item,.permission-label,.radio-card b,.check-chip span){font-size:.875rem!important;line-height:1.6!important}
}

@media screen and (max-width:380px){
  body .page-shell{padding-left:12px!important;padding-right:12px!important}
  body :is(.stats-grid,.hero-side,.hero-buttons,.home-extra-actions,.mobile-nav-subgrid){grid-template-columns:minmax(0,1fr)!important}
  body .page-actions{grid-template-columns:minmax(0,1fr)!important}
  body .quick-card{min-height:100px!important}
  body .event-participation-row{padding:12px!important}
}

@media screen and (max-width:900px) and (max-height:520px){
  body .server-mobile-nav{top:4px!important;bottom:4px!important}
  body .server-mobile-nav-backdrop{inset:0!important}
}
