:root{color-scheme:light;--ink:#261634;--muted:#5d4e65;--dark:#241433;--pine:#45285b;--page:#f8f4ee;--paper:#fffcf8;--line:#e7dce4;--lime:#ffd6a0;--sage:#f0e9fb;--rust:#9b432f;--shadow:0 12px 34px #321e4310;font-family:system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--page);color:var(--ink);line-height:1.55;min-width:280px}
.shell{max-width:850px;margin:auto;min-height:100dvh;padding:0 26px 104px}
.masthead{height:84px;display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
button,input,select,textarea{font:inherit}
button{color:inherit;cursor:pointer;min-height:46px}
button[disabled]{cursor:default;opacity:.55}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #8052bb;outline-offset:3px}
.brand{display:flex;gap:11px;align-items:center;padding:0;background:none;border:0;font-size:23px;font-weight:850;letter-spacing:-.055em;text-align:left;line-height:1}
.brand-sub{display:block;font-size:9px;letter-spacing:.18em;margin-top:5px;font-weight:800;color:#695776}
.settings,.small-icon{display:grid;place-items:center;border:1px solid var(--line);width:46px;height:46px;border-radius:14px;background:var(--paper)}
.icon{width:21px;height:21px;display:inline-block;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
main:focus,h1:focus,h2:focus{outline:none}
h1,h2,h3,p{margin:0}
h1{font-size:clamp(35px,6vw,60px);letter-spacing:-.06em;line-height:1.03;font-weight:780}
h2{font-size:clamp(23px,4vw,31px);line-height:1.14;letter-spacing:-.035em}
h3{font-size:18px;line-height:1.25;letter-spacing:-.025em}
p{margin-top:8px}
.muted,.subtext{color:var(--muted)}
.subtext{font-size:.9rem}
.eyebrow{font-size:11px;line-height:1.4;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:var(--muted);display:block;margin-bottom:10px}
.hero{overflow:hidden;border-radius:27px;background:var(--paper);box-shadow:0 16px 44px #2f153324}
.hero-art{min-height:clamp(228px,41vw,344px);display:flex;align-items:flex-end;color:#fff9f2;background-color:#3d1d4c;
  background-image:linear-gradient(90deg,#241135d9 0%,#2c143a82 47%,#26113504 82%),url("./summit-dusk.jpg");
  background-position:center,center 46%;background-size:cover;padding:clamp(20px,5vw,42px)}
.hero-copy{max-width:475px}
.hero h1{max-width:11ch;font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:clamp(39px,7.8vw,68px);letter-spacing:-.052em;line-height:.98;text-wrap:balance}
.hero-kicker{display:inline-flex;align-items:center;gap:7px;color:#fff2e6;background:#321641d9;padding:5px 10px;border:1px solid #ffffff35;border-radius:20px;margin-bottom:13px;font-size:.72rem;font-weight:750;letter-spacing:.03em}
.hero-kicker span{width:7px;height:7px;border-radius:50%;background:#ffc186}
.hero-action{display:flex;gap:18px;justify-content:space-between;align-items:center;padding:17px clamp(18px,4vw,29px)}
.hero-action p{max-width:43ch;color:var(--muted);margin:4px 0 0;font-size:.95rem}
.session-length{display:inline-flex;align-items:center;gap:6px;font-size:.77rem;font-weight:800;color:#6e3d60}
.session-length .icon{width:16px;height:16px}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;align-items:center}
.btn{border:1px solid transparent;border-radius:13px;padding:10px 17px;font-weight:750;display:inline-flex;justify-content:center;align-items:center;gap:9px;text-decoration:none;min-height:46px;text-align:center}
.primary{background:var(--pine);color:#fffef6}
.hero .primary{background:#ffc493;color:#331b39;min-height:51px;white-space:nowrap}
.secondary{background:var(--paper);border-color:var(--line)}
.quiet{background:transparent;border-color:transparent;color:var(--muted)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:27px 0 12px}
.section-heading .eyebrow{margin-bottom:5px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{border:1px solid var(--line);background:var(--paper);border-radius:19px;padding:20px;box-shadow:var(--shadow);min-width:0}
.tile-icon{display:grid;place-items:center;width:41px;height:41px;border-radius:12px;background:var(--sage);color:var(--pine);margin-bottom:13px}
.tile-icon.warm{background:#f4e8d9;color:#824725}
.tile-icon.lime{background:#eef6cd}
.tag{border-radius:20px;background:var(--sage);padding:4px 10px;font-size:.77rem;font-weight:740;color:var(--pine);display:inline-block}
.nav-inner{display:flex;justify-content:center;gap:6px;background:#261634;max-width:525px;margin:auto;padding:5px 8px;border:1px solid #4a3259;border-radius:21px;box-shadow:0 8px 25px #23123147}
nav{position:fixed;z-index:4;bottom:0;left:0;right:0;padding:8px 12px max(10px,env(safe-area-inset-bottom));pointer-events:none;background:linear-gradient(transparent,var(--page) 26%)}
nav[hidden]{display:none}
nav button{pointer-events:auto;flex:1;background:transparent;border:0;border-radius:15px;font-size:.73rem;font-weight:700;padding:6px 4px;color:#eee0f6;line-height:1.25}
nav .icon{display:block;margin:0 auto 3px}
nav button[aria-current="page"]{background:#f7d5b9;color:var(--ink)}
.quick-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.quick-card{min-height:105px;padding:15px;border:1px solid transparent;border-radius:21px;text-align:left;display:flex;align-items:center;gap:12px}
.quick-coach{background:#eadbfa;border-color:#e4d0f6}
.quick-route{background:#fbe3d6;border-color:#f1d6c6}
.quick-picture{position:relative;display:grid;place-items:center;border-radius:16px;width:58px;height:58px;background:#673d85;color:#fff3ff;flex:none;overflow:hidden}
.quick-route .quick-picture{background:#9a453e;color:#ffe7cf}
.quick-picture::before{position:absolute;content:"";width:48px;height:48px;border:1px solid #ffffff58;border-radius:50%;transform:translate(21px,-21px)}
.quick-picture .icon{width:28px;height:28px;position:relative}
.quick-text strong,.quick-text small{display:block}
.quick-text strong{font-size:1.05rem;line-height:1.2;letter-spacing:-.025em}
.quick-text small{color:#5a475f;margin-top:4px;font-size:.78rem;line-height:1.25}
.quick-arrow{margin-left:auto}
.quick-arrow .icon{width:16px;height:16px}
.rhythm{display:flex;gap:12px;align-items:center;margin-top:13px;padding:13px 14px;background:#fffcf7;border:1px solid var(--line);border-radius:18px}
.rhythm-icon,.coach-badge{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:#f4e9d5;color:#7b513d;flex:none}
.rhythm p{margin-top:3px;font-size:.85rem;color:var(--muted)}
.coach-intro{display:flex;align-items:center;gap:15px;padding:16px 19px;border-radius:22px;background:#eadbfa;margin-bottom:14px}
.coach-intro .page-title{margin:0}
.coach-badge{background:#45285b;color:#ffdbb0;width:54px;height:54px;border-radius:17px}
.path-card{position:relative;isolation:isolate;overflow:hidden;border-radius:23px;background:#2d193e;color:#fff7f2;padding:clamp(15px,4vw,24px);box-shadow:var(--shadow)}
.path-sky{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#271535ed,#261432ad),url("./summit-dusk.jpg") 67% 50%/cover}
.path-stops{position:relative;display:grid;gap:9px;padding:0;margin:0;list-style:none}
.path-stops::before{position:absolute;content:"";left:37px;top:31px;bottom:31px;border-left:2px dashed #f8d1b17a}
.path-stop{position:relative;display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid #ead6f033;border-radius:15px;background:#3e244ddd}
.path-number{display:grid;place-items:center;width:47px;height:45px;border-radius:13px;flex:none;color:#30173c;background:#ffc49c;font-size:.85rem;font-weight:850}
.path-stop p{margin:2px 0 0;color:#f0dff1;font-size:.82rem}
.path-label{margin-left:auto;border-radius:12px;background:#ead8f8;color:#45285b;padding:3px 7px;font-size:.67rem;font-weight:800;white-space:nowrap}
.page-title{margin:8px 0 20px}
.page-title h1{font-size:clamp(32px,6vw,49px)}
.page-title p{max-width:51ch}
.study{max-width:640px;margin:auto}
.study-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.study-top .eyebrow{margin:0}
.meter{display:block;height:8px;width:100%;border:0;border-radius:8px;overflow:hidden;appearance:none;background:var(--sage)}
.meter::-webkit-progress-bar{background:var(--sage)}
.meter::-webkit-progress-value{background:#785098;border-radius:8px}
.study .card{margin-top:14px;padding:clamp(16px,4vw,28px)}
.study h1{font-size:clamp(25px,5vw,36px);letter-spacing:-.045em;line-height:1.13;overflow-wrap:anywhere}
.passage,.support,.feedback,.recall{background:#f3edf9;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-top:14px}
.passage{border-left:4px solid #8a65ab}
.passage p,.feedback p,.support p{margin:0}
.listen-row{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.listen-row .btn{font-size:.9rem;padding:8px 11px}
.choices{display:grid;gap:8px;margin-top:15px}
.choice{display:flex;gap:12px;align-items:center;text-align:left;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:9px 11px;font-weight:650}
.choice[aria-pressed="true"]{border-color:#785098;background:#f1e9fb;box-shadow:inset 0 0 0 1px #785098}
.choice strong{display:grid;place-items:center;background:var(--sage);border-radius:8px;min-width:31px;height:30px;font-size:.8rem}
.choice:disabled{opacity:1}
.feedback{border-color:#d3c0e4}
.feedback.miss{background:#f8efe5;border-color:#e4c9b3}
.confidence{border:0;margin:13px 0 0;padding:0}
.confidence legend{font-size:.85rem;color:var(--muted);font-weight:700}
.confidence label{display:inline-flex;align-items:center;margin:0 12px 0 0;min-height:44px;gap:5px}
.diagram{display:block;margin:14px 0 0;width:105px;height:86px;background:var(--sage);border-radius:12px;color:var(--pine)}
.figure-pieces{display:flex;gap:18px;width:fit-content;max-width:100%;height:auto;padding:10px 14px}
.figure-pieces>div{display:grid;gap:6px;align-content:start;justify-items:center;font-size:.77rem;font-weight:750}
.figure-grid{display:block;max-width:100%;height:auto;flex:none}
.figure-options{grid-template-columns:repeat(2,minmax(0,1fr))}
.figure-options>p{grid-column:1/-1}
.figure-options .choice{gap:8px;min-height:92px}
.figure-options .choice>span{min-width:0}
.figure-solution{margin-top:12px}
.stack{display:grid;gap:12px}
.reminder-section{margin-top:12px}
.coach-plan{background:#f0e9fb;border-color:#e2d2f3}
.coach-plan h2{margin-top:9px}
.details{display:flex;gap:12px;align-items:flex-start}
.details .tile-icon{flex:none;margin:0}
.settings-form label{display:block;font-weight:700;margin:13px 0 5px}
.settings-form select,.settings-form input,.composer textarea{display:block;width:100%;min-height:46px;border:1px solid #a6b8aa;background:var(--paper);color:var(--ink);padding:9px 11px;border-radius:10px}
.settings-form input[type=checkbox]{display:inline-block;width:auto;min-height:0;margin-right:6px}
summary{cursor:pointer;font-weight:750;min-height:44px;padding-top:10px}
.message{padding:13px 16px;border-radius:16px;background:var(--sage);max-width:88%;white-space:pre-wrap;overflow-wrap:anywhere}
.message.user{background:var(--pine);color:white;justify-self:end}
.composer{margin-top:13px}
.composer textarea{resize:vertical}
a{color:#643985;text-underline-offset:3px}
#notice{position:fixed;bottom:80px;left:50%;transform:translateX(-50%);max-width:min(90%,390px);padding:9px 14px;border-radius:10px;background:var(--dark);color:white;z-index:10;box-shadow:var(--shadow)}
#notice:empty{display:none}
.large main{font-size:1.18rem}
.large .subtext,.large .confidence legend{font-size:1rem}
@media(max-width:590px){
  .masthead{height:64px;margin-bottom:9px}
  .hero{border-radius:23px}
  .hero-art{background-position:center,67% 50%;min-height:221px}
  .hero-action{align-items:stretch;flex-direction:column;gap:12px}
  .hero-action .btn{width:100%}
  .grid{grid-template-columns:1fr}
  .grid .card{padding:15px}
  .section-heading{margin-top:20px}
  .quick-card{min-height:95px;padding:12px;gap:8px}
  .quick-picture{width:38px;height:38px;border-radius:11px}
  .quick-picture .icon{width:21px;height:21px}
  .quick-arrow{display:none}
  .quick-text strong{font-size:.96rem}
}
@media(max-width:350px){
  .quick-card{align-items:flex-start;flex-direction:column}
}
@media(max-width:590px){
  .shell{padding:max(0px,env(safe-area-inset-top)) max(15px,env(safe-area-inset-right)) calc(86px + env(safe-area-inset-bottom)) max(15px,env(safe-area-inset-left))}
  .settings-form input,.composer textarea{font-size:16px}
}