/* Pure design system — shared by public, member and staff screens. */
/* Les alias --c-* ne servent pas cette feuille : ils nourrissent la couche
   héritée importée dans main.bundle.css (_base, _components, _layout, _fx,
   _theme-compat). Sans leur redéclaration ici, le fond des pages retombe sur
   la pierre ancienne #050307 au lieu de --pure-bg. --c-bg-soft, lui, n'a
   aucun lecteur : il n'est pas redéclaré. */
:root{--pure-bg:#131211;--pure-surface:#1c1b19;--pure-surface-2:#242220;--pure-text:#e9e7e4;--pure-soft:#b7b2af;--pure-muted:#7d7a84;--pure-accent:#d9aa98;--pure-line:#ffffff0c;--font-head:var(--font-body);--c-bg:var(--pure-bg);--c-bg-alt:var(--pure-surface-2);--c-primary:var(--pure-accent);--c-accent:var(--pure-accent);--c-primary-soft:#d9aa980d;--c-primary-glow:#d9aa9812;--c-border:var(--pure-line);--c-text:var(--pure-text);--c-text-soft:var(--pure-soft);--c-muted:var(--pure-muted)}
html[data-theme="light"]{--pure-bg:#f6f5f2;--pure-surface:#fff;--pure-surface-2:#efeeeb;--pure-text:#2b2827;--pure-soft:#68635e;--pure-muted:#9a9490;--pure-accent:#bd8069;--pure-line:#2b221810;--c-bg:var(--pure-bg);--c-bg-alt:var(--pure-surface-2);--c-primary:var(--pure-accent);--c-accent:var(--pure-accent);--c-border:var(--pure-line);--c-text:var(--pure-text);--c-text-soft:var(--pure-soft);--c-muted:var(--pure-muted)}
html body{background:var(--pure-bg)!important;color:var(--pure-text);font-family:var(--font-body,sans-serif);line-height:1.65}.app-shell{background:var(--pure-bg)!important}.app-main{min-height:75dvh}.app-main :is(h1,h2,h3,h4){text-wrap:pretty}.app-main :is(h1,h2,h3,h4)::before,.app-main :is(h1,h2,h3,h4)::after{display:none!important}.app-main :is(h1,h2){font-family:var(--font-body);text-transform:none;transform:none;letter-spacing:-.04em}html:not([data-odb-stage="cinematic"]) .scroll-progress-bar{display:none!important}.app-main :is(.grad){background:none!important;-webkit-text-fill-color:currentColor!important;color:var(--pure-accent)!important;filter:none!important}
.app-main :where(input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=hidden]),select,textarea){border-radius:8px!important;border-color:var(--pure-line);box-shadow:none;accent-color:var(--pure-accent)}.app-main :is(input,select,textarea):focus-visible{outline:2px solid var(--pure-accent);outline-offset:2px}.app-main a{ text-underline-offset:4px}
/* Le pied de page a sa propre feuille (_footer.css, namespace .parvis) ; la
   coquille ne lui doit plus que sa largeur, alignée sur celle de .app-main. */
@media(max-width:700px){.app-main :is(input,select,textarea){font-size:19px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}/* Filet sans JS pour les familles de révélation pilotées par un moteur global
   (_fx.css, pages legacy). Le joker [class*="-reveal"] écrasait aussi les
   moteurs propres à chaque page (cn-, ld-, plea-, rg-) : liste explicite. */
.app-main :is(.fx-reveal){opacity:1!important;visibility:visible!important;transform:none!important;animation:none!important}.app-main :is(table){border-collapse:collapse;box-shadow:none!important}.app-main :is(th){font-size:12px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}.app-main :is(td){font-size:14px}.app-main :is(thead){background:var(--pure-bg)!important}

/* Comfortable reading scale: real layout sizing, never CSS zoom. */
:root{
  --pure-muted: #a69f9b;
  --pure-line: #ffffff12;
  --pure-glass: linear-gradient(145deg, #ffffff08, #ffffff01 55%), #1d1b19e8;
  --pure-glass-shadow: inset 0 1px 0 #ffffff08, 0 12px 36px #0000001c;
}
html[data-theme="light"]{
  --pure-muted: #7e7570;
  --pure-line: #2c242016;
  --pure-glass: linear-gradient(145deg, #ffffffc9, #ffffff8c), #f7f5f1e8;
  --pure-glass-shadow: inset 0 1px 0 #fff, 0 12px 36px #392e2808;
}
html body{
  background: radial-gradient(ellipse 700px 480px at 85% 0, #d9aa980a, transparent 75%), var(--pure-bg) !important;
  font-size: 16px;
}
.has-sidebar .app-shell{ background: transparent !important; }

/* Shared frosted surfaces, including previously unharmonized screens. */
.app-main :is(.ad-mcard,.success-card-box){
  background: var(--pure-glass) !important;
  border: 1px solid var(--pure-line) !important;
  box-shadow: var(--pure-glass-shadow) !important;
  border-radius: 14px !important;
  backdrop-filter: blur(16px) saturate(115%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(115%) !important;
}.app-main :is(input,textarea,select):focus-visible{
  outline: 2px solid var(--pure-accent);
  outline-offset: 3px;
  box-shadow: 0 0 20px #d9aa9814 !important;
}
/* Reading shells keep the same gutter as the recourse screens they replaced. */
.ad-shell{ max-width: 1280px; margin-inline: auto; padding-inline: clamp(22px,4vw,55px); }
.success-bg,.success-glow{ display: none !important; }
.success-wrap .success-card-box{ max-width: 620px; padding: clamp(28px,5vw,50px); }
.success-wrap h1{ font-size: 32px; font-weight: 500; letter-spacing: -1px; }
.success-wrap p{ font-size: 16px; color: var(--pure-soft); line-height: 1.9; }
.success-wrap :is(.btn-success,.btn-success-ghost){ border-radius: 9px; font-size: 14px; }
.success-wrap .btn-success{ background: var(--pure-accent); color: #281e1a; }@media(max-width:960px) {
  body.has-sidebar{ padding-top: 62px !important; }
}
@media(max-width:700px) {
  .ad-shell{ padding-inline: 22px; }
  .app-main :is(input,select,textarea){ font-size: 16px !important; }
}
@media(prefers-reduced-motion:reduce) {
  .app-main *{ transition: none !important; }
}
/* Neutralize legacy gradient text fills without leaving colored rectangles. */
html body .app-main :is(.grad){
  background: none !important;
  background-image: none !important;
  color: var(--pure-accent) !important;
  -webkit-text-fill-color: var(--pure-accent) !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  filter: none !important;
}
/* The fixed sidebar replaces the old top navbar: remove its reserved gap. */
body.has-sidebar .app-main{ padding-top: 24px !important; }
@media(max-width:700px) {
  body.has-sidebar .app-main{ padding-top: 8px !important; }
}
.app-main [class*="-reveal"]{ filter: none !important; }

/* Fluid page layout: every route uses the space beside the sidebar. */
body.has-sidebar .app-shell{
  width:100%; max-width:none!important; min-width:0; margin:0;
}
html body.has-sidebar .app-shell>.app-main{
  width:100%!important; max-width:none!important; min-width:0;
  margin-inline:0!important; padding-inline:0!important;
}
:root{ --page-gutter:clamp(24px,3.2vw,88px); }
html body .app-main :is(.ad-shell){
  box-sizing:border-box; width:100%!important; max-width:none!important;
  min-width:0; margin-inline:0!important; padding-inline:var(--page-gutter)!important;
}
html body .app-shell>.parvis>.parvis-shell{
  box-sizing:border-box; width:100%; max-width:none; padding-inline:var(--page-gutter);
}
@media(max-width:960px) { :root{ --page-gutter:24px; } }

/* Warm red / coral atmosphere across every page. */
html[data-theme="dark"]{
  --pure-bg:#19120f;
  --pure-surface:#241b17;
  --pure-surface-2:#2d201b;
  --pure-accent:#f09a86;
  --pure-text:#f4e9e5;
  --pure-soft:#cdb9b7;
  --pure-muted:#ac9295;
  --pure-line:#f4aaa219;
  --pure-glass:linear-gradient(145deg,#ffb8a30b,#ffffff02 60%),#291e19e6;
  --pure-glass-shadow:inset 0 1px 0 #ffd1c20b,0 15px 40px #17040826;
}
html[data-theme="dark"] body.has-sidebar{
  background:
    radial-gradient(ellipse 90vw 75vh at 100% 0%,#ee534b24,transparent 70%),
    radial-gradient(ellipse 65vw 90vh at 4% 75%,#a3213320,transparent 75%),
    linear-gradient(135deg,#260f12 0%,#1a1310 48%,#291519 100%)!important;
  background-attachment:fixed!important;
}
html[data-theme="dark"] body.has-sidebar .app-shell{background:transparent!important;}
html[data-theme="light"]{
  --pure-bg:#fbf2ed;--pure-surface:#fff9f5;--pure-surface-2:#f4e4dd;
  --pure-accent:#b95245;--pure-text:#3b2529;--pure-soft:#795a5d;--pure-muted:#917276;
  --pure-line:#b954461c;
  --pure-glass:linear-gradient(145deg,#ffffffcc,#fff7f199),#fcf0eae8;
  --pure-glass-shadow:inset 0 1px 0 #fff,0 15px 40px #a54d3f08;
}
html[data-theme="light"] body.has-sidebar{
  background:radial-gradient(ellipse at 100% 0,#f4b5a331,transparent 65%),linear-gradient(135deg,#fff7f0,#f8ece6)!important;
  background-attachment:fixed!important;
}
/* Un fond en « fixed » est repeint a chaque image de defilement sur les
   navigateurs mobiles, ou la barre d'URL fait varier la hauteur du cadre. */
@media(max-width:700px),(pointer:coarse) {
  html[data-theme] body.has-sidebar{background-attachment:scroll!important;}
}

/* Dark canvas with a red light revealed by the pointer. */
html[data-theme="dark"]{ --pure-bg:#100e11; --pure-surface:#1b1816; --pure-surface-2:#221e1b; --pure-glass:linear-gradient(145deg,#ffffff07,#ffffff01 60%),#1d1917e8; }
html[data-theme="dark"] body.has-sidebar{
  background:radial-gradient(ellipse at 85% 0,#9b233008,transparent 60%),#100e11!important;
}
html body.has-sidebar{isolation:isolate;}
body.has-sidebar .app-shell{position:relative;z-index:1;}
.ambient-hover-glow{position:fixed;left:0;top:0;width:0;height:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .65s ease;}
.ambient-hover-glow::before{content:'';position:absolute;left:-420px;top:-420px;width:840px;height:840px;border-radius:50%;background:radial-gradient(circle,#f22b3630 0%,#d3232f1c 24%,#be24300b 48%,transparent 70%);}
.ambient-hover-glow.is-active{opacity:1;}
html[data-theme="light"] .ambient-hover-glow::before{background:radial-gradient(circle,#ed524a16,transparent 70%);}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce) {.ambient-hover-glow{display:none;}}

/* Click ripples live above the canvas, below content, and never intercept input. */
.ambient-click-waves{position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.ambient-click-wave{position:absolute;width:640px;height:640px;margin:-320px 0 0 -320px;border:2px solid #ff665975;border-radius:50%;background:radial-gradient(circle,transparent 47%,#f0444220 64%,#ff705a18 69%,transparent 72%);box-shadow:0 0 25px #ef393430,inset 0 0 35px #ef393425;opacity:0;transform:scale(.03);animation:ambient-red-wave 1.35s cubic-bezier(.16,.65,.3,1) forwards}
.ambient-click-wave::after{content:'';position:absolute;inset:12%;border:1px solid #ff9b7f50;border-radius:50%;box-shadow:0 0 15px #ff665928}
@keyframes ambient-red-wave{0%{transform:scale(.03);opacity:0}9%{opacity:.9}55%{opacity:.42}100%{transform:scale(1.8);opacity:0}}
html[data-theme="light"] .ambient-click-wave{border-color:#c83b3655;box-shadow:0 0 25px #d94c3720,inset 0 0 35px #d94c3715}
/* Sur pointeur tactile, l'onde est rasterisee a sa taille finale (640 x 1,8
   = plus d'un megapixel de degrade et deux ombres portees) a chaque toucher.
   Le geste reste, la peinture se limite a un cercle de 300 px sans ombre
   interieure. La regle suit celle du theme clair : specificite egale, c'est
   l'ordre de source qui decide. */
@media(hover:none),(pointer:coarse){
 html[data-theme] .ambient-click-wave{width:300px;height:300px;margin:-150px 0 0 -150px;box-shadow:0 0 14px #ef393426}
 .ambient-click-wave::after{display:none}
}
@media(prefers-reduced-motion:reduce){.ambient-click-waves{display:none}}

/* Coral cursor sits above overlays and never catches clicks. */
.coral-cursor{position:fixed;left:0;top:0;width:0;height:0;z-index:2147483646;pointer-events:none;opacity:0;transition:opacity .15s;}
.coral-cursor.is-visible{opacity:1}
.coral-cursor-ring,.coral-cursor-dot{position:absolute;left:0;top:0;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.coral-cursor-ring{width:30px;height:30px;border:1px solid #ffb49fa6;background:#f2826b05;box-shadow:0 0 15px #ff80651c;transition:width .18s,height .18s,background .18s,border-color .18s,box-shadow .18s}
.coral-cursor-dot{width:5px;height:5px;background:#ffccb6;box-shadow:0 0 9px #ff8b6c90;transition:width .15s,height .15s}
.coral-cursor.is-link .coral-cursor-ring{width:43px;height:43px;background:#ff927818;border-color:#ffc7b5;box-shadow:0 0 22px #ff80652c}
.coral-cursor.is-pressed .coral-cursor-ring{width:22px;height:22px;background:#ff92782b;border-color:#ffddd0}
.coral-cursor.is-pressed .coral-cursor-dot{width:3px;height:3px}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 html.coral-cursor-active,html.coral-cursor-active body,html.coral-cursor-active body *{cursor:none!important}
 html.coral-cursor-active :is(input,textarea,[contenteditable="true"]){cursor:text!important}
 html.coral-cursor-active :is(select,iframe){cursor:auto!important}
}
html[data-theme="light"] .coral-cursor-ring{border-color:#b83f36aa;background:#d5654808;box-shadow:0 0 15px #b83f3610}
html[data-theme="light"] .coral-cursor-dot{background:#a72f2c;box-shadow:0 0 9px #a72f2c35}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce){.coral-cursor{display:none}}
@media(forced-colors:active){.coral-cursor{display:none}html.coral-cursor-active body *{cursor:auto!important}}

.coral-cursor-trail{position:fixed;inset:0;z-index:2147483645;pointer-events:none;overflow:hidden}
.coral-trail-spark{position:absolute;left:0;top:0;height:3px;width:8px;opacity:0;border-radius:100%;background:linear-gradient(90deg,#f1776200,#ffb59a,#ffd0b9);box-shadow:0 0 8px #ff896b70;pointer-events:none}
html[data-theme="light"] .coral-trail-spark{background:linear-gradient(90deg,#b83f3600,#c75b48,#ab3830);box-shadow:0 0 7px #b83f3630}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce),(forced-colors:active){.coral-cursor-trail{display:none}}

/* Outfit: a clean geometric family, hosted locally at every weight. */
:root{--font-body:'Outfit',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-head:var(--font-body)}
html body{font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-optical-sizing:auto}
html body :is(button,input,select,textarea){font-family:var(--font-body)}
html body .app-main :is(h1,h2,h3,h4){font-family:var(--font-body)!important}
html body .app-main :is(h1,h2){letter-spacing:-.035em}
html body .app-main :is(p,li){font-variant-ligatures:common-ligatures}

/* Text accents follow the matching sidebar entry, independently of the backdrop. */
html{--section-color:#ff867b}
html[data-page-section="lore"]{--section-color:#eeb87d}
html[data-page-section="communaute"]{--section-color:#ffb989}
html[data-page-section="roles"]{--section-color:#ffcf8f}
html[data-page-section="account"]{--section-color:#ffac72}
html[data-page-section="applications"]{--section-color:#ecc16e}
html[data-page-section="reclamations"]{--section-color:#ff9e69}
html[data-page-section="respondent"]{--section-color:#efd479}
html[data-page-section="reclamations-manage"]{--section-color:#f2b455}
html[data-page-section="members"]{--section-color:#ffd48c}
html[data-page-section="settings"]{--section-color:#ffc27a}
html[data-page-section="support"]{--section-color:#ffa870}
html[data-page-section="fido"]{--section-color:#f3a77a}
/* Section colors are accents, not a tint over every word. */
html body .app-main{--pure-accent:var(--section-color);--c-primary:var(--section-color);--c-accent:var(--section-color)}
html[data-theme="light"] body .app-main{--pure-accent:color-mix(in srgb,var(--section-color) 55%,#44332b);--c-primary:var(--pure-accent);--c-accent:var(--pure-accent)}

/* Slightly denser spacing, with fine borders to structure the shared layout. */
html[data-theme="dark"]{--pure-line:#edc1b31d}
html[data-theme="light"]{--pure-line:#57433a20}
:root{--page-gutter:clamp(22px,2.7vw,72px)}
html body .app-main :is(.ad-shell){padding-top:28px!important;padding-bottom:45px!important}
@media(max-width:700px){:root{--page-gutter:22px}}

/* Shared centered canvas: sidebar stays fixed, page content is more contained. */
html body.has-sidebar .app-shell>.app-main{
  box-sizing:border-box;
  width:100%!important;
  max-width:1500px!important;
  margin-inline:auto!important;
  padding-inline:0!important;
}
html body.has-sidebar .app-shell>.parvis>.parvis-shell{
  margin-inline:auto!important;
}
@media(min-width:1800px){html body.has-sidebar .app-shell>.app-main,html body.has-sidebar .app-shell>.parvis>.parvis-shell{width:calc(100% - 80px)!important}}
@media(max-width:700px){html body.has-sidebar .app-shell>.app-main,html body.has-sidebar .app-shell>.parvis>.parvis-shell{width:100%!important}}

/* A little more breathing room in the shared canvas. */
html body.has-sidebar .app-shell>.app-main,html body.has-sidebar .app-shell>.parvis>.parvis-shell{max-width:1600px!important}
@media(min-width:1800px){html body.has-sidebar .app-shell>.app-main,html body.has-sidebar .app-shell>.parvis>.parvis-shell{width:calc(100% - 60px)!important}}

/* Original ODB ember layers, behind the page and its glass surfaces. */
.odb-ember-background{position:fixed;inset:0;overflow:hidden;z-index:0;pointer-events:none;background:radial-gradient(ellipse 90% 35% at 50% 110%,#ad292d14,transparent 75%)}
html[data-theme="light"] .odb-embers--far{opacity:.5}html[data-theme="light"] .odb-embers--near{opacity:.62}
@media(max-width:700px){.odb-embers--far{opacity:.64}.odb-embers--near{opacity:.76}.odb-embers i::after{display:none}}
@media(prefers-reduced-motion:reduce){.odb-embers{display:none}}

/* Ultrawide homepage: the page owns its own reading column (.oh-shell),
   so the canvas can go edge to edge instead of shrinking to a fixed ratio. */
@media(min-width:2200px){
 html body.has-sidebar .app-shell>.app-main:has(.oh){width:100%!important;max-width:none!important}
 html body.has-sidebar .app-shell:has(.oh)>.parvis>.parvis-shell{width:100%!important;max-width:none!important}
}

/* Oversized horizontal ODB watermark, behind content and embers. */
.odb-background-wordmark{position:fixed;inset:0 0 0 var(--sidebar-width,310px);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:0;pointer-events:none;user-select:none}
.odb-background-wordmark img{display:block;width:90%;max-width:2300px;height:auto;opacity:.055;transform:rotate(-7deg)}
html[data-theme="light"] .odb-background-wordmark img{opacity:.075}
@media(max-width:960px){.odb-background-wordmark{left:0}.odb-background-wordmark img{width:125%;max-width:none;flex-shrink:0;opacity:.045}}
@media(prefers-reduced-transparency:reduce){.odb-background-wordmark{display:none}}
/* Le filigrane est la couche la plus chère du décor, et de loin : une image de
   1280 x 480 tournee de sept degres, etalee sur tout le cadre et repeinte a la
   densite de l'ecran. Sur le telephone de mesure (390 x 844 a x3, thread
   principal bride six fois), la couper fait passer l'image mediane de 72 a
   33 ms et les trames lentes de 116 a 6. A quatre virgule cinq pour cent
   d'opacite derriere une carte, personne ne la rate. */
[data-modeste] .odb-background-wordmark{display:none}

/* Ultrawide flame pages — chronicle, convocation, pavilions, registry, the
   appeals desk, the case file, the candidate hearing, the two staff benches,
   the applicant's own missive, the members register, the requests desk, the
   companion den, the five access sheets and the five normative codices: each
   caps its own reading column, so the canvas goes edge to edge exactly like
   the homepage. */
@media(min-width:2200px){
 html body.has-sidebar .app-shell>.app-main:has(.chronicle-page,.convocation-page,.pavilion-page,.registry-page,.plea-page,.ledger-page,.profile-page,.oath-page,.summons-page,.council-page,.cause-page,.tribunal-page,.docket-page,.hearing-page,.missive-page,.muster-page,.clef-page,.phare-page,.gp-page,.acc-page,.codex){width:100%!important;max-width:none!important}
 html body.has-sidebar .app-shell:has(.chronicle-page,.convocation-page,.pavilion-page,.registry-page,.plea-page,.ledger-page,.profile-page,.oath-page,.summons-page,.council-page,.cause-page,.tribunal-page,.docket-page,.hearing-page,.missive-page,.muster-page,.clef-page,.phare-page,.gp-page,.acc-page,.codex)>.parvis>.parvis-shell{width:100%!important;max-width:none!important}
}

/* Shared 3D card depth lives with its page (home/lore.css + card-depth.js). */

/* Consistent soft arrival of decorative page backgrounds; their own opacity stays intact. */
html body :is(.odb-background-wordmark,.perm-member-watermark){animation:page-background-soft-arrival 2.2s ease-out both!important}
/* Une cle de « filter » repeint toute la surface a chaque image ; pose sur un
   calque fixe plein ecran, c'est le poste le plus cher de l'entree de page,
   et le telephone le paie des le chargement. L'« opacity » fait le meme fondu
   en couche composee. La cle finale est laissee implicite : chaque element
   retrouve son opacite propre (le sceau garde .035). */
@keyframes page-background-soft-arrival{from{opacity:0}}
@media(prefers-reduced-motion:reduce){html body :is(.odb-background-wordmark,.perm-member-watermark){animation:none!important}}

/* ── Identité flamme ODB : obsidienne, rubis, ambre et or ───── */
:root{
  --pure-bg: #0a0608;
  --pure-surface: #150f0d;
  --pure-surface-2: #1e1613;
  --pure-text: #f8ede8;
  --pure-soft: #d6c0ba;
  --pure-muted: #a3858b;
  --pure-accent: #ff9a5c;
  --pure-line: #ffb9a31f;
  --pure-glass: linear-gradient(145deg, #ffffff0a, #ffffff02 55%), #19120fe8;
  --pure-glass-shadow: inset 0 1px 0 #ffffff0d, 0 12px 36px #05020630;
  --c-bg: var(--pure-bg); --c-bg-alt: var(--pure-surface-2);
  --c-primary: var(--pure-accent); --c-accent: var(--pure-accent);
  --c-primary-soft: #ff9a5c14; --c-primary-glow: #ff9a5c22;
  --c-border: var(--pure-line); --c-text: var(--pure-text); --c-text-soft: var(--pure-soft); --c-muted: var(--pure-muted);
  --odb-title-gradient: linear-gradient(96deg, #ff4d63, #ff8a4c 46%, #ffdc9a);
}
html[data-theme="dark"]{
  --pure-bg: #0a0608; --pure-surface: #150f0d; --pure-surface-2: #1e1613;
  --pure-glass: linear-gradient(145deg, #ffffff0a, #ffffff02 60%), #19120fe8;
}
html[data-theme="light"]{
  --pure-bg: #fbf3ec; --pure-surface: #fffaf6; --pure-surface-2: #f6e8de;
  --pure-text: #2c1618; --pure-soft: #6b4a49; --pure-muted: #93736f;
  --pure-accent: #e0763a; --pure-line: #b9544626;
  --pure-glass: linear-gradient(145deg, #ffffffd9, #fff6efb8 60%), #fdf3ecec;
  --pure-glass-shadow: inset 0 1px 0 #fff, 0 15px 40px #a54d3f12;
  --c-primary-soft: #e0763a14; --c-primary-glow: #e0763a22;
  --odb-title-gradient: linear-gradient(96deg, #c8202f, #e0763a 52%, #b97814);
}
html[data-theme="dark"] body.has-sidebar{
  background: radial-gradient(ellipse at 82% -6%, #ff3d5c14, transparent 58%), #0a0608 !important;
}
html[data-theme="light"] body.has-sidebar{
  background: radial-gradient(ellipse at 82% -6%, #ff8a4c26, transparent 58%), #fbf3ec !important;
}
.app-main :is(.grad){
  background: var(--odb-title-gradient) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: var(--pure-accent) !important;
  filter: none !important;
}
.ambient-hover-glow::before{
  background: radial-gradient(circle, #ff4d6326 0%, #ff7a3c17 26%, #ffdc9a0a 50%, transparent 70%);
}
html[data-theme="light"] .ambient-hover-glow::before{ background: radial-gradient(circle, #e0763a1f, transparent 70%) }

/* ── Scène cinématique : fx.js reprend la main sur les pages publiques et d'accès.
   Les espaces de travail (compte, équipe, admin) restent volontairement discrets. ── */
html[data-odb-stage="cinematic"] .app-main .fx-reveal:not(.fx-in){
  opacity: 0 !important;
  visibility: visible !important;
  transform: translateY(28px) scale(.978) !important;
  animation: none !important;
}
html[data-odb-stage="cinematic"] .app-main .fx-reveal.fx-in{
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  animation: none !important;
  transition: opacity .7s cubic-bezier(.16,1,.3,1) calc(var(--fx-i,0) * 65ms), transform .7s cubic-bezier(.16,1,.3,1) calc(var(--fx-i,0) * 65ms);
}
html[data-odb-stage="cinematic"] .scroll-progress-bar{
  background: linear-gradient(90deg, #ff4d63, #ff8a4c 55%, #ffdc9a);
  box-shadow: 0 0 12px #ff6a4c80, 0 0 26px #ff8a4c33;
}
@media(prefers-reduced-motion:reduce){html[data-odb-stage="cinematic"] .app-main .fx-reveal{opacity:1!important;transform:none!important;transition:none!important}}