html { scroll-behavior:smooth; scroll-padding-bottom:95px; }
body.journey { --side:0px; }
body.journey .app-layout { display:block; max-width:none; }
body.journey main { width:100%; max-width:1300px; margin:auto; padding:32px 40px 100px; }
body.journey .topbar { height:78px; background:var(--bg); }
body.journey .mobile-menu { display:grid !important; }
body.journey .sidebar { position:fixed; top:78px; bottom:0; left:0; height:calc(100dvh - 78px); min-height:0; width:290px; padding:30px 22px; display:flex; flex-direction:column; align-items:stretch; gap:0; border-right:1px solid var(--line); background:var(--paper); z-index:40; transform:translateX(-100%); visibility:hidden; overflow:auto; box-shadow:20px 0 60px #0002; }
body.journey.menu-open .sidebar { transform:translateX(0); visibility:visible; }
body.journey .sidebar nav { display:flex; flex-direction:column; margin:0; gap:5px; }
body.journey .sidebar .nav-item { font-size:12px; padding:13px 12px; gap:12px; }
body.journey .sidebar .nav-item .icon,body.journey .sidebar .nav-item small { display:block; }
body.journey .sidebar-label,body.journey .sidebar-bottom { display:block; }
body.journey .project-brand { width:auto; height:auto; margin:0 8px 26px; align-items:flex-start; gap:14px; }
body.journey .project-brand img { max-width:180px; max-height:100px; object-fit:contain; }
body.journey[data-theme=mellow] .sidebar { background:#4d2c3b; }
.story-section { scroll-margin-top:110px; outline:none; }
.story-chapter { position:relative; padding-top:56px; margin-top:90px; border-top:1px solid var(--line); }
.chapter-marker { display:flex; align-items:center; gap:25px; margin-bottom:46px; }
.chapter-marker > span { font:80px/.9 Georgia,serif; letter-spacing:-5px; color:var(--accent); opacity:.5; }
.chapter-marker > div { display:flex; flex-direction:column; gap:7px; }
.chapter-marker small { font-size:8px; letter-spacing:2px; color:var(--muted); }
.chapter-marker strong { font-size:15px; font-weight:500; }
.chapter-marker > a { margin-left:auto; width:42px; height:42px; border:1px solid var(--line); border-radius:50%; display:grid; place-items:center; font-size:18px; }
.chapter-marker > a:hover { background:var(--soft); }
.story-chapter .page-breadcrumb,.story-chapter .section-heading > .eyebrow { display:none; }
.story-chapter .section-heading h2 { font-size:clamp(35px,4.2vw,60px); font-weight:500; letter-spacing:-2px; max-width:900px; margin:0 0 22px; line-height:1.13; }
.story-chapter .section-heading > p { max-width:650px; }
.story-chapter .section-heading { margin-bottom:35px; }
body.journey #store { padding:40px; border:1px solid var(--line); background:var(--paper); box-shadow:0 20px 70px #00000006; }
body.journey #store .chapter-marker { margin-bottom:35px; }
body.journey #next { padding:45px 40px; background:var(--soft); border-top:0; border-radius:4px; }
.journey-guide { position:fixed; z-index:35; bottom:20px; left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:22px; padding:12px 16px; border:1px solid var(--line); background:var(--paper); color:var(--ink); box-shadow:0 8px 35px #0002; border-radius:50px; max-width:calc(100% - 32px); }
.journey-dots { display:flex; gap:4px; }
.journey-dots a { width:29px; height:29px; border-radius:50%; display:grid; place-items:center; color:var(--muted); font-size:9px; }
.journey-dots a.active { background:var(--accent); color:white; }
.journey-dots a:hover { box-shadow:inset 0 0 0 1px var(--accent); }
#journey-label { font-size:10px; white-space:nowrap; max-width:200px; overflow:hidden; text-overflow:ellipsis; }
#journey-next { display:flex; align-items:center; gap:16px; font-size:10px; white-space:nowrap; padding:0 8px 0 20px; border-left:1px solid var(--line); }
#journey-next .icon { width:16px; height:16px; }
body.journey[data-theme=standard] .chapter-marker > span { font-family:Consolas,monospace; }
body.journey[data-theme=standard] .journey-dots a.active { color:#17210c; }
body.journey[data-theme=lemon] #store { border-radius:6px 60px 6px 6px; }
body.journey[data-theme=provision] .chapter-marker { border-bottom:3px double var(--line); padding-bottom:25px; }
body.journey[data-theme=bm] .chapter-marker > span { font-family:Impact,sans-serif; letter-spacing:0; color:#f19a55; }
body.journey[data-theme=fierro] .chapter-marker > span { font-style:italic; }
@media(max-width:900px) {
  body.journey main { padding:28px 26px 100px; }
  body.journey #store { padding:28px; }
  #journey-label { display:none; }
  .journey-guide { gap:12px; }
}
@media(max-width:700px) {
  body.journey .topbar { height:68px; padding:0 16px; }
  body.journey .sidebar { top:68px; height:calc(100dvh - 68px); width:270px; }
  body.journey main { padding:25px 20px 95px; }
  .story-section { scroll-margin-top:90px; }
  .story-chapter { margin-top:65px; padding-top:30px; }
  .chapter-marker { gap:18px; margin-bottom:32px; }
  .chapter-marker > span { font-size:58px; letter-spacing:-3px; }
  .chapter-marker small { font-size:7px; letter-spacing:1.5px; }
  .chapter-marker strong { font-size:12px; }
  .chapter-marker > a { width:34px; height:34px; }
  .story-chapter .section-heading h2 { font-size:37px; letter-spacing:-1.5px; }
  .story-chapter .section-heading > p { font-size:12px; }
  body.journey #store { padding:24px 16px; margin-left:-7px; margin-right:-7px; }
  body.journey #next { padding:28px 20px; }
  .journey-guide { bottom:12px; padding:8px 10px; gap:8px; max-width:calc(100% - 20px); }
  .journey-dots { gap:2px; }
  .journey-dots a { width:25px; height:29px; font-size:8px; }
  #journey-next { font-size:0; gap:0; padding:0 10px; }
  #journey-next .icon { width:19px; height:19px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
