.green-dashboard {
  --bg: #061d17;
  --panel: #0a2921;
  --line: #245b48;
  --muted: #a6c6b7;
  --accent: #c2f57f;
  background: linear-gradient(rgba(3, 22, 17, .82), rgba(3, 22, 17, .9)), url('assets/market-hero.png?v=2') center bottom / cover fixed;
}
.green-dashboard header {background: rgba(5, 27, 21, .86); border-color: #28553f;}
.green-dashboard .panel {
  background: linear-gradient(135deg, rgba(19, 65, 47, .88), rgba(4, 29, 22, .96));
  border-color: #2d6851;
  box-shadow: 0 16px 45px rgba(0, 12, 7, .25), inset 0 1px rgba(192, 245, 127, .05);
  backdrop-filter: blur(12px);
}
.green-dashboard .section-heading .tag {
  color: var(--accent);
  border-color: #427554;
  background: #173c29;
}
.green-dashboard .notice {background: rgba(14, 48, 32, .94); border-radius: 12px;}
.green-dashboard .table-wrap {
  border: 1px solid #285640;
  border-radius: 12px;
  background: rgba(4, 29, 22, .72);
}
.green-dashboard table th {background: rgba(21, 63, 44, .76); color: #b7d5c5;}
.green-dashboard table td {border-color: #214936; padding-block: 18px;}
.green-dashboard tbody tr:nth-child(even) {background: rgba(35, 76, 51, .14);}
.green-dashboard tbody tr:hover {background: rgba(104, 167, 88, .12);}
.green-dashboard tbody tr:last-child td {border-bottom: 0;}
.green-dashboard .positive, .green-dashboard .negative {font-weight: bold;}
.green-dashboard .negative {color: #ff9b91;}
.green-dashboard button {background: linear-gradient(135deg, #d1ff8d, #b1e873); box-shadow: 0 4px 16px rgba(170, 235, 104, .09);}
.green-dashboard button.secondary {background: rgba(3, 31, 22, .6); border-color: #79b99a; box-shadow: none;}
.green-dashboard input, .green-dashboard select, .green-dashboard textarea {
  background: rgba(4, 29, 22, .88);
  border-color: #5d8c71;
  color: #eff8ef;
}
.green-dashboard input:focus, .green-dashboard select:focus, .green-dashboard textarea:focus {border-color: var(--accent);}
.green-dashboard .columns > .panel {display: flex; flex-direction: column;}
.green-dashboard #settings {padding: 20px; border: 1px solid #285640; border-radius: 12px; background: rgba(3, 27, 19, .5);}
.green-dashboard #settings button {width: 100%;}
.green-dashboard #report-content {color: #d7ebdf;}
.green-dashboard #report-content pre {background: rgba(3, 27, 19, .68); border: 1px solid #285640; border-radius: 12px;}
.green-dashboard #report-content a {display: inline-block; padding: 10px 18px; border: 1px solid #81b16b; border-radius: 8px; text-decoration: none;}
.green-dashboard footer {color: #a6c6b7;}
@media (max-width: 800px) {
  .green-dashboard {background-attachment: scroll;}
  .green-dashboard .panel {padding: 18px; backdrop-filter: none;}
  .green-dashboard #settings {padding: 14px;}
}

.hero-image {
  min-height: 440px;
  padding: 68px 44px;
  margin: 24px 0;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: linear-gradient(to left, rgba(7, 20, 23, .7), rgba(7, 20, 23, .15) 55%, transparent), url('assets/market-hero.png?v=2') center / cover;
  overflow: hidden;
}
.hero-image h1 {font-size: clamp(44px, 5.2vw, 68px); text-shadow: 0 2px 24px #071417;}
.hero-image > p {max-width: 380px; text-shadow: 0 1px 10px #071417;}
.hero-image > p:last-child {color: #d5e6df;}
@media (max-width: 800px) {
  .hero-image {
    min-height: 460px;
    padding: 28px 22px 220px;
    background: linear-gradient(to bottom, #071417 0%, rgba(7,20,23,.93) 30%, rgba(7,20,23,.1) 75%), url('assets/market-hero.png?v=2') 25% bottom / auto 100%;
  }
  .hero-image h1 {font-size: 44px;}
}
