:root{
  --bg:#fff7fb;--bg2:#fdeef7;--card:#ffffff;--ink:#3b2d52;--muted:#8b7ca3;--faint:#b9adcb;--line:#f0e3f2;
  --acc:#e86fb0;--acc2:#9b7cf2;--acc-soft:#fde3f1;--ok:#3fb68b;--bad:#e5566b;
  --r:22px;--shadow:0 10px 30px -12px rgba(155,124,242,.35);--safe-b:env(safe-area-inset-bottom,0px);--safe-t:env(safe-area-inset-top,0px);
  --f-t:"Fredoka","Nunito",system-ui,sans-serif;--f:"Nunito",system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%}
body{background:radial-gradient(1200px 500px at 110% -10%,#efe4ff 0,transparent 60%),radial-gradient(900px 500px at -20% 0,#ffe3f1 0,transparent 55%),var(--bg);background-attachment:fixed;color:var(--ink);font:500 16px/1.4 var(--f);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
svg{width:20px;height:20px;flex:none}
.hide,[hidden]{display:none!important}
#app{max-width:560px;margin:0 auto;padding:calc(var(--safe-t) + 14px) 14px calc(var(--safe-b) + 110px)}
.splash{min-height:80vh;display:grid;place-items:center;text-align:center;color:var(--muted)}
.splash img{width:110px;height:110px;animation:float 3s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-8px) rotate(-3deg)}}
h1,h2,h3{font-family:var(--f-t);margin:0;font-weight:600;letter-spacing:.01em}
.muted{color:var(--muted)}.small{font-size:.86rem}.tiny{font-size:.75rem}
.row{display:flex;align-items:center;gap:10px}.grow{flex:1;min-width:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 20px;border-radius:16px;border:0;background:var(--card);color:var(--ink);font:600 1rem var(--f-t);box-shadow:0 2px 0 var(--line),0 0 0 1.5px var(--line) inset;transition:transform .15s}
.btn:active{transform:scale(.96)}
.btn.acc{background:linear-gradient(135deg,#f58cc4,#a98af5);color:#fff;box-shadow:0 8px 20px -8px rgba(232,111,176,.7)}
.btn.ghost{background:transparent;box-shadow:none;color:var(--muted)}
.btn.full{width:100%}
.icon{width:44px;height:44px;border-radius:15px;border:0;background:var(--card);display:inline-grid;place-items:center;color:var(--ink);box-shadow:0 0 0 1.5px var(--line) inset}
.icon:active{transform:scale(.92)}
input[type=text],input[type=email],input[type=password],input[type=time]{width:100%;height:50px;border-radius:15px;border:1.5px solid var(--line);background:#fff;padding:0 14px;outline:0;font-size:1rem}
input:focus{border-color:#e9b6dd;box-shadow:0 0 0 4px #fde3f1}
label.lb{display:block;font-weight:700;font-size:.84rem;color:var(--muted);margin:0 0 6px 4px}

/* connexion */
.login{min-height:82vh;display:flex;flex-direction:column;justify-content:center;gap:14px;text-align:center}
.login img{width:120px;height:120px;margin:0 auto;border-radius:32px;box-shadow:var(--shadow);animation:float 3.2s ease-in-out infinite}
.login h1{font-size:2.1rem}
.login form{display:flex;flex-direction:column;gap:12px;text-align:left;margin-top:8px}
.msg{min-height:1.2em;color:var(--bad);font-weight:600;font-size:.9rem;text-align:center}
.msg.ok{color:var(--ok)}
.links{display:flex;justify-content:space-between;gap:10px}
.links button{border:0;background:none;color:var(--acc);font-weight:700;padding:6px 2px}

/* en-tête */
.top{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.top .uni{width:48px;height:48px;border-radius:16px;box-shadow:var(--shadow)}
.top h1{font-size:1.55rem;line-height:1.1}
.top .sub{color:var(--muted);font-size:.9rem;text-transform:capitalize}

/* carte du jour */
.hero{position:relative;overflow:hidden;border-radius:var(--r);padding:16px;background:var(--card);box-shadow:var(--shadow);margin-bottom:16px;display:flex;flex-direction:column;gap:10px}
.hero::after{content:"✦";position:absolute;right:16px;top:8px;font-size:1.4rem;color:#f5c8e6}
.tday{display:flex;align-items:center;gap:12px;border:0;background:none;padding:0;text-align:left;width:100%}
.tbig{flex:none;width:64px;height:64px;border-radius:20px;display:grid;place-items:center;font-size:1.9rem;background:var(--c,#eee)}
.tday b{display:block;font:600 1.3rem var(--f-t)}
.tday small{display:block;color:var(--muted);font-size:.92rem}
.tnext{display:flex;gap:8px;flex-wrap:wrap}
.tag{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:var(--bg2);font-size:.86rem;font-weight:700;color:var(--ink)}
.tag i{width:10px;height:10px;border-radius:50%;background:var(--c)}
.memo-line{display:flex;gap:8px;align-items:baseline;font-size:.95rem;padding:2px 0}
.memo-line b{color:var(--acc);font-weight:800;min-width:46px}

/* mois */
.mhead{display:flex;align-items:center;gap:8px;margin:4px 0 10px}
.mhead h2{flex:1;text-align:center;font-size:1.45rem;text-transform:capitalize}
.mhead h2 small{display:block;font:600 .78rem var(--f);color:var(--acc);text-transform:none}
.wk{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:5px;text-align:center;font:700 .74rem var(--f);color:var(--faint);text-transform:uppercase}
.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;touch-action:pan-y}
.grid.slide-l{animation:sl .28s ease}.grid.slide-r{animation:sr .28s ease}
@keyframes sl{from{transform:translateX(30px);opacity:0}}@keyframes sr{from{transform:translateX(-30px);opacity:0}}
.d{position:relative;min-height:74px;border:0;border-radius:14px;background:rgba(255,255,255,.75);box-shadow:0 0 0 1px var(--line) inset;padding:4px 3px 4px;display:flex;flex-direction:column;align-items:stretch;gap:3px;text-align:center;overflow:hidden;transition:transform .12s}
.d:active{transform:scale(.94)}
.d.out{opacity:.35}
.d .n{font:700 .82rem var(--f);color:var(--muted);line-height:1.1}
.d.we .n{color:#c58ab2}
.d.today{box-shadow:0 0 0 2.5px var(--acc) inset}
.d.today .n{color:var(--acc)}
.d .p{flex:1;border-radius:10px;background:var(--c);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:2px 1px;color:var(--t,#3b2d52);min-height:44px}
.d .p b{font:600 .7rem var(--f-t);letter-spacing:-.01em;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.d .p em{font-style:normal;font-size:.6rem;letter-spacing:-.02em;font-weight:800;opacity:.85;line-height:1.1;white-space:nowrap}
.d .p .e{font-size:.9rem;line-height:1}
.d .mm{position:absolute;top:3px;right:4px;font-size:.62rem;color:var(--acc);font-weight:900}
.d .fe{position:absolute;top:3px;left:4px;font-size:.6rem;color:#d9a400}
.d.paint{animation:pop .25s ease}
@keyframes pop{50%{transform:scale(1.08)}}

.legend{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 4px}
.sum{margin-top:12px;padding:14px;border-radius:var(--r);background:rgba(255,255,255,.7);box-shadow:0 0 0 1px var(--line) inset;display:flex;flex-direction:column;gap:8px}
.sum .row{flex-wrap:wrap;gap:6px}
.actions{display:flex;gap:8px;margin-top:14px}
.actions .btn{flex:1}

/* feuilles */
.scrim{position:fixed;inset:0;background:rgba(59,45,82,.32);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .2s;z-index:50}
.scrim.on{opacity:1}
.sheet{position:fixed;left:0;right:0;bottom:0;z-index:51;max-width:560px;margin:0 auto;max-height:92vh;overflow-y:auto;overscroll-behavior:contain;background:var(--bg);border-radius:28px 28px 0 0;padding:10px 16px calc(var(--safe-b) + 20px);transform:translateY(105%);transition:transform .3s cubic-bezier(.2,.9,.25,1.05);box-shadow:0 -10px 40px rgba(59,45,82,.18)}
.sheet.on{transform:none}
.grab{width:44px;height:5px;border-radius:5px;background:#e8d9ee;margin:0 auto 12px}
.sh-h{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.sh-h h2{flex:1;font-size:1.35rem;text-transform:capitalize}
.sec{font:700 .78rem var(--f);letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin:16px 4px 8px}
.pgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pbtn{display:flex;align-items:center;gap:10px;min-height:62px;padding:8px 12px;border-radius:18px;border:0;background:var(--c);color:var(--t,#3b2d52);text-align:left;box-shadow:0 0 0 0 transparent;transition:transform .12s,box-shadow .15s}
.pbtn:active{transform:scale(.96)}
.pbtn .e{font-size:1.5rem}
.pbtn b{display:block;font:600 1.02rem var(--f-t)}.pbtn small{display:block;font-size:.78rem;font-weight:800;opacity:.8}
.pbtn.on{box-shadow:0 0 0 3px #fff,0 0 0 5.5px var(--ink)}
.pbtn.none{background:#fff;box-shadow:0 0 0 1.5px var(--line) inset}
.hours{display:flex;align-items:center;gap:8px;margin-top:10px}
.hours input{flex:1}
.memos{display:flex;flex-direction:column;gap:8px}
.mrow{display:flex;align-items:center;gap:10px;padding:10px 6px 10px 14px;border-radius:16px;background:#fff;box-shadow:0 0 0 1.5px var(--line) inset}
.mrow b{color:var(--acc);font-weight:800;min-width:44px}
.mrow span{flex:1;min-width:0;word-break:break-word}
.mrow button{border:0;background:none;color:var(--faint);padding:6px;display:grid}
.madd{display:grid;grid-template-columns:104px 1fr 50px;gap:8px}
.madd .icon{width:50px;height:50px;background:linear-gradient(135deg,#f58cc4,#a98af5);color:#fff;box-shadow:none}
.empty{color:var(--faint);text-align:center;padding:10px;font-size:.92rem}

/* pinceau */
.paintbar{position:fixed;left:0;right:0;bottom:0;z-index:40;max-width:560px;margin:0 auto;padding:12px 12px calc(var(--safe-b) + 12px);background:rgba(255,247,251,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:24px 24px 0 0;box-shadow:0 -10px 30px rgba(155,124,242,.2);transform:translateY(110%);transition:transform .3s cubic-bezier(.2,.9,.25,1.05)}
.paintbar.on{transform:none}
.paintbar p{margin:0 4px 10px;font-weight:700;font-size:.92rem}
.chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding:3px 2px 6px}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;display:flex;align-items:center;gap:6px;height:46px;padding:0 14px;border-radius:15px;border:0;background:var(--c,#fff);color:var(--t,#3b2d52);font:600 .98rem var(--f-t);box-shadow:0 0 0 1.5px rgba(0,0,0,.04) inset}
.chip.on{box-shadow:0 0 0 3px #fff,0 0 0 5.5px var(--ink)}
.chip.erase{background:#fff;color:var(--muted)}
.paintbar .row{margin-top:8px}
body.painting .d{box-shadow:0 0 0 1.5px #f1c6e3 inset}

/* liste */
.seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:16px;background:rgba(255,255,255,.7);box-shadow:0 0 0 1px var(--line) inset;margin-bottom:12px}
.seg button{height:40px;border:0;border-radius:12px;background:none;font:600 .98rem var(--f-t);color:var(--muted)}
.seg button.on{background:#fff;color:var(--ink);box-shadow:0 3px 10px -4px rgba(155,124,242,.4)}
.list{display:flex;flex-direction:column;gap:8px}
.li{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;border:0;border-radius:18px;background:rgba(255,255,255,.85);box-shadow:0 0 0 1px var(--line) inset;text-align:left}
.li.today{box-shadow:0 0 0 2.5px var(--acc) inset}
.li .dt{width:48px;text-align:center;flex:none}
.li .dt b{display:block;font:600 1.35rem var(--f-t);line-height:1}
.li .dt small{font-size:.72rem;font-weight:800;color:var(--muted);text-transform:uppercase}
.li .pp{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:10px;background:var(--c);color:var(--t,#3b2d52);font:600 .92rem var(--f-t)}
.li .mmx{display:block;font-size:.84rem;color:var(--muted);margin-top:3px}
.li.we .dt b{color:#c58ab2}
.mlab{margin:12px 6px 2px;font:600 1.05rem var(--f-t);color:var(--muted);text-transform:capitalize}

/* réglages */
.prow{display:grid;grid-template-columns:44px 1fr;gap:8px;align-items:center;padding:10px;border-radius:18px;background:#fff;box-shadow:0 0 0 1.5px var(--line) inset}
.prow .sw{width:44px;height:44px;border-radius:14px;border:0;background:var(--c);font-size:1.3rem}
.prow .times{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 44px;gap:8px}
.palette{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;padding:4px 0}
.palette button{width:34px;height:34px;border-radius:50%;border:0;background:var(--c)}
.palette button.on{box-shadow:0 0 0 3px #fff,0 0 0 5px var(--ink)}
.emojis{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px}
.emojis button{width:38px;height:38px;border-radius:12px;border:0;background:var(--bg2);font-size:1.2rem}
.year{display:flex;flex-direction:column;gap:6px}
.yrow{display:grid;grid-template-columns:90px 1fr auto;gap:8px;align-items:center;padding:8px 10px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px var(--line) inset;font-size:.9rem}
.yrow b{font-family:var(--f-t);text-transform:capitalize}
.bars{display:flex;height:12px;border-radius:6px;overflow:hidden;background:var(--bg2)}
.bars i{background:var(--c)}

#toast{position:fixed;left:50%;bottom:calc(var(--safe-b) + 24px);transform:translate(-50%,20px);z-index:90;background:var(--ink);color:#fff;padding:12px 18px;border-radius:16px;font-weight:700;font-size:.92rem;opacity:0;pointer-events:none;transition:.2s;max-width:calc(100vw - 32px);text-align:center}
#toast.on{opacity:1;transform:translate(-50%,0)}
body.painting #toast{bottom:calc(var(--safe-b) + 170px)}

body.painting #app{padding-bottom:240px}
.improw{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:12px 14px;border-radius:16px;background:#fff;box-shadow:0 0 0 1.5px var(--line) inset}
.improw select{height:46px;border-radius:12px;border:1.5px solid var(--line);background:#fff;padding:0 10px;width:100%}
.actions .btn{font-size:.98rem;padding:0 12px;white-space:nowrap}

/* jour en grand */
.btn.sm{height:38px;padding:0 14px;font-size:.92rem;border-radius:13px}
.bigp{border-radius:26px;background:var(--c);color:var(--t);padding:22px 18px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;box-shadow:0 0 0 1.5px rgba(59,45,82,.05) inset,var(--shadow)}
.bigp .be{font-size:3.2rem;line-height:1.1}
.bigp b{font:600 2rem var(--f-t);line-height:1.15}
.bigp .bh{font:600 1.5rem var(--f-t);margin-top:2px}
.bigp .bd{font-size:.9rem;font-weight:800;opacity:.75}
.bigm{display:flex;flex-direction:column;gap:8px}
.bm{display:flex;align-items:center;gap:14px;padding:14px;border-radius:20px;background:#fff;box-shadow:0 0 0 1.5px var(--line) inset}
.bm .bi{width:52px;height:52px;border-radius:16px;background:var(--bg2);display:grid;place-items:center;font-size:1.7rem;flex:none}
.bm b{display:block;font:600 1.2rem var(--f-t)}.bm small{display:block;color:var(--acc);font-weight:800;font-size:1rem}
.linkbtn{display:block;margin:10px auto 0;border:0;background:none;color:var(--acc2);font-weight:800;font-size:.92rem;padding:6px}
.madd{grid-template-columns:50px 1fr 96px 50px}
.micon{width:50px;height:50px;border-radius:15px;border:1.5px solid var(--line);background:#fff;font-size:1.5rem}
.mrow .mi{width:40px;height:40px;border-radius:12px;background:var(--bg2);font-size:1.25rem;color:inherit;padding:0}
.igrid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px;padding:10px;margin:6px 0;border-radius:18px;background:#fff;box-shadow:0 0 0 1.5px var(--line) inset;animation:pop .2s}
.igrid button{aspect-ratio:1;border:0;border-radius:12px;background:var(--bg2);font-size:1.3rem;padding:0}
.d .mm{font-size:.7rem;top:2px;right:2px;display:flex;align-items:center}
.d .mm i{font-style:normal;font-size:.55rem;color:var(--acc);font-weight:900;margin-left:1px}
.memo-line span:first-child{width:22px}
/* postes */
.plist{display:flex;flex-direction:column;gap:8px}
.pline{display:flex;align-items:center;gap:12px;width:100%;padding:12px 14px;border:0;border-radius:20px;background:var(--c);color:var(--t,#3b2d52);text-align:left;box-shadow:0 0 0 1.5px rgba(59,45,82,.06) inset}
.pline .e{font-size:1.6rem}
.pline b{display:block;font:600 1.12rem var(--f-t)}.pline small{display:block;font-weight:800;font-size:.82rem;opacity:.75}
.palette{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;padding:2px}
.palette button{width:auto;height:auto;aspect-ratio:1}
.emojis{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.emojis button{width:auto;height:auto;aspect-ratio:1;font-size:1.35rem}
.emojis button.on{box-shadow:0 0 0 2.5px var(--ink) inset;background:#fff}

.errbar{margin:0 0 12px;padding:12px 14px;border-radius:16px;background:#ffe1e6;color:#8a1630;font-weight:700;font-size:.9rem}
.errbar small{font-weight:600;opacity:.75}

.wsteps{margin:4px 0 6px;padding-left:20px;display:flex;flex-direction:column;gap:6px;font-size:.9rem}
.wsteps li{padding-left:2px}
