/* An original, illustrative night report. Animation is coordinated in data-motion.js. */
.data-section {
  position:relative;
  overflow:hidden;
  color:#f2f6ff;
  background:radial-gradient(ellipse at 100% 0%,#2457ad66,transparent 50%),linear-gradient(155deg,#112f68,#071c41 75%);
  border-top:2px solid #10254b;
  border-bottom:2px solid #10254b;
}
.data-section::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.23; background-image:linear-gradient(#86a7e319 1px,transparent 1px),linear-gradient(90deg,#86a7e319 1px,transparent 1px); background-size:27px 27px; }
.data-section > * { position:relative; }
.data-section .section-kicker { color:#a8c3f8; }
.data-section-heading { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.data-section-heading h2 { line-height:1.48; }
.data-section-heading h2 em { color:var(--gold); }
.data-heading-star { color:var(--gold); font:70px/1 Arial,sans-serif; rotate:12deg; margin-right:8px; text-shadow:0 0 30px #efc76533; }
.data-section .section-lead { color:#cad8f1; }
.data-dashboard { margin-top:30px; background:#fcfcf7; color:var(--ink); border:2px solid #acc3f6; border-radius:17px; box-shadow:6px 7px 0 #020c2266,0 0 42px #6191e412; overflow:hidden; position:relative; isolation:isolate; }
.data-dashboard::after { content:""; position:absolute; left:-70%; top:0; height:4px; width:65%; background:linear-gradient(90deg,transparent,#fff3bd,transparent); pointer-events:none; opacity:0; }
.data-dashboard[data-running="true"]::after { animation:data-gold-pass 1.6s ease-out both; }
.data-sample-context { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px 10px; padding:9px 14px; margin:0; background:#eaf0fa; color:#526a8e; border-bottom:1px solid #d7e2f2; font-size:9px; line-height:1.6; }
.data-sample-context strong { color:#254d89; font:800 10px/1.5 var(--display); letter-spacing:.6px; }
.data-window-bar { display:flex; align-items:center; gap:8px; background:#0d285b; color:#d1def5; padding:10px 13px; font:700 10px/1.1 var(--display); letter-spacing:1.5px; }
.data-window-dots { display:flex; gap:4px; margin-right:3px; }
.data-window-dots i { height:5px; width:5px; border-radius:50%; background:#4278da; }
.data-window-dots i:first-child { background:#efc765; }
.data-window-dots i:last-child { background:#9cb8ec; }
.data-window-bar>b { margin-left:auto; color:var(--gold); font-size:9px; letter-spacing:1.3px; }
.data-tabs { display:grid; grid-template-columns:1fr 1fr 1.45fr; gap:5px; padding:12px 14px 0; }
.data-tabs button { position:relative; min-width:0; min-height:43px; padding:7px 3px; background:#edf1f9; border:1px solid #d6dfef; border-radius:7px; color:#4e6083; font-size:11px; font-weight:800; transition:background .25s,color .25s,translate .25s; }
.data-tabs button>span { display:inline-block; font:800 10px/1 var(--display); opacity:.62; margin-right:4px; }
.data-tabs button[aria-selected="true"] { background:#174ec2; color:white; border-color:#174ec2; box-shadow:0 3px 0 #c1d1ef; translate:0 -1px; }
.data-tabs button[aria-selected="true"]>span { color:#f5d783; opacity:1; }
.data-tabs button:hover { translate:0 -2px; }
.data-tabs button:focus-visible,.data-controls button:focus-visible { outline:2px solid #d69526; outline-offset:2px; z-index:2; }
#data-panel:focus-visible { outline:2px solid #d69526; outline-offset:-4px; border-radius:5px; }
.data-summary { position:relative; padding:23px 20px 20px; min-height:169px; }
.data-summary-label { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding-right:83px; font-size:11px; font-weight:800; }
.data-summary-label small { font-size:8px; font-weight:500; padding:1px 5px; border:1px solid #c8d4e8; border-radius:3px; color:#647793; }
.data-total { display:flex; align-items:baseline; gap:3px; min-height:76px; padding-right:92px; margin-top:2px; font-variant-numeric:tabular-nums; white-space:nowrap; }
:is(#data-total-number,.data-total-copy-number) { display:block; font:800 70px/1.1 var(--display); letter-spacing:-1.8px; color:#164cc0; min-width:0; }
:is(#data-total-prefix,.data-total-copy-prefix) { font:700 28px/1 var(--display); color:#164cc0; }
:is(#data-total-prefix,.data-total-copy-prefix):empty { display:none; }
:is(#data-total-suffix,.data-total-copy-suffix) { font-size:12px; font-weight:800; margin-left:3px; }
.data-meta { display:flex; align-items:center; gap:8px; padding-right:100px; font-size:9px; color:#667792; }
.data-meta strong { font-size:11px; color:#264c88; white-space:nowrap; }
.data-meta-line { width:40px; max-width:25%; height:2px; background:linear-gradient(90deg,var(--gold),transparent); }
.data-companion { position:absolute; right:-1px; bottom:-4px; width:120px; pointer-events:none; }
.data-companion .crew-sprite { width:120px; transform-origin:50% 90%; }
.data-companion-bubble { position:absolute; z-index:1; top:-11px; right:3px; padding:7px 10px; border-radius:10px 10px 10px 2px; background:var(--gold-pale); border:1.5px solid #213f71; font-size:8px; font-weight:800; line-height:1.5; rotate:4deg; }
.data-dashboard[data-running="true"] .data-companion .crew-sprite { animation:data-companion-pop .8s .2s both cubic-bezier(.18,.8,.25,1); }
.data-chart-card { position:relative; margin:0 14px 15px; padding:13px 12px 10px; background:#f0f4fd; border:1px solid #d2ddf0; border-radius:10px; }
.data-chart-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:11px; }
.data-chart-heading h3 { font-size:11px; font-weight:800; }
.data-chart-heading>span { display:flex; align-items:center; gap:4px; color:#536887; font-size:9px; white-space:nowrap; }
.data-chart-heading i { display:inline-block; width:11px; height:5px; border-radius:2px; background:#2867dc; }
.data-plot { position:relative; height:160px; }
.data-chart-grid { position:absolute; inset:15px 0; display:flex; flex-direction:column; justify-content:space-between; }
.data-chart-grid i { display:block; width:100%; height:1px; background:repeating-linear-gradient(90deg,#b9c9e2 0 3px,transparent 3px 6px); opacity:.7; }
.data-bars { position:absolute; inset:0; display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); }
.data-bars>div { position:relative; min-width:0; height:100%; }
.data-bar-fill { position:absolute; bottom:15px; left:27%; width:46%; height:var(--bar-height); min-height:1px; display:block; border-radius:4px 4px 0 0; background:linear-gradient(180deg,#3278f0,#164bc0); transform-origin:50% 100%; box-shadow:inset 1px 0 0 #ffffff55; }
.data-bar-value { position:absolute; left:0; right:0; bottom:calc(15px + var(--bar-height) + 6px); text-align:center; color:#345179; font:700 10px/1 var(--display); font-variant-numeric:tabular-nums; z-index:2; }
#data-chart-overlay { position:absolute; inset:0; display:block; height:100%; width:100%; overflow:visible; pointer-events:none; }
#data-chart-area { fill:url("#data-area-gradient"); }
#data-chart-line { fill:none; stroke:#d99c2c; stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; }
#data-chart-overlay [data-point-index] { fill:#ffedb5; stroke:#b97b18; stroke-width:1.5; vector-effect:non-scaling-stroke; }
#data-chart-tracer { fill:#fff4c4; stroke:#c28b29; stroke-width:2; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 3px #e6b447); opacity:0; }
.data-hours { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); margin-top:-6px; color:#536887; font-size:8px; text-align:center; }
.data-table-card { position:relative; margin:0 15px; overflow:hidden; }
.data-table-heading { display:flex; align-items:center; justify-content:space-between; gap:7px; padding:2px 0 10px; }
.data-table-heading h3 { font-size:12px; font-weight:800; }
.data-table-heading>span { color:#7e8da7; font:700 9px/1 var(--display); letter-spacing:1px; }
.data-table-heading i { font-style:normal; color:#a67d22; margin-left:3px; }
:is(#data-ledger,.data-ledger-copy) { width:100%; border-collapse:collapse; table-layout:fixed; }
.data-col-name { width:44%; }.data-col-detail { width:22%; }.data-col-value { width:34%; }
:is(#data-ledger,.data-ledger-copy) th,:is(#data-ledger,.data-ledger-copy) td { padding:10px 3px; text-align:left; border-bottom:1px solid #e0e6f0; vertical-align:middle; }
:is(#data-ledger,.data-ledger-copy) thead th { padding-top:8px; padding-bottom:8px; background:#edf1f7; color:#536887; font-size:8px; font-weight:600; }
:is(#data-ledger,.data-ledger-copy) thead th:first-child { padding-left:8px; border-radius:5px 0 0 5px; }
:is(#data-ledger,.data-ledger-copy) thead th:last-child { padding-right:7px; border-radius:0 5px 5px 0; }
:is(#data-ledger,.data-ledger-copy) th:last-child,:is(#data-ledger,.data-ledger-copy) td:last-child { text-align:right; }
:is(#data-ledger,.data-ledger-copy) tbody tr:last-child th,:is(#data-ledger,.data-ledger-copy) tbody tr:last-child td { border-bottom:none; }
.data-row-name { display:flex; align-items:center; gap:6px; font-size:11px; font-weight:700; white-space:nowrap; }
[data-row-mark] { display:grid; flex-shrink:0; place-items:center; width:19px; height:19px; border-radius:4px; background:#e7eefc; color:#496aa0; font:800 10px/1 var(--display); }
tr[data-ledger-row="0"] [data-row-mark] { background:#f4dfa0; color:#6a4b13; }
.data-row-track { overflow:hidden; height:3px; width:calc(100% - 27px); margin:6px 0 0 25px; border-radius:2px; background:#e5ebf5; }
[data-row-progress] { display:block; width:100%; height:100%; transform-origin:left; background:linear-gradient(90deg,#3a75d7,#9bbbf1); border-radius:2px; }
tr[data-ledger-row="0"] [data-row-progress] { background:linear-gradient(90deg,#d4a341,#efcf78); }
:is(#data-ledger,.data-ledger-copy) [data-row-detail] { font-size:10px; font-variant-numeric:tabular-nums; color:#536887; text-align:center; }
:is(#data-ledger,.data-ledger-copy) [data-row-value] { font:700 21px/1.2 var(--display); color:#1c4587; font-variant-numeric:tabular-nums; white-space:nowrap; }
.data-caption { display:flex; gap:9px; align-items:center; margin:10px 15px 13px; padding:10px 11px; border-radius:6px; background:#f8edce; color:#5f521d; }
.data-caption>span { font:800 21px/1 var(--display); color:#ab7c20; }
.data-caption p { font-size:10px; line-height:1.8; font-weight:700; min-height:54px; display:flex; align-items:center; transition:opacity .4s ease,transform .4s ease; }
.data-dashboard[data-insight-ready="false"] .data-caption p { opacity:0; transform:translateY(6px); }
.data-dashboard[data-insight-ready="true"] .data-caption p { opacity:1; transform:translateY(0); }
.data-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:6px; padding:10px 14px; border-top:1px solid #d4deed; background:#eef2f9; }
.data-controls button { min-height:44px; padding:8px 10px; background:white; border:1px solid #d3deef; border-radius:6px; font-size:11px; font-weight:700; color:#405d8d; display:flex; align-items:center; justify-content:center; gap:5px; transition:background .2s,translate .2s; }
.data-controls button:hover { background:#fff5d8; translate:0 -1px; }
.data-controls button>span[aria-hidden] { font:700 18px/1 var(--display); color:#1a4daf; }
.data-controls [data-data-autoplay] { font-size:11px; border-color:transparent; background:transparent; }
.data-controls [data-data-autoplay]>i { height:5px; width:5px; border-radius:50%; background:#c7a251; }
.data-controls [data-data-autoplay][aria-pressed="false"]>i { background:#9aa9c0; }
.data-dashboard[data-autoplay-state="reading"] .data-controls [data-data-autoplay]>i,
.data-dashboard[data-autoplay-state="waiting"] .data-controls [data-data-autoplay]>i,
.data-dashboard[data-autoplay-state="background"] .data-controls [data-data-autoplay]>i,
.data-dashboard[data-autoplay-state="motion-off"] .data-controls [data-data-autoplay]>i { background:#8b9db6; }
.data-controls [data-data-autoplay]:disabled { cursor:default; color:#586d8e; }
.data-play-hint { text-align:center; color:#e6c66f; font-size:11px; line-height:1.8; margin-top:18px; font-weight:700; }
.data-play-hint>span { font-size:14px; margin-right:4px; }
.data-sample-note { color:#a6b9d9; font-size:10px; line-height:1.85; margin-top:10px; }
.data-real-link { display:flex; align-items:center; justify-content:space-between; margin-top:23px; border-top:1px solid #52719f69; padding-top:16px; font-size:11px; font-weight:700; color:#e6edfa; }
.data-real-link>span { color:var(--gold); font-size:18px; }
.data-real-link:hover { color:var(--gold); }
@keyframes data-gold-pass { 0%{transform:translateX(0);opacity:0}15%{opacity:1}100%{transform:translateX(275%);opacity:0} }
@keyframes data-companion-pop { 0%{transform:translateY(6px) rotate(-3deg)}45%{transform:translateY(-4px) rotate(2deg)}100%{transform:none} }
@media(max-width:540px) {
  .data-heading-star { font-size:57px; }
  .data-dashboard { margin-top:25px; }
  .data-summary { padding:21px 16px 18px; min-height:153px; }
  :is(#data-total-number,.data-total-copy-number) { font-size:clamp(48px,14vw,65px); letter-spacing:-1.2px; }
  :is(#data-total-prefix,.data-total-copy-prefix) { font-size:24px; }
  .data-total { min-height:69px; padding-right:74px; }
  .data-meta { padding-right:75px; }
  .data-companion,.data-companion .crew-sprite { width:105px; }
  .data-companion { right:-5px; bottom:0; }
  .data-companion-bubble { font-size:7px; right:6px; top:-8px; }
  .data-chart-card { margin-left:12px; margin-right:12px; padding-left:8px; padding-right:8px; }
  .data-table-card { margin-left:13px; margin-right:13px; }
  .data-tabs { padding-left:12px; padding-right:12px; }
  .data-tabs button { font-size:10px; }
  .data-tabs button>span { font-size:9px; margin-right:3px; }
  .data-row-name { font-size:10px; gap:5px; }
  :is(#data-ledger,.data-ledger-copy) [data-row-value] { font-size:20px; }
  .data-caption { margin-left:12px; margin-right:12px; }
  .data-play-hint { font-size:11px; }
}
@media(max-width:370px) {
  .data-section .section-lead { font-size:11px; }
  .data-summary { padding-left:12px; padding-right:12px; }
  .data-summary-label { font-size:10px; gap:5px; }
  :is(#data-total-number,.data-total-copy-number) { font-size:48px; }
  :is(#data-total-prefix,.data-total-copy-prefix) { font-size:21px; }
  .data-companion,.data-companion .crew-sprite { width:91px; }
  .data-companion { bottom:6px; }
  .data-companion-bubble { right:2px; font-size:6px; padding:5px 7px; }
  .data-tabs { padding:10px 9px 0; gap:4px; }
  .data-tabs button { font-size:9px; }
  .data-tabs button>span { display:none; }
  .data-chart-heading h3 { font-size:10px; }
  .data-chart-card { margin-left:9px; margin-right:9px; padding-left:7px; padding-right:7px; }
  .data-table-card { margin-left:10px; margin-right:10px; }
  .data-row-name { font-size:9px; gap:4px; }
  [data-row-mark] { width:16px; height:17px; font-size:9px; }
  .data-row-track { margin-left:20px; width:calc(100% - 23px); }
  :is(#data-ledger,.data-ledger-copy) [data-row-value] { font-size:18px; }
  :is(#data-ledger,.data-ledger-copy) [data-row-detail] { font-size:9px; }
  .data-controls { padding-left:9px; padding-right:9px; gap:3px; }
  .data-controls button { font-size:11px; padding-left:7px; padding-right:7px; }
  .data-caption { margin-left:9px; margin-right:9px; padding:8px; }
  .data-caption p { font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .data-dashboard::after { display:none; }
  .data-caption p { transition:none; }
}
.motion-off .data-dashboard::after { display:none; }
.motion-off .data-caption p { transition:none; }
html[data-motion="off"] .data-caption p { transition:none; }
.image-viewing .data-section *, .night-theater-open .data-section * { animation-play-state:paused!important; transition:none!important; }

/* Transitions retain the current silhouette; bars scale inside a fixed track. */
.data-dashboard[data-shape-enhanced="true"] .data-bar-fill { height:81.25%; }
.data-transition-copy { pointer-events:none!important; user-select:none; z-index:3; }
.data-total-copy, .data-ledger-copy { position:absolute!important; margin:0!important; }
.data-ledger-copy { table-layout:fixed; border-collapse:collapse; }