:root {
  --brand-orange: #ff8c42;
  --brand-orange-glow: rgba(255, 140, 66, 0.24);
  --bg-primary: #0a0e1a;
  --bg-card: #1a2035;
  --bg-elevated: #222840;
  --text-primary: #f5f7fa;
  --text-secondary: #a8b2c1;
  --text-muted: #6b7280;
  --border-subtle: rgba(255, 140, 66, 0.1);
  --border-strong: rgba(255, 140, 66, 0.28);
  --accent-green: #10b981;
  --accent-blue: #3b82f6;
  --accent-purple: #8b5cf6;
  --accent-yellow: #f59e0b;
  --accent-red: #ef4444;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: linear-gradient(180deg, var(--bg-primary) 0%, #0f1425 100%);
  color: var(--text-primary);
  line-height: 1.65;
}
a { color: var(--brand-orange); text-decoration: none; }
a:hover { text-decoration: underline; }
header, footer {
  border-bottom: 1px solid var(--border-subtle);
  background: rgba(26, 32, 53, 0.88);
}
header { position: sticky; top: 0; z-index: 10; backdrop-filter: blur(10px); }
.header-inner, main, .footer-inner { max-width: 1120px; margin: 0 auto; padding: 20px 28px; }
.header-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.logo { color: var(--text-primary); font-size: 18px; font-weight: 900; letter-spacing: 0.02em; }
.logo span { color: var(--brand-orange); }
nav { display: flex; gap: 10px; flex-wrap: wrap; }
nav a { color: var(--text-secondary); font-size: 14px; font-weight: 700; padding: 8px 12px; border-radius: 8px; }
nav a:hover, nav a.active { color: var(--brand-orange); background: rgba(255, 140, 66, 0.09); text-decoration: none; }
.breadcrumb { color: var(--text-muted); font-size: 13px; margin: 24px 0 10px; }
.breadcrumb a { color: var(--text-secondary); }
.hero { padding: 28px 0 22px; }
.kicker { color: var(--brand-orange); font-size: 12px; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
h1 { font-size: clamp(32px, 5vw, 54px); line-height: 1.05; margin: 12px 0 18px; letter-spacing: -0.04em; }
.lede { color: var(--text-secondary); font-size: 18px; max-width: 840px; margin: 0; }
.grid { display: grid; grid-template-columns: 1.25fr 0.75fr; gap: 24px; align-items: start; }
.card { background: var(--bg-card); border: 1px solid var(--border-subtle); border-radius: 18px; padding: 24px; box-shadow: 0 18px 50px rgba(0,0,0,0.18); }
.card h2 { margin-top: 0; font-size: 22px; }
.meta-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
.meta-row { padding-bottom: 12px; border-bottom: 1px solid rgba(255,255,255,0.06); }
.meta-row:last-child { border-bottom: 0; padding-bottom: 0; }
.meta-label { color: var(--text-muted); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.meta-value { margin-top: 3px; color: var(--text-primary); font-weight: 700; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; }
.tag { display: inline-flex; align-items: center; gap: 4px; border-radius: 999px; padding: 5px 10px; font-size: 12px; font-weight: 800; }
.tag.region { color: #93c5fd; background: rgba(59,130,246,0.13); }
.tag.topic { color: #86efac; background: rgba(16,185,129,0.13); }
.tag.protocol { color: #c4b5fd; background: rgba(139,92,246,0.13); }
.tag.entity { color: #fcd34d; background: rgba(245,158,11,0.13); }
.tag.impact-high { color: #86efac; background: rgba(16,185,129,0.13); }
.tag.impact-medium { color: #fcd34d; background: rgba(245,158,11,0.13); }
.tag.impact-low { color: #d1d5db; background: rgba(107,114,128,0.18); }
.prose { color: var(--text-secondary); font-size: 16px; }
.prose p:first-child { margin-top: 0; }
.prose strong { color: var(--text-primary); }
.event-list { display: grid; gap: 14px; }
.event-card { background: var(--bg-card); border: 1px solid var(--border-subtle); border-left: 4px solid var(--brand-orange); border-radius: 14px; padding: 18px 20px; }
.event-card.high { border-left-color: var(--accent-green); }
.event-card.medium { border-left-color: var(--accent-yellow); }
.event-card.low { border-left-color: var(--text-muted); }
.event-card time { color: var(--brand-orange); font-size: 13px; font-weight: 800; }
.event-card h2, .event-card h3 { margin: 6px 0 8px; font-size: 18px; line-height: 1.35; }
.event-card h2 a, .event-card h3 a { color: var(--text-primary); }
.event-card h2 a:hover, .event-card h3 a:hover { color: var(--brand-orange); text-decoration: none; }
.event-card p { margin: 0; color: var(--text-secondary); }
.event-footer { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 12px; font-size: 13px; }
.related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.related-link { display: block; background: var(--bg-elevated); border: 1px solid var(--border-subtle); border-radius: 14px; padding: 14px; color: var(--text-primary); font-weight: 800; }
.related-link span { display: block; color: var(--text-muted); font-size: 12px; font-weight: 700; margin-top: 3px; }
.related-link:hover { border-color: var(--brand-orange); text-decoration: none; }
.notice { background: rgba(255,140,66,0.08); border: 1px solid var(--border-strong); border-radius: 16px; padding: 18px; color: var(--text-secondary); }
.cta { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; padding: 12px 16px; border-radius: 10px; color: #111827; background: var(--brand-orange); font-weight: 900; }
.cta:hover { text-decoration: none; filter: brightness(1.04); }
footer { border-top: 1px solid var(--border-subtle); border-bottom: 0; color: var(--text-muted); margin-top: 48px; }
.footer-inner { font-size: 13px; }
@media (max-width: 820px) {
  .header-inner { align-items: flex-start; flex-direction: column; }
  .grid { grid-template-columns: 1fr; }
  main, .header-inner, .footer-inner { padding-left: 20px; padding-right: 20px; }
}