:root {
  color-scheme: light;
  --apple-bg-white: #ffffff;
  --apple-bg-dark: #1d1d1f;
  --apple-bg-light-gray: #f5f5f7;
  --apple-bg-elevated: #fbfbfd;
  --apple-text-primary: #1d1d1f;
  --apple-text-secondary: #6e6e73;
  --apple-text-tertiary: #86868b;
  --apple-text-white: #ffffff;
  --apple-link-blue: #0066cc;
  --apple-link-blue-hover: #0077ed;
  --apple-accent-orange: #e85d04;
  --apple-accent-red: #e30000;
  --apple-section-gap: 100px;
  --apple-section-gap-sm: 80px;
  --apple-component-gap-sm: 16px;
  --apple-component-gap-md: 32px;
  --apple-component-gap-lg: 48px;
  --apple-card-padding: 32px;
  --apple-card-padding-sm: 24px;
  --apple-content-max-width: 980px;
  --apple-content-max-width-lg: 1200px;
  --apple-weight-title-bold: 700;
  --apple-weight-title-heavy: 800;
  --apple-weight-title-black: 900;
  --apple-weight-body: 400;
  --apple-weight-body-medium: 500;
  --apple-radius-card: 18px;
  --apple-radius-card-sm: 12px;
  --apple-radius-button: 980px;
  --apple-shadow-card: 0 2px 8px rgba(0, 0, 0, 0.04), 0 8px 24px rgba(0, 0, 0, 0.08);
  --apple-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.06), 0 12px 32px rgba(0, 0, 0, 0.12);
  --apple-shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.04), 0 4px 12px rgba(0, 0, 0, 0.06);
  --apple-gradient-bg-light: linear-gradient(180deg, #fbfbfd 0%, #f5f5f7 100%);
  --apple-tracking-zh-title: 0.04em;
  --apple-tracking-body: 0em;
  --apple-leading-title: 1.1;
  --apple-leading-body: 1.53;
  --apple-leading-body-loose: 1.58;
  --apple-font-display: "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", "Meiryo", "Noto Sans JP", sans-serif;
  --apple-font-text: "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", "Meiryo", "Noto Sans JP", sans-serif;
  --apple-font-size-hero-min: 48px;
  --apple-font-size-hero: 56px;
  --apple-font-size-hero-max: 80px;
  --apple-font-size-subtitle-min: 24px;
  --apple-font-size-subtitle: 28px;
  --apple-font-size-body: 17px;
  --apple-font-size-caption: 12px;
  --bg: var(--apple-bg-light-gray);
  --panel: var(--apple-bg-white);
  --panel-strong: var(--apple-bg-elevated);
  --ink: var(--apple-text-primary);
  --muted: var(--apple-text-secondary);
  --line: rgba(29, 29, 31, 0.12);
  --accent: var(--apple-link-blue);
  --accent-strong: #004f9f;
  --warn: var(--apple-accent-orange);
  --danger: var(--apple-accent-red);
  --shadow: var(--apple-shadow-card);
}

* {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: radial-gradient(circle at 50% -10%, rgba(0, 102, 204, 0.12), transparent 34rem), var(--apple-gradient-bg-light);
  color: var(--ink);
  font-family: var(--apple-font-text);
  font-size: var(--apple-font-size-body);
  font-weight: var(--apple-weight-body);
  letter-spacing: var(--apple-tracking-body);
  line-height: var(--apple-leading-body);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
}

button,
input,
select {
  font: inherit;
}

button,
a,
select,
input {
  transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, color 180ms ease, transform 180ms ease;
}

.skip-link {
  position: absolute;
  left: 1rem;
  top: -4rem;
  z-index: 20;
  padding: 0.65rem 0.9rem;
  border-radius: var(--apple-radius-button);
  background: var(--apple-bg-dark);
  color: var(--apple-text-white);
}

.skip-link:focus {
  top: 1rem;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--apple-component-gap-sm);
  padding: 12px max(20px, calc((100vw - var(--apple-content-max-width-lg)) / 2 + 24px));
  border-bottom: 1px solid rgba(29, 29, 31, 0.08);
  background: rgba(251, 251, 253, 0.82);
  backdrop-filter: saturate(180%) blur(22px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.72rem;
  text-decoration: none;
}

.brand-mark {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border-radius: 10px;
  background: var(--apple-bg-dark);
  color: var(--apple-text-white);
  font-weight: var(--apple-weight-title-heavy);
  box-shadow: var(--apple-shadow-sm);
}

.brand strong,
.brand small {
  display: block;
}

.brand strong {
  font-family: var(--apple-font-display);
  font-size: 0.96rem;
  font-weight: var(--apple-weight-title-bold);
  line-height: var(--apple-leading-title);
}

.brand small {
  color: var(--apple-text-tertiary);
  font-size: var(--apple-font-size-caption);
  line-height: 1.35;
}

.top-nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.top-nav a {
  border-radius: var(--apple-radius-button);
  color: var(--apple-text-secondary);
  font-size: 0.88rem;
  font-weight: var(--apple-weight-body-medium);
  line-height: 1;
  padding: 0.65rem 0.85rem;
  text-decoration: none;
  white-space: nowrap;
}

.top-nav a:hover,
.top-nav a:focus-visible {
  background: rgba(0, 102, 204, 0.08);
  color: var(--apple-link-blue);
  outline: none;
}

main {
  min-height: 72vh;
}

.shell {
  width: 100%;
  max-width: var(--apple-content-max-width-lg);
  margin-inline: auto;
  padding-inline: 24px;
}

.hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
  align-items: center;
  gap: var(--apple-component-gap-lg);
  min-height: calc(100vh - 72px);
  padding: var(--apple-section-gap-sm) 0 var(--apple-component-gap-lg);
}

.eyebrow {
  margin: 0 0 0.75rem;
  color: var(--apple-link-blue);
  font-size: 0.86rem;
  font-weight: var(--apple-weight-body-medium);
}

h1,
h2,
h3 {
  margin: 0;
  color: var(--apple-text-primary);
  font-family: var(--apple-font-display);
  letter-spacing: var(--apple-tracking-zh-title);
  line-height: var(--apple-leading-title);
}

h1 {
  max-width: 10.4em;
  font-size: var(--apple-font-size-hero-min);
  font-weight: var(--apple-weight-title-black);
}

h2 {
  font-size: var(--apple-font-size-subtitle);
  font-weight: var(--apple-weight-title-heavy);
}

h3 {
  font-size: 1.08rem;
  font-weight: var(--apple-weight-title-bold);
}

.lead {
  max-width: 43rem;
  margin: var(--apple-component-gap-sm) 0 0;
  color: var(--apple-text-secondary);
  font-size: 1.1rem;
  line-height: var(--apple-leading-body-loose);
}

.search-panel,
.summary-panel,
.detail-panel,
.source-band,
.chart-panel,
.metric,
.incident-card,
.category-card {
  border: 1px solid rgba(29, 29, 31, 0.09);
  border-radius: var(--apple-radius-card);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--apple-shadow-card);
}

.search-panel {
  align-self: center;
  padding: var(--apple-card-padding);
  backdrop-filter: blur(16px);
}

.search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.7rem;
}

.search-form input {
  min-width: 0;
  width: 100%;
  border: 1px solid rgba(29, 29, 31, 0.12);
  border-radius: var(--apple-radius-button);
  background: var(--apple-bg-elevated);
  color: var(--ink);
  padding: 0.92rem 1rem;
}

.search-form input:focus,
.filters select:focus {
  border-color: rgba(0, 102, 204, 0.45);
  box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.12);
  outline: none;
}

.search-form button,
.period-button,
.link-button {
  border: 1px solid transparent;
  border-radius: var(--apple-radius-button);
  background: var(--apple-link-blue);
  color: var(--apple-text-white);
  cursor: pointer;
  font-weight: var(--apple-weight-body-medium);
  line-height: 1;
  padding: 0.92rem 1.1rem;
  text-decoration: none;
}

.search-form button:hover,
.period-button.active,
.link-button:hover {
  background: var(--apple-link-blue-hover);
  transform: translateY(-1px);
}

.suggestions {
  display: grid;
  gap: 0.72rem;
  margin-top: var(--apple-component-gap-sm);
}

.company-result {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.75rem;
  padding: 1rem;
  border: 1px solid rgba(29, 29, 31, 0.09);
  border-radius: var(--apple-radius-card-sm);
  background: var(--apple-bg-elevated);
  text-decoration: none;
}

.company-result:hover,
.company-result:focus-visible {
  border-color: rgba(0, 102, 204, 0.38);
  box-shadow: var(--apple-shadow-sm);
  outline: none;
  transform: translateY(-1px);
}

.company-result small {
  display: block;
  color: var(--apple-text-secondary);
  font-size: 0.82rem;
  line-height: 1.5;
}

.tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-top: 0.55rem;
}

.tag {
  display: inline-flex;
  align-items: center;
  min-height: 1.72rem;
  border: 1px solid rgba(29, 29, 31, 0.1);
  border-radius: var(--apple-radius-button);
  background: rgba(245, 245, 247, 0.86);
  color: var(--apple-text-secondary);
  font-size: 0.78rem;
  font-weight: var(--apple-weight-body-medium);
  line-height: 1;
  padding: 0.18rem 0.68rem;
}

.tag.primary {
  border-color: rgba(0, 102, 204, 0.18);
  background: rgba(0, 102, 204, 0.08);
  color: var(--apple-link-blue);
}

.tag.warn {
  border-color: rgba(232, 93, 4, 0.2);
  background: rgba(232, 93, 4, 0.08);
  color: var(--apple-accent-orange);
}

.metrics-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--apple-component-gap-sm);
  margin: var(--apple-component-gap-md) 0;
}

.metric {
  container-type: inline-size;
  min-height: 10rem;
  min-width: 0;
  padding: var(--apple-card-padding-sm);
}

.metric > span {
  display: block;
  color: var(--apple-text-secondary);
  font-size: 0.88rem;
  font-weight: var(--apple-weight-body-medium);
}

.metric strong,
.metric-value {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.16em;
  row-gap: 0.08em;
  min-width: 0;
  margin-top: 0.65rem;
  font-family: var(--apple-font-display);
  font-weight: var(--apple-weight-title-heavy);
  letter-spacing: 0;
  line-height: 0.98;
}

.metric-number {
  min-width: 0;
  max-width: 100%;
  color: var(--apple-text-primary);
  font-size: clamp(1.55rem, 15cqi, 2.75rem);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.metric-unit {
  flex: 0 0 auto;
  color: var(--apple-text-secondary);
  font-size: clamp(0.95rem, 5cqi, 1.2rem);
  font-weight: var(--apple-weight-title-bold);
}

.metric small {
  display: block;
  margin-top: 0.7rem;
  color: var(--apple-text-tertiary);
  font-size: 0.82rem;
  line-height: 1.45;
}

.section {
  padding: var(--apple-section-gap-sm) 0;
}

.static-page {
  display: grid;
  gap: var(--apple-component-gap-md);
  max-width: var(--apple-content-max-width);
}

.static-page > .lead {
  margin-top: 0;
}

.static-page .detail-panel {
  display: grid;
  gap: 0.85rem;
}

.static-page .detail-panel p {
  margin: 0;
  color: var(--apple-text-secondary);
}

.plain-list {
  display: grid;
  gap: 0.7rem;
  margin: 0;
  padding-left: 1.25rem;
  color: var(--apple-text-secondary);
}

.section-header {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--apple-component-gap-md);
  margin-bottom: var(--apple-component-gap-md);
}

.section-header p {
  max-width: 46rem;
  margin: 0.65rem 0 0;
  color: var(--apple-text-secondary);
}

.split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.44fr);
  gap: var(--apple-component-gap-sm);
}

.summary-panel,
.detail-panel,
.chart-panel,
.source-band {
  padding: var(--apple-card-padding);
}

.counter {
  container-type: inline-size;
  display: grid;
  gap: var(--apple-component-gap-sm);
}

.counter-value {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  column-gap: 0.16em;
  row-gap: 0.1em;
  min-width: 0;
  color: var(--apple-link-blue);
  font-family: var(--apple-font-display);
  font-weight: var(--apple-weight-title-black);
  letter-spacing: 0;
  line-height: 0.98;
}

.counter-value > span:first-child {
  min-width: 0;
  max-width: 100%;
  font-size: clamp(2rem, 18cqi, 4rem);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.counter-unit {
  flex: 0 0 auto;
  font-size: clamp(1rem, 6cqi, 1.35rem);
  font-weight: var(--apple-weight-title-heavy);
}

.note {
  color: var(--apple-text-secondary);
  font-size: 0.9rem;
  line-height: 1.55;
}

.period-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: var(--apple-component-gap-md) 0;
}

.period-button {
  background: rgba(255, 255, 255, 0.8);
  border-color: rgba(29, 29, 31, 0.1);
  color: var(--apple-text-primary);
  padding: 0.68rem 0.9rem;
}

.period-button:hover {
  border-color: rgba(0, 102, 204, 0.25);
  color: var(--apple-link-blue);
}

.period-button.active {
  color: var(--apple-text-white);
}

.period-menu {
  position: relative;
  display: inline-block;
  margin: 0;
}

.period-menu-button {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  border: 1px solid rgba(29, 29, 31, 0.12);
  border-radius: var(--apple-radius-button);
  background: var(--apple-bg-white);
  color: var(--apple-text-primary);
  box-shadow: var(--apple-shadow-sm);
  padding: 0.72rem 1rem;
}

.hamburger-icon {
  display: grid;
  gap: 4px;
  width: 18px;
}

.hamburger-icon span {
  display: block;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
}

.period-menu-list {
  position: absolute;
  left: 0;
  top: calc(100% + 8px);
  z-index: 8;
  display: grid;
  min-width: 12rem;
  overflow: hidden;
  border: 1px solid rgba(29, 29, 31, 0.12);
  border-radius: var(--apple-radius-card-sm);
  background: var(--apple-bg-white);
  box-shadow: var(--apple-shadow-card);
}

.period-menu-item {
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--apple-text-primary);
  padding: 0.78rem 0.95rem;
  text-align: left;
}

.period-menu-item:hover,
.period-menu-item.active {
  background: rgba(0, 102, 204, 0.08);
  color: var(--apple-link-blue);
}

.chart {
  width: 100%;
  min-height: 280px;
  margin-top: var(--apple-component-gap-sm);
}

.dashboard-summary-section {
  padding-bottom: 32px;
}

.dashboard-chart-section {
  padding-top: 24px;
}

.dashboard-summary-section .metrics-grid {
  margin-bottom: 0;
}

.bar-label {
  fill: var(--apple-text-secondary);
  font-size: 12px;
}

.bar-value {
  fill: var(--apple-text-primary);
  font-size: 12px;
  font-weight: var(--apple-weight-title-bold);
}

.recent-list,
.incident-list,
.source-list {
  display: grid;
  gap: var(--apple-component-gap-sm);
}

.recent-list {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.recent-list .incident-card {
  align-content: start;
  padding: var(--apple-card-padding-sm);
}

.recent-list .incident-topline {
  flex-direction: column;
}

.recent-list .incident-card h3 {
  font-size: 1.05rem;
  line-height: 1.38;
}

.recent-list .incident-card p {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.recent-list .metadata-grid {
  grid-template-columns: 1fr;
}

.incident-card {
  display: grid;
  gap: var(--apple-component-gap-sm);
  padding: var(--apple-card-padding);
}

.incident-card p {
  margin: 0;
  color: var(--apple-text-secondary);
}

.incident-card:hover {
  box-shadow: var(--apple-shadow-hover);
}

.incident-topline {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: var(--apple-component-gap-sm);
}

.incident-title {
  color: var(--apple-link-blue);
  font-weight: var(--apple-weight-title-bold);
  text-decoration: none;
}

.incident-title:hover,
.title-link:hover {
  color: var(--apple-link-blue-hover);
  text-decoration: underline;
  text-underline-offset: 0.22em;
}

.title-link {
  color: inherit;
  text-decoration: none;
}

.metadata-grid,
.profile-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.75rem;
}

.metadata-item,
.profile-item {
  border: 1px solid rgba(29, 29, 31, 0.08);
  border-radius: var(--apple-radius-card-sm);
  background: var(--apple-bg-elevated);
  min-width: 0;
  padding: 0.78rem 0.88rem;
}

.metadata-item span,
.profile-item span {
  display: block;
  color: var(--apple-text-tertiary);
  font-size: 0.76rem;
  font-weight: var(--apple-weight-body-medium);
  line-height: 1.35;
}

.metadata-item strong,
.profile-item strong {
  display: block;
  min-width: 0;
  margin-top: 0.24rem;
  color: var(--apple-text-primary);
  font-size: 0.94rem;
  font-weight: var(--apple-weight-body-medium);
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.source-list a,
.source-link {
  color: var(--apple-link-blue);
  font-weight: var(--apple-weight-body-medium);
  text-decoration: none;
}

.source-link:hover {
  color: var(--apple-link-blue-hover);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

.source-row {
  display: grid;
  grid-template-columns: 160px 1fr auto;
  gap: var(--apple-component-gap-sm);
  align-items: center;
  padding: 1rem 0;
  border-top: 1px solid rgba(29, 29, 31, 0.08);
}

.source-row:first-child {
  border-top: 0;
}

.source-row strong {
  font-weight: var(--apple-weight-title-bold);
}

.score-panel {
  display: grid;
  gap: var(--apple-component-gap-sm);
}

.score-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--apple-component-gap-sm);
}

.score-summary > div,
.score-row {
  min-width: 0;
  border: 1px solid rgba(29, 29, 31, 0.09);
  border-radius: var(--apple-radius-card-sm);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: var(--apple-shadow-sm);
  padding: 1rem 1.15rem;
}

.score-summary > div.score-minor,
.score-row.score-minor,
.ranking-row.score-minor {
  border-color: rgba(0, 113, 164, 0.22);
  background: rgba(232, 247, 252, 0.92);
}

.score-summary > div.score-low,
.score-row.score-low,
.ranking-row.score-low {
  border-color: rgba(65, 143, 99, 0.24);
  background: rgba(237, 248, 241, 0.92);
}

.score-summary > div.score-medium,
.score-row.score-medium,
.ranking-row.score-medium {
  border-color: rgba(181, 128, 0, 0.26);
  background: rgba(255, 248, 224, 0.94);
}

.score-summary > div.score-high,
.score-row.score-high,
.ranking-row.score-high {
  border-color: rgba(210, 92, 0, 0.3);
  background: rgba(255, 239, 226, 0.94);
}

.score-summary > div.score-severe,
.score-row.score-severe,
.ranking-row.score-severe {
  border-color: rgba(188, 28, 28, 0.32);
  background: rgba(255, 235, 235, 0.96);
}

.score-summary span,
.score-summary small,
.score-row span,
.score-row small {
  display: block;
  color: var(--apple-text-secondary);
  font-size: 0.82rem;
  line-height: 1.45;
}

.score-summary strong {
  display: block;
  margin-top: 0.35rem;
  color: var(--apple-text-primary);
  font-family: var(--apple-font-display);
  font-size: 1.65rem;
  font-weight: var(--apple-weight-title-heavy);
  letter-spacing: 0;
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.score-summary small {
  margin-top: 0.45rem;
}

.score-breakdown {
  display: grid;
  gap: 0.65rem;
}

.score-row {
  display: grid;
  grid-template-columns: minmax(10rem, 1fr) minmax(5rem, auto) minmax(12rem, 1.4fr);
  gap: var(--apple-component-gap-sm);
  align-items: center;
}

.score-row strong {
  color: var(--apple-text-primary);
  font-size: 1rem;
  font-weight: var(--apple-weight-title-bold);
  text-align: right;
}

.score-minor strong {
  color: #006b8f;
}

.score-low strong {
  color: #1f7a46;
}

.score-medium strong {
  color: #9a6b00;
}

.score-high strong {
  color: #c04f00;
}

.score-severe strong {
  color: #b91c1c;
}

.info-detail-list {
  display: grid;
  gap: 0.75rem;
}

.info-detail-row {
  display: grid;
  grid-template-columns: minmax(14rem, 1.35fr) minmax(10rem, 0.7fr) minmax(10rem, 0.7fr);
  gap: var(--apple-component-gap-sm);
  align-items: center;
  border: 1px solid rgba(29, 29, 31, 0.09);
  border-radius: var(--apple-radius-card-sm);
  background: rgba(255, 255, 255, 0.88);
  box-shadow: var(--apple-shadow-sm);
  padding: 1rem 1.15rem;
}

.info-detail-row strong,
.info-detail-row span,
.info-detail-row small {
  display: block;
}

.info-detail-row strong {
  color: var(--apple-text-primary);
  font-weight: var(--apple-weight-title-bold);
  overflow-wrap: anywhere;
}

.info-detail-row span {
  color: var(--apple-text-tertiary);
  font-size: 0.78rem;
  font-weight: var(--apple-weight-body-medium);
  line-height: 1.45;
}

.info-detail-row small {
  margin-top: 0.18rem;
  color: var(--apple-text-secondary);
  font-size: 0.78rem;
}

.summary-panel .source-row {
  grid-template-columns: minmax(7rem, 1fr) auto auto;
  gap: 0.65rem;
}

.category-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--apple-component-gap-sm);
}

.category-card {
  padding: var(--apple-card-padding-sm);
}

.category-card strong {
  display: flex;
  justify-content: space-between;
  gap: 0.7rem;
  color: var(--apple-text-primary);
  font-weight: var(--apple-weight-title-bold);
}

.ranking-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--apple-component-gap-sm);
}

.ranking-panel {
  border: 1px solid rgba(29, 29, 31, 0.09);
  border-radius: var(--apple-radius-card);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--apple-shadow-card);
  padding: var(--apple-card-padding);
}

.ranking-list {
  display: grid;
  gap: 0.7rem;
  margin-top: var(--apple-component-gap-sm);
}

.ranking-row {
  display: grid;
  grid-template-columns: 2.25rem minmax(0, 1fr) minmax(8rem, auto);
  gap: var(--apple-component-gap-sm);
  align-items: center;
  min-width: 0;
  border: 1px solid rgba(29, 29, 31, 0.08);
  border-radius: var(--apple-radius-card-sm);
  background: var(--apple-bg-elevated);
  padding: 0.85rem;
}

.ranking-rank {
  display: grid;
  width: 2.25rem;
  height: 2.25rem;
  place-items: center;
  border-radius: 50%;
  background: var(--apple-bg-dark);
  color: var(--apple-text-white);
  font-weight: var(--apple-weight-title-bold);
}

.ranking-row strong,
.ranking-row small {
  display: block;
  min-width: 0;
}

.ranking-row small {
  margin-top: 0.2rem;
  color: var(--apple-text-secondary);
  font-size: 0.8rem;
  line-height: 1.45;
}

.ranking-value {
  text-align: right;
}

.ranking-value strong {
  color: var(--apple-text-primary);
  font-family: var(--apple-font-display);
  font-size: 1.15rem;
  font-weight: var(--apple-weight-title-heavy);
  letter-spacing: 0;
}

.timeline {
  position: relative;
  display: grid;
  gap: var(--apple-component-gap-sm);
  margin-top: var(--apple-component-gap-md);
}

.timeline::before {
  position: absolute;
  left: 0.82rem;
  top: 0.5rem;
  bottom: 0.5rem;
  width: 2px;
  border-radius: 999px;
  background: rgba(29, 29, 31, 0.1);
  content: "";
}

.timeline .incident-card {
  position: relative;
  margin-left: 2.25rem;
}

.timeline .incident-card::before {
  position: absolute;
  left: -1.83rem;
  top: 1.25rem;
  width: 0.88rem;
  height: 0.88rem;
  border: 4px solid var(--apple-bg-light-gray);
  border-radius: 50%;
  background: var(--apple-link-blue);
  content: "";
}

.filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
  align-items: end;
  margin-bottom: var(--apple-component-gap-sm);
}

.filter-control {
  display: grid;
  gap: 0.35rem;
  color: var(--apple-text-secondary);
  font-size: 0.86rem;
  font-weight: var(--apple-weight-body-medium);
}

.filters label {
  display: grid;
  gap: 0.35rem;
  color: var(--apple-text-secondary);
  font-size: 0.86rem;
  font-weight: var(--apple-weight-body-medium);
}

.filters select {
  min-width: 13rem;
  border: 1px solid rgba(29, 29, 31, 0.12);
  border-radius: var(--apple-radius-button);
  background: var(--apple-bg-white);
  color: var(--apple-text-primary);
  padding: 0.72rem 0.9rem;
}

.report-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
  gap: var(--apple-component-gap-sm);
  align-items: start;
}

.admin-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--apple-component-gap-md);
  align-items: start;
}

.admin-layout [hidden] {
  display: none !important;
}

.admin-tabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: fit-content;
  max-width: 100%;
  border: 1px solid rgba(29, 29, 31, 0.1);
  border-radius: var(--apple-radius-button);
  background: var(--apple-bg-light-gray);
  padding: 0.28rem;
}

.admin-tab {
  border: 0;
  border-radius: var(--apple-radius-button);
  background: transparent;
  color: var(--apple-text-secondary);
  cursor: pointer;
  font: inherit;
  font-size: 0.9rem;
  font-weight: var(--apple-weight-body-medium);
  padding: 0.68rem 1rem;
  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}

.admin-tab:hover,
.admin-tab:focus-visible {
  color: var(--apple-text-primary);
}

.admin-tab:focus-visible {
  box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.12);
  outline: none;
}

.admin-tab.is-active {
  background: var(--apple-bg-white);
  color: var(--apple-text-primary);
  box-shadow: var(--apple-shadow-sm);
}

.admin-load-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--apple-component-gap-sm);
  align-items: end;
}

.admin-edit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) repeat(3, auto);
  gap: var(--apple-component-gap-sm);
  align-items: end;
}

.admin-table-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--apple-component-gap-sm);
  align-items: center;
}

.admin-table-wrap {
  max-height: min(64vh, 720px);
  overflow: auto;
  border: 1px solid rgba(29, 29, 31, 0.1);
  border-radius: var(--apple-radius-card-sm);
  background: var(--apple-bg-white);
}

.admin-watch-table {
  width: 100%;
  min-width: 1180px;
  border-collapse: collapse;
  font-size: 0.86rem;
}

.admin-watch-table th,
.admin-watch-table td {
  border-bottom: 1px solid rgba(29, 29, 31, 0.08);
  padding: 0.55rem;
  text-align: left;
  vertical-align: middle;
}

.admin-watch-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: rgba(245, 245, 247, 0.86);
  color: var(--apple-text-secondary);
  font-weight: var(--apple-weight-body-medium);
  white-space: nowrap;
}

.admin-watch-table tr:last-child td {
  border-bottom: 0;
}

.admin-watch-table input,
.admin-watch-table select {
  min-height: 2.35rem;
  padding: 0.55rem 0.62rem;
}

.admin-watch-table input[type="checkbox"] {
  width: 1.05rem;
  min-width: 1.05rem;
  min-height: 1.05rem;
  padding: 0;
}

.admin-watch-table .checkbox-cell {
  text-align: center;
  width: 4.2rem;
}

.admin-watch-table td:nth-child(2) {
  min-width: 190px;
}

.admin-watch-table td:nth-child(4) {
  min-width: 280px;
}

.admin-watch-table td:nth-child(5) {
  min-width: 160px;
}

.admin-watch-table td:nth-child(11) {
  max-width: 220px;
}

.admin-watch-meta {
  display: block;
  max-width: 220px;
  overflow: hidden;
  color: var(--apple-text-secondary);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-watch-table tr:has(input[name="delete"]:checked) {
  background: rgba(255, 59, 48, 0.06);
}

.admin-info-detail-list {
  display: grid;
  gap: var(--apple-component-gap-sm);
}

.admin-info-detail-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) minmax(150px, 0.8fr) repeat(4, minmax(120px, 0.75fr)) auto;
  gap: var(--apple-component-gap-sm);
  align-items: end;
  border: 1px solid rgba(29, 29, 31, 0.1);
  border-radius: var(--apple-radius-card-sm);
  padding: var(--apple-component-gap-sm);
  background: var(--apple-bg-elevated);
}

.admin-info-note {
  grid-column: 1 / -2;
}

.section-header.compact {
  margin-bottom: calc(var(--apple-component-gap-sm) * -0.4);
}

.link-button.secondary {
  background: var(--apple-bg-white);
  color: var(--apple-link-blue);
  box-shadow: inset 0 0 0 1px rgba(0, 102, 204, 0.24);
}

.link-button.danger {
  background: var(--apple-accent-red);
  color: var(--apple-text-white);
}

.report-form {
  display: grid;
  gap: var(--apple-component-gap-md);
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--apple-component-gap-sm);
}

.form-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.form-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.report-form label {
  display: grid;
  gap: 0.42rem;
  min-width: 0;
  color: var(--apple-text-secondary);
  font-size: 0.9rem;
  font-weight: var(--apple-weight-body-medium);
}

.report-form label > span {
  color: var(--apple-link-blue);
  font-size: 0.78rem;
}

.report-form input,
.report-form select,
.report-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(29, 29, 31, 0.12);
  border-radius: var(--apple-radius-card-sm);
  background: var(--apple-bg-elevated);
  color: var(--apple-text-primary);
  padding: 0.82rem 0.9rem;
}

.report-form textarea {
  resize: vertical;
}

.report-form input:focus,
.report-form select:focus,
.report-form textarea:focus {
  border-color: rgba(0, 102, 204, 0.45);
  box-shadow: 0 0 0 4px rgba(0, 102, 204, 0.12);
  outline: none;
}

.checkbox-row {
  align-items: start;
  display: flex !important;
  gap: 0.7rem !important;
}

.checkbox-row input {
  width: 1.1rem;
  min-width: 1.1rem;
  margin-top: 0.2rem;
}

.checkbox-row span {
  color: var(--apple-text-secondary) !important;
  font-size: 0.9rem !important;
}

.form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--apple-component-gap-sm);
  align-items: center;
}

.form-status {
  min-height: 2.8rem;
  border-radius: var(--apple-radius-card-sm);
  color: var(--apple-text-secondary);
  padding: 0.85rem 1rem;
}

.form-status.success {
  background: rgba(45, 140, 60, 0.1);
  color: #1f6d2d;
}

.form-status.warning {
  background: rgba(232, 93, 4, 0.1);
  color: var(--apple-accent-orange);
}

.report-guidance {
  position: sticky;
  top: 96px;
  display: grid;
  gap: var(--apple-component-gap-sm);
}

.honeypot {
  position: absolute;
  left: -10000px;
  width: 1px !important;
  height: 1px;
  opacity: 0;
}

.site-footer {
  display: grid;
  gap: 0.4rem;
  margin-top: var(--apple-section-gap-sm);
  padding: var(--apple-component-gap-md) max(20px, calc((100vw - var(--apple-content-max-width-lg)) / 2 + 24px));
  border-top: 1px solid rgba(29, 29, 31, 0.08);
  background: var(--apple-bg-white);
  color: var(--apple-text-secondary);
  font-size: 0.86rem;
}

.site-footer p {
  margin: 0;
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
}

.footer-links a {
  color: var(--apple-link-blue);
  text-decoration: none;
}

.footer-links a:hover,
.footer-links a:focus-visible {
  text-decoration: underline;
}

@media (min-width: 734px) {
  h1 {
    font-size: var(--apple-font-size-hero);
  }
}

@media (min-width: 1068px) {
  h1 {
    font-size: var(--apple-font-size-hero-max);
  }
}

@media (max-width: 920px) {
  .site-header {
    align-items: start;
    flex-direction: column;
  }

  .top-nav {
    width: 100%;
    overflow-x: auto;
    padding-bottom: 0.15rem;
  }

  .hero,
  .split {
    grid-template-columns: 1fr;
  }

  .report-layout {
    grid-template-columns: 1fr;
  }

  .report-guidance {
    position: static;
  }

  .hero {
    min-height: auto;
    padding-top: 64px;
  }

  .metrics-grid,
  .metadata-grid,
  .profile-grid,
  .category-grid,
  .ranking-grid,
  .score-summary,
  .info-detail-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .recent-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-info-detail-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-info-note {
    grid-column: 1 / -1;
  }

  .info-detail-row > div:first-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 733px) {
  body {
    font-size: 16px;
  }

  .shell {
    padding-inline: 20px;
  }

  .site-header {
    padding-inline: 20px;
  }

  .hero,
  .section {
    padding-block: 60px;
  }

  h1 {
    font-size: 2.65rem;
  }

  h2 {
    font-size: var(--apple-font-size-subtitle-min);
  }

  .search-panel,
  .summary-panel,
  .detail-panel,
  .chart-panel,
  .source-band,
  .incident-card {
    padding: var(--apple-card-padding-sm);
  }

  .search-form,
  .metrics-grid,
  .metadata-grid,
  .profile-grid,
  .category-grid,
  .form-grid,
  .form-grid.two,
  .form-grid.three,
  .admin-load-row,
  .admin-edit-row,
  .admin-info-detail-row,
  .source-row,
  .recent-list,
  .ranking-grid,
  .ranking-row,
  .score-summary,
  .score-row,
  .info-detail-row {
    grid-template-columns: 1fr;
  }

  .score-row strong {
    text-align: left;
  }

  .ranking-value {
    text-align: left;
  }

  .info-detail-row > div:first-child {
    grid-column: auto;
  }

  .admin-info-note {
    grid-column: auto;
  }

  .metric {
    min-height: auto;
  }

  .incident-topline,
  .section-header {
    align-items: start;
    flex-direction: column;
  }

  .filters,
  .filter-control,
  .filters label,
  .filters select,
  .period-menu,
  .period-menu-button {
    width: 100%;
  }

  .chart {
    min-height: 230px;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
