:root {
  color-scheme: light;
  --ink: #111110;
  --paper: #F2F1EE;
  --soft: #F8F7F5;
  --card: #FFF;
  --ph: #DCDBD5;
  --green: #3DDC84;
  --red: #E5483B;
  --m: #ffd0a9;
  --line-10: rgba(17, 17, 16, .1);
  --ink-60: rgba(17, 17, 16, .6);
  --r-pill: 999px;
  --r-card: 22px;
  --r-card-sm: 18px;
  --titles: 'Golos Text', system-ui, sans-serif;
  --text: 'Radio Canada', system-ui, sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 16px/1.5 var(--text); }
h1, h2, h3 { font-family: var(--titles); font-weight: 600; letter-spacing: -.01em; margin: 0; line-height: 1.15; }
h1 { font-size: clamp(28px, 5vw, 40px); }
h2 { font-size: 20px; }
h3 { font-size: 13px; font-weight: 600; letter-spacing: .02em; color: var(--ink-60); }
p { margin: 0; }
a { color: inherit; }
[hidden] { display: none !important; }

.bar { display: flex; align-items: center; gap: 8px; padding: 14px 24px; border-bottom: 1px solid var(--line-10); background: var(--paper); position: sticky; top: 0; z-index: 2; flex-wrap: wrap; }
.brand { font: 700 20px var(--titles); text-decoration: none; margin-right: 8px; white-space: nowrap; }
.bar nav { display: flex; gap: 4px; flex: 1; }
.bar nav a { padding: 6px 11px; border-radius: var(--r-pill); text-decoration: none; white-space: nowrap; }
.bar nav a[aria-current="page"] { background: var(--ink); color: var(--paper); }
.who { color: var(--ink-60); font-size: 14px; }

.main { max-width: 980px; margin: 0 auto; padding: 32px 24px 160px; display: grid; gap: 24px; }
.narrow { max-width: 420px; margin: 8vh auto 0; width: 100%; }
.head { display: flex; justify-content: space-between; align-items: end; gap: 16px; flex-wrap: wrap; }
.back { color: var(--ink-60); font-size: 14px; text-decoration: none; }
.back:hover { color: var(--ink); }
.muted { color: var(--ink-60); }
.small { font-size: 14px; }

.card { background: var(--card); border-radius: var(--r-card); padding: 24px; display: grid; gap: 16px; }
.card.soft { background: var(--soft); }
.stack { display: grid; gap: 12px; }

label { display: grid; gap: 4px; font-size: 14px; font-weight: 500; }
input, select { font: inherit; color: inherit; background: var(--soft); border: 1px solid var(--line-10); border-radius: 12px; padding: 10px 14px; width: 100%; min-width: 0; }
input:focus-visible, select:focus-visible, button:focus-visible, a:focus-visible, .zone:focus-within { outline: 2px solid var(--ink); outline-offset: 2px; }
.row { display: flex; gap: 12px; align-items: end; flex-wrap: wrap; }
.row > label { flex: 1 1 200px; }

button, .button { font: 500 var(--btn-size, 15px) var(--text); color: var(--btn-ink, var(--paper)); background: var(--btn, var(--ink)); border: 1px solid var(--btn, var(--ink)); border-radius: var(--btn-r, var(--r-pill)); padding: 9px 18px; cursor: pointer; text-decoration: none; display: inline-block; white-space: nowrap; }
button:disabled { opacity: .5; cursor: default; }
.ghost { background: transparent; color: var(--ink); border-color: var(--line-10); }
.ghost:hover { border-color: var(--ink); }
.danger { color: var(--red); }
.danger:hover { border-color: var(--red); }
.tiny { padding: 5px 12px; font-size: 14px; }

.alert { background: #fde4e1; border-radius: 12px; padding: 10px 14px; font-size: 14px; }
.notice { background: var(--m); border-radius: var(--r-card-sm); padding: 16px; display: grid; gap: 8px; }
.copy { display: flex; gap: 8px; flex-wrap: wrap; }
.copy input { flex: 1 1 240px; background: var(--card); font-size: 14px; }

.spaces { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.space { background: var(--card); border-radius: var(--r-card-sm); padding: 18px; text-decoration: none; display: grid; gap: 10px; border: 1px solid transparent; }
.space:hover { border-color: var(--ink); }
.space strong { font: 600 18px var(--titles); }
.tags { display: flex; gap: 6px; flex-wrap: wrap; }
.tag { font-size: 13px; padding: 2px 10px; border-radius: var(--r-pill); background: var(--ph); }
.tag.a_valider { background: var(--m); }
.tag.production { background: var(--ink); color: var(--paper); }
.tag.livre { background: var(--green); }

.states { display: flex; gap: 6px; flex-wrap: wrap; }
.states button { background: var(--soft); color: var(--ink); border-color: var(--line-10); }
.states button[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }

.files { display: grid; gap: 20px; }
.group { display: grid; gap: 4px; }
details summary { cursor: pointer; padding: 6px 0; }
.file { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 10px 0; border-top: 1px solid var(--line-10); flex-wrap: wrap; }
.file .name { font-weight: 500; overflow-wrap: anywhere; }
.file > div:first-child { flex: 1 1 240px; min-width: 0; }
.actions { display: flex; gap: 6px; flex-wrap: wrap; }

.zone { border: 1.5px dashed var(--ph); border-radius: var(--r-card-sm); padding: 24px; display: grid; gap: 12px; justify-items: start; background: var(--soft); }
.zone.over { border-color: var(--ink); background: var(--m); }
.zone input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; }
.zone .row { width: 100%; align-items: center; }
.zone select { width: auto; background: var(--card); }

.people { width: 100%; border-collapse: collapse; font-size: 15px; }
.people th { text-align: left; font-size: 13px; font-weight: 500; color: var(--ink-60); padding: 0 12px 8px 0; }
.people td { border-top: 1px solid var(--line-10); padding: 10px 12px 10px 0; overflow-wrap: anywhere; }
.people td:nth-child(3) { white-space: nowrap; }
.people td:last-child { padding-right: 0; }
.scroll { overflow-x: auto; }

.envois { position: fixed; right: 16px; bottom: 16px; width: min(380px, calc(100vw - 32px)); background: var(--ink); color: var(--paper); border-radius: var(--r-card-sm); padding: 14px 16px; display: grid; gap: 12px; max-height: 50vh; overflow: auto; z-index: 3; }
.envoi { display: grid; gap: 4px; font-size: 14px; }
.envoi .top { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.envoi .name { overflow-wrap: anywhere; font-weight: 500; }
.envoi button { background: transparent; color: var(--paper); border: 0; padding: 0; font-size: 13px; text-decoration: underline; }
.envoi .state { opacity: .75; font-size: 13px; }
.envoi.erreur .state { opacity: 1; color: var(--m); }
progress { appearance: none; width: 100%; height: 6px; border: 0; border-radius: var(--r-pill); overflow: hidden; background: rgba(255, 255, 255, .2); }
progress::-webkit-progress-bar { background: rgba(255, 255, 255, .2); }
progress::-webkit-progress-value { background: var(--green); }
progress::-moz-progress-bar { background: var(--green); }

.wide { gap: 16px; }
.card.urgent { outline: 2px solid var(--red); outline-offset: -2px; }
.tasks { display: grid; }
.task { display: flex; gap: 12px; align-items: flex-start; padding: 12px 0; border-top: 1px solid var(--line-10); flex-wrap: wrap; }
.tasks .task:first-child { border-top: 0; padding-top: 0; }
.task input[type=checkbox], .check input[type=checkbox] { width: 20px; height: 20px; flex: none; accent-color: var(--ink); margin: 2px 0 0; padding: 0; }
.task .body { flex: 1 1 220px; min-width: 0; display: grid; gap: 2px; }
.task .title { font-weight: 500; overflow-wrap: anywhere; }
.task.done .title { text-decoration: line-through; color: var(--ink-60); }
.task .meta { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.task .actions { align-items: center; }
.task select, .task input[type=date] { width: auto; padding: 5px 10px; font-size: 14px; }
.steps { margin: 0; padding-left: 20px; }
.task .hour { flex: 0 0 56px; padding-top: 2px; }
.link { background: none; border: 0; padding: 0; color: inherit; font: inherit; text-decoration: underline; cursor: pointer; }
.late { color: var(--red); font-weight: 500; }
.tag.sensible { background: var(--m); }
.check { display: flex; gap: 8px; align-items: center; font-weight: 400; }
.line { display: block; padding: 8px 0; border-top: 1px solid var(--line-10); text-decoration: none; overflow-wrap: anywhere; }
.line:hover { text-decoration: underline; }

/* Pages Notion */
button.n-trash { flex: none; align-self: flex-start; padding: 0 6px; background: transparent; border: 0; border-radius: 5px; color: var(--ink-60); font-size: 16px; line-height: 1.3; opacity: 0; }
button.n-trash:hover { background: var(--soft); color: var(--ink); }
button.n-trash:focus-visible, tr:hover button.n-trash, .n-task:hover button.n-trash { opacity: 1; }
.n-b { position: relative; }
.n-toggle > summary > .n-edit { display: inline-block; min-width: 60%; }
button.n-add-block { margin-top: 8px; }
.n-history { margin: 26px 0 12px; padding-top: 12px; border-top: 1px solid var(--line-10); display: block; }
.n-history > summary { cursor: pointer; font-weight: 600; font-size: 15px; }
.n-history > p, .n-history > div { margin-top: 8px; }
.n-hlist { list-style: none; margin: 4px 0 0; padding: 0; }
.n-hline { display: grid; grid-template-columns: 190px minmax(0, 1fr) auto; gap: 12px; align-items: baseline; padding: 5px 0; border-top: 1px solid var(--line-10); }
.n-hwhen { color: var(--ink-60); font-size: 12px; }
.n-hwhat { overflow-wrap: anywhere; }
.n-hline.undone .n-hwhat { color: var(--ink-60); text-decoration: line-through; }


.n-view { margin-top: 14px; }
.n-avatar { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: none; display: inline-grid; place-items: center; background: var(--ph); font-size: 11px; font-weight: 600; }


.n-options { display: grid; gap: 2px; }
.n-menu-form { display: flex; gap: 6px; }
.n-menu-form input { padding: 6px 10px; font-size: 14px; }
.n-toast { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); z-index: 6; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; width: max-content; max-width: calc(100vw - 32px); padding: 10px 16px; border-radius: var(--r-card-sm); background: var(--ink); color: var(--paper); font-size: 14px; }
.n-toast .link { color: var(--m); white-space: nowrap; }
.n-title-input { display: block; width: 100%; padding: 0; background: transparent; border: 0; border-radius: 6px; color: inherit; font: inherit; letter-spacing: inherit; resize: none; overflow: hidden; field-sizing: content; }
.n-title-input:hover { background: var(--soft); }
.n-cal { display: grid; gap: 8px; width: min(252px, 100%); }
.n-cal-nav { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.n-cal-nav strong { font-size: 14px; }
.n-cal-nav strong::first-letter { text-transform: uppercase; }
.n-cal-nav button { padding: 2px 12px; background: transparent; border: 0; color: var(--ink); font-size: 18px; line-height: 1.2; }
.n-cal-nav button:hover { background: var(--soft); }
.n-cal-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.n-cal-head { padding: 2px 0; color: var(--ink-60); font-size: 11px; text-align: center; }
.n-cal-days button { height: 32px; padding: 0; background: transparent; border: 0; border-radius: 6px; color: var(--ink); font-size: 13px; font-weight: 500; }
.n-cal-days button:hover { background: var(--soft); }
.n-cal-days .today { box-shadow: inset 0 0 0 1px var(--ph); }
.n-cal-days [aria-pressed=true], .n-cal-days [aria-pressed=true]:hover { background: var(--ink); color: var(--paper); }
.n-flow { list-style: none; margin: 0 0 2px; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; }
.n-flow button { padding: 2px 10px; background: var(--soft); border: 1px solid var(--line-10); color: var(--ink-60); font-size: 13px; }
.n-flow button:hover { border-color: var(--ink); color: var(--ink); }
.n-flow .done button { background: var(--ph); color: var(--ink); border-color: transparent; }
.n-flow .current button { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.n-tasks { display: grid; gap: 6px; margin: 0 0 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line-10); }
.n-tasks h2 { font-size: 15px; }
.n-files .zone { padding: 14px 16px; margin-top: 4px; }
.n-tasklist { list-style: none; margin: 0; padding: 0; }
.n-task { display: grid; grid-template-columns: minmax(0, 1fr) auto auto 150px; gap: 10px; align-items: center; padding: 4px 0; border-top: 1px solid var(--line-10); }
.n-task-title { padding: 2px 6px; background: transparent; border: 0; border-radius: 5px; font-weight: 500; }
.n-task-title:hover { background: var(--soft); }
.n-extra { width: min(100%, 320px); margin: -2px -6px; font-weight: 400; }
.n-task-open { color: var(--ink-60); text-decoration: none; padding: 0 4px; }



.n-content { display: grid; gap: 6px; font-size: 15px; min-width: 0; }
.n-content > * { min-width: 0; }
.n-heading_1 { font-size: 28px; margin-top: 18px; color: inherit; }
.n-heading_2 { font-size: 22px; margin-top: 14px; color: inherit; }
.n-heading_3 { font-size: 17px; margin-top: 10px; color: inherit; letter-spacing: 0; }
.n-p:empty { min-height: 12px; }
.n-indent { padding-left: 18px; display: grid; gap: 6px; }
.n-toggle > summary > * { display: inline; }
.n-list { margin: 0; padding-left: 22px; }
.n-quote { margin: 4px 0; padding-left: 14px; border-left: 3px solid var(--ink); }
.n-callout { display: flex; gap: 10px; padding: 14px 16px; border-radius: 6px; background: var(--soft); }
.n-callout-icon { flex: none; width: 22px; height: 22px; font-size: 18px; line-height: 22px; object-fit: contain; }
.n-callout-body { flex: 1; min-width: 0; display: grid; gap: 6px; }
.n-hr { width: 100%; border: 0; border-top: 1px solid var(--line-10); margin: 8px 0; }
.n-columns { display: flex; gap: 24px; flex-wrap: wrap; }
.n-column { flex: 1 1 240px; min-width: 0; display: grid; gap: 6px; align-content: start; }
.n-todo { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; }
.n-todo input { width: 16px; height: 16px; margin: 3px 0 0; padding: 0; flex: none; }
.n-code { background: var(--soft); padding: 12px; border-radius: 6px; overflow: auto; font-size: 13px; margin: 0; }
.n-subpage { display: block; padding: 3px 0; font-weight: 500; text-decoration: underline; text-decoration-color: var(--line-10); text-underline-offset: 3px; }
.n-bookmark { display: block; padding: 8px 12px; border: 1px solid var(--line-10); border-radius: 6px; overflow-wrap: anywhere; font-size: 14px; }
.n-media { margin: 6px 0; display: grid; gap: 4px; }
.n-media img, .n-media video { max-width: 100%; height: auto; border-radius: 4px; }
.n-simple { border-collapse: collapse; font-size: 14px; width: 100%; }
.n-simple td, .n-simple th { border: 1px solid var(--line-10); padding: 6px 9px; text-align: left; vertical-align: top; }
.n-simple th { background: var(--soft); font-weight: 600; }
.n-color-gray { color: #787774; } .n-color-brown { color: #976D57; } .n-color-orange { color: #CC782F; } .n-color-yellow { color: #C29343; } .n-color-green { color: #548164; } .n-color-blue { color: #487CA5; } .n-color-purple { color: #8A67AB; } .n-color-pink { color: #B35488; } .n-color-red { color: #C4554D; }
.n-bg-gray { background: #F1F1EF; } .n-bg-brown { background: #F3EEEE; } .n-bg-orange { background: #F8ECDF; } .n-bg-yellow { background: #FAF3DD; } .n-bg-green { background: #EEF3ED; } .n-bg-blue { background: #E9F3F7; } .n-bg-purple { background: #F6F3F8; } .n-bg-pink { background: #F9F2F5; } .n-bg-red { background: #FAECEC; }

.n-work { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto 96px; gap: 10px; align-items: center; padding: 6px 0; border-top: 1px solid var(--line-10); }
.n-work-title { display: flex; align-items: center; gap: 6px; font-weight: 500; min-width: 0; overflow-wrap: anywhere; }
.n-work.late .n-work-due { color: var(--red); font-weight: 600; }
.n-work-person + .n-work-person { margin-top: 18px; }
.n-work-person > h3 { font-family: var(--titles); font-weight: 800; font-size: 17px; color: var(--ink); margin: 0 0 6px; }
@media (max-width: 1380px) { .bar .who { display: none; } }
.n-pipe { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 8px 0; }
.n-pipe-step { display: inline-flex; align-items: center; gap: 6px; }

@media (max-width: 600px) {
  .n-work { grid-template-columns: minmax(0, 1fr) auto; }
  .n-work-client { grid-column: 1 / -1; grid-row: 2; }
  .n-task { grid-template-columns: minmax(0, 1fr) auto auto; }
  .n-hline { grid-template-columns: minmax(0, 1fr) auto; }
  .n-hline .n-hwhen { grid-column: 1 / -1; }
  .n-task button.n-cellbtn { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
  .bar { padding: 12px 16px; }
  .bar nav { flex-wrap: wrap; flex-basis: 100%; order: 3; }
  .bar nav a { padding: 6px 12px; }
  .main { padding: 20px 16px 200px; }
  .card { padding: 18px; }
}

/* --- L'interface de l'équipe : mesures relevées dans Notion le 2 nov. 2026 --- */
body.notion {
  --ink: rgb(44, 44, 43);
  --ink-60: rgb(125, 122, 117);
  --ink-40: rgb(161, 158, 153);
  --side-ink: rgb(95, 94, 89);
  --n-rgb: 55 53 47;
  --paper: #fff;
  --soft: #F9F8F7;
  --card: #fff;
  --ph: #E9E8E5;
  --line-10: rgb(var(--n-rgb) / .07);
  --hover: rgb(var(--n-rgb) / .05);
  --hover-soft: rgb(var(--n-rgb) / .03);
  --blue: rgb(39, 131, 222);
  --m: rgba(35, 131, 226, .14);
  --btn: var(--blue);
  --btn-r: 6px;
  --btn-size: 14px;
  --r-pill: 6px;
  --r-card: 10px;
  --r-card-sm: 8px;
  --titles: 'Golos Text', system-ui, sans-serif;
  --text: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI Variable Display", "Segoe UI", Helvetica, "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
  background: var(--card);
  font-size: 14px;
  line-height: 1.5;
}
body.notion h1, body.notion h2, body.notion h3, body.notion h4, body.notion .n-title-input { font-family: var(--titles); font-weight: 800; letter-spacing: 0; }
body.notion h1 { font-size: 32px; line-height: 1.2; }
body.notion h3 { font-weight: 600; color: var(--ink-60); }
body.notion .n-b { font-size: 16px; line-height: 1.5; }
body.notion .n-b .n-heading_1 { font-size: 30px; font-weight: 800; line-height: 1.3; margin-top: 32px; color: inherit; }
body.notion .n-b .n-heading_2 { font-size: 24px; font-weight: 800; line-height: 1.3; margin-top: 22px; color: inherit; }
body.notion .n-b .n-heading_3 { font-size: 20px; font-weight: 800; line-height: 1.3; margin-top: 16px; color: inherit; }
body.notion a { color: inherit; }
body.notion a.button:not(.ghost) { color: var(--btn-ink); }
body.notion input:not([type=checkbox]), body.notion select { background: var(--soft); border-color: var(--line-10); border-radius: 6px; padding: 5px 8px; font-size: 14px; }
body.notion :is(input, select, button, a):focus-visible { outline: 2px solid rgba(35, 131, 226, .5); outline-offset: 1px; }
body.notion .ghost { background: var(--card); color: var(--ink); border-color: var(--line-10); }
body.notion .ghost:hover { background: var(--hover); border-color: var(--line-10); }
body.notion .card { border: 1px solid var(--line-10); box-shadow: none; padding: 20px; }
body.notion .main:not(.notion) { max-width: 900px; padding: 40px 48px 160px; }
.shell { min-width: 0; overflow-x: clip; }
body.notion .shell { margin-left: var(--side-w, 270px); }

.n-g { width: 16px; height: 16px; flex: none; display: block; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.n-g-fill { fill: currentColor; stroke: none; }
.n-aa { flex: none; width: 16px; font-size: 13px; letter-spacing: -.5px; line-height: 16px; }
.s-grow { flex: 1; min-width: 0; }

/* Barre latérale */
.side { position: fixed; inset: 0 auto 0 0; z-index: 3; width: var(--side-w, 270px); display: flex; flex-direction: column; background: var(--soft); border-right: 1px solid var(--line-10); color: var(--side-ink); }
.s-top { display: flex; align-items: center; gap: 4px; height: 44px; padding: 0 8px 0 12px; flex: none; }
button.s-search { display: flex; align-items: center; justify-content: space-between; margin: 0 12px 8px; padding: 5px 8px; flex: none; background: var(--card); border: 1px solid rgb(var(--n-rgb) / .12); border-radius: 8px; color: var(--ink-40); font: 400 14px/20px var(--text); cursor: text; }
button.s-search:hover { background: var(--card); border-color: rgb(var(--n-rgb) / .2); }
.s-search kbd { padding: 0 4px; border-radius: 4px; background: var(--hover); color: var(--ink-40); font: 500 11px/16px var(--text); }
.s-scroll { flex: 1; min-height: 0; overflow-y: auto; padding: 0 8px 12px; }
.s-tabs { display: flex; gap: 4px; padding: 4px 4px 8px; }
.s-tab { display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 8px; color: var(--side-ink); font-weight: 500; text-decoration: none; }
.s-tab:hover { background: var(--hover); }
.s-tab.on { background: rgb(var(--n-rgb) / .08); color: var(--ink); }
.s-section { margin-top: 10px; }
button.s-head { display: block; width: 100%; padding: 2px 8px 4px; background: transparent; border: 0; border-radius: 6px; color: var(--ink-40); font: 500 12px/16px var(--text); text-align: left; cursor: pointer; }
button.s-head:hover { color: var(--ink-60); }
.s-row { position: relative; display: flex; align-items: center; border-radius: 6px; }
.s-row:hover { background: var(--hover); }
.s-row.on { background: rgb(var(--n-rgb) / .08); color: var(--ink); }
.s-link { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 8px; color: inherit !important; text-decoration: none; font-weight: 400; }
.s-ic { flex: none; width: 22px; height: 22px; display: grid; place-items: center; font-size: 16px; }
.s-ic .n-g { width: 18px; height: 18px; }
.s-img { width: 20px; height: 20px; object-fit: cover; border-radius: 4px; font-size: 16px; line-height: 20px; text-align: center; }
.s-label { flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
button.s-chev { position: absolute; left: 8px; width: 22px; height: 22px; padding: 3px; display: none; place-items: center; z-index: 1; background: var(--ph); border: 0; border-radius: 4px; color: var(--ink-60); cursor: pointer; }
.s-row.has-kids:hover > button.s-chev, button.s-chev:focus-visible { display: grid; }
button.s-chev.open .n-g { transform: rotate(90deg); }
.s-foot { flex: none; padding: 8px 12px; border-top: 1px solid var(--line-10); }
button.s-account { display: inline-flex; align-items: center; gap: 8px; padding: 4px 6px; background: transparent; border: 0; border-radius: 6px; color: var(--side-ink); font: 500 14px/20px var(--text); cursor: pointer; }
button.s-account:hover { background: var(--hover); }
.s-mark { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 4px; background: rgb(var(--n-rgb) / .08); font-weight: 600; font-size: 13px; }
.s-resize { position: absolute; top: 0; bottom: 0; right: -3px; width: 6px; cursor: col-resize; }
.s-resize:hover { background: rgba(35, 131, 226, .25); }

/* Icônes d'action et bulles d'aide */
.n-ic { position: relative; display: inline-grid; place-items: center; flex: none; width: 28px; height: 28px; padding: 0; background: transparent; border: 0; border-radius: 6px; color: var(--ink-60) !important; cursor: pointer; }
.n-ic:hover { background: var(--hover); }
.n-ic .n-g { width: 18px; height: 18px; }
.n-ic.on { color: var(--blue) !important; }
.n-ic.off { opacity: .35; pointer-events: none; }
.n-stars { color: #E6A71C !important; }
.tip::after { content: attr(data-tip); position: absolute; top: calc(100% + 6px); left: 50%; transform: translateX(-50%); z-index: 9; padding: 3px 7px; border-radius: 5px; background: #1F1F1E; color: #fff; font: 500 12px/16px var(--text); white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .1s .35s; }
.tip:hover::after { opacity: 1; }
.s-top .tip::after { left: 0; transform: none; }
.s-top .tip:last-child::after { left: auto; right: 0; }
.n-top .tip:last-child::after, .n-view-tools .tip::after { left: auto; right: 0; transform: none; }

/* Barre du haut */
.n-top { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 4px; height: 44px; padding: 0 12px; background: var(--card); }
.n-crumbs { display: flex; align-items: center; gap: 2px; min-width: 0; }
.n-crumb { display: inline-flex; align-items: center; gap: 6px; min-width: 0; height: 26px; padding: 0 6px; border-radius: 6px; text-decoration: none; white-space: nowrap; }
.n-crumb span:not(.n-icon) { overflow: hidden; text-overflow: ellipsis; max-width: 360px; }
.n-crumb:hover { background: var(--hover); }
.n-crumb-sep { color: var(--ink-40); padding: 0 1px; }
.n-edited { color: var(--ink-40); white-space: nowrap; margin-right: 8px; }
.n-live { display: inline-flex; align-items: center; gap: 5px; margin: 0 6px; color: var(--ink-40); font-size: 12px; white-space: nowrap; }
.n-live::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #4DAB78; }
.n-live.off::before { background: #E56458; }

/* Page */
.main.notion { max-width: none; padding: 0 0 160px; background: var(--card); display: block; min-height: calc(100vh - 44px); margin: 0; }
.n-page { font-size: 14px; color: var(--ink); }
.n-cover { display: block; width: 100%; height: 30vh; min-height: 120px; max-height: 280px; object-fit: cover; object-position: center 50%; }
.n-nocover { height: 56px; }
.n-body { padding: 0 clamp(16px, 8vw, 104px); position: relative; }
.n-narrow .n-body { max-width: 900px; margin: 0 auto; padding: 0 96px; }
.n-body > h1 { margin: 34px 0 12px; font-size: 40px; line-height: 1.2; font-weight: 700; }
.n-db .n-body > h1 { font-size: 32px; margin: 48px 0 12px; }
.n-body > .n-pageicon + h1 { margin-top: 18px; }
.n-pageicon { display: block; width: 78px; height: 78px; object-fit: contain; border-radius: 4px; margin-top: -50px; position: relative; font-size: 72px; line-height: 78px; }
.n-nocover + .n-body > .n-pageicon { margin-top: 0; }
.n-icon { width: 20px; height: 20px; flex: none; object-fit: contain; border-radius: 3px; display: inline-block; font-size: 16px; line-height: 20px; text-align: center; }
.n-title-input { font-weight: 700; }

/* Bandeaux de Global */
.n-banner { display: grid; place-items: center; height: clamp(96px, 17vw, 223px); margin-top: 28px; background: #0B0B0B; color: #F4F2EE; font-size: clamp(34px, 6vw, 72px); font-weight: 700; letter-spacing: -.02em; text-align: center; }

/* Vues et outils */
.n-view { margin-top: 4px; }
.n-view-bar { display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 6px 0; border-bottom: 0; flex-wrap: wrap; }
.n-view-tabs { display: flex; gap: 2px; flex-wrap: wrap; min-width: 0; }
.n-tab { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 6px 12px; background: transparent; border: 0; border-radius: 20px; color: rgb(125, 122, 117); font: 500 14px/17px var(--text); cursor: pointer; }
.n-tab .n-g { width: 18px; height: 18px; }
button.n-tab:hover { background: var(--hover-soft); }
.n-tab.on { background: var(--hover); color: var(--ink); }
.n-view-tools { display: flex; align-items: center; gap: 0; margin-left: auto; }
input.n-view-search { display: none; width: 180px; height: 28px; margin: 0 2px; }
input.n-view-search.open { display: block; }
.n-split { display: inline-flex; margin-left: 6px; border-radius: 6px; overflow: hidden; }
button.n-split-main, button.n-split-more { height: 28px; padding: 0 8px; background: var(--blue); border: 0; border-radius: 0; color: #F3F9FD; font: 500 14px/21px var(--text); cursor: pointer; }
button.n-split-main:hover, button.n-split-more:hover { background: rgb(29, 113, 197); }
button.n-split-more { display: grid; place-items: center; padding: 0 5px; border-left: 1px solid rgba(255, 255, 255, .25); }
.n-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 0 8px; }
.n-chip { display: inline-flex; align-items: center; height: 24px; border-radius: 12px; background: rgba(35, 131, 226, .07); color: var(--blue); }
button.n-chip-name { display: inline-flex; align-items: center; gap: 4px; padding: 0 2px 0 8px; background: transparent; border: 0; color: inherit; font: 400 13px/24px var(--text); max-width: 360px; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
button.n-chip-x { display: grid; place-items: center; width: 20px; height: 24px; padding: 0 3px; background: transparent; border: 0; color: inherit; cursor: pointer; }
.n-base-body, .n-view-body { min-width: 0; }

/* Groupes */
.n-group { margin: 0 0 22px; }
.n-group > summary { display: flex; align-items: center; gap: 8px; min-height: 32px; list-style: none; cursor: pointer; }
.n-group > summary::-webkit-details-marker { display: none; }
.n-caret { width: 12px; height: 12px; margin: 0 2px 0 6px; color: var(--ink); transition: transform .12s; }
.n-group[open] > summary .n-caret { transform: rotate(90deg); }
.n-group-acts { display: inline-flex; opacity: 0; transition: opacity .1s; }
.n-group > summary:hover .n-group-acts, .n-group-acts:focus-within { opacity: 1; }
.n-group-acts .n-ic { width: 24px; height: 24px; }

/* Tableau */
.scroll { overflow-x: auto; }
.n-page .scroll { margin-left: -28px; padding-left: 28px; scrollbar-width: thin; }
.n-table { border-collapse: collapse; table-layout: fixed; font-size: 14px; }
.n-table col { width: 150px; }
.n-table th { padding: 0; height: 36px; border-bottom: 1px solid var(--line-10); border-top: 0; text-align: left; font-weight: 400; position: relative; }
.n-th { display: flex; align-items: center; gap: 8px; width: 100%; height: 36px; padding: 0 8px; background: transparent; border: 0; border-radius: 0; color: var(--ink-60); font: 400 14px/17px var(--text); text-align: left; cursor: pointer; }
.n-th:hover { background: var(--hover-soft); }
.n-th span:last-child { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.n-col-grip { position: absolute; top: 0; bottom: 0; right: -2px; width: 5px; z-index: 1; cursor: col-resize; }
.n-col-grip:hover { background: rgba(35, 131, 226, .35); }
.n-table td { padding: 7.5px 8px; min-height: 37px; border-bottom: 1px solid var(--line-10); vertical-align: top; line-height: 21px; overflow: hidden; overflow-wrap: anywhere; }
.n-table td + td { border-left: 1px solid var(--line-10); }
.n-table td:hover { background: var(--hover-soft); }
.n-table tr:hover td.n-col-title { overflow: visible; }
.n-table td.n-col-progress { text-align: right; }
.n-table td.n-col-due { white-space: nowrap; }
.n-title-cell { position: relative; display: flex; align-items: flex-start; gap: 8px; min-width: 0; }
.n-title { display: flex; gap: 6px; flex: 1; min-width: 0; font-weight: 500; text-decoration: none; }
.n-title .n-icon { margin-top: 1px; }
.n-title span { min-width: 0; }
.n-open { position: absolute; right: 0; top: -1px; display: none; align-items: center; gap: 4px; height: 24px; padding: 0 6px; background: var(--card); border-radius: 6px; box-shadow: 0 0 0 1px rgb(var(--n-rgb) / .12), 0 1px 2px rgba(0, 0, 0, .05); color: var(--ink-60) !important; font: 500 11.5px/24px var(--text); letter-spacing: .03em; text-decoration: none; }
.n-open .n-g { width: 14px; height: 14px; }
.n-open:hover { background: var(--soft); }
.n-table tr:hover .n-open, .n-open:focus-visible { display: inline-flex; }
button.n-row-menu { position: absolute; left: -32px; top: -1px; width: 20px; height: 24px; padding: 2px; background: transparent; border: 0; border-radius: 4px; color: var(--ink-40); opacity: 0; cursor: pointer; }
.n-table tr:hover button.n-row-menu, button.n-row-menu:focus-visible { opacity: 1; }
button.n-row-menu:hover { background: var(--hover); color: var(--ink-60); }
.n-table td.n-col-title { overflow: visible; }
.n-num { font-variant-numeric: tabular-nums; }
button.n-new { display: flex; align-items: center; gap: 8px; width: 100%; height: 34px; margin: 0; padding: 0 8px; background: transparent; border: 0; border-radius: 0; color: var(--ink-40); font: 400 14px/21px var(--text); cursor: pointer; }
button.n-new:hover { background: var(--hover-soft); }
body.notion input.n-extra { display: block; width: 100%; margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; font-size: 14px; line-height: 21px; }
body.notion textarea.n-long { display: block; width: 100%; margin: 0; padding: 0; overflow: hidden; background: transparent; border: 0; border-radius: 0; font: inherit; font-size: 14px; line-height: 21px; resize: none; white-space: pre-wrap; }
.n-table textarea.n-long { height: 21px; white-space: nowrap; }
.n-table .n-extra::placeholder { color: transparent; }
.n-props .n-extra::placeholder { color: var(--ink-40); }
.n-flash td { animation: n-flash 2.2s ease-out; }
@keyframes n-flash { 0%, 40% { background: rgba(35, 131, 226, .14); } 100% { background: transparent; } }

/* Pastilles : couleurs de Notion */
.n-pill { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; height: 20px; padding: 0 6px; border-radius: 4px; background: var(--n-bg); color: var(--n-fg); font-size: 14px; line-height: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.n-pill:has(.n-dot) { padding: 0 9px 0 7px; border-radius: 10px; }
.n-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--n-dot); }
.n-tone-default, .n-tone-gray { --n-bg: rgb(var(--n-rgb) / .11); --n-fg: rgb(73, 72, 70); --n-dot: rgb(142, 139, 134); }
.n-tone-brown { --n-bg: rgba(127, 51, 0, .157); --n-fg: rgb(88, 68, 55); --n-dot: rgb(182, 137, 101); }
.n-tone-orange { --n-bg: rgba(196, 88, 0, .204); --n-fg: rgb(106, 66, 34); --n-dot: rgb(214, 136, 74); }
.n-tone-yellow { --n-bg: rgba(209, 156, 0, .282); --n-fg: rgb(101, 81, 33); --n-dot: rgb(203, 160, 61); }
.n-tone-green { --n-bg: rgba(0, 96, 38, .157); --n-fg: rgb(42, 83, 60); --n-dot: rgb(78, 163, 116); }
.n-tone-blue { --n-bg: rgba(0, 118, 217, .204); --n-fg: rgb(38, 74, 114); --n-dot: rgb(39, 131, 222); }
.n-tone-purple { --n-bg: rgba(92, 0, 163, .14); --n-fg: rgb(85, 59, 105); --n-dot: rgb(181, 119, 214); }
.n-tone-pink { --n-bg: rgba(179, 0, 109, .14); --n-fg: rgb(105, 53, 82); --n-dot: rgb(214, 105, 160); }
.n-tone-red { --n-bg: rgba(206, 24, 0, .165); --n-fg: rgb(109, 53, 49); --n-dot: rgb(229, 100, 88); }
.n-many { display: flex; flex-wrap: wrap; gap: 4px 10px; min-width: 0; }
.n-client { display: inline-flex; gap: 6px; align-items: center; min-width: 0; text-decoration: none; font-weight: 500; border-bottom: 1px solid rgb(var(--n-rgb) / .15); }
.n-client .n-g { width: 18px; height: 18px; color: var(--ink-60); }
.n-person { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.n-avatar { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; flex: none; display: inline-grid; place-items: center; background: var(--ph); font-size: 11px; }
button.n-cellbtn { display: block; width: calc(100% + 16px); min-height: 37px; margin: -7.5px -8px; padding: 7.5px 8px; background: transparent; border: 0; border-radius: 0; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.n-many > button.n-cellbtn { display: inline-grid; place-items: center; width: 20px; height: 20px; min-height: 0; margin: 1px 0 0; padding: 2px; border-radius: 4px; opacity: 0; color: var(--ink-40); }
.n-many > button.n-cellbtn:hover { background: var(--hover); }
.n-table tr:hover .n-many > button.n-cellbtn, .n-props .n-many > button.n-cellbtn, .n-many > button.n-cellbtn:focus-visible { opacity: 1; }

/* Menus */
.n-menu { position: absolute; z-index: 5; width: 280px; max-width: calc(100vw - 16px); max-height: min(420px, 70vh); overflow: auto; padding: 4px; display: grid; gap: 1px; background: var(--card); border-radius: 10px; box-shadow: rgba(0, 0, 0, .1) 0 14px 28px -6px, rgba(0, 0, 0, .06) 0 2px 4px -1px, rgb(var(--n-rgb) / .08) 0 0 0 1px; color: var(--ink); font-size: 14px; animation: n-pop .09s ease-out; }
@keyframes n-pop { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }
.n-menu-title { padding: 6px 8px 3px; color: var(--ink-40); font-size: 12px; font-weight: 500; }
button.n-option, label.n-option { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 28px; padding: 3px 8px; background: transparent; border: 0; border-radius: 6px; color: var(--ink); font: 400 14px/20px var(--text); text-align: left; cursor: pointer; white-space: normal; }
button.n-option:hover, label.n-option:hover, .n-check:hover { background: var(--hover); }
button.n-option[aria-pressed="true"] { background: rgba(35, 131, 226, .08); }
button.n-option .n-g { color: var(--ink-60); }
button.n-option.n-danger, button.n-option.n-danger .n-g { color: rgb(205, 60, 58); }
label.n-option input { width: 16px; height: 16px; margin: 0; padding: 0; flex: none; accent-color: var(--blue); }
.n-check { display: flex; align-items: center; gap: 8px; min-height: 28px; padding: 3px 8px; border-radius: 6px; font-weight: 400; font-size: 14px; cursor: pointer; }
.n-check input { width: 15px; height: 15px; margin: 0; padding: 0; flex: none; accent-color: var(--blue); }
.n-check .n-g { color: var(--ink-60); }
.n-search { padding: 5px 8px; margin: 2px 2px 4px; width: auto; font-size: 14px; }

/* Fiche */
.n-props { display: grid; gap: 2px; margin: 0 0 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line-10); }
.n-prop { display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: start; min-height: 34px; border-radius: 4px; }
.n-props dt { display: flex; align-items: center; gap: 8px; min-height: 34px; padding: 0 6px; color: var(--ink-60); min-width: 0; }
.n-props dt span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.n-props dd { margin: 0; padding: 6px 8px; min-width: 0; border-radius: 4px; line-height: 21px; }
.n-props dd:hover { background: var(--hover-soft); }
.n-props button.n-cellbtn { width: calc(100% + 16px); min-height: 22px; margin: -6px -8px; padding: 6px 8px; }
.n-props button.n-cellbtn:empty::before, .n-props .n-many:empty::before { content: 'Vide'; color: var(--ink-40); }
.n-props .n-many > button.n-cellbtn { width: 20px; min-height: 0; margin: 1px 0 0; padding: 2px; }
.n-tasks h2 { font-size: 14px; font-weight: 600; }
.n-content { font-size: 16px; line-height: 1.5; gap: 2px; }
.n-b { position: relative; }
button.n-b-menu, button.n-b-add { position: absolute; top: 2px; width: 22px; height: 24px; padding: 3px; background: transparent; border: 0; border-radius: 4px; color: var(--ink-40); opacity: 0; cursor: pointer; }
button.n-b-add { left: -48px; }
button.n-b-menu { left: -24px; }
li.n-b > button.n-b-add { left: -70px; }
li.n-b > button.n-b-menu { left: -46px; }
button.n-b-menu:hover, button.n-b-add:hover { background: var(--hover); color: var(--ink-60); }
.n-b:hover > button.n-b-menu, .n-b:hover > button.n-b-add, button.n-b-menu:focus-visible, button.n-b-add:focus-visible { opacity: 1; }
.n-edit { display: block; min-height: 1.5em; padding: 1px 2px; outline: 0; border-radius: 3px; overflow-wrap: anywhere; white-space: pre-wrap; cursor: text; }
.n-edit:empty:focus::before { content: "Écrivez, ou tapez « / » pour choisir un bloc"; color: var(--ink-40); }
.n-toggle > summary > .n-edit { display: inline-block; min-width: 60%; }
.n-format { position: fixed; z-index: 6; display: flex; gap: 1px; padding: 4px; background: var(--card); border-radius: 8px; box-shadow: rgba(0, 0, 0, .1) 0 14px 28px -6px, rgba(0, 0, 0, .06) 0 2px 4px -1px, rgb(var(--n-rgb) / .08) 0 0 0 1px; }
.n-format[hidden] { display: none; }
.n-format button { padding: 2px 8px; background: transparent; border: 0; border-radius: 5px; color: var(--ink); font-size: 14px; font-weight: 500; }
.n-format button:hover { background: var(--hover); }

/* Galerie */
.n-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; margin-top: 4px; }
.n-card { border-radius: 10px; overflow: hidden; text-decoration: none; display: flex; flex-direction: column; background: var(--card); box-shadow: rgb(var(--n-rgb) / .09) 0 0 0 1px, rgba(0, 0, 0, .03) 0 2px 4px; transition: background .1s; }
.n-card:hover { background: var(--soft); }
.n-card-cover { display: block; width: 100%; height: 130px; object-fit: cover; background: var(--ph); }
.n-card-name { display: flex; gap: 6px; align-items: flex-start; padding: 8px 10px 4px; font-weight: 500; overflow-wrap: anywhere; }
.n-card-name:last-child { padding-bottom: 10px; }
.n-card-status { padding: 2px 10px 10px; }

/* Aperçu latéral */
.peek { position: fixed; inset: 0 0 0 auto; z-index: 4; width: min(50vw, 900px); min-width: min(100vw, 560px); display: flex; flex-direction: column; background: var(--card); box-shadow: rgba(0, 0, 0, .06) 0 0 0 1px, rgba(0, 0, 0, .12) -8px 0 24px -6px; animation: n-peek .16s cubic-bezier(.2, .8, .3, 1); }
@keyframes n-peek { from { transform: translateX(28px); opacity: .4; } to { transform: none; opacity: 1; } }
.n-peek-head { flex: none; display: flex; align-items: center; gap: 2px; height: 44px; padding: 0 10px; }
.n-peek-head .tip::after { left: 0; transform: none; }
.n-peek-head .n-peek-menu::after { left: auto; right: 0; }
.n-peek-body { flex: 1; min-height: 0; overflow-y: auto; }
.n-peek-body .n-page { padding-bottom: 120px; }
.n-peek-body .n-narrow .n-body { padding: 0 56px; max-width: none; }
.n-peek-body .n-cover { height: 180px; min-height: 0; }
.n-peek-body .n-nocover { height: 20px; }
.n-peek-wait { padding: 72px 56px 0; }
.n-peek-wait h1 { color: var(--ink); font-size: 40px; }

/* ⌘K */
.n-palette { position: fixed; inset: 0; z-index: 8; background: rgba(15, 15, 15, .32); display: flex; justify-content: center; align-items: flex-start; padding: 12vh 16px 16px; animation: n-pop .08s ease-out; }
.n-palette-box { width: min(755px, 100%); max-height: 70vh; display: flex; flex-direction: column; background: var(--card); border-radius: 12px; overflow: hidden; box-shadow: rgba(0, 0, 0, .2) 0 24px 48px -12px, rgb(var(--n-rgb) / .08) 0 0 0 1px; }
body.notion input.n-palette-input { flex: none; padding: 14px 16px; background: var(--card); border: 0; border-bottom: 1px solid var(--line-10); border-radius: 0; font-size: 18px; outline: 0; }
.n-palette-list { overflow-y: auto; padding: 6px; }
button.n-palette-item { display: flex; align-items: center; gap: 10px; width: 100%; height: 36px; padding: 0 10px; background: transparent; border: 0; border-radius: 6px; color: var(--ink); font: 400 14px/20px var(--text); text-align: left; cursor: pointer; }
button.n-palette-item.on { background: var(--hover); }
.n-palette-hint { color: var(--ink-40); font-size: 12px; white-space: nowrap; }
.n-palette-none { padding: 18px; color: var(--ink-40); }

.n-toast { background: #1F1F1E; }


/* Sous-bases de Notion : tableau, galerie, kanban, frise, liste */
.n-base { margin: 14px 0 22px; min-width: 0; }
.n-base.full { margin-top: 0; }
.n-base-title { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; font-size: 18px; font-weight: 800; color: var(--ink); }
.n-base-title a { text-decoration: none; }
.n-base-title:empty { display: none; }
.n-base-body { min-width: 0; }
.n-base-wait { padding: 12px 2px; color: var(--ink-60); font-size: 14px; }
.n-file { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 1px 6px; background: rgb(var(--n-rgb) / .06); border-radius: 4px; font-size: 13px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.n-link-cell { text-decoration: underline; text-decoration-color: rgb(var(--n-rgb) / .3); overflow-wrap: anywhere; }
.n-cell-check { width: 16px; height: 16px; margin: 0; accent-color: var(--blue); }
.n-gallery.size-small { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.n-gallery.size-medium { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.n-gallery.size-large { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); }
.n-card-cover { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: rgb(var(--n-rgb) / .04); }
.n-card-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.n-card-cover.contain img { object-fit: contain; }
.n-card-props { display: flex; flex-wrap: wrap; gap: 4px 6px; padding: 0 10px 10px; font-size: 12px; color: var(--ink-60); }
.n-card-new { display: flex; align-items: center; justify-content: center; min-height: 60px; background: transparent; border: 1px dashed rgb(var(--n-rgb) / .16); border-radius: 8px; color: var(--ink-60); font-size: 14px; cursor: pointer; }
.n-card-new:hover { background: var(--hover); }
.n-board { display: flex; align-items: flex-start; gap: 12px; overflow-x: auto; padding-bottom: 10px; }
.n-lane { flex: 0 0 260px; min-width: 0; padding: 8px; background: rgb(var(--n-rgb) / .03); border-radius: 8px; }
.n-lane.over { background: rgba(35, 131, 226, .08); }
.n-lane-head { display: flex; align-items: center; gap: 6px; min-height: 26px; margin-bottom: 6px; font-size: 13px; color: var(--ink-60); }
.n-lane .n-card { display: block; margin-bottom: 8px; }
.n-timeline { position: relative; min-width: 100%; }
.n-time-head { display: flex; position: sticky; top: 0; height: 28px; font-size: 12px; color: var(--ink-60); border-bottom: 1px solid var(--line-10); }
.n-time-head span { position: absolute; top: 6px; white-space: nowrap; font-weight: 600; }
.n-time-head .n-time-week { font-weight: 400; opacity: .7; }
.n-time-now { position: absolute; top: 0; bottom: 0; width: 1px; background: rgb(205, 60, 58); pointer-events: none; }
.n-time-row { position: relative; height: 34px; border-bottom: 1px solid rgb(var(--n-rgb) / .05); }
.n-time-bar { position: absolute; top: 5px; height: 24px; display: flex; align-items: center; padding: 0 8px; min-width: fit-content; background: var(--card); border: 1px solid var(--line-10); border-radius: 5px; box-shadow: 0 1px 2px rgba(15, 15, 15, .08); font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none; }
.n-time-rest { margin-top: 10px; font-size: 14px; }
.n-time-rest a { display: block; padding: 3px 2px; }
.n-list-rows { display: flex; flex-direction: column; }
.n-list-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 34px; padding: 3px 4px; border-bottom: 1px solid rgb(var(--n-rgb) / .06); border-radius: 4px; }
.n-list-row:hover { background: var(--hover); }
.n-list-props { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 8px; font-size: 12px; color: var(--ink-60); }
.n-head-btn { display: inline-flex; align-items: center; gap: 5px; padding: 4px 8px; background: transparent; border: 0; border-radius: 5px; color: var(--ink-60); font-size: 13px; cursor: pointer; }
.n-head-btn:hover { background: var(--hover); }
.n-head-btn[aria-pressed="true"] { color: var(--ink); box-shadow: inset 0 -2px 0 var(--ink); border-radius: 5px 5px 0 0; }
.n-layouts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-bottom: 8px; }
.n-layout { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 8px 4px; background: transparent; border: 1px solid var(--line-10); border-radius: 6px; color: var(--ink); font-size: 12px; cursor: pointer; }
.n-layout:hover { background: var(--hover); }
.n-layout[aria-pressed="true"] { border-color: var(--blue); color: var(--blue); }
.n-menu.n-panel { position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0; left: auto !important; width: 290px; max-width: 100vw; max-height: none !important; height: 100dvh; overflow-y: auto; padding: 14px; border-radius: 0; box-shadow: -4px 0 18px rgba(15, 15, 15, .1); }
.n-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.n-chip { padding: 2px 8px; background: rgb(var(--n-rgb) / .06); border: 0; border-radius: 12px; font-size: 12px; cursor: pointer; }
.n-chip[aria-pressed="true"] { background: rgba(35, 131, 226, .14); color: var(--blue); }

.n-cal-head { display: flex; align-items: center; gap: 4px; min-height: 32px; margin-bottom: 4px; }
.n-cal-head strong { font-family: var(--titles); font-size: 15px; font-weight: 800; }
.n-cal-head strong::first-letter { text-transform: uppercase; }
.n-calendar { display: grid; grid-template-columns: repeat(7, minmax(90px, 1fr)); min-width: 640px; border-top: 1px solid var(--line-10); border-left: 1px solid var(--line-10); }
.n-cal-name { padding: 4px 8px; font-size: 12px; color: var(--ink-60); border-right: 1px solid var(--line-10); border-bottom: 1px solid var(--line-10); }
.n-cal-day { min-width: 0; min-height: 96px; padding: 4px; border-right: 1px solid var(--line-10); border-bottom: 1px solid var(--line-10); }
.n-cal-day.out { background: rgb(var(--n-rgb) / .03); color: var(--ink-60); }
.n-cal-num { display: flex; align-items: center; justify-content: space-between; min-height: 24px; font-size: 12px; }
.n-cal-num .n-ic { width: 22px; height: 22px; opacity: 0; }
.n-cal-day:hover .n-cal-num .n-ic, .n-cal-num .n-ic:focus-visible { opacity: 1; }
.n-cal-day.now .n-cal-num span { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px; background: rgb(205, 60, 58); border-radius: 50%; color: #fff; font-weight: 600; }
.n-cal-chip { display: flex; align-items: center; gap: 4px; margin-top: 3px; padding: 3px 6px; background: var(--card); border: 1px solid var(--line-10); border-radius: 5px; box-shadow: 0 1px 2px rgba(15, 15, 15, .08); font-size: 12px; font-weight: 500; text-decoration: none; overflow: hidden; }
.n-cal-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Rédaction */
.n-mention { padding: 0 2px; border-radius: 3px; color: var(--ink-60); }
.n-mention a { display: inline-flex; align-items: center; gap: 3px; text-decoration: underline; text-decoration-color: rgb(var(--n-rgb) / .3); }
.n-sketch { display: grid; gap: 12px; margin-top: 28px; }
.n-sketch span { display: block; height: 12px; border-radius: 6px; background: var(--hover); animation: n-sketch 1s ease-in-out infinite alternate; }
.n-sketch span:nth-child(2) { width: 80%; }
.n-sketch span:nth-child(3) { width: 55%; }
@keyframes n-sketch { to { opacity: .45; } }
@media (prefers-reduced-motion: reduce) { .n-sketch span { animation: none; } }
.n-look { display: flex; gap: 2px; min-height: 28px; margin: -4px 0 6px; opacity: 0; transition: opacity .12s; }
.n-page:hover .n-look, .n-look:focus-within { opacity: 1; }
.n-look-btn { display: inline-flex; align-items: center; gap: 5px; padding: 3px 7px; background: transparent; border: 0; border-radius: 5px; color: var(--ink-45, rgb(var(--n-rgb) / .5)); font-size: 13px; cursor: pointer; }
.n-look-btn:hover { background: var(--hover); }
.n-b .n-heading_4 { font-size: 17px; font-weight: 800; line-height: 1.3; margin-top: 12px; }
.n-unsupported { margin: 2px 0; }
.n-embed { margin: 6px 0; }
.n-embed iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: 6px; background: rgb(var(--n-rgb) / .05); }
.n-attach { display: flex; align-items: center; gap: 6px; }
.n-swatch { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border: 1px solid var(--line-10); border-radius: 4px; font-weight: 600; }
.n-color-gray { color: rgb(120, 119, 116); } .n-color-brown { color: rgb(159, 107, 83); } .n-color-orange { color: rgb(217, 115, 13); } .n-color-yellow { color: rgb(203, 145, 47); } .n-color-green { color: rgb(68, 131, 97); } .n-color-blue { color: rgb(51, 126, 169); } .n-color-purple { color: rgb(144, 101, 176); } .n-color-pink { color: rgb(193, 76, 138); } .n-color-red { color: rgb(212, 76, 71); }
.n-color-gray_background { background: rgb(241, 241, 239); } .n-color-brown_background { background: rgb(244, 238, 238); } .n-color-orange_background { background: rgb(251, 236, 221); } .n-color-yellow_background { background: rgb(251, 243, 219); } .n-color-green_background { background: rgb(237, 243, 236); } .n-color-blue_background { background: rgb(231, 243, 248); } .n-color-purple_background { background: rgb(244, 240, 247); } .n-color-pink_background { background: rgb(249, 238, 243); } .n-color-red_background { background: rgb(253, 235, 236); }

/* Les visages de l'équipe */
.face .n-avatar, .s-face .n-avatar, .person-head .n-avatar { display: inline-flex; align-items: center; justify-content: center; object-fit: cover; }
.faces { display: flex; gap: 8px; }
.face { position: relative; display: block; text-decoration: none; transition: transform .12s; }
.face:hover { transform: translateY(-2px); }
.face .n-avatar { width: 44px; height: 44px; font-size: 16px; border-radius: 50%; }
.face-count { position: absolute; right: -4px; bottom: -4px; min-width: 18px; height: 18px; padding: 0 4px; background: #111110; color: #fff; border-radius: 9px; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; }
.person-head .n-avatar { width: 88px; height: 88px; font-size: 32px; border-radius: 50%; }

/* L'équipe dans la barre latérale : les photos, pas les noms */
.s-faces { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px; }
.s-face { display: block; border-radius: 50%; text-decoration: none; opacity: .92; }
.s-face:hover { opacity: 1; }
.s-face.on { box-shadow: 0 0 0 2px #111110; }
.s-face .n-avatar { width: 32px; height: 32px; font-size: 13px; border-radius: 50%; }
@media (max-width: 900px) {
}

@media (max-width: 768px) {
  body.notion .shell { margin-left: 0; }
  .side { transform: translateX(-100%); transition: transform .16s; width: min(300px, 86vw); }
  body.side-phone .side { transform: none; box-shadow: rgba(0, 0, 0, .2) 8px 0 24px -6px; }
  .s-resize { display: none; }
  .n-body, .n-narrow .n-body, .n-peek-body .n-narrow .n-body { padding: 0 16px; }
  .n-body > h1 { font-size: 30px; }
  .n-pageicon { width: 56px; height: 56px; margin-top: -28px; font-size: 48px; line-height: 56px; }
  .n-edited, .n-live { display: none; }
  .n-view-tools { margin-left: 0; width: 100%; }
  .peek { width: 100vw; min-width: 0; }
  body.notion .main:not(.notion) { padding: 20px 16px 200px; }
  .n-menu { position: fixed; left: 8px !important; right: 8px; top: auto !important; bottom: 8px; width: auto; max-width: none; max-height: 60vh; }
  .n-many > button.n-cellbtn { opacity: 1; }
  .n-prop { grid-template-columns: 120px minmax(0, 1fr); }
  .n-page .scroll { margin-left: 0; padding-left: 0; }
  button.n-row-menu { display: none; }
  button.n-b-menu { left: -14px; width: 14px; opacity: .5; }
  button.n-b-add { display: none; }
  li.n-b > button.n-b-menu { left: -34px; }
}
.n-type-url .n-link-cell { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Chiffrage et jauge du commercial */
.n-amount button { border: 0; background: none; padding: 2px 4px; font: inherit; color: inherit; cursor: pointer; border-radius: 4px; width: 100%; text-align: right; }
.n-amount button:hover { background: rgb(var(--n-rgb) / .08); }
.n-amount-set { font-weight: 600; font-variant-numeric: tabular-nums; }
.n-amount-none { color: var(--ink-60); }
.n-amount input { width: 100%; font: inherit; padding: 2px 4px; text-align: right; border: 1px solid var(--line-10); border-radius: 4px; }
.n-group-total { margin-left: 8px; font-weight: 700; font-variant-numeric: tabular-nums; }
.n-banner.flat { height: auto; min-height: 0; padding: 12px 18px; margin-top: 28px; border-radius: 12px; display: block; text-align: left; background: var(--green); color: var(--ink); font: 800 clamp(20px, 3vw, 28px)/1.15 var(--titles); letter-spacing: -.01em; }
.n-banner.flat.alt { background: var(--ink); color: var(--paper); }
.pipe-gauge { margin-top: 20px; padding: 20px; border-radius: var(--r-card-sm); background: var(--soft); display: grid; gap: 14px; }
.pipe-top { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.pipe-big { font: 900 clamp(34px, 6vw, 54px)/1 var(--titles); letter-spacing: -.02em; }
.pipe-left { text-align: right; }
.pipe-left strong { font: 800 24px var(--titles); }
.pipe-bar { display: flex; gap: 2px; height: 22px; border-radius: 11px; overflow: hidden; background: var(--ph); }
.pipe-seg { display: block; height: 100%; transform-origin: left; animation: pipe-grow 1s cubic-bezier(.2, .8, .2, 1) both; }
.pipe-seg.signed, .pipe-chip.signed { background: var(--green); }
.pipe-seg.near, .pipe-chip.near { background: var(--ink); }
.pipe-keys { display: flex; flex-wrap: wrap; gap: 8px 24px; font-size: 13px; color: var(--ink-60); }
.pipe-key strong { display: block; font: 800 18px var(--titles); color: var(--ink); }
.pipe-chip { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 6px; }
.pipe-warn { display: flex; gap: 8px; align-items: center; font-weight: 600; font-size: 14px; }
@keyframes pipe-grow { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .pipe-seg { animation: none; } }
/* Tableaux de personne */
.person-board { margin-top: 12px; }
.person-board .n-card { margin-bottom: 8px; }
.person-board .n-card-cover { max-height: 110px; }
.n-page.person-page { max-width: none; }
.n-page.person-page > * { max-width: none; }