:root {
  --color-bg: #FAFAFA;
  --color-white: #FFFFFF;
  --color-black: #0A0A0A;
  --color-gray-dark: #333333;
  --color-gray-light: #E0E0E0;
  --color-orange: #FF6B00;
  --color-pink: #FF4081;
  --color-yellow: #FFD600;
  --color-green: #00C853;
  --border-width: 3px;
  --shadow-main: 8px 8px 0 #000
}
body.light-theme {
  background-color:var(--color-bg);
  color:var(--color-black);
  font-family:Space Grotesk,sans-serif;
  line-height:1.5;
  margin:0;
  padding:0
}
.container {
  max-width:1000px;
  margin:0 auto;
  padding:0 20px
}
.insights-header {
  background:var(--color-black);
  color:var(--color-white);
  padding:40px 0;
  border-bottom:var(--border-width) solid var(--color-black);
  margin-bottom:60px
}
.back-btn {
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--color-white);
  text-decoration:none;
  font-family:Space Mono,monospace;
  font-weight:700;
  font-size:.9rem;
  padding:8px 16px;
  border:2px solid var(--color-white);
  margin-bottom:30px;
  transition:all .2s ease
}
.back-btn:hover {
  background:var(--color-white);
  color:var(--color-black);
  transform:translate(-2px,-2px);
  box-shadow:4px 4px 0 var(--color-pink)
}
.header-main h1 {
  font-size:clamp(2rem,5vw,3.5rem);
  text-transform:uppercase;
  line-height:1;
  margin:0 0 10px;
  font-weight:800;
  letter-spacing:-1px
}
.subtitle {
  font-family:Space Mono,monospace;
  font-size:1.1rem;
  color:var(--color-gray-light);
  max-width:600px
}
.insights-section {
  margin-bottom:80px
}
.section-header {
  display:inline-block;
  padding:10px 20px;
  border:var(--border-width) solid var(--color-black);
  background:var(--color-black);
  color:var(--color-white);
  margin-bottom:30px;
  box-shadow:6px 6px 0 var(--color-black)
}
.section-header h2 {
  margin:0;
  text-transform:uppercase;
  font-size:1.5rem;
  font-weight:800
}
.section-header.accent-orange {
  box-shadow:6px 6px 0 var(--color-orange)
}
.section-header.accent-pink {
  box-shadow:6px 6px 0 var(--color-pink)
}
.section-header.accent-yellow {
  box-shadow:6px 6px 0 var(--color-yellow)
}
.section-header.accent-green {
  box-shadow:6px 6px 0 var(--color-green)
}
.intro-card {
  background:var(--color-white);
  border:var(--border-width) solid var(--color-black);
  padding:40px;
  box-shadow:var(--shadow-main);
  position:relative
}
.lead-text {
  font-size:1.4rem;
  font-weight:500;
  margin-bottom:30px
}
.stat-highlight {
  background:var(--color-yellow);
  padding:15px 25px;
  border:var(--border-width) solid var(--color-black);
  display:inline-flex;
  flex-direction:column
}
.stat-highlight .label {
  font-family:Space Mono,monospace;
  font-size:.8rem;
  text-transform:uppercase;
  font-weight:700
}
.stat-highlight .value {
  font-size:1.2rem;
  font-weight:800
}
.table-container {
  overflow-x:auto;
  border:var(--border-width) solid var(--color-black);
  box-shadow:var(--shadow-main)
}
.neobrutalist-table {
  width:100%;
  border-collapse:collapse;
  background:var(--color-white)
}
.neobrutalist-table th {
  background:var(--color-black);
  color:var(--color-white);
  text-align:left;
  padding:15px 20px;
  text-transform:uppercase;
  font-family:Space Mono,monospace
}
.neobrutalist-table td {
  padding:15px 20px;
  border:1px solid var(--color-black);
  font-size:1.1rem
}
.neobrutalist-table tr:nth-child(2n) {
  background:#00000005
}
.grid-container {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(400px,1fr));
  gap:30px
}
.insight-card {
  background:var(--color-white);
  border:var(--border-width) solid var(--color-black);
  padding:30px;
  box-shadow:8px 8px 0 var(--color-black);
  transition:all .2s ease;
  display:flex;
  flex-direction:column
}
.insight-card:hover {
  transform:translate(-4px,-4px);
  box-shadow:12px 12px 0 var(--color-black)
}
.insight-card h3 {
  font-size:1.8rem;
  text-transform:uppercase;
  margin:0 0 20px;
  border-bottom:3px solid var(--color-black);
  padding-bottom:10px
}
.insight-card p {
  margin-bottom:15px
}
.card-footer {
  margin-top:auto;
  background:var(--color-black);
  color:var(--color-white);
  padding:10px;
  font-family:Space Mono,monospace;
  font-size:.85rem;
  font-style:italic
}
.theme-block {
  background:var(--color-white);
  border:var(--border-width) solid var(--color-black);
  margin-bottom:40px;
  overflow:hidden
}
.theme-block h4 {
  background:var(--color-black);
  color:var(--color-white);
  margin:0;
  padding:15px 25px;
  text-transform:uppercase;
  font-size:1.2rem
}
.theme-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:var(--border-width) solid var(--color-black)
}
.theme-col {
  padding:25px
}
.theme-col:first-child {
  border-right:var(--border-width) solid var(--color-black);
  background:#00000008
}
.theme-col h5 {
  text-transform:uppercase;
  font-family:Space Mono,monospace;
  margin-bottom:15px;
  font-size:.9rem;
  color:var(--color-pink)
}
code.tech {
  background:var(--brand-orange-light);
  color:var(--brand-blue);
  padding:2px 6px;
  font-size:.9rem;
  border:1px solid var(--brand-orange);
  display:inline-block;
  word-break:break-word;
  max-width:100%;
  box-sizing:border-box
}
@media(max-width:480px) {
  code.tech {
    font-size:.8rem;
    padding:2px 4px
  }
}
.learning-list {
  list-style:none;
  padding:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px
}
.learning-list li {
  background:var(--color-white);
  border:2px solid var(--color-black);
  padding:20px;
  position:relative;
  box-shadow:4px 4px 0 var(--color-black)
}
.learning-list li:before {
  margin-right:10px
}
.final-takeaway {
  margin-top:40px;
  background:var(--color-orange);
  color:var(--color-white);
  padding:30px;
  text-align: center;
  border:var(--border-width) solid var(--color-black);
  box-shadow:10px 10px 0 var(--color-black);
  font-size:1.3rem;
  font-weight:700
}
.feedback-footer {
  text-align:center;
  padding:60px 0;
  border-top:var(--border-width) solid var(--color-black);
  margin-top:20px;
  font-family:Space Mono,monospace;
  font-size:.9rem
}
@media(max-width:768px) {
  .grid-container,
  .theme-grid,
  .learning-list {
    grid-template-columns:1fr
  }
  .theme-col:first-child {
    border-right:none;
    border-bottom:var(--border-width) solid var(--color-black)
  }
  .header-main h1 {
    font-size:2.2rem
  }
  .intro-card {
    padding:20px
  }
  .lead-text {
    font-size:1.1rem
  }
}