/* iPhone layout: same editor and persistence, touch-sized controls, no duplicate forms. */
.mobile-only{display:none}
.dialog-header{position:sticky;top:0;background:var(--panel);z-index:2;padding-bottom:12px}
.dialog-header h2{min-width:0;overflow-wrap:anywhere}
.dialog-header button{flex-shrink:0;min-width:44px;font-size:24px}
body.dialog-open{overflow:hidden}
#navigation-dialog .rail{border:0;height:auto;position:static;padding:0;background:transparent}
#navigation-dialog .brand{display:none}
#navigation-dialog #question-list{max-height:none;min-height:120px;overflow:visible}
#tools-dialog p{margin:8px 0 24px}
#tools-dialog .actions{display:grid;gap:12px}
#tools-dialog .actions button{width:100%;min-height:48px}
@media(max-width:700px), (max-height:500px) and (pointer:coarse){
  :root{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:16px}
  html{scroll-padding-top:96px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{overflow-wrap:anywhere}
  button,.button,input,select,textarea{font-size:16px;min-height:48px}
  button,.button{touch-action:manipulation}
  .mobile-only{display:inline-flex}
  .desktop-hint,.desktop-label{display:none}
  .workspace{display:block;min-height:100svh}
  .workspace>.rail{display:none}
  .toolbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:8px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));padding-top:max(8px,env(safe-area-inset-top));align-items:center}
  #questions-btn{justify-content:flex-start;width:fit-content;padding:8px 12px}
  #mobile-progress{font-size:12px}
  #tools-btn{grid-column:2;grid-row:1;padding:8px 12px}
  .save-summary{grid-column:1/-1;grid-row:2;min-width:0}
  #save-status{font-size:12px;line-height:1.5}
  .toolbar>#workspace-actions{display:none}
  .reading{padding:24px max(16px,env(safe-area-inset-right)) calc(112px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
  .intro{display:none}
  .question-position{align-items:center;gap:8px;margin-bottom:16px}
  #position{line-height:1.5;min-width:0}
  #history-btn{font-size:14px;white-space:nowrap;padding:8px}
  #editor{scroll-margin-top:112px}
  #question-card{padding:0;border:0;background:transparent;border-radius:0}
  #question-card>.row{flex-wrap:wrap}
  #question-title{font-size:24px;line-height:1.3;margin:16px 0 24px;overflow-wrap:anywhere}
  #question-body{font-size:16px;line-height:1.75}
  summary{min-height:32px;line-height:1.6}
  .answer-label{margin-top:24px}
  #answer{font-size:16px;line-height:1.6;min-height:224px;scroll-margin-top:128px;resize:vertical}
  .attachment-toolbar{align-items:center;gap:8px;margin-top:12px}
  .attachment-toolbar>.button{width:100%;min-height:48px}
  .attachment-toolbar>.mobile-only{font-size:12px}
  #answer-done{display:none;font-size:16px;margin-left:auto}
  body.keyboard-open #answer-done{display:inline-flex}
  .previews{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .image-preview a{display:block;min-height:128px}
  .image-preview button{min-height:44px;min-width:44px}
  .editor-footer{position:fixed;bottom:0;left:0;right:0;z-index:25;margin:0;border-top:1px solid var(--line);background:var(--bg);padding:12px max(16px,env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:8px;display:grid;grid-template-columns:auto minmax(0,1fr)}
  .editor-footer>span{display:none}
  .editor-footer button{font-size:14px;min-height:48px;padding:8px 12px;line-height:1.4}
  body.keyboard-open .editor-footer{position:static;padding:16px 0 0;border:0}
  .storage-note{font-size:12px;text-align:left;margin-top:24px}
  #toast-container{bottom:calc(96px + env(safe-area-inset-bottom));left:max(16px,env(safe-area-inset-left));right:max(16px,env(safe-area-inset-right));max-width:none;pointer-events:none}
  body.keyboard-open #toast-container{bottom:auto;top:112px}
  .toast{padding:12px;font-size:14px}
  dialog{padding:16px;width:calc(100% - 24px);max-width:680px;max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overscroll-behavior:contain;overflow-y:auto;scroll-padding-top:72px}
  dialog h2{font-size:20px;line-height:1.3}
  #navigation-dialog{height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));margin:auto;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
  #navigation-dialog .rail{gap:12px}
  #navigation-dialog .progress-block{margin:0 0 4px}
  #navigation-dialog input,#navigation-dialog select{min-height:48px;font-size:16px}
  #navigation-dialog .tabs button{font-size:14px;min-height:48px}
  #navigation-dialog .question-link{font-size:16px;padding:12px;min-height:64px}
  #navigation-dialog .question-link>span{min-width:0}
  #navigation-dialog .question-link small{font-size:12px}
  #navigation-dialog .rail-footer{grid-template-columns:1fr 1fr;padding-top:16px}
  #navigation-dialog .rail-footer button{font-size:14px;min-height:48px}
  #navigation-dialog #clear-btn{grid-column:1/-1}
  #modal-body{margin-top:8px}
  .history-entry button{width:100%}
  .banner .actions{display:grid;grid-template-columns:1fr}
  .banner .actions button{width:100%;white-space:normal}
  .empty-card{padding:32px 16px}
  .empty-card h2{font-size:24px}
  .empty-card .primary{width:100%}
  .auth-body{min-height:100svh;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));align-items:start}
  .auth-panel{padding:24px 16px;margin:24px auto;border:0;background:transparent}
  .auth-panel h1{font-size:28px}
  .auth-panel input{font-size:16px;min-height:52px}
  .auth-panel button{min-height:52px}
}