/* Lueur — widget v1.3.1 (charte AIO : fond nuit, doré, Cormorant / Hanken Grotesk / Space Mono)
   Tout est préfixé .lueur-app pour ne rien toucher au reste de la page. */

/* ─── Polices auto-hébergées (licence SIL OFL) — plus aucun appel à Google Fonts (CDC MVP §10.3) ─── */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500 600;font-display:swap;src:url(fonts/cormorant-garamond.woff2) format("woff2")}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(fonts/cormorant-garamond-500-italic.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/hanken-grotesk.woff2) format("woff2")}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/space-mono-400.woff2) format("woff2")}

.lueur-app{
  --lu-bg:#100E09; --lu-panel:#171309; --lu-panel2:#1D1810; --lu-line:#2B2413;
  --lu-text:#EDE5D3; --lu-muted:#A2957C; --lu-gold:#C9A15C; --lu-gold-dim:#87724A;
  --lu-gold-hi:#F2D9A7; --lu-onaccent:#100E09; --lu-placeholder:#6E6350;
  --lu-encre:var(--lu-serif); --lu-encre-taille:18px;
  --lu-serif:"Cormorant Garamond",Georgia,serif;
  --lu-sans:"Hanken Grotesk","Helvetica Neue",Arial,sans-serif;
  --lu-mono:"Space Mono",ui-monospace,monospace;
  max-width:680px;margin:0 auto;background:var(--lu-bg);color:var(--lu-text);
  font-family:var(--lu-sans);font-size:16px;line-height:1.65;
  border:1px solid var(--lu-line);border-radius:10px;padding:26px 22px 18px;
  box-sizing:border-box;
}
.lueur-app *{box-sizing:border-box;margin:0}
/* Remise à zéro TOTALE des boutons : le thème du site ne peut plus les styler */
.lueur-app button{all:unset;box-sizing:border-box;cursor:pointer;display:inline-block;font-family:var(--lu-sans);font-size:15px;line-height:1.5;color:var(--lu-text);text-align:center;white-space:normal;-webkit-tap-highlight-color:transparent}
.lueur-app textarea,.lueur-app input{appearance:none;-webkit-appearance:none;box-shadow:none;text-transform:none}
.lueur-app p,.lueur-app h3{text-align:left;text-transform:none}
.lueur-app .lu-page-tete{display:block;width:100%;text-align:left}
.lueur-app button:focus-visible,.lueur-app textarea:focus-visible,.lueur-app input:focus-visible{outline:2px solid var(--lu-gold) !important;outline-offset:2px}
.lueur-app button:focus,.lueur-app button:active,.lueur-app button:hover{background-color:transparent !important;color:inherit !important;box-shadow:none !important;outline-color:var(--lu-gold) !important}
.lueur-app .lu-btn,.lueur-app .lu-btn:focus,.lueur-app .lu-btn:active,.lueur-app .lu-btn:hover{background-color:var(--lu-gold) !important;color:var(--lu-onaccent) !important}
.lueur-app ::selection{background:var(--lu-gold);color:var(--lu-onaccent)}

/* En-tête */
.lueur-app .lu-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.lueur-app .lu-titre{font-family:var(--lu-serif);font-weight:600;font-size:26px;letter-spacing:.02em}
.lueur-app .lu-flamme{width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 50% 40%, var(--lu-gold-hi), var(--lu-gold) 55%, transparent 75%);box-shadow:0 0 calc(6px + var(--lu-eclat,0px)) calc(1px + var(--lu-eclat,0px)) rgba(201,161,92,.55);flex:none;animation:lu-respire 4s ease-in-out infinite}
@keyframes lu-respire{0%,100%{transform:scale(1)}50%{transform:scale(1.15)}}
@media (prefers-reduced-motion:reduce){.lu-flamme{animation:none}}
.lueur-app .lu-pages-lien{margin-left:auto;background:none;border:1px solid var(--lu-line);border-radius:999px;color:var(--lu-muted);font-family:var(--lu-mono);font-size:11px;padding:5px 12px}
.lueur-app .lu-pages-lien:hover{color:var(--lu-gold);border-color:var(--lu-gold-dim)}

/* La question emportée la dernière fois */
.lueur-app .lu-hier{border-left:2px solid var(--lu-gold);background:var(--lu-panel);padding:10px 14px;margin-bottom:16px;font-size:14px;color:var(--lu-muted)}
.lueur-app .lu-hier b{display:block;font-family:var(--lu-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--lu-gold-dim);font-weight:400;margin-bottom:2px}
.lueur-app .lu-hier q{quotes:"« " " »";font-family:var(--lu-serif);font-style:italic;font-size:17px;color:var(--lu-text)}

/* Écriture */
.lueur-app .lu-invite{display:flex;align-items:baseline;gap:10px;margin-bottom:8px}
.lueur-app .lu-invite p{font-family:var(--lu-serif);font-style:italic;font-size:19px;color:var(--lu-text)}
.lueur-app .lu-invite button{background:none;border:none;color:var(--lu-muted);font-family:var(--lu-mono);font-size:11px;padding:2px 4px;flex:none}
.lueur-app .lu-invite button:hover{color:var(--lu-gold)}
.lueur-app textarea{width:100%;min-height:140px;resize:vertical;background:var(--lu-panel);border:1px solid var(--lu-line);border-radius:6px;color:var(--lu-text);font-family:var(--lu-serif);font-size:18px;line-height:1.6;padding:14px 16px}
.lueur-app textarea::placeholder{color:var(--lu-placeholder);font-style:italic}
.lueur-app .lu-sous{display:flex;align-items:center;gap:12px;margin-top:8px;flex-wrap:wrap}
.lueur-app .lu-compteur{font-family:var(--lu-mono);font-size:11px;color:var(--lu-muted)}
.lueur-app .lu-actions{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.lueur-app .lu-btn{background:var(--lu-gold);color:var(--lu-onaccent);border:none;border-radius:999px;font-weight:600;font-size:15px;padding:9px 20px}
.lueur-app .lu-btn:hover{filter:brightness(1.07)}
.lueur-app .lu-btn[disabled]{opacity:.45;cursor:default}
.lueur-app .lu-btn-doux{background:none;border:1px solid var(--lu-line);color:var(--lu-muted);border-radius:999px;font-size:13px;padding:8px 16px}
.lueur-app .lu-btn-doux:hover{color:var(--lu-gold);border-color:var(--lu-gold-dim)}

/* Attente */
.lueur-app .lu-attente{display:flex;align-items:center;gap:10px;color:var(--lu-muted);font-style:italic;margin-top:16px}
.lueur-app .lu-attente .lu-flamme{width:10px;height:10px}

/* Reflet */
.lueur-app .lu-reflet{margin-top:18px;border-top:1px solid var(--lu-line)}
.lueur-app .lu-bloc{padding:13px 0;border-bottom:1px solid var(--lu-line)}
.lueur-app .lu-bloc-lbl{font-family:var(--lu-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--lu-gold-dim);margin-bottom:4px}
.lueur-app .lu-bloc p{max-width:62ch}
.lueur-app .lu-bloc-question p{font-style:italic}
.lueur-app .lu-bloc-intention p,.lueur-app .lu-bloc-emporter p{font-family:var(--lu-serif);font-style:italic;font-size:20px;color:var(--lu-gold)}
.lueur-app .lu-repondre{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.lueur-app .lu-repondre textarea{min-height:70px;font-size:16px}
.lueur-app .lu-fin{color:var(--lu-muted);font-size:14px;font-style:italic;padding:12px 0}
.lueur-app .lu-msg{border-left:2px solid var(--lu-gold-dim);background:var(--lu-panel);padding:12px 14px;margin-top:14px;color:var(--lu-text);font-size:15px}

/* Journal */
.lueur-app .lu-journal h3{font-family:var(--lu-serif);font-weight:600;font-size:22px;margin-bottom:8px}
.lueur-app .lu-page-item{border:1px solid var(--lu-line);border-radius:6px;background:var(--lu-panel);margin-bottom:10px;padding:12px 14px}
.lueur-app .lu-page-date{display:block;font-family:var(--lu-mono);font-size:11px;color:var(--lu-gold);margin-bottom:4px}
.lueur-app .lu-page-extrait{display:block;color:var(--lu-muted);font-family:var(--lu-serif);font-style:italic;font-size:16px;text-transform:none;letter-spacing:normal;overflow-wrap:anywhere}
.lueur-app .lu-page-corps{margin-top:10px;display:none}
.lueur-app .lu-page-item.ouverte .lu-page-corps{display:block}
.lueur-app .lu-page-texte{font-family:var(--lu-serif);font-size:17px;white-space:pre-wrap;border-left:2px solid var(--lu-line);padding-left:12px;margin-bottom:8px}
.lueur-app .lu-page-outils{display:flex;gap:10px;margin-top:8px}
.lueur-app .lu-mini{background:none;border:none;color:var(--lu-muted);font-family:var(--lu-mono);font-size:11px;padding:2px 0;text-decoration:underline;text-underline-offset:3px}
.lueur-app .lu-mini:hover{color:var(--lu-gold)}
.lueur-app .lu-journal-outils{display:flex;gap:14px;margin:14px 0 4px;flex-wrap:wrap}
.lueur-app .lu-vide{color:var(--lu-muted);font-style:italic}

/* Consentement */
.lueur-app .lu-consent p{margin-bottom:12px;max-width:60ch}
.lueur-app .lu-consent .lu-titre{margin-bottom:10px;display:block}
.lueur-app .lu-consent-points{list-style:none;padding:0;margin:0 0 16px}
.lueur-app .lu-consent-points li{padding:7px 0 7px 22px;position:relative;color:var(--lu-muted)}
.lueur-app .lu-consent-points li::before{content:"";position:absolute;left:4px;top:16px;width:7px;height:7px;border-radius:50%;background:var(--lu-gold)}

/* Pied */
.lueur-app .lu-pied{margin-top:18px;border-top:1px solid var(--lu-line);padding-top:12px;font-size:12.5px;color:var(--lu-muted)}
.lueur-app .lu-pied p{max-width:66ch;margin-bottom:6px}
.lueur-app .lu-pied a{color:var(--lu-gold);text-decoration:underline;text-underline-offset:3px}

@media (max-width:480px){
  .lueur-app{padding:18px 14px 14px;border-radius:0;border-left:none;border-right:none}
  .lu-actions{margin-left:0}
}


/* ─── Couvertures — RÉSERVÉ, hors lancement (v1.3 ne pose plus data-theme ; conservé pour un futur « mon carnet ») ─── */
.lueur-app[data-theme="creme"]{--lu-bg:#F6F0E3;--lu-panel:#EFE7D4;--lu-panel2:#EAE0C9;--lu-line:#D9CCAF;
  --lu-text:#2E2718;--lu-muted:#6F6450;--lu-gold:#8A6B34;--lu-gold-dim:#9A8258;
  --lu-gold-hi:#C9A15C;--lu-onaccent:#F6F0E3;--lu-placeholder:#A79B82}
.lueur-app[data-theme="encre"]{--lu-bg:#0B1220;--lu-panel:#101A2E;--lu-panel2:#152238;--lu-line:#243352;
  --lu-text:#E4E9F2;--lu-muted:#93A0B8;--lu-gold:#9FB8DC;--lu-gold-dim:#647FA6;
  --lu-gold-hi:#D6E2F2;--lu-onaccent:#0B1220;--lu-placeholder:#5D6C87}
.lueur-app[data-theme="foret"]{--lu-bg:#0D140F;--lu-panel:#121B15;--lu-panel2:#17221B;--lu-line:#26382C;
  --lu-text:#E3EADF;--lu-muted:#93A38F;--lu-gold:#A8C686;--lu-gold-dim:#6E8A57;
  --lu-gold-hi:#D6E8BE;--lu-onaccent:#0D140F;--lu-placeholder:#5E7159}
.lueur-app[data-theme="lavande"]{--lu-bg:#171320;--lu-panel:#1D182A;--lu-panel2:#242038;--lu-line:#37304C;
  --lu-text:#EAE4F2;--lu-muted:#A79BBE;--lu-gold:#C4A7E7;--lu-gold-dim:#8D7BA8;
  --lu-gold-hi:#E7D9F7;--lu-onaccent:#171320;--lu-placeholder:#6C6186}

/* ─── Encres — RÉSERVÉ, hors lancement (v1.3 ne pose plus data-encre) ─── */
.lueur-app[data-encre="manuscrite"]{--lu-encre:"Caveat","Bradley Hand",cursive;--lu-encre-taille:23px}
.lueur-app[data-encre="simple"]{--lu-encre:var(--lu-sans);--lu-encre-taille:16.5px}
.lueur-app textarea,.lueur-app .lu-page-texte,.lueur-app .lu-moi{font-family:var(--lu-encre);font-size:var(--lu-encre-taille)}

/* ─── Matière — RÉSERVÉ, hors lancement ─── */
.lueur-app[data-grain="1"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.45 0 0 0 0 0.35 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ─── L'échange comme une page annotée ─── */
.lueur-app .lu-moi{white-space:pre-wrap;color:var(--lu-text);margin:14px 0 4px;max-width:64ch}
.lueur-app .lu-bloc{border:none;border-left:2px solid var(--lu-gold-dim);padding:6px 0 6px 14px;margin:12px 0}
.lueur-app .lu-reflet{border-top:none;margin-top:8px}
.lueur-app .lu-bloc p{color:var(--lu-muted)}
.lueur-app .lu-bloc-reflet p{color:var(--lu-text)}

/* ─── Répondre à Lueur : le bouton et « refermer ma page » sur une ligne, à gauche ─── */
.lueur-app .lu-repondre .lu-actions{margin-left:0;align-items:center;gap:14px}
.lueur-app .lu-btn-doux:hover,.lueur-app .lu-pages-lien:hover,.lueur-app .lu-mini:hover{color:var(--lu-gold) !important;border-color:var(--lu-gold-dim) !important}
