/* v27: scene-led pixel game shell; presentation only. */
:root{--v27-ink:#082a33;--v27-panel:#0e3540;--v27-gold:#e4bf6b;--v27-line:#937644;--v27-soft:#b5c9c8}
#lobby{width:min(100%,520px);height:100dvh;min-height:0;margin:0 auto;background:#092b33;color:#f3e6c0;grid-template-rows:58px minmax(0,1fr) 68px}
.lobby-header{min-height:58px;height:58px;padding:6px 12px;gap:8px;border-width:0 0 2px;border-color:#bc985a;background:#092a33;box-shadow:none}
.lobby-header>div{min-width:0}.lobby-header small{font-size:10px;letter-spacing:1px;color:#b9ccbf}.lobby-header strong{font-size:20px;line-height:1.15;color:#ffebae}
#lobbyCoins{font-size:12px;font-weight:700;border:1px solid #8d774d;box-shadow:inset 0 0 0 2px #183e45;padding:7px 8px;line-height:1.4;max-width:48%;background:#0a252e}
#lobbySettings{height:42px;width:42px;min-width:42px;padding:0;font-size:23px;box-shadow:none;border:1px solid #c4a263}
#lobbyContent{min-height:0;padding:0;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:#776d53 #082a33}
#lobbyContent>.outer-panel{width:100%;max-width:none;margin:0;padding:12px;border:0;border-radius:0;box-shadow:none;background:linear-gradient(180deg,#123c46,#092a33);min-height:100%}
#lobbyNav{height:68px;min-height:68px;padding:5px 8px max(5px,env(safe-area-inset-bottom));gap:5px;border-top:2px solid #af8d4a;background:#082832;box-shadow:none;position:relative}
#lobbyNav button{min-height:56px;height:56px;border:1px solid #917842;border-radius:0;background:#103441;padding:3px;font-size:13px;line-height:1.2;box-shadow:inset 0 0 0 2px #1d4650}
#lobbyNav button::before{height:27px;width:27px;margin-bottom:2px;filter:none}
#lobbyNav button.active{background:#e0b85e;color:#123039;box-shadow:inset 0 0 0 2px #f7da8a}
#lobby button{touch-action:manipulation}#lobby button:focus-visible{outline:3px solid #8bf0e0;outline-offset:2px}
#lobbyContent h1,#lobbyContent h2,#lobbyContent h3{font-family:inherit}
#lobbyContent p{line-height:1.55}
#lobby[data-page="home"] #lobbyContent:has(.camp-v27){background:#092a33}
.camp-v27.camp-world{position:relative;isolation:isolate;width:100%;height:100%;min-height:510px;max-height:none;margin:0;padding:0;overflow:hidden;border:0;border-radius:0;background-image:linear-gradient(180deg,rgba(4,25,31,.18),transparent 38%,rgba(3,27,31,.25) 75%,rgba(2,22,25,.72)),url('assets/camp-v27.png');background-position:center;background-size:cover;box-shadow:none}
.camp-v27:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(90deg,rgba(4,25,30,.16),transparent 30% 70%,rgba(4,25,30,.12))}
.camp-v27-sky{position:absolute;left:16px;top:14px;display:flex;flex-direction:column;text-shadow:0 2px 4px #183229;pointer-events:none}
.camp-v27-sky span{font-size:25px;font-weight:950;letter-spacing:3px;color:#fff3c4}
.camp-v27-sky small{font-size:10px;color:#fff4d1;margin-top:4px}
.camp-v27 .camp-services{position:absolute;inset:0;display:block;margin:0;padding:0;z-index:2}
.camp-v27 .camp-facility{position:absolute;display:grid;grid-template-columns:26px 1fr;align-content:center;column-gap:6px;width:41%;height:64px;padding:7px 8px;background:rgba(5,39,48,.95);border:2px solid #d5b665;box-shadow:inset 0 0 0 2px #153d46,0 3px 0 #493d26,0 6px 18px #051c23a6;clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px)}
.camp-facility .facility-icon{grid-row:1/3;font-size:28px;align-self:center;font-style:normal;color:#f2cc6d;line-height:1}
.camp-v27 .camp-facility strong{font-size:18px;line-height:1.2;white-space:nowrap;color:#ffecb1;text-align:left}
.camp-v27 .camp-facility small{font-size:11px;line-height:1.3;color:#c8d7cf;text-align:left;padding-top:4px}
.camp-v27 .tavern{left:27%;top:24%;width:46%}
.camp-v27 .tactics{left:5%;top:45%}
.camp-v27 .forge{right:5%;top:45%}
.camp-v27 .camp-future{position:absolute;top:62%;width:40%;display:grid;grid-template-columns:23px 1fr;column-gap:5px;align-content:center;min-height:57px;padding:7px 9px;border:1px solid #9ba8a5;box-shadow:inset 0 0 0 2px #344d56,0 3px 0 #1d343a;background:#304b58ed;color:#d2dcdb;cursor:default}
.camp-future .future-sigil{grid-row:1/3;align-self:center;font-size:25px;color:#a9c2c5}.camp-future strong{font-size:16px}.camp-future small{font-size:10px;padding-top:4px;color:#b7c6ca}.camp-v27 .pets{left:6%}.camp-v27 .beasts{right:6%}
.camp-v27 .camp-assembly{position:absolute;left:4%;right:4%;bottom:96px;top:auto;min-height:0;height:57px;margin:0;padding:0;background:rgba(5,35,43,.94);border:1px solid #d6b66c;box-shadow:inset 0 0 0 2px #31545b,0 4px 14px #061c25b3;z-index:3}
.camp-v27 #campFormation{display:flex;width:100%;height:55px;min-height:0;align-items:center;justify-content:space-between;padding:5px 10px;border:0;background:none;box-shadow:none;text-align:left;color:#f5e3ad}
.camp-v27 #campFormation>span:first-child{display:flex;flex-direction:column;gap:2px;flex:none}.camp-v27 #campFormation small{font-size:10px;color:#a6c0bf}.camp-v27 #campFormation strong{font-size:13px}
.camp-v27 .camp-party{display:flex;align-items:center;justify-content:flex-end;gap:2px;width:auto;min-height:0;margin:0;padding:0;border:0;grid-template-columns:none}
.camp-v27 .camp-party>span{width:33px;height:42px;display:block;overflow:hidden}.camp-v27 .camp-party img{width:38px;height:43px;object-fit:contain;image-rendering:pixelated;filter:none;margin:0;transform:none}
.camp-v27 .camp-party .camp-team-more{font-size:10px;text-align:right;width:37px;line-height:1.45;padding-top:6px;margin-left:4px;white-space:nowrap}
.camp-v27 .camp-bottom-plaque{position:absolute;bottom:10px;left:8%;right:8%;z-index:3;padding:0;border:0;background:none;box-shadow:none}
.camp-v27 #campDeploy{height:57px;min-height:0;padding:6px;font-size:24px;letter-spacing:2px;border:2px solid #ffdf89;background:#e4b85d;box-shadow:inset 0 0 0 2px #b38642,0 3px 0 #75603a;color:#102f38}
.camp-v27 #campDeploy small{display:block;font-size:10px;line-height:1.1;letter-spacing:1px;font-weight:500;margin-top:2px;color:#28474c}
.camp-v27 #campGoals{display:flex;justify-content:center;gap:14px;height:24px;min-height:0;width:100%;font-size:10px;color:#dedac4;border:0;background:none;box-shadow:none;padding:4px}
.camp-v27 .camp-facility:hover{filter:brightness(1.16);transform:translateY(-2px)}.camp-v27 .camp-facility:active{transform:translateY(1px)}
.camp-v27 .camp-assembly{animation:v27-entry .35s ease-out both}.camp-v27 .camp-facility{animation:v27-entry .3s ease-out both}.camp-v27 .tactics{animation-delay:.04s}.camp-v27 .forge{animation-delay:.08s}
@keyframes v27-entry{from{opacity:.3;translate:0 7px}to{opacity:1;translate:0 0}}
#lobby .hero-detail-v27 .hero-detail-topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;height:38px;margin-bottom:5px}
.hero-detail-topbar #returnHeroLibrary{width:auto;min-height:36px;padding:5px 10px;border:1px solid #7a754f;box-shadow:none;font-size:12px;background:#0d303a}
.hero-page-label{font-size:11px;letter-spacing:2px;color:#8bafae}
#lobby .hero-detail-v27 .hero-selector{display:flex;gap:4px;padding:0;margin:0 0 8px;overflow-x:auto;border:0;scrollbar-width:none}
#lobby .hero-detail-v27 .hero-selector button{flex:1;min-width:40px;padding:3px 1px;height:47px;min-height:0;border:1px solid #50665e;box-shadow:none;background:#123942}
#lobby .hero-detail-v27 .hero-selector img{width:25px;height:25px;object-fit:contain;image-rendering:pixelated}#lobby .hero-detail-v27 .hero-selector span{font-size:10px;line-height:1.2}#lobby .hero-detail-v27 .hero-selector small{display:none}#lobby .hero-detail-v27 .hero-selector button.selected{border-color:#eac46a;background:#2a4b48}
#lobby .hero-detail-v27 .hero-stage{position:relative;height:262px;min-height:0;padding:10px 68px 12px;margin:0 -12px;border:0;border-radius:0;background:linear-gradient(0deg,#092d36 0%,#0b2c3288 20%,#0b2c3270 85%,#123c46),url('assets/ui-mage-v9.webp') center 58%/cover;box-shadow:none;overflow:hidden}
#lobby .hero-detail-v27 .ornate-title{position:absolute;bottom:30px;left:70px;right:70px;top:auto;padding:3px 0;font-size:19px;background:linear-gradient(90deg,transparent,#082833db,transparent);border:0;white-space:nowrap;z-index:2}
#lobby .hero-detail-v27 .hero-pedestal{height:220px;min-height:0;background:none;filter:none;padding:0;margin:0;display:flex;align-items:flex-end;justify-content:center}
#lobby .hero-detail-v27 .hero-portrait-v12{height:210px;max-height:210px;width:180px;max-width:180px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 5px 3px #04191c);margin:0;animation:none}
#lobby .hero-detail-v27 .hero-stars{position:absolute;bottom:8px;left:0;right:0;font-size:15px;letter-spacing:4px;z-index:2}
.hero-left-slots,.hero-side-slots{position:absolute;top:10px;bottom:10px;width:58px;display:flex;flex-direction:column;justify-content:center;gap:8px;z-index:3}.hero-left-slots{left:12px}.hero-side-slots{right:12px}
.hero-stage-slot,.hero-left-slots>button,.hero-future-slot{display:flex!important;flex-direction:column;align-items:center;justify-content:center;width:58px;height:69px!important;min-height:0!important;padding:3px!important;border:1px solid #9b8656!important;box-shadow:inset 0 0 0 2px #153d40!important;background:#0b303ce8!important}
.hero-stage-slot img,.hero-stage-slot .item-icon,.hero-left-slots img{width:30px!important;height:30px!important;object-fit:contain;image-rendering:pixelated;margin:1px!important}.hero-stage-slot .empty-slot{height:27px;width:27px;margin:2px!important;border-width:1px}
.hero-stage-slot small,.hero-stage-slot strong,.hero-left-slots small,.hero-future-slot small{font-size:10px!important;line-height:1.15!important;text-align:center}.hero-stage-slot.selected{border-color:#ffe09a!important;background:#275356ed!important}.hero-future-slot{border-color:#56717a!important;background:#233e4bc9!important;color:#9bb1b9}.hero-future-slot>span{font-size:24px}#lobby .hero-detail-v27 .hero-section-tabs{display:flex;gap:0;margin:0 -12px 10px;padding:0 10px;background:#10333b;border-bottom:1px solid #9a7c44}
#lobby .hero-detail-v27 .hero-section-tabs button{flex:1;min-height:42px;height:42px;padding:7px;border:0;border-bottom:3px solid transparent;border-radius:0;box-shadow:none;background:none;font-size:14px}#lobby .hero-detail-v27 .hero-section-tabs button.selected{background:#244841;border-bottom-color:#eac365;color:#ffdc83}
#lobby .hero-detail-v27 .hero-workbench{padding:0;background:none;border:0}#lobby .hero-detail-v27 .camp-category{margin:6px 0 8px;display:flex;justify-content:space-between;align-items:center}#lobby .hero-detail-v27 .camp-category h3{font-size:15px;margin:0}#lobby .hero-detail-v27 .camp-category span{font-size:10px;color:#aac6c1}
#lobby .hero-detail-v27 .equipment-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}#lobby .hero-detail-v27 .equipment-card{padding:8px;border:1px solid #50625a;background:#143c45;box-shadow:none;border-radius:0}#lobby .hero-detail-v27 .equipment-card>div{display:flex;align-items:center;gap:5px}#lobby .hero-detail-v27 .equipment-card .item-icon{width:34px;height:34px}#lobby .hero-detail-v27 .equipment-card strong{font-size:12px}#lobby .hero-detail-v27 .equipment-card p{font-size:11px;line-height:1.5;margin:6px 0;min-height:0}#lobby .hero-detail-v27 .equipment-card small{font-size:10px}#lobby .hero-detail-v27 .equipment-card button{padding:5px;font-size:12px;min-height:36px;margin-top:6px;box-shadow:none}#lobby .hero-detail-v27 .equipment-card.equipped{border-color:#e3c47a}#lobby .hero-detail-v27 .hero-workbench>.sub{font-size:10px;color:#93b0ae;line-height:1.6}
#lobby .hero-detail-v27 .hero-workbench>h2{font-size:18px}#lobby .hero-detail-v27 .skill-description{padding:8px;border:0;border-bottom:1px solid #355951;background:none}#lobby .hero-detail-v27 .skill-description h3{font-size:14px}#lobby .hero-detail-v27 .skill-description p{font-size:12px}#lobby .hero-detail-v27 .growth-track{margin:10px 0}
.gear-workshop .gear-heading{padding:0 0 8px;border:0;background:none;min-height:40px}.gear-heading h2{font-size:22px}.gear-heading small{font-size:10px}.gear-workshop .gear-tabs{gap:0;margin-bottom:10px}.gear-tabs button{height:40px;min-height:40px;padding:6px;font-size:12px;box-shadow:none}
.gear-workshop .gear-wallet{padding:7px 10px;border:1px solid #50644f;background:#153d44;margin:8px 0}.gear-wallet span{font-size:11px}.gear-wallet b{font-size:17px}.gear-wallet small{font-size:9px}
.gear-workshop .gear-heroes{display:flex;gap:4px;overflow-x:auto;margin:8px 0}.gear-heroes button{flex:1;min-width:44px;padding:4px 2px;border-width:1px;box-shadow:none;min-height:64px}.gear-heroes img{width:27px;height:27px}.gear-heroes strong{font-size:10px}.gear-heroes small{font-size:8px}
.gear-workshop .gear-slot{padding:9px;border:1px solid #ad955b;margin:8px 0;background:#123942;box-shadow:none;min-height:67px}.gear-slot small{font-size:10px}.gear-slot strong{font-size:14px}.gear-slot p{font-size:11px;margin:4px 0}.gear-slot button{min-height:44px;padding:3px}.gear-slot img{width:32px;height:32px}
.gear-workshop .gear-section-title{margin:10px 0 5px}.gear-section-title h3{font-size:16px}.gear-section-title span{font-size:11px}.gear-workshop .management-toolbar{padding:8px;gap:6px;margin:0 0 8px}.gear-workshop .management-toolbar label{font-size:10px}.gear-workshop .management-toolbar input,.gear-workshop .management-toolbar select{height:34px;min-height:34px;font-size:11px;padding:4px}
.gear-workshop .gear-inventory{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.gear-workshop .gear-card{position:relative;display:flex;flex-direction:column;gap:3px;min-width:0;padding:8px 4px;height:auto;min-height:128px;border:1px solid #597061;background:#153e47;box-shadow:none}.gear-card.refined{border-color:#72af9b}.gear-card>.gear-icon{width:44px;height:44px}.gear-card-copy{width:100%;text-align:center}.gear-card-copy strong{font-size:11px}.gear-card-copy .gear-grade{font-size:8px;padding:2px}.gear-card-copy>small{font-size:8px;line-height:1.35}.gear-card-copy .gear-status{font-size:8px}.gear-card>span:last-child:not(.gear-card-copy){display:none}.gear-workshop .gear-rules{font-size:11px;margin-top:10px}.gear-workshop .gear-note{font-size:10px;color:#9ab6b4;line-height:1.5}.gear-workshop .gear-empty{padding:20px 10px;border:1px dashed #54706b}.gear-empty h3{font-size:16px}.gear-empty p{font-size:12px}
.recruit-workshop .formation-roster{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.formation-roster button{padding:6px;min-width:0;min-height:130px;box-shadow:none;border-width:1px}.formation-roster img{width:64px;height:64px;object-fit:contain;image-rendering:pixelated}.formation-roster strong{font-size:13px}.formation-roster small,.formation-roster b{font-size:10px}.formation-counter{margin:8px 0;padding:8px}.formation-combos,.formation-reserve{padding:8px!important;margin:8px 0!important;box-shadow:none!important}.formation-combos h3,.formation-reserve h3{font-size:14px}.formation-combos p,.formation-reserve p{font-size:12px}.formation-combos small,.formation-reserve small{font-size:10px;line-height:1.5}
@media(max-height:700px){#lobby{grid-template-rows:52px minmax(0,1fr) 61px}.lobby-header{height:52px;min-height:52px}.lobby-header strong{font-size:17px}#lobbyNav{height:61px;min-height:61px}#lobbyNav button{height:49px;min-height:49px}.camp-v27.camp-world{min-height:440px}.camp-v27-sky{top:8px}.camp-v27-sky span{font-size:20px}.camp-v27-sky small{display:none}.camp-v27 .camp-facility{height:54px}.camp-v27 .tavern{top:21%}.camp-v27 .tactics,.camp-v27 .forge{top:40%}.camp-v27 .camp-future{top:57%;min-height:48px}.camp-v27 .camp-assembly{bottom:85px;height:50px}.camp-v27 #campFormation{height:48px}.camp-v27 .camp-party img{height:38px}.camp-v27 .camp-bottom-plaque{bottom:4px}.camp-v27 #campDeploy{height:53px}}
@media(min-width:700px){body{background:radial-gradient(ellipse at center,#295153,#071a22 75%)}#lobby{box-shadow:0 0 100px #0009}}
@media(prefers-reduced-motion:reduce){.camp-v27 .camp-assembly,.camp-v27 .camp-facility{animation:none;transition:none}}

/* Override historical shell ID selectors, without changing battle styles. */
#lobby .camp-v27 .camp-assembly{position:absolute;top:auto;left:4%;right:4%;bottom:96px;padding:0;border-radius:0}
#lobby .camp-v27 .camp-bottom-plaque{position:absolute;top:auto;bottom:10px;left:8%;right:8%;padding:0;border:0;background:none;box-shadow:none}
#lobby .camp-v27 .camp-party img.camp-member-portrait{height:42px;width:36px;max-width:36px;object-fit:contain;margin:0}
#lobby .camp-v27 .camp-future{backdrop-filter:grayscale(1)}
@media(max-height:700px){#lobby .camp-v27 .camp-assembly{bottom:85px}#lobby .camp-v27 .camp-bottom-plaque{bottom:4px}}


#lobby .hero-detail-v27 .hero-stage{display:block} #lobby .hero-detail-v27 .hero-pedestal{width:100%;height:220px;margin:0;border-radius:0} #lobby .hero-detail-v27 .ornate-title{transform:none;width:auto;text-align:center;box-shadow:none;line-height:25px;bottom:26px} #lobby .hero-detail-v27 .hero-stars{text-align:center;line-height:20px;bottom:5px} #lobby .hero-stage-slot{color:#f4e5ad} #lobby .hero-stage-slot:disabled{color:#b0bcae;opacity:1} 
/* Finish cascade isolation from earlier library and selected-button skins. */
#lobby #lobbyContent>.outer-panel{margin:0;padding:12px;min-height:100%;border:0;border-radius:0;background:linear-gradient(180deg,#123c46,#092a33);box-shadow:none}
#lobby .hero-stage-slot.selected,#lobby .hero-stage-slot.selected small,#lobby .hero-stage-slot.selected strong{color:#ffecb1!important}
#lobby .hero-stage-slot.selected .empty-slot{border-color:#d6bd7b;color:#d6bd7b}
#lobby .gear-workshop .gear-heroes button{min-height:64px;padding:4px 2px}
#lobby .gear-workshop button.selected{color:#f9e4a6;background:#274b48}
#lobby .gear-workshop button.selected strong,#lobby .gear-workshop button.selected small{color:#f9e4a6}
#lobby .gear-workshop .gear-tabs button{min-height:40px;height:40px}
#lobby .gear-workshop .gear-card{flex-direction:column;text-align:center;padding:8px 4px;gap:3px;min-height:128px}
#lobby #gearOriginBack{width:auto;min-height:32px;height:32px;margin:0 0 6px;padding:3px 8px;font-size:11px;box-shadow:none;border-width:1px}
#lobby .gear-workshop .gear-heading{margin-bottom:8px;padding-bottom:0}
#lobby .gear-workshop .gear-empty{padding:12px 8px}
#lobby .gear-workshop .gear-empty>.gear-icon{width:32px;height:32px}
#lobby .gear-workshop .gear-empty p{font-size:11px;margin:5px 0}