/* ===== Fiche projet en niveaux (project-sheet.css) — habillage partagé ; les couleurs viennent des variables --ps-* =====
   Windows : définies par .wp (windows-projects.css). Linux : définies par .sw-detail (voir bas de ce fichier).
   Animations : ouverture d'une section (grid-template-rows 0fr → 1fr, 180 ms) et pastilles ; coupées avec prefers-reduced-motion
   et l'interrupteur « Animations » de Linux. */
.ps { --ps-fg: var(--wp-fg, #14253a); --ps-muted: var(--wp-muted, #5d7288); --ps-line: var(--wp-line, #dbe6f1); --ps-card: var(--wp-card, #ffffffd9); --ps-a: var(--wp-a, #2871b6); --ps-a2: var(--wp-a2, #e91e63); --ps-hover: var(--wp-hover, #e6f0fb);
  display: grid; gap: 14px; max-width: 760px; color: var(--ps-fg); font-size: 15.5px; line-height: 1.55; }
.ps *, .ps *::before, .ps *::after { box-sizing: border-box; }
.ps-hook { margin: 4px 0 0; font-size: 17.5px; line-height: 1.5; font-weight: 600; max-width: 62ch; }
.ps-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.ps-chips span { padding: 4px 11px; border: 1px solid color-mix(in srgb, var(--ps-a) 28%, var(--ps-line)); border-radius: 99px; background: color-mix(in srgb, var(--ps-a) 9%, transparent); color: var(--ps-a); font-size: 12.5px; font-weight: 700; line-height: 1.4; animation: psPop .35s ease both; animation-delay: calc(var(--i, 0) * 30ms); }
.ps-chips .ps-more { color: var(--ps-muted); border-color: var(--ps-line); background: none; }
.ps-facts { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; padding: 0; list-style: none; color: var(--ps-muted); font-size: 13.5px; }
.ps-facts b { color: var(--ps-a); font-size: 15px; }
.ps-imgs { margin-inline-start: auto; font-weight: 700; color: var(--ps-fg); }

.ps-acc { display: grid; gap: 8px; margin-top: 4px; }
.ps-sec { border: 1px solid var(--ps-line); border-radius: 12px; background: var(--ps-card); overflow: hidden; transition: border-color .18s, box-shadow .18s; }
.ps-sec.is-open { border-color: color-mix(in srgb, var(--ps-a) 45%, var(--ps-line)); box-shadow: 0 8px 20px color-mix(in srgb, var(--ps-a) 10%, transparent); }
.ps-h { margin: 0; font: inherit; text-transform: none; letter-spacing: 0; }
.ps-btn { display: flex; align-items: center; gap: 10px; width: 100%; padding: 12px 14px; border: 0; background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; transition: background .15s; }
.ps-btn:hover { background: var(--ps-hover); }
.ps-btn:focus-visible { outline: 2px solid var(--ps-a); outline-offset: -2px; }
.ps-ic { flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; background: color-mix(in srgb, var(--ps-a) 14%, transparent); color: var(--ps-a); font: 700 12px 'IBM Plex Mono', ui-monospace, monospace; }
.ps-t { flex: none; font-size: 12.5px; font-weight: 800; letter-spacing: .08em; font-variant: all-small-caps; text-transform: lowercase; font-size: 14.5px; }
.ps-prev { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ps-muted); font-size: 13.5px; }
.ps-sec.is-open .ps-prev { visibility: hidden; }
.ps-chev { flex: none; color: var(--ps-muted); transition: transform .18s; }
.ps-sec.is-open .ps-chev { transform: rotate(90deg); }
html.lang-rtl .ps-chev { transform: scaleX(-1); }
html.lang-rtl .ps-sec.is-open .ps-chev { transform: scaleX(-1) rotate(90deg); }
.ps-body { display: grid; grid-template-rows: 0fr; visibility: hidden; transition: grid-template-rows .18s ease, visibility 0s .18s; }
.ps-sec.is-open .ps-body { grid-template-rows: 1fr; visibility: visible; transition: grid-template-rows .18s ease, visibility 0s; }
.ps-inner { min-height: 0; overflow: hidden; padding: 0 16px; }
.ps-sec.is-open .ps-inner { padding: 2px 16px 16px; }
.ps-p { margin: 0; max-width: 70ch; }
.ps-list { margin: 0; padding-inline-start: 20px; display: grid; gap: 8px; max-width: 70ch; }
.ps-list li::marker { color: var(--ps-a); }
.ps-list li[hidden] { display: none; }
.ps-all { margin-top: 10px; padding: 6px 14px; border: 1px solid var(--ps-line); border-radius: 99px; background: none; color: var(--ps-a); font: 700 13px inherit; cursor: pointer; transition: background .15s; }
.ps-all:hover { background: var(--ps-hover); }
.ps-all:focus-visible { outline: 2px solid var(--ps-a); outline-offset: 2px; }
.ps-sub { margin: 14px 0 8px; font-size: 12px; font-weight: 800; letter-spacing: .08em; font-variant: all-small-caps; text-transform: lowercase; color: var(--ps-muted); }
.ps-sub:first-child { margin-top: 4px; }
.ps-info { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0; }
.ps-info dt { color: var(--ps-muted); }
.ps-info dd { margin: 0; font-weight: 600; }
.ps-cta { margin: 6px 0 0; }
.ps-next { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border: 0; border-radius: 99px; background: linear-gradient(105deg, var(--ps-a), color-mix(in srgb, var(--ps-a) 55%, var(--ps-a2))); color: #fff; font: 800 14px inherit; cursor: pointer; transition: transform .15s, box-shadow .2s; }
.ps-next:hover { transform: translateY(-2px); box-shadow: 0 10px 22px color-mix(in srgb, var(--ps-a) 35%, transparent); }
.ps-next:focus-visible { outline: 2px solid var(--ps-a); outline-offset: 3px; }
@keyframes psPop { from { opacity: 0; transform: scale(.85); } }
@media (max-width: 640px) {
  .ps-btn { flex-wrap: wrap; }
  .ps-prev { flex-basis: 100%; order: 5; padding-inline-start: 38px; }
  .ps-sec.is-open .ps-prev { display: none; }
  .ps-imgs { margin-inline-start: 0; }
}
@media (prefers-reduced-motion: reduce) { .ps *, .ps *::before, .ps *::after { animation: none !important; transition: none !important; } }
body.no-anim .ps *, body.no-anim .ps *::before, body.no-anim .ps *::after { animation: none !important; transition: none !important; }

/* Linux : page « application » (variables GNOME / Adwaita) */
.sw-detail .ps { --ps-fg: var(--win-fg); --ps-muted: var(--win-muted); --ps-line: var(--win-line); --ps-card: var(--win-card); --ps-a: var(--accent, #e95420); --ps-a2: #d6336c; --ps-hover: color-mix(in srgb, var(--accent, #e95420) 8%, transparent); margin-top: 14px; font-family: var(--font); }
.sw-detail .ps-sec { border-radius: 14px; }