/* My plans: panel, 811 badge, upload / page / point-matching dialog (navy #1F2A44, copper #B87333) */
.pg-panel>summary{font-weight:700;cursor:pointer;padding:6px 0;color:inherit}
.pg-help{margin:2px 0 8px}
.pg-list{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}
.pg-item{border:1px solid #d8dce5;border-left:4px solid #B87333;border-radius:8px;padding:8px 10px;background:#fff}
.pg-item.pg-pending{border-left-color:#9aa3b5;background:#f7f8fb}
.pg-row1{display:flex;align-items:center;gap:8px}
.pg-row1 input[type=checkbox]{width:20px;height:20px;accent-color:#B87333;flex:none}
.pg-dot{color:#9aa3b5;width:20px;text-align:center}
.pg-name{font-weight:600;color:#1F2A44;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pg-kind{font-size:11px;color:#5b6475;background:#eef0f5;border-radius:10px;padding:1px 7px}
.pg-row2{display:flex;align-items:center;gap:8px;margin-top:6px}
.pg-row2 input[type=range]{flex:1;accent-color:#B87333}
.pg-op{font-size:12px;color:#5b6475;min-width:36px;text-align:right}
.pg-meta{font-size:12px;color:#5b6475;margin-top:4px}
.pg-warn{color:#b3261e}
.pg-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.pg-acts button{font-size:12.5px;padding:5px 10px;border-radius:6px;border:1px solid #c9cfdb;background:#fff;color:#1F2A44;cursor:pointer;min-height:32px}
.pg-acts button:hover{border-color:#B87333}
.pg-acts .pg-del{color:#b3261e}
.pg-811{font-size:12px;line-height:1.35;color:#1F2A44;background:#fbf3ea;border:1px solid #e7c9a8;border-radius:6px;padding:6px 8px;margin:8px 0 0}
.pg-811 b{display:inline-block;background:#B87333;color:#fff;border-radius:4px;padding:0 5px;margin-right:4px;font-size:11px}
/* 811 badge on the map */
.pg-badge{position:absolute;left:10px;bottom:34px;z-index:3;display:flex;align-items:center;gap:6px;max-width:min(78%,420px);
  background:#1F2A44ee;color:#fff;border:0;border-left:4px solid #B87333;border-radius:6px;padding:5px 9px;font-size:12px;text-align:left;cursor:pointer;box-shadow:0 2px 8px #0004}
.pg-badge b{background:#B87333;border-radius:4px;padding:0 5px;font-size:11px}
.pg-badge span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pg-badge[hidden],.pg-badge.pg-away{display:none}
body.ga-mobile .pg-badge{bottom:calc(92px + env(safe-area-inset-bottom));left:8px;max-width:calc(100% - 80px)}
/* dialog */
.pg-dialog{width:min(980px,96vw)}
.pg-body{padding:14px 16px;display:flex;flex-direction:column;gap:10px}
.pg-drop{display:flex;flex-direction:column;align-items:center;gap:4px;border:2px dashed #B87333;border-radius:12px;padding:22px 12px;text-align:center;cursor:pointer;background:#fbf7f2;color:#1F2A44}
.pg-drop input{position:absolute;opacity:0;width:1px;height:1px}
.pg-drop-ic{font-size:28px;color:#B87333}.pg-drop span{font-size:12.5px;color:#5b6475}.pg-file{font-weight:600;color:#1F2A44!important}
.pg-field{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;color:#1F2A44}
.pg-field input{font:inherit;font-weight:400;padding:9px 10px;border:1px solid #c9cfdb;border-radius:8px}
.pg-status{min-height:1em;font-size:13px;color:#1F2A44;margin:0}
.pg-foot{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}
.pg-foot button{min-height:40px;padding:0 16px}
.pg-preview{max-width:100%;max-height:40vh;object-fit:contain;background:repeating-conic-gradient(#eee 0 25%,#fff 0 50%) 0 0/16px 16px;border-radius:8px}
.pg-pages{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;max-height:50vh;overflow:auto}
.pg-pages button{border:2px solid #d8dce5;border-radius:8px;background:#fff;padding:4px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer}
.pg-pages button.on{border-color:#B87333;box-shadow:0 0 0 2px #B8733355}
.pg-pages img{width:100%;aspect-ratio:3/4;object-fit:contain;background:#f4f5f8}
/* matching */
.pg-match{display:grid;grid-template-columns:1fr 300px;grid-template-rows:auto 1fr;gap:0;height:min(78vh,720px)}
.pg-hint{grid-column:1/-1;margin:0;padding:8px 14px;background:#eef1f7;color:#1F2A44;font-size:13.5px;border-bottom:1px solid #d8dce5}
.pg-hint b{color:#B87333}
.pg-link{border:0;background:#B87333;color:#fff;border-radius:14px;padding:3px 10px;margin-left:4px;font-size:12.5px;cursor:pointer}
.pg-tabs{display:none}
.pg-panes{display:grid;grid-template-columns:1fr 1fr;min-height:0}
.pg-pane{position:relative;min-height:0;border-right:1px solid #d8dce5}
.pg-cap{position:absolute;top:6px;left:6px;z-index:4;background:#1F2A44d9;color:#fff;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:4px;padding:2px 7px;pointer-events:none}
.pg-stage{position:absolute;inset:0;overflow:hidden;background:#e9ebf0;touch-action:none;cursor:crosshair}
.pg-stage img{position:absolute;left:0;top:0;transform-origin:0 0;user-select:none;-webkit-user-drag:none;pointer-events:none;box-shadow:0 1px 6px #0003;background:#fff;max-width:none}
#pgPins{position:absolute;inset:0;pointer-events:none}
.pg-zoom{position:absolute;right:6px;top:6px;z-index:4;display:flex;flex-direction:column;gap:4px}
.pg-zoom button{width:36px;height:36px;border-radius:8px;border:1px solid #c9cfdb;background:#fff;font-size:18px;color:#1F2A44;cursor:pointer}
.pg-mini{position:absolute;inset:0}
.pg-pin{position:absolute;transform:translate(-50%,-50%);width:24px;height:24px;border-radius:50%;background:#B87333;color:#fff;border:2px solid #fff;box-shadow:0 0 0 1.5px #1F2A44,0 2px 5px #0006;
  font:700 12px/20px system-ui,sans-serif;text-align:center}
.pg-pin.half{background:#fff;color:#B87333;border-color:#B87333}
.pg-pin.on{box-shadow:0 0 0 3px #1F2A44,0 2px 6px #0007}
.pg-pin.bad{background:#b3261e}
.pg-mpin{cursor:grab;top:0;left:0}
.pg-side{display:flex;flex-direction:column;gap:8px;padding:10px 12px;overflow:auto;min-height:0;grid-row:2;grid-column:2}
.pg-pairs table{width:100%;border-collapse:collapse;font-size:13px}
.pg-pairs th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#5b6475;text-align:left;border-bottom:1px solid #d8dce5;padding:3px 4px}
.pg-pairs td{padding:4px;border-bottom:1px solid #eef0f5;color:#1F2A44}
.pg-pairs tr{cursor:pointer}.pg-pairs tr.on td{background:#fbf3ea}.pg-pairs tr.bad td{color:#b3261e}
.pg-pairs button{border:0;background:transparent;color:#5b6475;cursor:pointer;min-width:30px;min-height:30px}
.pg-num{display:inline-block;width:20px;height:20px;border-radius:50%;background:#B87333;color:#fff;text-align:center;font-weight:700;font-size:11.5px;line-height:20px}
.pg-miss{color:#9aa3b5;font-size:12px}
.pg-res{white-space:nowrap;font-variant-numeric:tabular-nums}.pg-res small{display:block;color:#5b6475;font-size:11px}
.pg-fitrow{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#1F2A44}
.pg-fitrow select{font:inherit;padding:6px 8px;border-radius:6px;border:1px solid #c9cfdb;margin-left:6px}
.pg-rms{font-size:13px}.pg-rms b{color:#1F2A44}.pg-rms .pg-warn{display:block;color:#b3261e}.pg-rms small{color:#5b6475}
/* phone: Plan / Map tabs, list below */
@media (max-width:760px){
  .pg-match{display:flex;flex-direction:column;height:calc(100dvh - 52px)}
  .pg-tabs{display:flex;border-bottom:1px solid #d8dce5}
  .pg-tabs button{flex:1;min-height:42px;border:0;background:#fff;font-weight:700;color:#5b6475;border-bottom:3px solid transparent}
  .pg-tabs button[aria-selected=true]{color:#1F2A44;border-bottom-color:#B87333}
  .pg-panes{display:block;flex:1 1 52%;position:relative;min-height:240px}
  .pg-pane{position:absolute;inset:0;border:0;visibility:hidden}
  .pg-match[data-tab=plan] .pg-plan,.pg-match[data-tab=map] .pg-map{visibility:visible}
  .pg-side{flex:1 1 48%;padding:8px 10px calc(8px + env(safe-area-inset-bottom))}
  .pg-hint{font-size:13px;padding:7px 10px}
  .pg-foot{position:sticky;bottom:0;background:#fff;padding-top:6px}
  .pg-foot button{flex:1}
}
body.ga-mobile .pg-dialog{width:100vw;max-width:100vw}
@media (max-width:760px){
  .pg-match[data-tab=plan] .pg-map *,.pg-match[data-tab=map] .pg-plan *{visibility:hidden!important}
}