/* 1.7 «Проводник» (PLAN-1.7 M1): the whole tree on a wide screen, the open node beside it; one column on a phone. */
.prov .pmodes { margin-bottom:8px }
.pgrid { display:grid; grid-template-columns:minmax(260px, 360px) 1fr; gap:16px; align-items:start }
@media (max-width:820px) { .pgrid { grid-template-columns:1fr } }
.ptree { list-style:none; margin:0; padding:0 0 0 6px; border-left:2px solid var(--line) }
.pnode { display:flex; gap:10px; padding:8px 6px; margin-left:-13px; cursor:pointer; border-radius:10px }
.pnode:hover { background:var(--card) }
.pnode > div { display:flex; flex-direction:column; min-width:0 }
.pnode small { color:var(--muted) }
.pdot { flex:0 0 14px; height:14px; margin-top:3px; border-radius:50%; background:var(--card); border:2px dashed var(--muted) }
.pnode.filled .pdot { background:var(--ok); border:2px solid var(--ok) }
.pnode.undone .pdot { background:#f2c200; border-color:#f2c200 }   /* R-45d F05: skipped «Вода»/«Место» — amber, not the green filled check */
.pnode.open { background:var(--card); outline:2px solid var(--accent) }
.pnode.open .pdot { background:var(--accent); border:2px solid var(--accent) }
.pnode.future { opacity:.45 }
.pnode.collapsed { opacity:.6 }
.pnode.stale .pdot, .pnode.edited .pdot { background:#f2c200; border-color:#f2c200 }
.pnode.stale, .pnode.edited { background:rgba(242,194,0,.12) }
.pminis { display:flex; gap:4px; flex-wrap:wrap; margin-top:4px }
.pchips { display:flex; gap:6px; flex-wrap:wrap; margin:8px 0 }
.pchip { display:inline-flex; align-items:center; background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:999px; padding:4px 12px; font-size:13px; min-height:44px }
.pchip.on { background:var(--accent); color:var(--accentInk); border-color:var(--accent) }
.pdate { width:auto }
.pform { display:grid; grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); gap:8px }
.pgroup { margin:10px 0 4px; font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--muted) }
.pfork, .pcards { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:8px; margin:8px 0 }
.pbig { display:flex; flex-direction:column; align-items:flex-start; gap:4px; text-align:left; background:var(--card); color:var(--ink); border:1px solid var(--line); border-radius:12px; padding:12px }
.pbig.on { border-color:var(--accent); background:var(--accent); color:#fff }
.pbig.on small { color:rgba(255,255,255,.85) }
@media (prefers-color-scheme: dark) { .pbig.on { color:#06101a } .pbig.on small { color:rgba(6,16,26,.75) } }
.pbig small { color:var(--muted) }
.pvact { margin-top:12px }
.pvact button { min-height:44px }
.pcheck { display:flex; gap:6px; align-items:center; min-height:44px }
.pcheck input { width:24px; height:24px; min-width:24px; flex:0 0 24px; accent-color:var(--accent); margin:0 }
.ptiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; margin-bottom:10px }
.ptile { background:var(--card); border:1px solid var(--line); border-radius:12px; padding:10px; display:flex; flex-direction:column }
.ptile b { font-size:20px }
.ptile.pwarn b { color:var(--warn) }
.pfaded { opacity:.5 }
.pwarns { color:var(--warn); padding-left:18px }
.pquick { display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin:8px 0 }
.pbtns { display:grid; grid-template-columns:repeat(4, 1fr); gap:8px; margin-top:12px }
@media (max-width:520px) { .pbtns, .ptiles { grid-template-columns:repeat(2, 1fr) } }
.pdock { position:sticky; bottom:0; display:flex; flex-direction:column; gap:4px; padding:10px 0; background:var(--bg) }
.pdock button { min-height:44px }
.pwarnbtn { background:var(--warn) }
.pstale { border-color:#f2c200; background:rgba(242,194,0,.12) }
.pdiff { border-color:var(--ok); background:rgba(46,125,50,.08) }
.pup { color:var(--warn) } .pdown { color:var(--ok) }
.pdemo { background:rgba(120,80,200,.15); border-radius:10px; padding:8px 12px }
.plock { text-align:center }
/* M1-web2: first run, Профиль 1.7, Дайвлог 1.7, team node */
.pcards2 { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 8px; }
.pcardbtn { all: unset; cursor: pointer; }
.pcard { display: flex; flex-direction: column; gap: 2px; min-width: 200px; padding: 10px 14px; border-radius: 10px; background: linear-gradient(135deg, #0b4f6c, #1b8a9e); color: #fff; }
.pcard b { font-size: 1.05em; } .pcard small { opacity: .85; }
.pcardbig .pcard { min-width: 300px; padding: 22px; font-size: 1.25em; }
.ptoday { display: flex; flex-direction: column; gap: 4px; border-left: 4px solid #2e8b57; }
.ptoday > small:first-child { letter-spacing: .08em; font-weight: 600; color: #2e8b57; }
.pexport { align-items: center; gap: 8px; margin: 6px 0; }
.pteam .row { align-items: end; gap: 8px; }
.chip.warn, li.warn, small.warn { color: #b26a00; }
/* R-45c (owner 02.11.2026, round 2b): tap targets ≥44 px and the phone layout. */
.pstep button { min-height:44px; min-width:44px }
[data-pickback] { min-height:44px; padding:4px 12px }
@media (max-width:820px) {
  .pgrid { padding-bottom:76px }   /* F10: the sticky «Рассчитать план» dock never covers the last field (RMV на деко) */
  .prov .card h2.title { font-size:1.05rem; margin:0 0 4px }   /* Доп.2: the current-step field starts higher on a phone */
  .prov .card .pchips { margin:4px 0 }
  .prov .pform { gap:6px }
  /* R-45d F01: the mode bar on one row and the tree as a horizontal progress strip — the current step's first field starts ≤420 px. */
  .pmodes { margin-bottom:6px }
  .pmodes button { flex:1 1 0; min-width:0; padding:6px 4px; font-size:.82rem }
  .ptree { display:flex; flex-direction:row; gap:6px; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:2px 0 6px; border-left:0; border-bottom:2px solid var(--line) }
  .pnode { flex:0 0 auto; align-items:center; gap:6px; min-height:44px; padding:0 10px; margin-left:0; border-radius:999px }
  .pnode > div { flex-direction:row; align-items:center; gap:4px }
  .pnode small, .pnode .badge, .pminis { display:none }
  .pdot { margin-top:0 }
  .pcol, .pgrid > * { min-width:0 }   /* R-45d regression (found in round 2d): a flex .ptree stretched the 1fr column to 1027 px at 390 px */
}
/* R-50: the dive profile graph under the tiles — laptop: graph right of the totals; phone: below them. */
.psum { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:12px; align-items:start; margin-bottom:10px }
.psum .ptiles { margin-bottom:0 }
.pprofile { min-width:0 }
.pprofile .plgraph { width:100%; height:auto; min-height:200px }
.pprofile .pmark { fill:var(--accent); stroke:var(--bg); stroke-width:1 }
.pprofile text.pmark { fill:var(--accent); font-size:11px; font-weight:600 }
.pprofile .pshort { fill:var(--danger); stroke:var(--bg); stroke-width:1 }
.pprofile text.pshort { fill:var(--danger); font-size:11px; font-weight:600 }
@media (prefers-color-scheme: dark) { .pprofile .pshort, .pprofile text.pshort { fill:#ff9c9c } }
/* R-53a: the ten gas colours of the profile segments and the switch markers — one slot per cylinder in the order of first
   use (GAS_PALETTE in provodnik.js carries the same pairs for the legend chips); every pair ≥4.5:1 on the card in both themes. */
.pprofile .plgraph .gG0 { stroke:#2e7d32 } .pprofile .plgraph circle.gG0 { fill:#2e7d32 }
.pprofile .plgraph .gG1 { stroke:#6a1b9a } .pprofile .plgraph circle.gG1 { fill:#6a1b9a }
.pprofile .plgraph .gG2 { stroke:#bf360c } .pprofile .plgraph circle.gG2 { fill:#bf360c }
.pprofile .plgraph .gG3 { stroke:#00695c } .pprofile .plgraph circle.gG3 { fill:#00695c }
.pprofile .plgraph .gG4 { stroke:#4e342e } .pprofile .plgraph circle.gG4 { fill:#4e342e }
.pprofile .plgraph .gG5 { stroke:#ad1457 } .pprofile .plgraph circle.gG5 { fill:#ad1457 }
.pprofile .plgraph .gG6 { stroke:#283593 } .pprofile .plgraph circle.gG6 { fill:#283593 }
.pprofile .plgraph .gG7 { stroke:#827717 } .pprofile .plgraph circle.gG7 { fill:#827717 }
.pprofile .plgraph .gG8 { stroke:#455a64 } .pprofile .plgraph circle.gG8 { fill:#455a64 }
.pprofile .plgraph .gG9 { stroke:#00838f } .pprofile .plgraph circle.gG9 { fill:#00838f }
/* R-53a: the deco stops — a dot on every plateau; the «9 м · 3 мин» label (≥10 px — 10.5 px at the 390 px phone) sits under
   the plateau; a card-coloured halo keeps every label readable where it crosses the curve or the ceiling. */
.pprofile text.pstop { fill:var(--ink); font-size:10px; font-weight:600 }
.pprofile circle.pstopm { fill:var(--ink); stroke:var(--bg); stroke-width:1 }
.pprofile text.pmark, .pprofile text.pshort, .pprofile text.pstop { paint-order:stroke; stroke:var(--card); stroke-width:3; stroke-linejoin:round }
/* R-53a: the gas legend under the graph — flex-wrap, so at 390 px the chips wrap instead of overflowing the card. */
.pgasleg { display:flex; flex-wrap:wrap; gap:4px 14px; margin:4px 0 0; font-size:12px }
.pgasleg-i { display:inline-flex; align-items:center; white-space:nowrap }
.pgasleg .pgchip { width:10px; height:10px; border-radius:3px; background:var(--gc); margin-right:5px; flex:0 0 auto }
@media (prefers-color-scheme: dark) {
  .pprofile .plgraph .gG0 { stroke:#81c995 } .pprofile .plgraph circle.gG0 { fill:#81c995 }
  .pprofile .plgraph .gG1 { stroke:#ce93d8 } .pprofile .plgraph circle.gG1 { fill:#ce93d8 }
  .pprofile .plgraph .gG2 { stroke:#ffab91 } .pprofile .plgraph circle.gG2 { fill:#ffab91 }
  .pprofile .plgraph .gG3 { stroke:#80cbc4 } .pprofile .plgraph circle.gG3 { fill:#80cbc4 }
  .pprofile .plgraph .gG4 { stroke:#bcaaa4 } .pprofile .plgraph circle.gG4 { fill:#bcaaa4 }
  .pprofile .plgraph .gG5 { stroke:#f48fb1 } .pprofile .plgraph circle.gG5 { fill:#f48fb1 }
  .pprofile .plgraph .gG6 { stroke:#9fa8da } .pprofile .plgraph circle.gG6 { fill:#9fa8da }
  .pprofile .plgraph .gG7 { stroke:#d4e157 } .pprofile .plgraph circle.gG7 { fill:#d4e157 }
  .pprofile .plgraph .gG8 { stroke:#b0bec5 } .pprofile .plgraph circle.gG8 { fill:#b0bec5 }
  .pprofile .plgraph .gG9 { stroke:#4dd0e1 } .pprofile .plgraph circle.gG9 { fill:#4dd0e1 }
  .pgasleg .pgchip { background:var(--gcd) }
}
@media (max-width:820px) { .psum { grid-template-columns:1fr } }