/* สร้างโดย teachkit/figures/p5-water-tower/build.mjs — แก้ที่นั่นแล้ว build ใหม่ ห้ามแก้ไฟล์นี้ตรง ๆ */
.tk-iso{
  --anatomy-page:#0b0b0b;--anatomy-card:#131313;--anatomy-text:#a3a3a3;--anatomy-strong:#e6e6e6;--anatomy-muted:#6e6e6e;
  --anatomy-paper:#131313;--anatomy-face:#1b1b1b;--anatomy-top:#1c1c1c;
  --anatomy-shade-0:#0f0f0f;--anatomy-shade-1:#121212;--anatomy-shade-2:#151515;--anatomy-shade-3:#181818;
  --anatomy-lit-top:#262626;--anatomy-lit-shade:#1d1d1d;
  --anatomy-hi:#d4d4d4;--anatomy-mid:#6a6a6a;--anatomy-lo:#3e3e3e;--anatomy-faint:#2a2a2a;--anatomy-lit:#ffffff;
  --anatomy-halo:#050505;--anatomy-halo-opacity:.9;--anatomy-dot:#e6e6e6;
  --anatomy-red:#ff6b6b;--anatomy-green:#6be0a0;--anatomy-blue:#6b9bff;
  --anatomy-weight:.6px;--anatomy-ease:cubic-bezier(.32,.72,0,1);
  --anatomy-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --anatomy-lift:inset 0 1px 0 0 #ffffff0a,inset 0 0 0 1px #ffffff06,0 0 0 1px #00000026,0 1px 1px -.5px #00000014,0 3px 3px -1.5px #00000014,0 6px 6px -3px #00000014,0 12px 12px -6px #00000014;

  --anatomy-page:#f2f2ef;--anatomy-card:#fbfbfa;--anatomy-text:#57575a;--anatomy-strong:#18181a;--anatomy-muted:#8c8c90;
  --anatomy-paper:#fbfbfa;--anatomy-face:#ffffff;--anatomy-top:#ffffff;
  --anatomy-shade-0:#dcdcd9;--anatomy-shade-1:#e5e5e2;--anatomy-shade-2:#ededea;--anatomy-shade-3:#f4f4f1;
  --anatomy-lit-top:#ffffff;--anatomy-lit-shade:#eeeeeb;
  --anatomy-hi:#26262a;--anatomy-mid:#8a8a8f;--anatomy-lo:#b4b4b8;--anatomy-faint:#d4d4d6;--anatomy-lit:#000000;
  --anatomy-halo:#8a8a80;--anatomy-halo-opacity:.32;--anatomy-dot:#3a3a3e;
  --anatomy-red:#e5484d;--anatomy-green:#30a46c;--anatomy-blue:#3e63dd;
  --anatomy-lift:inset 0 1px 0 0 #ffffff,0 0 0 1px #0000000f,0 1px 1px -.5px #0000000a,0 3px 3px -1.5px #0000000a,0 6px 6px -3px #0000000a,0 12px 12px -6px #0000000a;
--anatomy-paper:var(--bg-c);--anatomy-card:var(--bg-c);--anatomy-face:#fff;--anatomy-top:#fff}
[data-theme="dark"] .tk-iso{
  --anatomy-page:#0b0b0b;--anatomy-card:#131313;--anatomy-text:#a3a3a3;--anatomy-strong:#e6e6e6;--anatomy-muted:#6e6e6e;
  --anatomy-paper:#131313;--anatomy-face:#1b1b1b;--anatomy-top:#1c1c1c;
  --anatomy-shade-0:#0f0f0f;--anatomy-shade-1:#121212;--anatomy-shade-2:#151515;--anatomy-shade-3:#181818;
  --anatomy-lit-top:#262626;--anatomy-lit-shade:#1d1d1d;
  --anatomy-hi:#d4d4d4;--anatomy-mid:#6a6a6a;--anatomy-lo:#3e3e3e;--anatomy-faint:#2a2a2a;--anatomy-lit:#ffffff;
  --anatomy-halo:#050505;--anatomy-halo-opacity:.9;--anatomy-dot:#e6e6e6;
  --anatomy-red:#ff6b6b;--anatomy-green:#6be0a0;--anatomy-blue:#6b9bff;
  --anatomy-weight:.6px;--anatomy-ease:cubic-bezier(.32,.72,0,1);
  --anatomy-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --anatomy-lift:inset 0 1px 0 0 #ffffff0a,inset 0 0 0 1px #ffffff06,0 0 0 1px #00000026,0 1px 1px -.5px #00000014,0 3px 3px -1.5px #00000014,0 6px 6px -3px #00000014,0 12px 12px -6px #00000014;
--anatomy-paper:var(--bg-c);--anatomy-card:var(--bg-c);--anatomy-face:#243247;--anatomy-top:#27364c;--anatomy-shade-0:#172131;--anatomy-shade-1:#1a2537;--anatomy-shade-2:#1e2a3d;--anatomy-shade-3:#223044;--anatomy-lit-top:#2e3e58;--anatomy-lit-shade:#26344c;--anatomy-hi:#d7dee8;--anatomy-mid:#7b8ba4;--anatomy-lo:#4b5c76;--anatomy-faint:#35455d;--anatomy-halo:#0a1020;--anatomy-dot:#dbe3ee}



.iso-svg{display:block;width:100%;height:auto;overflow:visible}
.iso-svg path,.iso-svg circle{vector-effect:non-scaling-stroke}
.iso-fill{fill:var(--anatomy-paper);stroke:none}
.iso-solid[data-lit]>.iso-fill{fill:var(--anatomy-face)}
.iso-shade,.iso-top{stroke:none}
.iso-shade[data-shade="0"]{fill:var(--anatomy-shade-0)}
.iso-shade[data-shade="1"]{fill:var(--anatomy-shade-1)}
.iso-shade[data-shade="2"]{fill:var(--anatomy-shade-2)}
.iso-shade[data-shade="3"]{fill:var(--anatomy-shade-3)}
.iso-top{fill:var(--anatomy-top)}
.iso-solid[data-lit]>.iso-top{fill:var(--anatomy-lit-top)}
.iso-solid[data-lit]>.iso-shade{fill:var(--anatomy-lit-shade)}
.iso-solid[data-seamless]>.iso-shade,.iso-solid[data-seamless]>.iso-top{stroke-width:.4;stroke-linejoin:round}
.iso-solid[data-seamless]>.iso-shade[data-shade="0"]{stroke:var(--anatomy-shade-0)}
.iso-solid[data-seamless]>.iso-shade[data-shade="1"]{stroke:var(--anatomy-shade-1)}
.iso-solid[data-seamless]>.iso-shade[data-shade="2"]{stroke:var(--anatomy-shade-2)}
.iso-solid[data-seamless]>.iso-shade[data-shade="3"]{stroke:var(--anatomy-shade-3)}
.iso-solid[data-seamless]>.iso-top{stroke:var(--anatomy-top)}
.iso-solid[data-seamless][data-lit]>.iso-top{stroke:var(--anatomy-lit-top)}
.iso-solid[data-seamless][data-lit]>.iso-shade{stroke:var(--anatomy-lit-shade)}
.iso-solid[data-lit]>.iso-edge{stroke:var(--anatomy-lit)}
.iso-halo{fill:var(--anatomy-halo);stroke:none;filter:blur(9px);opacity:var(--anatomy-halo-opacity);transform:translateY(3px)}
.iso-line{fill:none;stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight);stroke-linecap:round;stroke-linejoin:round}
.iso-line[data-tone="hi"]{stroke:var(--anatomy-hi)}
.iso-line[data-tone="mid"]{stroke:var(--anatomy-mid)}
.iso-line[data-tone="lo"]{stroke:var(--anatomy-lo)}
.iso-line[data-tone="faint"]{stroke:var(--anatomy-faint)}
.iso-line[data-tone="lit"]{stroke:var(--anatomy-lit)}
.iso-line[data-tone="red"]{stroke:var(--anatomy-red)}
.iso-line[data-tone="green"]{stroke:var(--anatomy-green)}
.iso-line[data-tone="blue"]{stroke:var(--anatomy-blue)}
.iso-line[data-dotted]{stroke-dasharray:.01 3.5;stroke-width:1}
.iso-line[data-dashed]{stroke-dasharray:3 3}
.iso-line[data-flow]{stroke-dasharray:2 6}
.iso-wire-end{fill:var(--anatomy-paper);stroke:var(--anatomy-lo);stroke-width:var(--anatomy-weight)}
.iso-wire[data-tone="hi"] .iso-wire-end{stroke:var(--anatomy-hi)}
.iso-wire[data-tone="mid"] .iso-wire-end{stroke:var(--anatomy-mid)}
.iso-wire[data-tone="faint"] .iso-wire-end{stroke:var(--anatomy-faint)}
.iso-wire[data-tone="lit"] .iso-wire-end{stroke:var(--anatomy-lit)}
.iso-dots circle{fill:var(--anatomy-dot);stroke:none;opacity:.32}
.iso-dots[data-tone="hi"] circle{opacity:.85}
.iso-dots[data-tone="mid"] circle{opacity:.45}
.iso-dots[data-tone="lo"] circle{opacity:.22}
.iso-dots[data-tone="faint"] circle{opacity:.12}
.iso-face-text{fill:var(--anatomy-mid);font-family:var(--anatomy-mono);letter-spacing:.04em}
.iso-face-text[data-tone="hi"]{fill:var(--anatomy-hi)}
.iso-face-text[data-tone="lo"]{fill:var(--anatomy-lo)}
.iso-face-text[data-tone="faint"]{fill:var(--anatomy-faint)}
.tb-body{fill:var(--anatomy-shade-2);stroke:none}
.tb-shine{fill:var(--anatomy-top);stroke:none}
.tb-shade{fill:var(--anatomy-shade-0);stroke:none}
.tb-ring{fill:none;stroke:var(--anatomy-lo);stroke-width:.45;stroke-linecap:butt;stroke-linejoin:round}
.tb-ring[data-tone="mid"]{stroke:var(--anatomy-mid)}
.tb-ring[data-tone="faint"]{stroke:var(--anatomy-faint)}
.tb-ring[data-tone="hi"]{stroke:var(--anatomy-hi)}
@keyframes iso-flow{to{stroke-dashoffset:-32}}
@keyframes iso-pulse{0%,100%{opacity:.18}12%{opacity:1}40%{opacity:.18}}
.iso-line[data-flow]{animation:iso-flow 1600ms linear infinite}
.iso-dots circle[data-pulse]{animation:iso-pulse 1600ms steps(1,end) infinite;animation-delay:var(--pulse-at,0ms)}
.iso-figure{margin:32px 0 36px}
.iso-plate{position:relative;padding:52px 24px;border-radius:0;background:var(--anatomy-card);box-shadow:0 0 0 1px var(--anatomy-mid);--anatomy-paper:var(--anatomy-card)}
.iso-plate-corners{position:absolute;inset:18px 20px;pointer-events:none}
.iso-plate-corner{position:absolute;color:var(--anatomy-muted);font-family:var(--anatomy-mono);font-size:10.5px;line-height:1;letter-spacing:.04em;white-space:nowrap}
.iso-plate-corner[data-corner="fig"]{top:0;left:0;color:var(--anatomy-text)}
.iso-plate-corner[data-corner="title"]{top:0;right:0;text-transform:uppercase;letter-spacing:.1em}
.iso-plate-corner[data-corner="hint"]{bottom:0;left:0;text-transform:uppercase;letter-spacing:.1em}
.iso-plate-corner[data-corner="readout"]{right:0;bottom:0;color:var(--anatomy-text);font-variant-numeric:tabular-nums}
.iso-plate .iso-svg{margin:0 auto}
.iso-legend{display:grid;gap:8px;margin-top:12px;color:var(--anatomy-muted);font-size:13px;line-height:1.55}
.iso-keys{display:flex;flex-wrap:wrap;gap:6px 18px}
.iso-key{display:inline-flex;align-items:center;gap:7px}
.iso-swatch{width:16px;height:10px;flex:none;overflow:visible}
.iso-swatch path{fill:none;stroke:var(--anatomy-hi);stroke-width:1;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.iso-swatch[data-mark="raised"] path,.iso-swatch[data-mark="flat"] path{stroke:var(--anatomy-mid)}
.iso-swatch[data-mark="lit"] path{stroke:var(--anatomy-lit)}
.iso-swatch[data-mark="dim"] path{stroke:var(--anatomy-lo)}
.iso-swatch[data-mark="dotted"] path{stroke-dasharray:.01 3;stroke-width:1.4}
.iso-swatch[data-mark="dashed"] path{stroke-dasharray:3 2.5}
.iso-swatch[data-mark="red"] path{stroke:var(--anatomy-red)}
.iso-swatch[data-mark="green"] path{stroke:var(--anatomy-green)}
.iso-swatch[data-mark="blue"] path{stroke:var(--anatomy-blue)}
.iso-swatch-crease{stroke:var(--anatomy-lo)!important}
@media (max-width:560px){.iso-plate{padding:48px 12px 70px}.iso-plate-corner[data-corner="hint"]{bottom:18px}}
@media (prefers-reduced-motion:reduce){.iso-line[data-flow],.iso-dots circle[data-pulse]{animation:none}}

.iso-live{--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.iso-live [data-mat]{--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.iso-live [data-lit]{--tn-0:var(--anatomy-lit-shade);--tn-1:var(--anatomy-lit-shade);--tn-2:var(--anatomy-lit-shade);--tn-3:var(--anatomy-lit-shade);--tn-4:var(--anatomy-lit-top)}
.iso-tn{stroke-width:.4;stroke-linejoin:round;--ta:var(--tn-0);--tb:var(--tn-1);fill:color-mix(in srgb,var(--ta) calc(100% - var(--f,0) * 100%),var(--tb));stroke:color-mix(in srgb,var(--ta) calc(100% - var(--f,0) * 100%),var(--tb))}
.iso-tn[data-b="1"]{--ta:var(--tn-1);--tb:var(--tn-2)}
.iso-tn[data-b="2"]{--ta:var(--tn-2);--tb:var(--tn-3)}
.iso-tn[data-b="3"]{--ta:var(--tn-3);--tb:var(--tn-4)}
[data-mat="gold"]{--anatomy-paper:#3f3521;--anatomy-face:#4b3f28;--anatomy-top:#5a4c31;--anatomy-shade-0:#2b2416;--anatomy-shade-1:#352c1b;--anatomy-shade-2:#3f3521;--anatomy-shade-3:#4b3f28;--anatomy-lit-top:#6a5a3b;--anatomy-lit-shade:#4f4329;--anatomy-hi:#e6d2a3;--anatomy-mid:#8a7550;--anatomy-lo:#5e4e33;--anatomy-faint:#463a26;--anatomy-dot:#e6d2a3;--anatomy-lit:#fff3d6;--mat-body:#4a3e27;--mat-shine:#8c7853;--mat-shade:#251f13;--mat-edge:#e6d2a3}
.tk-iso [data-mat="gold"]{--anatomy-paper:#d3bb88;--anatomy-face:#e4d2a8;--anatomy-top:#f1e5c6;--anatomy-shade-0:#a1844f;--anatomy-shade-1:#bc9f69;--anatomy-shade-2:#d3bb88;--anatomy-shade-3:#e4d2a8;--anatomy-lit-top:#f8efd8;--anatomy-lit-shade:#dfcb9c;--anatomy-hi:#4b3920;--anatomy-mid:#86693f;--anatomy-lo:#a98c5b;--anatomy-faint:#c1a676;--anatomy-dot:#4a381f;--anatomy-lit:#2a1d0c;--mat-body:#cdb07a;--mat-shine:#f3e8cc;--mat-shade:#8e7044;--mat-edge:#4b3920}
[data-theme="dark"] .tk-iso [data-mat="gold"]{--anatomy-paper:#3f3521;--anatomy-face:#4b3f28;--anatomy-top:#5a4c31;--anatomy-shade-0:#2b2416;--anatomy-shade-1:#352c1b;--anatomy-shade-2:#3f3521;--anatomy-shade-3:#4b3f28;--anatomy-lit-top:#6a5a3b;--anatomy-lit-shade:#4f4329;--anatomy-hi:#e6d2a3;--anatomy-mid:#8a7550;--anatomy-lo:#5e4e33;--anatomy-faint:#463a26;--anatomy-dot:#e6d2a3;--anatomy-lit:#fff3d6;--mat-body:#4a3e27;--mat-shine:#8c7853;--mat-shade:#251f13;--mat-edge:#e6d2a3}
[data-mat="chrome"]{--anatomy-paper:#2a2e32;--anatomy-face:#4a5056;--anatomy-top:#6e757c;--anatomy-shade-0:#2e3236;--anatomy-shade-1:#24272b;--anatomy-shade-2:#1a1d20;--anatomy-shade-3:#4a5056;--anatomy-lit-top:#848b92;--anatomy-lit-shade:#3a3f44;--anatomy-hi:#dfe3e7;--anatomy-mid:#7c838a;--anatomy-lo:#4d5359;--anatomy-faint:#363b40;--anatomy-dot:#e4e7ea;--anatomy-lit:#ffffff;--mat-body:#34393e;--mat-shine:#9aa1a8;--mat-shade:#16191b;--mat-edge:#dfe3e7}
.tk-iso [data-mat="chrome"]{--anatomy-paper:#8e959c;--anatomy-face:#c3c8cd;--anatomy-top:#f7f8f9;--anatomy-shade-0:#a2a9b0;--anatomy-shade-1:#6f767d;--anatomy-shade-2:#454b52;--anatomy-shade-3:#cacfd4;--anatomy-lit-top:#ffffff;--anatomy-lit-shade:#bcc2c8;--anatomy-hi:#202428;--anatomy-mid:#585e65;--anatomy-lo:#878d94;--anatomy-faint:#a9afb5;--anatomy-dot:#2a2e33;--anatomy-lit:#000000;--mat-body:#8b9299;--mat-shine:#fbfcfd;--mat-shade:#3c4248;--mat-edge:#202428}
[data-theme="dark"] .tk-iso [data-mat="chrome"]{--anatomy-paper:#2a2e32;--anatomy-face:#4a5056;--anatomy-top:#6e757c;--anatomy-shade-0:#2e3236;--anatomy-shade-1:#24272b;--anatomy-shade-2:#1a1d20;--anatomy-shade-3:#4a5056;--anatomy-lit-top:#848b92;--anatomy-lit-shade:#3a3f44;--anatomy-hi:#dfe3e7;--anatomy-mid:#7c838a;--anatomy-lo:#4d5359;--anatomy-faint:#363b40;--anatomy-dot:#e4e7ea;--anatomy-lit:#ffffff;--mat-body:#34393e;--mat-shine:#9aa1a8;--mat-shade:#16191b;--mat-edge:#dfe3e7}
[data-mat="steel"]{--anatomy-paper:#2c3034;--anatomy-face:#34393d;--anatomy-top:#3e4348;--anatomy-shade-0:#1f2225;--anatomy-shade-1:#25292c;--anatomy-shade-2:#2c3034;--anatomy-shade-3:#34393d;--anatomy-lit-top:#4a5056;--anatomy-lit-shade:#33383c;--anatomy-hi:#d0d4d8;--anatomy-mid:#727980;--anatomy-lo:#4a5056;--anatomy-faint:#33383d;--anatomy-dot:#d8dce0;--anatomy-lit:#ffffff;--mat-body:#30353a;--mat-shine:#5c6369;--mat-shade:#1a1d20;--mat-edge:#d0d4d8}
.tk-iso [data-mat="steel"]{--anatomy-paper:#b8bdc1;--anatomy-face:#cdd1d4;--anatomy-top:#e5e8ea;--anatomy-shade-0:#8f959b;--anatomy-shade-1:#a4aaaf;--anatomy-shade-2:#b8bdc1;--anatomy-shade-3:#cdd1d4;--anatomy-lit-top:#f1f3f4;--anatomy-lit-shade:#c6cacd;--anatomy-hi:#2b2f33;--anatomy-mid:#6b7177;--anatomy-lo:#959ba1;--anatomy-faint:#aeb3b8;--anatomy-dot:#33373b;--anatomy-lit:#000000;--mat-body:#b3b8bd;--mat-shine:#eef0f2;--mat-shade:#7d8389;--mat-edge:#2b2f33}
[data-theme="dark"] .tk-iso [data-mat="steel"]{--anatomy-paper:#2c3034;--anatomy-face:#34393d;--anatomy-top:#3e4348;--anatomy-shade-0:#1f2225;--anatomy-shade-1:#25292c;--anatomy-shade-2:#2c3034;--anatomy-shade-3:#34393d;--anatomy-lit-top:#4a5056;--anatomy-lit-shade:#33383c;--anatomy-hi:#d0d4d8;--anatomy-mid:#727980;--anatomy-lo:#4a5056;--anatomy-faint:#33383d;--anatomy-dot:#d8dce0;--anatomy-lit:#ffffff;--mat-body:#30353a;--mat-shine:#5c6369;--mat-shade:#1a1d20;--mat-edge:#d0d4d8}
[data-mat="gunmetal"]{--anatomy-paper:#1d2125;--anatomy-face:#22272b;--anatomy-top:#2a2f34;--anatomy-shade-0:#15181b;--anatomy-shade-1:#191c20;--anatomy-shade-2:#1d2125;--anatomy-shade-3:#22272b;--anatomy-lit-top:#323840;--anatomy-lit-shade:#20252a;--anatomy-hi:#a9b0b7;--anatomy-mid:#5c636a;--anatomy-lo:#3a4046;--anatomy-faint:#2a2f34;--anatomy-dot:#b8bec4;--anatomy-lit:#ffffff;--mat-body:#1f2327;--mat-shine:#3a4046;--mat-shade:#111316;--mat-edge:#a9b0b7}
.tk-iso [data-mat="gunmetal"]{--anatomy-paper:#444a51;--anatomy-face:#50575e;--anatomy-top:#5f666e;--anatomy-shade-0:#2f3439;--anatomy-shade-1:#393f45;--anatomy-shade-2:#444a51;--anatomy-shade-3:#50575e;--anatomy-lit-top:#6d757d;--anatomy-lit-shade:#4b5258;--anatomy-hi:#0f1113;--anatomy-mid:#1d2125;--anatomy-lo:#272b30;--anatomy-faint:#30353a;--anatomy-dot:#b0b5ba;--anatomy-lit:#000000;--mat-body:#3d4349;--mat-shine:#6e757c;--mat-shade:#24282c;--mat-edge:#0f1113}
[data-theme="dark"] .tk-iso [data-mat="gunmetal"]{--anatomy-paper:#1d2125;--anatomy-face:#22272b;--anatomy-top:#2a2f34;--anatomy-shade-0:#15181b;--anatomy-shade-1:#191c20;--anatomy-shade-2:#1d2125;--anatomy-shade-3:#22272b;--anatomy-lit-top:#323840;--anatomy-lit-shade:#20252a;--anatomy-hi:#a9b0b7;--anatomy-mid:#5c636a;--anatomy-lo:#3a4046;--anatomy-faint:#2a2f34;--anatomy-dot:#b8bec4;--anatomy-lit:#ffffff;--mat-body:#1f2327;--mat-shine:#3a4046;--mat-shade:#111316;--mat-edge:#a9b0b7}
[data-mat="rubber"]{--anatomy-paper:#121213;--anatomy-face:#161618;--anatomy-top:#1c1c1f;--anatomy-shade-0:#0c0c0d;--anatomy-shade-1:#0f0f10;--anatomy-shade-2:#121213;--anatomy-shade-3:#161618;--anatomy-lit-top:#232327;--anatomy-lit-shade:#141416;--anatomy-hi:#8c8e92;--anatomy-mid:#4a4c50;--anatomy-lo:#2c2d30;--anatomy-faint:#1f2023;--anatomy-dot:#9a9ca0;--anatomy-lit:#ffffff;--mat-body:#131315;--mat-shine:#2b2c30;--mat-shade:#0a0a0b;--mat-edge:#8c8e92}
.tk-iso [data-mat="rubber"]{--anatomy-paper:#2a2b2e;--anatomy-face:#34363a;--anatomy-top:#46484d;--anatomy-shade-0:#1b1c1e;--anatomy-shade-1:#222326;--anatomy-shade-2:#2a2b2e;--anatomy-shade-3:#34363a;--anatomy-lit-top:#55575c;--anatomy-lit-shade:#2f3134;--anatomy-hi:#070708;--anatomy-mid:#111214;--anatomy-lo:#18191b;--anatomy-faint:#1f2023;--anatomy-dot:#6a6c70;--anatomy-lit:#000000;--mat-body:#27282b;--mat-shine:#5b5d62;--mat-shade:#121314;--mat-edge:#050506}
[data-theme="dark"] .tk-iso [data-mat="rubber"]{--anatomy-paper:#121213;--anatomy-face:#161618;--anatomy-top:#1c1c1f;--anatomy-shade-0:#0c0c0d;--anatomy-shade-1:#0f0f10;--anatomy-shade-2:#121213;--anatomy-shade-3:#161618;--anatomy-lit-top:#232327;--anatomy-lit-shade:#141416;--anatomy-hi:#8c8e92;--anatomy-mid:#4a4c50;--anatomy-lo:#2c2d30;--anatomy-faint:#1f2023;--anatomy-dot:#9a9ca0;--anatomy-lit:#ffffff;--mat-body:#131315;--mat-shine:#2b2c30;--mat-shade:#0a0a0b;--mat-edge:#8c8e92}
[data-mat="brass"]{--anatomy-paper:#3d3017;--anatomy-face:#49391c;--anatomy-top:#574523;--anatomy-shade-0:#2a210f;--anatomy-shade-1:#332813;--anatomy-shade-2:#3d3017;--anatomy-shade-3:#49391c;--anatomy-lit-top:#66522b;--anatomy-lit-shade:#45371b;--anatomy-hi:#e9cf8a;--anatomy-mid:#8e7438;--anatomy-lo:#5e4c25;--anatomy-faint:#44371c;--anatomy-dot:#e9cf8a;--anatomy-lit:#fff0c8;--mat-body:#433419;--mat-shine:#8a6f36;--mat-shade:#21190b;--mat-edge:#e9cf8a}
.tk-iso [data-mat="brass"]{--anatomy-paper:#bd9646;--anatomy-face:#d2ad5b;--anatomy-top:#e6c87e;--anatomy-shade-0:#8a6a2c;--anatomy-shade-1:#a47f38;--anatomy-shade-2:#bd9646;--anatomy-shade-3:#d2ad5b;--anatomy-lit-top:#f0d796;--anatomy-lit-shade:#c8a252;--anatomy-hi:#3f2e0e;--anatomy-mid:#765a24;--anatomy-lo:#9a7a3c;--anatomy-faint:#b08c46;--anatomy-dot:#3a2a0c;--anatomy-lit:#1f1606;--mat-body:#b8913f;--mat-shine:#efd795;--mat-shade:#7d5f26;--mat-edge:#3f2e0e}
[data-theme="dark"] .tk-iso [data-mat="brass"]{--anatomy-paper:#3d3017;--anatomy-face:#49391c;--anatomy-top:#574523;--anatomy-shade-0:#2a210f;--anatomy-shade-1:#332813;--anatomy-shade-2:#3d3017;--anatomy-shade-3:#49391c;--anatomy-lit-top:#66522b;--anatomy-lit-shade:#45371b;--anatomy-hi:#e9cf8a;--anatomy-mid:#8e7438;--anatomy-lo:#5e4c25;--anatomy-faint:#44371c;--anatomy-dot:#e9cf8a;--anatomy-lit:#fff0c8;--mat-body:#433419;--mat-shine:#8a6f36;--mat-shade:#21190b;--mat-edge:#e9cf8a}
[data-mat="copper"]{--anatomy-paper:#3d1f13;--anatomy-face:#492617;--anatomy-top:#582e1c;--anatomy-shade-0:#2a160d;--anatomy-shade-1:#331a10;--anatomy-shade-2:#3d1f13;--anatomy-shade-3:#492617;--anatomy-lit-top:#673722;--anatomy-lit-shade:#432215;--anatomy-hi:#eaa985;--anatomy-mid:#8f5236;--anatomy-lo:#5f3624;--anatomy-faint:#45271a;--anatomy-dot:#eaa985;--anatomy-lit:#ffe0cc;--mat-body:#42221a;--mat-shine:#8a4c31;--mat-shade:#1f0f08;--mat-edge:#eaa985}
.tk-iso [data-mat="copper"]{--anatomy-paper:#b3633e;--anatomy-face:#c9784f;--anatomy-top:#df9670;--anatomy-shade-0:#7c4128;--anatomy-shade-1:#9a5132;--anatomy-shade-2:#b3633e;--anatomy-shade-3:#c9784f;--anatomy-lit-top:#eaa985;--anatomy-lit-shade:#be6d46;--anatomy-hi:#3a1a0c;--anatomy-mid:#6e3820;--anatomy-lo:#925037;--anatomy-faint:#a65d3f;--anatomy-dot:#3a1a0c;--anatomy-lit:#1c0b04;--mat-body:#ad5f3b;--mat-shine:#f0b896;--mat-shade:#6e3720;--mat-edge:#3a1a0c}
[data-theme="dark"] .tk-iso [data-mat="copper"]{--anatomy-paper:#3d1f13;--anatomy-face:#492617;--anatomy-top:#582e1c;--anatomy-shade-0:#2a160d;--anatomy-shade-1:#331a10;--anatomy-shade-2:#3d1f13;--anatomy-shade-3:#492617;--anatomy-lit-top:#673722;--anatomy-lit-shade:#432215;--anatomy-hi:#eaa985;--anatomy-mid:#8f5236;--anatomy-lo:#5f3624;--anatomy-faint:#45271a;--anatomy-dot:#eaa985;--anatomy-lit:#ffe0cc;--mat-body:#42221a;--mat-shine:#8a4c31;--mat-shade:#1f0f08;--mat-edge:#eaa985}
[data-mat] .tb-body{fill:var(--mat-body)}
[data-mat] .tb-shine{fill:var(--mat-shine)}
[data-mat] .tb-shade{fill:var(--mat-shade)}
[data-mat] .tb-edge{stroke:var(--mat-edge)}
.tb[data-hue="red"]{--tb-ink:var(--anatomy-red)}
.tb[data-hue="green"]{--tb-ink:var(--anatomy-green)}
.tb[data-hue="blue"]{--tb-ink:var(--anatomy-blue)}
.tb[data-hue] .tb-body{fill:color-mix(in srgb,var(--tb-ink) 54%,var(--anatomy-shade-2))}
.tb[data-hue] .tb-shine{fill:color-mix(in srgb,var(--tb-ink) 16%,var(--anatomy-top))}
.tb[data-hue] .tb-shade{fill:color-mix(in srgb,var(--tb-ink) 30%,var(--anatomy-hi))}
.tb[data-hue] .tb-edge{stroke:color-mix(in srgb,var(--tb-ink) 38%,var(--anatomy-hi))}
.tb[data-hue][data-mat] .tb-body{fill:color-mix(in srgb,var(--tb-ink) 62%,var(--mat-body))}
.tb[data-hue][data-mat] .tb-shine{fill:color-mix(in srgb,var(--tb-ink) 22%,var(--mat-shine))}
.tb[data-hue][data-mat] .tb-shade{fill:color-mix(in srgb,var(--tb-ink) 46%,var(--mat-shade))}
.tb[data-hue][data-mat] .tb-edge{stroke:color-mix(in srgb,var(--tb-ink) 30%,var(--mat-edge))}
.iso-turn{position:relative}
.iso-turn>.iso-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}

.wt-stage>svg[data-live="tower"]{pointer-events:auto}
.wt-stage [data-name^="pump."],.wt-stage [data-name^="ctrl."],.wt-stage [data-name^="tap."],.wt-stage [data-name^="water."]{cursor:pointer}
[data-theme="dark"] .tk-iso .iso-live [data-name^="pvc."]:not([data-mat]){--anatomy-paper:#2c5f96;--anatomy-face:#2c5f96;--anatomy-top:#4f8cca;--anatomy-shade-0:#1a3a5f;--anatomy-shade-1:#224c7a;--anatomy-shade-2:#2c5f96;--anatomy-shade-3:#3870ad;--anatomy-lit-top:#63a0dc;--anatomy-lit-shade:#3a74b0;--anatomy-hi:#a9cdf2;--anatomy-mid:#5d8fc4;--anatomy-lo:#335f8f;--anatomy-faint:#2a4e78;--anatomy-dot:#b8d6f5;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.tk-iso .iso-live [data-name^="pvc."]:not([data-mat]){--anatomy-paper:#4a8fd3;--anatomy-face:#4a8fd3;--anatomy-top:#9cc8f0;--anatomy-shade-0:#2a63a0;--anatomy-shade-1:#3576bb;--anatomy-shade-2:#4a8fd3;--anatomy-shade-3:#64a5e2;--anatomy-lit-top:#bcdcf8;--anatomy-lit-shade:#6aa8e2;--anatomy-hi:#143860;--anatomy-mid:#245488;--anatomy-lo:#2f6aa8;--anatomy-faint:#3a7cc0;--anatomy-dot:#143860;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
[data-theme="dark"] .tk-iso .iso-live [data-name^="pump."]:not([data-mat]){--anatomy-paper:#1f5f58;--anatomy-face:#1f5f58;--anatomy-top:#3b8f84;--anatomy-shade-0:#123a35;--anatomy-shade-1:#184b45;--anatomy-shade-2:#1f5f58;--anatomy-shade-3:#28716a;--anatomy-lit-top:#4aa196;--anatomy-lit-shade:#2a7469;--anatomy-hi:#9fded5;--anatomy-mid:#4d9a90;--anatomy-lo:#245c55;--anatomy-faint:#1d4a45;--anatomy-dot:#cdeee9;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.tk-iso .iso-live [data-name^="pump."]:not([data-mat]){--anatomy-paper:#2f8f83;--anatomy-face:#2f8f83;--anatomy-top:#7cc7bc;--anatomy-shade-0:#1b5f57;--anatomy-shade-1:#24766c;--anatomy-shade-2:#2f8f83;--anatomy-shade-3:#45a497;--anatomy-lit-top:#a5dcd3;--anatomy-lit-shade:#4fae9f;--anatomy-hi:#0d3631;--anatomy-mid:#1c564f;--anatomy-lo:#24766c;--anatomy-faint:#2f8f83;--anatomy-dot:#e9f6f4;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
[data-theme="dark"] .tk-iso .iso-live [data-name="gauge.tube"]{--anatomy-paper:#26404f;--anatomy-face:#26404f;--anatomy-top:#3d6275;--anatomy-shade-0:#182b36;--anatomy-shade-1:#1d3442;--anatomy-shade-2:#26404f;--anatomy-shade-3:#2f4e60;--anatomy-lit-top:#4c7387;--anatomy-lit-shade:#2f4e60;--anatomy-hi:#b9dbe8;--anatomy-mid:#6f97a8;--anatomy-lo:#3f6070;--anatomy-faint:#2e4b5a;--anatomy-dot:#d2ecf5;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.tk-iso .iso-live [data-name="gauge.tube"]{--anatomy-paper:#e8f4f8;--anatomy-face:#e8f4f8;--anatomy-top:#ffffff;--anatomy-shade-0:#bcd5de;--anatomy-shade-1:#cde2e9;--anatomy-shade-2:#ddedf2;--anatomy-shade-3:#eef7fa;--anatomy-lit-top:#ffffff;--anatomy-lit-shade:#e3f1f6;--anatomy-hi:#5d8796;--anatomy-mid:#88aab6;--anatomy-lo:#a9c4cd;--anatomy-faint:#c3d8df;--anatomy-dot:#5d8796;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.iso-live [data-name="gauge.tube"] .iso-tn,.iso-live [data-name="gauge.tube"] path:not(.iso-line):not(.wt-water){fill-opacity:.55}
[data-theme="dark"] .tk-iso .iso-live [data-name^="water."]{--anatomy-paper:#3f8fd0;--anatomy-face:#3f8fd0;--anatomy-top:#7cbdf0;--anatomy-shade-0:#2a6aa6;--anatomy-shade-1:#347bbb;--anatomy-shade-2:#3f8fd0;--anatomy-shade-3:#58a2de;--anatomy-lit-top:#9fd0f6;--anatomy-lit-shade:#5aa6e2;--anatomy-hi:#bfe2fb;--anatomy-mid:#6fb2ea;--anatomy-lo:#3f8fd0;--anatomy-faint:#347bbb;--anatomy-dot:#e2f2fd;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.tk-iso .iso-live [data-name^="water."]{--anatomy-paper:#5aa9e6;--anatomy-face:#5aa9e6;--anatomy-top:#a7d3f5;--anatomy-shade-0:#3a86c8;--anatomy-shade-1:#4796d6;--anatomy-shade-2:#5aa9e6;--anatomy-shade-3:#74b8ec;--anatomy-lit-top:#c3e2f8;--anatomy-lit-shade:#7bbcec;--anatomy-hi:#1d5f96;--anatomy-mid:#2f76b4;--anatomy-lo:#4796d6;--anatomy-faint:#5aa9e6;--anatomy-dot:#1d5f96;--tn-0:var(--anatomy-shade-0);--tn-1:var(--anatomy-shade-1);--tn-2:var(--anatomy-shade-2);--tn-3:var(--anatomy-shade-3);--tn-4:var(--anatomy-top)}
.wt-stage:not([data-taps]) [data-name^="water."]{visibility:hidden}
.wt-water{stroke:none}
[data-theme="dark"] .tk-iso .wt-water{fill:#3b8fd8;fill-opacity:.82}
.tk-iso .wt-water{fill:#4a9be0;fill-opacity:.75}
.wt-surface{fill:#a9d8ff;stroke:#2f7fc4;stroke-width:.35}
.wt-bead{fill:#e5483f;stroke:#8f1d17;stroke-width:.4}
.wt-shine{fill:#fff;opacity:.55}
.wt-full{fill:none;stroke:#e5483f;stroke-width:.9}
.iso-live [data-name^="gauge.board."] .iso-edge,.iso-live [data-name^="gauge.board."] .iso-crease{stroke-opacity:.14}
.wt-num{font-family:"IBM Plex Sans Thai","Noto Sans Thai","Sarabun",ui-sans-serif,sans-serif;font-weight:600}
.wt-flow{fill:none;stroke-width:.7;stroke-linecap:round;stroke-dasharray:2.2 3.4;opacity:.85;animation:wt-flow .45s linear infinite}
[data-theme="dark"] .tk-iso .wt-flow{stroke:#e8f6ff}
.tk-iso .wt-flow{stroke:#ffffff}
@keyframes wt-flow{to{stroke-dashoffset:-5.6}}
@media (prefers-reduced-motion:reduce){.wt-flow{animation:none}}
.wt-lamp{stroke:var(--anatomy-lo);stroke-width:.35}
.wt-lamp-run{fill:#1f4d33}.wt-lamp-stop{fill:#5a2422}
.wt-stage[data-pump] .wt-lamp-run{fill:#3ddc84;filter:drop-shadow(0 0 2px #3ddc84)}
.wt-stage:not([data-pump]) .wt-lamp-stop{fill:#ff5a4f;filter:drop-shadow(0 0 2px #ff5a4f)}
.wt-knob{fill:var(--anatomy-lo);stroke:var(--anatomy-hi);stroke-width:.3}.wt-knob-bar{stroke:var(--anatomy-top);stroke-width:.9;stroke-linecap:round}
.wt-tread{stroke-width:.5}
.wt-shade{fill:#000;filter:blur(3px)}
[data-theme="dark"] .tk-iso .wt-shade{opacity:.2}
.tk-iso .wt-shade{opacity:.13}


.wt-stage{position:relative;display:block;width:min(100%,calc(min(720px,78vh) * 0.8421));margin:0 auto;outline:none;background:var(--bg-c);touch-action:pan-y;cursor:grab;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
.wt-stage>svg:first-child{display:block;width:100%;height:auto}
.wt-stage[data-drag]{cursor:grabbing}
.wt-stage:focus-visible{outline:3px solid var(--c-500);outline-offset:-3px}
.tk-lab-card:fullscreen .wt-stage,.tk-lab-card:-webkit-full-screen .wt-stage{width:min(100%,calc((100vh - 230px) * 0.8421))}
/* เต็มจอบนจอกว้าง: ภาพเต็มความสูงที่เหลือทางซ้าย (คงสัดส่วน) แผงควบคุมอยู่ขวา */
@media (min-width:901px){
  .tk-workbench.tk-wt #lbCard:fullscreen,.tk-workbench.tk-wt #lbCard:-webkit-full-screen{display:grid;height:100dvh;grid-template-columns:minmax(0,1fr) 320px;grid-template-rows:auto minmax(0,1fr);align-content:stretch;overflow:hidden}
  .tk-workbench.tk-wt #lbCard:fullscreen>.tk-card-hd,.tk-workbench.tk-wt #lbCard:-webkit-full-screen>.tk-card-hd{grid-column:1/-1}
  .tk-workbench.tk-wt #lbCard:fullscreen>.wt-stage,.tk-workbench.tk-wt #lbCard:-webkit-full-screen>.wt-stage{grid-column:1;grid-row:2;align-self:center;justify-self:center;width:min(100%,calc((100dvh - 96px) * 0.8421));max-width:100%;margin:0}
  .tk-workbench.tk-wt #lbCard:fullscreen>.lb-dock,.tk-workbench.tk-wt #lbCard:-webkit-full-screen>.lb-dock{grid-column:2;grid-row:2;max-height:none;min-height:0;overflow:auto;border-left:1px solid var(--bd)}
}
.tk-workbench .lb-toolbar>.wt-ctl{display:grid;gap:.4rem;font-size:.82rem;color:var(--t2);margin:0}
.tk-workbench .lb-toolbar .wt-ctl .tk-seg{grid-template-columns:repeat(2,minmax(0,1fr))}
.tk-workbench .lb-toolbar .wt-ctl .tk-seg.wt-seg3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wt-ctl .tk-seg button{white-space:nowrap}
.wt-steps{margin:0;padding:0;list-style:none;display:grid;gap:.2rem;font-size:.88rem;line-height:1.8;color:var(--t2);font-variant-numeric:tabular-nums}
.wt-steps li{overflow-wrap:anywhere}
.wt-steps li:last-child{margin-top:.2rem;padding:.45rem .7rem;border-radius:8px;background:var(--bg-m);color:var(--t1);font-weight:700}
.wt-vars{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.3rem .7rem;margin:.6rem 0 0;font-size:.86rem;color:var(--t2)}
.wt-vars dt{font-weight:600;color:var(--t1);white-space:nowrap}
.wt-vars dd{margin:0;font-variant-numeric:tabular-nums}
.wt-legend{display:grid;gap:.35rem;font-size:.86rem;color:var(--t2)}
.wt-legend span{display:flex;align-items:center;gap:.55rem}
.wt-sw{flex:none;width:14px;height:14px;border-radius:4px}
.wt-sw-bead{border-radius:50%;background:#e5483f;box-shadow:inset 0 0 0 1px #8f1d17}
.wt-sw-scale{width:8px;margin:0 3px;background:repeating-linear-gradient(#64748b 0 1px,transparent 1px 3.5px);border:1px solid #94a3b8}
.wt-sw-pvc{background:linear-gradient(90deg,#2a63a0,#64a5e2 55%,#2a63a0)}
.wt-sw-pump{background:linear-gradient(#45a497,#1b5f57)}
.wt-sw-lamp{border-radius:50%;background:radial-gradient(circle at 30% 50%,#3ddc84 0 32%,transparent 34%),radial-gradient(circle at 74% 50%,#ff5a4f 0 32%,transparent 34%)}
.wt-sw-tap{border-radius:50%;background:radial-gradient(circle at 40% 40%,#f8fafc,#94a3b8)}
.wt-tbl-wrap{max-height:430px;overflow:auto}
.wt-tbl-wrap .tk-tbl{min-width:0}
.wt-tbl-wrap thead th{position:sticky;top:0;z-index:1;background:var(--c-700)}
[data-theme="dark"] .wt-tbl-wrap thead th{background:#3d4a5c}
.wt-chart{min-width:0}
.wt-chart-hd{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.5rem;margin:0 0 .4rem;font-size:.86rem;color:var(--t2)}
.wt-chart-key{display:flex;flex-wrap:wrap;gap:.35rem 1.1rem;margin:.4rem 0 0;font-size:.84rem;color:var(--t3)}
.wt-chart-key span{display:inline-flex;align-items:center;gap:.45rem}
.wt-key-trace{width:24px;height:0;border-top:3px solid var(--c-600);border-radius:2px}
.wt-key-line{width:24px;height:0;border-top:2.5px dashed var(--c-500)}
.wt-key-dot{width:10px;height:10px;border-radius:50%;background:#f59e0b}
.wt-key-ring{width:11px;height:11px;border-radius:50%;border:2px solid #e5483f}
.lb-chart .wt-trace{fill:none;stroke:var(--c-600);stroke-width:2.6;stroke-linejoin:round;stroke-linecap:round}
.lb-chart .wt-full{stroke:#e5483f;stroke-width:1.4;stroke-dasharray:3 4;opacity:.8}
.lb-chart .wt-full-t{fill:#b91c1c;font:600 11.5px var(--f-b)}
[data-theme="dark"] .lb-chart .wt-full-t{fill:#fca5a5}
.lb-chart .guide{stroke:var(--t3);stroke-width:1;stroke-dasharray:2 4;opacity:.7;fill:none}
.lb-chart .guide-t{fill:#B45309;font:600 11.5px var(--f-b)}
[data-theme="dark"] .lb-chart .guide-t{fill:#FCD34D}
.lb-chart .wt-pt{fill:#f59e0b;stroke:var(--bg-c);stroke-width:2.5}
.lb-chart .wt-now{fill:none;stroke:#e5483f;stroke-width:2.4}