/* Only the active tab panel contributes height. This keeps About me unchanged while allowing
   the shorter Side Quests panel to pull the deeper-personal CTA naturally upward. */
.intro-page .personal-browse{display:block;margin:45px 0 50px;position:relative}
.personal-browse> [role=tabpanel]{min-width:0}
.personal-browse> [aria-hidden=true]{display:none;pointer-events:none}
.intro-page .personal-browse .intro-cards{display:flex;overflow-x:auto;scroll-snap-type:x proximity;overscroll-behavior-x:contain;gap:22px;width:100%;margin:0;padding:0 0 8px;transform:none;scrollbar-width:thin;scrollbar-color:#bdc8d2 transparent}
.intro-page .personal-browse .intro-card{flex:0 0 calc((100% - 44px)/2.7);box-sizing:border-box;scroll-snap-align:start}
.personal-browse-bar{height:38px;display:flex;align-items:center;justify-content:space-between;gap:8px;position:relative;margin-bottom:-38px;top:5px}
.personal-browse-bar [role=tablist]{display:flex;gap:5px}
.personal-browse-bar button{font:600 17px 'Barlow Condensed',sans-serif;color:#52637a;cursor:pointer}
.personal-browse-bar [role=tab]{border:1px solid transparent;border-radius:99px;padding:7px 13px;background:transparent;white-space:nowrap}
.personal-browse-bar [aria-selected=true]{background:#eef1f6;border-color:#ccd6e0;color:#253e59}
.personal-browse-controls{display:flex;gap:7px}
.personal-browse-controls button{width:36px;height:36px;border:1px solid #cdd6df;border-radius:50%;background:#fff;font-size:24px}
.personal-browse-controls button:disabled{opacity:.3;cursor:default}
.quest-intro{font:400 16px/1.4 Barlow,sans-serif;color:#617087;margin:0 0 14px}
.quest-rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x proximity;overscroll-behavior-x:contain;padding:0 0 10px;scrollbar-width:thin;scrollbar-color:#c7baa0 transparent}
.quest-card{flex:0 0 min(330px,84%);box-sizing:border-box;display:flex;flex-direction:column;align-items:flex-start;text-align:left;min-height:215px;padding:22px;border:1px solid #ddd0b6;border-radius:23px;background:linear-gradient(145deg,#fcf7e9,#f6f0e4);color:#35445b;cursor:pointer;scroll-snap-align:start;box-shadow:0 4px 12px #45382005}
.quest-card:hover{border-color:#ae9160;background:#fbf3df}
.quest-card h3{font:600 27px/1.14 'Barlow Condensed',sans-serif;margin:0 0 13px;color:#55472f}
.quest-card p{font:400 16px/1.5 Barlow,sans-serif;margin:0 0 20px;color:#625d53}
.quest-card .quest-action{font:600 16px Barlow,sans-serif;color:#755a29;margin-top:auto}
.quest-dialog{padding:0;border:1px solid #d9dfe5;border-radius:24px;width:min(760px,calc(100vw - 64px));height:min(820px,calc(100dvh - 64px));max-height:none;max-width:none;background:#fcfbf8;color:#35445b;box-shadow:0 24px 90px #15243755;overflow:hidden}
.quest-dialog::backdrop{background:#18263599;backdrop-filter:blur(3px)}
.quest-reader{height:100%;display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.quest-reader-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid #e4dfd4;font:600 16px Barlow,sans-serif;color:#756345}
.quest-count{font-weight:400;color:#7b7d80;margin-left:8px}
.quest-dialog button{cursor:pointer;font:600 15px/1.35 Barlow,sans-serif;color:#415974;background:#f1f3f5;border:1px solid #d9dfe5;border-radius:10px;padding:10px 13px;min-height:44px}
.quest-dialog button:disabled{opacity:.4;cursor:default}
.quest-dialog .quest-close{background:transparent;color:#394c62}
.quest-close span{margin-left:8px;font-size:22px;line-height:1}
.quest-story{overflow-y:auto;overscroll-behavior-y:contain;padding:32px clamp(24px,5vw,64px) 45px;scrollbar-gutter:stable;outline-offset:-4px}
.quest-eyebrow{font:600 12px Barlow,sans-serif;text-transform:uppercase;letter-spacing:1.5px;color:#8b7144;margin:0 0 12px}
.quest-story h2{font:600 clamp(34px,5vw,44px)/1.08 'Barlow Condensed',sans-serif;color:#2c4664;margin:0 0 28px}
.quest-prose p{font:400 18px/1.65 Barlow,sans-serif;margin:0 0 17px}
.intro-page .quest-reader-footer{max-width:none;margin:0;padding:12px 24px;display:flex;gap:12px;justify-content:space-between;border-top:1px solid #e4dfd4}
.personal-browse button:focus-visible,.personal-browse-bar button:focus-visible,.quest-dialog button:focus-visible{outline:3px solid #5482aa;outline-offset:3px}
@media(min-width:1000px){.intro-page .personal-browse{width:min(1360px,calc(100vw - 48px));margin-left:50%;transform:translateX(-50%)}.personal-browse-bar{width:min(1360px,calc(100vw - 48px));margin-left:50%;transform:translateX(-50%)}}
@media(max-width:700px){
.personal-browse-bar{top:auto;height:38px;margin:30px 0 10px}
.intro-page .personal-browse{margin:0 -22px 38px}
.intro-page .personal-browse .intro-cards{gap:14px;padding:0 22px 8px;box-sizing:border-box;scrollbar-width:none}
.intro-page .personal-browse .intro-card,.intro-page .personal-browse .intro-card:first-child{flex-basis:calc(100vw - 44px)}
#side-quests{padding:0 22px;box-sizing:border-box}
.quest-rail{margin-right:-22px;padding-right:22px}
.quest-card{flex-basis:calc(100vw - 70px);min-height:215px}
.quest-dialog{width:calc(100vw - 12px);height:calc(100dvh - 12px);border-radius:18px;margin:auto}
.quest-reader-header{padding:10px 16px}.quest-story{padding:24px 21px 32px}
.intro-page .quest-reader-footer{padding:10px 12px;padding-bottom:max(10px,env(safe-area-inset-bottom));gap:8px}
.quest-reader-footer button{max-width:49%;font-size:14px;padding:10px}
}
@media(prefers-reduced-motion:reduce){.quest-rail,.intro-cards{scroll-behavior:auto}}

/* Direct Side Quests links keep the collection primary while letting the deeper-personal CTA begin within the same mobile view. */
@media(max-width:700px){
body.intro-page.side-quests-direct-entry .personal-browse-bar{margin-top:8px}
body.intro-page.side-quests-direct-entry .personal-browse{margin-bottom:12px}
body.intro-page.side-quests-direct-entry #side-quests .quest-intro{margin-bottom:8px}
body.intro-page.side-quests-direct-entry .longer-note{margin-top:0}
}