/* MySifa — Post-its (portail + pages applicatives si multi-page, desktop >= 1024px)
   Ton chaud littéral (jaune chaleureux du redesign portail). Volontairement non
   thématisé : le post-it garde la même teinte dorée en clair et en sombre, pour
   ressortir comme un objet « papier » sur la page. La couleur perso d'un post-it
   (--postit-color) reste utilisée par la pastille, l'accent du checkbox et le
   bouton « + tâche » pour conserver le classement par l'utilisateur. */
.postit-layer{display:none}
@media (min-width:1024px){.postit-layer{display:block}}
.postit{
  --postit-color:#c79a16;
  --postit-paper:#fff6cf;
  --postit-paper-edge:#f0dd92;
  --postit-paper-sep:#ecd87f;
  --postit-ink:#6b5618;
  --postit-ink-soft:#8a7330;
  --postit-ink-muted:#b29a4e;
  --postit-ink-strong:#b8860b;
  --postit-shadow:0 10px 28px rgba(120,100,20,.18);
  position:fixed;
  background:var(--postit-paper);
  border:1px solid var(--postit-paper-edge);
  border-radius:14px;
  width:260px;
  min-height:120px;
  box-shadow:var(--postit-shadow);
  z-index:200;
  display:flex;
  flex-direction:column;
  user-select:none;
}
.postit-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px 8px;
  cursor:grab;
  border-radius:14px 14px 0 0;
  background:transparent;
  gap:8px;
}
.postit-header:active{cursor:grabbing}
.postit-color-dot{
  width:12px;
  height:12px;
  border-radius:50%;
  flex-shrink:0;
  background:var(--postit-color);
  border:2px solid color-mix(in srgb,var(--postit-color) 55%,var(--postit-paper-edge));
  cursor:pointer;
  padding:0;
  transition:transform .15s,box-shadow .15s;
}
.postit-color-dot:hover{
  transform:scale(1.08);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--postit-color) 28%,transparent);
}
.postit-color-dot:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--postit-color) 35%,transparent);
}
#postit-color-palette{
  position:fixed;
  display:none;
  flex-wrap:wrap;
  gap:8px;
  padding:10px;
  background:var(--postit-paper);
  border:1px solid var(--postit-paper-edge);
  border-radius:12px;
  box-shadow:var(--postit-shadow);
  z-index:8030;
  width:200px;
  min-height:52px;
  box-sizing:border-box;
}
#postit-color-palette.open{display:flex!important;visibility:visible;pointer-events:auto}
#postit-color-palette .postit-color-swatch{
  width:26px;
  height:26px;
  min-width:26px;
  min-height:26px;
  border-radius:50%;
  border:2px solid transparent;
  cursor:pointer;
  padding:0;
  flex-shrink:0;
  appearance:none;
  -webkit-appearance:none;
  background:var(--postit-swatch-bg,var(--muted))!important;
  background-color:var(--postit-swatch-bg,var(--muted))!important;
  transition:transform .12s,border-color .12s;
}
#postit-color-palette .postit-color-swatch:hover{transform:scale(1.1)}
#postit-color-palette .postit-color-swatch.active{
  border-color:var(--postit-ink);
  box-shadow:0 0 0 2px var(--postit-paper);
}
.postit-title{
  flex:1;
  background:transparent;
  border:none;
  color:var(--postit-ink);
  font-size:13px;
  font-weight:700;
  outline:none;
  min-width:0;
  font-family:inherit;
}
.postit-title::placeholder{color:var(--postit-ink-muted);opacity:1}
.postit-body{padding:4px 14px 6px;flex:1}
.postit-task{display:flex;align-items:flex-start;gap:9px;padding:0;margin:0}
.postit-task+.postit-task{margin-top:3px}
.postit-task input[type="checkbox"]{
  margin-top:3px;
  accent-color:var(--postit-color);
  flex-shrink:0;
  cursor:pointer;
}
.postit-task-text{
  font-size:12px;
  color:var(--postit-ink);
  flex:1;
  background:transparent;
  border:none;
  outline:none;
  resize:none;
  line-height:1.5;
  padding:0;
  margin:0;
  min-height:1.5em;
  overflow:hidden;
  box-sizing:border-box;
  font-family:inherit;
}
.postit-task-text::placeholder{color:var(--postit-ink-muted);opacity:1}
.postit-task.done .postit-task-text{
  text-decoration:line-through;
  color:var(--postit-ink-muted);
}
.postit:not(.is-hidden) .postit-footer{
  cursor:grab;
}
.postit:not(.is-hidden) .postit-footer:active{
  cursor:grabbing;
}
.postit-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:4px 8px;
  padding:9px 14px;
  border-top:1px solid var(--postit-paper-sep);
}
.postit-clear-btn{
  font-size:11px;
  color:var(--postit-ink-soft);
  background:none;
  border:none;
  cursor:pointer;
  padding:2px 4px;
  font-family:inherit;
}
.postit-clear-btn:hover{color:var(--danger)}
.postit-add-task-btn{
  font-size:12px;
  color:var(--postit-ink-strong);
  background:none;
  border:none;
  cursor:pointer;
  padding:2px 4px;
  font-weight:700;
  font-family:inherit;
}
.postit-add-task-btn:hover{text-decoration:underline}
.postit-multipage-btn{
  font-size:11px;
  color:var(--postit-ink-soft);
  background:none;
  border:none;
  cursor:pointer;
  padding:2px 4px;
  font-weight:600;
  white-space:nowrap;
  font-family:inherit;
}
.postit-multipage-btn:hover{color:var(--postit-ink)}
.postit-multipage-btn.on{color:var(--postit-ink-strong)}
.postit-multipage-btn.on .postit-multipage-label{color:var(--postit-ink-strong)}
.postit-multipage-label{font-weight:500;color:var(--postit-ink-soft)}
.postit-header-actions{
  display:flex;
  align-items:center;
  gap:2px;
  flex-shrink:0;
}
.postit-hide-btn,
.postit-delete-btn{
  background:none;
  border:none;
  color:var(--postit-ink-muted);
  cursor:pointer;
  font-size:16px;
  line-height:1;
  padding:0 4px;
  transition:color .15s;
}
.postit-hide-btn:hover{color:var(--postit-ink-strong)}
.postit-delete-btn:hover{color:var(--danger)}
.postit.is-hidden{
  overflow:hidden;
  min-height:0;
  cursor:pointer;
  transition:left .35s cubic-bezier(.4,0,.2,1),top .35s cubic-bezier(.4,0,.2,1),
    transform .3s cubic-bezier(.4,0,.2,1),box-shadow .2s ease;
}
.postit.is-hidden .postit-header{
  cursor:pointer;
  border-radius:14px;
}
.postit.is-hidden .postit-body,
.postit.is-hidden .postit-footer{
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease;
}
.postit.is-hidden:hover,
.postit.is-hidden.is-peek{
  overflow:visible;
  z-index:450;
  box-shadow:0 12px 32px rgba(120,100,20,.28);
  transform:translateY(calc(-1 * var(--postit-peek-up, 140px)));
}
.postit.is-hidden:hover .postit-body,
.postit.is-hidden:hover .postit-footer,
.postit.is-hidden.is-peek .postit-body,
.postit.is-hidden.is-peek .postit-footer{
  opacity:1;
  pointer-events:auto;
}
.postit.is-animating{
  pointer-events:none;
  transition:left .35s cubic-bezier(.4,0,.2,1),top .35s cubic-bezier(.4,0,.2,1);
}

/* Dock de création (menu de choix today/someday) — reste sur les tokens app
   pour rester cohérent avec les autres FAB du dock (calc, IA, messagerie). */
#postit-dock-root{display:none}
#postit-dock-menu{
  position:fixed;
  display:none;
  flex-direction:column;
  gap:4px;
  min-width:220px;
  padding:8px;
  z-index:8004;
}
#postit-dock-menu.open{display:flex}
.postit-dock-menu-btn{
  padding:10px 12px;
  border-radius:10px;
  border:none;
  background:transparent;
  color:var(--text);
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
  transition:background .15s,color .15s;
}
.postit-dock-menu-btn:hover{background:var(--accent-bg);color:var(--accent)}
.postit-dock-menu-btn.someday::before,
.postit-dock-menu-btn.today::before{
  content:'';
  display:inline-block;
  width:6px;height:6px;
  border-radius:50%;
  margin-right:8px;
  vertical-align:middle;
  position:relative;top:-1px;
}
.postit-dock-menu-btn.someday::before{background:var(--warn)}
.postit-dock-menu-btn.today::before{background:var(--accent)}