/* Layout: une colonne mobile — en-tête + choix de la personne, carte du jour, onglets Semaine/Mois, liste des jours, barre de publication pour le gérant */
:root{
  --bg:#f5f6f1; --surface:#ffffff; --fg:#1d2219; --muted:#6a7163; --line:#e2e5da;
  --accent:#4f6b2c; --accent-fg:#ffffff;
  --work:#4f6b2c; --work-soft:#e6eed8;
  --school:#3d5a9e; --school-soft:#e3e9f6;
  --rest:#8b8f86; --rest-soft:#eeefea;
  --warn:#a5520f; --warn-soft:#fbeedd;
  --display:"Bricolage Grotesque","Arial Narrow",system-ui,sans-serif;
  --body:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#141712; --surface:#1d211a; --fg:#ebeee5; --muted:#9aa192; --line:#2d3328;
  --accent:#a3c46e; --accent-fg:#141712;
  --work:#a3c46e; --work-soft:#26321c;
  --school:#93aef0; --school-soft:#1f2940;
  --rest:#8f948a; --rest-soft:#24271f;
  --warn:#f0a35e; --warn-soft:#3a2915; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#141712; --surface:#1d211a; --fg:#ebeee5; --muted:#9aa192; --line:#2d3328;
  --accent:#a3c46e; --accent-fg:#141712;
  --work:#a3c46e; --work-soft:#26321c;
  --school:#93aef0; --school-soft:#1f2940;
  --rest:#8f948a; --rest-soft:#24271f;
  --warn:#f0a35e; --warn-soft:#3a2915; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:15px;line-height:1.45}
.wrap{max-width:560px;margin:0 auto;padding-inline:16px;padding-block:20px 110px;display:flex;flex-direction:column;gap:16px}
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.eyebrow{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-weight:600}
h1{font-family:var(--display);font-weight:800;font-size:32px;line-height:1.05;margin:4px 0 0;text-wrap:balance}
.people{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:var(--surface);color:var(--fg);font:600 14px var(--body);padding:8px 16px;border-radius:999px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.btn{border:1px solid var(--line);background:var(--surface);color:var(--fg);font:600 14px var(--body);padding:9px 14px;border-radius:12px;cursor:pointer;white-space:nowrap}
.btn.primary{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}
.btn.ghost{background:transparent}
.btn:disabled{opacity:.5;cursor:default}
button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.today{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:6px}
.today .lbl{font-size:13px;color:var(--muted);font-weight:600}
.today .big{font-family:var(--display);font-weight:600;font-size:22px;line-height:1.2;font-variant-numeric:tabular-nums}
.today .next{font-size:14px;color:var(--muted)}
.today .next b{color:var(--fg)}
.tabs{display:flex;background:var(--rest-soft);border-radius:12px;padding:4px;gap:4px}
.tabs button{flex:1;border:0;background:transparent;color:var(--muted);font:600 14px var(--body);padding:9px;border-radius:9px;cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--surface);color:var(--fg);box-shadow:0 1px 2px rgba(0,0,0,.08)}
.nav{display:flex;align-items:center;gap:8px}
.nav .title{flex:1;text-align:center;font-weight:700;font-size:15px}
.nav .title small{display:block;font-weight:500;color:var(--muted);font-size:13px}
.icon-btn{width:40px;height:40px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--fg);font-size:18px;cursor:pointer;display:grid;place-items:center;flex:none}
.link-btn{align-self:center;border:0;background:none;color:var(--accent);font:600 14px var(--body);cursor:pointer;padding:4px 8px}
.days{display:flex;flex-direction:column;gap:8px}
.day{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--line);border-left-width:5px;border-radius:14px;padding:12px 14px;text-align:left;color:var(--fg);font:inherit;width:100%}
button.day{cursor:pointer}
.day.work{border-left-color:var(--work)} .day.school{border-left-color:var(--school)} .day.rest{border-left-color:var(--rest);background:var(--rest-soft)}
.day.is-today{outline:2px solid var(--accent);outline-offset:1px}
.d-name{font-weight:700;font-size:14px;text-transform:capitalize}
.d-num{font-family:var(--display);font-weight:800;font-size:22px;line-height:1}
.d-body{min-width:0;display:flex;flex-direction:column;gap:4px}
.tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;align-self:flex-start}
.work .tag{background:var(--work-soft);color:var(--work)} .school .tag{background:var(--school-soft);color:var(--school)} .rest .tag{background:var(--surface);color:var(--rest)}
.tag.mod{background:var(--warn-soft);color:var(--warn);margin-left:4px}
.shifts{font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.shifts .sep{color:var(--muted);font-weight:400;margin:0 4px}
.warns{display:flex;flex-direction:column;gap:2px;font-size:12.5px;color:var(--warn);font-weight:600}
.hrs{font-variant-numeric:tabular-nums;font-weight:700;font-size:15px;color:var(--muted);white-space:nowrap}
.total{display:flex;justify-content:space-between;align-items:baseline;padding:4px 4px 0;font-weight:600;gap:8px}
.total b{font-family:var(--display);font-size:22px;font-variant-numeric:tabular-nums}
.total .gap{color:var(--warn);font-size:13px}
.month{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.month .h{font-size:11px;font-weight:700;text-align:center;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding-bottom:4px}
.cell{aspect-ratio:1;max-width:100%;border-radius:10px;border:0;font:700 14px var(--body);font-variant-numeric:tabular-nums;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--fg)}
.cell.work{background:var(--work-soft)} .cell.school{background:var(--school-soft)} .cell.rest{background:var(--rest-soft);color:var(--muted)}
.cell.out{opacity:.35}
.cell .dot{width:6px;height:6px;border-radius:50%}
.cell.work .dot{background:var(--work)} .cell.school .dot{background:var(--school)} .cell.rest .dot{background:transparent}
.cell.is-today{outline:2px solid var(--accent)}
.cell.sel{box-shadow:inset 0 0 0 2px var(--fg)}
.editor{background:var(--surface);border:2px solid var(--accent);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px}
.editor h2{margin:0;font-family:var(--display);font-size:20px;text-transform:capitalize}
.field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--muted)}
.dnote{font-size:13px;color:var(--warn);font-weight:600}
input[type="text"]{width:100%}
select,input[type="time"],input[type="date"],input[type="text"]{font:600 15px var(--body);color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:8px 10px;font-variant-numeric:tabular-nums}
.shift-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.shift-row span{color:var(--muted);font-weight:600;font-size:13px;min-width:62px}
.radio{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:500;color:var(--fg)}
.row{display:flex;gap:8px;flex-wrap:wrap}
.err{color:var(--warn);font-size:13px;font-weight:600}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:13px;color:var(--muted)}
.legend span{display:flex;align-items:center;gap:6px}
.legend i{width:12px;height:12px;border-radius:4px;display:inline-block}
.note{font-size:13px;color:var(--muted);margin:0}
.savebar{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:1px solid var(--line);padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));display:flex;justify-content:center}
.savebar .in{max-width:560px;width:100%;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.savebar .msg{flex:1;min-width:140px;font-size:14px;font-weight:600}
.banner{background:var(--warn-soft);color:var(--warn);border-radius:12px;padding:10px 14px;font-size:14px;font-weight:600}
@media (prefers-reduced-motion:no-preference){.cell:active{transform:scale(.95)}}

.center{min-height:60vh;display:flex;flex-direction:column;justify-content:center;gap:14px}
.login{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;flex-direction:column;gap:12px}
.pin{font:700 26px var(--display);letter-spacing:.4em;text-align:center;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);width:100%}
.linkrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px}
.linkrow b{flex:1;min-width:90px}
.linkrow code{flex-basis:100%;font-size:12px;color:var(--muted);word-break:break-all}
.muted{color:var(--muted)}