/* KAGE ROOT interactive journeys — V1.12 visual review */
:root{--bg:#030a06;--panel:#0a1c12;--green:#67d887;--bright:#9cf3a3;--gold:#d6ae69;--cream:#f4ecda;--muted:#c3d0c5;--line:#426b4e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:290px;color:var(--cream);background:radial-gradient(ellipse at 60% 5%,#183525 0%,#07120b 48%,#030905 100%);font:16px/1.6 system-ui,-apple-system,Segoe UI,sans-serif}body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.22;background:linear-gradient(0deg,rgba(2,12,6,.88),transparent),url('hero-tree.webp') center/cover;z-index:-1}.wrap{max-width:1030px;padding:34px 20px 85px;margin:auto}.ey{color:var(--gold);font-size:12px;letter-spacing:3px;font-weight:800}.topnav{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:33px;flex-wrap:wrap}.topnav a,.subnav{color:#e2d2a9;text-decoration:none;letter-spacing:1.5px;font-size:13px;font-weight:800}.brand{font-weight:800;letter-spacing:5px;color:var(--cream)}h1{font-size:clamp(39px,7vw,69px);line-height:1.08;margin:8px 0 16px;letter-spacing:-1.5px}h1 span,h2 span,.green{color:var(--bright)}.lead{color:#e0e5de;max-width:720px;margin:0 0 26px;font-size:clamp(16px,2vw,19px)}h2{font-size:clamp(23px,3vw,34px);line-height:1.15;margin:0 0 12px}h3{font-size:19px;margin:0 0 9px}p{color:var(--muted)}.glass{background:linear-gradient(145deg,rgba(14,39,25,.97),rgba(5,16,10,.97));border:1px solid rgba(121,195,131,.42);border-radius:22px;box-shadow:0 14px 38px rgba(0,0,0,.25)}.pad{padding:24px}.btn,button{appearance:none;cursor:pointer;font:800 14px/1.4 system-ui,sans-serif;border:1px solid #68b47a;background:#173d25;color:#fff4df;border-radius:12px;padding:13px 17px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;transition:background .15s,transform .15s,border-color .15s}.btn:hover,button:hover{background:#286b3e;border-color:#a8e1a7;transform:translateY(-1px)}.btn:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #f1cc82;outline-offset:3px}.btn.primary,button.primary{background:#85d99c;color:#04140b;border-color:#a5e9b4}.btn.primary:hover,button.primary:hover{background:#b1edbe}button[aria-pressed=true],.tab[aria-selected=true]{background:#3b834d;border-color:#b6e7ad}button[disabled]{cursor:not-allowed;opacity:.42;transform:none}.muted{color:#b6c8b8;font-size:13px}.fine{color:#a6b9ab;font-size:12px}.footer{text-align:center;color:#8bd59b;font-weight:800;letter-spacing:3px;padding-top:45px}.footer small{display:block;font-size:10px;color:#a9b6a7;margin-top:8px;letter-spacing:2px}.hero-image{width:100%;border-radius:19px;overflow:hidden;border:1px solid #4f8058;background:#0a1b12;position:relative}.hero-image svg{display:block;width:100%;height:auto}.hero-image figcaption{position:absolute;bottom:0;left:0;right:0;padding:15px 18px;background:linear-gradient(transparent,rgba(1,9,5,.87));font-weight:800;letter-spacing:2px;color:#fff9ed}.grid{display:grid;gap:16px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}.divider{height:1px;background:linear-gradient(90deg,transparent,#3f8151,transparent);margin:25px 0}.story-label{color:var(--gold);font-weight:800;font-size:13px;letter-spacing:2px}.quote{font-size:clamp(20px,3vw,27px);line-height:1.3;font-weight:800;color:var(--cream);margin:8px 0 16px}.action{border-left:4px solid #74d48d;padding:15px 18px;background:#06160d;border-radius:0 13px 13px 0;margin-top:18px}.action h3{color:#9aeaa6;font-size:14px;letter-spacing:2px}.action p{margin:5px 0}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.status{color:#dce4da;font-weight:700;min-height:28px}textarea{width:100%;background:#07170e;color:var(--cream);border:1px solid #56765a;border-radius:12px;padding:12px;min-height:94px;font:inherit;resize:vertical}.selection{color:#dce8dc}.progress{height:9px;background:#183321;border-radius:10px;overflow:hidden;margin:12px 0}.progress>div{background:linear-gradient(90deg,#387d4a,#a5e4a9);height:100%;transition:width .4s}.card-click{text-align:left;min-height:140px;width:100%;display:flex;flex-direction:column;align-items:start;justify-content:space-between;padding:17px;border-radius:17px;background:linear-gradient(135deg,#0e2b1b,#06120b);border:1px solid #436747}.card-click:hover{border-color:#b7d89d}.card-click strong{font-size:16px;letter-spacing:.6px}.card-click .small{font-size:12px;letter-spacing:1.2px;color:#c6dbc4}.card-click .pic{font-size:37px;filter:drop-shadow(0 0 9px rgba(230,186,95,.2))}.card-click[aria-pressed=true]{box-shadow:0 0 0 2px #b7df95 inset;background:linear-gradient(130deg,#214d2e,#0b2313)}.stepper{display:flex;flex-wrap:wrap;gap:10px}.bubble{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#2b6e3e;color:#fcf6e5;border:1px solid #8bd7a0;font-weight:800}.note{background:#09190f;border:1px dashed #5c7b5b;padding:14px 17px;border-radius:14px;color:#ced9cb}.stage-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.88fr);gap:23px;align-items:center}.hide{display:none!important}label.check{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #2a4632;cursor:pointer}input[type=checkbox]{accent-color:#65d887;width:21px;height:21px;flex-shrink:0}body[data-page=seasons] .card-click{min-height:135px}.world{--sky1:#294e4e;--sky2:#c8a56c;--hill:#203d2a;--ground:#162819;--leaf:#7cba67;--sun:#ecd28e}.world[data-season=summer]{--sky1:#29625e;--sky2:#cbbd80;--hill:#315c3b;--ground:#19432a;--leaf:#5bb759;--sun:#fff1b3}.world[data-season=autumn]{--sky1:#362f39;--sky2:#b27743;--hill:#3b3926;--ground:#382717;--leaf:#dc8b36;--sun:#ffca7a}.world[data-season=winter]{--sky1:#182f48;--sky2:#859bac;--hill:#29424b;--ground:#1f343a;--leaf:#b5c7c6;--sun:#d7e9ed}.world .sky-top{stop-color:var(--sky1)}.world .sky-bottom{stop-color:var(--sky2)}.world .hill{fill:var(--hill)}.world .ground{fill:var(--ground)}.world .sun{fill:var(--sun)}.world .foliage{fill:var(--leaf);transition:fill .35s}.world[data-season=winter] .foliage{opacity:0}.world .snow,.world .flowers,.world .falling{opacity:0;transition:opacity .4s}.world[data-season=winter] .snow,.world[data-season=spring] .flowers,.world[data-season=autumn] .falling{opacity:1}.world .tree-trunk{stroke:#4d3024;stroke-width:16;stroke-linecap:round;fill:none}.world .branches{stroke:#4d3024;stroke-width:8;stroke-linecap:round;fill:none}.world svg{max-height:370px}.growth svg{max-height:450px}.growth .roots,.growth .trunk,.growth .branches,.growth .leaves,.growth .fruit{transition:opacity .45s,transform .65s;transform-origin:50% 88%}.growth[data-step="0"] .roots,.growth[data-step="0"] .trunk,.growth[data-step="0"] .branches,.growth[data-step="0"] .leaves,.growth[data-step="0"] .fruit{opacity:0;transform:scale(.3)}.growth[data-step="1"] .trunk,.growth[data-step="1"] .branches,.growth[data-step="1"] .leaves,.growth[data-step="1"] .fruit{opacity:0;transform:scale(.4)}.growth[data-step="2"] .branches,.growth[data-step="2"] .leaves,.growth[data-step="2"] .fruit{opacity:0;transform:scale(.65)}.growth[data-step="3"] .fruit{opacity:0;transform:scale(.9)}.growth .fruit{fill:#d6ae69;stroke:#f3d38d;stroke-width:2}.growth[data-step="4"] .fruit{animation:shine 1.3s ease-out}.breath-ring{display:grid;place-items:center;width:175px;height:175px;border-radius:50%;margin:20px auto;background:radial-gradient(circle,#2e7e4e,#133e26 62%,#092017);border:4px solid #b8e8bb;box-shadow:0 0 0 14px #35794d35,0 0 35px #5fae7a60;transition:transform 4s ease-in-out}.breath-ring.in{transform:scale(1.14)}.breath-ring.out{transform:scale(.88)}.breath-ring strong{display:block;text-align:center;font-size:21px}.recovery-visual{height:100px;background:radial-gradient(ellipse at center,#234d2f,#081b10);border-radius:14px;display:grid;place-items:center;margin:15px 0;font-size:48px}.activity-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.activity-step{border:1px solid #4a7353;border-radius:13px;padding:12px;background:#08190e;min-height:118px}.activity-step b{display:block;color:#c1e5bd;margin-bottom:7px}.season-symbol{font-size:40px}@keyframes shine{0%{filter:brightness(2)}100%{filter:brightness(1)}}@media(max-width:770px){.stage-grid{grid-template-columns:1fr}.grid.four{grid-template-columns:repeat(2,1fr)}.wrap{padding:22px 14px 70px}.topnav{margin-bottom:23px}.stage-grid .hero-image{order:-1}.activity-steps{grid-template-columns:1fr}}@media(max-width:440px){.grid.two,.grid.four{grid-template-columns:1fr 1fr;gap:9px}.card-click{min-height:122px;padding:13px}.card-click strong{font-size:13px}.card-click .pic{font-size:28px}.pad{padding:17px}.actions button,.actions .btn{flex:1}.wrap{padding:19px 12px 60px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

[hidden]{display:none!important}

/* V1.12 approved recovery mini-experiences */
.guided-panel{margin-top:20px}.guided-message{font-size:18px;line-height:1.5;color:#f5eddb;min-height:56px}.mini-illustration{float:right;font-size:40px;background:linear-gradient(145deg,#23452d,#081910);border:1px solid #497354;width:75px;height:75px;border-radius:50%;display:grid;place-items:center;margin-left:12px}.breath-ring{will-change:transform}#activeRecovery .actions button{font-size:13px}#moveClock,#sleepGuideClock{font-variant-numeric:tabular-nums}

/* V1.12 refined: temperatures, evidence-aware recovery and five-question body check-in */
.temperature-hero{margin:19px 0 17px;min-height:148px;display:grid;grid-template-columns:1fr 80px 1fr;align-items:stretch;border-radius:16px;overflow:hidden;border:1px solid rgba(156,222,165,.3);background:linear-gradient(100deg,#452718,#103425 48%,#102d3d)}
.temp-side{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3px;text-align:center;padding:15px 6px}.temp-side span{font-size:36px;font-weight:900;line-height:1}.temp-side strong{font-size:20px;letter-spacing:3px;color:var(--cream)}.temp-side small{color:#d4e1d3;font-size:11px;letter-spacing:1.5px}.temp-hot span{color:#f2bc67}.temp-cold span{color:#a4d7f2}.temp-center{display:grid;place-items:center;background:linear-gradient(90deg,transparent,rgba(116,178,139,.19),transparent)}.temp-wave{font-family:serif;font-size:66px;font-weight:600;color:#b6e9d0;transform:rotate(90deg)}
.intro-mini{margin-bottom:4px;color:#e1eadd}.temperature-tabs{margin:12px 0 18px}.temperature-guide{border-left:3px solid #6cbf85;background:linear-gradient(115deg,#0c2a1a,#07170e);padding:19px 20px;border-radius:0 14px 14px 0}.temperature-guide h3{font-size:clamp(20px,3vw,26px);color:#f7f0dd}.temperature-guide p{line-height:1.65}.temperature-guide .ey{letter-spacing:2.5px}.example-card{padding:14px 17px;border:1px solid #42684b;border-radius:12px;background:rgba(16,49,29,.88);margin:15px 0}.example-card b{color:#b1e6b5}.example-card ol{padding-left:23px;margin:11px 0}.example-card li{padding:4px 0;line-height:1.55}.example-card p{margin:10px 0 1px}.safety-line{font-size:13px;border-top:1px solid #3a6544;padding-top:10px;color:#d6cda9}.contrast-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.contrast-steps div{display:flex;flex-direction:column;gap:5px;background:#0f2b1e;border:1px solid #486e57;border-radius:12px;padding:15px}.contrast-steps b{font-size:13px;color:#b8e7b3}.contrast-steps strong{color:#f2dfaa}.contrast-steps span{font-size:13px;line-height:1.45;color:#d4e4d8}.recovery-disclaimer{border-top:1px solid #31523a;padding-top:15px;margin-top:20px}.lead-slim{letter-spacing:2px;color:#e2bd75;font-size:13px;font-weight:800;margin:6px 0}.checkin-question{margin:0 0 14px;border:1px solid #355a3f;border-radius:14px;padding:14px 15px 16px;background:linear-gradient(120deg,#0e2b1b,#091c12);min-inline-size:0}.checkin-question legend{font-size:clamp(16px,2vw,19px);font-weight:750;line-height:1.3;color:#f3ead9;padding:0 7px}.checkin-question legend span{padding-right:3px}.choices{display:flex;gap:10px;flex-wrap:wrap;padding-top:7px}.choices label{flex:1 1 166px;cursor:pointer;display:block;min-width:0}.choices input{position:absolute;opacity:0;width:1px;height:1px}.choices label span{display:block;text-align:center;padding:12px 9px;font-size:13px;font-weight:650;color:#e9f3e6;border:1px solid #4d7d5a;border-radius:10px;background:#112f1e;min-height:48px;line-height:1.4}.choices input:checked+span{background:#418557;border-color:#b2e6b4;box-shadow:0 0 0 1px #a0daa6 inset;color:white}.choices input:focus-visible+span{outline:3px solid #f1cc82;outline-offset:3px}.question-hint{font-size:13px;margin:2px 0 4px;max-width:790px}.result-panel{margin-top:22px;background:linear-gradient(130deg,#1d482a,#0b2417);border:1px solid #89cd98;border-radius:17px;padding:22px;outline:none}.result-panel h3{color:#f4f0df;font-size:22px;margin:8px 0}.result-small{font-weight:700;color:#ade2ac}.result-panel:focus{box-shadow:0 0 0 2px #6eaa77}
@media(max-width:600px){.temperature-hero{grid-template-columns:1fr 42px 1fr;min-height:122px}.temp-side strong{font-size:16px}.temp-side small{font-size:9px}.temp-side span{font-size:27px}.temp-wave{font-size:46px}.temperature-guide{padding:14px 13px}.contrast-steps{grid-template-columns:1fr}.contrast-steps div{padding:11px}.choices label{flex-basis:100%}.choices label span{text-align:left;font-size:14px}.temperature-tabs button{flex-grow:1}}

/* V1.13 mobile tree: see the picture change as you choose each stage */
.tree-mobile-stages{display:none}
@media(max-width:770px){
  body[data-page="tree"] .stage-grid{gap:10px;align-items:stretch}
  body[data-page="tree"] .stage-grid .hero-image{margin:0;align-self:stretch}
  body[data-page="tree"] .growth svg{max-height:300px}
  .tree-mobile-stages{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:0 0 9px}
  .tree-mobile-stages button{padding:7px 1px;min-width:0;min-height:55px;display:flex;flex-direction:column;gap:0;border-radius:10px;font-size:10px;letter-spacing:.1px;line-height:1.2;white-space:normal}
  .tree-mobile-stages button span{font-size:21px;display:block;line-height:1.3}
  .tree-mobile-stages button[aria-pressed="true"]{border-color:#f1cd83;background:#346f40;box-shadow:inset 0 0 0 1px #b2eab8}
  body[data-page="tree"] .stage-grid .glass.pad{padding:18px}
}
@media(max-width:360px){.tree-mobile-stages{gap:3px}.tree-mobile-stages button{font-size:9px;padding-inline:1px}}
