/* P-News — Protection News. TV view: a 16:9 stage scaled to the screen.
   Unit --u = 1/100 of the stage width, so the layout is identical on a
   720p, 1080p or 4K screen and never scrolls. Plan.Net charter tokens;
   Avenir Next only, square corners, red for alerts. */

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body.pn {
  background: var(--pn-blackest-black); color: var(--pn-warm-grey);
  font-family: var(--font-sans); overflow: hidden;
  display: grid; place-items: center; -webkit-font-smoothing: antialiased;
  --u: min(1vw, 1.7778vh);
}
.pn-stage {
  width: calc(var(--u) * 100); height: calc(var(--u) * 56.25);
  position: relative; overflow: hidden; background: var(--pn-blackest-black);
  display: grid; grid-template-rows: calc(var(--u) * 7) 1fr calc(var(--u) * 8.8);
}

/* ---- Top: logo, special edition, live ---- */
.pn-top { display: flex; align-items: center; gap: calc(var(--u) * 2); padding: calc(var(--u) * 1.6) calc(var(--u) * 2.5) 0; }
.pn-logo { display: flex; flex-direction: column; gap: calc(var(--u) * 0.3); }
.pn-logo__mark { display: flex; align-items: center; font-weight: var(--fw-bold); font-size: calc(var(--u) * 2.6); line-height: 1; letter-spacing: -0.01em; color: var(--pn-whitest-white); text-transform: uppercase; }
.pn-logo__p {
  display: inline-grid; place-items: center; width: calc(var(--u) * 3.4); height: calc(var(--u) * 3.4); margin-right: calc(var(--u) * 0.35);
  background: var(--pn-digital-red); color: var(--pn-whitest-white); font-size: calc(var(--u) * 2.6);
}
.pn-logo__tag { font-size: calc(var(--u) * 0.8); font-weight: var(--fw-demi); letter-spacing: 0.22em; text-transform: uppercase; color: var(--fg-muted); padding-left: 2px; }
.pn-special {
  margin: 0; padding: calc(var(--u) * 0.45) calc(var(--u) * 1.1); font-size: calc(var(--u) * 1.05); font-weight: var(--fw-bold);
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--pn-blackest-black); background: var(--pn-whitest-white);
}
.pn-live { margin-left: auto; display: flex; flex-direction: column; align-items: flex-end; gap: calc(var(--u) * 0.45); }
.pn-live__badge {
  display: inline-flex; align-items: center; gap: calc(var(--u) * 0.5); padding: calc(var(--u) * 0.35) calc(var(--u) * 0.9);
  background: var(--pn-digital-red); color: var(--pn-whitest-white); font-weight: var(--fw-bold); font-size: calc(var(--u) * 1); letter-spacing: 0.12em; text-transform: uppercase;
}
.pn-live__dot { width: calc(var(--u) * 0.6); height: calc(var(--u) * 0.6); background: var(--pn-whitest-white); border-radius: 50%; animation: pn-pulse 1.6s var(--ease-in-out) infinite alternate; }
.pn-live__date { font-size: calc(var(--u) * 1); color: var(--fg-muted); }
.pn-live__date::first-letter { text-transform: uppercase; }
@keyframes pn-pulse { from { opacity: 1; } to { opacity: 0.25; } }
/* "Jours sans urgence", like a factory safety sign. */
.pn-safety { margin: 0 0 0 auto; display: flex; align-items: center; gap: calc(var(--u) * 0.7); }
.pn-safety + .pn-live { margin-left: calc(var(--u) * 2); }
.pn-safety__days {
  min-width: calc(var(--u) * 3.6); padding: calc(var(--u) * 0.15) calc(var(--u) * 0.6); text-align: center;
  font-size: calc(var(--u) * 2.4); line-height: 1.1; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums;
  color: var(--pn-whitest-white); background: var(--pn-digital-black); border: calc(var(--u) * 0.2) solid var(--pn-warm-grey);
}
.pn-safety.is-zero .pn-safety__days { color: var(--pn-digital-red); border-color: var(--pn-digital-red); }
.pn-safety__label { max-width: calc(var(--u) * 7); font-size: calc(var(--u) * 0.8); line-height: 1.25; font-weight: var(--fw-demi); letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-muted); }

/* ---- Main: stories + side column ---- */
.pn-main { display: grid; grid-template-columns: minmax(0, 1fr) calc(var(--u) * 31); gap: calc(var(--u) * 1.6); padding: calc(var(--u) * 1.2) calc(var(--u) * 2.5); min-height: 0; }
.pn-stories { position: relative; background: var(--bg-alt); min-height: 0; overflow: hidden; }
.pn-story { position: absolute; inset: 0; padding: calc(var(--u) * 2.4) calc(var(--u) * 2.8) calc(var(--u) * 2); display: none; flex-direction: column; border-left: calc(var(--u) * 0.45) solid var(--fg-subtle); }
.pn-story.is-active { display: flex; animation: pn-in var(--dur-slow) var(--ease-out); }
@keyframes pn-in { from { opacity: 0.4; } to { opacity: 1; } }
.pn-story--p0 { border-left-color: var(--pn-digital-red); }
.pn-story--p1 { border-left-color: var(--pn-red-press); }
.pn-story--p2 { border-left-color: var(--warning); }
.pn-story--insolite { border-left-color: var(--pn-sand); }
.pn-story--titles { border-left-color: var(--pn-digital-red); }
.pn-story--figure { border-left-color: var(--pn-whitest-white); }
.pn-story--forecast { border-left-color: var(--pn-warm-grey); }
.pn-story__kicker {
  margin: 0 0 calc(var(--u) * 1.2); display: flex; align-items: baseline; gap: calc(var(--u) * 1.2);
  font-size: calc(var(--u) * 1.3); font-weight: var(--fw-bold); letter-spacing: 0.1em; text-transform: uppercase; color: var(--pn-warm-grey);
}
.pn-story--p0 .pn-story__kicker { color: var(--pn-digital-red); }
.pn-story--p1 .pn-story__kicker { color: var(--pn-red-hover); }
.pn-story--p2 .pn-story__kicker { color: var(--warning); }
.pn-story--insolite .pn-story__kicker { color: var(--pn-sand); }
.pn-story--titles .pn-story__kicker { color: var(--pn-digital-red); }
.pn-story--figure .pn-story__kicker { color: var(--pn-whitest-white); }
.pn-story__code { font-size: calc(var(--u) * 0.95); font-weight: var(--fw-demi); letter-spacing: 0.08em; color: var(--fg-muted); }
.pn-story__title {
  margin: 0; font-weight: var(--fw-bold); font-size: calc(var(--u) * 3.2); line-height: 1.12; letter-spacing: -0.01em; color: var(--pn-whitest-white);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; max-width: 30ch;
}
.pn-story__sub { margin: calc(var(--u) * 1) 0 0; font-size: calc(var(--u) * 1.25); color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-story__text { margin: calc(var(--u) * 1.6) 0 0; font-size: calc(var(--u) * 1.75); line-height: 1.4; color: var(--pn-warm-grey); max-width: 46ch; }
.pn-facts { margin: auto 0 0; display: grid; gap: calc(var(--u) * 0.7); }
.pn-facts div { display: grid; grid-template-columns: calc(var(--u) * 8) 1fr; gap: calc(var(--u) * 1); align-items: baseline; }
.pn-facts dt { font-size: calc(var(--u) * 0.9); font-weight: var(--fw-demi); letter-spacing: 0.1em; text-transform: uppercase; color: var(--fg-muted); }
.pn-facts dd { margin: 0; font-size: calc(var(--u) * 1.3); line-height: 1.3; color: var(--pn-warm-grey); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pn-story__foot { margin: calc(var(--u) * 1.2) 0 0; display: flex; justify-content: space-between; font-size: calc(var(--u) * 0.9); color: var(--fg-subtle); }
.pn-story--insolite .pn-story__foot, .pn-story--p4 .pn-story__foot { margin-top: auto; }

/* Fix deadline, top right of P0 and P1 stories. */
.pn-countdown {
  position: absolute; top: calc(var(--u) * 1.9); right: calc(var(--u) * 2.8); margin: 0;
  display: flex; align-items: center; gap: calc(var(--u) * 0.8); padding: calc(var(--u) * 0.35) calc(var(--u) * 0.9);
  background: var(--pn-blackest-black); border-left: calc(var(--u) * 0.3) solid var(--pn-red-hover);
}
.pn-story--p0 .pn-countdown { border-left-color: var(--pn-digital-red); }
.pn-countdown__label { font-size: calc(var(--u) * 0.85); font-weight: var(--fw-demi); letter-spacing: 0.1em; text-transform: uppercase; color: var(--fg-muted); }
.pn-countdown__value { font-size: calc(var(--u) * 1.7); line-height: 1; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; color: var(--pn-whitest-white); }
.pn-countdown.is-late .pn-countdown__value { color: var(--pn-digital-red); }

/* QR code to the detail page, bottom right; dark on light for every phone reader. */
.pn-story--qr .pn-facts { padding-right: calc(var(--u) * 11); }
.pn-qr { position: absolute; right: calc(var(--u) * 2.8); bottom: calc(var(--u) * 4.6); margin: 0; display: flex; flex-direction: column; align-items: center; gap: calc(var(--u) * 0.5); }
.pn-qr__code { display: block; width: calc(var(--u) * 9); height: calc(var(--u) * 9); padding: calc(var(--u) * 0.75); background: var(--pn-whitest-white); color: var(--pn-blackest-black); }
.pn-qr figcaption { font-size: calc(var(--u) * 0.8); font-weight: var(--fw-demi); letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-muted); }

/* "Les titres": the top headlines, one after the other. */
.pn-titles { list-style: none; margin: auto 0; padding: 0; display: flex; flex-direction: column; gap: calc(var(--u) * 1.8); }
.pn-titles__item { display: grid; grid-template-columns: calc(var(--u) * 4.6) 1fr; gap: calc(var(--u) * 1.4); align-items: baseline; }
.pn-titles__item .pn-next__code { font-size: calc(var(--u) * 1.1); padding: calc(var(--u) * 0.25) 0; }
.pn-titles__text { font-size: calc(var(--u) * 2.5); line-height: 1.15; font-weight: var(--fw-bold); color: var(--pn-whitest-white); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pn-story--titles.is-active .pn-titles__item { animation: pn-title-in 600ms var(--ease-out) both; }
.pn-story--titles.is-active .pn-titles__item:nth-child(2) { animation-delay: 1.4s; }
.pn-story--titles.is-active .pn-titles__item:nth-child(3) { animation-delay: 2.8s; }
@keyframes pn-title-in { from { opacity: 0; transform: translateX(calc(var(--u) * -3)); } to { opacity: 1; transform: none; } }

/* "Le chiffre du jour". */
.pn-figure__value { margin: auto 0 0; font-size: calc(var(--u) * 11); line-height: 0.95; font-weight: var(--fw-bold); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; color: var(--pn-digital-red); transform-origin: left bottom; }
.pn-figure__text { margin: calc(var(--u) * 1.2) 0 0; font-size: calc(var(--u) * 2.6); line-height: 1.15; font-weight: var(--fw-bold); color: var(--pn-whitest-white); max-width: 26ch; }
.pn-figure__note { margin: calc(var(--u) * 1.2) 0 auto; font-size: calc(var(--u) * 1.3); color: var(--fg-muted); }
.pn-story--figure.is-active .pn-figure__value { animation: pn-pop 700ms var(--ease-out) both; }
@keyframes pn-pop { from { opacity: 0; transform: scale(0.85); } to { opacity: 1; transform: none; } }

/* "Prévisions des correctifs": the next patch days, weather-forecast style. */
.pn-forecast { list-style: none; margin: auto 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: calc(var(--u) * 0.8); }
.pn-forecast__day { display: flex; flex-direction: column; gap: calc(var(--u) * 0.5); min-height: calc(var(--u) * 17); padding: calc(var(--u) * 1.2) calc(var(--u) * 1); background: var(--pn-blackest-black); border-top: calc(var(--u) * 0.3) solid var(--pn-warm-grey); }
.pn-forecast__day--storm { border-top-color: var(--pn-digital-red); }
.pn-forecast__date { margin: 0; display: flex; flex-direction: column; font-size: calc(var(--u) * 1); color: var(--fg-muted); }
.pn-forecast__date b { font-size: calc(var(--u) * 1.3); font-weight: var(--fw-bold); color: var(--pn-whitest-white); }
.pn-forecast__date b::first-letter { text-transform: uppercase; }
.pn-forecast__day .icon { width: calc(var(--u) * 4); height: calc(var(--u) * 4); margin: calc(var(--u) * 0.6) 0; color: var(--pn-warm-grey); }
.pn-forecast__day--storm .icon { color: var(--pn-digital-red); }
.pn-forecast__sky { margin: 0; font-size: calc(var(--u) * 0.8); font-weight: var(--fw-demi); letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-muted); }
.pn-forecast__title { margin: 0; font-size: calc(var(--u) * 1.2); line-height: 1.25; font-weight: var(--fw-demi); color: var(--pn-warm-grey); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pn-forecast__when { margin: auto 0 0; padding-top: calc(var(--u) * 0.6); font-size: calc(var(--u) * 1); color: var(--fg-subtle); }
.pn-progress { position: absolute; left: 0; right: 0; bottom: 0; height: calc(var(--u) * 0.25); background: var(--border); }
.pn-progress span { display: block; height: 100%; width: 0; background: var(--pn-digital-red); }
.pn-progress span.is-running { animation: pn-fill linear forwards; }
@keyframes pn-fill { from { width: 0; } to { width: 100%; } }

.pn-side { display: flex; flex-direction: column; gap: calc(var(--u) * 0.9); min-height: 0; }
/* Explicit line heights: the column must fit whatever the font's own metrics. */
.pn-box { position: relative; background: var(--bg-alt); padding: calc(var(--u) * 1) calc(var(--u) * 1.4); line-height: 1.25; }
.pn-box--grow { flex: 1; min-height: 0; overflow: hidden; }
.pn-box__title { margin: 0 0 calc(var(--u) * 0.7); font-size: calc(var(--u) * 0.95); font-weight: var(--fw-bold); letter-spacing: 0.12em; text-transform: uppercase; color: var(--pn-whitest-white); }
.pn-box__title::before { content: ""; display: block; width: calc(var(--u) * 3); height: calc(var(--u) * 0.22); background: var(--pn-digital-red); margin-bottom: calc(var(--u) * 0.5); }
.pn-box__note { margin: calc(var(--u) * 0.8) 0 0; font-size: calc(var(--u) * 0.85); color: var(--fg-subtle); }
/* "Le point": the 7-day note sits on the title line, right-aligned. */
.pn-box--point .pn-box__note { position: absolute; top: calc(var(--u) * 1.78); right: calc(var(--u) * 1.4); max-width: calc(var(--u) * 20); margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-score { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(var(--u) * 0.5); }
.pn-score__cell { display: flex; flex-direction: column; gap: calc(var(--u) * 0.2); background: var(--pn-blackest-black); padding: calc(var(--u) * 0.55) calc(var(--u) * 0.7); border-top: calc(var(--u) * 0.2) solid transparent; }
.pn-score__cell b { font-size: calc(var(--u) * 2.3); line-height: 1; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; color: var(--fg-muted); }
.pn-score__cell span { font-size: calc(var(--u) * 0.75); line-height: 1.2; color: var(--fg-muted); }
.pn-score__cell.is-on b { color: var(--pn-whitest-white); }
.pn-score__cell--p0.is-on { border-top-color: var(--pn-digital-red); }
.pn-score__cell--p0.is-on b { color: var(--pn-digital-red); }
.pn-score__cell--p1.is-on { border-top-color: var(--pn-red-press); }
.pn-score__cell--p2.is-on { border-top-color: var(--warning); }
.pn-score__cell--certfr.is-on { border-top-color: var(--pn-warm-grey); }

.pn-weather { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: calc(var(--u) * 0.1) calc(var(--u) * 1); }
.pn-weather__item { display: flex; justify-content: space-between; align-items: center; gap: calc(var(--u) * 0.6); font-size: calc(var(--u) * 0.95); line-height: 1.2; padding: calc(var(--u) * 0.05) 0; border-bottom: 1px solid var(--border); }
.pn-weather__item span { color: var(--pn-warm-grey); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pn-weather__item b { display: inline-flex; align-items: center; gap: calc(var(--u) * 0.4); font-weight: var(--fw-demi); color: var(--success); white-space: nowrap; }
.pn-weather__item .icon { width: calc(var(--u) * 1.15); height: calc(var(--u) * 1.15); flex: none; }
.pn-weather__item--p0 b { color: var(--pn-digital-red); }
.pn-weather__item--p1 b { color: var(--pn-red-hover); }
.pn-weather__item--p2 b { color: var(--warning); }
.pn-weather__item--p3 b { color: var(--pn-warm-grey); }

.pn-next { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: calc(var(--u) * 0.6); }
.pn-next li { display: grid; grid-template-columns: calc(var(--u) * 4.6) 1fr; gap: calc(var(--u) * 0.7); align-items: baseline; font-size: calc(var(--u) * 1); line-height: 1.3; color: var(--pn-warm-grey); }
.pn-next li[hidden] { display: none; }
.pn-next li > span:last-child { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pn-next__code { font-size: calc(var(--u) * 0.75); font-weight: var(--fw-bold); letter-spacing: 0.06em; text-transform: uppercase; text-align: center; padding: calc(var(--u) * 0.1) 0; background: var(--fg-subtle); color: var(--pn-blackest-black); }
.pn-next__code--p0 { background: var(--pn-digital-red); color: var(--pn-whitest-white); }
.pn-next__code--p1 { background: var(--pn-red-press); color: var(--pn-whitest-white); }
.pn-next__code--p2 { background: var(--warning); }
.pn-next__code--insolite { background: var(--pn-sand); }
.pn-next__code--titles { background: var(--pn-digital-red); color: var(--pn-whitest-white); }
.pn-next__code--figure { background: var(--pn-whitest-white); }
.pn-next__code--forecast { background: var(--pn-warm-grey); }

/* ---- Bottom: lower third + ticker ---- */
.pn-bottom { display: grid; grid-template-rows: 1fr calc(var(--u) * 3.4); }
.pn-lower { position: relative; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: stretch; margin: 0 calc(var(--u) * 2.5); background: var(--pn-whitest-white); }
.pn-lower::after { content: ""; position: absolute; inset: 0; background: var(--pn-digital-red); transform: translateX(-101%); pointer-events: none; }
.pn-lower.is-wiping::after { animation: pn-wipe 640ms var(--ease-in-out); }
@keyframes pn-wipe { 0% { transform: translateX(-101%); } 45%, 55% { transform: translateX(0); } 100% { transform: translateX(101%); } }
.pn-lower__kicker {
  display: flex; align-items: center; padding: 0 calc(var(--u) * 1.4); font-size: calc(var(--u) * 1.3); font-weight: var(--fw-bold);
  letter-spacing: 0.08em; text-transform: uppercase; background: var(--pn-warm-grey); color: var(--pn-blackest-black); white-space: nowrap;
}
.pn-lower__kicker[data-level="0"] { background: var(--pn-digital-red); color: var(--pn-whitest-white); }
.pn-lower__kicker[data-level="1"] { background: var(--pn-red-press); color: var(--pn-whitest-white); }
.pn-lower__kicker[data-level="2"] { background: var(--warning); }
.pn-lower__kicker[data-level="insolite"] { background: var(--pn-sand); }
.pn-lower__kicker[data-level="titles"] { background: var(--pn-digital-red); color: var(--pn-whitest-white); }
.pn-lower__kicker[data-level="figure"] { background: var(--pn-blackest-black); color: var(--pn-whitest-white); }
.pn-lower__headline {
  display: flex; align-items: center; padding: 0 calc(var(--u) * 1.4); min-width: 0;
  font-size: calc(var(--u) * 1.9); font-weight: var(--fw-bold); color: var(--pn-digital-black); letter-spacing: -0.005em;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pn-lower__clock {
  display: flex; align-items: center; padding: 0 calc(var(--u) * 1.4); background: var(--pn-blackest-black); color: var(--pn-whitest-white);
  font-size: calc(var(--u) * 2.1); font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; border: calc(var(--u) * 0.2) solid var(--pn-whitest-white);
}
.pn-ticker { display: grid; grid-template-columns: auto minmax(0, 1fr); background: var(--pn-warm-grey); color: var(--pn-digital-black); margin-top: calc(var(--u) * 0.5); }
.pn-ticker__label {
  display: flex; align-items: center; padding: 0 calc(var(--u) * 1.4) 0 calc(var(--u) * 2.5); background: var(--pn-blackest-black); color: var(--pn-whitest-white);
  font-size: calc(var(--u) * 1.05); font-weight: var(--fw-bold); letter-spacing: 0.12em; text-transform: uppercase;
}
.pn-ticker__viewport { overflow: hidden; display: flex; align-items: center; }
.pn-ticker__track { display: flex; width: max-content; animation: pn-scroll 240s linear infinite; }
.pn-ticker__group { display: flex; }
.pn-ticker__item { display: inline-flex; align-items: center; gap: calc(var(--u) * 0.6); white-space: nowrap; font-size: calc(var(--u) * 1.2); padding-right: calc(var(--u) * 2.2); }
.pn-ticker__item::before { content: ""; width: calc(var(--u) * 0.55); height: calc(var(--u) * 0.55); background: var(--pn-digital-red); flex: none; }
.pn-ticker__item b { font-weight: var(--fw-bold); }
.pn-ticker__item--fun::before { background: var(--pn-digital-black); }
.pn-ticker__item--fun b { color: var(--pn-red-press); }
@keyframes pn-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ---- Overlays: "Flash spécial" and the channel ident ---- */
.pn-flash, .pn-ident, .pn-gta { position: absolute; inset: 0; z-index: 10; }
.pn-flash { z-index: 11; }
.pn-flash[hidden], .pn-ident[hidden], .pn-gta[hidden], .pn-flash__item[hidden] { display: none; }
.pn-flash { display: grid; grid-template-rows: minmax(0, 1fr) auto auto; background: var(--pn-digital-red); color: var(--pn-whitest-white); }
.pn-flash.is-on { animation: pn-cut-in 360ms var(--ease-out); }
@keyframes pn-cut-in { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
.pn-flash__item { display: flex; flex-direction: column; justify-content: center; gap: calc(var(--u) * 2); padding: calc(var(--u) * 3) calc(var(--u) * 6); min-height: 0; }
.pn-flash__label {
  align-self: flex-start; margin: 0; padding: calc(var(--u) * 0.6) calc(var(--u) * 1.6); background: var(--pn-whitest-white); color: var(--pn-digital-red);
  font-size: calc(var(--u) * 3); font-weight: var(--fw-bold); line-height: 1; letter-spacing: 0.1em; text-transform: uppercase;
  animation: pn-blink 1s steps(1) infinite;
}
@keyframes pn-blink { 50% { background: var(--pn-blackest-black); color: var(--pn-whitest-white); } }
.pn-flash__title { margin: 0; max-width: 24ch; font-size: calc(var(--u) * 5); line-height: 1.08; font-weight: var(--fw-bold); letter-spacing: -0.015em; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.pn-flash__meta { margin: 0; font-size: calc(var(--u) * 1.8); font-weight: var(--fw-demi); }
.pn-flash__band { margin: 0; display: flex; align-items: center; gap: calc(var(--u) * 1); padding: calc(var(--u) * 1) calc(var(--u) * 6); background: var(--pn-blackest-black); font-size: calc(var(--u) * 1.3); font-weight: var(--fw-bold); letter-spacing: 0.14em; text-transform: uppercase; }
.pn-flash__band .pn-logo__p { width: calc(var(--u) * 2.4); height: calc(var(--u) * 2.4); margin: 0; font-size: calc(var(--u) * 1.8); }
.pn-flash__bar { height: calc(var(--u) * 0.4); background: var(--pn-blackest-black); }
.pn-flash__bar span { display: block; height: 100%; width: 0; background: var(--pn-whitest-white); }
.pn-flash__bar span.is-running { animation: pn-fill linear forwards; }

.pn-ident { display: flex; flex-direction: column; justify-content: center; gap: calc(var(--u) * 2.4); background: var(--pn-blackest-black); }
.pn-ident.is-on { animation: pn-ident-out 500ms var(--ease-in-out) 2.3s forwards; }
@keyframes pn-ident-out { to { clip-path: inset(0 0 0 100%); } }
.pn-ident__logo {
  position: relative; margin: 0; padding: calc(var(--u) * 1.4) 0; display: flex; align-items: center; justify-content: center;
  font-size: calc(var(--u) * 7); font-weight: var(--fw-bold); line-height: 1; letter-spacing: -0.01em; text-transform: uppercase; color: var(--pn-whitest-white);
}
.pn-ident__logo::before { content: ""; position: absolute; inset: 0; background: var(--pn-digital-red); transform-origin: left; transform: scaleX(0); }
.pn-ident__logo > * { position: relative; }
.pn-ident__logo .pn-logo__p { width: calc(var(--u) * 8.6); height: calc(var(--u) * 8.6); margin-right: calc(var(--u) * 0.8); font-size: calc(var(--u) * 7); background: var(--pn-whitest-white); color: var(--pn-digital-red); transform: scale(0); }
.pn-ident__word { clip-path: inset(0 100% 0 0); }
.pn-ident__tag { margin: 0; text-align: center; font-size: calc(var(--u) * 1.4); font-weight: var(--fw-demi); letter-spacing: 0.3em; text-transform: uppercase; color: var(--pn-warm-grey); opacity: 0; }
.pn-ident.is-on .pn-ident__logo::before { animation: pn-grow 500ms var(--ease-out) forwards; }
.pn-ident.is-on .pn-ident__logo .pn-logo__p { animation: pn-grow 400ms var(--ease-out) 300ms forwards; }
.pn-ident.is-on .pn-ident__word { animation: pn-reveal 500ms var(--ease-out) 600ms forwards; }
.pn-ident.is-on .pn-ident__tag { animation: pn-fade-in 400ms var(--ease-out) 1.1s forwards; }
@keyframes pn-grow { to { transform: none; } }
@keyframes pn-reveal { to { clip-path: inset(0); } }
@keyframes pn-fade-in { to { opacity: 1; } }

/* ---- "En attendant GTA 6": a Vice City night in charter colours, a square
   sun (the P-News square) behind Rockstar's official logo, shown as is
   (no recolouring, no distortion) with its credit. ---- */
.pn-gta { background: var(--pn-blackest-black); color: var(--pn-whitest-white); overflow: hidden; }
.pn-gta > * { position: absolute; left: 0; right: 0; margin: 0; text-align: center; }
.pn-gta__scene { top: 0; bottom: 0; }
.pn-gta__stars span { position: absolute; width: calc(var(--u) * 0.3); height: calc(var(--u) * 0.3); background: var(--pn-sand); }
.pn-gta__stars span:nth-child(1) { left: calc(var(--u) * 6); top: calc(var(--u) * 4); animation-delay: 0.0s; }
.pn-gta__stars span:nth-child(2) { left: calc(var(--u) * 15); top: calc(var(--u) * 9); animation-delay: 0.37s; }
.pn-gta__stars span:nth-child(3) { left: calc(var(--u) * 27); top: calc(var(--u) * 3); animation-delay: 0.74s; }
.pn-gta__stars span:nth-child(4) { left: calc(var(--u) * 33); top: calc(var(--u) * 13); animation-delay: 1.11s; }
.pn-gta__stars span:nth-child(5) { left: calc(var(--u) * 64); top: calc(var(--u) * 5); animation-delay: 1.48s; }
.pn-gta__stars span:nth-child(6) { left: calc(var(--u) * 71); top: calc(var(--u) * 12); animation-delay: 1.85s; }
.pn-gta__stars span:nth-child(7) { left: calc(var(--u) * 80); top: calc(var(--u) * 3); animation-delay: 0.02s; }
.pn-gta__stars span:nth-child(8) { left: calc(var(--u) * 88); top: calc(var(--u) * 9); animation-delay: 0.39s; }
.pn-gta__stars span:nth-child(9) { left: calc(var(--u) * 95); top: calc(var(--u) * 15); animation-delay: 0.76s; }
.pn-gta__stars span:nth-child(10) { left: calc(var(--u) * 4); top: calc(var(--u) * 21); animation-delay: 1.13s; }
.pn-gta__stars span:nth-child(11) { left: calc(var(--u) * 36); top: calc(var(--u) * 24); animation-delay: 1.5s; }
.pn-gta__stars span:nth-child(12) { left: calc(var(--u) * 62); top: calc(var(--u) * 22); animation-delay: 1.87s; }
.pn-gta.is-on .pn-gta__stars span { animation-name: pn-gta-twinkle; animation-duration: 2.2s; animation-timing-function: steps(2); animation-iteration-count: infinite; animation-direction: alternate; }
@keyframes pn-gta-twinkle { from { opacity: 1; } to { opacity: 0.2; } }
.pn-gta__horizon { position: absolute; left: 0; right: 0; top: calc(var(--u) * 32); height: calc(var(--u) * 0.25); background: var(--pn-sand); }
.pn-gta__sunbox { position: absolute; left: calc(var(--u) * 40); top: calc(var(--u) * 12); width: calc(var(--u) * 20); height: calc(var(--u) * 20); overflow: hidden; }
.pn-gta__sun { position: relative; width: 100%; height: 100%; background: var(--pn-digital-red); }
/* Horizontal cuts through the lower half of the sun, retro style. */
.pn-gta__sun span { position: absolute; left: 0; right: 0; background: var(--pn-blackest-black); transform-origin: left; }
.pn-gta__sun span:nth-child(1) { top: calc(var(--u) * 11); height: calc(var(--u) * 0.5); }
.pn-gta__sun span:nth-child(2) { top: calc(var(--u) * 13.5); height: calc(var(--u) * 0.8); }
.pn-gta__sun span:nth-child(3) { top: calc(var(--u) * 15.8); height: calc(var(--u) * 1.1); }
.pn-gta__sun span:nth-child(4) { top: calc(var(--u) * 18); height: calc(var(--u) * 1.4); }
.pn-gta__palm { position: absolute; bottom: calc(var(--u) * 24.25); color: var(--pn-sand); }
.pn-gta__palm .icon { display: block; width: 100%; height: 100%; transform-origin: 50% 100%; }
.pn-gta__palm--a { left: calc(var(--u) * 9); width: calc(var(--u) * 15); height: calc(var(--u) * 15); }
.pn-gta__palm--b { left: calc(var(--u) * 22); width: calc(var(--u) * 9); height: calc(var(--u) * 9); }
.pn-gta__palm--c { right: calc(var(--u) * 22); width: calc(var(--u) * 9); height: calc(var(--u) * 9); transform: scaleX(-1); }
.pn-gta__palm--d { right: calc(var(--u) * 9); width: calc(var(--u) * 15); height: calc(var(--u) * 15); transform: scaleX(-1); }
.pn-gta__kicker { top: calc(var(--u) * 2.4); font-size: calc(var(--u) * 1.3); font-weight: var(--fw-bold); letter-spacing: 0.3em; text-transform: uppercase; color: var(--pn-sand); }
.pn-gta__logo { left: 50%; right: auto; top: calc(var(--u) * 5); width: auto; height: calc(var(--u) * 18); transform: translateX(-50%); }
.pn-gta__credit { top: auto; left: auto; right: calc(var(--u) * 2); bottom: calc(var(--u) * 3.9); font-size: calc(var(--u) * 0.75); color: var(--fg-subtle); }
.pn-gta__count { top: calc(var(--u) * 34.5); display: flex; justify-content: center; gap: calc(var(--u) * 0.8); perspective: calc(var(--u) * 40); }
.pn-gta__count p { margin: 0; display: flex; flex-direction: column; align-items: center; gap: calc(var(--u) * 0.3); min-width: calc(var(--u) * 8.4); padding: calc(var(--u) * 0.8) calc(var(--u) * 1); background: var(--pn-digital-black); border-top: calc(var(--u) * 0.25) solid var(--pn-digital-red); }
.pn-gta__count b { font-size: calc(var(--u) * 4); line-height: 1; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; }
.pn-gta__count span { font-size: calc(var(--u) * 0.85); font-weight: var(--fw-demi); letter-spacing: 0.14em; text-transform: uppercase; color: var(--pn-sand); }
.pn-gta__date { top: calc(var(--u) * 42.8); font-size: calc(var(--u) * 1.5); font-weight: var(--fw-demi); }
.pn-gta__line { top: calc(var(--u) * 45.6); font-size: calc(var(--u) * 1.15); color: var(--pn-warm-grey); }
.pn-gta__band { top: auto; bottom: 0; height: calc(var(--u) * 3.2); display: flex; align-items: center; overflow: hidden; background: var(--pn-sand); color: var(--pn-blackest-black); }
.pn-gta__track { display: flex; width: max-content; animation: pn-scroll 30s linear infinite; }
.pn-gta__track > span { display: flex; }
.pn-gta__track span span { display: inline-flex; align-items: center; gap: calc(var(--u) * 1.4); padding-right: calc(var(--u) * 1.4); white-space: nowrap; font-size: calc(var(--u) * 1.15); font-weight: var(--fw-bold); letter-spacing: 0.14em; text-transform: uppercase; }
.pn-gta__track span span::before { content: ""; width: calc(var(--u) * 0.5); height: calc(var(--u) * 0.5); background: var(--pn-digital-red); flex: none; }

.pn-gta.is-on { animation: pn-gta-open 450ms var(--ease-out), pn-gta-close 500ms var(--ease-in-out) 11.5s forwards; }
@keyframes pn-gta-open { from { clip-path: inset(57% 0 43% 0); } to { clip-path: inset(0); } }
@keyframes pn-gta-close { to { clip-path: inset(57% 0 43% 0); } }
.pn-gta.is-on .pn-gta__horizon { animation: pn-grow-x 600ms var(--ease-out) 200ms both; }
.pn-gta.is-on .pn-gta__sun { animation: pn-gta-rise 1200ms var(--ease-out) 400ms both; }
.pn-gta.is-on .pn-gta__sun span { animation: pn-grow-x 500ms var(--ease-out) both; }
.pn-gta.is-on .pn-gta__sun span:nth-child(1) { animation-delay: 1.4s; }
.pn-gta.is-on .pn-gta__sun span:nth-child(2) { animation-delay: 1.5s; }
.pn-gta.is-on .pn-gta__sun span:nth-child(3) { animation-delay: 1.6s; }
.pn-gta.is-on .pn-gta__sun span:nth-child(4) { animation-delay: 1.7s; }
.pn-gta.is-on .pn-gta__palm .icon { animation: pn-gta-grow-y 700ms var(--ease-out) 600ms both, pn-gta-sway 2.6s var(--ease-in-out) 1.3s infinite alternate; }
.pn-gta.is-on .pn-gta__palm--b .icon, .pn-gta.is-on .pn-gta__palm--c .icon { animation-delay: 800ms, 1.6s; }
.pn-gta.is-on .pn-gta__logo { animation: pn-gta-logo 700ms var(--ease-out) 1s both; }
.pn-gta.is-on .pn-gta__count p { animation: pn-gta-flip 500ms var(--ease-out) both; }
.pn-gta.is-on .pn-gta__count p:nth-child(1) { animation-delay: 1.8s; }
.pn-gta.is-on .pn-gta__count p:nth-child(2) { animation-delay: 1.9s; }
.pn-gta.is-on .pn-gta__count p:nth-child(3) { animation-delay: 2s; }
.pn-gta.is-on .pn-gta__count p:nth-child(4) { animation-delay: 2.1s; }
.pn-gta.is-on .pn-gta__kicker, .pn-gta.is-on .pn-gta__date, .pn-gta.is-on .pn-gta__line, .pn-gta.is-on .pn-gta__credit { animation: pn-fade-in 500ms var(--ease-out) both; }
.pn-gta.is-on .pn-gta__kicker { animation-delay: 600ms; }
.pn-gta.is-on .pn-gta__date { animation-delay: 2.4s; }
.pn-gta.is-on .pn-gta__line, .pn-gta.is-on .pn-gta__credit { animation-delay: 2.7s; }
.pn-gta.is-on .pn-gta__band { animation: pn-gta-band 500ms var(--ease-out) 400ms both; }
@keyframes pn-grow-x { from { transform: scaleX(0); } to { transform: none; } }
@keyframes pn-gta-rise { from { transform: translateY(100%); } to { transform: none; } }
@keyframes pn-gta-grow-y { from { transform: scaleY(0); } to { transform: none; } }
@keyframes pn-gta-sway { from { transform: none; } to { transform: rotate(-4deg); } }
@keyframes pn-gta-logo { from { opacity: 0; transform: translateX(-50%) translateY(calc(var(--u) * 3)) scale(0.85); } to { opacity: 1; transform: translateX(-50%); } }
@keyframes pn-gta-flip { from { opacity: 0; transform: rotateX(90deg); } to { opacity: 1; transform: none; } }
@keyframes pn-gta-band { from { transform: translateY(100%); } to { transform: none; } }

/* ---- "J-28 avant GTA 6", top bar, until the release ---- */
.pn-gtabadge { margin: 0 0 0 auto; display: flex; align-items: center; gap: calc(var(--u) * 0.7); }
.pn-gtabadge + .pn-safety, .pn-gtabadge + .pn-live { margin-left: calc(var(--u) * 2); }
.pn-gtabadge__days {
  padding: calc(var(--u) * 0.35) calc(var(--u) * 0.6); font-size: calc(var(--u) * 1.6); line-height: 1.1; font-weight: var(--fw-bold);
  font-variant-numeric: tabular-nums; background: var(--pn-digital-red); color: var(--pn-whitest-white);
}
.pn-gtabadge__label { max-width: calc(var(--u) * 6); font-size: calc(var(--u) * 0.8); line-height: 1.25; font-weight: var(--fw-demi); letter-spacing: 0.12em; text-transform: uppercase; color: var(--pn-sand); }

/* ---- Night and weekends: "Fin des programmes", drifting so the panel does not mark ---- */
.pn-stage--night { display: block; }
.pn-night { position: absolute; left: calc(var(--u) * 6); top: calc(var(--u) * 6); display: flex; flex-direction: column; gap: calc(var(--u) * 1.2); animation: pn-drift 1200s linear infinite alternate; }
@keyframes pn-drift {
  0% { transform: translate(0, 0); }
  25% { transform: translate(calc(var(--u) * 46), calc(var(--u) * 6)); }
  50% { transform: translate(calc(var(--u) * 18), calc(var(--u) * 20)); }
  75% { transform: translate(calc(var(--u) * 48), calc(var(--u) * 19)); }
  100% { transform: translate(calc(var(--u) * 4), calc(var(--u) * 13)); }
}
.pn-night__title { margin: calc(var(--u) * 1.5) 0 0; font-size: calc(var(--u) * 3); font-weight: var(--fw-bold); letter-spacing: 0.06em; text-transform: uppercase; color: var(--pn-warm-grey); }
.pn-night__clock { margin: 0; font-size: calc(var(--u) * 7); line-height: 1; font-weight: var(--fw-bold); font-variant-numeric: tabular-nums; color: var(--pn-whitest-white); }
.pn-night__resume { margin: 0; font-size: calc(var(--u) * 1.5); color: var(--pn-warm-grey); }
.pn-night__note { margin: 0; font-size: calc(var(--u) * 1.05); color: var(--fg-subtle); }

@media (prefers-reduced-motion: reduce) {
  .pn-ticker__track { animation: none; }
  .pn-live__dot { animation: none; }
  .pn-story.is-active { animation: none; }
  .pn-progress span.is-running, .pn-flash__bar span.is-running { animation: none; }
  .pn-lower.is-wiping::after, .pn-flash.is-on, .pn-flash__label, .pn-night { animation: none; }
  .pn-story--titles.is-active .pn-titles__item, .pn-story--figure.is-active .pn-figure__value { animation: none; }
  .pn-ident { display: none; }
  .pn-gta.is-on, .pn-gta.is-on *, .pn-gta__track { animation: none !important; }
}
