/* Map styling is an editing sheet, independent of the Collections layout. */
.app-mobile-preferences-dialog {
  position:fixed;inset:var(--app-viewport-top,0px) auto auto var(--app-viewport-left,0px);z-index:6500;
  width:var(--app-viewport-width,100%);height:var(--app-viewport-height,100dvh);box-sizing:border-box;display:flex;flex-direction:column;min-width:0;
  background:var(--app-surface,#f7fafc);color:var(--app-ink,#173b48);font:400 15px/1.4 var(--font-body,"Source Sans 3","Chiron Hei HK",sans-serif);
}
.app-mobile-preferences-dialog [hidden] {display:none!important;}
html:is([data-app-layout=phone],[data-app-layout=tablet]) .app-mobile-preferences-dialog {
  /* Body already follows visualViewport.offsetTop and contains fixed sections. */
  inset:calc(var(--app-half-sheet-top,calc(var(--app-viewport-top,0px) + var(--app-viewport-height,100dvh) * .5)) - var(--app-viewport-top,0px)) 0 auto;
  width:var(--app-viewport-width,100vw);height:var(--app-half-sheet-height,calc(var(--app-viewport-height,100dvh) * .5));
  max-height:var(--app-half-sheet-height,calc(var(--app-viewport-height,100dvh) * .5));border-top:1px solid var(--app-line,#d3e0ea);
  border-radius:22px 22px 0 0;overflow:hidden;box-shadow:0 -6px 24px #133c4b18;
  .app-mobile-preferences-header {min-height:60px;padding:6px max(16px,env(safe-area-inset-right)) 6px max(16px,env(safe-area-inset-left));gap:10px;}
  .app-mobile-preferences-brand>h2 {font-size:20px;}
  .app-mobile-preferences-content {display:block;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;}
  .app-mobile-style-tabs {padding-block:8px;}
  .app-mobile-style-body {overflow:visible;}
  .app-mobile-preferences-footer {min-height:60px;padding:6px max(16px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));gap:10px;}
  .app-mobile-preferences-footer>p {max-height:48px;overflow-y:auto;overscroll-behavior:contain;}
  .app-mobile-preferences-save {min-width:96px;padding-inline:16px;}
}
/* A keyboard can leave only 100px for the sheet. Keep one real Save control
   in the 44px toolbar and let feedback, tabs and form share the remaining scroll. */
html:is([data-app-layout=phone],[data-app-layout=tablet]) .app-mobile-preferences-dialog.app-mobile-preferences-compact {
  .app-mobile-preferences-header {min-height:44px;height:44px;padding:0 8px;gap:6px;}
  .app-mobile-preferences-header>button {width:44px;height:44px;min-width:44px;min-height:44px;}
  .app-mobile-preferences-brand>span {display:none;}
  .app-mobile-preferences-brand>h2 {margin:0;font-size:16px;}
  .app-mobile-preferences-header>.app-mobile-preferences-save {width:auto;min-width:64px;padding:0 10px;border-radius:10px;background:var(--app-ink);color:var(--app-raised);font-size:13px;}
  .app-mobile-preferences-host {display:block;flex:1;min-height:44px;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;}
  .app-mobile-preferences-content {overflow:visible;}
  .app-mobile-style-tabs {padding-block:4px;gap:4px;}
  .app-mobile-style-tabs>button {min-height:44px;padding-block:6px;font-size:13px;}
  .app-mobile-preferences-short-feedback {display:none;padding:8px 16px;gap:10px;align-items:center;border-bottom:1px solid var(--app-line);background:var(--app-raised);}
  .app-mobile-preferences-short-feedback:has(p:not(:empty),button:not([hidden])) {display:flex;}
  .app-mobile-preferences-short-feedback>p {flex:1;min-width:0;margin:0;font-size:12px;line-height:1.4;color:var(--app-muted);overflow-wrap:anywhere;}
  .app-mobile-preferences-short-feedback>button {min-height:44px;padding:6px 8px;}
}
html:is([data-app-layout=phone],[data-app-layout=tablet]) body.mobile-preferences-open #mobileAppShell :is(.app-primary-bank,.app-map-logo),
html:is([data-app-layout=phone],[data-app-layout=tablet]) body.mobile-preferences-open .cursor-status-bar {visibility:hidden!important;}
.app-mobile-preferences-dialog button {font:inherit;touch-action:manipulation;cursor:pointer;}
.app-mobile-preferences-dialog :is(button,input):focus-visible {outline:3px solid var(--app-accent,#125769);outline-offset:2px;}
.app-mobile-preferences-header {display:flex;align-items:center;gap:14px;flex:none;min-height:82px;box-sizing:border-box;padding:calc(10px + var(--app-safe-top,env(safe-area-inset-top,0px))) max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));border-bottom:1px solid var(--app-line,#d3e0ea);background:var(--app-raised,#fff);}
.app-mobile-preferences-header>button {display:grid;place-items:center;flex:none;width:48px;height:48px;padding:0;border:0;border-radius:50%;background:var(--app-selected,#edf5f3);color:var(--app-ink,#173b48);font-size:30px;}
.app-mobile-preferences-brand {flex:1;min-width:0;}
.app-mobile-preferences-brand>span {font-size:12px;font-weight:600;color:var(--app-accent,#125769);}
.app-mobile-preferences-brand>h2 {margin:3px 0 0;font-size:22px;line-height:1.2;font-weight:650;}
.app-mobile-preferences-host {display:flex;flex:1;min-height:0;overflow:hidden;}
.app-mobile-preferences-loading,.app-mobile-preferences-load-error {margin:28px 20px;color:var(--app-muted,#526b80);font-size:15px;}
.app-mobile-preferences-host:has(>.app-mobile-preferences-load-error) {display:flex;flex-direction:column;align-items:flex-start;overflow:auto;}
.app-mobile-preferences-retry {min-height:48px;margin:0 20px;padding:10px 18px;border:1px solid var(--app-line,#d3e0ea);border-radius:12px;background:var(--app-raised,#fff);color:var(--app-ink,#173b48);}
.app-mobile-preferences-content {display:flex;flex:1;flex-direction:column;min-width:0;min-height:0;}
.app-mobile-style-tabs {display:flex;gap:5px;flex:none;padding:12px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));background:var(--app-surface,#f7fafc);}
.app-mobile-style-tabs>button {flex:1;min-width:0;min-height:48px;padding:8px 6px;border:1px solid transparent;border-radius:12px;background:var(--app-selected,#edf5f3);color:var(--app-muted,#526b80);font-size:14px;font-weight:600;}
.app-mobile-style-tabs>button[aria-selected=true] {background:var(--app-ink,#173b48);color:var(--app-raised,#fff);}
.app-mobile-style-body {flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;padding:0 max(16px,env(safe-area-inset-right)) 20px max(16px,env(safe-area-inset-left));}
.app-mobile-style-pane {max-width:680px;margin:0 auto;}
.app-mobile-preferences-dialog .ws-settings-list {overflow:hidden;border:1px solid var(--app-line,#d3e0ea);border-radius:16px;background:var(--app-raised,#fff);}
.app-mobile-preferences-dialog .ws-settings-group-title {display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:14px;color:var(--app-ink,#173b48);background:var(--app-selected,#edf5f3);font-size:15px;font-weight:650;}
.app-mobile-preferences-dialog .ws-drax-reset {min-height:44px;padding:8px 10px;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:var(--app-raised,#fff);color:var(--app-ink,#173b48);font-size:12px;}
.app-mobile-preferences-dialog .ws-setting-row {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:58px;box-sizing:border-box;padding:9px 14px;border-top:1px solid var(--app-line,#d3e0ea);background:var(--app-raised,#fff);}
.app-mobile-preferences-dialog .ws-setting-label {flex:0 1 41%;font-size:14px;font-weight:600;line-height:1.25;color:var(--app-ink,#173b48);}
.app-mobile-preferences-dialog .ws-setting-controls {display:flex;justify-content:flex-end;align-items:center;flex:0 1 59%;min-width:0;gap:7px;}
.app-mobile-preferences-dialog .ws-website-overlay-styles {display:grid;gap:12px;}
.app-mobile-preferences-dialog .ws-style-visible-range {gap:4px;}
.app-mobile-preferences-dialog .ws-style-visible-range select {flex:1 1 0;min-width:0;width:0;min-height:44px;padding:4px;border:1px solid var(--app-line,#d3e0ea);border-radius:8px;background:var(--app-raised,#fff);color:inherit;font:inherit;font-size:12px;}
.app-mobile-preferences-dialog .ws-setting-switch {min-width:48px;min-height:48px;padding:8px 10px;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:var(--app-surface,#f7fafc);color:var(--app-ink,#173b48);font-size:13px;font-weight:600;}
.app-mobile-preferences-dialog .ws-setting-switch[aria-pressed=true] {background:var(--app-ink,#173b48);color:var(--app-raised,#fff);}
.app-mobile-preferences-dialog .ws-setting-cycle {display:flex;align-items:center;flex:0 1 59%;min-width:0;min-height:48px;height:auto;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:var(--app-surface,#f7fafc);color:var(--app-ink,#173b48);}
.app-mobile-preferences-dialog .ws-setting-cycle-arrow {flex:none;width:44px;min-width:44px;min-height:48px;padding:0;border:0;background:transparent;color:var(--app-ink,#173b48);font-size:23px;}
.app-mobile-preferences-dialog .ws-setting-cycle-value {flex:1;min-width:0;text-align:center;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.app-mobile-preferences-dialog input[type=color] {flex:0 0 48px;width:48px!important;min-width:48px!important;height:48px;min-height:48px!important;padding:3px;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:var(--app-raised,#fff);cursor:pointer;}
.app-mobile-preferences-dialog input[type=range] {width:100%;min-width:40px;min-height:48px!important;accent-color:var(--app-accent,#125769);touch-action:pan-y;}
.app-mobile-preferences-dialog output {min-width:32px;font-size:12px;color:var(--app-muted,#526b80);text-align:right;}
.app-mobile-preferences-dialog .ws-drax-style-preview {display:grid;grid-template-columns:68px minmax(0,1fr);align-items:center;gap:12px;min-height:76px;box-sizing:border-box;padding:12px 14px;border-bottom:1px solid var(--app-line,#d3e0ea);background:var(--app-surface,#f7fafc);}
.app-mobile-preferences-dialog .ws-drax-style-preview>small {font-size:12px;line-height:1.25;color:var(--app-muted,#526b80);}
.app-mobile-preferences-dialog .ws-drax-style-sample {display:flex;align-items:center;justify-content:center;gap:16px;min-width:0;min-height:52px;max-height:88px;overflow:auto;padding:4px;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:#fff;}
.app-mobile-preferences-dialog .ws-drax-sample-line {width:35%;flex:0 0 35%;border-top-width:4px;}
.app-mobile-preferences-dialog .ws-drax-sample-point {display:block;flex:none;border:1px solid #fff;border-radius:50%;box-shadow:0 0 0 1px #709788;}
.app-mobile-preferences-dialog .ws-drax-sample-polygon {display:block;flex:none;width:26px;height:24px;border-style:solid;}
.app-mobile-preferences-dialog .ws-drax-sample-label {padding:2px 6px;white-space:nowrap;}
.app-mobile-preferences-footer {display:flex;align-items:center;gap:14px;flex:none;min-height:74px;box-sizing:border-box;padding:12px max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));border-top:1px solid var(--app-line,#d3e0ea);background:var(--app-raised,#fff);}
.app-mobile-preferences-footer>p {flex:1;min-width:0;margin:0;font-size:13px;color:var(--app-muted,#526b80);}
.app-mobile-preferences-save {flex:none;min-height:48px;min-width:116px;padding:10px 20px;border:0;border-radius:13px;background:var(--app-ink,#173b48);color:var(--app-raised,#fff);font-weight:650!important;}
.app-mobile-preferences-reset {flex:none;min-height:38px;padding:6px 10px;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:var(--app-raised,#fff);color:var(--app-ink,#173b48);font-size:12px!important;font-weight:600!important;}
.app-mobile-preferences-reload {flex:none;min-height:48px;padding:8px;border:1px solid var(--app-line,#d3e0ea);border-radius:10px;background:var(--app-selected,#edf5f3);color:var(--app-ink,#173b48);}
.app-mobile-preferences-dialog button:disabled {opacity:.5;cursor:default;}
@media(max-width:360px) {.app-mobile-preferences-brand>h2{font-size:20px}.app-mobile-style-tabs>button{font-size:13px}.app-mobile-preferences-dialog .ws-setting-row{padding-inline:11px;gap:8px}.app-mobile-preferences-dialog .ws-setting-label{font-size:13px;flex-basis:40%}.app-mobile-preferences-dialog .ws-setting-controls{gap:4px}}

/* Match the compact record and folder cards on touch screens. */
html:root:is([data-app-layout=phone],[data-app-layout=tablet]) .app-mobile-preferences-dialog {
  font-size:13px;
  .app-mobile-preferences-header {min-height:52px;padding:4px 12px;gap:8px;}
  .app-mobile-preferences-header>button {width:36px;height:36px;min-width:36px;min-height:36px;font-size:25px;}
  .app-mobile-preferences-brand>span {font-size:10px;line-height:1.2;}
  .app-mobile-preferences-brand>h2 {margin-top:1px;font-size:18px;line-height:1.2;}
  .app-mobile-style-tabs {gap:4px;padding:6px 12px;}
  .app-mobile-style-tabs>button {min-height:36px;padding:4px 6px;border-radius:10px;font-size:13px;}
  .app-mobile-style-body {padding:0 12px 8px;}
  .ws-settings-list {border-radius:14px;}
  .ws-style-settings {gap:0;}
  .ws-settings-group-title {min-height:42px;box-sizing:border-box;padding:4px 10px;gap:6px;font-size:13px;}
  .ws-drax-reset {min-height:30px;padding:4px 8px;border-radius:8px;font-size:11px;}
  .ws-setting-row {min-height:44px;padding:3px 10px;gap:8px;}
  .ws-setting-label {font-size:13px;line-height:1.3;font-weight:400;}
  .ws-setting-controls {gap:5px;}
  .ws-website-overlay-styles {gap:8px;}
  .ws-style-visible-range select {min-height:34px;padding:3px;font-size:11px;}
  .ws-setting-switch {min-width:36px;min-height:32px;padding:4px 6px;border-radius:8px;font-size:12px;}
  input[type=color] {flex-basis:36px;width:36px!important;min-width:36px!important;height:32px;min-height:32px!important;padding:2px;border-radius:8px;}
  input[type=range] {height:36px;min-height:36px!important;margin:0;}
  output {min-width:30px;font-size:11px;}
  .ws-drax-style-preview {min-height:48px;padding:5px 10px;grid-template-columns:56px minmax(0,1fr);gap:8px;}
  .ws-drax-style-preview>small {font-size:11px;}
  .ws-drax-style-sample {box-sizing:border-box;min-height:32px;max-height:40px;padding:3px;gap:10px;border-radius:8px;}
  .ws-drax-style-sample>span {box-sizing:border-box;}
  .app-mobile-preferences-footer {min-height:48px;padding:4px 12px max(4px,env(safe-area-inset-bottom));gap:8px;}
  .app-mobile-preferences-footer>p {font-size:12px;}
  .app-mobile-preferences-save {min-width:84px;min-height:38px;padding:6px 14px;border-radius:10px;font-size:14px;}
  .app-mobile-preferences-reload {min-height:36px;padding:4px 8px;font-size:12px;}
}
html:root:is([data-app-layout=phone],[data-app-layout=tablet]) .app-mobile-preferences-dialog.app-mobile-preferences-compact {
  .app-mobile-preferences-header {min-height:44px;height:44px;padding:0 8px;}
  .app-mobile-preferences-header>button {width:36px;height:36px;min-width:36px;min-height:36px;}
  .app-mobile-preferences-brand>h2 {font-size:14px;}
  .app-mobile-preferences-header>.app-mobile-preferences-save {width:auto;min-width:60px;font-size:12px;}
}
