:root{
  --navy:#111d39;--navy2:#17355d;--ink:#10213f;--muted:#73829a;
  --line:#dfe6ef;--bg:#f4f7fb;--green:#00866b;--red:#e23b4b;
  --orange:#ee8900;--softgreen:#eefaf5;--softred:#fff1f2;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,"Noto Sans JP","Yu Gothic",system-ui,sans-serif}
a{color:inherit;text-decoration:none}
.topbar{height:54px;background:#131d32;display:flex;align-items:center;padding:0 18px}
.topbar img{height:38px;width:auto;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:16px}
.breadcrumb{font-size:11px;color:var(--muted);margin:0 0 10px}
.hero{display:flex;align-items:center;justify-content:space-between;gap:20px;background:linear-gradient(110deg,#112044,#12375c 70%,#075d50);border-radius:15px;color:#fff;padding:15px 18px}
.hero small{font-size:9px;letter-spacing:.18em;font-weight:800;color:#6fe3b9}
.hero h1{margin:3px 0 2px;font-size:24px;line-height:1.15}
.hero p{margin:0;color:#dce7f4;font-size:10px}
.hero-time{text-align:right;white-space:nowrap;color:#dce7f4;font-size:10px}
.hero-time b{display:block;color:#fff;font-size:13px;margin-top:3px}

.summary{background:#fff;border:1px solid var(--line);border-radius:14px;margin-top:10px;padding:13px 15px}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:9px}
.section-head h2{font-size:16px;margin:0}
.judge-time{font-size:9px;color:var(--muted);white-space:nowrap}
.overall-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.overall-item{border:1px solid #e7edf4;border-radius:10px;padding:9px 10px;min-width:0}
.overall-item .label{font-size:10px;color:var(--muted);font-weight:700}
.overall-item .line{display:flex;align-items:center;gap:8px;margin-top:4px;min-width:0}
.stars{font-size:14px;letter-spacing:.03em;color:var(--orange);white-space:nowrap}
.overall-item strong{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.market-panel{background:#fff;border:1px solid var(--line);border-radius:14px;margin-top:10px;padding:12px 14px}
.market-groups{display:grid;grid-template-columns:repeat(2,1fr);gap:0 22px}
.market-row{display:grid;grid-template-columns:minmax(112px,1fr) 92px minmax(125px,1.45fr) 68px;align-items:center;gap:8px;min-height:38px;border-bottom:1px solid #edf1f6}
.market-row:last-child{border-bottom:0}
.market-name{font-size:11px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.market-name span{margin-right:5px}
.market-stars{font-size:13px;color:var(--orange);white-space:nowrap;letter-spacing:.02em}
.market-comment{font-size:10px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.market-change{text-align:right;font-size:10px;font-weight:800;white-space:nowrap}
.up{color:var(--green)}.down{color:var(--red)}.flat{color:#53637a}.na{color:#9aa7b9}
.market-note{font-size:9px;color:var(--muted);margin:8px 0 0;line-height:1.5}

.lower{display:grid;grid-template-columns:1.05fr .95fr;gap:10px;margin-top:10px}
.box{background:#fff;border:1px solid var(--line);border-radius:14px;padding:13px 14px;min-height:220px}
.box h2{font-size:15px;margin:0 0 9px}
.focus{border-left:4px solid var(--orange)}
.focus-main{font-size:14px;font-weight:900;margin:4px 0 5px}
.focus-sub{font-size:10px;color:var(--muted)}
.news-item{padding:7px 0;border-bottom:1px solid #edf1f6;font-size:10px;line-height:1.45}
.news-item:last-child{border-bottom:0}
.news-mark{color:var(--orange);font-weight:900;margin-right:5px}
.indicator-table{width:100%;border-collapse:collapse;font-size:9px}
.indicator-table th,.indicator-table td{padding:7px 5px;border-bottom:1px solid #edf1f6;text-align:left}
.indicator-table th{color:#66758c;background:#f8fafc}
.footer-note{font-size:9px;color:var(--muted);line-height:1.5;margin-top:9px}

@media(max-width:720px){
  .topbar{height:50px;padding:0 10px}.topbar img{height:34px}
  .wrap{padding:9px}
  .hero{padding:12px;gap:8px}.hero h1{font-size:20px}.hero-time{font-size:8px}.hero-time b{font-size:10px}
  .overall-grid{grid-template-columns:repeat(2,1fr)}
  .overall-item{padding:8px}.stars{font-size:12px}.overall-item strong{font-size:10px}
  .market-groups{grid-template-columns:1fr}
  .market-row{grid-template-columns:102px 80px minmax(100px,1fr) 55px;gap:5px;min-height:36px}
  .market-name{font-size:10px}.market-stars{font-size:11px}.market-comment,.market-change{font-size:9px}
  .lower{grid-template-columns:1fr}
}
@media(max-width:390px){
  .market-row{grid-template-columns:92px 72px minmax(90px,1fr) 48px}
  .market-stars{font-size:10px}.market-name{font-size:9px}
}

/* Ver4.27: 注目ニュースを記事リンク化 */
.news-link{color:#10213f;text-decoration:none}
.news-link:hover{text-decoration:underline;text-decoration-color:#54bfa2;text-underline-offset:2px}
.news-source{display:block;margin:3px 0 0 18px;color:#8290a5;font-size:8px}

/* Ver4.28: 注目ニュースの出典元の横に配信日時を小さく表示 */
.news-meta{
  display:flex;
  align-items:center;
  gap:7px;
  margin:3px 0 0 18px;
  color:#8290a5;
  font-size:8px;
  line-height:1.35;
}
.news-source{
  display:inline;
  margin:0;
  color:#8290a5;
  font-size:8px;
}
.news-datetime{
  display:inline-flex;
  align-items:center;
  color:#9aa6b7;
  font-size:8px;
  white-space:nowrap;
}
.news-datetime::before{
  content:"•";
  margin-right:7px;
  color:#c1c9d4;
}


/* Ver4.35 今日のマーケットは数値を表示しない方針 */
.today-page .market-change,
.market-board .market-change,
.market-row .market-change{
  display:none !important;
}
.tv-live-fx,
tv-single-ticker{
  display:none !important;
}

/* Ver4.42 経済指標の重要度表示 */
.indicator-table .indicator-importance{
  color:#ee8900;
  font-weight:800;
  letter-spacing:.02em;
  white-space:nowrap;
}
@media(max-width:720px){
  .indicator-table .indicator-importance{font-size:9px;letter-spacing:0}
}

/* Ver4.55 今日明日の指標：全件スクロール表示 */
.indicator-scroll{
  margin-top:12px;
  height:360px;
  min-height:360px;
  max-height:360px;
  overflow-y:scroll;
  overflow-x:auto;
  border:1px solid #edf1f6;
  border-radius:8px;
  scrollbar-gutter:stable;
  overscroll-behavior:contain;
}
.indicator-scroll .indicator-table{
  margin:0;
}
.indicator-scroll .indicator-table thead th{
  position:sticky;
  top:0;
  z-index:3;
  background:#f8fafc;
  box-shadow:0 1px 0 #e5eaf1;
}
.indicator-table .indicator-date-row td{
  position:sticky;
  top:31px;
  z-index:2;
  padding:6px 8px;
  background:#eef4fb;
  color:#35506f;
  font-weight:800;
  font-size:9px;
  border-top:1px solid #dbe5f0;
  border-bottom:1px solid #dbe5f0;
}
@media(max-width:720px){
  .indicator-scroll{
    height:320px;
    min-height:320px;
    max-height:320px;
  }
  .indicator-table .indicator-date-row td{top:30px}
}

/* Ver4.56 固定高さ・スクロールを明示 */
.indicator-scroll::-webkit-scrollbar{width:9px;height:9px}
.indicator-scroll::-webkit-scrollbar-track{background:#f3f6fa;border-radius:8px}
.indicator-scroll::-webkit-scrollbar-thumb{background:#b8c4d2;border-radius:8px}
.indicator-scroll::-webkit-scrollbar-thumb:hover{background:#93a3b5}