/* Cartes redimensionnables : poignée en bas à droite de chaque carré, aperçu pointillé, retour à la grille d'origine. */
.t{container-type:size}
.rz{position:absolute;right:0;bottom:0;width:44px;height:44px;z-index:7;cursor:nwse-resize;touch-action:none;user-select:none;-webkit-user-select:none;display:grid;place-items:end;padding:8px;color:#fff;mix-blend-mode:difference;opacity:.5;transition:opacity .25s}
.rz::before{content:"";width:16px;height:16px;background:linear-gradient(135deg,transparent 0 46%,currentColor 46% 54%,transparent 54% 66%,currentColor 66% 74%,transparent 74%)}
.t:hover .rz,.rz:focus-visible,.rz.on{opacity:1}
.rz:focus-visible{outline:2px solid #fff;outline-offset:-6px}
@media (hover:none){.rz{opacity:.8}}
.rz-prev{position:fixed;z-index:90;pointer-events:none;border:2px dashed #fff;background:rgba(255,255,255,.08);mix-blend-mode:difference;display:grid;place-items:center;font:500 .8rem "Geist Mono",monospace;letter-spacing:.2em;color:#fff}
.rz-bar{position:fixed;z-index:70;right:12px;bottom:12px;display:flex;flex-direction:row-reverse;gap:6px;align-items:center}
/* boutons discrets : une pastille avec une icône ; au survol (ou au focus) elle s'étire vers la gauche et dévoile son nom */
.rz-reset,.rz-fill{display:flex;align-items:center;flex:0 0 auto;height:28px;max-width:28px;flex-direction:row-reverse;padding:0 0 0 12px;overflow:hidden;white-space:nowrap;border:1px solid rgba(255,255,255,.2);border-radius:14px;background:rgba(14,14,18,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:rgba(255,255,255,.62);font:500 .6rem "Geist Mono",monospace;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:max-width .45s cubic-bezier(.16,1,.3,1),background .25s,color .25s,border-color .25s}
.rz-reset::before,.rz-fill::before{flex:0 0 26px;width:26px;text-align:center;font:400 .85rem/26px "Geist",system-ui,sans-serif;letter-spacing:0}
.rz-reset::before{content:"↺"}.rz-fill::before{content:"▦"}
.rz-reset:hover,.rz-fill:hover,.rz-reset:focus-visible,.rz-fill:focus-visible{max-width:230px;background:#EFE8D8;color:#0E0E0C;border-color:#EFE8D8}
.rz-reset:focus-visible,.rz-fill:focus-visible{outline:2px solid #fff;outline-offset:2px}
.rz-reset[hidden],.rz-fill[hidden]{display:none}
::view-transition-group(root){animation-duration:.35s}
@media (prefers-reduced-motion:reduce){::view-transition-group(root){animation-duration:.01s}}

/* petites cartes : les listes se resserrent au lieu de déborder */
@container (max-height:340px){
  .k-liste h3{display:none}
  .k-liste li{padding:3px 0;font-size:.72rem;gap:8px}
  .k-liste li small{font-size:.5rem}
}

/* poignée de déplacement : en haut à droite */
.mv{position:absolute;right:0;top:0;width:44px;height:44px;z-index:7;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;display:grid;place-items:start end;padding:10px;color:#fff;mix-blend-mode:difference;opacity:.5;transition:opacity .25s}
.mv::before{content:"";width:14px;height:20px;background:radial-gradient(circle,currentColor 1.6px,transparent 2px) 0 0/7px 7px}
.t:hover .mv,.mv:focus-visible,.mv.on{opacity:1}
.mv:focus-visible{outline:2px solid #fff;outline-offset:-6px}
.mv.on{cursor:grabbing}
@media (hover:none){.mv{opacity:.8}}

/* téléphone : bouton « Modifier » ; en mode édition, les poignées apparaissent (le reste de la page défile normalement) */
.rz-mode{display:none;position:fixed;z-index:71;right:16px;bottom:16px;padding:10px 14px;background:#EFE8D8;color:#0E0E0C;border:0;font:500 .62rem "Geist Mono",monospace;letter-spacing:.22em;text-transform:uppercase;cursor:pointer;box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
.rz-mode[aria-pressed="true"]{background:#0E0E0C;color:#EFE8D8;box-shadow:0 0 0 1px #EFE8D8}
.rz-mode:focus-visible{outline:2px solid #fff;outline-offset:3px}
body.edition .rz-bar{display:flex}
