/* Gas & Influx workspace — a Simulate mode with its own red accent.
   Scoped to .gws so nothing here can reach the landing page or the other
   simulators.

   Every surface, border, text and chart colour is the app's own theme token
   (card, soft, line, ink, muted, blue, green, amber, red), so
   the workspace is right in every theme instead of being a light island. The
   only colour it owns is the red identity accent, in a light and a dark form
   chosen for contrast on each family of themes. No decoration: nothing here is animated or shaded. */
.hydro-app .hw-simmode-b.gas{--gws-a:#a5202b;border-color:color-mix(in srgb,#a5202b 45%,var(--line));color:var(--gws-a)}
.hydro-app .hw-simmode-b.gas.on{background:#a5202b;border-color:#a5202b;color:#fff}
.hydro-app .hw-simmode-b.gas .gws-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:7px;vertical-align:middle}

/* ------------------------------------------------------------------ tokens */
.gws{
  /* identity accent: text/lines, and the filled form for primary buttons */
  --gws-a:#a5202b;--gws-a-fill:#a5202b;--gws-a-fg:#fff;
  --gws-a-soft:color-mix(in srgb,var(--gws-a) 10%,var(--card));
  --gws-a-line:color-mix(in srgb,var(--gws-a) 42%,var(--line));
  --gws-ink:var(--ink);--gws-dim:var(--muted);--gws-line:var(--line);
  --gws-card:var(--card);--gws-soft:var(--soft);--gws-bg:var(--bg);
  --gws-hair:color-mix(in srgb,var(--line) 70%,transparent);
  --gws-r:var(--radius,10px);
  --gws-ok:var(--green);--gws-warn:var(--amber);--gws-bad:var(--red);
  --gws-s1:var(--blue);--gws-s2:var(--green);--gws-s3:var(--accent2);--gws-s4:var(--gws-a);
  --gws-stick:0px;
  display:flex;flex-direction:column;gap:10px;min-width:0;color:var(--gws-ink);
  font-size:13px;line-height:1.45}
/* Dark themes take the lighter accent (6.2:1 on the deepwater card) and a
   deeper fill that keeps white button text at 5.3:1. */
:root:not([data-theme]) .gws,:root[data-theme="deepwater"] .gws,:root[data-theme="obsidian"] .gws,
:root[data-theme="pruitt"] .gws,:root[data-theme="offshore"] .gws{--gws-a:#f07a7e;--gws-a-fill:#c8323d}
:root:not([data-theme]) .hw-simmode-b.gas,:root[data-theme="deepwater"] .hw-simmode-b.gas,:root[data-theme="obsidian"] .hw-simmode-b.gas,
:root[data-theme="pruitt"] .hw-simmode-b.gas,:root[data-theme="offshore"] .hw-simmode-b.gas{--gws-a:#f07a7e}
.gws *{box-sizing:border-box}
/* The well name is an identifier, not an editorial heading: it stays in the
   app's control face rather than the serif the app gives page titles. */
.gws h2{margin:0;font-family:inherit;font-size:15px;font-weight:700!important;line-height:1.2;letter-spacing:-.01em}
.gws h3{margin:0 0 4px;font-size:15px;font-weight:700;line-height:1.25}
.gws h4{margin:14px 0 6px;font-size:13px;font-weight:700}
.gws p{margin:5px 0}
.gws b{font-weight:700}
.gws button:focus-visible,.gws input:focus-visible,.gws select:focus-visible,.gws a:focus-visible,.gws summary:focus-visible{
  outline:2px solid var(--blue);outline-offset:2px}

/* ------------------------------------------------------------------ header */
/* One compact row: identity, well, revision; quiet actions on the right. */
.gws-head{display:flex;gap:8px 14px;justify-content:space-between;align-items:center;flex-wrap:wrap;min-width:0;
  padding:6px 0 8px;border-bottom:1px solid var(--gws-line)}
.gws-headl{display:flex;gap:10px;align-items:center;min-width:0;flex:1 1 280px}
.gws-headl>i{flex:0 0 auto;width:9px;height:9px;border-radius:50%;background:var(--gws-a)}
.gws-headt{min-width:0}
.gws-badge{display:block;font-size:10px;font-weight:800;letter-spacing:.09em;color:var(--gws-a);line-height:1.2}
.gws-head h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gws-head p{margin:1px 0 0;color:var(--gws-dim);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gws-headr{display:flex;gap:6px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.gws-clocks{font-size:11.5px;color:var(--gws-dim);border:1px solid var(--gws-line);border-radius:999px;padding:5px 10px;background:var(--gws-soft);white-space:nowrap}
.gws-clocks b{color:var(--gws-ink)}
/* The three standalone tools live behind one quiet menu: reachable, never primary. */
.gws-tools{position:relative}
.gws-tools>summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:32px;
  padding:5px 10px;border:1px solid var(--gws-line);border-radius:var(--gws-r);background:transparent;color:var(--gws-dim);font-size:12px;font-weight:600}
.gws-tools>summary::-webkit-details-marker{display:none}
.gws-tools>summary::after{content:"";width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.gws-tools[open]>summary{border-color:var(--gws-dim);color:var(--gws-ink)}
.gws-toolsm{position:absolute;right:0;top:calc(100% + 6px);z-index:20;min-width:280px;max-width:min(360px,calc(100vw - 32px));
  display:grid;gap:6px;padding:10px;border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);box-shadow:var(--shadow-sm)}
.gws-toolsm .gws-btn{width:100%;text-align:left;justify-content:flex-start}
.gws-toolsm em{font-style:normal;font-size:11.5px;color:var(--gws-dim);line-height:1.4}

/* ----------------------------------------------------------------- buttons */
.gws-btn{cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;padding:6px 12px;
  border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);color:var(--gws-ink);font:inherit;font-weight:600;font-size:12.5px;line-height:1.2}
.gws-btn:hover:not(:disabled){border-color:var(--gws-dim)}
.gws-btn.primary{background:var(--gws-a-fill);border-color:var(--gws-a-fill);color:var(--gws-a-fg)}
.gws-btn.primary:hover:not(:disabled){border-color:var(--gws-ink)}
.gws-btn.danger{background:transparent;border-color:var(--gws-a);color:var(--gws-a)}
.gws-btn.quiet{background:transparent;color:var(--gws-dim)}
.gws-btn:disabled{opacity:.5;cursor:not-allowed}
.gws-link{background:none;border:0;padding:0;color:var(--gws-a);font:inherit;font-weight:600;cursor:pointer;text-decoration:underline}
.gws-linkb{justify-self:start;background:none;border:0;padding:6px 0;min-height:32px;color:var(--gws-dim);font:inherit;font-size:11.5px;text-decoration:underline;cursor:pointer}
.gws-linkb:hover{color:var(--gws-a)}

/* ----------------------------------------------------------------- stepper */
/* One line. Done is a tick, current is the accent, locked is dimmed and
   disabled; the stage's one-line purpose is the button's title, not a subtitle. */
.gws-rail{display:flex;gap:4px;list-style:none;margin:0;padding:0;min-width:0}
.gws-step{flex:1 1 0;min-width:0}
.gws-stepb{width:100%;display:flex;gap:8px;align-items:center;text-align:left;cursor:pointer;min-height:36px;
  padding:4px 8px;border:1px solid transparent;border-bottom:2px solid var(--gws-line);border-radius:var(--gws-r) var(--gws-r) 0 0;background:transparent;color:var(--gws-dim);font:inherit;font-size:12.5px;font-weight:600}
.gws-stepb>b{flex:0 0 auto;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;
  border:1px solid var(--gws-line);background:var(--gws-soft);color:var(--gws-dim);font-size:11px;font-weight:700}
.gws-stepb>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.25}
.gws-stepb:hover:not(:disabled){color:var(--gws-ink);border-bottom-color:var(--gws-dim)}
.gws-stepb:disabled{opacity:.45;cursor:not-allowed}
.gws-step.open .gws-stepb{color:var(--gws-ink)}
.gws-step.now .gws-stepb{color:var(--gws-ink);border-bottom-color:var(--gws-a);background:var(--gws-a-soft)}
.gws-step.now .gws-stepb>b{background:var(--gws-a-fill);border-color:var(--gws-a-fill);color:var(--gws-a-fg)}
.gws-step.done .gws-stepb{color:var(--gws-ink)}
.gws-step.done .gws-stepb>b{background:color-mix(in srgb,var(--gws-ok) 18%,var(--gws-card));border-color:color-mix(in srgb,var(--gws-ok) 50%,var(--gws-line));color:var(--gws-ok);font-size:0}
.gws-step.done .gws-stepb>b::after{content:"\2713";font-size:12px}

/* -------------------------------------------------------------------- body */
.gws-body{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:12px;align-items:start;min-width:0}
.gws-body.prep{grid-template-columns:minmax(0,1fr)}
.gws-body.review{grid-template-columns:minmax(420px,560px) minmax(0,1fr)}
.gws-panel,.gws-canvas{min-width:0}
.gws-panel{border:1px solid var(--gws-line);border-radius:var(--gws-r);padding:14px;background:var(--gws-card)}
.gws-canvas{display:flex;flex-direction:column;gap:8px}
.gws-canvas:empty{display:none}
.gws-fine{font-size:11.5px;color:var(--gws-dim);line-height:1.45}

.gws-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr));gap:6px;margin:8px 0}
.gws-kpis.tight{grid-template-columns:repeat(auto-fit,minmax(100px,1fr))}
.gws-kpis>div{background:var(--gws-soft);border:1px solid var(--gws-hair);border-radius:var(--gws-r);padding:7px 9px;min-width:0}
.gws-kpis span{display:block;font-size:10.5px;color:var(--gws-dim);line-height:1.25}
.gws-kpis b{font-size:15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.gws-kpis i{font-style:normal;font-size:10.5px;color:var(--gws-dim);font-weight:600}

/* Tables: the workspace's own header style, which must win over the app's
   generic `table th` (mono, uppercase, --soft background). */
.gws-table{width:100%;border-collapse:collapse;margin:8px 0;font-size:12px;border-color:var(--gws-hair)}
.gws-table caption{text-align:left;font-weight:700;padding-bottom:5px;color:var(--gws-ink)}
.gws-table th,.gws-table td{border:0;border-bottom:1px solid var(--gws-hair);padding:5px 7px;text-align:left;vertical-align:top;background:transparent}
.gws-table th{font-family:inherit;text-transform:none;letter-spacing:0;font-weight:600;color:var(--gws-dim);background:transparent}
.gws-table thead th{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;padding-bottom:4px}
.gws-table th[scope=row]{font-weight:600;width:44%}
.gws-table td{font-variant-numeric:tabular-nums;color:var(--gws-ink)}
.gws-table small{display:block;color:var(--gws-dim);font-weight:500}
.gws-table td i{font-style:normal;color:var(--gws-dim);font-size:11px}

.gws-fields{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;margin:8px 0}
.gws-fields label{font-size:11.5px;font-weight:600;color:var(--gws-dim);min-width:0}
.gws-fields input,.gws-fields select,.gws-field input,.gws-limit input,.gws-limit-record input{
  display:block;width:100%;min-height:36px;margin-top:4px;padding:7px 8px;border:1px solid var(--gws-line);border-radius:2px;
  background:var(--gws-soft);color:var(--gws-ink);font:inherit;font-weight:600}

/* Notices: a semantic left rule and a faint tint of the same colour on the
   card; the text stays --ink so it is legible in every theme. */
.gws-note,.gws-ok,.gws-invalid,.gws-warn,.gws-block,.gws-error,.gws-prog{
  border-radius:var(--gws-r);padding:9px 11px;margin:8px 0;font-size:12px;color:var(--gws-ink);
  border:1px solid var(--gws-hair);border-left:3px solid var(--gws-dim);background:var(--gws-soft)}
.gws-ok{border-left-color:var(--gws-ok);background:color-mix(in srgb,var(--gws-ok) 9%,var(--gws-card))}
.gws-ok>b,.gws-ok>h3{color:var(--gws-ok)}
.gws-invalid,.gws-warn{border-left-color:var(--gws-warn);background:color-mix(in srgb,var(--gws-warn) 10%,var(--gws-card))}
.gws-invalid>b,.gws-warn>b{color:color-mix(in srgb,var(--gws-warn) 80%,var(--gws-ink))}
.gws-block,.gws-error{border-left-color:var(--gws-a);background:var(--gws-a-soft)}
.gws-block>b,.gws-error>h3{color:var(--gws-a)}
.gws-error h3,.gws-note h3{margin:0 0 3px;font-size:13px}
.gws-invalid ul,.gws-warn ul,.gws-block ul,.gws-error ul,.gws-det ul{margin:5px 0 0;padding-left:18px}
.gws-error .gws-btn{margin:6px 0 2px}
.gws-prog progress{width:100%;height:10px;margin:6px 0;accent-color:var(--gws-a)}
.gws-prog h4{margin:0 0 4px}
.gws-det{margin:8px 0;font-size:12px}
.gws-det>summary{cursor:pointer;font-weight:700;min-height:28px;display:flex;align-items:center;gap:6px;list-style:none}
.gws-det>summary::-webkit-details-marker{display:none}
.gws-det>summary::before{content:"";flex:0 0 auto;width:5px;height:5px;border-right:1.5px solid var(--gws-dim);border-bottom:1.5px solid var(--gws-dim);transform:rotate(-45deg);margin-right:2px}
.gws-det[open]>summary::before{transform:rotate(45deg) translateY(-2px)}
.gws-det>summary small{font-weight:500;color:var(--gws-dim)}

.gws-choice{display:block;border:1px solid var(--gws-line);border-radius:var(--gws-r);padding:9px 10px;margin:6px 0;cursor:pointer;background:var(--gws-card)}
.gws-choice.on{border-color:var(--gws-a);background:var(--gws-a-soft);box-shadow:inset 0 0 0 1px var(--gws-a-line)}
.gws-choice input{margin:0 8px 0 0;accent-color:var(--gws-a-fill);vertical-align:-1px}
.gws-choice b{font-size:12.5px}
.gws-choice small{display:block;color:var(--gws-dim);margin:3px 0}
.gws-choice ul{margin:5px 0 0;padding-left:18px;font-size:11.5px;color:var(--gws-dim)}
.gws-next{margin-top:12px;border-top:1px solid var(--gws-hair);padding-top:10px;display:flex;gap:8px 12px;align-items:center;flex-wrap:wrap}
.gws-next .gws-fine{margin:0}
.gws-actions{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}

/* ------------------------------------------------------------------ canvas */
.gws-viewbar{display:flex;gap:4px;align-items:center;flex-wrap:wrap}
.gws-view{cursor:pointer;min-height:32px;padding:5px 11px;border:1px solid var(--gws-line);border-radius:999px;background:transparent;font:inherit;font-size:12px;font-weight:600;color:var(--gws-dim)}
.gws-view:hover:not(:disabled){color:var(--gws-ink);border-color:var(--gws-dim)}
.gws-view.on{background:var(--gws-a-fill);border-color:var(--gws-a-fill);color:var(--gws-a-fg)}
.gws-view:disabled{opacity:.5;cursor:not-allowed}
.gws-viewnote{font-size:11.5px;color:var(--gws-dim);margin-left:auto}

/* The well and the solved pressure share one depth axis and take the larger
   share; the plots stack beneath before the row gets narrower than the axis
   labels can read. */
.gws-stage-wrap{display:grid;grid-template-columns:minmax(400px,1.45fr) minmax(0,1fr);gap:10px;align-items:start;min-width:0}
.gws-well{border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);padding:8px}
.gws-svg{width:100%;height:auto;font-size:10.5px;display:block}
.gws-svg .gws-bore{fill:color-mix(in srgb,var(--blue) 16%,var(--gws-card));stroke:color-mix(in srgb,var(--blue) 45%,var(--gws-line));stroke-width:.6}
.gws-svg .gws-pipe{fill:color-mix(in srgb,var(--ink) 38%,var(--gws-card));stroke:color-mix(in srgb,var(--ink) 55%,var(--gws-card));stroke-width:.6}
.gws-svg .gws-pipeid{fill:var(--gws-card)}
.gws-svg .gws-gas{fill:var(--gws-a);stroke:none}
.gws-svg .gws-planned{fill:none;stroke:var(--gws-a);stroke-width:1.4;stroke-dasharray:5 4}
.gws-svg .gws-mark line{stroke:var(--gws-dim);stroke-width:1;stroke-dasharray:4 3}
.gws-svg .gws-mark.cursor line{stroke:var(--gws-a);stroke-width:1.6;stroke-dasharray:none}
.gws-svg .gws-mark text{fill:var(--gws-ink);font-size:9.5px;paint-order:stroke;stroke:var(--gws-card);stroke-width:3px;stroke-linejoin:round}
.gws-svg .gws-mark .gws-lead{stroke:var(--gws-dim);stroke-width:.8;stroke-dasharray:none}
.gws-svg .gws-tick{stroke:var(--gws-line);stroke-width:1}
.gws-svg .gws-axmd{fill:var(--gws-dim)}.gws-svg .gws-axtvd{fill:var(--gws-dim);text-anchor:end}
.gws-svg .gws-axhead{fill:var(--gws-dim);font-size:9.5px;font-weight:700;letter-spacing:.04em}
.gws-svg .gws-axhead:nth-of-type(2){text-anchor:end}
.gws-svg .gws-axhead:nth-of-type(3){text-anchor:middle}
.gws-legend{display:flex;gap:6px 9px;align-items:center;flex-wrap:wrap;font-size:11px;color:var(--gws-dim);padding:6px 4px 0}
.gws-legend .k{width:11px;height:11px;border-radius:3px;display:inline-block;margin-right:-3px}
.gws-legend .k.bore{background:color-mix(in srgb,var(--blue) 16%,var(--gws-card));border:1px solid color-mix(in srgb,var(--blue) 45%,var(--gws-line))}
.gws-legend .k.pipe{background:color-mix(in srgb,var(--ink) 38%,var(--gws-card))}
.gws-legend .k.pipeid{background:var(--gws-card);border:1px solid var(--gws-line)}
.gws-legend .k.gas{background:var(--gws-a)}
.gws-legend .k.planned{border:1.5px dashed var(--gws-a)}
.gws-well .gws-fine{margin:6px 4px 0}

.gws-plots{display:flex;flex-direction:column;gap:6px;min-width:0}
.gws-chart{margin:0;border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);padding:6px 8px;min-width:0}
.gws-chart figcaption{font-size:11px;font-weight:700;color:var(--gws-dim);display:flex;gap:6px;align-items:baseline;flex-wrap:wrap}
.gws-chart figcaption i{font-style:normal;color:var(--gws-dim);font-weight:500}
.gws-chart figcaption b{margin-left:auto;font-weight:600;color:var(--gws-ink);font-variant-numeric:tabular-nums}
.gws-chart svg{width:100%;height:auto;display:block}
.gws-lgd{font-weight:600;padding-left:13px;position:relative;color:var(--gws-ink)}
.gws-lgd::before{content:"";position:absolute;left:0;top:.45em;width:9px;height:3px;border-radius:2px}
.gws-lgd.a::before{background:var(--gws-s1)}.gws-lgd.b::before{background:var(--gws-s2)}
.gws-lgd.c::before{background:var(--gws-s3)}.gws-lgd.d::before{background:var(--gws-s4)}
.gws-line{fill:none;stroke-width:1.8}
.gws-line.a{stroke:var(--gws-s1)}.gws-line.b{stroke:var(--gws-s2)}.gws-line.c{stroke:var(--gws-s3)}.gws-line.d{stroke:var(--gws-s4)}
.gws-frame{fill:none;stroke:var(--gws-line);stroke-width:1}
.gws-cursor{stroke:var(--gws-a);stroke-width:1.4;stroke-dasharray:3 3}
.gws-axv{fill:var(--gws-dim);font-size:9.5px;text-anchor:end}
.gws-axt{fill:var(--gws-dim);font-size:9.5px}.gws-axt.end{text-anchor:end}

.gws-inspect{border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);padding:10px 12px;grid-column:1/-1}
.gws-inspect h4{margin:0 0 6px}
.gws-inspect-slider{display:block;font-size:11.5px;font-weight:600;color:var(--gws-dim)}
.gws-inspect-slider input{width:100%;margin-top:6px;accent-color:var(--gws-a-fill)}

.gws-timeline:empty{display:none}
.gws-tl{border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);padding:8px 12px;display:flex;gap:10px 12px;align-items:center;flex-wrap:wrap}
.gws-tlbtns{display:flex;gap:4px;align-items:center}
.gws-tlbtns .gws-btn{min-width:36px;padding:6px 8px}
.gws-spd{min-height:32px;padding:5px 8px;border:1px solid var(--gws-line);border-radius:2px;background:var(--gws-soft);color:var(--gws-ink);font:inherit;font-weight:600;font-size:12px}
.gws-tlwrap{position:relative;flex:1 1 260px;min-width:200px}
.gws-scrub{width:100%;accent-color:var(--gws-a-fill);margin:0}
.gws-evts{position:relative;height:16px;margin-top:-2px}
/* Each marker is a solved event. The button is 22 px for the finger; the dot is 10 px for the eye. */
.gws-evt{position:absolute;top:-3px;width:22px;height:22px;margin-left:-11px;padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer}
.gws-evt::after{content:"";position:absolute;left:6px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--gws-a);border:2px solid var(--gws-card)}
.gws-tlread{font-size:11.5px;color:var(--gws-dim);flex:1 1 200px}
.gws-tlread b{color:var(--gws-ink);font-size:13.5px;font-variant-numeric:tabular-nums}

/* Operating limits in Review: a blank limit must look blank, never green. */
.gws-limits{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:8px 0}
.gws-limit{border:1px solid var(--gws-hair);border-radius:var(--gws-r);padding:8px;background:var(--gws-card);min-width:0}
.gws-limit>label{display:block;font-size:11.5px;font-weight:600;color:var(--gws-dim)}
.gws-limit .gws-limit-src{margin-top:6px;font-weight:500}
.gws-limit-record{display:block;font-size:11.5px;font-weight:600;color:var(--gws-dim)}
.gws-limit-record input{font-weight:500}
.gws-table tr.gws-check-not_assessed{background:color-mix(in srgb,var(--gws-warn) 10%,transparent)}
.gws-table tr.gws-check-exceeded{background:color-mix(in srgb,var(--gws-a) 12%,transparent)}
.gws-table td small{display:block;color:var(--gws-dim);font-weight:500}

/* ------------------------------------------------- the assisted preparation */
/* Preparation is the common case on a real well, so it takes the whole width:
   the findings with their evidence and repair choices on the left, and one
   sticky card on the right that carries the state and the primary action. */
.gws-prep{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:0 16px;align-items:start;padding:0;background:transparent;border:0}
.gws-prep-main{min-width:0;border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);padding:14px}
.gws-prep-head{display:flex;gap:6px 14px;align-items:baseline;flex-wrap:wrap;margin-bottom:6px}
.gws-prep-head h3{margin:0}
.gws-prep-head .gws-fine{margin:0;flex:1 1 320px}
.gws-findings{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:10px;align-items:start;margin-top:8px}
.gws-prep-side{position:sticky;top:calc(var(--gws-stick) + 8px);min-width:0}
.gws-prep-card{display:grid;gap:8px;border:1px solid var(--gws-line);border-radius:var(--gws-r);background:var(--gws-card);padding:12px}
.gws-prep-card .gws-btn{width:100%}
.gws-prep-card .gws-fine{margin:0}
.gws-prep-card .gws-next{margin:0;border:0;padding:0}
.gws-prep-status{border-left:3px solid var(--gws-warn);padding:2px 0 2px 10px}
.gws-prep-status.ok{border-left-color:var(--gws-ok)}
.gws-prep-status.bad{border-left-color:var(--gws-a)}
.gws-prep-status b{display:block;font-size:13.5px;line-height:1.3}
.gws-prep-status p{margin:3px 0 0;font-size:12px;color:var(--gws-dim)}
.gws-prep-foot{margin-top:10px;padding-top:8px;border-top:1px solid var(--gws-hair)}
.gws-prep-foot .gws-fine{margin:4px 0}
.gws-prep-foot .gws-det{margin:6px 0 0}
.gws-prep-foot .gws-det p{margin:4px 0}

/* A finding is a small dossier: what is wrong, the rows that say so, and the
   ways out. */
.gws-finding{border:1px solid var(--gws-line);border-left:3px solid var(--gws-dim);border-radius:var(--gws-r);padding:10px 12px;margin:0;background:var(--gws-card);min-width:0}
.gws-finding.sev-blocking{border-left-color:var(--gws-a)}
.gws-finding.sev-material{border-left-color:var(--gws-warn)}
.gws-finding.chosen{border-left-color:var(--gws-ok)}
.gws-finding>header{display:flex;gap:8px 10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.gws-finding h4{margin:0;font-size:13.5px;line-height:1.3}
.gws-finding>p{color:var(--gws-dim);font-size:12px;margin:5px 0 0}
.gws-chip{flex:0 0 auto;font-size:10px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  padding:3px 7px;border-radius:999px;border:1px solid transparent;white-space:nowrap;line-height:1.2}
.gws-sev-block{background:var(--gws-a-soft);border-color:var(--gws-a-line);color:var(--gws-a)}
.gws-sev-material{background:color-mix(in srgb,var(--gws-warn) 12%,var(--gws-card));border-color:color-mix(in srgb,var(--gws-warn) 45%,var(--gws-line));color:color-mix(in srgb,var(--gws-warn) 80%,var(--gws-ink))}
.gws-sev-note{background:var(--gws-soft);border-color:var(--gws-line);color:var(--gws-dim)}
.gws-sev-ok{background:color-mix(in srgb,var(--gws-ok) 12%,var(--gws-card));border-color:color-mix(in srgb,var(--gws-ok) 45%,var(--gws-line));color:var(--gws-ok)}
.gws-ev{margin:8px 0 0;font-size:11.5px}
.gws-ev caption{font-size:11.5px;color:var(--gws-dim);font-weight:600}
.gws-ev th[scope=col]{font-size:10px}
.gws-ev th[scope=row]{width:1%;min-width:150px;white-space:nowrap}
.gws-ev th,.gws-ev td{padding:4px 6px}
.gws-evwrap{margin-top:8px}
.gws-evwrap>summary{font-size:12px}
.gws-repairs{margin-top:8px;display:grid;gap:6px}
.gws-repairs>span{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gws-dim)}
.gws-repairs .gws-choice{margin:0}
/* Basis and cost as a two-column strip: label column fixed, text beside it. */
.gws-repairs .gws-why{display:grid;grid-template-columns:78px minmax(0,1fr);gap:2px 8px;margin-top:5px;font-size:11.5px;font-weight:500;line-height:1.4;color:var(--gws-dim)}
.gws-repairs .gws-why i{font-style:normal;font-weight:700;color:var(--gws-ink);font-size:11px;padding-top:1px}
.gws-repairs .gws-why small{display:block;margin:0;font-size:inherit;color:inherit}

/* What the run is standing on, carried to every stage after the repair. */
.gws-assume{border-left:3px solid var(--gws-ok);padding:6px 10px;margin:0 0 10px;border-radius:0 var(--gws-r) var(--gws-r) 0;background:color-mix(in srgb,var(--gws-ok) 6%,var(--gws-card))}
.gws-assume ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}
.gws-assume li{padding-left:10px;border-left:2px solid color-mix(in srgb,var(--gws-ok) 40%,var(--gws-line))}
.gws-assume li b{font-size:12px}
.gws-assume li small{display:block;color:var(--gws-dim);font-size:11.5px;font-weight:500;margin-top:1px}
.gws-assume .gws-fine{margin:6px 0 2px}

/* A field that says where its number came from. */
.gws-field{display:block;font-size:11.5px;font-weight:600;color:var(--gws-dim);min-width:0}
.gws-fieldhead{display:flex;gap:6px;align-items:center;justify-content:space-between}
.gws-field .gws-chip{font-size:9.5px;padding:2px 6px}
.gws-src-saved{background:color-mix(in srgb,var(--blue) 12%,var(--gws-card));border-color:color-mix(in srgb,var(--blue) 45%,var(--gws-line));color:var(--blue)}
.gws-src-derived{background:color-mix(in srgb,var(--gws-ok) 12%,var(--gws-card));border-color:color-mix(in srgb,var(--gws-ok) 45%,var(--gws-line));color:var(--gws-ok)}
.gws-src-proposed{background:color-mix(in srgb,var(--gws-warn) 12%,var(--gws-card));border-color:color-mix(in srgb,var(--gws-warn) 45%,var(--gws-line));color:color-mix(in srgb,var(--gws-warn) 80%,var(--gws-ink))}
.gws-src-entered{background:var(--gws-soft);border-color:var(--gws-line);color:var(--gws-dim)}
.gws-why{display:block;margin-top:5px;font-size:11px;font-weight:500;line-height:1.45;color:var(--gws-dim)}
.gws-why i{font-style:normal;font-weight:700;color:var(--gws-ink)}

/* The envelope, evaluated on the frame on screen. */
.gws-live-lim td{font-variant-numeric:tabular-nums}
.gws-live-lim td small{display:block;color:var(--gws-dim);font-size:10.5px;font-weight:500}
.gws-live-lim th[scope=row]{width:36%}
.gws-lim-over{background:color-mix(in srgb,var(--gws-a) 12%,transparent)}
.gws-lim-close{background:color-mix(in srgb,var(--gws-warn) 10%,transparent)}
.gws-lim-none th[scope=row],.gws-lim-none td{color:var(--gws-dim)}

/* The pressure panel, on the same depth axis as the hole. */
.gws-pplot{fill:var(--gws-soft);stroke:var(--gws-hair)}
.gws-pcurve{fill:none;stroke:var(--gws-a);stroke-width:2;stroke-linejoin:round}
.gws-plim circle{stroke:var(--gws-card);stroke-width:1.5}
.gws-plim.frac circle{fill:var(--gws-bad)}
.gws-plim.pore circle{fill:var(--blue)}
.gws-plim text{font-size:9.5px;fill:var(--gws-dim)}
.gws-paxis{font-size:10px;fill:var(--gws-dim)}
.gws-empty{font-size:11px;fill:var(--gws-dim);text-anchor:middle}
.gws-pplate{fill:var(--gws-soft)}
/* A body whose diameter was substituted: solved diameter filled, recorded blade
   diameter outlined around it, so the substitution is visible not described. */
.gws-blade{fill:none;stroke:var(--gws-a);stroke-width:1;stroke-dasharray:3 2;opacity:.75}
.gws-pipe.sub{opacity:.9}
.gws-legend .k.pcurve{background:var(--gws-a)}
.gws-legend .k.frac{background:var(--gws-bad);border-radius:50%}
.gws-legend .k.pore{background:var(--blue);border-radius:50%}
.gws-legend .k.blade{background:transparent;border:1px dashed var(--gws-a)}

/* --------------------------------------------------------------- responsive */
/* The well drawing and the plots stop sharing a row before the drawing gets
   narrower than its own axis labels; the controls keep their column longer. */
@media(max-width:1340px){
  .gws-stage-wrap{grid-template-columns:1fr}
}
@media(max-width:1100px){
  .gws-body{grid-template-columns:1fr}
  .gws-body.review{grid-template-columns:1fr}
  .gws-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  /* The action card becomes a compact strip pinned above the findings. */
  .gws-prep{display:flex;flex-direction:column;align-items:stretch;gap:8px}
  .gws-prep-side{order:-1;position:sticky;top:var(--gws-stick);z-index:5}
  .gws-prep-card{grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:6px 10px;padding:8px 10px}
  .gws-prep-card .gws-btn{width:auto}
  .gws-prep-card>.gws-fine.why{grid-column:1/-1;margin-top:-2px}
  .gws-prep-status{padding:0 0 0 10px}
  .gws-prep-status p{display:none}
}
@media(max-width:1024px),(pointer:coarse){
  .gws-btn,.gws-view,.gws-stepb,.gws-spd,.gws-tools>summary,.gws-linkb,.gws-det>summary{min-height:40px}
  .gws-tlbtns .gws-btn{min-width:40px}
  .gws-link{display:inline-block;padding:10px 0}
  .gws-evt{width:36px;height:36px;margin-left:-18px;top:-10px}
  .gws-evt::after{left:13px;top:13px}
  .gws-evts{height:22px}
  .gws-scrub{height:36px}
  .gws-choice{padding:11px 10px}
  .gws-fields input,.gws-fields select,.gws-field input,.gws-limit input,.gws-limit-record input{min-height:40px}
}
@media(max-width:640px){
  .gws-rail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gws-fields{grid-template-columns:1fr}
  .gws-limits{grid-template-columns:1fr}
  .gws-head{align-items:flex-start}
  .gws-headl{flex-basis:100%}
  .gws-headr{width:100%;justify-content:flex-start}
  .gws-viewnote{margin-left:0;flex-basis:100%}
  .gws-tl{gap:8px}
  .gws-kpis b{font-size:14px}
  .gws-panel,.gws-prep-main{padding:11px}
  .gws-finding{padding:10px}
  .gws-prep-card{grid-template-columns:minmax(0,1fr);padding:8px 10px}
  .gws-prep-card .gws-btn{width:100%}
  .gws-stage-wrap{grid-template-columns:minmax(0,1fr)}
  .gws-prep-head .gws-fine{flex-basis:100%}
  /* Evidence is a table of real columns; on a phone it scrolls inside its own
     box rather than widening the page. */
  .gws-ev,.gws-live-lim{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .gws-ev caption,.gws-live-lim caption{position:sticky;left:0}
  .gws-ev th,.gws-ev td,.gws-live-lim th,.gws-live-lim td{white-space:nowrap}
  .gws-live-lim th[scope=row]{white-space:normal;width:auto;min-width:110px}
  .gws-live-lim .gws-chip{padding:2px 6px}
  .gws-repairs .gws-why{grid-template-columns:1fr}
}

/* Two actions side by side in an error or note: primary first. */
.gws-error .gws-row{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}

/* fluid closures: solubility source, measured table */
.gws-seg{display:flex;flex-wrap:wrap;border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:6px 0}
.gws-seg button{flex:1 1 auto;min-height:34px;border:0;border-right:1px solid var(--line);background:transparent;color:var(--ink);font:inherit;font-size:12.5px;font-weight:600;padding:4px 10px;cursor:pointer}
.gws-seg button:last-child{border-right:0}
.gws-seg button.on{background:var(--gws-a-fill);color:var(--gws-a-fg)}
.gws-seg button:focus-visible{outline:2px solid var(--gws-a);outline-offset:2px}
.gws-area{display:grid;gap:4px;margin-top:6px;font-size:12px}
.gws-area textarea{width:100%;font:12px ui-monospace,monospace;border:1px solid var(--line);border-radius:8px;padding:6px 8px;background:var(--card);color:var(--ink)}
.gws-sub{margin:18px 0 4px;font-size:13px;font-weight:650;color:var(--ink)}
.gws-choice{display:grid;gap:5px;margin:10px 0 4px}
.gws-choice-l{font-size:12px;font-weight:600;color:var(--muted)}
.gws-choice small{font-size:11.5px;line-height:1.4;color:var(--muted)}
.gws-choice .gws-seg button{white-space:normal;line-height:1.25}
.gws-choice .gws-seg button{flex:1 1 0}
.gws-suggest{border:1px solid var(--line);border-left:3px solid var(--blue);border-radius:8px;background:var(--card);padding:10px 12px;margin:0 0 12px;font-size:12.5px}
.gws-suggest>b{display:block;margin-bottom:6px;color:var(--ink)}
.gws-suggest-item{display:grid;gap:4px;padding:8px 0;border-top:1px solid var(--line)}
.gws-suggest-item span{font-weight:600;color:var(--ink)}
.gws-suggest-item small{color:var(--muted);line-height:1.4}
.gws-suggest-item .gws-btn{justify-self:start}
