/* ==========================================================================
   PORTAIL.CSS — Portail de dépôt WazeEditor
   Uniquement des jetons de waze-shared.css (palette, rayons, boutons, typographie de la page
   « Télécharger l'application Waze »). Aucune couleur nouvelle, aucun dégradé, aucune ombre ajoutée.
   Tout est préfixé « dp- » et rattaché à body.dp-page.
   ========================================================================== */

/* Composants chargés : pas de boîte propre, le header reste « sticky » par rapport au body. */
[data-component] { display: contents; }
[data-component]:empty { display: block; }
[data-component="header"]:empty { height: var(--nav-h); background: var(--wz-dark); }

.dp-sr {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.dp-skip {
  position: absolute;
  top: -100px; left: 16px;
  z-index: 3000;
  padding: 12px 22px;
  border-radius: 9999px;
  background: #111;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
}
.dp-skip:focus { top: 12px; }

.dp-filewarn {
  margin: 0;
  padding: 16px 24px;
  background: var(--wz-yellow);
  color: var(--wz-text);
  font-size: 0.95rem;
}
.dp-filewarn code { font-family: Consolas, 'Courier New', monospace; font-size: 0.9em; }

/* --------------------------------------------------------------------------
   BOUTONS — pastille noire de la référence (.closing__btn) et sa variante contour
   -------------------------------------------------------------------------- */
.dp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 56px;
  padding: 15px 34px;
  border: 2px solid #111;
  border-radius: 9999px;
  background: #111;
  color: #fff;
  font-family: inherit;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s, transform 0.2s;
}
.dp-btn:hover { background: #2b2b2b; border-color: #2b2b2b; transform: translateY(-2px); }

.dp-btn--outline { background: transparent; color: #111; }
.dp-btn--outline:hover { background: #111; border-color: #111; color: #fff; }

.dp-btn--text { border-color: transparent; background: transparent; color: var(--wz-text-muted); font-weight: 500; }
.dp-btn--text:hover { background: transparent; border-color: transparent; color: var(--wz-text); text-decoration: underline; text-underline-offset: 4px; transform: none; }

.dp-btn--sm { min-height: 44px; padding: 9px 22px; font-size: 0.95rem; }

.dp-btn[aria-disabled="true"] { opacity: 0.4; cursor: not-allowed; }
.dp-btn:disabled { opacity: 0.4; cursor: not-allowed; }
.dp-btn[aria-disabled="true"]:hover { background: #111; border-color: #111; transform: none; }
.dp-btn:disabled:hover { background: #111; border-color: #111; transform: none; }

.dp-btn__count {
  display: inline-grid;
  place-items: center;
  min-width: 26px; height: 26px;
  padding: 0 8px;
  border-radius: 9999px;
  background: var(--wz-blue);
  color: #000;
  font-size: 0.85rem;
  font-weight: 700;
}

/* --------------------------------------------------------------------------
   HERO — .waze-hero de la référence (centré, bleu, coins bas arrondis)
   -------------------------------------------------------------------------- */
.dp-hero { min-height: min(560px, calc(100svh - var(--nav-h))); }
.dp-hero--compact { min-height: 0; padding: clamp(28px, 3.6vw, 40px) 24px clamp(36px, 4.4vw, 52px); border-radius: 0 0 clamp(40px, 5vw, 64px) clamp(40px, 5vw, 64px); }
.dp-hero--compact + .dp-section { padding-top: clamp(28px, 3.6vw, 44px); }

.dp-hero__inner {
  width: 100%;
  max-width: 820px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.dp-hero--compact .glue-headline { margin-bottom: 14px; }
.dp-hero--compact .glue-headline:last-child { margin-bottom: 0; }

.dp-hero__lead {
  margin: 0 0 clamp(28px, 3.6vw, 40px);
  max-width: 34em;
  font-size: clamp(1.05rem, 1.5vw, 1.25rem);
  line-height: 1.5;
  color: #000;
}
.dp-hero--compact .dp-hero__lead { margin-bottom: 0; }

.dp-hero__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 14px; }

/* Sur le bleu, le bouton contour devient blanc au survol (couleur de la palette). */
.waze-hero .dp-btn--outline:hover { background: var(--wz-white); border-color: var(--wz-white); color: #000; }

.dp-status {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: clamp(26px, 3.4vw, 38px) 0 0;
  padding: 9px 20px;
  border-radius: 9999px;
  background: var(--wz-yellow);
  color: var(--wz-text);
  font-size: 0.92rem;
  font-weight: 500;
}
.dp-status svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* --------------------------------------------------------------------------
   SECTIONS BLANCHES — grille et filets de .panel__inner / .panel__list
   -------------------------------------------------------------------------- */
.dp-section { padding: clamp(56px, 8vw, 104px) 24px; background: var(--wz-white); }

.dp-section__inner {
  max-width: 1180px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  column-gap: clamp(32px, 6vw, 96px);
  row-gap: 18px;
}

.dp-index {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(32, 33, 36, 0.6);
}

.dp-title {
  margin: 0;
  font-size: clamp(1.75rem, 3.4vw, 2.6rem);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -0.035em;
  text-wrap: balance;
}

.dp-text { margin: 0; max-width: 34em; font-size: clamp(1.02rem, 1.4vw, 1.2rem); line-height: 1.55; }
.dp-text + .dp-text { margin-top: 14px; }
.dp-text a, .dp-prose a { color: var(--wz-text); text-decoration-thickness: 2px; text-underline-offset: 4px; }
.dp-text a:hover, .dp-prose a:hover { background: var(--wz-blue); }

.dp-list { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(32, 33, 36, 0.22); }
.dp-list li { padding: 13px 0; border-bottom: 1px solid rgba(32, 33, 36, 0.22); font-size: 1rem; font-weight: 500; }
.dp-list strong { font-weight: 700; }

.dp-section__body { display: flex; flex-direction: column; gap: 26px; }

/* Pages de texte (aide, confidentialité, mentions légales) */
.dp-prose { max-width: 760px; margin: 0 auto; }
.dp-prose h2 { margin: clamp(36px, 5vw, 56px) 0 14px; font-size: clamp(1.4rem, 2.4vw, 1.8rem); font-weight: 500; line-height: 1.2; letter-spacing: -0.03em; }
.dp-prose h2:first-child { margin-top: 0; }
.dp-prose p, .dp-prose li { font-size: 1.05rem; line-height: 1.6; }
.dp-prose p { margin: 0 0 14px; }
.dp-prose ol, .dp-prose ul { margin: 0 0 14px; padding-left: 1.3em; }
.dp-prose li { margin-bottom: 6px; }
.dp-prose figure { margin: 18px 0 0; }
.dp-prose img { display: block; width: 100%; height: auto; border-radius: 18px; border: 1px solid rgba(32, 33, 36, 0.22); }
.dp-prose figcaption { margin-top: 8px; font-size: 0.9rem; color: var(--wz-text-muted); }
.dp-back { display: inline-block; margin: 0 0 28px; color: var(--wz-text); font-weight: 700; text-underline-offset: 4px; }
.dp-back:hover { background: var(--wz-blue); }

.dp-table { width: 100%; border-collapse: collapse; margin: 0 0 14px; font-size: 0.95rem; }
.dp-table th, .dp-table td { padding: 11px 12px 11px 0; border-bottom: 1px solid rgba(32, 33, 36, 0.22); text-align: left; vertical-align: top; }
.dp-table th { font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; color: var(--wz-text-muted); border-top: 1px solid rgba(32, 33, 36, 0.22); }
.dp-table code { font-family: Consolas, 'Courier New', monospace; font-size: 0.88em; word-break: break-all; }

/* --------------------------------------------------------------------------
   NOTICES — jaune (information / non disponible) et rose (erreur), de la palette
   -------------------------------------------------------------------------- */
.dp-notice {
  margin: 0 0 clamp(20px, 3vw, 30px);
  padding: 16px 22px;
  border-radius: 24px;
  background: var(--wz-yellow);
  color: var(--wz-text);
  font-size: 1rem;
  line-height: 1.5;
}
.dp-notice strong { font-weight: 700; }
.dp-notice--sky { background: var(--wz-sky); }
.dp-notice--error { background: var(--wz-rose); }
.dp-notice--ok { background: var(--wz-sky); }
.dp-notice[hidden] { display: none; }
.dp-notice:focus-visible { outline: 3px solid #005fcc; outline-offset: 4px; }
.dp-notice button {
  margin-left: 6px; padding: 0;
  border: 0; background: none;
  color: var(--wz-text);
  font: inherit; font-weight: 700;
  text-decoration: underline; text-underline-offset: 4px;
  cursor: pointer;
}

/* --------------------------------------------------------------------------
   FORMULAIRE DE DÉPÔT
   -------------------------------------------------------------------------- */
.dp-form-wrap { max-width: 760px; margin: 0 auto; }

.dp-step { padding: 0 0 clamp(30px, 4vw, 44px); margin: 0 0 clamp(30px, 4vw, 44px); border: 0; border-bottom: 1px solid rgba(32, 33, 36, 0.22); }
.dp-step:last-of-type { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.dp-step > .dp-index { margin-bottom: 8px; }
.dp-step > .dp-title { margin-bottom: 16px; font-size: clamp(1.5rem, 2.6vw, 2rem); }

/* Zone de dépôt : surface « sky » de la palette */
.dp-dz {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(220px, 30vh, 280px);
  padding: clamp(28px, 4vw, 44px) 22px;
  border: 2px dashed rgba(32, 33, 36, 0.4);
  border-radius: 32px;
  background: var(--wz-sky);
  text-align: center;
  cursor: pointer;
  transition: background-color 0.2s, border-color 0.2s;
}
.dp-dz__body { display: flex; flex-direction: column; align-items: center; gap: 8px; max-width: 28em; }
.dp-dz__icon { width: 52px; height: 52px; margin-bottom: 6px; fill: none; stroke: var(--wz-text); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dp-dz__title { margin: 0; font-size: clamp(1.4rem, 2.6vw, 1.9rem); font-weight: 500; line-height: 1.2; letter-spacing: -0.03em; }
.dp-dz__or { margin: 0; font-size: 1rem; }
.dp-dz__limits { margin: 10px 0 0; font-size: 0.92rem; }
.dp-dz__tip { margin: 0; font-size: 0.9rem; }

.dp-dz:hover { background: var(--wz-blue); border-style: solid; border-color: #111; }
.dp-dz.is-dragover { background: var(--wz-blue); border-style: solid; border-color: #111; }
.dp-dz.is-error { background: var(--wz-rose); border-color: #111; }

.dp-over-text { display: none; }
.dp-dz.is-dragover .dp-idle-text { display: none; }
.dp-dz.is-dragover .dp-over-text { display: inline; }

.dp-fine { display: inline; }
.dp-touch { display: none; }
@media (hover: none), (pointer: coarse) {
  .dp-fine { display: none; }
  .dp-touch { display: inline; }
}

/* Messages */
.dp-msg { margin: 0; font-size: 0.98rem; line-height: 1.5; }
.dp-msg:not(:empty) { margin-top: 14px; }
.dp-msg--error { padding: 14px 20px; border-radius: 20px; background: var(--wz-rose); font-weight: 500; }
.dp-msg--error::before { content: "À corriger : "; font-weight: 700; }
.dp-msg--ok { color: var(--wz-text-muted); }
.dp-msg ul { margin: 0; padding: 0; list-style: none; }
.dp-msg li + li { margin-top: 4px; }

/* Sélection locale */
.dp-selection { margin-top: 26px; }
.dp-selection[hidden] { display: none; }

.dp-selection__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 10px; }
.dp-selection__title { margin: 0; font-size: 1.1rem; font-weight: 700; }
.dp-selection__chip { margin: 0; padding: 4px 14px; border-radius: 9999px; background: var(--wz-sky); font-size: 0.85rem; font-weight: 700; }

.dp-meter { height: 8px; border-radius: 9999px; background: rgba(32, 33, 36, 0.12); overflow: hidden; }
.dp-meter__fill { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--wz-blue-dark); transition: width 0.3s var(--ease); }
.dp-selection__total { display: flex; justify-content: space-between; gap: 12px; margin: 10px 0 0; font-size: 0.95rem; font-variant-numeric: tabular-nums; }
.dp-selection__total span:first-child { font-weight: 700; }

.dp-files { list-style: none; margin: 14px 0 0; padding: 0; border-top: 1px solid rgba(32, 33, 36, 0.22); }
.dp-file {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(32, 33, 36, 0.22);
}
.dp-file__thumb {
  position: relative;
  width: 56px; height: 56px;
  display: grid; place-items: center;
  border-radius: 14px;
  background: var(--wz-sky);
  overflow: hidden;
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em;
}
.dp-file__thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dp-file__main { min-width: 0; line-height: 1.35; }
.dp-file__name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.dp-file__meta { display: block; font-size: 0.88rem; color: var(--wz-text-muted); font-variant-numeric: tabular-nums; }

.dp-file__remove {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 44px; padding: 8px 14px;
  border: 2px solid transparent; border-radius: 9999px;
  background: transparent;
  color: var(--wz-text);
  font: inherit; font-size: 0.92rem; font-weight: 700;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}
.dp-file__remove:hover { background: var(--wz-rose); }
.dp-file__remove svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }

.dp-selection__foot { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center; justify-content: space-between; font-size: 0.9rem; color: var(--wz-text-muted); }
.dp-selection__foot p { margin: 0; }
.dp-selection__foot .dp-btn--text { padding-left: 0; }

/* Champs */
.dp-field { margin: 0 0 24px; }
.dp-field:last-child { margin-bottom: 0; }
.dp-label { display: block; margin: 0 0 8px; font-size: 1rem; font-weight: 700; }
.dp-label small { font-weight: 400; color: var(--wz-text-muted); font-size: 0.92rem; margin-left: 4px; }
.dp-input {
  display: block; width: 100%;
  min-height: 54px; padding: 12px 20px;
  border: 2px solid rgba(32, 33, 36, 0.4);
  border-radius: 9999px;
  background: var(--wz-white);
  color: var(--wz-text);
  font: inherit; font-size: 1.05rem;
}
.dp-input:hover { border-color: var(--wz-text); }
.dp-input:focus-visible { outline: 3px solid #005fcc; outline-offset: 3px; border-color: var(--wz-text); }
.dp-textarea { min-height: 132px; border-radius: 22px; resize: vertical; }
.dp-hint { margin: 8px 0 0 20px; font-size: 0.92rem; color: var(--wz-text-muted); }

.dp-help-btn {
  display: inline-flex; align-items: center; gap: 8px;
  margin: 10px 0 0 14px; padding: 6px 8px;
  border: 0; background: none;
  color: var(--wz-text);
  font: inherit; font-size: 0.95rem; font-weight: 700;
  text-decoration: underline; text-underline-offset: 4px;
  cursor: pointer;
}
.dp-help-btn:hover { background: var(--wz-blue); }
.dp-help-btn svg { width: 18px; height: 18px; fill: currentColor; transition: transform 0.2s; }
.dp-help-btn[aria-expanded="true"] svg { transform: rotate(180deg); }

.dp-help { margin: 12px 0 0; padding: 18px 20px 20px; border-radius: 24px; background: var(--wz-sky); }
.dp-help[hidden] { display: none; }
.dp-help p { margin: 0 0 12px; font-size: 0.98rem; line-height: 1.5; }
.dp-help figure { margin: 0; }
.dp-help img { display: block; width: 100%; height: auto; border-radius: 16px; }
.dp-help figcaption { margin-top: 8px; font-size: 0.88rem; }

/* Envoi */
.dp-send { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.dp-service-status { display: flex; gap: 14px; align-items: flex-start; width: 100%; padding: 16px 18px; border: 1px solid var(--dp-line); border-left: 5px solid #8797a6; border-radius: 16px; background: #f5f8fa; }
.dp-service-status__icon { display: grid; place-items: center; flex: 0 0 28px; width: 28px; height: 28px; border-radius: 50%; background: #8797a6; color: #fff; font-weight: 800; }
.dp-service-status strong { display: block; font-size: 1rem; }
.dp-service-status p { margin: 4px 0 8px; line-height: 1.45; }
.dp-service-status a { font-weight: 700; color: var(--wz-blue, #087ea4); }
.dp-service-status.service-status--ok { border-left-color: #168a59; background: #eefaf4; }
.dp-service-status.service-status--ok .dp-service-status__icon { background: #168a59; }
.dp-service-status.service-status--ok a { display: none; }
.dp-service-status.service-status--warn { border-left-color: #c47b00; background: #fff8e8; }
.dp-service-status.service-status--warn .dp-service-status__icon { background: #c47b00; }
.dp-service-status.service-status--maintenance { border-left-color: #5572c9; background: #f0f3ff; }
.dp-service-status.service-status--maintenance .dp-service-status__icon { background: #5572c9; }
.dp-service-status.service-status--error { border-left-color: #c74646; background: #fff1f1; }
.dp-service-status.service-status--error .dp-service-status__icon { background: #c74646; }
.dp-send__facts { margin: 0; padding: 0; list-style: none; font-size: 0.98rem; }
.dp-send__facts li { margin: 0 0 4px; }
.dp-send__note { margin: 0; font-size: 0.95rem; color: var(--wz-text); }
.dp-progress { width: 100%; }
.dp-progress[hidden] { display: none; }
.dp-progress progress { width: 100%; height: 12px; accent-color: var(--wz-blue-dark); }
.dp-progress p { margin: 6px 0 0; font-size: 0.92rem; }

/* --------------------------------------------------------------------------
   DOSSIERS MÉMORISÉS
   -------------------------------------------------------------------------- */
.dp-dossiers__list[hidden], .dp-dossiers__empty[hidden] { display: none; }
.dp-dossiers__list ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(32, 33, 36, 0.22); }
.dp-dossier { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; padding: 18px 0; border-bottom: 1px solid rgba(32, 33, 36, 0.22); }
.dp-dossier__id { margin: 0; font-size: 1.1rem; font-weight: 700; }
.dp-dossier__meta { margin: 2px 0 0; font-size: 0.92rem; color: var(--wz-text-muted); }
.dp-dossier__subject { margin: 4px 0 0; font-weight: 700; color: var(--wz-text); }
.dp-dossier__actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.dp-card-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 28px 0; }
.dp-card { padding: 22px; border: 1px solid rgba(32, 33, 36, 0.22); border-radius: 24px; }
.dp-card h2 { margin: 0 0 8px; font-size: 1.15rem; }
.dp-card p { margin: 0; line-height: 1.5; }
.dp-follow-header { padding: 8px 0 24px; border-bottom: 1px solid var(--dp-line); }
.dp-follow-subject { margin: 0 0 8px; font-size: clamp(1.7rem, 4vw, 2.5rem); font-weight: 800; color: var(--wz-text); }
.dp-follow-id, .dp-follow-date { margin: 4px 0; color: var(--wz-text-muted); }
.dp-follow-status { display: inline-block; margin: 18px 0 4px; padding: 7px 12px; border-radius: 999px; background: rgba(0, 144, 255, .1); color: var(--wz-blue, #0879d1); font-weight: 700; }
.dp-retention, .dp-dossier__retention { margin: 8px 0 0; color: var(--wz-text-muted); font-weight: 600; }
.dp-retention--urgent, .dp-dossier__retention--urgent { color: #b3261e; }
.dp-retention--soon, .dp-dossier__retention--soon { color: #9a5b00; }
.dp-route { margin: 30px 0; padding: 22px 0; border-bottom: 1px solid var(--dp-line); }
.dp-route__head { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; }
.dp-route__head h2 { margin: 0; font-size: 1.2rem; }
.dp-route__head span { color: var(--wz-text-muted); font-weight: 700; }
.dp-route__line { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; list-style: none; padding: 24px 0 0; margin: 0; }
.dp-route__line li { position: relative; padding-top: 20px; color: var(--wz-text-muted); font-size: .88rem; }
.dp-route__line li::before { content: ''; position: absolute; top: 0; left: 0; width: 14px; height: 14px; border: 2px solid currentColor; border-radius: 50%; background: var(--dp-surface); z-index: 1; }
.dp-route__line li:not(:last-child)::after { content: ''; position: absolute; top: 6px; left: 14px; right: 0; border-top: 2px solid var(--dp-line); }
.dp-route__line li.is-complete { color: var(--wz-blue, #0879d1); font-weight: 700; }
.dp-route__line li.is-complete::before { background: currentColor; box-shadow: 0 0 0 4px rgba(0, 144, 255, .12); }
.dp-hint { color: var(--wz-text-muted); font-size: .9rem; line-height: 1.5; }
.dp-follow-details { margin: 0; border-bottom: 1px solid var(--dp-line); }
.dp-follow-details div { display: grid; grid-template-columns: minmax(140px, .35fr) 1fr; gap: 24px; padding: 14px 0; border-top: 1px solid var(--dp-line); }
.dp-follow-details dt { font-weight: 700; }
.dp-follow-details dd { margin: 0; color: var(--wz-text-muted); }
.dp-history { margin: 24px 0; border-bottom: 1px solid var(--dp-line); }
.dp-history summary { cursor: pointer; padding: 14px 0; font-weight: 700; }
.dp-complement { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--dp-line); }
.dp-complement h2 { margin: 0; font-size: 1.2rem; }
.dp-label { display: block; margin: 16px 0 6px; font-weight: 700; }
.dp-input { box-sizing: border-box; width: 100%; padding: 11px 12px; border: 1px solid var(--dp-line); border-radius: 10px; font: inherit; background: var(--dp-surface); }
.dp-textarea { resize: vertical; }
.dp-msg { min-height: 1.5em; color: var(--wz-blue, #0879d1); font-weight: 600; }

.dp-empty { padding: clamp(28px, 4vw, 44px); border-radius: 32px; background: var(--wz-sky); }
.dp-empty h2 { margin: 0 0 10px; font-size: clamp(1.4rem, 2.4vw, 1.8rem); font-weight: 500; letter-spacing: -0.03em; }
.dp-empty p { margin: 0 0 14px; max-width: 34em; font-size: 1.02rem; line-height: 1.55; }
.dp-empty .dp-btn { margin-top: 10px; }

/* Administration : héros sombre, distinct de l'interface publique */
.dp-hero--admin { background: var(--wz-dark); }
.dp-hero--admin .glue-headline, .dp-hero--admin .dp-hero__lead { color: var(--wz-white); }

/* --------------------------------------------------------------------------
   RESPONSIVE
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
  .dp-section__inner { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 767px) {
  .dp-hero { min-height: 0; }
  .dp-hero--compact { padding: 32px 20px 40px; border-radius: 0 0 40px 40px; }
  .dp-hero--compact + .dp-section { padding-top: 28px; }
  .dp-hero__actions { width: 100%; flex-direction: column; }
  .dp-hero__actions .dp-btn { width: 100%; max-width: 360px; }
  .dp-status { font-size: 0.88rem; padding: 9px 16px; text-align: left; }
  .dp-section { padding: 44px 16px 56px; }
  .dp-dz { min-height: 220px; border-radius: 28px; }
  .dp-dz__body .dp-btn { width: 100%; }
  .dp-file { grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; }
  .dp-file__thumb { width: 48px; height: 48px; }
  .dp-file__remove span { display: none; }
  .dp-file__remove { padding: 8px; min-width: 44px; justify-content: center; }
  .dp-send .dp-btn { width: 100%; }
  .dp-dossier__actions { width: 100%; }
  .dp-prose img { border-radius: 14px; }
  .dp-notice { border-radius: 20px; padding: 14px 18px; }
  .dp-empty { border-radius: 28px; }
  .dp-card-grid { grid-template-columns: 1fr; }
  .dp-route__line { grid-template-columns: 1fr; gap: 14px; padding-top: 18px; }
  .dp-route__line li { padding: 0 0 0 28px; min-height: 28px; }
  .dp-route__line li::before { top: 0; left: 0; }
  .dp-route__line li:not(:last-child)::after { top: 14px; bottom: -14px; left: 6px; right: auto; border-top: 0; border-left: 2px solid var(--dp-line); }
  .dp-follow-details div { grid-template-columns: 1fr; gap: 4px; }
}

@media (prefers-reduced-motion: reduce) {
  .dp-btn, .dp-dz, .dp-meter__fill, .dp-help-btn svg { transition: none; }
  .dp-btn:hover { transform: none; }
}

/* --------------------------------------------------------------------------
   DIRECTION PORTAIL — composition, surfaces et états
   -------------------------------------------------------------------------- */
:root {
  --dp-ink: #18212b;
  --dp-muted: #607080;
  --dp-line: rgba(24, 33, 43, .12);
  --dp-surface: #f5f9fb;
  --dp-shadow: 0 18px 50px rgba(27, 62, 79, .11);
}
body.dp-page { background: var(--dp-surface); color: var(--dp-ink); }
.portal-nav { background: rgba(18, 19, 22, .96); backdrop-filter: blur(14px); }
.portal-nav .global-nav__container { max-width: 1240px; }
.portal-nav .global-nav__logo-link { gap: 12px; }
.portal-nav .global-nav__logo-img { width: 38px; height: 38px; object-fit: contain; }
.portal-nav__identity { display: flex; flex-direction: column; line-height: 1.05; color: #fff; }
.portal-nav__identity strong { font-size: 1rem; letter-spacing: -.02em; }
.portal-nav__identity small { margin-top: 5px; color: rgba(255,255,255,.55); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.portal-nav .global-nav__menu { justify-content: center; gap: 8px; }
.portal-nav .global-nav__link { position: relative; border-radius: 0; padding: 25px 14px 22px; }
.portal-nav .global-nav__link::after { content: ""; position: absolute; right: 14px; bottom: 14px; left: 14px; height: 3px; border-radius: 3px; background: var(--wz-blue); transform: scaleX(0); transition: transform .25s var(--ease); }
.portal-nav .global-nav__link:hover::after, .portal-nav .global-nav__link:focus-visible::after { transform: scaleX(1); }
.portal-nav .global-nav__cta-btn { border-radius: 999px; padding: 10px 16px; background: var(--wz-blue); color: #081116; font-weight: 700; }
.portal-nav .global-nav__cta-btn:hover { background: #fff; color: #111; }

.dp-home-hero { position: relative; min-height: 0; padding: clamp(62px, 8vw, 106px) 24px clamp(58px, 7vw, 90px); overflow: hidden; background: linear-gradient(125deg, #bdebff 0%, #dff7ff 55%, #fff59d 150%); border-radius: 0 0 72px 72px; }
.dp-home-hero::before { content: ""; position: absolute; width: 360px; height: 360px; top: -190px; right: 8%; border: 1px solid rgba(0,153,204,.16); border-radius: 50%; box-shadow: 0 0 0 28px rgba(255,255,255,.16), 0 0 0 56px rgba(255,255,255,.12); }
.dp-home-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 30px clamp(40px, 7vw, 100px); max-width: 1080px; align-items: center; }
.dp-home-hero__copy { grid-column: 1; }
.dp-eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 18px; color: #17637b; font-size: .78rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.dp-eyebrow span { width: 34px; height: 4px; border-radius: 4px; background: #111; }
.dp-home-hero .glue-headline { max-width: 720px; margin: 0 0 20px; font-size: clamp(2.55rem, 5vw, 5.2rem); line-height: .98; letter-spacing: -.065em; }
.dp-home-hero .dp-hero__lead { max-width: 590px; margin: 0; color: #294354; font-size: clamp(1.05rem, 1.6vw, 1.25rem); }
.dp-home-hero__art { position: relative; grid-column: 2; grid-row: 1 / span 2; display: grid; place-items: center; min-height: 250px; }
.dp-home-hero__art img { position: relative; z-index: 1; width: 170px; filter: drop-shadow(0 22px 18px rgba(22,67,84,.2)); animation: dp-float 5s ease-in-out infinite; }
.dp-art__halo { position: absolute; width: 230px; height: 230px; border: 2px solid rgba(0,153,204,.2); border-radius: 50%; box-shadow: inset 0 0 0 24px rgba(255,255,255,.12); }
.dp-art__spark { position: absolute; width: 12px; height: 12px; background: #111; transform: rotate(45deg); }
.dp-art__spark--one { top: 28px; right: 16px; }.dp-art__spark--two { bottom: 26px; left: 18px; width: 8px; height: 8px; background: #0099cc; }
.dp-home-hero .dp-hero__actions { grid-column: 1; justify-content: flex-start; margin-top: 5px; }
.dp-home-hero .dp-btn svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dp-home-hero .dp-status { grid-column: 1 / -1; justify-self: start; margin-top: 4px; }
.dp-home-actions { align-items: start; }
.dp-home-actions .dp-title { max-width: 420px; }
.dp-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.dp-facts div { min-height: 92px; padding: 16px; border: 1px solid var(--dp-line); border-radius: 18px; background: #fff; box-shadow: 0 6px 20px rgba(27,62,79,.04); }
.dp-facts strong, .dp-facts span { display: block; }.dp-facts strong { font-size: 1.18rem; }.dp-facts span { margin-top: 5px; color: var(--dp-muted); font-size: .8rem; }
.dp-help-card { display: flex; align-items: center; gap: 13px; padding: 16px 18px; border: 1px solid var(--dp-line); border-radius: 18px; background: #fff; color: var(--dp-ink); text-decoration: none; transition: transform .25s var(--ease), box-shadow .25s; }
.dp-help-card:hover { transform: translateY(-3px); box-shadow: var(--dp-shadow); }.dp-help-card__icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--wz-yellow); font-weight: 800; }.dp-help-card span:nth-child(2) { flex: 1; }.dp-help-card strong, .dp-help-card small { display: block; }.dp-help-card small { margin-top: 3px; color: var(--dp-muted); }.dp-help-card b { font-size: 1.3rem; }
.dp-section { background: var(--dp-surface); }.dp-section__inner { max-width: 1080px; }.dp-index { color: #1680a0; }.dp-list, .dp-card, .dp-dossiers__list, .dp-empty, .dp-step, .dp-notice { border-color: var(--dp-line); }
.dp-form-wrap { max-width: 880px; margin: 0 auto; }.dp-step { margin: 0 0 24px; padding: clamp(22px, 3vw, 36px); border: 1px solid var(--dp-line); border-radius: 26px; background: #fff; box-shadow: 0 8px 30px rgba(27,62,79,.045); }.dp-step .dp-title { margin-bottom: 24px; }
.dp-dz { background: #eefaff; border-color: rgba(0,153,204,.45); box-shadow: inset 0 0 0 1px rgba(255,255,255,.6); }.dp-dz:hover, .dp-dz.is-dragover { box-shadow: 0 0 0 5px rgba(51,204,255,.18); }.dp-selection { padding-top: 4px; }.dp-files { border-top-color: var(--dp-line); }.dp-file { border-bottom-color: var(--dp-line); }
.dp-empty { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 22px; align-items: center; background: #e8f8ff; box-shadow: var(--dp-shadow); }.dp-empty::before { content: ""; width: 94px; height: 94px; background: url("../images/Logos/waze-icon.webp") center / contain no-repeat; }.dp-empty h2, .dp-empty p, .dp-empty .dp-btn { grid-column: 2; }.dp-empty h2 { grid-row: 1; }.dp-empty p { grid-row: 2; }.dp-empty .dp-btn { grid-row: 3; justify-self: start; }
.dp-dossiers__list { padding: 22px; border: 1px solid var(--dp-line); border-radius: 26px; background: #fff; box-shadow: var(--dp-shadow); }.dp-dossiers__list ul { border-top-color: var(--dp-line); }.dp-dossier { padding: 20px 4px; border-bottom-color: var(--dp-line); }
.portal-footer .footer-container { max-width: 1240px; }.portal-footer .waze-artwork-stage { opacity: .7; }
.dp-prose { padding: clamp(22px, 4vw, 44px); border: 1px solid var(--dp-line); border-radius: 28px; background: #fff; box-shadow: 0 8px 30px rgba(27,62,79,.045); }.dp-prose h2 { color: var(--dp-ink); }
@keyframes dp-float { 0%,100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-9px) rotate(2deg); } }
@media (max-width: 767px) {
  .portal-nav .global-nav__container { height: 64px; padding: 0 16px; }.portal-nav .global-nav__logo-img { width: 32px; height: 32px; }.portal-nav .global-nav__actions { display: none; }.portal-nav .global-nav__hamburger { display: inline-flex; }.portal-nav__identity strong { font-size: .92rem; }
  .dp-home-hero { padding: 48px 20px 44px; border-radius: 0 0 42px 42px; }.dp-home-hero__inner { display: flex; flex-direction: column; align-items: stretch; gap: 22px; }.dp-home-hero__art { order: -1; min-height: 150px; }.dp-home-hero__art img { width: 110px; }.dp-art__halo { width: 150px; height: 150px; }.dp-home-hero .glue-headline { font-size: clamp(2.3rem, 12vw, 3.5rem); }.dp-home-hero .dp-hero__actions { margin-top: 4px; }.dp-home-hero .dp-status { margin-top: 0; }
  .dp-facts { grid-template-columns: repeat(2, 1fr); }.dp-empty { display: block; text-align: center; }.dp-empty::before { display: block; margin: 0 auto 18px; }.dp-empty .dp-btn { display: inline-flex; }.dp-prose { padding: 22px 18px; }
}
@media (prefers-reduced-motion: reduce) { .dp-home-hero__art img { animation: none; } }

/* Accueil applicatif : surface de travail compacte, sans hero décoratif. */
.dp-workspace {
  max-width: 1120px;
  margin: 0 auto;
  padding: clamp(32px, 5vw, 58px) 24px 26px;
}
.dp-workspace__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  padding-bottom: 30px;
  border-bottom: 1px solid var(--dp-line);
}
.dp-workspace__top h1 {
  max-width: 680px;
  margin: 0 0 10px;
  color: var(--dp-ink);
  font-size: clamp(2rem, 4vw, 3.25rem);
  line-height: 1.02;
  letter-spacing: -.055em;
}
.dp-workspace__intro { max-width: 620px; margin: 0; color: var(--dp-muted); font-size: 1.05rem; }
.dp-workspace__mascot {
  flex: 0 0 136px;
  display: grid;
  place-items: center;
  width: 136px;
  height: 136px;
  border-radius: 50%;
  background: var(--wz-sky);
  border: 1px solid rgba(0,153,204,.16);
}
.dp-workspace__mascot img {
  display: block;
  width: 84px;
  height: auto;
  max-width: 100%;
  object-fit: contain;
}
.dp-workspace__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 14px;
  margin-top: 24px;
}
.dp-action-panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  min-height: 142px;
  padding: 22px 24px;
  border: 1px solid var(--dp-line);
  border-radius: 12px;
  background: var(--wz-white);
  color: var(--dp-ink);
  text-decoration: none;
  transition: border-color .2s, box-shadow .2s, transform .2s var(--ease);
}
.dp-action-panel:hover { border-color: var(--wz-blue-dark); box-shadow: 0 12px 28px rgba(27,62,79,.1); transform: translateY(-2px); }
.dp-action-panel--primary { background: var(--wz-dark); color: var(--wz-white); border-color: var(--wz-dark); }
.dp-action-panel--primary:hover { border-color: var(--wz-blue); }
.dp-action-panel__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: var(--wz-sky);
  color: var(--dp-ink);
}
.dp-action-panel--primary .dp-action-panel__icon { background: var(--wz-blue); }
.dp-action-panel__icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dp-action-panel strong, .dp-action-panel small { display: block; }
.dp-action-panel strong { font-size: 1.15rem; }
.dp-action-panel small { margin-top: 5px; color: var(--dp-muted); line-height: 1.4; }
.dp-action-panel--primary small { color: rgba(255,255,255,.66); }
.dp-action-panel b { font-size: 1.4rem; font-weight: 400; }
.dp-workspace__status { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-top: 20px; }
.dp-workspace__status .dp-status { margin: 0; padding: 7px 0; background: transparent; color: var(--dp-muted); font-size: .88rem; }
.dp-workspace__status .dp-status svg { color: var(--wz-blue-dark); }
.dp-help-link { display: inline-flex; align-items: center; gap: 8px; color: var(--dp-ink); font-size: .92rem; font-weight: 700; text-decoration: none; }
.dp-help-link span { display: grid; place-items: center; width: 23px; height: 23px; border: 1px solid var(--dp-ink); border-radius: 50%; }
.dp-help-link:hover { color: var(--wz-blue-dark); }
.dp-specs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  border-top: 1px solid var(--dp-line);
  border-bottom: 1px solid var(--dp-line);
}
.dp-specs span { padding: 13px 20px 13px 0; margin-right: 20px; color: var(--dp-muted); font-size: .9rem; }
.dp-specs span + span { border-left: 1px solid var(--dp-line); padding-left: 20px; }
.dp-specs strong { color: var(--dp-ink); }
.dp-home-actions .dp-section__body { gap: 0; }
.portal-footer .footer-grid { grid-template-columns: 1.4fr repeat(3, 1fr); }

/* Remplace les règles de la première proposition sans modifier le chrome partagé. */
.dp-home-hero { display: none; }
.dp-home-actions { padding-top: 50px; }

@media (max-width: 767px) {
  .dp-workspace { padding: 28px 16px 20px; }
  .dp-workspace__top { align-items: flex-start; padding-bottom: 24px; }
  .dp-workspace__top h1 { font-size: 2.25rem; }
  .dp-workspace__mascot { flex-basis: 76px; width: 76px; height: 76px; }
  .dp-workspace__mascot img { width: 50px; height: auto; }
  .dp-workspace__grid { grid-template-columns: 1fr; margin-top: 18px; }
  .dp-action-panel { min-height: 112px; padding: 18px; }
  .dp-workspace__status { align-items: flex-start; flex-direction: column; gap: 10px; }
  .dp-specs { display: block; }
  .dp-specs span, .dp-specs span + span { display: block; margin: 0; padding: 10px 0; border-left: 0; }
  .portal-footer .footer-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 380px) {
  .dp-workspace__top { gap: 12px; }
  .dp-workspace__top h1 { font-size: 2rem; }
  .dp-workspace__mascot { flex-basis: 64px; width: 64px; height: 64px; }
  .dp-workspace__mascot img { width: 42px; }
}

/* Signature WazeEditor : bleu d'action, tracé de route et relief discret. */
.dp-page { background: #edf6fa; }
.dp-workspace {
  position: relative;
  max-width: 1180px;
  padding-top: clamp(42px, 6vw, 72px);
}
.dp-workspace::before {
  content: "";
  position: absolute;
  top: 0;
  left: 24px;
  width: 56px;
  height: 5px;
  border-radius: 0 0 5px 5px;
  background: var(--wz-blue);
}
.dp-workspace__top { border-bottom-color: rgba(0,153,204,.2); }
.dp-workspace__top h1 { font-size: clamp(2rem, 3.4vw, 3rem); }
.dp-workspace__mascot {
  flex-basis: 176px;
  width: 176px;
  height: 176px;
  background: var(--wz-blue);
  border: 0;
  box-shadow: 12px 12px 0 rgba(0,153,204,.14);
  transform: rotate(3deg);
  transition: transform .35s var(--ease);
}
.dp-workspace__mascot:hover { transform: rotate(0) scale(1.03); }
.dp-workspace__mascot img {
  width: 124px;
  height: auto;
  max-height: 124px;
  object-fit: contain;
  transform: rotate(-3deg);
}
.dp-action-panel {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  border-color: rgba(0,153,204,.24);
  box-shadow: 0 10px 24px rgba(0,91,122,.07);
}
.dp-action-panel--primary {
  min-height: 178px;
  background: var(--wz-blue);
  color: #07151b;
  border-color: var(--wz-blue);
  box-shadow: 0 14px 30px rgba(0,153,204,.2);
}
.dp-action-panel--primary small { color: rgba(7,21,27,.72); }
.dp-action-panel--primary .dp-action-panel__icon { background: rgba(255,255,255,.82); color: #07151b; }
.dp-action-panel--primary:hover { background: #56d6ff; border-color: #56d6ff; box-shadow: 0 18px 34px rgba(0,153,204,.26); }
.dp-action-panel--primary > span:not(.dp-action-panel__icon),
.dp-action-panel--primary > b { position: relative; z-index: 1; }
.dp-action-panel--primary > b { align-self: start; }
.dp-route-art {
  position: absolute;
  right: -14px;
  bottom: -8px;
  width: min(58%, 520px);
  height: auto;
  opacity: .8;
  pointer-events: none;
}
.dp-route-art__road {
  fill: none;
  stroke: rgba(255,255,255,.58);
  stroke-width: 18;
  stroke-linecap: round;
}
.dp-route-art__dash {
  fill: none;
  stroke: rgba(0,65,88,.42);
  stroke-width: 2;
  stroke-dasharray: 8 12;
  stroke-linecap: round;
  animation: dp-route-move 7s linear infinite;
}
.dp-route-art__pin { fill: #fff; stroke: #006f91; stroke-width: 4; }
.dp-action-panel:not(.dp-action-panel--primary) {
  background: #fff;
  border-left: 5px solid var(--wz-blue);
}
.dp-workspace__status .dp-status {
  color: #315466;
}
.dp-workspace__status .dp-status::before {
  content: "";
  width: 7px;
  height: 7px;
  margin-right: 1px;
  border-radius: 50%;
  background: #f0b400;
  box-shadow: 0 0 0 4px rgba(240,180,0,.14);
}
.dp-specs {
  border-top-color: rgba(0,153,204,.22);
  border-bottom-color: rgba(0,153,204,.22);
  background: rgba(255,255,255,.45);
}
.dp-specs span { color: #466879; }
.dp-specs strong { color: #0b607c; }
.dp-home-actions { padding-bottom: 70px; }
@keyframes dp-route-move { to { stroke-dashoffset: -120px; } }
@media (max-width: 767px) {
  .dp-workspace::before { left: 16px; }
  .dp-workspace__mascot { flex-basis: 92px; width: 92px; height: 92px; box-shadow: 7px 7px 0 rgba(0,153,204,.14); }
  .dp-workspace__mascot img { width: 66px; max-height: 66px; }
  .dp-action-panel--primary { min-height: 142px; }
  .dp-route-art { width: 68%; right: -24px; bottom: -10px; opacity: .62; }
}
@media (prefers-reduced-motion: reduce) {
  .dp-workspace__mascot, .dp-workspace__mascot:hover { transform: none; }
  .dp-route-art__dash { animation: none; }
}

/* --------------------------------------------------------------------------
   WORKSPACE UX — composition fonctionnelle de l'accueil
   -------------------------------------------------------------------------- */
body.dp-page { background: #f7fbfd; }
.dp-workspace { max-width: 1160px; padding: clamp(42px, 6vw, 72px) 28px 30px; }
.dp-workspace::before { display: none; }
.dp-workspace__top { min-height: 150px; padding: 0 0 28px; border-bottom-color: rgba(24,33,43,.12); }
.dp-workspace__top h1 { max-width: 620px; margin-bottom: 12px; font-size: clamp(2rem, 3.5vw, 3.1rem); letter-spacing: -.05em; }
.dp-workspace__intro { max-width: 610px; font-size: 1.03rem; }
.dp-workspace__mascot { flex-basis: 118px; width: 118px; height: 118px; background: var(--wz-sky); border: 1px solid rgba(0,153,204,.18); box-shadow: none; transform: none; }
.dp-workspace__mascot:hover { transform: none; }
.dp-workspace__mascot img { width: 82px; height: auto; max-height: 82px; object-fit: contain; }
.dp-workspace__grid { grid-template-columns: minmax(0, 1.5fr) minmax(280px, .75fr); gap: 20px; margin-top: 24px; }
.dp-action-panel { border-radius: 16px; box-shadow: none; transition: border-color .2s, background-color .2s, transform .2s var(--ease); }
.dp-action-panel--primary { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-rows: auto 1fr; column-gap: 18px; min-height: 226px; padding: 28px; background: var(--wz-blue); border: 0; color: #07151b; }
.dp-action-panel--primary:hover { background: #58d7ff; box-shadow: none; transform: translateY(-2px); }
.dp-action-panel__label { grid-column: 1 / -1; margin-bottom: 28px; color: rgba(7,21,27,.68); font-size: .73rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.dp-action-panel--primary .dp-action-panel__icon { align-self: start; width: 52px; height: 52px; border-radius: 14px; background: rgba(255,255,255,.86); }
.dp-action-panel--primary > span:not(.dp-action-panel__icon):not(.dp-action-panel__label) { align-self: start; }
.dp-action-panel--primary strong { font-size: clamp(1.25rem, 2vw, 1.55rem); }
.dp-action-panel--primary small { max-width: 35em; margin-top: 8px; color: rgba(7,21,27,.72); }
.dp-action-panel--primary > b { align-self: start; padding-top: 14px; font-size: .84rem; font-weight: 700; }
.dp-action-panel--primary > b span { margin-left: 8px; font-size: 1.35rem; font-weight: 400; }
.dp-route-art { display: none; }
.dp-workspace__side { display: flex; flex-direction: column; gap: 10px; padding: 20px; border: 1px solid rgba(24,33,43,.12); border-radius: 16px; background: #fff; }
.dp-panel-heading { margin: 0 0 4px; color: var(--dp-muted); font-size: .74rem; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.dp-action-panel--secondary { min-height: 92px; padding: 16px; border: 1px solid rgba(0,153,204,.2); border-left: 4px solid var(--wz-blue); border-radius: 12px; box-shadow: none; }
.dp-action-panel--secondary:hover { background: #f1fbff; box-shadow: none; }
.dp-action-panel--secondary small { margin-top: 3px; }
.dp-help-link--panel { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: 10px; padding: 13px 4px 4px; border-top: 1px solid rgba(24,33,43,.1); color: var(--dp-ink); text-decoration: none; }
.dp-help-link--panel span { grid-row: 1 / span 2; align-self: center; }
.dp-help-link--panel strong { font-size: .92rem; }
.dp-help-link--panel small { grid-column: 2; color: var(--dp-muted); font-size: .8rem; }
.dp-help-link--panel b { grid-column: 3; grid-row: 1 / span 2; align-self: center; font-size: 1.2rem; font-weight: 400; }
.dp-help-link--panel:hover { color: var(--wz-blue-dark); }
.dp-workspace__status { align-items: center; margin-top: 18px; padding: 12px 0 0; border-top: 1px solid rgba(24,33,43,.1); }
.dp-workspace__status .dp-status { padding: 0; }
.dp-status__context { color: var(--dp-muted); font-size: .84rem; }
.dp-home-actions { padding-top: 44px; padding-bottom: 64px; }
.dp-home-actions .dp-title { max-width: 500px; font-size: clamp(1.55rem, 2.4vw, 2.1rem); }
.dp-specs { margin-top: 4px; background: #fff; border: 1px solid rgba(0,153,204,.16); border-radius: 12px; }
.dp-specs span { padding: 14px 18px; margin: 0; }
.dp-specs span + span { padding-left: 18px; }
@media (max-width: 767px) {
  .dp-workspace { padding: 30px 16px 24px; }
  .dp-workspace__top { min-height: 0; padding-bottom: 22px; }
  .dp-workspace__top h1 { font-size: 2.25rem; }
  .dp-workspace__mascot { flex-basis: 76px; width: 76px; height: 76px; }
  .dp-workspace__mascot img { width: 52px; max-height: 52px; }
  .dp-workspace__grid { grid-template-columns: 1fr; gap: 14px; margin-top: 18px; }
  .dp-action-panel--primary { min-height: 190px; padding: 22px; }
  .dp-action-panel__label { margin-bottom: 20px; }
  .dp-workspace__side { padding: 16px; }
  .dp-workspace__status { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dp-status__context { padding-left: 28px; }
  .dp-specs { display: block; }
  .dp-specs span, .dp-specs span + span { display: block; padding: 10px 14px; border-left: 0; border-bottom: 1px solid rgba(0,153,204,.12); }
  .dp-specs span:last-child { border-bottom: 0; }
}

.portal-nav__mobile-brand { display: flex; align-items: center; gap: 10px; min-width: 0; }
.portal-nav__mobile-brand img { width: 132px; height: auto; max-height: none; object-fit: contain; }
.dp-status--link { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: auto auto; column-gap: 9px; align-items: center; color: inherit; text-decoration: none; }
.dp-status--link .dp-status__dot { grid-row: 1 / span 2; }
.dp-status--link strong { color: var(--dp-ink); font-size: .88rem; }
.dp-status--link small { color: var(--dp-muted); font-size: .78rem; }
.dp-status--link > span:last-child { grid-column: 3; grid-row: 1 / span 2; color: var(--wz-blue-dark); font-size: 1.25rem; transition: transform .2s var(--ease); }
.dp-status--link:hover > span:last-child { transform: translateX(3px); }
.dp-status__dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #98a7ae; box-shadow: 0 0 0 4px rgba(152,167,174,.14); }
.dp-status__dot--blue { background: #008fc1; box-shadow: 0 0 0 4px rgba(0,143,193,.14); }
.dp-status__dot--orange { background: #d8891c; box-shadow: 0 0 0 4px rgba(216,137,28,.14); }
.dp-status__dot--gray { background: #89979e; box-shadow: 0 0 0 4px rgba(137,151,158,.14); }
.dp-specs span { display: inline-flex; align-items: center; gap: 8px; }
.dp-specs svg { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: var(--wz-blue-dark); stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.dp-status-page { max-width: 780px; margin: 0 auto; }
.dp-status-page__summary { display: flex; gap: 16px; align-items: flex-start; padding: 22px; border: 1px solid rgba(24,33,43,.12); border-left: 4px solid #89979e; border-radius: 14px; background: #fff; }
.dp-status-page__summary strong { display: block; color: var(--dp-ink); }
.dp-status-page__summary p { margin: 6px 0 0; color: var(--dp-muted); line-height: 1.55; }
.dp-status-list { display: grid; gap: 8px; margin-top: 20px; }
.dp-status-row { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 17px 18px; border: 1px solid rgba(24,33,43,.1); border-radius: 12px; background: #fff; }
.dp-status-row strong, .dp-status-row small { display: block; }
.dp-status-row small { margin-top: 3px; color: var(--dp-muted); }
.dp-status-row b { color: var(--dp-muted); font-size: .78rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.dp-status-page__history { margin-top: 34px; padding-top: 24px; border-top: 1px solid var(--dp-line); }
.dp-status-page__history .dp-index { margin-bottom: 8px; }
.dp-status-page__history p:last-child { max-width: 58ch; color: var(--dp-muted); line-height: 1.65; }
.dp-status-page__updated { margin: 26px 0; color: var(--dp-muted); font-size: .84rem; }
@media (max-width: 767px) {
  .portal-nav__mobile-brand img { width: 128px; max-height: none; }
  .dp-status-page__summary { padding: 18px; }
  .dp-status-row { grid-template-columns: auto 1fr; }
  .dp-status-row b { grid-column: 2; }
}

.dp-dashboard { padding-bottom: 30px; }
.dp-dashboard__overview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(220px, 1.4fr); gap: 10px; max-width: 1180px; margin: 24px auto 0; }
.dp-dashboard__metric { display: flex; flex-direction: column; justify-content: center; min-height: 82px; padding: 16px 18px; border: 1px solid rgba(24,33,43,.12); border-radius: 12px; background: rgba(255,255,255,.82); }
.dp-dashboard__metric strong { color: var(--wz-blue-dark); font-size: 1.5rem; line-height: 1; }
.dp-dashboard__metric span { margin-top: 7px; color: var(--dp-muted); font-size: .82rem; }
.dp-dashboard__metric--note { border-color: rgba(0,153,204,.18); background: rgba(231,249,255,.72); }
.dp-dashboard__metric--note span { margin: 0; line-height: 1.45; }
.dp-dashboard__content { max-width: 1180px; margin: 20px auto 0; }
.dp-dashboard__cases { min-width: 0; padding: 24px; border: 1px solid rgba(24,33,43,.12); border-radius: 16px; background: #fff; }
.dp-dashboard__section-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.dp-dashboard__section-head .dp-index { margin-bottom: 6px; }
.dp-dashboard__section-head .dp-title { font-size: clamp(1.35rem, 2.3vw, 1.8rem); }
.dp-dashboard__list { display: grid; gap: 8px; }
.dp-dashboard__list[hidden], .dp-dashboard__empty[hidden] { display: none; }
.dp-dashboard__case { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 16px; align-items: center; padding: 16px 0; border-top: 1px solid var(--dp-line); }
.dp-dashboard__case h3 { margin: 0; color: var(--dp-ink); font-size: 1rem; }
.dp-dashboard__case p { margin: 5px 0 0; color: var(--dp-muted); font-size: .83rem; }
.dp-dashboard__case-state { padding: 6px 9px; border-radius: 999px; background: #eef4f6; color: #52666d; font-size: .73rem; font-weight: 800; white-space: nowrap; }
.dp-dashboard__empty { display: grid; justify-items: center; padding: 30px 20px 20px; border-top: 1px solid var(--dp-line); text-align: center; }
.dp-dashboard__empty img { width: 72px; height: 72px; object-fit: contain; margin-bottom: 12px; }
.dp-dashboard__empty h3 { margin: 0; color: var(--dp-ink); font-size: 1.2rem; }
.dp-dashboard__empty p { max-width: 48ch; margin: 8px auto 18px; color: var(--dp-muted); line-height: 1.55; }
.dp-dashboard .dp-workspace__grid { max-width: none; margin-top: 18px; }
@media (max-width: 767px) {
  .dp-dashboard__overview { grid-template-columns: 1fr 1fr; margin-top: 18px; }
  .dp-dashboard__metric--note { grid-column: 1 / -1; min-height: 0; }
  .dp-dashboard__cases { padding: 18px 16px; }
  .dp-dashboard__section-head { align-items: flex-start; flex-direction: column; gap: 8px; }
  .dp-dashboard__case { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .dp-dashboard__case-state { grid-column: 1; grid-row: 2; justify-self: start; }
  .dp-dashboard__case .dp-btn { grid-column: 2; grid-row: 1 / span 2; }
}