/* Full instructions stay in the help dialog; phone navigation uses one touch row. */
.context-label-phone{display:none}
html[data-view-mode=phone] .intuitive-context{display:flex!important;flex-flow:row nowrap!important;align-items:stretch!important;gap:6px!important;margin:4px 0 10px!important;padding:0!important;min-height:44px!important}
html[data-view-mode=phone] .intuitive-context>span{display:none!important}
html[data-view-mode=phone] .intuitive-context>.btn{display:inline-flex!important;align-items:center;justify-content:center;flex:1 1 0!important;min-width:0!important;width:auto!important;max-width:none!important;min-height:44px!important;height:44px!important;padding:0 8px!important;margin:0!important;font-size:12px!important;line-height:1.2!important;white-space:nowrap!important}
html[data-view-mode=phone] .context-label-full{display:none!important}
html[data-view-mode=phone] .context-label-phone{display:inline!important}
html[data-view-mode=phone] #utRoot:has(>.intuitive-context)>.mode-help-button,html[data-view-mode=phone] #utRoot:has(>.intuitive-context)>.beginner-context-help{display:none!important}
html[data-view-mode=phone] .mode-help-button{display:inline-flex!important;align-items:center;justify-content:center;width:auto!important;min-height:44px!important;padding:6px 12px!important;margin:2px 0 8px!important;font-size:12px!important}
html[data-view-mode=phone] #utRoot:has(>.intuitive-context)>.mode-help-button{display:none!important}
html[data-view-mode=phone] .beginner-context-help:not([open]){padding:0 12px!important;margin:4px 0 8px!important;min-height:0!important}
html[data-view-mode=phone] .beginner-context-help>summary{display:flex;align-items:center;min-height:44px;padding:0!important;font-size:12px;cursor:pointer}
html[data-view-mode=phone] .intuitive-next-step{display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;padding:10px!important;margin:6px 0 12px!important;min-height:0!important}
html[data-view-mode=phone] .intuitive-next-step>div{flex:1;min-width:0}
html[data-view-mode=phone] .intuitive-next-step h2{font-size:13px!important;line-height:1.35!important;margin:0!important}
html[data-view-mode=phone] .intuitive-next-step p{display:none!important}
html[data-view-mode=phone] .intuitive-next-step>.btn{width:auto!important;min-height:44px!important;max-width:52%;padding:8px 10px!important;margin:0!important;font-size:12px!important}
html[data-view-mode=phone] #modeHowToPlay,html[data-view-mode=phone] #intuitiveHelp{box-sizing:border-box;width:calc(100vw - 20px);max-height:calc(100dvh - 24px);padding:16px;overflow-y:auto;overscroll-behavior:contain}
html[data-view-mode=phone] #modeHowToPlay .intuitive-help-header{align-items:flex-start;gap:8px}
html[data-view-mode=phone] #modeHowToPlay .intuitive-help-header h2{font-size:20px;margin:0}
html[data-view-mode=phone] #modeHowToPlay .intuitive-help-header>.btn{flex:none;min-height:44px;width:auto;padding:8px 12px}
html[data-view-mode=phone] #modeHowToPlay .badge{font-size:10px;margin:0 0 6px}
html[data-view-mode=phone] #modeHowToPlay .compact-context-tip{margin:14px 0;padding:12px}
html[data-view-mode=phone] #modeHowToPlay .compact-context-tip h3{margin:0 0 6px;font-size:15px}
html[data-view-mode=phone] #modeHowToPlay .compact-context-tip p{margin:0}