/* Phone adaptations only. Desktop materials, layout and editor stay in styles.css. */
#mobile-jumps,.mobile-code-tools,.mobile-simulation{display:none}
.offline-status{margin-top:18px;padding-top:12px;border-top:1px solid var(--line)}
@media(max-width:600px),(max-height:500px) and (pointer:coarse){
 html{scroll-padding-block:12px 76px}
 body{padding-bottom:calc(72px + env(safe-area-inset-bottom));overflow-wrap:anywhere}
 main{padding:0 max(14px,env(safe-area-inset-left)) 0 max(14px,env(safe-area-inset-right))}
 .topbar{padding:14px;gap:8px;align-items:center}
 .brand{gap:8px;letter-spacing:1px}.brand-icon{width:34px;height:38px;font-size:29px}.brand strong{font-size:24px}
 .top-actions{gap:0}.world-label{display:none}#progress-open{max-width:150px;min-height:48px;padding:4px 8px}#spark-count{margin-left:3px}
 .world-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;margin-top:8px;padding-bottom:10px}
 .world-nav button{font-size:12px;text-align:left;min-height:44px;padding:8px}.world-nav .small{grid-column:1/-1;min-width:0}
 #path{grid-template-columns:minmax(0,1fr);gap:2px;padding:6px 0 12px}.area{display:grid;grid-template-columns:90px minmax(0,1fr);align-items:center;gap:8px}.area-title{font-size:11px;margin-bottom:0;gap:4px}.spark-track button{min-width:44px;min-height:44px}.spark-track button:before{top:20px}
 .workspace{grid-template-columns:minmax(0,1fr);max-width:580px;gap:18px;padding-top:0}.instructions{min-width:0}
 h1{font-size:32px;margin-bottom:12px}.goal{font-size:17px}.cue{min-height:0;margin-bottom:14px;font-size:14px}
 .eyebrow{letter-spacing:.8px;gap:8px}.eyebrow span+span{white-space:nowrap}
 .mobile-simulation{display:block;font-size:12px;color:var(--muted);margin:4px 0 12px}
 .editor-toolbar{padding:5px 8px;gap:3px;letter-spacing:.4px}.editor-toolbar>div{display:flex}.editor-toolbar button{min-height:44px;padding:4px 6px}
 .editor-layout{grid-template-columns:30px minmax(0,1fr)}
 #editor,#editor-lines,#line-numbers{font-size:16px;line-height:1.8}#editor,#editor-lines{padding:14px 9px}#line-numbers{padding-top:14px;padding-bottom:14px}
 #editor{scroll-margin-block:12px;touch-action:auto}#editor.expanded{height:310px}
 .editor-footer{padding:6px 9px;font-size:11px;gap:5px}
 .mobile-code-tools{display:block;padding:4px;background:#efebf2;border-top:1px solid #e0d8e6}
 .mobile-symbols,.mobile-edit-actions{display:grid;gap:2px}.mobile-symbols{grid-template-columns:repeat(6,minmax(0,1fr))}.mobile-edit-actions{grid-template-columns:repeat(7,minmax(0,1fr));margin-top:3px}
 .mobile-code-tools button{min-width:0;min-height:44px;padding:4px 0;background:#fffefa;color:var(--plum);border:1px solid #d7d0df;border-radius:5px;font:17px var(--mono);touch-action:manipulation}
 .mobile-code-tools button[data-edit="run"]{background:var(--plum);color:white;font:600 12px 'Segoe UI',sans-serif}
 .mobile-code-tools button:active{background:#ded1e6}.mobile-code-tools button:disabled{opacity:.45}
 .actions{gap:8px;margin-top:12px}.actions .shortcut{display:none}.actions button{min-height:48px}.actions #next{flex-grow:1}
 .scene-heading{padding:14px;gap:8px;flex-wrap:wrap}.scene-heading h2{font-size:10px}.scene-heading span{font-size:11px}
 .workshop{padding:16px 12px 0}.device{padding:10px}.device-bottom{font-size:7px;gap:4px}.screen{padding:12px;min-height:172px}
 .execution{padding:15px}.execution-top{flex-wrap:wrap;gap:6px}.simulation-note{padding:0 15px}
 .components{gap:5px}.component{min-width:0;padding:8px 3px}.component span{font-size:9px}
 .switchboard,.sorting-bay,.dispatch-desk{padding:12px}.held-keys,.board-keys{gap:6px}.held-keys button,.board-key{min-height:48px;min-width:48px;padding:10px 12px}
 .board-label{flex-wrap:wrap;gap:8px}.board-label span{min-width:0}.sort-roads{gap:6px}.sort-road{min-width:0;padding:10px 7px}.terminal-card{padding:8px}.terminal-card textarea{font-size:16px}
 #sort-guide-steps,#dispatch-guide-steps{grid-template-columns:repeat(2,minmax(0,1fr));font-size:11px}
 button,summary,.file-button{touch-action:manipulation}summary,.quiet,.token,.help-tabs button{min-height:44px}.token{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}
 input:not([type="checkbox"]):not([type="file"]),textarea:not(#editor){font-size:16px;max-width:100%}
 dialog{width:calc(100% - 20px);max-width:600px;max-height:calc(100dvh - 24px);padding:22px 16px;overflow-wrap:anywhere}
 dialog .close{min-width:44px;min-height:44px;position:sticky;top:0;float:right;margin:-10px -6px 0 0;background:var(--paper);z-index:3;border-radius:7px}
 dialog h2{font-size:26px}.help-tabs{display:flex;flex-wrap:wrap;gap:4px}.help-tabs button{flex:1 1 80px;padding:8px 4px}
 pre,#hint-fragment{max-width:100%;white-space:pre-wrap;overflow-wrap:anywhere}.progress-row{flex-wrap:wrap;gap:4px}.progress-row button{min-width:0;text-align:left;min-height:44px}.progress-row span{font-size:12px}
 .world-complete{gap:12px;padding:20px 14px}.world-complete>div{min-width:0}.world-complete .button-row>*{width:100%}
 footer{gap:10px;flex-wrap:wrap}
 #mobile-jumps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;padding:5px max(8px,env(safe-area-inset-left)) calc(5px + env(safe-area-inset-bottom));gap:6px;background:#f5f2ebf5;border-top:1px solid #c9becf;z-index:15;box-shadow:0 -3px 12px #35303d10}
 #mobile-jumps button{min-height:48px;padding:6px;border-radius:8px;background:#e7dfed;color:var(--plum);font-size:14px}
 body.phone-editing #mobile-jumps,body.phone-dialog #mobile-jumps{display:none}
 #mobile-jumps .needs-action{background:var(--plum);color:white}
}
@media(max-height:500px) and (pointer:coarse){body.phone-editing #editor{height:110px;min-height:110px}}
