/* RehabStack designer guideline — Color usage, pages 4–6.
   Main surfaces: off-white. Structure: dark green. Actions: blue.
   Progress: sage. Information: cyan. Small highlights: lime.
   Brand gradient is confined to the hero and closing campaign banner. */
:root{
 --brand-blue:#124E8C;--brand-green:#1E362D;--brand-sage:#60A672;
 --brand-cyan:#25B8D9;--brand-lime:#D9EB02;--brand-paper:#FFFBF7;
 --blue-15:color-mix(in srgb,var(--brand-blue) 15%,var(--brand-paper));
 --blue-25:color-mix(in srgb,var(--brand-blue) 25%,var(--brand-paper));
 --sage-15:color-mix(in srgb,var(--brand-sage) 15%,var(--brand-paper));
 --sage-25:color-mix(in srgb,var(--brand-sage) 25%,var(--brand-paper));
 --cyan-15:color-mix(in srgb,var(--brand-cyan) 15%,var(--brand-paper));
 --cyan-25:color-mix(in srgb,var(--brand-cyan) 25%,var(--brand-paper));
 --lime-15:color-mix(in srgb,var(--brand-lime) 15%,var(--brand-paper));
 --navy:var(--brand-green);--blue:var(--brand-blue);--bright:var(--brand-blue);
 --cyan:var(--brand-cyan);--muted:#445850;--line:#d9dddc;--ice:var(--brand-paper);
 --brand-gradient:linear-gradient(145deg,var(--brand-blue) 0%,var(--brand-cyan) 55%,var(--brand-sage) 100%);
}
body{color:var(--brand-green);background:var(--brand-paper)}
p{color:var(--muted)}
h1,h2,h3,h4,.brand,.nav-links>a:not(.button),.faq-list summary,.chapter-copy h2 em{color:var(--brand-green)}
.gradient-text{background:none;color:var(--brand-green);-webkit-text-fill-color:currentColor}
h1 .muted,h2 .muted,h3 .muted,.muted{color:var(--brand-green)}
.eyebrow,.chapter-kicker,.micro,.index-label,.visual-caption{color:var(--brand-green)}
.text-link,.back-top,.down-link{color:var(--brand-blue)}
.button,.ui-primary,.product-tabs button[aria-selected=true],.chapter-nav a[aria-current=step] b{background:var(--brand-blue);color:var(--brand-paper)}
.button:hover,.ui-primary:hover{background:var(--brand-blue);box-shadow:0 8px 24px #124e8c30}
.button-white{background:var(--brand-blue);color:var(--brand-paper);border-color:#fffbf755}
.button-white:hover{background:var(--brand-blue);border-color:var(--brand-paper)}
.nav-links>a:not(.button):hover,.theme-bottom .icon{color:var(--brand-blue)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline-color:var(--brand-blue)}
.header{background:#fffbf7ed;border-color:var(--line)}
.nav-links.open,.skip,.dialog-bar,.icon-button,dialog{background:var(--brand-paper)}
.hero{background:var(--brand-paper)}
.hero-glow{inset:0;background:linear-gradient(90deg,var(--brand-paper) 24%,#fffbf72b 80%),var(--brand-gradient);opacity:.22}
.hero-separator{background:var(--brand-paper)}
.pill{background:var(--cyan-15);border-color:var(--cyan-25);color:var(--brand-green)}
.pill .icon,.mini-line{color:var(--brand-cyan)}
.glass-square{background:linear-gradient(125deg,#fffbf7d9,#fffbf738 55%,#fffbf799);border-color:#fffbf7e6;box-shadow:inset 0 0 14px #fffbf7b3,0 20px 65px #1e362d12}
.floating-label{background:#fffbf7ed;border-color:var(--brand-paper)}
.floating-label strong{color:var(--brand-green)}
.floating-label span:not(.tiny-icon),.hero-footnote,.art-caption{color:var(--muted)}
.tiny-icon{background:var(--cyan-15);color:var(--brand-cyan)}
.label-bottom .tiny-icon{background:var(--sage-15);color:var(--brand-sage)}
.product-preview,.mobile-preview,.clinician-preview,.app-visual .screenshot-button,.clinic-visual .screenshot-button{border-color:var(--brand-paper);background:var(--brand-paper)}
.window-bar{background:var(--brand-paper)}
.window-bar>span:not(.preview-tag){background:#b4bcb9}
.window-bar p,.window-bar .preview-tag,.context-strip>div,.concept-note,.sample-label,.demo-disclosure{color:var(--muted)}
.context-strip strong{color:var(--brand-green)}
.story-prologue,.products-section,.care-story,.story-resolution,.faq-section,.dialog-image-wrap{background:var(--brand-paper);border-color:var(--line)}
.product-tabs,.product-panel{background:var(--brand-paper);border-color:var(--line)}
.product-tabs button{color:var(--brand-green)}
.check-list li{color:var(--muted)}
.check-list li:before,.glass-mini .icon{color:var(--brand-sage)}
.product-visual{background:var(--sage-15)}
.glass-mini,.zoom-hint{background:var(--brand-paper);border-color:var(--line)}
.prologue-path>span{background:var(--brand-paper);border-color:var(--line);color:var(--brand-green)}
.prologue-path .icon,.resolution-roles .icon{color:var(--brand-blue)}
.prologue-path i,.resolution-roles i{background:var(--brand-sage)}
.chapter-nav{background:#fffbf7f2;border-color:var(--line)}
.chapter-nav a{color:var(--brand-green)}
.chapter-nav b{border-color:var(--line)}
.chapter-nav a[aria-current=step]{color:var(--brand-blue)}
.chapter-meter{background:var(--line)}
.chapter-meter span{background:var(--brand-sage)}
.chapter-kicker b{background:var(--blue-15);border-color:var(--blue-25);color:var(--brand-blue)}
.handoff{color:var(--brand-green)}
.handoff .icon{color:var(--brand-blue)}
.handoff-arrow{color:var(--brand-cyan)}
.story-benefit{border-color:var(--brand-sage)}
.story-benefit strong{color:var(--brand-green)}
.chapter-bridge>span{background:var(--brand-sage)}
.chapter-bridge strong{color:var(--brand-green)}
.chapter-bridge .icon{color:var(--brand-sage)}
.scene,.scene-arrive,.scene-plan,.scene-home{background:var(--brand-paper);border-color:var(--line);box-shadow:inset 0 0 40px #fffbf7a1,0 18px 45px #1e362d06}
.scene-progress{background:var(--sage-15);border-color:var(--sage-25)}
.mini-app{background:var(--brand-paper);border-color:var(--line);box-shadow:0 16px 45px #1e362d0d}
.mini-app-bar,.exercise-row,.device-nav{border-color:var(--line)}
.mini-app-bar .icon{color:var(--brand-blue)}
.ui-tag{background:var(--sage-15);color:var(--brand-green)}
.neutral-tag{background:var(--cyan-15);color:var(--brand-green)}
.mini-app-bar>.ui-tag,.home-plan-heading>span{background:var(--cyan-15);color:var(--brand-green)}
.avatar{background:var(--blue-15);color:var(--brand-blue)}
.stat-strip{background:var(--brand-paper);border-color:var(--line)}
.stat-strip>div{border-color:var(--line)}
.stat-strip>div:first-child strong{display:table;margin:auto;background:var(--lime-15);border-radius:7px;padding:0 8px;color:var(--brand-green)}
.stat-strip span,.schedule-head>span,.mini-section-title>span,.schedule-options .time,.schedule-options small,.appointment-detail span,.profile-line p,.plan-summary p,.meter-labels,.exercise-row small{color:var(--muted)}
.schedule-options button{background:var(--brand-paper);border-color:var(--line)}
.schedule-options button[aria-pressed=true]{background:var(--blue-15);border-color:var(--brand-blue)}
.appointment-detail{background:var(--cyan-15)}
.appointment-detail .icon{color:var(--brand-cyan)}
.scene-mascot>span{background:var(--brand-paper);border-color:var(--line);color:var(--brand-green)}
.plan-summary{background:var(--sage-15)}
.session-meter span{background:var(--line)}
.session-meter span:nth-child(-n+3){background:var(--brand-sage)}
.exercise-number{background:var(--brand-paper);color:var(--brand-green);border:1px solid var(--line)}
.exercise-row>.icon{color:var(--brand-sage)}
.plan-confirmation{background:var(--sage-15);border-color:var(--sage-25);color:var(--brand-green)}
.plan-confirmation>.icon{color:var(--brand-sage)}
.patient-device{background:var(--brand-paper);border-color:var(--brand-paper);outline-color:var(--line)}
.patient-brand .clinic-monogram{background:var(--brand-blue);color:var(--brand-paper)}
.patient-greeting{background:var(--brand-paper);border:1px solid var(--line)}
.home-plan-heading>span{padding:3px 6px;border-radius:4px}
.home-exercises button{background:var(--brand-paper);border-color:var(--line)}
.home-exercises button[aria-pressed=true]{background:var(--sage-15);border-color:var(--brand-sage)}
.exercise-check{border-color:var(--line)}
.home-exercises button[aria-pressed=true] .exercise-check{background:var(--brand-sage);border-color:var(--brand-sage);color:var(--brand-green)}
.home-exercises small,.completion-note,.next-visit span,.device-nav>span{color:var(--muted)}
.next-visit{background:var(--cyan-15)}
.next-visit>.icon{color:var(--brand-cyan)}
.device-nav>span:first-child{color:var(--brand-blue)}
.home-floating-card{background:var(--brand-paper);border-color:var(--line)}
.home-floating-card .icon{color:var(--brand-blue)}
.home-floating-card strong{background:var(--lime-15);padding:2px 5px;border-radius:4px}
.home-floating-card>span{color:var(--muted)}
.home-caption{background:#fffbf7ed;border-color:var(--line);color:var(--muted)}
.home-caption strong{color:var(--brand-green)}
.chart-heading>div>span:not(.micro),.chart-axis,.chart-disclaimer{color:var(--muted)}
.chart-filters{border-color:var(--line)}
.chart-filters button{color:var(--brand-green)}
.chart-filters button[aria-pressed=true]{background:var(--blue-15);color:var(--brand-blue)}
.chart-grid{stroke:var(--line)}
.activity-chart text{fill:var(--muted)}
#activity-line{stroke:var(--brand-sage)}
#activity-dots{stroke:var(--brand-sage);fill:var(--brand-paper)}
.review-note{background:var(--sage-15)}
.review-note .tiny-icon{background:var(--sage-25);color:var(--brand-sage)}
.resolution-roles,.story-resolution .resolution-next{color:var(--brand-green)}
.down-link{border-color:var(--blue-25);background:var(--brand-paper)}
.white-label-section{background:var(--brand-green);color:var(--brand-paper)}
.white-label-section:before{background:none}
.brand-copy h2,.brand-copy h2 em{color:var(--brand-paper)}
.brand-copy>.eyebrow{color:var(--brand-cyan)}
.brand-copy>p,.brand-copy .check-list li,.brand-copy .brand-small{color:var(--brand-paper)}
.brand-copy .check-list li:before{color:var(--brand-sage)}
.brand-demo{--demo-color:var(--brand-blue);--demo-tint:var(--blue-15);background:#fffbf708;border-color:#fffbf733}
.brand-demo[data-theme=cyan]{--demo-color:var(--brand-blue);--demo-tint:var(--cyan-15)}
.brand-demo[data-theme=midnight]{--demo-color:var(--brand-blue);--demo-tint:var(--sage-15)}
.brand-demo-top>span:first-child,.brand-demo-top .sample-label,.theme-bottom{color:var(--brand-paper)}
.theme-options{flex-wrap:wrap}
.theme-button{color:var(--brand-paper);border-color:#fffbf74d}
.theme-button[aria-pressed=true]{background:var(--brand-blue);border-color:var(--brand-cyan);color:var(--brand-paper)}
.theme-button>span{background:var(--brand-blue);border:1px solid #fffbf766}
.theme-button[data-theme=cyan]>span{background:var(--brand-cyan)}
.theme-button[data-theme=midnight]>span{background:var(--brand-sage)}
.branded-card{background:var(--brand-paper);color:var(--brand-green)}
.branded-welcome{color:var(--brand-green)}
.branded-welcome p,.branded-appointment strong{color:var(--brand-green)}
.branded-card-top>div>span,.branded-appointment span{color:var(--muted)}
.brand-spark{color:var(--brand-lime);fill:var(--brand-lime);stroke:var(--brand-green);stroke-width:1}
.branded-appointment>.icon{color:var(--brand-cyan)}
.branded-button{background:var(--brand-blue);color:var(--brand-paper)}
.theme-bottom .icon{color:var(--brand-sage)}
.mode-selector{background:var(--brand-paper);border-color:var(--line)}
.mode-selector button{color:var(--brand-green)}
.mode-selector button[aria-pressed=true]{background:var(--brand-blue);color:var(--brand-paper)}
.mode-stage{background:var(--brand-paper);border-color:var(--line)}
.mode-stage[data-mode=celebrate]{background:var(--sage-15)}
.mode-orbit{background:linear-gradient(145deg,#fffbf7dd,#fffbf755);border-color:var(--line)}
.mode-ui{background:var(--cyan-15);border-color:var(--cyan-25)}
.mode-stage[data-mode=celebrate] .mode-ui{background:var(--sage-15);border-color:var(--sage-25)}
.mode-stage[data-mode=celebrate] .mode-ui .tiny-icon{background:var(--sage-25);color:var(--brand-sage)}
.mode-ui>div>span,.mode-footnote{color:var(--muted)}
.faq-list details{border-color:var(--line)}
.faq-list summary .icon{color:var(--brand-blue)}
.connect-panel{background:var(--brand-gradient);color:var(--brand-paper)}
.connect-panel:before{background:linear-gradient(90deg,#1e362df2 0%,#1e362de0 43%,#1e362d00 90%)}
.connect-copy h2,.connect-copy>p,.connect-note{color:var(--brand-paper)}
.connect-copy>.eyebrow{color:var(--brand-paper)}
.connect-copy>.eyebrow:before{content:'';display:inline-block;width:7px;height:7px;border-radius:2px;background:var(--brand-lime);margin-right:9px}
.connect-art .glass-square{background:#fffbf71f;border-color:#fffbf74a}
.footer-bottom,.footer-top>p{color:var(--muted)}
dialog::backdrop{background:#1e362de6}
@media(max-width:650px){.nav-links{background:var(--brand-paper)}.connect-panel:before{background:linear-gradient(180deg,#1e362df2 0%,#1e362ddd 58%,#1e362d00 100%)}}