/* Base : remise à zéro légère, typographie, formulaires, accessibilité. */
:root{
  /* Alias des variables de l'ancien app.css (retiré à la tâche 6) pour qu'elles suivent le thème. */
  --card:var(--surface); --fg:var(--ink); --muted:var(--ink-2);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg)}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:14px/1.45 var(--f-body);-webkit-font-smoothing:antialiased;
  font-feature-settings:"kern","liga";
}
h1,h2,h3{font-family:var(--f-display);letter-spacing:-.01em;color:var(--ink)}
h1{font-size:22px;line-height:1.2;font-weight:600;margin:0 0 4px}
h2{font-size:19px;line-height:1.2;font-weight:600;margin:0}
h3{font-size:15px;line-height:1.3;font-weight:600;margin:0}
p{margin:0 0 .75em}
a{color:var(--accent);text-underline-offset:2px;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
b,strong{font-weight:600}
hr{border:0;border-top:1px solid var(--line);margin:16px 0}
code,kbd,samp{font-family:var(--f-mono)}
dl,dd{margin:0}
ul,ol{margin:0;padding:0}
img,svg{max-width:100%}
[hidden]{display:none !important}
::selection{background:var(--accent-soft);color:var(--ink)}

/* Focus visible, toujours, au clavier. */
:focus{outline:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid transparent;outline-offset:0;box-shadow:0 0 0 3px var(--focus)}

.skip-link{
  position:absolute;left:12px;top:-60px;z-index:100;background:var(--accent);color:var(--accent-ink);
  padding:8px 14px;border-radius:0 0 var(--radius) var(--radius);font-weight:600;text-decoration:none;
}
.skip-link:focus{top:0}
.sr-only{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.mono{font-family:var(--f-mono)}
.muted{color:var(--ink-3-text)}

/* Champs de formulaire */
label{display:block;margin:0 0 4px;color:var(--ink-2);font-weight:500;font-size:13px}
input,select,textarea{
  display:block;width:100%;margin:0;padding:7px 10px;
  font:400 14px/1.4 var(--f-body);color:var(--ink);
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  transition:border-color .12s ease,box-shadow .12s ease;
}
input::placeholder,textarea::placeholder{color:var(--ink-3-text)}
input:hover,select:hover,textarea:hover{border-color:color-mix(in srgb,var(--ink-3) 55%,var(--line))}
input:focus,select:focus,textarea:focus{border-color:var(--accent)}
input[type=checkbox],input[type=radio]{width:auto;display:inline-block;accent-color:var(--accent)}
select{appearance:none;-webkit-appearance:none;padding-right:28px;cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-3) 50%),linear-gradient(135deg,var(--ink-3) 50%,transparent 50%);
  background-position:calc(100% - 15px) 55%,calc(100% - 10px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
textarea{resize:vertical;min-height:84px}
input:disabled,select:disabled,textarea:disabled,button:disabled{opacity:.55;cursor:not-allowed}
@media (max-width:720px){
  input,select,textarea{font-size:16px} /* évite le zoom automatique d'iOS */
}

/* HTMX : états, sans style en ligne */
.htmx-indicator{opacity:0;transition:opacity .15s ease-in}
.htmx-request .htmx-indicator,.htmx-request.htmx-indicator{opacity:1}
.htmx-request{cursor:progress}
.htmx-added{opacity:0}
.htmx-settling{opacity:1;transition:opacity .15s ease-in}
.htmx-swapping{opacity:0;transition:opacity .15s ease-out}

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