/* Pass repas AfterData : styles communs. Polices système uniquement (aucun appel externe). */
:root{
  --bg:#E7EEE9; --surface:#FAFCFA; --ink:#15211C; --muted:#56665E; --line:#C7D3CB;
  --brand:#0F4D3C; --brand-ink:#F3FAF6; --band-bg:#0F4D3C; --band-ink:#F3FAF6; --band-muted:#A9CDBE;
  --stamp:#D97A1E; --ok:#17714A; --ok-bg:#DCF0E3; --warn:#97391C; --warn-bg:#F7E2D7;
  --shadow:0 22px 44px -28px rgba(15,77,60,.55);
  --display:"Avenir Next","Segoe UI Variable Display","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
  --text:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  color-scheme:light;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0D1512; --surface:#15201B; --ink:#E5EEE8; --muted:#97A99F; --line:#2A3B33;
    --brand:#5CC79D; --brand-ink:#0A1A13; --band-bg:#14463A; --band-ink:#EAF6EF; --band-muted:#8FBFAB;
    --stamp:#F0A548; --ok:#6CD39B; --ok-bg:#15332A; --warn:#F2987A; --warn-bg:#3A1E15;
    --shadow:0 22px 44px -28px rgba(0,0,0,.8);
    color-scheme:dark;
  }
}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--text);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
h1,h2,h3{font-family:var(--display);margin:0;line-height:1.15;letter-spacing:-.01em}
button,input{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--stamp);outline-offset:2px;border-radius:6px}
[hidden]{display:none !important}

.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--bg);display:flex;align-items:center;gap:10px;padding:14px 20px 10px;max-width:780px;margin:0 auto}
.mark{width:34px;height:34px;border-radius:10px;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center;flex:none}
.top-title{font-family:var(--display);font-weight:700;font-size:1.05rem;line-height:1.1}
.top-sub{color:var(--muted);font-size:.82rem}
.top .spacer{flex:1}
main{max-width:780px;margin:0 auto;padding:8px 20px 48px}
.col{max-width:480px;margin:0 auto}

/* Ticket */
.ticket{background:var(--surface);border-radius:22px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.band{background:var(--band-bg);color:var(--band-ink);padding:18px 20px;display:flex;gap:14px;align-items:center}
.initials{width:56px;height:56px;border-radius:50%;flex:none;display:grid;place-items:center;background:var(--band-muted);color:var(--band-bg);font-family:var(--display);font-weight:800;font-size:1.3rem}
.who{min-width:0}
.who-name{font-family:var(--display);font-weight:700;font-size:1.35rem;line-height:1.15;overflow-wrap:anywhere}
.who-role{color:var(--band-muted);font-size:.9rem}
.ticket-mid{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:20px 20px 14px}
.today{color:var(--muted);font-size:.95rem}
.today::first-letter{text-transform:uppercase}
.clock{font-family:var(--display);font-weight:800;font-size:clamp(2.6rem,12vw,3.5rem);line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-.02em;margin-top:4px}
.merchant{margin-top:10px;font-size:.92rem;color:var(--muted)}
.merchant strong{color:var(--ink);font-weight:600}
.stamp{width:112px;height:112px;color:var(--stamp)}
.stamp .ring{transform-origin:60px 60px;animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.perf{position:relative;height:26px}
.perf::before,.perf::after{content:"";position:absolute;top:0;width:26px;height:26px;border-radius:50%;background:var(--bg);border:1px solid var(--line)}
.perf::before{left:-14px}.perf::after{right:-14px}
.perf span{position:absolute;left:20px;right:20px;top:12px;border-top:2px dashed var(--line)}
.foot{padding:12px 20px 22px}

.btn{appearance:none;border:0;border-radius:14px;padding:15px 18px;font-weight:650;cursor:pointer;width:100%;font-size:1.05rem;transition:transform .08s ease}
.btn:active{transform:scale(.985)}
.btn[disabled]{opacity:.55;cursor:default}
.btn-primary{background:var(--brand);color:var(--brand-ink)}
.btn-ghost{background:transparent;border:1.5px solid var(--line);color:var(--ink)}
.btn-small{width:auto;padding:9px 14px;font-size:.92rem;border-radius:10px}
.btn-row{display:flex;gap:10px}
.btn-row .btn{flex:1}
.link{background:none;border:0;padding:6px 0;color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:.9rem}
.links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:18px}

.valid{background:var(--ok-bg);color:var(--ok);border-radius:16px;padding:14px 16px;display:flex;gap:12px;align-items:center;margin-bottom:12px}
.valid svg{flex:none}
.valid-title{font-weight:700;font-size:1.05rem}
.valid-sub{font-size:.9rem;opacity:.9}
.valid.just{animation:press .5s cubic-bezier(.2,1.4,.4,1)}
@keyframes press{from{transform:scale(1.25) rotate(-4deg);opacity:0}to{transform:none;opacity:1}}
.note{border-radius:14px;padding:12px 14px;font-size:.93rem;margin-bottom:12px}
.note-warn{background:var(--warn-bg);color:var(--warn)}
.note-plain{background:var(--surface);border:1px solid var(--line);color:var(--muted)}
.hint{color:var(--muted);font-size:.88rem;margin:10px 0 0}

.team{margin-top:22px;display:flex;align-items:baseline;gap:12px;padding:0 4px}
.team-n{font-family:var(--display);font-weight:800;font-size:2.4rem;line-height:1;font-variant-numeric:tabular-nums;color:var(--brand)}
.team-t{color:var(--muted);font-size:.95rem;line-height:1.35}

.section-title{font-size:1.5rem;margin:6px 0 16px}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:18px;margin-bottom:16px}
.panel h3{font-size:1.1rem;margin-bottom:10px}
.month-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:6px}
.month-head h3{margin:0}
.count-pill{font-variant-numeric:tabular-nums;color:var(--muted);font-size:.92rem}
ul.plain{list-style:none;margin:0;padding:0}
ul.plain li{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
ul.plain li:first-child{border-top:0}
.empty{color:var(--muted);text-align:center;padding:28px 10px}

form.stack{display:grid;gap:14px}
label{display:grid;gap:6px;font-weight:600;font-size:.92rem}
label small{font-weight:400;color:var(--muted)}
input[type=text],input[type=number],input[type=password]{border:1.5px solid var(--line);background:var(--bg);border-radius:12px;padding:12px;font-size:1rem;width:100%}
.actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center}

/* Admin */
.month-nav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px}
.month-nav h2{font-size:1.5rem;text-align:center;flex:1}
.icon-btn{width:42px;height:42px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);cursor:pointer;display:grid;place-items:center;font-size:1.3rem;line-height:1}
.icon-btn[disabled]{opacity:.4;cursor:default}
.figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px}
.fig{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px}
.fig-v{font-family:var(--display);font-weight:800;font-size:clamp(1.3rem,5vw,1.9rem);line-height:1.1;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.fig-l{color:var(--muted);font-size:.85rem;margin-top:4px}
.fig.due{background:var(--band-bg);border-color:var(--band-bg);color:var(--band-ink)}
.fig.due .fig-l{color:var(--band-muted)}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th,td{text-align:left;padding:10px 8px;border-top:1px solid var(--line);vertical-align:top}
th{font-weight:600;color:var(--muted);font-size:.85rem;border-top:0}
td.num,th.num{text-align:right;white-space:nowrap}
details summary{cursor:pointer;color:var(--muted);font-size:.85rem;margin-top:4px}
details ul{list-style:none;padding:0;margin:6px 0 0}
details li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;font-size:.9rem}
.del{background:none;border:0;color:var(--warn);cursor:pointer;font-size:.85rem;text-decoration:underline;padding:2px 0}
.days{display:flex;flex-direction:column;gap:6px}
.day{display:grid;grid-template-columns:7.5rem 1fr 2rem;gap:10px;align-items:center;font-size:.9rem;font-variant-numeric:tabular-nums}
.bar{height:10px;border-radius:5px;background:var(--brand);min-width:4px}
.day .n{text-align:right}

.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(24px + env(safe-area-inset-bottom,0px));background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:12px;font-size:.92rem;z-index:7;opacity:0;pointer-events:none;transition:opacity .2s}
.toast.show{opacity:1}
.skel{height:420px;border-radius:22px;background:var(--surface);border:1px solid var(--line)}
@media (max-width:420px){.figures{grid-template-columns:1fr 1fr}.fig.due{grid-column:1 / -1}.stamp{width:92px;height:92px}}
@media (prefers-reduced-motion: reduce){.stamp .ring{animation:none}.valid.just{animation:none}.btn{transition:none}}