/* FAJRUM C2b / Pec — handcrafted heat instruments, aged iron and brass.
   No control is relocated or replaced; molten canvas animation is untouched. */
#app .fj-c2b-furnace {
  --c2b-gold:#c09a60;
  --c2b-rust:#8a4724;
  --c2b-line:rgba(190,147,84,.40);
  --c2b-wood:#25180f;
  --c2b-ink:#ebd5af;
  --c2b-shadow:rgba(12,8,3,.28);
  min-width:0;
}
/* Existing hand-painted furnace illustration: soot, corners, brass stitching. */
#app .fj-c2b-furnace .fj-c2b-hearth {
  position:relative;
  border:2px solid #8f6c43;
  border-radius:7px;
  box-shadow:0 7px 20px var(--c2b-shadow), inset 0 0 0 1px #e0b87848;
}
#app .fj-c2b-furnace .fj-c2b-hearth .fj-art-figure { min-width:0; }
#app .fj-c2b-furnace .fj-c2b-etching {
  position:absolute;z-index:4;inset:8px;pointer-events:none;
  border:1px solid rgba(247,200,116,.32);
  border-radius:2px;
  background:
    url('brass-corner.svg') left top / 40px 40px no-repeat,
    url('brass-corner.svg') right top / 40px 40px no-repeat;
  box-shadow: inset 0 0 0 2px rgba(19,10,4,.17);
}
#app .fj-c2b-furnace .fj-c2b-hearth .fj-art-caption { padding-left:5px; }
#app .fj-c2b-furnace .fj-c2b-hearth .fj-art-caption h2 {
  font-size:clamp(19px,2.1vw,27px);
  color:#ffe5bb;
  text-shadow:0 2px 8px #000e;
}
#app .fj-c2b-furnace .fj-c2b-hearth .fj-hearth-readout {
  background:linear-gradient(155deg,rgba(201,151,80,.09),transparent 40%),var(--fj-surface);
}
#app .fj-c2b-furnace .fj-c2b-hearth .fj-hearth-stat {
  padding-left:7px;
  border-left:2px solid rgba(160,108,49,.42);
  border-right:0;
}
#app .fj-c2b-furnace .fj-c2b-hearth .fj-hearth-stat strong {
  font-family:Georgia,serif;
  font-size:clamp(18px,2.5vw,24px);
  letter-spacing:.01em;
}
#app .fj-c2b-furnace .fj-c2b-hearth .fj-art-foot { border-top:1px solid var(--fj-edge); }
#app .fj-c2b-furnace[data-c2b-heat-state="danger"] .fj-c2b-hearth {
  border-color:#b75138;
  box-shadow:0 0 0 1px #d77b5a78,0 4px 18px rgba(187,44,13,.22);
}
/* The instrument plate — purposely thin so it doesn't swallow mobile screens. */
#app .fj-c2b-furnace .fj-c2b-plate {
  position:relative;isolation:isolate;overflow:hidden;
  margin:9px 10px 11px;padding:12px 15px 10px;
  border:1px solid var(--fj-edge);border-top:3px solid var(--c2b-gold);
  border-radius:5px;
  background:linear-gradient(127deg,rgba(196,139,65,.09),transparent 45%,rgba(51,27,12,.13)),var(--card);
  box-shadow:0 5px 17px var(--c2b-shadow), inset 0 0 0 1px rgba(221,183,124,.10);
}
#app .fj-c2b-furnace .fj-c2b-plate::before {
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:url('../img/ui/surface-sootwood.webp') center / 450px auto;
  mix-blend-mode:soft-light;opacity:.24;
}
#app .fj-c2b-furnace .fj-c2b-plate::after {
  content:'';position:absolute;right:8px;bottom:7px;width:4px;height:4px;
  background:var(--c2b-gold);border-radius:50%;opacity:.55;
  box-shadow:-9px 0 var(--c2b-gold),0 -9px var(--c2b-gold);pointer-events:none;
}
#app .fj-c2b-furnace .fj-c2b-plate-head {
  display:flex;align-items:center;gap:10px;min-width:0;margin-bottom:10px;
}
#app .fj-c2b-furnace .fj-c2b-emblem {
  width:35px;height:35px;flex:0 0 35px;
  display:grid;place-items:center;
  border:1px solid var(--c2b-line);border-radius:50%;
  font:24px/1 Georgia,serif;color:var(--c2b-gold);
  background:radial-gradient(circle at 40% 30%,rgba(201,150,73,.13),transparent 74%);
  box-shadow:inset 0 0 0 3px rgba(180,123,63,.05);
}
#app .fj-c2b-furnace .fj-c2b-heading {flex:1 1 auto;min-width:0;}
#app .fj-c2b-furnace .fj-c2b-eyebrow {
  display:block;font-size:9px;letter-spacing:.14em;line-height:1.35;
  color:var(--fj-muted);
}
#app .fj-c2b-furnace .fj-c2b-heading h3 {
  margin:2px 0 0;font:normal 18px/1.25 Georgia,serif;color:var(--ink);
}
#app .fj-c2b-furnace .fj-c2b-chip {
  border:1px solid var(--c2b-line);border-radius:3px;padding:4px 7px;
  color:var(--c2b-gold);background:rgba(143,105,55,.07);
  font-size:11px;font-weight:650;white-space:nowrap;text-align:center;
}
#app .fj-c2b-furnace .fj-c2b-chip::before {
  content:'●';color:#8e7153;font-size:9px;margin-right:5px;
}
#app .fj-c2b-furnace .fj-c2b-plate[data-heat-state="working"] .fj-c2b-chip::before {color:#a7a969;}
#app .fj-c2b-furnace .fj-c2b-plate[data-heat-state="warming"] .fj-c2b-chip::before {color:#d38c42;}
#app .fj-c2b-furnace .fj-c2b-plate[data-heat-state="danger"] .fj-c2b-chip,
#app .fj-c2b-furnace .fj-c2b-plate[data-heat-state="danger"] .fj-c2b-chip::before {color:#ca5b43;}
#app .fj-c2b-furnace .fj-c2b-thermo-title {
  display:flex;align-items:baseline;justify-content:space-between;gap:7px;
  margin-bottom:6px;color:var(--fj-muted);font-size:11px;
}
#app .fj-c2b-furnace .fj-c2b-thermo-title strong {
  font:700 16px/1.1 Georgia,serif;letter-spacing:.02em;color:var(--ink);
  font-variant-numeric:tabular-nums;
}
#app .fj-c2b-furnace .fj-c2b-thermo {width:100%;padding:3px 0 5px;}
#app .fj-c2b-furnace .fj-c2b-thermo-track {
  position:relative;display:flex;height:12px;border:1px solid rgba(95,63,33,.75);
  box-shadow:inset 0 2px 5px #0007,0 1px 0 #dec18e39;
  border-radius:2px;background:#271812;
}
#app .fj-c2b-furnace .fj-c2b-zone {display:block;min-width:0;}
#app .fj-c2b-furnace .fj-c2b-zone-prep {
  width:68%;background:linear-gradient(90deg,#41332a,#814b2d 52%,#b86d35);
}
#app .fj-c2b-furnace .fj-c2b-zone-work {
  width:19%;background:linear-gradient(90deg,#c7832d,#e9b94e,#f1d178);
}
#app .fj-c2b-furnace .fj-c2b-zone-danger {
  width:13%;background:linear-gradient(90deg,#c86533,#a53720,#60170e);
}
#app .fj-c2b-furnace .fj-c2b-thermo-marker {
  position:absolute;top:-6px;width:3px;height:22px;z-index:2;
  border-radius:1px;background:#f8e7c2;
  box-shadow:0 0 0 1px #322016,0 0 7px #f4d09f8c;
  transform:translateX(-50%);
}
#app .fj-c2b-furnace .fj-c2b-thermo-marker::before {
  content:'';position:absolute;left:-4px;top:-5px;
  border:5px solid transparent;border-top-color:#ebcea4;
}
#app .fj-c2b-furnace .fj-c2b-legend {
  display:flex;justify-content:space-between;gap:4px;
  color:var(--fj-muted);font-size:9px;line-height:1.5;
}
#app .fj-c2b-furnace .fj-c2b-plate-facts {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;
  margin-top:10px;padding-top:9px;border-top:1px solid var(--c2b-line);
}
#app .fj-c2b-furnace .fj-c2b-plate-fact {
  min-width:0;display:flex;flex-direction:column;gap:3px;padding:0 8px;
  border-right:1px solid var(--fj-edge);
}
#app .fj-c2b-furnace .fj-c2b-plate-fact:first-child {padding-left:0;}
#app .fj-c2b-furnace .fj-c2b-plate-fact:last-child {border:0;padding-right:0;}
#app .fj-c2b-furnace .fj-c2b-plate-fact small {
  color:var(--fj-muted);font-size:10px;line-height:1.3;
}
#app .fj-c2b-furnace .fj-c2b-plate-fact strong {
  color:var(--ink);font:700 15px/1.2 Georgia,serif;font-variant-numeric:tabular-nums;
}
#app .fj-c2b-furnace .fj-c2b-plate-fact.is-alert strong {color:var(--danger);}
/* Original animated crucibles stay in place, but sit inside a forged iron housing. */
#app .fj-c2b-furnace .fj-c2b-dash-section {
  position:relative;min-width:0;
  border-top:2px solid var(--c2b-gold);
  box-shadow:0 7px 17px var(--c2b-shadow);
}
#app .fj-c2b-furnace .fj-c2b-dash-heading {
  display:flex;align-items:center;gap:10px;padding:2px 2px 11px;
  margin-bottom:6px;border-bottom:1px solid var(--fj-edge);
}
#app .fj-c2b-furnace .fj-c2b-dash-symbol {
  display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--c2b-line);
  border-radius:4px;font:23px/1 Georgia,serif;color:var(--c2b-gold);
}
#app .fj-c2b-furnace .fj-c2b-dash-copy {
  color:var(--ink);font:normal 18px/1.3 Georgia,serif;letter-spacing:.02em;
}
#app .fj-c2b-furnace .furnace-dash {
  position:relative;min-width:0;isolation:isolate;overflow:hidden;
  border:1px solid #6b4b2b;border-radius:5px;padding:13px!important;
  background-color:#1b100b;
  background-image:
    radial-gradient(ellipse at 48% 35%,rgba(151,69,23,calc(var(--fj-c2b-heat,0)*.18)),transparent 61%),
    linear-gradient(145deg,#34231a,#190f0a 50%,#2a1a12);
  box-shadow:inset 0 0 0 1px #a4773e66,inset 0 6px 22px #0c0806aa;
  color:#f1dbc0;
}
#app .fj-c2b-furnace .furnace-dash::before {
  content:'';position:absolute;pointer-events:none;z-index:1;inset:7px;
  border:1px solid rgba(216,174,108,.25);border-radius:2px;
  background:url('brass-corner.svg') left top / 36px 36px no-repeat;
}
#app .fj-c2b-furnace .furnace-dash::after {
  content:'';position:absolute;pointer-events:none;right:9px;top:9px;
  width:4px;height:4px;border-radius:50%;background:#b88d53;opacity:.7;
  box-shadow:-11px 0 #65513d,0 11px #65513d;
}
#app .fj-c2b-furnace .fj-c2b-gauge-panel {
  position:relative;min-width:0;padding:5px 8px 9px;margin-bottom:12px;
  border-bottom:1px solid rgba(204,154,86,.3);
}
#app .fj-c2b-furnace .furnace-temp-gauge {
  padding:8px 7px 2px;height:69px!important;margin-bottom:0;
  border-bottom:3px solid #81572d;
  background:linear-gradient(180deg,transparent,rgba(143,68,17,.12));
}
#app .fj-c2b-furnace .furnace-temp-gauge .gauge-bar {
  min-width:0;border:1px solid rgba(231,177,90,.08);border-bottom:0;
  box-shadow:inset 1px 0 rgba(255,241,205,.09),0 0 5px #0003;
}
#app .fj-c2b-furnace .fj-c2b-melt-layout {
  min-width:0;padding:13px 12px 10px;
  border:1px solid rgba(205,158,91,.24);border-radius:4px;
  background:radial-gradient(ellipse at 30% 43%,rgba(178,80,22,.20),transparent 60%),rgba(4,3,2,.21);
  box-shadow:inset 0 0 18px #0005;
}
#app .fj-c2b-furnace .fj-c2b-smelt-stage {
  min-width:0;align-items:center;
}
#app .fj-c2b-furnace .fj-c2b-smelt-readings {
  min-width:0;padding-left:12px;
  border-left:1px solid rgba(209,154,84,.28);
}
#app .fj-c2b-furnace .fj-c2b-smelt-readings > div:first-child > div:first-child {
  font-variant-numeric:tabular-nums;
}
#app .fj-c2b-furnace .fj-c2b-smelt-readings strong,
#app .fj-c2b-furnace .fj-c2b-smelt-readings span {text-shadow:0 1px 2px #0009;}
#app .fj-c2b-furnace .fj-c2b-lining-panel {
  margin-top:13px!important;padding:10px 12px 12px;
  border:1px solid rgba(181,135,73,.28);border-radius:4px;
  background:linear-gradient(100deg,rgba(187,96,43,.1),transparent 73%);
}
#app .fj-c2b-furnace .shamot-visual {
  display:flex;gap:3px;padding:4px;
  border:1px solid rgba(204,158,92,.18);border-radius:2px;
  background:#110b08;
}
#app .fj-c2b-furnace .shamot-brick {
  height:13px;border-radius:1px;
  box-shadow:inset 0 1px rgba(255,232,188,.18),inset 0 -3px #0004;
}
#app .fj-c2b-furnace .fj-c2b-guidance {
  margin-top:10px!important;padding:9px 12px!important;
  border:1px solid rgba(197,149,82,.25);
  border-left:3px solid #d4a05c;
  background:rgba(220,154,73,.08)!important;
  font-size:12px!important;line-height:1.5!important;
}
#app .fj-c2b-furnace[data-c2b-heat-state="danger"] .fj-c2b-guidance {
  border-left-color:#cb5636;
  background:rgba(182,49,25,.13)!important;
}
/* The original efficiency, batch, colour recipe actions remain untouched. */
#app .fj-c2b-furnace :is(.fj-c2b-efficiency,.fj-c2b-batch,.fj-c2b-colours) {
  position:relative;min-width:0;
  border-top:2px solid var(--c2b-gold);
  background-image:linear-gradient(150deg,rgba(194,137,64,.075),transparent 45%);
}
#app .fj-c2b-furnace :is(.fj-c2b-efficiency,.fj-c2b-batch,.fj-c2b-colours) > .sec-title {
  margin-bottom:10px;padding-bottom:8px;
  border-bottom:1px solid var(--c2b-line);
  letter-spacing:.015em;
}
#app .fj-c2b-furnace .fj-c2b-colours .fj-color-input {
  border-radius:3px!important;
}
#app .fj-c2b-furnace .fj-c2b-colours button:focus-visible,
#app .fj-c2b-furnace .fj-c2b-hearth button:focus-visible {
  outline:2px solid var(--gold);outline-offset:2px;
}
/* Notebook/ledger skin: clear old paper and oxidised brass, not black cards. */
:root[data-fajrum-theme="light"] #app .fj-c2b-furnace .fj-c2b-plate {
  background:linear-gradient(140deg,rgba(242,208,145,.2),rgba(136,87,46,.055)),var(--card);
  box-shadow:0 4px 12px rgba(73,44,15,.14),inset 0 0 0 1px rgba(255,244,210,.6);
}
:root[data-fajrum-theme="light"] #app .fj-c2b-furnace .fj-c2b-plate::before {
  background-image:url('../img/ui/surface-paper.webp');opacity:.22;
}
:root[data-fajrum-theme="light"] #app .fj-c2b-furnace .fj-c2b-emblem {
  color:#916a3b;border-color:#b79b76;
}
:root[data-fajrum-theme="light"] #app .fj-c2b-furnace .fj-c2b-chip { color:#73542e; }
:root[data-fajrum-theme="light"] #app .fj-c2b-furnace .fj-c2b-hearth {
  box-shadow:0 4px 13px rgba(76,48,25,.18),inset 0 0 0 1px rgba(239,197,128,.5);
}
@media (min-width:960px) and (min-height:500px) {
  /* Maintain 3:2 painting on desktop, don't force it to fill its column. */
  #app.desktop .fj-c2b-furnace .fj-c2b-hearth .fj-art-figure {height:auto;aspect-ratio:3/2;}
  #app.desktop .fj-c2b-furnace .fj-c2b-plate {margin-top:12px;}
  #app.desktop .fj-c2b-furnace .fj-c2b-melt-layout {gap:18px!important;}
}
@media (max-width:690px) {
  /* The original two-column 160px crucible + readout would clip on mobile. */
  #app .fj-c2b-furnace .fj-c2b-melt-layout {
    display:flex!important;flex-direction:column!important;
    align-items:stretch!important;gap:9px!important;
    padding:12px 7px!important;
  }
  #app .fj-c2b-furnace .fj-c2b-smelt-stage {
    display:flex!important;justify-content:center!important;
    width:100%!important;flex:auto!important;
    padding:5px 0 9px;
  }
  #app .fj-c2b-furnace .fj-c2b-smelt-readings {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));
    gap:5px 15px;width:100%!important;flex:auto!important;
    border-left:0;border-top:1px solid rgba(209,154,84,.28);
    padding:11px 4px 3px!important;
  }
  #app .fj-c2b-furnace .fj-c2b-smelt-readings > div:first-child { grid-column:1/-1; }
  #app .fj-c2b-furnace .fj-c2b-smelt-readings > div:not(:first-child) {
    min-width:0;margin:0!important;padding:3px 1px!important;
  }
  #app .fj-c2b-furnace .fj-c2b-hearth .fj-art-figure {height:168px;}
  #app .fj-c2b-furnace .fj-c2b-hearth .fj-hearth-readout {padding:9px 8px;gap:4px;}
  #app .fj-c2b-furnace .fj-c2b-hearth .fj-hearth-stat {padding-left:6px;}
  #app .fj-c2b-furnace .fj-c2b-plate {padding:10px 11px 8px;}
}
@media (max-width:380px) {
  #app .fj-c2b-furnace .fj-c2b-plate-head {flex-wrap:wrap;gap:6px;}
  #app .fj-c2b-furnace .fj-c2b-chip {margin-left:auto;}
  #app .fj-c2b-furnace .fj-c2b-emblem {width:29px;height:29px;flex-basis:29px;font-size:19px;}
  #app .fj-c2b-furnace .fj-c2b-eyebrow {font-size:8px;letter-spacing:.08em;}
  #app .fj-c2b-furnace .fj-c2b-heading h3 {font-size:16px;}
  #app .fj-c2b-furnace .fj-c2b-legend {font-size:8px;}
  #app .fj-c2b-furnace .fj-c2b-plate-fact {padding-inline:5px;}
  #app .fj-c2b-furnace .fj-c2b-plate-fact small {font-size:9px;}
  #app .fj-c2b-furnace .fj-c2b-plate-fact strong {font-size:13px;}
  #app .fj-c2b-furnace .fj-c2b-dash-heading {gap:7px;}
  #app .fj-c2b-furnace .fj-c2b-dash-copy {font-size:16px;}
  #app .fj-c2b-furnace .furnace-dash {padding:8px!important;}
  #app .fj-c2b-furnace .fj-c2b-smelt-stage > div {transform:scale(.93);}
}
@media (max-height:500px) and (orientation:landscape) {
  #app .fj-c2b-furnace .fj-c2b-hearth .fj-art-figure {height:135px;}
  #app .fj-c2b-furnace .fj-c2b-plate {padding:7px 10px;margin-block:6px;}
  #app .fj-c2b-furnace .fj-c2b-emblem {display:none;}
}
@media (prefers-reduced-motion:reduce) {
  #app .fj-c2b-furnace .fj-c2b-hearth .fj-art-figure::after {animation:none!important;}
}
