@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@600&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');
:root{--ink:#453c36;--muted:#94877b;--pink:#ac5c65;--line:#e5dfd5;--paper:#faf8f2}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:14px}button,input,textarea,select{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}h1,h2,h3{font-family:'Playfair Display',Georgia,serif;font-weight:400}header{height:94px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 6.5%}.brand{text-decoration:none;color:var(--ink);font-family:Georgia;font-size:32px;letter-spacing:-3px}.brand span{color:var(--pink);margin:0 5px}.brand small{font:12px 'DM Sans',sans-serif;letter-spacing:1px;margin-left:22px}.header-right{display:flex;align-items:center;gap:25px}.private{font-size:11px;color:#7c8876}.quiet{background:none;border:0;color:var(--muted);font-size:11px}.avatar{background:#eadcd7;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;color:#8d5558}main{max-width:1240px;padding:0 48px;margin:auto}.hero{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;padding:64px 0 58px;gap:60px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2.1px;color:var(--muted)}h1{font-size:72px;letter-spacing:-2.7px;line-height:1.08;margin:22px 0}h1 em{color:var(--pink);font-weight:400}.hero-heart{display:inline-block;color:var(--pink);font-size:62px;transform:rotate(-12deg);margin-left:20px}.hero p{line-height:1.9;color:var(--muted);margin:24px 0}.primary{background:var(--pink);border:0;color:white;padding:15px 24px;border-radius:6px;font-size:12px;font-weight:500}.primary:hover{background:#924a53}.handwritten{font:italic 17px Georgia;color:#a08b75;margin-left:20px;display:inline-block;transform:rotate(-7deg)}.hero-art{position:relative;padding:17px 36px 30px}.birthday{background:#eee2d6;transform:rotate(5deg);padding:35px 25px 30px;text-align:center;box-shadow:5px 9px 0 #ede8df}.birthday>span{font-size:9px;letter-spacing:3px;color:#957c66}.birthday strong{font:90px/.85 'Playfair Display',Georgia;display:block;margin:27px 0 23px;color:#856553}.birthday em{font-size:39px;font-weight:400}.birthday p{font:italic 18px/1.5 Georgia;color:#8b7162;margin:20px 0}.birthday b{font-size:11px;font-weight:500;color:#916862}.tape{position:absolute;width:98px;height:29px;background:#d3c7a890;top:7px;left:40%;transform:rotate(-5deg);z-index:1}.art-star{position:absolute;right:2px;top:22px;font-size:67px;color:#b17c61}.art-caption{display:block;text-align:center;font:italic 14px Georgia;color:#9b8977;margin-top:30px;transform:rotate(-4deg)}.tabs{display:flex;gap:40px;border-bottom:1px solid var(--line)}.tabs button{background:none;border:0;padding:20px 0;color:var(--muted);font-size:12px;border-bottom:2px solid transparent}.tabs button.active{border-color:var(--pink);color:var(--pink)}.tabs span{margin-left:12px}.content-heading{display:flex;align-items:center;justify-content:space-between;margin:39px 0 25px}h2{font-size:29px;margin:10px 0}.outline{background:none;border:1px solid #d7cdc2;border-radius:5px;padding:12px 18px;color:var(--ink);font-size:11px}.board{display:grid;grid-template-columns:1fr 255px;gap:32px}.posts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:start}.post{padding:23px;border:1px solid var(--line);background:#fffdf9;border-radius:4px;position:relative}.post.note{background:#f3edcc;border-color:#e8dfb7;transform:rotate(-1deg);box-shadow:2px 4px 8px #453c3609}.post.note:nth-child(3n){background:#f0dedd;transform:rotate(1deg)}.post-top{display:flex;justify-content:space-between;gap:12px;color:#9c8c70;font-size:8px;letter-spacing:1px}.post-top small{letter-spacing:0;font-size:9px}.post h3{font-size:23px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere;margin:23px 0}.post.note h3{font-style:italic}.post>p{color:var(--muted);font-size:12px;line-height:1.7;white-space:pre-wrap}.post-actions{display:flex;align-items:center;gap:18px;border-top:1px solid #cfc6af66;padding-top:14px;margin-top:22px;font-size:10px;color:var(--muted)}.like{background:none;border:0;color:#9b8270;font-size:15px;padding:0}.liked{color:var(--pink)}.comment-form{display:flex;margin-top:14px;border-bottom:1px solid #ccc2b477}.comment-form input{width:100%;background:none;border:0;font-size:10px;padding:10px 0;outline:none}.comment-form button{background:none;border:0;color:var(--pink)}.comments p{font-size:11px;line-height:1.6;overflow-wrap:anywhere;white-space:pre-wrap}.comments b{color:var(--pink);margin-right:5px}.film-art{background:#e2e7df;height:92px;margin-top:20px;display:flex;align-items:center;justify-content:space-around;color:#6e806e;font-size:30px}.film-art span{font:italic 20px Georgia;text-align:center}.aside-note{padding:30px 24px;background:#eee9e2;border-radius:65px 65px 4px 4px;text-align:center}.aside-note .eyebrow{font-size:8px}.aside-note h3{font-size:26px;line-height:1.3}.aside-note p{font-size:12px;color:var(--muted);line-height:1.8}.mini-heart{font-size:35px;color:var(--pink)}.together{text-align:center;padding:24px}.together>span{font-size:32px;color:#a5926b}.together p{font:italic 15px/1.6 Georgia;color:var(--muted)}footer{border-top:1px solid var(--line);margin-top:55px;padding:25px 0;display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.login{min-height:100vh;display:grid;grid-template-columns:1.15fr 1fr;align-items:center;max-width:1100px;margin:auto;padding:60px;gap:80px}.login-art h1{font-size:62px}.login-art p{color:var(--muted);line-height:1.8}.draw-heart{font:140px Georgia;color:#b77c78;transform:rotate(-12deg);margin-left:60px}.login-card{padding:42px;background:#fffdf8;border:1px solid var(--line);border-radius:8px;box-shadow:0 20px 70px #59453408}.login-card h2{font-size:30px}.login-card>p{color:var(--muted);font-size:12px}.login-card small{display:block;text-align:center;color:var(--muted);font-size:10px;margin-top:24px}label{display:block;font-size:11px;margin:22px 0;color:#7f7168}label input,label select,label textarea{display:block;width:100%;border:1px solid var(--line);background:#faf8f2;border-radius:4px;padding:13px;margin-top:9px;color:var(--ink)}.login-card .primary{width:100%}dialog{border:1px solid var(--line);border-radius:9px;width:min(500px,90vw);padding:35px;background:var(--paper);color:var(--ink)}dialog::backdrop{background:#3c312b66;backdrop-filter:blur(5px)}textarea{min-height:110px;resize:vertical}.close{position:absolute;right:18px;top:12px;font-size:27px;background:none;border:0;color:var(--muted)}#login-error,#post-error{color:#a43d49}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--ink);color:white;padding:15px 24px;border-radius:5px;opacity:0;pointer-events:none;transition:opacity .2s}#toast.visible{opacity:1}.empty{grid-column:1/-1;text-align:center;padding:60px;color:var(--muted)}.empty>span{font-size:40px}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--pink);outline-offset:4px}@media(max-width:900px){main{padding:0 25px}.hero{gap:20px}h1{font-size:55px}.handwritten{display:none}.board{grid-template-columns:1fr}aside{display:none}.login{padding:35px;gap:30px}.login-art h1{font-size:46px}}@media(max-width:600px){header{height:72px;padding:0 22px}.brand small{display:none}.private{display:none}.header-right{gap:15px}.hero{grid-template-columns:1fr;padding:40px 0 25px}.hero h1{font-size:58px}.hero-art{max-width:330px;margin:auto;width:100%;padding-top:25px}.birthday{padding:25px}.birthday strong{font-size:70px}.hero p br{display:none}.tabs{gap:0;justify-content:space-between}.tabs button{font-size:10px}.tabs span{display:none}.content-heading{gap:15px}h2{font-size:24px}.content-heading .eyebrow{font-size:8px}.outline{padding:10px;font-size:10px}.posts{grid-template-columns:1fr}.login{display:block;padding:30px 22px}.login-art h1{font-size:40px}.login-art .draw-heart,.login-art>p{display:none}.login-card{padding:26px;margin-top:30px}footer{gap:20px;line-height:1.6}}
/* Nos nouvelles petites habitudes */
.tabs{gap:24px;overflow-x:auto}.tabs button{white-space:nowrap}.avatar{border:0;padding:0;overflow:hidden;flex-shrink:0}.avatar img{width:100%;height:100%;object-fit:cover}.post-top small{display:flex;align-items:center;gap:5px}.author-avatar{height:19px;width:19px;border-radius:50%;object-fit:cover}.post-image{width:100%;max-height:260px;object-fit:contain;display:block;background:#eee9e2;border-radius:4px;margin-top:18px}.recipe-art{background:#efe3d3;color:#a37f51}.image-preview{display:block;max-width:100%;max-height:160px;object-fit:contain;margin-top:12px;border-radius:5px}label small{display:block;margin-top:8px;font-size:10px;color:var(--muted)}dialog{max-height:90vh;overflow-y:auto}hr{border:0;border-top:1px solid var(--line);margin:25px 0}.checkbox{display:flex;align-items:center;gap:10px}.checkbox input{width:auto;margin:0}.calendar-toolbar{display:flex;align-items:center;gap:16px;margin-bottom:25px}.calendar-toolbar h2{flex:1;text-transform:capitalize;text-align:center}.calendar-week,#calendar-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}.calendar-week{color:var(--muted);font-size:11px;text-align:center;margin-bottom:12px}#calendar-grid{gap:6px}.calendar-day{min-height:110px;text-align:left;border:1px solid var(--line);border-radius:5px;background:#fffdf9;padding:10px;color:var(--ink);overflow:hidden}.calendar-day:hover{background:#f3e8e3}.calendar-day b{display:block;font-size:12px;font-weight:500;margin-bottom:8px}.calendar-day.is-today{border:2px solid var(--pink);background:#f8efec}.event-chip{display:block;font-size:10px;line-height:1.5;background:#e1e7dc;padding:4px;border-radius:3px;margin-top:4px;overflow:hidden;text-overflow:ellipsis}.event-chip.kind-birthday{background:#eed7d8}.event-chip.kind-other{background:#efe6c7}#event-list{margin-top:30px}#event-list h3{font-size:25px}.event-row{display:flex;align-items:center;gap:22px;padding:16px 0;border-bottom:1px solid var(--line)}.event-row>span{color:var(--pink);min-width:90px;font-size:12px}.event-row>div{flex:1}.event-row b{font-weight:500}.event-row small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.calendar-empty{color:var(--muted);line-height:1.8}#avatar-error,#password-error,#event-error{color:#a43d49;font-size:12px}@media(max-width:600px){.tabs{gap:23px;justify-content:flex-start}.calendar-day{min-height:78px;padding:5px}.event-chip{font-size:8px;padding:2px}#calendar-grid{gap:3px}.calendar-toolbar{gap:8px}.calendar-toolbar h2{font-size:21px}.calendar-toolbar .outline{padding:10px}.event-row{gap:10px}.event-row>span{min-width:65px;font-size:10px}.event-row b{font-size:12px}}

.calendar-day{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start}

.countdown{padding:20px 0;text-align:center}.countdown .countdown-title{font:italic 19px Georgia;color:var(--pink);margin:0 0 15px}.countdown-digits{display:flex;align-items:flex-start;justify-content:center;gap:11px}.countdown-digits>div{min-width:50px}.countdown-digits strong{font:32px 'Playfair Display',Georgia;color:var(--ink);font-variant-numeric:tabular-nums}.countdown-digits small{display:block;margin-top:5px;font-size:9px;letter-spacing:1px;color:var(--muted)}.countdown-digits i{font:24px Georgia;color:#baa392;margin-top:3px}.countdown-caption{display:block;margin-top:17px;color:var(--muted);font-size:9px;line-height:1.7}.hero-art .countdown{margin-top:25px;border-top:1px solid var(--line)}.login-art .draw-heart{font-size:95px;line-height:1}.login-art .countdown{text-align:left}.login-art .countdown-digits{justify-content:flex-start}@media(max-width:600px){.countdown-digits{gap:8px}.countdown-digits strong{font-size:29px}.countdown-digits>div{min-width:43px}.login-art .countdown{padding-bottom:5px}}
.waiting-page{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:55px 24px;max-width:900px}.waiting-page h1{font-size:64px;margin:15px 0 24px}.waiting-heart{font:90px/1 Georgia;color:var(--pink);transform:rotate(-12deg);margin-top:24px}.waiting-page>p{color:var(--muted);line-height:1.9}.waiting-page .countdown{margin-top:12px;width:min(100%,430px);padding:28px 22px;background:#eee2d64d;border:1px solid var(--line);border-radius:10px}.waiting-page .countdown-digits strong{font-size:40px}.waiting-page .waiting-signature{font:italic 18px Georgia;color:var(--pink);margin-top:30px}@media(max-width:600px){.waiting-page h1{font-size:44px}.waiting-page .countdown-digits strong{font-size:34px}}

.surprise-word{position:relative;display:inline-block}.surprise-note{position:absolute;left:calc(100% + 10px);top:-12px;white-space:nowrap;font:600 34px/1.1 'Caveat','Segoe Print','Comic Sans MS',cursive;letter-spacing:0;color:var(--pink);transform:rotate(-11deg)}.surprise-note::after{content:'';display:block;border-bottom:2px solid currentColor;border-radius:50%;margin-top:3px;transform:rotate(-4deg)}@media(max-width:700px){.surprise-note{left:auto;right:-12px;top:-24px;font-size:28px}.waiting-page h1{line-height:1.25}}
.preview-banner{background:#f3edcc;border-bottom:1px solid #e8dfb7;color:#7f6750;text-align:center;padding:10px 18px;font-size:11px;line-height:1.6}

/* Une collection de seize couleurs, stable pour chaque publication. */
.card-color-0{--card-bg:#faedac}
.card-color-1{--card-bg:#f5cbd7}
.card-color-2{--card-bg:#cce8f9}
.card-color-3{--card-bg:#ccebd4}
.card-color-4{--card-bg:#e1d5f5}
.card-color-5{--card-bg:#f8d5b8}
.card-color-6{--card-bg:#f5c6bf}
.card-color-7{--card-bg:#c5eeeb}
.card-color-8{--card-bg:#e5eeab}
.card-color-9{--card-bg:#d2daf7}
.card-color-10{--card-bg:#f1cde9}
.card-color-11{--card-bg:#f7e0b0}
.card-color-12{--card-bg:#dbe9c1}
.card-color-13{--card-bg:#eee0c5}
.card-color-14{--card-bg:#ead2ed}
.card-color-15{--card-bg:#c9e1ed}
.posts .post[class*="card-color-"]{background:var(--card-bg);border-color:#453c3620}.posts .post>p,.posts .post .post-top,.posts .post .post-actions{color:#706358}.posts .post .comment-form input::placeholder{color:#786b61}.posts .post .film-art{background:#ffffff55}.posts .post.note:nth-child(2n){transform:rotate(1deg)}

.item-menu{position:relative;flex-shrink:0}.item-menu summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:30px;height:25px;border-radius:8px;font-size:22px;line-height:1;color:#75665f;letter-spacing:2px}.item-menu summary::-webkit-details-marker{display:none}.item-menu summary:hover,.item-menu[open] summary{background:#ffffff80}.item-menu summary:focus-visible{outline:2px solid var(--pink)}.menu-panel{position:absolute;right:0;top:30px;z-index:5;background:#fffdf9;min-width:155px;padding:6px;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 35px #453c3624;letter-spacing:0}.menu-panel button{display:block;width:100%;text-align:left;border:0;background:none;border-radius:7px;padding:11px 13px;font-size:12px;color:var(--ink)}.menu-panel button:hover{background:#f2eee7}.menu-panel button.danger{color:#ad4658}.post:has(.item-menu[open]){z-index:10}.post-top{align-items:center}.post-top>small{margin-left:auto}.comment-row{display:flex;align-items:flex-start;gap:8px}.comment-row>p{flex:1;min-width:0}.comment-row .item-menu{margin-top:7px}.edited-label{font:9px 'DM Sans',sans-serif;color:#807367}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:28px}.delete-button{background:#ad4658;border:0;border-radius:6px;padding:13px 22px;color:white;font-size:12px}#delete-description{color:var(--muted);line-height:1.8}#delete-error,#comment-edit-error{color:#a43d49;font-size:12px}

.notification-help{font-size:11px;color:var(--muted);line-height:1.7}#notifications-error{color:#a43d49;font-size:12px}
:root{--birthday-cream:#fff9f0}
body.birthday-celebrating{overflow:hidden}
dialog.birthday-welcome{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:24px;border:0;border-radius:0;background:radial-gradient(ellipse at 20% 20%,#f4ddd9 0,transparent 55%),radial-gradient(ellipse at 85% 75%,#eee3ce 0,transparent 55%),var(--birthday-cream);overflow:auto;color:var(--ink)}
.birthday-welcome::backdrop{background:#fff9f0}
.birthday-letter{position:relative;z-index:1;min-height:calc(100dvh - 48px);max-width:900px;margin:auto;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:35px 0;animation:birthday-letter-in 1.4s ease both}
.birthday-letter .eyebrow{letter-spacing:3px;font-size:10px}
.birthday-big-heart{font:85px/1 Georgia;color:var(--pink);margin:24px 0 12px;animation:birthday-heart 3s ease-in-out 3}
.birthday-letter h1{font-size:clamp(40px,6.7vw,88px);line-height:1.12;margin:8px 0 26px;font-weight:400}
.birthday-letter h1 em{color:var(--pink)}
.birthday-letter p{font-size:clamp(16px,2vw,21px);line-height:1.9;max-width:620px;margin:0;animation:birthday-letter-in 1.4s .45s ease both}
.birthday-signature{font:30px 'Caveat',cursive;color:var(--pink);margin:26px 0 34px;transform:rotate(-4deg)}
.birthday-letter button{animation:birthday-letter-in 1.4s .9s ease both}
.birthday-sparkles{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.birthday-particle{position:absolute;left:var(--x);top:-45px;width:9px;height:15px;border-radius:2px;background:var(--color);animation:birthday-fall var(--duration) var(--delay) ease-in both}
.birthday-particle-heart{width:auto;height:auto;background:none;font:30px Georgia;color:var(--color)}
@keyframes birthday-fall{0%{transform:translateY(-40px) rotate(0);opacity:0}10%{opacity:.8}90%{opacity:.7}100%{transform:translate(var(--drift),110dvh) rotate(var(--turn));opacity:0}}
@keyframes birthday-letter-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@keyframes birthday-heart{0%,100%{transform:scale(1) rotate(-8deg)}50%{transform:scale(1.12) rotate(5deg)}}
@media(prefers-reduced-motion:reduce){.birthday-letter,.birthday-letter p,.birthday-letter button,.birthday-big-heart{animation:none}.birthday-particle{display:none}}
