/* Kompakter Hochformatkopf ohne übergroße, umbrochene Schaltflächen. */
@media screen and (max-width:730px) and (orientation:portrait){
  #walk-dialog .walk-top{padding:6px max(7px,env(safe-area-inset-left));display:block}
  #walk-dialog .walk-top>div:first-child{display:none}
  #walk-dialog .walk-actions{display:grid;grid-template-columns:88px minmax(0,1fr) 88px;gap:5px;width:100%;align-items:stretch}
  #walk-dialog #walk-tools-menu{min-width:0}
  #walk-dialog #walk-tools-menu>summary,#walk-dialog #walk-close,#walk-dialog #walk-standalone{display:grid;place-items:center;width:100%;height:44px;min-height:44px;padding:3px 5px;font-size:12px;line-height:1.1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #walk-dialog #walk-edit-toolbar{height:54px;padding:5px 7px;display:flex;flex-wrap:nowrap;gap:5px}
  #walk-dialog #walk-edit-toolbar label{display:none}
  #walk-dialog #walk-element-select,#walk-dialog #walk-edit-selected{height:44px;min-height:44px}
  #walk-dialog #walk-element-select{font-size:15px}
  #walk-dialog #walk-edit-selected{flex:0 0 92px;padding:4px;font-size:12px}
  #walk-dialog #walk-overview{width:104px;max-height:120px}
}

/* Ein einfacher, eigenständiger Handy-Querformatmodus. */
@media screen and (max-width:900px) and (orientation:landscape) and (max-height:520px){
  #walk-dialog[open]{display:grid;grid-template-rows:44px minmax(0,1fr)!important;grid-template-columns:1fr}
  #walk-dialog .walk-top{grid-row:1;padding:3px max(7px,env(safe-area-inset-left));display:flex;flex-wrap:nowrap;align-items:center;background:var(--app-bg);z-index:12}
  #walk-dialog .walk-top>div:first-child{display:block;flex:1;min-width:0}
  #walk-dialog .walk-top h2{display:block;font-size:17px;white-space:nowrap;margin:0}
  #walk-dialog .walk-top #walk-status{display:none}
  #walk-dialog .walk-actions{display:flex;flex-wrap:nowrap;gap:5px;grid-column:auto}
  #walk-dialog #walk-tools-menu>summary,#walk-dialog #walk-close,#walk-dialog #walk-standalone{height:38px;min-height:38px;padding:3px 8px}
  #walk-dialog .walk-view{grid-row:2;min-height:0;height:auto;overflow:hidden}
  #walk-dialog .walk-bottom{display:none!important}
  #walk-dialog #walk-edit-toolbar{position:absolute;z-index:11;top:50px;left:max(8px,env(safe-area-inset-left));width:min(360px,calc(100vw - 190px));height:42px;padding:2px 4px;border:0;border-radius:8px;background:var(--brand-tint-overlay);display:flex;flex-wrap:nowrap;gap:4px}
  #walk-dialog #walk-edit-toolbar label{display:none}
  #walk-dialog #walk-element-select{height:38px;min-height:38px;font-size:14px}
  #walk-dialog #walk-edit-selected{height:38px;min-height:38px;padding:3px 8px;font-size:13px}
  #walk-dialog .walk-controls{display:flex!important;z-index:10;left:max(8px,env(safe-area-inset-left));right:max(8px,env(safe-area-inset-right));bottom:max(8px,env(safe-area-inset-bottom));align-items:end;justify-content:space-between}
  #walk-dialog .walk-pad{display:grid!important;grid-template-columns:repeat(3,50px);gap:5px}
  #walk-dialog .walk-turn{display:flex!important;gap:6px}
  #walk-dialog .walk-controls button{display:block!important;min-width:50px;min-height:50px;font-size:23px;border:2px solid #fff;box-shadow:0 2px 8px rgb(var(--shadow-rgb) / 0.333)}
  #walk-dialog #walk-overview{top:52px;right:max(8px,env(safe-area-inset-right));width:118px;max-height:118px;z-index:9}
  #walk-dialog #walk-overview summary{font-size:10px;padding:3px}
}

#walk-dialog.evening #walk-dusk{background:linear-gradient(#07122688,#17213e99)}

@media screen and (max-width:730px){
  #walk-dialog #walk-evening{display:grid;place-items:center;min-width:62px;height:46px;min-height:46px;padding:4px 9px;border:1px solid #ffffffaa;border-radius:14px;background:#fffef5f2;color:var(--text);font-size:13px;box-shadow:0 3px 13px #0005;white-space:nowrap}
  #walk-dialog #walk-evening[aria-pressed=true]{background:#18233d;color:#fff;border-color:#7283aa}
}
@media screen and (max-width:900px) and (orientation:landscape) and (max-height:520px){
  #walk-dialog #walk-evening{display:grid;place-items:center;min-width:58px;height:40px;min-height:40px;padding:3px 8px;border:1px solid #ffffffaa;border-radius:12px;background:#fffef5f2;color:var(--text);font-size:12px;box-shadow:0 3px 13px #0005;white-space:nowrap}
  #walk-dialog #walk-evening[aria-pressed=true]{background:#18233d;color:#fff;border-color:#7283aa}
}

/* iPhone/Browser mit sehr niedriger nutzbarer Höhe im Querformat. */
@media screen and (max-width:900px) and (orientation:landscape) and (max-height:360px){
  #walk-dialog[open]{grid-template-rows:38px minmax(0,1fr)!important}
  #walk-dialog .walk-top{height:38px;padding:2px max(5px,env(safe-area-inset-left))}
  #walk-dialog .walk-top>div:first-child{display:none}
  #walk-dialog .walk-actions{width:100%;justify-content:space-between;align-items:center}
  #walk-dialog #walk-tools-menu>summary,#walk-dialog #walk-close,#walk-dialog #walk-standalone{height:34px;min-height:34px;padding:2px 9px;font-size:12px}
  #walk-dialog #walk-standalone{max-width:210px;overflow:hidden;text-overflow:ellipsis}
  #walk-dialog #walk-edit-toolbar{display:none!important}
  #walk-dialog #walk-overview{display:none!important}
  #walk-dialog .walk-view{grid-row:2}
  #walk-dialog .walk-controls{left:max(5px,env(safe-area-inset-left));right:max(5px,env(safe-area-inset-right));bottom:max(4px,env(safe-area-inset-bottom))}
  #walk-dialog .walk-pad{grid-template-columns:repeat(3,44px);gap:3px}
  #walk-dialog .walk-turn{gap:4px}
  #walk-dialog .walk-controls button{min-width:44px;min-height:44px;width:44px;height:44px;padding:1px;font-size:21px}
  #walk-dialog .walk-label{font-size:10px;padding:1px 3px;max-width:130px}
}

/* Mobile Bedienung 2.0: Der Plan ist die Arbeitsfläche, Bedienfelder erscheinen nur bei Bedarf. */
@media screen and (max-width:730px){
  body.flow-ready:not(.welcome-mode){padding-bottom:calc(68px + env(safe-area-inset-bottom));background:var(--app-bg)}
  .flow-ready:not(.welcome-mode) .top{height:58px!important;padding:6px max(8px,env(safe-area-inset-left))!important;box-shadow:0 2px 12px rgb(var(--shadow-rgb) / 0.133)}
  .flow-ready:not(.welcome-mode) .top-inner{height:46px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;align-items:center}
  .flow-ready:not(.welcome-mode) .top-inner>div:first-child{min-width:0}
  .flow-ready:not(.welcome-mode) .eyebrow{display:none}
  .flow-ready:not(.welcome-mode) h1{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .flow-ready:not(.welcome-mode) .export-actions{display:flex;margin:0;gap:5px}
  .flow-ready:not(.welcome-mode) .export-actions>*{display:none!important}
  .flow-ready:not(.welcome-mode) .export-actions>#walk-open,
  .flow-ready:not(.welcome-mode) .export-actions>#mobile-save{display:block!important;min-width:54px;height:44px;min-height:44px;padding:4px 8px;font-size:13px}
  .flow-ready:not(.welcome-mode) #cloud-status,.flow-ready:not(.welcome-mode) #flow-output,.flow-ready:not(.welcome-mode) #mobile-feedback{display:none!important}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] main{height:calc(100dvh - 58px - 68px - env(safe-area-inset-bottom));padding:0!important;overflow:hidden}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] .map-card{height:100%;margin:0!important;border:0;border-radius:0;display:block;position:relative;overflow:hidden}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] .map-card>.toolbar{position:absolute;z-index:6;top:8px;left:8px;width:auto;height:44px;padding:0;background:transparent;border:0}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] .map-card>.toolbar>div:first-child{display:none}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] .toolbar .zoom{height:44px;display:flex;gap:5px;background:#fffffff0;padding:3px;border-radius:13px;box-shadow:0 3px 12px rgb(var(--shadow-rgb) / 0.169)}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] .toolbar .zoom button{width:38px;min-width:38px;height:38px;min-height:38px;border:0;padding:0;background:transparent}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #zoom-fit{width:auto;min-width:82px;padding:0 8px;font-size:12px}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #map-zoom-value{display:none}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #plan-actions{position:absolute;z-index:7;left:8px;right:8px;bottom:10px;height:auto;padding:0;display:grid;grid-template-columns:minmax(0,1fr) 50px 50px;gap:7px;background:transparent}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #plan-actions button{height:50px;min-height:50px;border:0;border-radius:15px;box-shadow:0 4px 14px rgb(var(--shadow-rgb) / 0.251)}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #quick-add{background:var(--brand-primary);color:white;font-size:15px}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #quick-undo,.flow-ready:not(.welcome-mode)[data-flow-page=plan] #quick-redo{font-size:22px;background:#fff}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #daily-tools,
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #team-tools,
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #plus-tools,
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #planning-tools,
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #map-source{display:none!important}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] #mobile-selection{position:absolute;z-index:8;left:8px;right:8px;bottom:68px;border:0;border-radius:14px;padding:6px 7px 6px 12px;box-shadow:0 4px 16px rgb(var(--shadow-rgb) / 0.208)}
  .flow-ready:not(.welcome-mode)[data-flow-page=plan] .map-scroll{height:100%!important;max-height:none!important;overflow:auto;touch-action:none;overscroll-behavior:none;background:#d7d4d8;display:grid;align-items:center}
  .flow-ready #mobile-nav{height:calc(68px + env(safe-area-inset-bottom));grid-template-columns:repeat(4,1fr);gap:4px;padding:4px max(6px,env(safe-area-inset-left)) calc(4px + env(safe-area-inset-bottom));background:#fff;box-shadow:0 -4px 18px rgb(var(--shadow-rgb) / 0.110)}
  .flow-ready #mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-height:58px;border:0;border-radius:13px;font-size:11px}
  .flow-ready #mobile-nav button span{font-size:23px;line-height:24px;font-weight:500}
  .flow-ready #mobile-nav button[aria-current=page]{background:var(--brand-tint);color:var(--brand-primary)}
  #mobile-output-open{width:100%;margin:8px 0 10px;background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}

  #walk-dialog[open]{display:block!important;position:fixed;width:100vw;height:100dvh;background:#18202a;overflow:hidden}
  #walk-dialog .walk-view{position:absolute;inset:0;width:100%;height:100%;z-index:1}
  #walk-dialog .walk-top{position:absolute;z-index:20;top:max(7px,env(safe-area-inset-top));left:max(7px,env(safe-area-inset-left));right:max(7px,env(safe-area-inset-right));height:48px;padding:0!important;display:block!important;background:transparent;pointer-events:none}
  #walk-dialog .walk-top>div:first-child{display:none!important}
  #walk-dialog .walk-actions{display:flex!important;justify-content:flex-end;gap:6px;width:100%;pointer-events:none}
  #walk-dialog .walk-actions>*{pointer-events:auto}
  #walk-dialog #walk-picker-toggle,#walk-dialog #walk-close,#walk-dialog #walk-tools-menu>summary{display:grid!important;place-items:center;width:auto;min-width:54px;height:46px;min-height:46px;padding:4px 11px;border:1px solid #ffffffaa;border-radius:14px;background:#fffef5f2;color:var(--text);font-size:13px;line-height:1;box-shadow:0 3px 13px #0005;white-space:nowrap}
  #walk-dialog #walk-close{order:-1;margin-right:auto;background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}
  #walk-dialog #walk-picker-toggle{background:#fff;color:var(--brand-primary)}
  #walk-dialog #walk-tools-menu{position:relative;min-width:54px}
  #walk-dialog #walk-tools-menu>summary{font-size:19px;list-style:none}
  #walk-dialog #walk-tools-menu[open] .walk-tools-buttons{position:absolute;z-index:22;right:0;top:52px;width:min(250px,calc(100vw - 16px));min-width:0;padding:7px;display:grid;grid-template-columns:1fr 1fr;gap:6px;border:0;border-radius:15px;background:#fffffff7;box-shadow:0 7px 25px #0006}
  #walk-dialog #walk-tools-menu .walk-tools-buttons button,#walk-dialog #walk-standalone{display:grid;place-items:center;width:100%;min-height:48px;height:auto;padding:6px;border:1px solid var(--border);border-radius:10px;background:#fff;color:var(--text);font-size:13px;text-align:center;text-decoration:none;white-space:normal}
  #walk-dialog #walk-standalone{grid-column:1/-1;color:var(--brand-primary)}
  #walk-dialog #walk-edit-toolbar{display:none;position:absolute;z-index:19;top:63px;left:8px;right:8px;height:auto;padding:7px;border:0;border-radius:15px;background:#fffffff4;box-shadow:0 5px 20px #0005;gap:6px}
  #walk-dialog.picker-open #walk-edit-toolbar{display:flex!important}
  #walk-dialog #walk-edit-toolbar label{display:none}
  #walk-dialog #walk-element-select{flex:1;min-width:0;height:48px;min-height:48px;border-radius:10px;font-size:16px}
  #walk-dialog #walk-edit-selected{flex:0 0 94px;height:48px;min-height:48px;padding:5px;font-size:13px}
  #walk-dialog #walk-overview{top:64px;right:8px;width:112px;max-height:130px;border-radius:11px;opacity:.92}
  #walk-dialog .walk-controls{z-index:15;left:8px;right:8px;bottom:max(10px,env(safe-area-inset-bottom));align-items:end}
  #walk-dialog .walk-pad{grid-template-columns:repeat(3,54px);gap:6px}
  #walk-dialog .walk-controls button{width:54px;min-width:54px;height:54px;min-height:54px;border:1px solid #fff;border-radius:15px;background:#fffef5e8;font-size:25px;box-shadow:0 3px 13px #0005}
  #walk-dialog .walk-turn{gap:7px}
  #walk-dialog .walk-bottom{display:none!important}
  #walk-dialog .walk-label{font-size:11px;max-width:125px}
  #walk-dialog #walk-manipulator{position:fixed!important;z-index:18;left:8px!important;right:8px!important;top:auto!important;bottom:132px!important;width:auto;max-width:none;transform:none!important;display:flex;justify-content:center;gap:6px;white-space:nowrap}
  #walk-dialog #walk-manipulator[hidden]{display:none!important}
  #walk-dialog #walk-manipulator button{flex:0 1 122px;width:auto;max-width:122px;min-width:0;min-height:46px;height:46px;padding:5px 8px;border-radius:13px;font-size:13px;overflow:hidden;text-overflow:ellipsis}
  #walk-dialog #walk-manipulator #walk-deselect{flex:0 0 46px;width:46px;max-width:46px;font-size:22px}
}

@media screen and (max-width:900px) and (orientation:landscape) and (max-height:520px){
  #walk-dialog[open]{display:block!important;position:fixed;width:100vw;height:100dvh;background:#18202a;overflow:hidden}
  #walk-dialog .walk-view{position:absolute;inset:0;width:100%;height:100%;z-index:1}
  #walk-dialog .walk-top{position:absolute;z-index:20;top:max(4px,env(safe-area-inset-top));left:max(7px,env(safe-area-inset-left));right:max(7px,env(safe-area-inset-right));height:42px;padding:0!important;display:block!important;background:transparent;pointer-events:none}
  #walk-dialog .walk-top>div:first-child{display:none!important}
  #walk-dialog .walk-actions{display:flex!important;justify-content:flex-end;gap:6px;width:100%;pointer-events:none}
  #walk-dialog .walk-actions>*{pointer-events:auto}
  #walk-dialog #walk-picker-toggle,#walk-dialog #walk-close,#walk-dialog #walk-tools-menu>summary{height:40px;min-height:40px;border-radius:12px}
  #walk-dialog #walk-picker-toggle,#walk-dialog #walk-close,#walk-dialog #walk-tools-menu>summary{display:grid!important;place-items:center;width:auto;min-width:52px;padding:3px 10px;border:1px solid #ffffffaa;background:#fffef5f2;color:var(--text);font-size:12px;box-shadow:0 3px 13px #0005;white-space:nowrap}
  #walk-dialog #walk-close{order:-1;margin-right:auto;background:var(--brand-primary);color:#fff;border-color:var(--brand-primary)}
  #walk-dialog #walk-tools-menu{position:relative;min-width:52px}
  #walk-dialog #walk-tools-menu>summary{font-size:18px;list-style:none}
  #walk-dialog #walk-tools-menu[open] .walk-tools-buttons{position:absolute;z-index:22;right:0;top:45px;width:250px;min-width:0;padding:6px;display:grid;grid-template-columns:1fr 1fr;gap:5px;border:0;border-radius:13px;background:#fffffff7;box-shadow:0 7px 25px #0006}
  #walk-dialog #walk-tools-menu .walk-tools-buttons button,#walk-dialog #walk-standalone{display:grid;place-items:center;width:100%;min-height:42px;padding:4px;border:1px solid var(--border);border-radius:9px;background:#fff;color:var(--text);font-size:12px;text-align:center;text-decoration:none;white-space:normal}
  #walk-dialog #walk-standalone{grid-column:1/-1;color:var(--brand-primary)}
  #walk-dialog #walk-edit-toolbar{top:49px;left:max(8px,env(safe-area-inset-left));right:auto;width:min(360px,calc(100vw - 180px))}
  #walk-dialog #walk-edit-toolbar{display:none;position:absolute;z-index:19;height:auto;padding:5px;border:0;border-radius:12px;background:#fffffff4;box-shadow:0 5px 20px #0005;gap:5px}
  #walk-dialog.picker-open #walk-edit-toolbar{display:flex!important}
  #walk-dialog #walk-element-select{flex:1;min-width:0;height:42px;min-height:42px;font-size:14px}
  #walk-dialog #walk-edit-selected{flex:0 0 88px;height:42px;min-height:42px;padding:4px;font-size:12px}
  #walk-dialog #walk-overview{display:none!important}
  #walk-dialog .walk-bottom{display:none!important}
  #walk-dialog .walk-controls{bottom:max(5px,env(safe-area-inset-bottom))}
  #walk-dialog .walk-pad{grid-template-columns:repeat(3,48px);gap:4px}
  #walk-dialog .walk-controls button{width:48px;min-width:48px;height:48px;min-height:48px;border-radius:13px}
  #walk-dialog #walk-manipulator{left:50%!important;right:auto!important;bottom:62px!important;width:min(330px,calc(100vw - 220px));transform:translateX(-50%)!important}
  #walk-dialog #walk-manipulator button{height:42px;min-height:42px;flex:1 1 105px;font-size:12px}
  #walk-dialog #walk-manipulator #walk-deselect{flex:0 0 42px;width:42px;max-width:42px}
}
