/* Mobile Mode uses the same shop coordinates and commands, with its own viewport. */
.mobile-map-search,.mobile-map-legend,.mobile-map-more{display:none}

@media(max-width:767px){
  :root{--mobile-nav-height:calc(66px + env(safe-area-inset-bottom,0px))}
  body{overflow-x:clip}
  .shell{display:block;min-height:100dvh;padding-bottom:var(--mobile-nav-height)}
  .shell .main,.shell.sidebar-collapsed .main{margin-left:0;min-width:0}
  .shell .sidebar,.shell.sidebar-collapsed .sidebar{display:block;position:fixed;inset:auto 0 0;width:100%;height:var(--mobile-nav-height);padding:5px max(8px,env(safe-area-inset-right)) calc(5px + env(safe-area-inset-bottom));border:0;border-top:1px solid #eeedf3;border-radius:0;background:var(--surface);z-index:70}
  .shell .sidebar .brand,.shell .sidebar-bottom,.shell .nav-label,.shell .sidebar-toggle,.shell .topbar{display:none}
  .shell .sidebar nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;width:100%;height:56px;margin:0}
  .shell .sidebar .nav-item,.shell.sidebar-collapsed .sidebar .nav-item{display:flex;flex-direction:column;justify-content:center;width:100%;height:56px;min-height:44px;margin:0;padding:5px 2px;gap:4px;border-radius:13px;font-size:10px}
  .shell .sidebar .nav-item>span,.shell.sidebar-collapsed .sidebar .nav-item>span{display:block!important;text-align:center;font-size:10px;line-height:1.2}
  .shell .sidebar .nav-item .icon{width:19px;height:19px}
  .shell .sidebar .nav-item.active{background:var(--purple-soft);box-shadow:none;color:var(--purple)}
  .shell .page{padding:12px max(8px,env(safe-area-inset-right)) 12px max(8px,env(safe-area-inset-left));max-width:100%}
  .shell .btn,.shell .icon-btn,.shell .text-btn,.shell .duration,.shell .zone-tab{min-height:44px;min-width:44px;touch-action:manipulation}
  .shell input:not([type=checkbox]):not([type=color]),.shell select,.shell textarea{font-size:16px;min-height:44px}
  .shell .page-heading{margin:0 4px 12px;gap:8px}
  .shell .page-heading h1{font-size:23px;line-height:1.3}
  .shell .page-heading p,.shell .page-heading .eyebrow,.shell .page-footer{display:none}

  /* Two compact rows. Connection errors remain readable instead of being hidden. */
  .shell.view-desk .page{padding-top:max(10px,env(safe-area-inset-top))}
  .shell.view-desk .page-heading{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 112px;grid-template-rows:auto 48px;gap:8px 8px;min-height:110px;margin:0 6px 6px;padding:0 0 4px;align-items:center}
  .shell.view-desk .page-heading>div:first-child{grid-column:1;grid-row:1;max-width:none;min-width:0}
  .shell.view-desk .page-heading h1{font-size:20px;line-height:1.3;letter-spacing:-.5px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
  .shell.view-desk .operating-meta{display:flex;flex-wrap:nowrap;gap:5px;margin-top:5px;font-size:10px;line-height:16px;min-width:0}
  .shell.view-desk .operating-meta #shop-operating-state{flex-shrink:0}
  .shell.view-desk .operating-meta .server-status{max-width:none;min-width:0;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .shell.view-desk .operating-meta .error-banner{padding:0;border:0;background:none;margin:0;font-size:10px;line-height:1.45;white-space:normal}
  .shell.view-desk .heading-actions{grid-row:1;grid-column:2;width:auto;display:flex;margin:0;align-self:start}
  .shell.view-desk .heading-actions>.btn{width:100%;padding:8px;font-size:13px;min-height:44px;border-radius:14px;gap:4px;box-shadow:0 3px 9px #6852b61a}
  .shell.view-desk .heading-actions .icon{width:16px;height:16px}
  .shell.view-desk .service-summary{grid-column:1;grid-row:2;width:100%;order:initial;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin:0}
  .shell.view-desk .summary-item{display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;min-height:44px;padding:2px 4px;border:0;border-radius:10px;background:none}
  .shell.view-desk .summary-item strong{font-size:22px;line-height:1.05;letter-spacing:-.5px}
  .shell.view-desk .summary-item span{font-size:10px;white-space:nowrap;line-height:1.25}
  .shell.view-desk .summary-item[data-value=free],.shell.view-desk .summary-reset{display:none}
  .shell.view-desk .summary-item.selected{background:var(--purple-soft)}
  .shell.view-desk .shop-clock{grid-column:2;grid-row:2;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px;min-width:0;margin:0;padding-right:2px}
  .shell.view-desk .shop-clock>span{font-size:9px;letter-spacing:.3px}
  .shell.view-desk .shop-clock .clock-digits{font-size:17px;line-height:1.2;letter-spacing:-.3px;min-width:0}
  .shell.view-desk #alert-strip{display:none}
  .shell.view-desk .workspace-grid{display:block;margin:0}
  .shell.view-desk .floor-panel{border:0;border-radius:18px;box-shadow:0 2px 10px #29213206;overflow:hidden}
  .shell.view-desk .floor-panel .panel-heading{display:flex;flex-wrap:nowrap;gap:4px;min-height:44px;padding:0 8px;border:0}
  .shell.view-desk .panel-title{min-width:0;gap:4px;margin-right:auto}
  .shell.view-desk .panel-title h2{font-size:12px;white-space:nowrap}
  .shell.view-desk .count-badge{font-size:10px;padding:0;background:none;white-space:nowrap}
  .shell.view-desk .view-switch{padding:0;gap:0;background:transparent;flex-shrink:0}
  .shell.view-desk .view-switch button{width:44px;height:44px;border-radius:11px}
  .shell.view-desk .view-switch .icon{width:17px;height:17px}
  .shell.view-desk .view-switch button.selected{background:var(--purple-soft);box-shadow:none;color:var(--purple)}
  .shell.view-desk .floor-filters{display:flex;flex-wrap:wrap;align-items:center;gap:0;padding:0 6px;border:0;min-height:44px}
  .shell.view-desk .zone-tabs{display:flex;flex:1;flex-basis:auto;flex-wrap:nowrap;gap:3px;min-width:0;width:auto;overflow-x:auto;scrollbar-width:none}
  .shell.view-desk .zone-tab{flex-shrink:0;padding:5px 10px;font-size:12px;white-space:nowrap;border-radius:10px;background:none}
  .shell.view-desk .zone-tab.active{color:var(--purple);background:var(--purple-soft)}
  .shell.view-desk .mobile-map-search,.shell.view-desk .mobile-map-legend{display:inline-flex;flex-shrink:0;width:44px;height:44px;color:var(--muted)}
  .shell.view-desk .mobile-map-search .icon,.shell.view-desk .mobile-map-legend .icon{width:17px;height:17px}
  .shell.view-desk .search-box{display:none}
  .shell.view-desk .mobile-search-open .search-box{display:flex;flex-basis:100%;width:100%;max-width:100%;height:44px;margin:4px 0 8px;border-radius:12px;background:var(--bg)}
  .shell.view-desk .search-box input{font-size:16px;width:100%;min-width:0}
  .shell.view-desk .map-bottom{display:none}
  .shell.view-desk .mobile-legend-open .map-bottom{display:block;padding:6px 10px;border:0}
  .shell.view-desk .map-hint{display:none}
  .shell.view-desk .filter-chip{margin:2px 8px;font-size:11px;min-height:44px}

  /* Reserve a separate 52px footer; fit and zoom never sit over a table. */
  .shell.view-desk .map-scroll:not(.editing),.shell.view-editor .map-scroll.editing{display:flex;flex-direction:column;position:relative;height:var(--map-viewport-height,60dvh)!important;max-height:none;overflow:hidden;padding:0;background:var(--bg);overscroll-behavior:none}
  .shell.view-desk .map-scroll .map-scale,.shell.view-editor .map-scroll .map-scale{flex:1;min-height:0;height:calc(100% - 52px)!important;width:100%!important;min-width:0!important}
  .shell.view-desk .map-scroll:not(.editing) .floor-map,.shell.view-editor .map-scroll.editing .floor-map{display:block;width:100%;height:100%!important;max-height:none;touch-action:none;user-select:none;-webkit-user-select:none}
  .shell .map-scroll .map-controls{position:static;inset:auto;display:flex;align-items:center;justify-content:flex-end;gap:4px;flex-shrink:0;align-self:stretch;width:100%;height:52px;min-height:52px;margin:0;padding:4px 8px;border:0;border-radius:0;background:var(--surface);box-shadow:none;backdrop-filter:none;z-index:auto;font-size:11px}
  .shell .map-scroll .map-controls>[data-action=zoom-in],.shell .map-scroll .map-controls>[data-action=zoom-out],.shell .map-scroll .map-controls>[data-zoom-label]{display:none}
  .shell .map-scroll .map-controls>.fit-btn{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:44px;padding:6px 12px;border-radius:12px;background:var(--purple-soft);color:var(--purple);font-size:12px}
  .shell .map-scroll .mobile-map-more{display:inline-flex;width:44px;height:44px;font-size:20px;letter-spacing:2px;color:var(--muted)}
  .shell .map-scroll.mobile-map-tools-open .map-controls>[data-action=zoom-in],.shell .map-scroll.mobile-map-tools-open .map-controls>[data-action=zoom-out]{display:inline-flex}
  .shell .map-scroll.mobile-map-tools-open .map-controls>[data-zoom-label]{display:inline;min-width:46px;text-align:center;font-variant-numeric:tabular-nums}
  .shell .seat-shape.selected .seat-main{stroke:var(--purple);stroke-width:3;filter:drop-shadow(0 0 3px #6754bd40)}
  .shell .seat-list{height:calc(100dvh - 285px);min-height:220px;max-height:none;overscroll-behavior:contain}
  .shell .seat-list-item{min-height:72px;grid-template-columns:52px minmax(0,1fr) 76px;gap:5px 8px;padding:12px;color:var(--muted)}
  .shell .seat-list-item>.list-seat-number{grid-row:1/3;font-size:17px;color:var(--ink)}
  .shell .seat-list-item>span:nth-child(2){grid-column:2;grid-row:2;font-size:11px}
  .shell .seat-list-item>span:nth-child(3){grid-column:2;grid-row:1;font-size:12px}
  .shell .seat-list-item>strong{grid-column:3;grid-row:1/3;font-size:15px;color:var(--ink)}
  .shell .seat-list-item>.icon{display:none}

  /* One-tap seat operations; the underlying map remains in place. */
  body:has(.shell.view-desk.detail-open){overflow:hidden;overscroll-behavior:none}
  .shell.view-desk.detail-open .workspace-grid>.right-column{position:fixed;inset:0 0 var(--mobile-keyboard-inset,0px);display:flex;flex-direction:row;align-items:flex-end;justify-content:center;gap:0;padding:0;z-index:90;overflow:hidden;background:#18152c48;max-height:none}
  .shell.view-desk.detail-open #seat-detail{position:relative;flex-shrink:0;width:100%;max-width:620px;min-height:0;max-height:min(88dvh,calc(var(--mobile-visual-height,100dvh) - 16px));margin:0;padding:18px 18px max(16px,env(safe-area-inset-bottom));overflow:auto;overscroll-behavior:contain;border:0;border-radius:24px 24px 0 0;box-shadow:0 -8px 40px #1f183e1a;animation:mobile-sheet-enter .18s ease-out;-webkit-overflow-scrolling:touch}
  .shell.view-desk #seat-detail::before{content:'';display:block;width:34px;height:4px;background:#d8d6df;border-radius:4px;margin:-8px auto 10px}
  .shell.view-desk .close-detail{position:absolute;right:10px;top:10px;width:44px;height:44px;margin:0;background:var(--bg);border-radius:50%}
  .shell.view-desk .detail-header{padding-right:48px;margin:0 0 10px;min-height:32px}
  .shell.view-desk .detail-header h2{font-size:12px;color:var(--muted)}
  .shell.view-desk .seat-identity{padding:0 0 12px;margin:0 0 12px;gap:12px;border-bottom:1px solid var(--line)}
  .shell.view-desk .big-seat{width:44px;height:44px;min-width:44px;font-size:16px;border-radius:12px}
  .shell.view-desk .big-seat::before,.shell.view-desk .big-seat::after{display:none}
  .shell.view-desk .seat-identity h3{font-size:23px;line-height:1.3}
  .shell.view-desk .seat-identity p{font-size:11px;margin-top:3px}
  .shell.view-desk .timer-card{padding:10px;margin:0 0 8px;border-radius:16px}
  .shell.view-desk .timer-card strong{font-size:34px;line-height:1.3;margin:3px 0}
  .shell.view-desk .timer-card>div,.shell.view-desk .timer-card>span{font-size:11px}
  .shell.view-desk .timer-card>span{display:none}
  .shell.view-desk .session-disclosure{margin:0 0 8px}
  .shell.view-desk .session-disclosure summary{min-height:44px;padding:8px 0;font-size:12px}
  .shell.view-desk .seat-operation-row{gap:8px;margin:0 0 10px}
  .shell.view-desk .control-block{margin-top:12px;padding-top:0}
  .shell.view-desk .control-block.renewal-block{margin-top:0}
  .shell.view-desk .control-block>label,.shell.view-desk .package-label{margin:8px 0;font-size:12px}
  .shell.view-desk .control-block select{min-height:44px;padding:8px 10px;border-radius:12px}
  .shell.view-desk .duration-options{gap:6px;margin:8px 0}
  .shell.view-desk .duration{min-width:0;min-height:44px;font-size:12px;border-radius:11px;padding:5px}
  .shell.view-desk .custom-duration{margin:8px 0;gap:8px;min-height:44px}
  .shell.view-desk .custom-duration input{min-height:44px;padding:8px}
  .shell.view-desk .control-block .field-hint{font-size:10px;line-height:1.5;margin:6px 0}
  .shell.view-desk .control-block>.btn,.shell.view-desk .seat-operation-row>.btn{min-height:46px;border-radius:13px;font-size:14px}
  .shell.view-desk .price-line{margin:10px 0;padding:0}
  .shell.view-desk .price-line strong{font-size:23px}
  .shell.view-desk .secondary-actions{margin:10px 0 0;gap:8px}
  .shell.view-desk .note-disclosure{margin:10px 0 0}
  .shell.view-desk .ready-note{margin:0 0 8px;font-size:11px}
  .shell.view-desk .package-shortcuts:empty{display:none}
  .shell.view-desk .package-shortcut-item{max-width:100%}
  .shell.view-desk .package-shortcut-item .btn{white-space:normal}

  .shell.view-editor .page-heading{display:block;margin:0 2px 7px;min-height:44px;padding:0}
  .shell.view-editor .page-heading>div:first-child,.shell.view-editor .shop-clock{display:none}
  .shell.view-editor .heading-actions{display:flex;width:100%;margin:0;justify-content:space-between;gap:8px}
  .shell.view-editor .heading-actions .btn{min-height:44px;font-size:13px;padding:8px 12px}
  .shell.view-editor #server-status.server-status{display:none}

  /* Same records, presented as compact entries instead of a compressed table. */
  .shell.view-history .page-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;min-height:48px}
  .shell.view-history .page-heading>div:first-child{max-width:none}
  .shell.view-history .shop-clock{display:none}
  .shell.view-history .heading-actions{width:auto;margin:0}
  .shell.view-history .heading-actions .btn{font-size:11px;padding:7px}
  .shell.view-history #server-status.server-status{font-size:10px;margin:0 4px 10px}
  .shell .history-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:0 0 14px}
  .shell .history-summary>.panel{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:76px;padding:11px 9px;gap:7px;border:0;border-radius:16px;box-shadow:none}
  .shell .history-summary span{font-size:11px}
  .shell .history-summary strong{font-size:22px;margin:0;line-height:1.1}
  .shell .history-summary small{font-size:10px;margin-left:3px}
  .shell .history-panel{border:0;border-radius:18px;box-shadow:none;overflow:hidden}
  .shell .history-panel .panel-heading{padding:10px 12px;gap:5px;min-height:0}
  .shell .history-panel h2{font-size:14px}
  .shell .history-filters{gap:5px;font-size:11px;flex-wrap:wrap}
  .shell .history-filters label{display:none}
  .shell .history-filters input{font-size:12px;min-height:44px;width:140px;padding:6px}
  .shell .history-filters .btn{font-size:11px;padding:5px;min-height:44px}
  .shell .history-panel .table-scroll{overflow:visible}
  .shell .history-panel table,.shell .history-panel tbody{display:block;width:100%;min-width:0}
  .shell .history-panel thead{display:none}
  .shell .history-panel tr{display:grid;grid-template-columns:minmax(0,1fr) auto 82px;gap:5px 8px;padding:12px 14px;border-top:1px solid var(--line)}
  .shell .history-panel td{padding:0;border:0;font-size:12px;min-width:0;align-self:center;text-align:left}
  .shell .history-panel td:first-child{grid-column:1/-1;display:flex;align-items:center;gap:8px;color:var(--muted);font-size:10px}
  .shell .history-panel td:first-child .table-sub{order:-1;font-size:12px;margin:0;color:var(--ink)}
  .shell .history-panel td:nth-child(2){grid-column:1;grid-row:2/4}
  .shell .history-panel td:nth-child(2) strong{font-size:16px;color:var(--ink)}
  .shell .history-panel td:nth-child(2) .table-sub{margin-top:3px;font-size:11px}
  .shell .history-panel td:nth-child(3){grid-column:2;grid-row:2;max-width:110px}
  .shell .history-panel td:nth-child(4){grid-column:2;grid-row:3;color:var(--muted);font-size:11px}
  .shell .history-panel td:nth-child(5){grid-column:3;grid-row:2/4;text-align:right;font-size:19px;font-weight:600;font-variant-numeric:tabular-nums}
  .shell .history-panel td:nth-child(6){grid-column:1/-1;font-size:10px;color:var(--muted);margin-top:2px}
  .shell .history-panel td:nth-child(6)::before{content:'票号 · '}
  .shell .history-panel .table-sub{overflow-wrap:anywhere}
  .shell .history-panel .event-pill{font-size:11px;padding:3px 7px;border-radius:6px}
  .shell .history-panel .history-foot{font-size:10px;gap:5px;padding:12px}
  .shell .history-panel .empty-state{padding:45px 12px;width:100%}

  #modal-root .modal-overlay{padding:12px;align-items:center}
  #modal-root .modal{max-height:calc(100dvh - 24px);border-radius:22px;overscroll-behavior:contain}
  #modal-root .modal-heading,#modal-root .modal-body,#modal-root .modal-footer{padding:16px}
  #modal-root .modal button{min-height:44px;min-width:44px}
  #modal-root input,#modal-root select,#modal-root textarea{font-size:16px;min-height:44px}
  #toast{bottom:calc(var(--mobile-nav-height) + 10px);max-width:calc(100% - 24px);font-size:12px;padding:10px 16px}
}
@media(max-width:480px){.shell.view-desk .page-heading h1{font-size:20px}.shell.view-desk .floor-panel{border-radius:16px}}
@media(min-width:481px) and (max-width:767px){
  .shell .page{padding-inline:12px}
  .shell.view-desk .page-heading{grid-template-columns:minmax(0,1fr) 132px;gap:8px 16px}
  .shell.view-desk .page-heading h1{font-size:22px}
  .shell.view-desk .summary-item{flex-direction:row;gap:8px}
  .shell.view-desk .summary-item span{font-size:12px}
  .shell.view-desk .floor-panel .panel-heading{padding-inline:12px}
  .shell.view-desk .shop-clock .clock-digits{font-size:19px}
}
@keyframes mobile-sheet-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.shell.view-desk.detail-open #seat-detail{animation:none}}