@charset "UTF-8";
/* Temperature control (Arctic Sun) module: the drawn water circuit and the temperature chart. Colours carry meaning and
   are named in the legends: patient temperature (red-orange), target (dashed), water (blue), Work to Cool (blue / orange). */
.ttm {
  --tm-cold: #2f6fd0; --tm-warm: #c8352b; --tm-patient: #d4561c; --tm-water: #2f6fd0; --tm-set: #5b6472;
  --tm-core2: #8247c9; --tm-work: #4f86d9; --tm-work-high: #e07b12; --tm-pad: #7cc4c9;
  --tm-induction: rgba(47, 111, 208, .09); --tm-maintenance: rgba(35, 136, 90, .08); --tm-rewarm: rgba(200, 53, 43, .07);
  --tm-normothermia: rgba(196, 138, 0, .08); --tm-off: rgba(91, 100, 114, .12);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ttm { --tm-cold: #6ea4ff; --tm-warm: #ff6b5e; --tm-patient: #ff8a4c; --tm-water: #6ea4ff; --tm-set: #c3c9d3; --tm-core2: #b98cff; --tm-work: #6ea4ff; --tm-work-high: #ffa43a; --tm-pad: #4fa3a8; }
}
:root[data-theme="dark"] .ttm { --tm-cold: #6ea4ff; --tm-warm: #ff6b5e; --tm-patient: #ff8a4c; --tm-water: #6ea4ff; --tm-set: #c3c9d3; --tm-core2: #b98cff; --tm-work: #6ea4ff; --tm-work-high: #ffa43a; --tm-pad: #4fa3a8; }

.ttm .h3d-stage-wrap, .ttm .h3d-info { min-width: 0; }
.ttm-panel { overflow-x: auto; border: 1px solid var(--line); border-top: 4px solid var(--ink); border-radius: 6px; background: var(--surface); }
.ttm svg text { fill: var(--ink); paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }

/* Water circuit */
.tm-svg { display: block; width: 100%; min-width: 720px; height: auto; font-family: inherit; }
.tm-title { font-size: 15px; font-weight: 700; }
.tm-label { font-size: 14px; font-weight: 600; }
.tm-small { font-size: 12.5px; fill: var(--ink-2) !important; }
.tm-sensor-t { font-size: 13px; font-weight: 700; }
.tm-box { fill: none; stroke: var(--line-strong); stroke-width: 1.5; stroke-dasharray: 6 5; }
.tm-tank, .tm-unit, .tm-screen, .tm-pump, .tm-sensor, .tm-manifold { fill: var(--surface); stroke: var(--ink-2); stroke-width: 2; }
.tm-water-fill { fill: var(--tm-water); opacity: .25; }
.tm-jack { fill: var(--surface); stroke: var(--ink-2); stroke-width: 2; }
.tm-jack.is-out { stroke-dasharray: 3 2; }
.tm-port { stroke: var(--ink-2); stroke-width: 1.5; }
.tm-track, .tm-flow { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.tm-track { stroke-width: 9; opacity: .16; stroke: var(--ink-2); }
.tm-flow { stroke-width: 6; stroke-dasharray: 0 14; animation: tm-move 1.1s linear infinite; }
@keyframes tm-move { to { stroke-dashoffset: -14; } }
.tm-is-cool .tm-flow { stroke: var(--tm-cold); }
.tm-is-warm .tm-flow { stroke: var(--tm-warm); }
.tm-is-neutral .tm-flow { stroke: var(--ink-2); }
.tm-is-stopped .tm-flow { display: none; }
.tm-is-stopped .tm-rotor { animation: none; }
.tm-rotor { stroke: var(--ink-2); stroke-width: 3; animation: tm-spin 2.4s linear infinite; }
@keyframes tm-spin { to { transform: rotate(360deg); } }
.is-paused .tm-flow, .is-paused .tm-rotor { animation-play-state: paused; }
@media (prefers-reduced-motion: reduce) { .tm-flow, .tm-rotor { animation: none; } .tm-flow { stroke-dasharray: none; opacity: .7; } }
.tm-body circle, .tm-body rect { fill: var(--bg); stroke: var(--line-strong); stroke-width: 1.5; }
.tm-pad { fill: var(--tm-pad); fill-opacity: .55; stroke: var(--tm-pad); stroke-width: 2; }
.tm-probe { fill: var(--tm-patient); }
.tm-signal path { fill: none; stroke: var(--tm-patient); stroke-width: 1.5; stroke-dasharray: 5 4; }
.tm-signal .tm-signal-2 { stroke: var(--tm-core2); }
.tm-signal .is-hidden { display: none; }
.tm-part { cursor: pointer; }
.tm-hit { fill: transparent; stroke: none; }
.tm-part:hover .tm-hit { fill: var(--accent-soft); }
.tm-part.is-selected .tm-hit { fill: var(--accent-soft); stroke: var(--accent); stroke-width: 2; stroke-dasharray: 5 4; }
.tm-part.is-highlight .tm-hit { stroke: var(--accent); stroke-width: 2.5; }
.tm-part.is-alert .tm-hit { fill: var(--danger-bg); stroke: var(--danger); stroke-width: 2.5; }

/* Temperature chart */
.tc-svg { display: block; width: 100%; min-width: 640px; height: auto; font-family: inherit; touch-action: pan-y pinch-zoom; cursor: crosshair; }
.tc-svg:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.tc-band-induction { fill: var(--tm-induction); } .tc-band-maintenance { fill: var(--tm-maintenance); } .tc-band-rewarm { fill: var(--tm-rewarm); }
.tc-band-normothermia { fill: var(--tm-normothermia); } .tc-band-off { fill: var(--tm-off); }
.tc-band-label { font-size: 13px; font-weight: 700; }
.tc-grid { stroke: var(--line); stroke-width: 1; }
.tc-hour { stroke: var(--line); stroke-width: 1; stroke-dasharray: 2 4; }
.tc-tick { font-size: 12px; fill: var(--ink-2) !important; }
.tc-axis-label { font-size: 13px; font-weight: 650; }
.tc-line { fill: none; stroke-linejoin: round; stroke-linecap: round; }
.tc-patient { stroke: var(--tm-patient); stroke-width: 3.5; }
.tc-core2 { stroke: var(--tm-core2); stroke-width: 2; stroke-dasharray: 2 3; }
.tc-set { stroke: var(--tm-set); stroke-width: 2; stroke-dasharray: 7 5; }
.tc-water { stroke: var(--tm-water); stroke-width: 2.5; }
.tc-bar-base { fill: var(--tm-work); } .tc-bar-high { fill: var(--tm-work-high); } .tc-bar-grey { fill: var(--line-strong); opacity: .5; }
.tc-threshold { stroke: var(--tm-work-high); stroke-width: 1.5; stroke-dasharray: 6 4; }
.tc-threshold-label { font-size: 12px; fill: var(--ink-2) !important; }
.tc-limit { fill: var(--danger); opacity: .55; }
.tc-mark line { stroke: var(--danger); stroke-width: 1.5; stroke-dasharray: 3 3; }
.tc-mark text { font-size: 12.5px; font-weight: 700; fill: var(--danger) !important; }
.tc-cursor line { stroke: var(--ink); stroke-width: 1.5; }
.tc-dot-patient { fill: var(--tm-patient); stroke: var(--surface); stroke-width: 2; }
.tc-dot-water { fill: var(--tm-water); stroke: var(--surface); stroke-width: 2; }
.tc-hit { fill: transparent; }

.ttm-k-patient { background: var(--tm-patient); } .ttm-k-set { background: repeating-linear-gradient(90deg, var(--tm-set) 0 6px, transparent 6px 10px); }
.ttm-k-water { background: var(--tm-water); } .ttm-k-core2 { background: repeating-linear-gradient(90deg, var(--tm-core2) 0 3px, transparent 3px 6px); }
.ttm-k-work { background: var(--tm-work); } .ttm-k-work-high { background: var(--tm-work-high); } .ttm-k-limit { background: var(--danger); opacity: .6; }
.ttm-k-work-grey { background: var(--line-strong); opacity: .5; } .ttm-k-band { background: var(--tm-maintenance); outline: 1px solid var(--line); }
.ttm-k-signal { background: repeating-linear-gradient(90deg, var(--tm-patient) 0 5px, transparent 5px 9px); } .ttm-k-signal2 { background: repeating-linear-gradient(90deg, var(--tm-core2) 0 5px, transparent 5px 9px); }
.ttm-k-cold { background: var(--tm-cold); } .ttm-k-warm { background: var(--tm-warm); } .ttm-k-pad { background: var(--tm-pad); }

.ttm-readout { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px 14px; margin: 10px 0 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.ttm-readout div { min-width: 0; }
.ttm-readout dt { font-size: 12.5px; color: var(--muted); }
.ttm-readout dd { margin: 0; font-weight: 650; font-variant-numeric: tabular-nums; }
.ttm-alarm { margin: 8px 0 0; padding: 8px 12px; border-radius: 6px; border: 1px solid var(--warn-line); background: var(--warn-bg); color: var(--warn-ink); font-weight: 600; }
.ttm-sim { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px 14px; margin: 10px 0 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.ttm-sim select { width: 100%; }
.ttm-sim-note { grid-column: 1 / -1; margin: 0; font-size: 13px; color: var(--muted); }
.ttm-table-wrap { overflow-x: auto; margin: 8px 0; }
table.ttm-table { border-collapse: collapse; width: 100%; min-width: 520px; font-size: 14px; }
/* Two-column tables (phase and point) fit a phone: no minimum width, the first column does not wrap. */
table.ttm-table.is-narrow { min-width: 0; }
table.ttm-table.is-narrow th[scope="row"] { white-space: nowrap; }
.ttm-table th, .ttm-table td { border: 1px solid var(--line); padding: 6px 8px; text-align: left; vertical-align: top; }
.ttm-table caption { text-align: left; font-weight: 650; margin-bottom: 4px; }
.ttm-sec { margin: 14px 0 4px; font-size: 15px; }
.ttm-model-note { margin: 6px 0 0; font-size: 13px; color: var(--muted); }
/* On a narrow screen the chart scrolls sideways inside its box: a swipe scrolls it, a tap moves the cursor. */
@media (max-width: 1100px) { .tc-svg { touch-action: pan-x pan-y pinch-zoom; } }
/* Nursing pages: one card per heading in the wide column. */
.ttm-notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px, 100%), 1fr)); align-items: start; gap: 10px; margin-top: 10px; }
.ttm-notes-title { grid-column: 1 / -1; margin: 4px 0 0; font-size: 16px; }
.ttm-notes .ttm-card { border: 1px solid var(--line); border-radius: 6px; background: var(--surface); padding: 4px 14px 10px; }
.ttm-notes .ttm-card .ttm-sec { margin-top: 8px; }
.ttm-notes .ttm-card p { margin: 6px 0; }

/* Phase colours in tables: induction fades from neutral to blue, maintenance is blue, rewarming turns to a warm brick
   red (not pure red). Text colours keep readable contrast on the page background; the band uses deeper fills with
   white text in both themes. */
.ttm {
  --ph-start: #5f6b80; --ph-blue: #2a62c2; --ph-warm: #b5513a; --ph-ind-ink: #3f5f96;
  --band-start: #5f6b80; --band-blue: #2f66c8; --band-warm: #b9553d;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .ttm { --ph-start: #a3aebf; --ph-blue: #8ab6ff; --ph-warm: #f2987d; --ph-ind-ink: #aec4e6; }
}
:root[data-theme="dark"] .ttm { --ph-start: #a3aebf; --ph-blue: #8ab6ff; --ph-warm: #f2987d; --ph-ind-ink: #aec4e6; }

.ttm-table .ttm-band-row td { border: 0; padding: 0; }
.ttm-table .ttm-band-row td.ttm-band { color: #fff; font-size: 13px; font-weight: 700; text-align: center; padding: 6px 8px; white-space: nowrap; }
.ttm-table .ttm-band.ph-ind { background: linear-gradient(90deg, var(--band-start), var(--band-blue)); border-radius: 6px 0 0 6px; }
.ttm-table .ttm-band.ph-main { background: var(--band-blue); }
.ttm-table .ttm-band.ph-rew { background: linear-gradient(90deg, var(--band-blue), var(--band-warm)); border-radius: 0 6px 6px 0; }

/* Column headers and cells under each phase take its colour. */
.ttm-table th.ph-ind span { background: linear-gradient(90deg, var(--ph-start), var(--ph-blue)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ttm-table th.ph-main { color: var(--ph-blue); }
.ttm-table th.ph-rew span { background: linear-gradient(90deg, var(--ph-blue), var(--ph-warm)); -webkit-background-clip: text; background-clip: text; color: transparent; }
/* Fallback where text clipping is not supported: plain phase colours. */
@supports not ((-webkit-background-clip: text) or (background-clip: text)) { .ttm-table th.ph-ind span { color: var(--ph-ind-ink); } .ttm-table th.ph-rew span { color: var(--ph-warm); } }
.ttm-table td.ph-ind { color: var(--ph-ind-ink); }
.ttm-table td.ph-main { color: var(--ph-blue); }
.ttm-table td.ph-rew { color: var(--ph-warm); }
/* Two-column phase tables: the phase name in the first column and a colour stripe on its left. */
.ttm-table tr.ph-ind > th { color: var(--ph-ind-ink); box-shadow: inset 4px 0 0 var(--ph-start); }
.ttm-table tr.ph-main > th { color: var(--ph-blue); box-shadow: inset 4px 0 0 var(--ph-blue); }
.ttm-table tr.ph-rew > th { color: var(--ph-warm); box-shadow: inset 4px 0 0 var(--ph-warm); }
/* Printing drops background images, which would leave the gradient headers blank: print them in plain colours. */
@media print { .ttm-table th.ph-ind span { background: none; color: var(--ph-ind-ink); } .ttm-table th.ph-rew span { background: none; color: var(--ph-warm); } }