:root { --texte: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --encre:#253748; --encre-2:#52616c; --encre-3:#65737c; --or-3:#826329; --parchemin:#faf7ef; --parchemin-2:#eee9dc; --parchemin-3:#d8d2c2; }
body { background:#0b1c2c; font-size:18px; }
.page {max-width:1440px; padding:32px 42px; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:64px; align-items:start;}
.entete {position:sticky;top:32px;height:calc(100vh - 64px);min-height:620px;padding:40px 28px;display:flex;align-items:center;flex-direction:column;border:1px solid #bb9d6055;border-radius:240px 240px 12px 12px;overflow:hidden;background:linear-gradient(180deg,#08182a99 0%,#08182a55 33%,transparent 70%,#08182a99),url('/cour-noel.jpg') center center/cover;}
.entete::after {content:'';position:absolute;inset:9px;border:1px solid #c7ac7455;border-radius:inherit;pointer-events:none;}
.crest {width:72px;height:72px;flex-shrink:0;filter:none;margin:0 0 22px;overflow:visible;}
.eyebrow {font-family:var(--texte);font-size:11px;line-height:1.6;letter-spacing:.22em;color:#efdfb9;max-width:300px;margin:0 0 20px;}
h1.titre {font-family:Georgia,'Times New Roman',serif;font-weight:400;text-transform:none;font-size:clamp(40px,4.4vw,64px);letter-spacing:-.035em;line-height:1.05;max-width:420px;text-shadow:0 2px 30px #071626;}
.sous-titre-nuit {font-family:Georgia,serif;font-size:20px;max-width:300px;margin:20px auto 0;line-height:1.4;color:#fff7e5;text-shadow:0 1px 10px #071626;}
#app {min-width:0;padding-top:36px;outline:none;}
.parchemin, .parchemin.arche {background:#faf7ef;border-radius:10px;padding:34px 28px;border:1px solid #d5c299;box-shadow:0 12px 45px #0002;}
.parchemin::before {inset:7px;border-color:#bda47044;border-radius:5px;}
.parchemin.arche {padding-top:40px;}
.parchemin.arche > .texte {padding:0;text-align:left;font-size:18px;line-height:1.65;}
.invitation-label {display:block;color:#826329;font-size:10px;letter-spacing:.2em;font-weight:700;margin-bottom:20px;}
.parchemin .welcome-title {font:400 clamp(32px,3vw,43px)/1.15 Georgia,serif;letter-spacing:-.04em;text-align:left;margin:0 0 24px;color:#183449;}
.how-it-works {display:flex;flex-wrap:wrap;gap:12px 20px;margin:24px 0;font-size:13px;color:#52616c;}
.how-it-works span {display:flex;align-items:center;gap:7px;}
.how-it-works b {border:1px solid #c7b786;border-radius:50%;width:24px;height:24px;display:grid;place-items:center;font:400 13px Georgia,serif;color:#826329;}
.note-or {background:#f0eadb;border:0;border-left:2px solid #aa8748;border-radius:0;padding:16px 18px;font-size:15px;line-height:1.65;margin:24px 0;}
.note-or b {font-size:11px;color:#70582c;}
.btn {font-family:var(--texte);font-size:17px;min-height:54px;border-radius:7px;line-height:1.4;}
.btn.or {background:#193e46;color:#fffaf0;border:1px solid #193e46;box-shadow:0 4px 10px #15373d18;text-shadow:none;}
.btn.or:hover {background:#24545c;}
.btn.second {background:transparent;border:1px solid #bfb9a9;box-shadow:none;color:#304754;}
.btn.second:hover {background:#ebe6da;}
.btn:disabled {opacity:.6;}
.actions {gap:12px;}
.parchemin h2 {font:400 clamp(26px,2.6vw,34px)/1.2 Georgia,serif;letter-spacing:-.025em;}
.consigne {font-size:17px;line-height:1.55;margin-bottom:22px;}
.champ label, .champ .lab {font-family:var(--texte);font-size:16px;letter-spacing:0;text-transform:none;font-weight:600;}
.champ input[type=text], .champ textarea {font:400 18px/1.5 var(--texte);border-width:1px;border-radius:7px;background:#fffefa;}
.stepper {border-width:1px;border-radius:8px;}
.stepper output {font-family:var(--texte);font-size:24px;}
.stepper-ligne .personnes-txt {font-size:16px;}
.progres {font-size:13px;color:#e7ddc9;letter-spacing:.015em;margin-bottom:10px;}
.progres-barre {height:3px;background:#69717d66;margin-bottom:24px;}
.progres-barre i {background:#c6a86c;}
.ornement {width:100px;margin:10px auto 20px;opacity:.8;}
.mois {margin-bottom:24px;}
.mois-titre {font-family:var(--texte);font-size:15px;text-transform:capitalize;letter-spacing:0;color:#334b55;margin:16px 0;}
.jours-grille,.sem-tete {gap:6px;}
.sem-tete {font-size:11px;margin-bottom:8px;color:#65737c;}
.jour-c {min-height:57px;border-radius:7px;border-width:1px;font-family:var(--texte);font-size:19px;background:#fffefa;}
.jour-c.hors {opacity:.65;font-size:15px;}
.jour-c.oui {background:#dbe9df;border:2px solid #367054;color:#205037;}
.jour-c.non {background:#f3e1dc;border:2px solid #aa5146;color:#85372f;}
.jour-c.peut {background:#faf3df;}
.jour-c .jc-ico {font-size:13px;margin-top:4px;}
.legende {font-size:13px;gap:12px;}
.legende span::before {height:12px;width:12px;border-width:1px;vertical-align:-1px;}
.compteur-jours {font-size:15px;}
.raccourcis .mini {font-size:13px;padding:8px 12px;border-width:1px;}
.nav-etape {position:sticky;bottom:0;z-index:3;background:#faf7eff5;padding:14px 0 8px;margin-top:22px;display:grid;grid-template-columns:auto 1fr;gap:12px;border-top:1px solid #e2dac6;}
.nav-etape .btn {font-size:15px;min-height:52px;}
.choix label {font:400 16px/1.4 var(--texte);padding:14px;border-width:1px;border-radius:7px;}
.choix input {width:22px;height:22px;}
.choix label:has(input:checked) {border-color:#37616a;background:#edf1eb;box-shadow:none;}
.recap {border-color:#d8cfb9;border-radius:7px;}
.recap .ligne {padding:16px 14px;}
.recap dt {font:600 12px/1.5 var(--texte);letter-spacing:0;text-transform:none;color:#697267;flex-basis:27%;}
.recap dd {font-size:16px;overflow-wrap:anywhere;}
.recap dd .modif {font-family:var(--texte);font-size:13px;min-height:44px;}
.attente {font-size:13px;line-height:1.6;font-style:normal;}
.podium {grid-template-columns:1fr;}
.podium-carte {border-radius:7px;border-color:#d5c8a9;}
.podium-carte.premier {background:#edf1e9;border-color:#739080;box-shadow:none;}
.p-date {font-family:Georgia,serif;}
.p-comptes {font-size:14px;line-height:1.6;}
.p-rang,h3.sous {font-family:var(--texte);font-size:12px;letter-spacing:.08em;}
.mots li,.detail-jour {font-size:15px;line-height:1.7;}
.bandeau {font-size:16px;line-height:1.6;}
.question-ia .q-texte {font-size:17px;}
footer {grid-column:2;font-size:13px;line-height:1.8;padding:4px 20px 12px;color:#c4cbd0;}
.share-link {border:0;border-bottom:1px solid #8f9d9d;background:none;color:#e4d5b3;font:inherit;margin-top:12px;min-height:44px;}
.skip-link {position:fixed;top:-100px;left:20px;z-index:99;padding:12px;background:#faf7ef;color:#142f43;}
.skip-link:focus {top:10px;}
.neige {opacity:.45;}
.voile .parchemin {max-height:90vh;overflow:auto;}
@media (min-width:1400px) {.page{padding-top:48px}.entete{top:48px;height:calc(100vh - 96px)}}
@media (max-width:1050px) {.page{padding:24px;gap:28px}.entete{top:24px;height:calc(100vh - 48px);padding:40px 20px}.parchemin,.parchemin.arche{padding:30px 22px}h1.titre{font-size:46px}.eyebrow{font-size:10px}.how-it-works{gap:10px;font-size:12px}.nav-etape .btn{padding:12px}.jours-grille,.sem-tete{gap:4px}}
@media (max-width:760px) {
.page{display:block;padding:0 14px 24px;max-width:600px;}
.entete{position:relative;top:0;min-height:0;height:390px;margin:0 -14px -24px;border-radius:0;border:0;padding:24px 24px 48px;background-position:center 47%;}
.entete::after{display:none}.crest{width:52px;height:52px;margin-bottom:14px}.eyebrow{font-size:9px;margin-bottom:12px}h1.titre{font-size:42px;max-width:350px}.sous-titre-nuit{font-size:17px;margin-top:12px;}
#app{padding:0;position:relative}.parchemin,.parchemin.arche{padding:30px 20px;border-radius:9px;}.parchemin .welcome-title{font-size:34px}.parchemin.arche>.texte{font-size:16px}.note-or{font-size:14px}.invitation-label{font-size:9px}.how-it-works{font-size:12px;justify-content:space-between;gap:6px}.how-it-works b{width:21px;height:21px}
body:not([data-screen=accueil]) .entete{height:180px;padding:26px 20px 36px;margin-bottom:0;background-position:center 43%;background-image:linear-gradient(#0b1c2ca6,#0b1c2cbb),url('/cour-noel.jpg');}
body:not([data-screen=accueil]) .crest{display:none}body:not([data-screen=accueil]) h1.titre{font-size:31px}body:not([data-screen=accueil]) .sous-titre-nuit{font-size:15px}
.progres{padding-top:12px}.progres-barre{margin-bottom:18px}.consigne{font-size:16px}.nav-etape{bottom:0;padding-bottom:max(10px,env(safe-area-inset-bottom));}.nav-etape .btn{font-size:14px}.jour-c{min-height:55px}.recap .ligne{display:block}.recap dt{margin-bottom:5px}.recap dd .modif{display:inline-block;margin-left:0}.legende{font-size:12px}footer{font-size:12px;padding:10px}.erreur{font-size:15px}.btn{font-size:16px}
}
@media (max-width:360px) {.page{padding-inline:10px}.entete{margin-inline:-10px}.parchemin,.parchemin.arche{padding:26px 14px}.jour-c{font-size:18px;min-height:52px}.how-it-works{font-size:10px}.nav-etape{gap:6px}.nav-etape .btn{padding:10px 8px;font-size:13px}}
@media (prefers-reduced-motion:reduce) {*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.persistent-actions{display:flex;justify-content:flex-end;margin:-22px 0 18px}.persistent-actions .share-link{font-size:13px;margin:0;line-height:1.5;text-align:right}
.acces-creation{border-top:1px solid #ddd2be;margin-top:28px;padding-top:24px}.acces-creation h3{font:400 23px Georgia,serif}.acces-creation .attente{text-align:left;margin-bottom:16px}.acces-lie{font-size:14px;line-height:1.6;padding:14px;background:#e8efe7;border-radius:8px}
.champ input[type=tel],.champ input[type=password]{display:block;width:100%;min-height:54px;border:1px solid #c7c2b6;border-radius:7px;background:#fffefa;padding:12px;font:18px/1.5 var(--texte);color:var(--encre)}
.preferences{border:1px solid #d8cfb9;border-radius:8px;padding:16px;margin:24px 0}.preferences legend{font-size:15px;font-weight:600;padding:0 6px}.preferences label{display:flex;align-items:center;gap:12px;min-height:48px;font-size:16px}.preferences input{width:22px;height:22px;accent-color:#285751}
.periode-calcul{border:1px solid #d6d0c1;padding:20px;border-radius:8px;margin:14px 0;background:#fffdf7}.periode-calcul h4{font:400 24px Georgia,serif;margin:0 0 8px}.date-calcul{font-size:15px;color:#52616c}.barre-calcul{display:flex;height:15px;overflow:hidden;border-radius:20px;margin:18px 0 12px;background:#ebe7dc}.barre-calcul .disponible{background:#35755d}.barre-calcul .incertain{background:#d9c79c}.barre-calcul .impossible{background:#b56052}.calcul-chiffres{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;line-height:1.6}.mini-detail{min-height:44px;border:0;border-bottom:1px solid #b1b8b0;background:transparent;color:#244c43;padding:4px 0;font:14px var(--texte);margin-top:9px}.periode-calcul .attente{text-align:left;margin-top:12px;font-size:12px}
.famille-dates{border:1px solid #d8cfb9;border-radius:8px;margin:12px 0;background:#fffdf7;overflow:hidden}.famille-dates summary{cursor:pointer;min-height:64px;padding:18px;font-size:17px;line-height:1.5}.famille-dates summary small{font-size:12px;color:#677168;margin-left:10px}.famille-dates p{font-size:14px;line-height:1.65;padding:0 18px;margin:0 0 14px;overflow-wrap:anywhere}.famille-dates .btn{margin:8px 18px 18px;font-size:13px}.liens #btn-retrouver{margin:12px 0}.liens #changer-personne{color:#586351;font-size:13px;display:block;margin:auto}
@media(max-width:760px){.persistent-actions{margin:16px 0}.persistent-actions .share-link{font-size:12px}.calcul-chiffres{gap:6px 10px}.periode-calcul{padding:17px}}
.explorer-dates{margin-top:22px;border-top:1px solid #d8cfb9}.explorer-dates>summary{font-size:16px;line-height:1.6;padding:16px 0;cursor:pointer;min-height:56px}.persistent-actions{flex-wrap:wrap}