/* A shared, centered 44px control; page owners retain their layout and behavior. */
body .ui-nav-control{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;box-sizing:border-box;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;padding:0;margin:0;border:1px solid #8aabb877;border-radius:13px;background:#234454;color:#f5deb0;line-height:1;vertical-align:middle}
body .ui-nav-control>svg{display:block;flex:none;width:24px;height:24px;margin:0;padding:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transform:none}
body .ui-nav-control:focus-visible{outline:2px solid #ffe2a6;outline-offset:3px}
body .ui-page-header{display:flex;align-items:center;justify-content:flex-start;gap:12px}
.ui-page-header>div{min-width:0}.ui-page-header>div:last-child{flex:1}
body .skill-detail .skill-close{align-self:flex-start}
body .camp-settings-dialog .ui-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.ui-dialog-header h2{margin:0;min-width:0}
body .camp-settings-dialog[data-ui-surface=modal]>.ui-nav-control{position:absolute;top:16px;right:16px}
body .camp-settings-dialog[data-ui-surface=modal]:has(>.ui-nav-control:not([hidden])){padding-top:70px}
body .ui-nav-control[hidden]{display:none}
#modal:has(.collection-panel[data-ui-surface=page]){padding:0}
#modal:has(.training-page[data-ui-surface=page]){padding:0}
.training-page[data-ui-surface=page]{width:min(100%,620px);height:100dvh;max-height:100dvh;margin:auto;border-radius:0!important;overflow:auto;overscroll-behavior:contain;box-sizing:border-box}
.collection-panel[data-ui-surface=page]{width:min(100%,620px);height:100dvh;max-height:100dvh;margin:auto;border-radius:0!important;overflow:auto;overscroll-behavior:contain;box-sizing:border-box}
.collection-panel[data-ui-surface=page]:before{display:none}
.training-page[data-ui-surface=page]:before{display:none}
.training-page>.ui-page-header{margin-bottom:16px}.training-page>.ui-page-header h2{margin:0;font-size:30px;line-height:1.15}
.training-page>.panel-emblem{display:none}.training-page>.ui-page-header .eyebrow{display:block;margin-bottom:5px;font-size:11px;letter-spacing:.08em}
.training-page>.actions:empty{display:none}
.collection-panel[data-ui-surface=page]>.collection-heading{position:sticky;top:-20px;background:#183542;z-index:2;padding-block:12px;border-bottom:1px solid #8aabb844}
.camp-signature>.hero-manage{grid-column:1/-1;align-items:stretch;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:10px;margin-top:10px}
.camp-signature .hero-manage>button{flex:1 1 0;min-width:0;width:auto;min-height:48px;margin:0;padding:10px 8px;justify-content:center;text-align:center;font:600 14px/1.3 var(--body,Arial,sans-serif)}
.camp-signature .hero-manage .camp-icon{flex:none;width:26px;height:26px}
.camp-signature .hero-manage #heroJoiningStory{justify-content:center;width:auto;margin:0;min-height:48px;font-weight:600}
.campaign-alternative[data-preview-buy]{display:flex;align-items:center;justify-content:center;gap:8px}
.coach-demo .nav-illustration,.guide-demo .nav-illustration{width:32px;height:32px}

/* Full-screen destinations own their header and exactly one scrolling body. */
body #modal:has([data-ui-surface=page]){padding:0;overflow:hidden;align-items:stretch}
body .collection-panel[data-ui-surface=page]{display:flex;flex-direction:column;padding:0!important;overflow:hidden;border:0;max-height:100dvh;box-shadow:none}
body .collection-panel[data-ui-surface=page]>.collection-heading{position:relative;top:0;flex:none;margin:0;padding:max(14px,env(safe-area-inset-top)) 16px 14px;background:#173544;border-bottom:1px solid #7896a344;box-sizing:border-box}
body .collection-heading h2{font-size:28px;line-height:1.15;margin:4px 0 0}
body .collection-heading small{font:11px/1.3 var(--body,Arial,sans-serif);letter-spacing:.09em}
.collection-content{min-height:0;overflow:auto;overscroll-behavior:contain;scroll-padding:12px;padding:16px 18px max(24px,env(safe-area-inset-bottom))}
.collection-content .collection-intro{margin:0 0 16px;font:14px/1.5 var(--body,Arial,sans-serif);color:#c2d6d8}
body .training-page[data-ui-surface=page]{display:flex;flex-direction:column;padding:0;overflow:hidden;border:0;max-height:100dvh;box-shadow:none}
body .training-page>.ui-page-header{position:relative;flex:none;z-index:2;margin:0;padding:max(14px,env(safe-area-inset-top)) 16px 14px;background:#173544;border-bottom:1px solid #7896a344}
.training-content{min-height:0;overflow:auto;overscroll-behavior:contain;padding:16px 18px 24px}
.training-content>.panel-emblem,.training-content>.actions:empty{display:none}

/* All selection states reserve the same border, art and label geometry. */
body .heroes-open .camp-roster .roster{grid-auto-rows:1fr}
body .heroes-open .camp-roster .hero{box-sizing:border-box;border-width:2px;padding:8px 4px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:4px;min-height:132px}
body .heroes-open .camp-roster .hero canvas{flex:none;display:block;width:100%;height:76px;object-fit:contain}
body .heroes-open .camp-roster .hero h3{font:600 14px/1.25 var(--body,Arial,sans-serif);margin:0;min-height:18px}
body .heroes-open .camp-roster .hero .hero-lock{font:11px/1.25 var(--body,Arial,sans-serif);margin:0}
body .camp-signature .hero-manage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row;gap:10px;padding:0;margin:12px 0 0}
body .camp-signature .hero-manage>button{width:100%;min-width:0;min-height:48px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 8px;margin:0}
body .camp-signature .hero-manage>button:only-child{grid-column:1/-1}
body .camp-stage .change-hero{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-height:44px;margin:0;padding:8px 12px;gap:7px;right:12px;bottom:14px;font:600 13px/1.25 var(--body,Arial,sans-serif)}
body .heroes-open .change-hero{display:none}
body .camp-first-light{display:grid;grid-template-columns:36px minmax(0,1fr) 22px;align-items:center;box-sizing:border-box;gap:10px;padding:12px;margin:0;min-height:70px;text-align:left;box-shadow:none}
body .camp-first-light>img{box-sizing:border-box;width:36px;height:44px;display:block;margin:0;object-fit:cover}
body .camp-first-light>span{min-width:0}.camp-first-light b,.camp-first-light small{display:block;line-height:1.4}
body .camp-first-light>svg{width:22px;height:22px;margin:0;flex:none}
body .camp-nav>button .nav-lock{box-sizing:border-box;display:grid;place-items:center;position:absolute;width:18px;height:18px;right:5px;top:3px;margin:0;padding:2px;border:1px solid #9d927c;border-radius:50%;background:#173545;line-height:1}
body .camp-nav>button .nav-lock>svg{display:block;width:12px;height:12px;margin:0;padding:0;background:none;filter:none;opacity:1}
html[data-ui-version="2"] .camp-shell:not(.heroes-open) .camp-launch{background:transparent;box-shadow:none;padding:0;margin:0}

body .camp-settings-dialog.test-tools{padding:0;overflow:hidden;display:flex;flex-direction:column;max-height:calc(100dvh - 24px)}
body .test-tools .test-tools-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:none;padding:16px 18px;border-bottom:1px solid #8aabb844}
body .test-tools-header h2{margin:0;font-size:27px}
.test-tools-content{min-height:0;overflow:auto;padding:0 18px 20px;overscroll-behavior:contain}
body .test-tools .test-wallet-actions>button{display:flex;align-items:center;justify-content:center;min-width:0;width:100%;min-height:52px;margin:0;padding:10px 6px;gap:5px;font-size:14px;box-sizing:border-box}
body .test-tools .test-checkpoints>button{display:block;min-height:48px;width:100%;margin:8px 0;padding:10px;font:600 14px/1.35 var(--body,Arial,sans-serif);box-sizing:border-box}
body .test-tools-content>button{width:100%;min-height:48px;padding:10px;margin:6px 0;font-size:14px}
body .camp-settings-dialog:has(>.settings-content){display:flex;flex-direction:column;padding:0;overflow:hidden}
body .camp-settings-dialog:has(>.settings-content)>.ui-dialog-header{flex:none;margin:0;padding:16px 18px;border-bottom:1px solid #8aabb844}
.settings-content{min-height:0;overflow:auto;overscroll-behavior:contain;padding:8px 18px 20px}
body .settings-content>button{display:block;width:100%;min-height:48px;padding:12px;margin:8px 0;text-align:left;font:500 15px/1.35 var(--body,Arial,sans-serif);box-sizing:border-box}
@media(max-width:350px){.collection-content{padding-inline:14px}body .test-tools .test-wallet,body .test-tools .test-checkpoints{padding:12px}body .camp-stage .change-hero{padding:8px;font-size:12px}}