/* Sphynx Access & Comfort v1 — independently controllable browser preferences.
   Owner confirmed #80756d as the locked stationery French Grey on 2026-10-16.
   Source record and companion brand colors: docs/Access-Comfort-Release.md. */
:root { --spx-french-grey:#80756d; --spx-calm-paper:#f0efeb; --spx-calm-ink:#242826; }
.spx-comfort{position:fixed;inset:auto auto max(15px,env(safe-area-inset-bottom)) max(15px,env(safe-area-inset-left));z-index:2147483000;color:#202a25;font:400 15px/1.55 "Nunito Sans",system-ui,sans-serif}
.spx-comfort *{box-sizing:border-box}
.spx-comfort button,.spx-comfort select{font:inherit;cursor:pointer}
.spx-comfort button:focus-visible,.spx-comfort select:focus-visible,.spx-comfort input:focus-visible{outline:3px solid #254c3e;outline-offset:3px}
.spx-comfort-trigger{border:2px solid #234d3b;border-radius:999px;background:#f5f0e7;color:#173b2b;min-height:48px;min-width:48px;padding:10px 18px;font-weight:800;box-shadow:0 3px 20px #0003;display:inline-flex;align-items:center;gap:9px}
.spx-comfort-trigger:hover{background:#e8e5df}
.spx-comfort-panel{position:absolute;left:0;bottom:calc(100% + 10px);width:min(405px,calc(100vw - 30px));max-height:min(770px,calc(100dvh - 88px));overflow:auto;overscroll-behavior:contain;background:#f7f5f0;border:2px solid #617466;border-radius:17px;padding:20px;box-shadow:0 20px 65px #0006;color:#222c25}
.spx-comfort-panel[hidden]{display:none!important}
.spx-comfort-header{display:flex;gap:16px;align-items:start;justify-content:space-between;border-bottom:1px solid #b9c5ba;padding-bottom:11px}
.spx-comfort-eyebrow{margin:0 0 3px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:11px;color:#365142}
.spx-comfort-header h2{margin:0;font:600 28px/1.2 Georgia,serif;letter-spacing:-.02em;color:#1a3227}
.spx-comfort-close{border:1px solid #688071;border-radius:100%;background:#fff;min-height:42px;min-width:42px;color:#172b20}
.spx-comfort-intro{margin:13px 0 17px;font-size:14px;color:#34463b;line-height:1.55}
.spx-comfort-options{border:0;padding:0;margin:0}
.spx-comfort-options legend{margin-bottom:5px;font-weight:800;font-size:15px;color:#1d3529}
.spx-comfort-choice{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid #d6dcd5;cursor:pointer}
.spx-comfort-choice input{accent-color:#24513e;width:23px;height:23px;flex-shrink:0;margin:2px 0 0}
.spx-comfort-choice strong,.spx-comfort-choice small{display:block}
.spx-comfort-choice strong{font-size:15px;line-height:1.35}
.spx-comfort-choice small{font-size:12px;line-height:1.45;color:#435349;margin-top:4px}
.spx-comfort-palette{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:13px 0 16px;font-weight:700;font-size:14px}
.spx-comfort-palette select{min-height:44px;max-width:160px;padding:7px 10px;border:1px solid #506b5a;border-radius:8px;background:#fff;color:#1a3526}
.spx-comfort-palette select:disabled{opacity:.58;cursor:not-allowed}
.spx-comfort-actions{display:flex;flex-wrap:wrap;gap:8px}
.spx-comfort-actions button{min-height:44px;border-radius:9px;border:1px solid #2b5040;padding:9px 13px;font-weight:800;font-size:14px}
.spx-comfort-reset{background:transparent;color:#213b2d}
.spx-comfort-done{background:#163c2c;color:white}
.spx-comfort-care{margin-top:20px;border:1px solid #b5a8be;border-radius:13px;padding:13px 15px;background:#e8deec;color:#30263a}
.spx-comfort-care p{margin:5px 0;font-size:12.5px;line-height:1.55;color:inherit}
.spx-comfort-care .spx-comfort-care-heading{margin:0;font:600 21px/1.25 Georgia,serif;color:#342442}
.spx-comfort-care .spx-comfort-care-subhead{font-weight:800;font-size:13px}
.spx-comfort-care .spx-comfort-care-note{font-size:11.5px}
.spx-comfort-info{border:0;background:none;color:#3b2a5a;padding:4px 0;text-decoration:underline;text-underline-offset:3px;font-size:12px!important;font-weight:700}
.spx-comfort-care [hidden]{display:none}
@media(max-width:480px){.spx-comfort{font-size:14px}.spx-comfort-panel{padding:15px}.spx-comfort-trigger{font-size:13px;padding:9px 14px}.spx-comfort-header h2{font-size:25px}}

/* Setting 1: a calmer, French-grey/paper site-wide foundation.
   Page-specific typography and informational content remain intact. */
html[data-spx-calm="1"]{
 --background:40 10% 96%;--foreground:140 10% 15%;
 --card:42 10% 99%;--card-foreground:140 10% 15%;
 --popover:42 10% 99%;--popover-foreground:140 10% 15%;
 --primary:148 25% 23%;--primary-foreground:40 15% 98%;
 --secondary:35 8% 88%;--secondary-foreground:140 10% 15%;
 --muted:35 8% 92%;--muted-foreground:140 8% 28%;
 --accent:33 9% 84%;--accent-foreground:140 10% 20%;
 --border:35 10% 64%;--input:35 10% 64%;--ring:148 35% 26%;
}
html[data-spx-calm="1"] body{background:var(--spx-calm-paper);color:var(--spx-calm-ink)}
html[data-spx-calm="1"] :is(.booking-page,.living-atlas,.storybook,.rear-hotfix,.mazda-campaign,.sphynx-standalone-wrap){--spx-calm-border:var(--spx-french-grey)}
html[data-spx-calm="1"] .sphynx-standalone-wrap{background:#efeee9!important;color:#242823!important}
html[data-spx-calm="1"] .sphynx-standalone-wrap :is(.hero,.section.paper,.nav){background-image:none!important}
html[data-spx-calm="1"] .sphynx-standalone-wrap .hero{background-color:#3f4942!important}
html[data-spx-calm="1"] .sphynx-standalone-wrap .nav{background-color:#39483f!important}
html[data-spx-calm="1"] .sphynx-standalone-wrap :is(.hero,.nav,.section){border-color:var(--spx-french-grey)}
html[data-spx-palette="grayscale"] .sphynx-standalone-wrap :is(.hero,.section,.gallery,.nav,.dossier){filter:grayscale(1)}
html[data-spx-images="1"] .sphynx-standalone-wrap :is(.hero .starfield,.hero img[alt=""],.gallery img[alt=""]){display:none!important}
html[data-spx-images="1"] .sphynx-standalone-wrap :is(.hero,.nav){background-image:none!important}
html[data-spx-text="1"] .sphynx-standalone-wrap :is(p,li,summary){font-size:max(1rem,1em)}

html[data-spx-calm="1"] :is(.controlled-header,.booking-header,.booking-footer,.sphynx-cabinet){background:#3f4942!important;color:#fffefa!important}
html[data-spx-calm="1"] :is(.booking-page,.living-atlas,.storybook,.rear-hotfix,.mazda-campaign){background:#efeee9!important;color:#252823!important}
html[data-spx-calm="1"] .booking-page{--bk-paper:#efeee9;--bk-ink:#252823;--bk-muted:#3b423e;--bk-green:#33463e;--bk-purple:#3b5147;--bk-gold:#6d6a61}
html[data-spx-calm="1"] .living-atlas{--ink:#252823;--sub:#3e4640;--green:#3c4f44;--mid:#4c5b50;--paper:#efeee9;--parchment:#e7e3db;--lilac:#4f494e;--stroke:#adaaa3;--shadow:none}
html[data-spx-calm="1"] :is(.booking-hero,.cabinet-crown,.cabinet-compartments,.storybook-cover){background-image:none!important;background-color:#e8e6df!important}
html[data-spx-calm="1"] .cabinet-crown{background-color:#3f4942!important}
html[data-spx-calm="1"] .cabinet-compartments{background-color:#343f37!important}
html[data-spx-calm="1"] .storybook-cover :is(h1,p),html[data-spx-calm="1"] .booking-hero :is(h1,p){color:#202e26}
html[data-spx-calm="1"] :is(.home-hero,.home-section,.home-next){background-image:none!important}
html[data-spx-calm="1"] :is(.booking-page,.living-atlas,.storybook,.rear-hotfix,.mazda-campaign,.sphynx-cabinet) img{filter:saturate(.16)}
html[data-spx-calm="1"] .sphynx-cabinet :is(.cabinet-invitation h2,.cabinet-invitation p){color:#fff9ed}
html[data-spx-calm="1"] .sphynx-cabinet a{color:inherit}

/* Grayscale is an alternate palette inside Low-Stimulation, never a sixth toggle.
   Apply to page sections, not body/#root: keeps the fixed panel in place. */
html[data-spx-palette="grayscale"]{
 --background:0 0% 96%;--foreground:0 0% 12%;--card:0 0% 100%;--border:0 0% 58%;
 --primary:0 0% 22%;--primary-foreground:0 0% 100%;--muted-foreground:0 0% 27%;
 --secondary:0 0% 87%;--secondary-foreground:0 0% 12%;--ring:0 0% 20%
}
html[data-spx-palette="grayscale"] :is(main,header,footer){filter:grayscale(1)}

/* Setting 2; users' OS settings still apply even if this toggle is off. */
html[data-spx-motion="1"],html[data-spx-motion="1"] *:not(.spx-comfort),html[data-spx-motion="1"] *::before,html[data-spx-motion="1"] *::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}
html[data-spx-motion="1"] :is(.animate-marquee,.progress){animation:none!important}

/* Setting 3: no blanket hiding of pictures; useful diagrams, portraits,
   clickable maps, logo navigation and illustration text alternatives survive. */
html[data-spx-images="1"] img[alt=""]{display:none!important}
html[data-spx-images="1"] :is(.booking-hero-art,.storybook-art,.cabinet-crest,.cabinet-books,.cabinet-icon,.cabinet-resting){display:none!important}
html[data-spx-images="1"] :is(.booking-hero,.storybook-cover,.cabinet-crown,.home-hero){background-image:none!important}
html[data-spx-images="1"] :is(.home-hero,.booking-hero,.storybook-cover){background-color:#f0eee8}
html[data-spx-images="1"] .cabinet-crown{background-color:#25372b}
html[data-spx-images="1"] .cabinet-label-row h3{background-image:none!important}
html[data-spx-images="1"] .cabinet-compartment{border-image:none!important;border:1px solid #8e957d}

/* Setting 4: stronger semantics and keyboard focus, not just a CSS filter. */
html[data-spx-contrast="1"]{
 --foreground:0 0% 5%;--card-foreground:0 0% 5%;
 --muted-foreground:0 0% 17%;--primary:152 68% 17%;
 --primary-foreground:0 0% 100%;--border:0 0% 32%;--ring:0 0% 10%
}
html[data-spx-contrast="1"] :is(a,button,summary,input,select,textarea):focus-visible{outline:3px solid #141414!important;outline-offset:4px!important;box-shadow:0 0 0 2px white!important}
html[data-spx-contrast="1"] :is(main,footer) a:not(.cabinet-cta){text-decoration:underline;text-underline-offset:3px}
html[data-spx-contrast="1"] :is(.booking-page,.living-atlas,.storybook,.rear-hotfix,.mazda-campaign){--bk-muted:#242424;color:#151515}
html[data-spx-contrast="1"] .sphynx-cabinet{color:white}
html[data-spx-contrast="1"] .spx-comfort-trigger{border-width:3px}

/* Setting 5: rem-based layouts grow normally; legacy px layouts get an
   additional prose floor, not page zoom or transformations of the interface. */
html[data-spx-text="1"]{font-size:125%!important}
html[data-spx-text="1"] :is(.booking-page,.living-atlas,.storybook,.rear-hotfix,.mazda-campaign,.sphynx-cabinet){line-height:1.6}
html[data-spx-text="1"] :is(.booking-page,.living-atlas,.storybook,.rear-hotfix,.mazda-campaign,.sphynx-cabinet) :is(p,li,summary,label){font-size:max(1rem,1em);line-height:1.65}
html[data-spx-text="1"] .spx-comfort{font-size:15px}
html[data-spx-text="1"] .spx-comfort-panel{max-height:calc(100dvh - 90px)}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}
