/* MTEX /metal SAYFASI v2 - Refined Industrial Editorial */
@import url('https://api.fontshare.com/v2/css?f[]=clash-display@400,500,600,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@300..700&family=JetBrains+Mono:wght@400..600&display=swap');

html body { background: var(--bg) !important; }

/* HERO H1 - Gizli h1'i premium container'a dönüştür */
body > h1[style*="9999"],
body > h1[style*="absolute"] {
  position: relative !important;
  left: 0 !important;
  top: 0 !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
  display: block !important;
  max-width: 1720px !important;
  margin: 24px auto 28px !important;
  padding: 36px 32px 32px !important;
  background:
    radial-gradient(circle at 85% 20%, rgba(240,180,41,0.12) 0%, transparent 40%),
    radial-gradient(circle at 15% 90%, rgba(240,180,41,0.06) 0%, transparent 50%),
    linear-gradient(155deg, var(--s1) 0%, var(--bg) 100%) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 14px !important;
  box-shadow: 0 1px 0 rgba(255,255,255,0.04) inset, 0 30px 60px -20px rgba(0,0,0,0.4) !important;
  font-family: 'Clash Display', 'Hanken Grotesk', sans-serif !important;
  font-size: clamp(28px, 4vw, 44px) !important;
  font-weight: 600 !important;
  letter-spacing: -0.035em !important;
  line-height: 1.1 !important;
  color: var(--tx) !important;
  text-align: left !important;
  text-transform: none !important;
  text-rendering: optimizeLegibility !important;
  -webkit-font-smoothing: antialiased !important;
  text-wrap: balance !important;
}
body > h1[style*="9999"]::before,
body > h1[style*="absolute"]::before {
  content: 'CANLI VERI · SON GUNCELLEME · TL/TON' !important;
  display: block !important;
  position: relative !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  color: var(--gold) !important;
  background: var(--gbg) !important;
  border: 1px solid var(--gbd) !important;
  padding: 6px 12px !important;
  border-radius: 999px !important;
  letter-spacing: 0.14em !important;
  margin: 0 0 24px 0 !important;
  text-transform: uppercase !important;
  width: fit-content !important;
  box-shadow: 0 0 20px rgba(240,180,41,0.15) !important;
}
body > h1[style*="9999"]::after,
body > h1[style*="absolute"]::after {
  content: 'Turkiye\'nin 12+ demir-celik fabrikasi, LME endustriyel madenler, degerli metaller ve gunluk insaat demiri fiyatlari - saatlik guncellenen canli veri.' !important;
  display: block !important;
  margin-top: 18px !important;
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: var(--sub) !important;
  letter-spacing: -0.005em !important;
  line-height: 1.55 !important;
  max-width: 640px !important;
  text-transform: none !important;
}

/* WRAP */
.wrap {
  max-width: 1720px !important;
  margin: 0 auto !important;
  padding: 20px 24px 40px !important;
  position: relative !important;
  overflow: visible !important;
  counter-reset: section !important;
}

/* Section spacing */
.section, .bx-news { margin-bottom: 48px !important; }
.bx-news { padding: 0 !important; }

/* SECTION TITLE */
.sec-title {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin-bottom: 22px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid var(--bd) !important;
  font-family: 'Clash Display', 'Hanken Grotesk', sans-serif !important;
  font-size: 1.45rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
  color: var(--tx) !important;
  text-transform: none !important;
  position: relative !important;
  padding-left: 32px !important;
}
.sec-title::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 2px !important;
  background: var(--gold) !important;
  border-radius: 2px !important;
}
.sec-title > span:first-child { display: none !important; }
.sec-title > span:not(:first-child),
.dem-date {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.72rem !important;
  font-weight: 500 !important;
  color: var(--sub) !important;
  letter-spacing: 0.05em !important;
  margin-left: auto !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  background: var(--s2) !important;
  border-radius: 5px !important;
  border: 1px solid var(--bd) !important;
}
.section { counter-increment: section !important; }
.section .sec-title::after {
  content: counter(section, decimal-leading-zero) !important;
  position: absolute !important;
  right: 0 !important;
  top: 0 !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: var(--gold) !important;
  letter-spacing: 0.15em !important;
  opacity: 0.6 !important;
}

/* HURDA GRID */
.hurda-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 12px !important;
}
.hcard {
  background: var(--s1) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 12px !important;
  padding: 18px !important;
  cursor: pointer !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 118px !important;
}
.hcard::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 2px !important;
  height: 0 !important;
  background: var(--gold) !important;
  transition: height 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.hcard:hover {
  background: var(--s2) !important;
  border-color: var(--bd2) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.3) !important;
}
.hcard:hover::before { height: 100% !important; }
.hcard-name {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  color: var(--sub) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  margin-bottom: 12px !important;
  line-height: 1.3 !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  min-height: 2.6em !important;
}
.hcard-price {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  color: var(--gold) !important;
  letter-spacing: -0.03em !important;
  line-height: 1.1 !important;
  margin-bottom: 8px !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
}
.hcard-unit {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.6rem !important;
  color: var(--sub) !important;
  font-weight: 500 !important;
  letter-spacing: 0.05em !important;
}
.hcard-chg {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  padding: 3px 9px !important;
  border-radius: 5px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.hcard .up, .hcard-chg.up { background: var(--gbg2) !important; color: var(--green) !important; }
.hcard .dn, .hcard-chg.dn { background: var(--rbg) !important; color: var(--red) !important; }
.hcard .fl, .hcard-chg.fl { background: rgba(255,255,255,.06) !important; color: var(--sub) !important; }
.hcard canvas.sp { display: none !important; }

/* PREC GRID */
.prec-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.pcard {
  background: var(--s1) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 12px !important;
  padding: 18px !important;
  cursor: pointer !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}
.pcard::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 2px !important;
  height: 0 !important;
  background: var(--gold) !important;
  transition: height 0.3s ease !important;
}
.pcard:hover {
  background: var(--s2) !important;
  border-color: var(--bd2) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.3) !important;
}
.pcard:hover::before { height: 100% !important; }
.pcard-top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 14px !important;
}
.pcard-icon { font-size: 1.6rem !important; filter: saturate(0.85) !important; }
.pcard-sym {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.55rem !important;
  font-weight: 600 !important;
  color: var(--sub) !important;
  background: var(--s3) !important;
  padding: 3px 8px !important;
  border-radius: 4px !important;
  letter-spacing: 0.12em !important;
}
.pcard-name {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.7rem !important;
  color: var(--sub) !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  margin-bottom: 8px !important;
}
.pcard-price {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 1.35rem !important;
  font-weight: 600 !important;
  color: var(--tx) !important;
  letter-spacing: -0.03em !important;
  line-height: 1.1 !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 5px !important;
}
.pcard-unit {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.55rem !important;
  color: var(--sub) !important;
  font-weight: 500 !important;
}
.pcard .hcard-chg { margin-top: 8px !important; display: inline-flex !important; }
.pcard canvas.sp { display: none !important; }

/* IND GRID */
.ind-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
}
.icard {
  background: var(--s1) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  cursor: pointer !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 86px !important;
}
.icard::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 2px !important;
  height: 0 !important;
  background: var(--gold) !important;
  transition: height 0.3s ease !important;
}
.icard:hover {
  background: var(--s2) !important;
  border-color: var(--bd2) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,.3) !important;
}
.icard:hover::before { height: 100% !important; }
.icard-ic {
  font-size: 1.5rem !important;
  filter: saturate(0.8) !important;
  width: 36px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
}
.icard-b { flex: 1 !important; min-width: 0 !important; }
.icard-name {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  color: var(--tx) !important;
  margin-bottom: 4px !important;
  letter-spacing: -0.005em !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.icard-sym {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.55rem !important;
  color: var(--dim) !important;
  font-weight: 500 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  opacity: 1 !important;
}
.icard-price {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 1.15rem !important;
  font-weight: 600 !important;
  color: var(--tx) !important;
  letter-spacing: -0.025em !important;
  line-height: 1.15 !important;
  display: flex !important;
  align-items: baseline !important;
  gap: 4px !important;
}
.icard-unit {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.55rem !important;
  color: var(--sub) !important;
  font-weight: 500 !important;
}
.icard .hcard-chg { margin-top: 6px !important; }
.icard canvas.sp { display: none !important; }

/* DEMIR FIYATLARI */
.dem-note {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.75rem !important;
  color: var(--sub) !important;
  margin: 0 0 18px 0 !important;
  padding: 12px 16px !important;
  background: rgba(240,180,41,0.04) !important;
  border-left: 3px solid var(--gold) !important;
  border-radius: 0 8px 8px 0 !important;
  line-height: 1.5 !important;
}
.dem-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
}
.dem-card {
  background: var(--s1) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 12px !important;
  padding: 16px 18px !important;
  transition: all 0.22s cubic-bezier(0.16, 1, 0.3, 1) !important;
  position: relative !important;
  overflow: hidden !important;
}
.dem-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 2px !important;
  height: 0 !important;
  background: var(--gold) !important;
  transition: height 0.3s ease !important;
}
.dem-card:hover {
  background: var(--s2) !important;
  border-color: var(--bd2) !important;
  transform: translateY(-2px) !important;
}
.dem-card:hover::before { height: 100% !important; }
.dem-card-h {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.72rem !important;
  color: var(--sub) !important;
  margin-bottom: 8px !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.dem-card-v {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  color: var(--gold) !important;
  letter-spacing: -0.025em !important;
}
.dem-table-wrap {
  background: var(--s1) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}
.dem-table { font-family: 'Hanken Grotesk', sans-serif !important; width: 100% !important; }
.dem-table thead th {
  background: var(--s2) !important;
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  color: var(--sub) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--bd) !important;
}
.dem-table thead th:first-child { color: var(--gold) !important; padding-left: 24px !important; }
.dem-table tbody td {
  padding: 13px 18px !important;
  border-bottom: 1px solid var(--bd) !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.85rem !important;
  font-variant-numeric: tabular-nums !important;
  color: var(--tx) !important;
  letter-spacing: -0.02em !important;
}
.dem-table tbody tr { transition: background 0.15s !important; }
.dem-table tbody tr:nth-child(even) { background: rgba(255,255,255,0.015) !important; }
.dem-table tbody tr:hover { background: rgba(240,180,41,0.04) !important; }
.dem-table .dem-city {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-weight: 600 !important;
  color: var(--tx) !important;
  padding-left: 24px !important;
  letter-spacing: -0.005em !important;
  font-size: 0.85rem !important;
}

/* BX NEWS - kompakt */
.bx-news .bx-slider { height: 340px !important; }
.bx-news .section-hdr {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin-bottom: 20px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid var(--bd) !important;
}
.bx-news .sh-icon { display: none !important; }
.bx-news .sh-title {
  font-family: 'Clash Display', 'Hanken Grotesk', sans-serif !important;
  font-size: 1.45rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.025em !important;
  color: var(--tx) !important;
  padding-left: 32px !important;
  position: relative !important;
}
.bx-news .sh-title::before {
  content: '' !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 20px !important;
  height: 2px !important;
  background: var(--gold) !important;
}
.bx-news .sh-sub {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.7rem !important;
  color: var(--sub) !important;
  letter-spacing: 0.05em !important;
  margin-left: auto !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  background: var(--s2) !important;
  border-radius: 5px !important;
  border: 1px solid var(--bd) !important;
}

/* CHART MODAL */
#cmodal { background: rgba(10,13,18,0.85) !important; backdrop-filter: blur(16px) !important; }
#cbox {
  background: var(--s1) !important;
  border: 1px solid var(--bd2) !important;
  border-radius: 16px !important;
  padding: 28px !important;
  box-shadow: 0 40px 80px rgba(0,0,0,.6) !important;
}
.cm-ttl {
  font-family: 'Clash Display', 'Hanken Grotesk', sans-serif !important;
  font-size: 1.2rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  color: var(--tx) !important;
}
.cm-price {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 1.9rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
  margin-top: 4px !important;
}
.cm-sub {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.68rem !important;
  color: var(--sub) !important;
  letter-spacing: 0.05em !important;
  text-transform: uppercase !important;
  margin-top: 4px !important;
}
.cm-cls {
  background: var(--s2) !important;
  border: 1px solid var(--bd2) !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  font-size: 1rem !important;
  transition: all 0.18s !important;
}
.cm-cls:hover { background: var(--rbg) !important; border-color: var(--red) !important; color: var(--red) !important; }
.cm-toolbar { gap: 6px !important; margin-bottom: 18px !important; padding-bottom: 16px !important; border-bottom: 1px solid var(--bd) !important; }
.cmbtn {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  border: 1px solid var(--bd) !important;
  background: var(--s2) !important;
  color: var(--sub) !important;
  letter-spacing: 0.04em !important;
  transition: all 0.18s !important;
}
.cmbtn:hover { color: var(--tx) !important; border-color: var(--bd2) !important; }
.cmbtn.on { background: var(--gold) !important; border-color: var(--gold) !important; color: #0a0d12 !important; }
#cm-stats {
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 1px !important;
  background: var(--bd) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  margin-top: 8px !important;
}
.cs { background: var(--s2) !important; border-radius: 0 !important; padding: 14px !important; text-align: left !important; }
.cs-l {
  font-family: 'Hanken Grotesk', sans-serif !important;
  font-size: 0.55rem !important;
  font-weight: 600 !important;
  color: var(--sub) !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  margin-bottom: 6px !important;
}
.cs-v {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  color: var(--tx) !important;
  letter-spacing: -0.02em !important;
}

/* SCROLL PROGRESS BAR */
@property --scroll {
  syntax: '<length>';
  initial-value: 0px;
  inherits: false;
}
body::before {
  content: '' !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--gold), #ffd166, var(--gold)) !important;
  background-size: 200% 100% !important;
  transform-origin: left !important;
  z-index: 99998 !important;
  pointer-events: none !important;
  animation: scrollProgress linear !important;
  animation-timeline: scroll(root) !important;
  box-shadow: 0 0 12px rgba(240,180,41,0.6) !important;
}
@keyframes scrollProgress {
  from { transform: scaleX(0); background-position: 0% 0; }
  to { transform: scaleX(1); background-position: 100% 0; }
}

/* GRADIENT ORBS */
.wrap::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important;
  right: -200px !important;
  width: 500px !important;
  height: 500px !important;
  background: radial-gradient(circle, rgba(240,180,41,0.08) 0%, transparent 60%) !important;
  pointer-events: none !important;
  z-index: -1 !important;
  filter: blur(40px) !important;
}
.wrap::after {
  content: '' !important;
  position: absolute !important;
  top: 400px !important;
  left: -200px !important;
  width: 400px !important;
  height: 400px !important;
  background: radial-gradient(circle, rgba(240,180,41,0.05) 0%, transparent 70%) !important;
  pointer-events: none !important;
  z-index: -1 !important;
  filter: blur(60px) !important;
}

/* CARD REVEAL ANIMATION */
@keyframes cardReveal {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}
.hurda-grid > *, .prec-grid > *, .ind-grid > *,
.dem-summary > * {
  animation: cardReveal 0.6s cubic-bezier(0.16, 1, 0.3, 1) backwards !important;
}
.hurda-grid > *:nth-child(1), .prec-grid > *:nth-child(1), .ind-grid > *:nth-child(1),
.dem-summary > *:nth-child(1) { animation-delay: 0.05s !important; }
.hurda-grid > *:nth-child(2), .prec-grid > *:nth-child(2), .ind-grid > *:nth-child(2),
.dem-summary > *:nth-child(2) { animation-delay: 0.10s !important; }
.hurda-grid > *:nth-child(3), .prec-grid > *:nth-child(3), .ind-grid > *:nth-child(3),
.dem-summary > *:nth-child(3) { animation-delay: 0.15s !important; }
.hurda-grid > *:nth-child(4), .prec-grid > *:nth-child(4), .ind-grid > *:nth-child(4),
.dem-summary > *:nth-child(4) { animation-delay: 0.20s !important; }
.hurda-grid > *:nth-child(5), .ind-grid > *:nth-child(5) { animation-delay: 0.25s !important; }
.hurda-grid > *:nth-child(6), .ind-grid > *:nth-child(6) { animation-delay: 0.30s !important; }
.hurda-grid > *:nth-child(7), .ind-grid > *:nth-child(7) { animation-delay: 0.35s !important; }
.hurda-grid > *:nth-child(8), .ind-grid > *:nth-child(8) { animation-delay: 0.40s !important; }
.hurda-grid > *:nth-child(n+9) { animation-delay: 0.45s !important; }

/* EN YUKSEK / EN DUSUK ROZET */
.hcard.is-highest {
  border-color: var(--gold) !important;
  background: linear-gradient(155deg, rgba(240,180,41,0.05), var(--s1)) !important;
}
.hcard.is-highest::after {
  content: 'EN YUKSEK' !important;
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  color: #0a0d12 !important;
  background: var(--gold) !important;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  z-index: 2 !important;
}
.hcard.is-highest::before { height: 100% !important; }
.hcard.is-lowest::after {
  content: 'EN DUSUK' !important;
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 8px !important;
  font-weight: 700 !important;
  letter-spacing: 0.15em !important;
  color: var(--sub) !important;
  background: var(--s3) !important;
  padding: 3px 7px !important;
  border-radius: 4px !important;
  text-transform: uppercase !important;
  border: 1px solid var(--bd2) !important;
  z-index: 2 !important;
}

/* SECTION SUMMARY BAR */
.section-summary {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-top: 16px !important;
  padding: 14px 20px !important;
  background: linear-gradient(135deg, rgba(240,180,41,0.04), rgba(255,255,255,0.01)) !important;
  border: 1px solid var(--bd) !important;
  border-radius: 10px !important;
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.7rem !important;
  letter-spacing: 0.05em !important;
}
.section-summary .ss-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: var(--sub) !important;
  text-transform: uppercase !important;
}
.section-summary .ss-item strong {
  color: var(--tx) !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
  font-size: 0.85rem !important;
  margin-left: 2px !important;
  text-transform: none !important;
}
.section-summary .ss-item.is-highlight strong { color: var(--gold) !important; }
.section-summary .ss-divider {
  width: 1px !important;
  height: 14px !important;
  background: var(--bd2) !important;
}

/* CARD DEPTH */
.hcard, .pcard, .icard, .dem-card {
  box-shadow: 0 1px 0 rgba(255,255,255,0.02) inset !important;
}
.hcard:hover, .pcard:hover, .icard:hover, .dem-card:hover {
  box-shadow: 0 1px 0 rgba(255,255,255,0.04) inset, 0 16px 32px rgba(0,0,0,0.3), 0 4px 8px rgba(0,0,0,0.15) !important;
}

/* FOCUS */
*:focus-visible {
  outline: 2px solid var(--gold) !important;
  outline-offset: 3px !important;
  border-radius: 6px !important;
}

/* HOVER MICRO */
.sec-title { transition: padding-left 0.3s ease !important; }
.section:hover > .sec-title::before { width: 24px !important; transition: width 0.3s ease !important; }

/* EMOJI POLISH */
.icard-ic, .pcard-icon, .dem-card-h, .hc-icon {
  filter: saturate(0.75) brightness(0.92) !important;
  opacity: 0.92 !important;
  transition: filter 0.2s ease, opacity 0.2s ease !important;
  display: inline-block !important;
}
.icard:hover .icard-ic, .pcard:hover .pcard-icon, .dem-card:hover .dem-card-h {
  filter: saturate(1) brightness(1) !important;
  opacity: 1 !important;
}
.icard-ic { font-size: 1.4rem !important; width: 32px !important; }
.pcard-icon { font-size: 1.5rem !important; }

/* RESPONSIVE */
@media (max-width: 1100px) {
  .hurda-grid { grid-template-columns: repeat(3, 1fr) !important; }
  .prec-grid, .ind-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .bx-news .bx-slider { height: 320px !important; }
}
@media (max-width: 768px) {
  body > h1[style*="9999"], body > h1[style*="absolute"] {
    margin: 12px auto 20px !important;
    padding: 24px 20px !important;
    font-size: clamp(22px, 6vw, 30px) !important;
  }
  body > h1[style*="9999"]::after, body > h1[style*="absolute"]::after {
    font-size: 13.5px !important;
    margin-top: 14px !important;
  }
  .wrap { padding: 16px 16px 32px !important; }
  .section, .bx-news { margin-bottom: 32px !important; }
  .sec-title, .bx-news .sh-title { font-size: 1.15rem !important; padding-left: 24px !important; }
  .hurda-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 8px !important; }
  .hcard { padding: 14px !important; min-height: 100px !important; }
  .hcard-price { font-size: 1.2rem !important; }
  .prec-grid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .ind-grid { grid-template-columns: 1fr !important; gap: 8px !important; }
  .icard { padding: 14px !important; }
  .dem-summary { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
  .dem-table thead th, .dem-table tbody td { padding: 10px 14px !important; font-size: 0.74rem !important; }
}
@media (max-width: 480px) {
  .hurda-grid, .prec-grid { grid-template-columns: 1fr !important; }
}

/* REDUCED MOTION */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
  body::before { animation: none !important; transform: scaleX(0) !important; }
  .hurda-grid > *, .prec-grid > *, .ind-grid > *, .dem-summary > * {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}

/* PRINT */
@media print {
  body::before, .wrap::before, .wrap::after { display: none !important; }
  .hcard, .pcard, .icard, .dem-card { break-inside: avoid !important; }
}


/* === PRICE HEIGHT FIX v2 === */
.hcard-price { display: block !important; line-height: 1.4 !important; min-height: 1.4em !important; }
.pcard-price { display: block !important; line-height: 1.4 !important; min-height: 1.4em !important; }
.icard-price { display: block !important; line-height: 1.4 !important; min-height: 1.4em !important; }
.hcard-unit, .pcard-unit, .icard-unit { margin-left: 4px !important; }


/* === FLEX LINE-HEIGHT FIX v3 === */
.pcard-top { line-height: 1.4 !important; min-height: 32px !important; align-items: center !important; }
.pcard-name { line-height: 1.4 !important; min-height: 1.4em !important; display: block !important; }
.pcard-icon, .pcard-sym { line-height: 1.4 !important; }
.icard-b { line-height: 1.4 !important; min-height: 60px !important; display: flex !important; flex-direction: column !important; justify-content: center !important; }
.icard-name { line-height: 1.4 !important; min-height: 1.4em !important; }
.icard-name, .icard-sym { line-height: 1.4 !important; }
.dem-card-h { line-height: 1.4 !important; min-height: 1.4em !important; }
.dem-card-v { line-height: 1.4 !important; min-height: 1.4em !important; }
.hcard-name { line-height: 1.3 !important; }


/* === ICARD FLEX ROW FIX v4 === */
.icard { flex-direction: row !important; align-items: center !important; }
.icard-b { flex: 1 1 auto !important; min-width: 0 !important; display: flex !important; flex-direction: column !important; justify-content: center !important; align-items: flex-start !important; min-height: 60px !important; }
.icard-ic { flex: 0 0 auto !important; }
.pcard-top { flex-direction: row !important; align-items: center !important; justify-content: space-between !important; min-height: 32px !important; }
.pcard { display: block !important; }


/* === MIN-HEIGHT CLEANUP v5 === */
.hcard-name { min-height: 2.6em !important; line-height: 1.3 !important; display: -webkit-box !important; }
.hcard-price { min-height: 0 !important; line-height: 1.2 !important; display: flex !important; align-items: baseline !important; }
.hcard-chg, .hcard .up, .hcard .dn, .hcard .fl { min-height: 0 !important; line-height: 1.2 !important; height: auto !important; display: inline-flex !important; align-items: center !important; }
.pcard-top { min-height: 0 !important; line-height: normal !important; display: flex !important; align-items: center !important; justify-content: space-between !important; }
.pcard-name { min-height: 0 !important; line-height: 1.2 !important; display: block !important; height: auto !important; }
.pcard-price { min-height: 0 !important; line-height: 1.2 !important; display: flex !important; align-items: baseline !important; height: auto !important; }
.pcard .hcard-chg { min-height: 0 !important; line-height: 1.2 !important; height: auto !important; display: inline-flex !important; align-items: center !important; }
.pcard-icon, .pcard-sym { line-height: normal !important; }
.icard-b { min-height: 0 !important; display: flex !important; flex-direction: column !important; justify-content: center !important; gap: 4px !important; }
.icard-name { min-height: 0 !important; line-height: 1.2 !important; display: flex !important; align-items: center !important; gap: 6px !important; height: auto !important; }
.icard-price { min-height: 0 !important; line-height: 1.2 !important; display: flex !important; align-items: baseline !important; height: auto !important; }
.icard .hcard-chg { min-height: 0 !important; line-height: 1.2 !important; height: auto !important; display: inline-flex !important; align-items: center !important; align-self: flex-start !important; }
.dem-card-h { min-height: 0 !important; line-height: 1.2 !important; height: auto !important; }
.dem-card-v { min-height: 0 !important; line-height: 1.2 !important; height: auto !important; }


/* === PCARD TOP DEV ICON FIX v6 === */
.pcard-icon { height: auto !important; min-height: 0 !important; max-height: 2rem !important; line-height: 1.2 !important; display: inline-block !important; flex-shrink: 0 !important; }
.pcard-sym { height: auto !important; min-height: 0 !important; max-height: 1.5rem !important; line-height: 1.2 !important; flex-shrink: 0 !important; }
.pcard-top { max-height: 36px !important; height: 36px !important; line-height: 1.2 !important; align-items: center !important; }
.hcard-name { max-height: 2.6em !important; height: auto !important; }
canvas.sp, .hcard canvas, .pcard canvas, .icard canvas { display: none !important; width: 0 !important; height: 0 !important; }
