.market-pulse-page{
  background:#f5f7fa;
}

.market-hero{
  padding:34px 0 28px;
  text-align:center;
}

.market-hero h1{
  margin:0 0 10px;
  font-family:"Cormorant Garamond",serif;
  font-size:clamp(2.4rem,4vw,4rem);
  line-height:1;
  color:#091938;
}

.market-hero p{
  max-width:760px;
  margin:0 auto;
  color:#5d6b82;
  font-size:1.02rem;
  line-height:1.55;
}

.market-dashboard-section{
  padding:0 0 42px;
}

.market-dashboard-grid{
  display:grid;
  grid-template-columns:300px minmax(0,1fr);
  gap:18px;
  align-items:start;
}

.market-sidebar{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.market-content{
  min-width:0;
}

.market-card,
.fear-widget{
  background:#fff;
  border:1px solid #dbe3ee;
  border-radius:18px;
  box-shadow:0 8px 28px rgba(10,25,56,.06);
}

.market-card{
  padding:18px;
}

.compact-card h2,
.news-card h2{
  margin:0 0 8px;
  font-family:"Cormorant Garamond",serif;
  font-size:1.65rem;
  line-height:1;
  color:#162847;
}

.market-card p{
  margin:0;
  color:#627089;
  font-size:.92rem;
  line-height:1.45;
}

.market-card-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}

.market-card-header p{
  margin-top:6px;
}

.fear-widget{
  width:100%;
  border:none;
  padding:16px;
  cursor:pointer;
  text-align:left;
  color:#12233f;
  transition:transform .2s ease, box-shadow .2s ease;
}

.fear-widget:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 34px rgba(10,25,56,.1);
}

.fear-widget-top,
.fear-widget-bottom,
.side-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.fear-widget-top span,
.fear-widget-bottom span,
.side-heading span{
  color:#627089;
  font-size:.82rem;
  font-weight:700;
}

.fear-widget-top strong{
  font-size:2rem;
  line-height:1;
}

.fear-widget-bottom strong{
  color:#12233f;
}

.fear-dial{
  display:grid;
  place-items:center;
  margin:10px 0 8px;
}

.fear-dial-ring{
  position:relative;
  width:150px;
  height:78px;
  overflow:hidden;
}

.fear-dial-ring::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:150px;
  height:150px;
  border-radius:50%;
  background:
    conic-gradient(from 270deg,
      #be3f45 0deg,
      #c6a15b 90deg,
      #147a56 180deg,
      transparent 180deg,
      transparent 360deg
    );
}

.fear-dial-ring::after{
  content:"";
  position:absolute;
  left:18px;
  top:18px;
  width:114px;
  height:114px;
  border-radius:50%;
  background:#fff;
}

.fear-dial-needle{
  position:absolute;
  left:73px;
  bottom:0;
  width:4px;
  height:62px;
  background:#0b1f4d;
  border-radius:999px;
  transform-origin:bottom center;
  transform:rotate(-90deg);
  z-index:2;
  transition:transform .5s ease;
}

.fear-dial-centre{
  position:absolute;
  left:64px;
  bottom:0;
  width:22px;
  height:22px;
  border-radius:50%;
  background:#0b1f4d;
  border:4px solid #fff;
  z-index:3;
}

.state-pill{
  display:inline-flex;
  margin:4px 0 8px;
  padding:7px 10px;
  border-radius:999px;
  background:#eef3ff;
  color:#0b1f4d;
  font-weight:800;
  font-size:.9rem;
}

.market-list,
.watchlist{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:14px;
}

.market-list div,
.watchlist div{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid #e8edf5;
  border-radius:12px;
  background:#fbfcff;
}

.market-list span,
.watchlist span{
  color:#627089;
  font-size:.9rem;
}

.market-list strong,
.watchlist strong{
  color:#12233f;
}

.is-up{
  color:#147a56 !important;
}

.is-down{
  color:#be3f45 !important;
}

.news-feed{
  display:flex;
  flex-direction:column;
  gap:7px;
}

.news-item{
  position:relative;
  border:1px solid #e8edf5;
  border-left:4px solid #8591a7;
  border-radius:12px;
  padding:10px 118px 10px 14px;
  background:#fbfcff;
  min-height:58px;
}

.news-item{
    border-left:5px solid #8b97aa;
}

.news-item.is-bullish{
    border-left-color:#148157;
    background: rgba(100, 255, 100, 0.1);
}

.news-item.is-bearish{
    border-left-color:#c33d44;
    background: rgba(255, 100, 100, 0.1);
}

.news-item.is-neutral{
    border-left-color:#6b7b93;
}

.news-item a{
  display:block;
  color:inherit;
}

.news-loading{
  padding:14px 16px;
  border:1px dashed #dbe3ee;
  border-radius:12px;
  color:#627089;
  background:#fbfcff;
}

.news-title{
  margin:3px 0 0;
  color:#12233f;
  font-weight:800;
  font-size:.96rem;
  line-height:1.25;
}

.news-meta{
  display:block;
  color:#627089;
  font-size:.78rem;
  line-height:1.2;
}

.sentiment-pill{
    position:absolute;
    top:50%;
    right:14px;
    transform:translateY(-50%);

    display:flex;
    align-items:center;
    justify-content:center;

    height:34px;
    padding:0 14px;

    border-radius:999px;

    font-size:.82rem;
    font-weight:700;
    line-height:1;

    white-space:nowrap;
}

.sentiment-pill.is-bullish{
  background:#ecfaf4;
  color:#147a56;
}

.sentiment-pill.is-bearish{
  background:#fff2f3;
  color:#be3f45;
}

.sentiment-pill.is-neutral{
  background:#eef3ff;
  color:#5b6477;
}

/* Modal */
.fear-modal{
  position:fixed;
  inset:0;
  z-index:99999;
  display:none;
}

.fear-modal.is-open{
  display:block;
}

.fear-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(6,26,58,.42);
  backdrop-filter:blur(3px);
  opacity:0;
  animation:fadeIn .22s ease forwards;
}

.fear-modal-panel{
  position:relative;
  width:min(860px, calc(100% - 32px));
  margin:8vh auto 0;
  background:#fff;
  border-radius:24px;
  border:1px solid #dbe3ee;
  box-shadow:0 30px 80px rgba(6,26,58,.25);
  padding:26px;
  transform:translateY(18px) scale(.98);
  opacity:0;
  animation:modalIn .24s ease forwards;
}

.fear-modal-close{
  position:absolute;
  top:16px;
  right:16px;
  width:36px;
  height:36px;
  border:none;
  border-radius:50%;
  background:#eef3ff;
  color:#0b1f4d;
  cursor:pointer;
  font-size:1.4rem;
  line-height:1;
}

.fear-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:22px;
  margin-bottom:20px;
  padding-right:42px;
}

.fear-modal-header h2{
  margin:0 0 8px;
  font-family:"Cormorant Garamond",serif;
  font-size:2.4rem;
  line-height:1;
  color:#091938;
}

.fear-modal-header p{
  margin:0;
  color:#627089;
  line-height:1.45;
}

.fear-modal-score{
  text-align:right;
}

.fear-modal-score strong{
  display:block;
  font-size:3rem;
  line-height:1;
  color:#12233f;
}

.fear-modal-score span{
  color:#627089;
  font-weight:800;
}

#fearGreedChart{
  width:100%;
  height:180px;
}

@keyframes fadeIn{
  to{opacity:1;}
}

@keyframes modalIn{
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@media (max-width: 980px){
  .market-dashboard-grid{
    grid-template-columns:1fr;
  }

  .market-sidebar{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .fear-widget{
    grid-column:1 / -1;
  }
}

@media (max-width: 680px){
  .market-hero{
    padding:28px 0 22px;
  }

  .market-dashboard-grid{
    gap:14px;
  }

  .market-sidebar{
    grid-template-columns:1fr;
  }

  .market-card-header,
  .fear-modal-header{
    flex-direction:column;
  }

  .fear-modal-panel{
    margin:5vh auto 0;
    padding:20px;
  }

  .fear-modal-header{
    padding-right:36px;
  }
}
.news-score-row{
  display:flex;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
  margin-top:.35rem;
}
.news-chip,
.confirmation-pill{
  display:inline-flex;
  align-items:center;
  border-radius:999px;
  padding:.18rem .55rem;
  font-size:.72rem;
  font-weight:700;
  background:#f3f6fb;
  color:#5f6f89;
}
.confirmation-pill{
  background:#fff7e6;
  color:#8a650f;
}

/* v9 enhancements: topic filters, taller fear chart, and clean metadata rendering */
.news-toolbar{
  display:flex;
  align-items:center;
  gap:.45rem;
  flex-wrap:wrap;
  margin:-2px 0 12px;
}

.topic-pill{
  border:1px solid #dbe3ee;
  background:#f8fbff;
  color:#51617b;
  border-radius:999px;
  padding:.38rem .7rem;
  font-size:.78rem;
  font-weight:800;
  cursor:pointer;
  transition:background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.topic-pill:hover{
  transform:translateY(-1px);
  border-color:#c8d4e5;
}

.topic-pill.is-active{
  background:#0b1f4d;
  border-color:#0b1f4d;
  color:#fff;
}

.topic-pill span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:1.35rem;
  margin-left:.28rem;
  padding:0 .3rem;
  border-radius:999px;
  background:rgba(98,112,137,.12);
  font-size:.7rem;
}

.topic-pill.is-active span{
  background:rgba(255,255,255,.18);
}

.topic-chip{
  background:#eef7ff;
  color:#285b85;
}

.fear-modal-panel{
  width:min(940px, calc(100% - 32px));
  margin:5vh auto 0;
  padding:30px;
}

.fear-chart-wrap{
  position:relative;
  width:100%;
  min-height:270px;
}

#fearGreedChart{
  width:100%;
  height:270px;
  display:block;
}

.fear-chart-tooltip{
  position:absolute;
  z-index:5;
  min-width:92px;
  padding:.45rem .55rem;
  border-radius:12px;
  background:#0b1f4d;
  color:#fff;
  box-shadow:0 12px 30px rgba(6,26,58,.2);
  pointer-events:none;
  transform:translate(-50%, calc(-100% - 12px));
  opacity:0;
  visibility:hidden;
  transition:opacity .12s ease, visibility .12s ease;
  text-align:center;
}

.fear-chart-tooltip.is-visible{
  opacity:1;
  visibility:visible;
}

.fear-chart-tooltip strong,
.fear-chart-tooltip span,
.fear-chart-tooltip small{
  display:block;
  line-height:1.15;
}

.fear-chart-tooltip strong{
  font-size:1.15rem;
}

.fear-chart-tooltip span{
  font-weight:800;
  font-size:.78rem;
  color:#dbe7ff;
}

.fear-chart-tooltip small{
  margin-top:.2rem;
  font-size:.68rem;
  color:#b7c6e1;
}

.fear-chart-tooltip::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6px;
  width:12px;
  height:12px;
  background:#0b1f4d;
  transform:translateX(-50%) rotate(45deg);
}

@media (max-width: 680px){
  .news-item{
    padding-right:14px;
  }

  .sentiment-pill{
    position:static;
    transform:none;
    height:30px;
    display:inline-flex;
  }

  .fear-chart-wrap,
  #fearGreedChart{
    min-height:230px;
    height:230px;
  }
}
