@font-face{font-family:"Fraunces";font-style:normal;font-weight:300 900;font-display:swap;src:url("/la-ce-temperatura-fierbe-apa/assets/fraunces-normal-latin-ext.f120089b9440.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Fraunces";font-style:normal;font-weight:300 900;font-display:swap;src:url("/la-ce-temperatura-fierbe-apa/assets/fraunces-normal-latin.48282a415ec2.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:300 700;font-display:swap;src:url("/la-ce-temperatura-fierbe-apa/assets/source-serif-4-normal-latin-ext.a0cd390d0172.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:300 700;font-display:swap;src:url("/la-ce-temperatura-fierbe-apa/assets/source-serif-4-normal-latin.2a24bad466f0.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --ink:#1a120c;
  --paper:#f3eee6;
  --paper2:#e7e0d4;
  --card:#fffaf3;
  --text:#1a120c;
  --muted:#4e433a;
  --line:#d9cfc0;
  --heat:#9a3412;
  --heat-bright:#c2410c;
  --plate:#f4efe4;
  --nav:#1a120c;
  --nav-text:#f4efe4;
  --radius:18px;
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#14110e;
    --paper2:#1c1814;
    --card:#231e19;
    --text:#f3ece3;
    --muted:#cbbbaa;
    --line:#3a322a;
  }
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--text);
  font-family:"Source Serif 4",Georgia,serif;
  font-size:18px;
  line-height:1.55;
}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:#fff;padding:.6rem 1rem;z-index:80}
.skip-link:focus{left:.5rem;top:.5rem}
.progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:70;pointer-events:none;background:transparent}
.progress span{display:block;height:100%;width:100%;background:var(--heat-bright);transform:scaleX(0);transform-origin:0 50%}

.site-nav{
  position:sticky;top:0;z-index:40;
  display:flex;justify-content:space-between;align-items:center;
  min-height:52px;padding:.55rem clamp(1rem,3vw,2rem);
  background:var(--nav);color:var(--nav-text);
}
.brand{color:var(--nav-text);text-decoration:none;font-weight:650;letter-spacing:.01em}
.nav-links{display:flex;gap:1.15rem;align-items:center}
.nav-links a{color:var(--nav-text);text-decoration:none;font-weight:600}
.nav-links a:hover{text-decoration:underline}

.hero{
  display:grid;
  grid-template-columns:minmax(300px,440px) minmax(0,1fr);
  min-height:calc(100svh - 52px);
  background:#1a120c;
}
.stage{position:relative;min-height:520px;background:#8fb4c8}
.stage canvas{position:absolute;inset:0;width:100%;height:100%;display:block}

.plate{
  position:relative;z-index:2;
  background:var(--plate);
  color:#1a120c;
  --text:#1a120c;
  --muted:#4e433a;
  padding:clamp(1.3rem,3vw,2.2rem) clamp(1.15rem,2.5vw,2rem) 1.4rem;
  display:flex;flex-direction:column;justify-content:center;
}
.kicker{
  margin:0 0 .55rem;
  font-family:"Source Serif 4",Georgia,serif;
  font-size:.95rem;font-weight:650;letter-spacing:.01em;color:#7a3b16;
}
h1,h2{font-family:"Fraunces",Georgia,serif;font-weight:560;letter-spacing:-.02em;line-height:1.05;margin:0;color:inherit}
h1{font-size:clamp(1.7rem,2.5vw,2.3rem)}
h2{font-size:clamp(1.7rem,3vw,2.45rem)}
.standfirst{font-size:1.18rem;line-height:1.4;margin:1rem 0 0;color:#1a120c}
.readout{margin-top:1.15rem}
.temp-big{
  font-family:"Fraunces",Georgia,serif;
  font-weight:620;
  font-size:clamp(4.4rem,7vw,6.6rem);
  letter-spacing:-.045em;
  line-height:.86;
  font-variation-settings:"opsz" 144,"SOFT" 30,"WONK" 1;
  color:#1a120c;
}
.temp-big small{font-size:.34em;letter-spacing:0;margin-left:.06em;font-weight:560}
.readout-meta{display:flex;flex-direction:column;gap:.15rem;margin-top:.85rem;color:#1a120c;font-weight:600}
.readout-meta span:last-child{color:#4e433a;font-weight:500}

.controls{margin-top:1.25rem}
.alt-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-weight:650}
.alt-head label{color:#1a120c}
#sliderVal{font-variant-numeric:tabular-nums;color:#4e433a;font-weight:600}
.climb-row{display:flex;gap:.7rem;align-items:center;margin:.35rem 0 .15rem}
.climb-row input[type=range]{flex:1}
.play-btn,.chip,.action-btn,.pill-btn{
  border:1px solid #1a120c;
  background:transparent;
  color:#1a120c;
  border-radius:999px;
  padding:.55rem 1rem;
  font:inherit;font-weight:650;
  cursor:pointer;
}
.play-btn{background:var(--heat);border-color:var(--heat);color:#fff;white-space:nowrap;min-width:6.2rem}
.play-btn:hover{background:#7c2a0e}
.chip[aria-pressed=true]{background:#1a120c;color:#f4efe4}
.presets{display:flex;gap:.4rem;margin:.85rem 0 .2rem;overflow-x:auto;padding-bottom:.2rem}
.chip{flex:0 0 auto}
.custom{display:grid;grid-template-columns:1fr 7.2rem auto;gap:.45rem;margin-top:.7rem}
.custom input{
  background:#fffaf3;color:#1a120c;
  border:1px solid #c9bfb0;border-radius:10px;
  padding:.55rem .7rem;font:inherit;min-width:0;
}
.share-row{display:flex;gap:.45rem;align-items:center;margin-top:1rem;flex-wrap:wrap}
.share-label{font-weight:650;margin-right:.2rem}
.icon-btn{
  width:40px;height:40px;border-radius:50%;
  border:1px solid #c9bfb0;background:transparent;color:#1a120c;
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;text-decoration:none;padding:0;
}
.icon-btn svg{width:18px;height:18px;display:block}
.icon-btn:hover{background:#efe6d8}
.clear-btn{margin-top:.7rem}
.shared-banner{display:none;background:#9a3412;color:#fff;border-radius:12px;padding:.7rem .9rem;font-weight:650;margin-bottom:.9rem}
.shared-banner.on{display:block}
.status-msg{color:#1d6b3a;font-weight:650;min-height:1.3em;margin-top:.35rem}
.caveat{margin:1rem 0 0;color:#4e433a;font-size:1rem}

.rail{
  position:fixed;right:16px;top:50%;transform:translateY(-50%);z-index:30;
  display:flex;flex-direction:column;gap:.7rem;
  background:color-mix(in srgb,var(--paper) 88%,transparent);
  border:1px solid var(--line);border-radius:999px;padding:.55rem .4rem;
}
.rail a{
  position:relative;width:12px;height:12px;border-radius:50%;
  background:transparent;border:2px solid var(--muted);display:block;
}
.rail a[aria-current=true]{background:var(--heat-bright);border-color:var(--heat-bright)}
.rail a span{
  position:absolute;right:22px;top:50%;transform:translateY(-50%);
  background:var(--ink);color:#fff;border-radius:8px;
  padding:.25rem .5rem;white-space:nowrap;font-size:.85rem;font-weight:650;
  opacity:0;pointer-events:none;
}
.rail a:hover span,.rail a:focus-visible span{opacity:1}

section.band{padding:clamp(2.8rem,6vw,4.6rem) clamp(1rem,4vw,3rem)}
.wrap{max-width:1120px;margin:0 auto}
.lede{font-size:1.2rem;color:var(--muted);max-width:40rem;margin-top:.8rem}
.exp-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.2rem,4vw,3rem);align-items:center;margin-top:1.5rem}
.lab-frame{position:relative;aspect-ratio:5/4;background:#f4efe4;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)}
.lab-frame canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.lab-read{position:absolute;left:1rem;top:1rem;max-width:14rem;color:#1a120c}
.bubble-rate{font-family:"Fraunces",Georgia,serif;font-size:clamp(2rem,4vw,2.8rem);font-weight:620;line-height:1;letter-spacing:-.03em}
.lab-read p{margin:.25rem 0 0;color:#1a120c}
.lab-copy p:last-child{margin-bottom:0}
.lab-copy label{display:flex;justify-content:space-between;font-weight:650;margin-bottom:.35rem}
.pill-btn[aria-pressed=true]{background:#1a120c;color:#f4efe4}

.chart-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:.6rem .6rem .2rem;margin-top:1.3rem}
#chart{width:100%;height:auto;display:block;color:var(--text)}
#chart text{font-family:"Source Serif 4",Georgia,serif;font-size:13px}
.table-scroll{overflow-x:auto;margin-top:1rem}
table{width:100%;border-collapse:collapse;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
th,td{padding:.7rem .85rem;text-align:left;border-bottom:1px solid var(--line)}
th{font-size:.92rem;color:var(--muted);font-weight:650}
tbody tr{cursor:pointer}
tbody tr:hover,tbody tr:focus{background:var(--paper2);outline:none}
tbody tr[aria-current=true]{background:var(--paper2);box-shadow:inset 3px 0 0 var(--heat-bright)}
.num{font-variant-numeric:tabular-nums;font-weight:650}
.prose{max-width:40rem}
.prose p{font-size:1.12rem}
.formulas{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:1.15rem 1.25rem}
.formulas p:last-child{margin-bottom:0}
code{font-family:ui-monospace,Menlo,monospace;font-size:.92em}
footer{padding:2rem clamp(1rem,4vw,3rem) 3.5rem;color:var(--muted);max-width:1120px;margin:0 auto}
footer a{color:inherit}

input[type=range]{
  -webkit-appearance:none;appearance:none;
  height:28px;background:transparent;margin:0;width:100%;
}
input[type=range]:focus{outline:none}
input[type=range]:focus-visible{outline:3px solid var(--heat-bright);outline-offset:3px}
input[type=range]::-webkit-slider-runnable-track{height:3px;background:var(--text);border-radius:2px}
input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:26px;height:26px;margin-top:-12px;border-radius:50%;
  background:var(--heat-bright);border:3px solid #f4efe4;
  box-shadow:0 0 0 1px #1a120c;
}
input[type=range]::-moz-range-track{height:3px;background:var(--text);border-radius:2px}
input[type=range]::-moz-range-thumb{
  width:22px;height:22px;border-radius:50%;border:3px solid #f4efe4;
  background:var(--heat-bright);box-shadow:0 0 0 1px #1a120c;
}

:focus-visible{outline:3px solid var(--heat-bright);outline-offset:2px}
.site-nav a:focus-visible{outline-color:#f4efe4}

@media (pointer:coarse){
  .icon-btn{width:44px;height:44px}
  .play-btn,.chip,.action-btn,.pill-btn{min-height:44px}
}

@media (max-width:860px){
  .hero{display:flex;flex-direction:column;min-height:0}
  .stage{order:-1;height:48svh;min-height:240px}
  .plate{padding-top:1.25rem}
  .exp-grid{grid-template-columns:1fr}
  .rail{display:none}
  .custom{grid-template-columns:1fr 6.5rem}
  .custom .action-btn{grid-column:1/-1}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .progress span{transition:none}
}

@media print{
  .site-nav,.rail,.progress,.controls,.share-row,.play-btn{display:none}
  .hero{display:block;min-height:0;background:#fff}
  .stage{height:240px}
  .plate{background:#fff}
}