nav.app-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:5px;padding:9px 6px calc(9px + env(safe-area-inset-bottom));background:#151515f5;color:white;z-index:10;line-height:1.35;border-top:1px solid #ffffff30}
nav.app-nav button,nav.app-nav a{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;background:transparent;color:white;border:1px solid #ffffff50;border-radius:14px;min-height:56px;min-width:0;flex:1;max-width:150px;padding:6px 3px;font:12px/1.35 system-ui,sans-serif;text-align:center;text-decoration:none;cursor:pointer}
nav.app-nav span{display:block;font-size:21px;line-height:1.2;margin:0}
nav.app-nav button:first-child{background:#e5be65;color:#111}
nav.app-nav button:hover,nav.app-nav a:hover{background:#ffffff25}
nav.app-nav button:first-child:hover{background:#f0ce80}
nav.app-nav :focus-visible{outline:3px solid #e5be65;outline-offset:2px}

body{padding-bottom:calc(100px + env(safe-area-inset-bottom))}
#journal,#moduleExplanation,#moduleOptions{box-sizing:border-box;width:min(620px,calc(100% - 24px));max-height:85svh;overflow:auto;padding:20px;border:1px solid #aaa;border-radius:20px;background:#f8faf5;color:#26443b}
.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.dialog-head h2{margin:0;font:700 22px system-ui}
#journal textarea{width:100%;min-height:120px;box-sizing:border-box}
#journal button,#moduleExplanation button,#moduleOptions button{padding:10px;border:1px solid #aaa;border-radius:10px;background:#fff;color:#26443b}
#modules .activity-art{font-size:30px}
.page-tabs{display:flex;gap:5px;justify-content:center;margin:12px auto;max-width:680px;flex-wrap:wrap}
.page-tabs .nav-button{flex:1;min-width:70px}
