/* Desktop shell: height is allocated to content after real header/footer measurement. */
html.client-viewport,html.client-viewport body{height:100%;margin:0;overscroll-behavior:none}
.client-layout .classic-shell{height:var(--client-viewport-height,100dvh);min-height:0;display:flex;flex-direction:column}
.client-layout .classic-topbar,.client-layout .classic-footer,.client-layout .save-warning,.client-layout .classic-resume{flex:none}
.client-layout .classic-topbar{min-height:78px;padding:8px 18px;gap:12px;flex-wrap:nowrap}
.client-layout .classic-footer{min-height:44px;padding:0 20px}
.client-layout .classic-title{min-width:116px}
.client-layout .classic-title b{font-size:24px}
.client-layout .classic-nav{padding:7px 10px;min-height:44px}
.client-layout .classic-resources{gap:7px;flex-wrap:nowrap}
.client-layout .classic-tools .classic-nav{padding:7px 9px}
.client-layout #main-content{flex:none;min-height:0;width:100%;max-width:1440px;padding:14px 20px;margin:0 auto}
/* Library/codex pages scroll as one reading surface; nested page-splitting hid cards and tables. */
.client-layout #main-content.library-scroll{overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#ba8f48 #3b291b;padding-bottom:22px}
.client-layout #main-content.library-scroll::-webkit-scrollbar{width:10px}
.client-layout #main-content.library-scroll::-webkit-scrollbar-track{background:#3b291b}
.client-layout #main-content.library-scroll::-webkit-scrollbar-thumb{background:#ba8f48;border-radius:6px}
/* Only nodes assigned to another reachable page are hidden. Never clip an overflowing body. */
.client-layout [data-client-hidden]{display:none!important}
.client-layout .client-paginated{min-height:0!important;max-height:none!important;overflow:visible!important}
.client-layout .client-paginated:not(#main-content){height:auto!important}
.client-pagination{grid-column:1/-1;flex:0 0 100%;display:flex;align-items:center;justify-content:center;gap:10px;min-height:42px;padding:4px 0;margin:5px 0 0;clear:both;position:relative;z-index:2}
.client-pagination button,.client-pagination select{font:inherit;font-size:12px;color:#ffe6ac;border:1px solid #ad8648;border-radius:5px;background:#422c1f;min-height:34px;padding:4px 10px;max-width:100%}
.client-pagination select{min-width:0;max-width:65%;text-overflow:ellipsis;flex:0 1 460px}
.client-pagination button{white-space:nowrap;flex:none}
.client-pagination button:disabled{opacity:.4}
.client-pagination :focus-visible{outline:2px solid #ffe6ac;outline-offset:2px}
.client-text-continuation,.client-text-part{display:block;white-space:pre-wrap;overflow-wrap:anywhere}
/* Maps use their available stage area; the interactive layer keeps every marker. */
.client-layout .home-world{height:100%;display:flex;flex-direction:column;min-height:0}
.client-layout .island-map{flex:1;min-height:280px;aspect-ratio:auto}
.client-layout .island-art{object-fit:contain}
.client-layout .world-heading,.client-layout .world-ribbon{flex:none}
.client-layout .world-heading h1{font-size:25px}
.client-layout .profile-layout,.client-layout .trainer-scene{min-height:0;height:clamp(320px,calc(var(--client-viewport-height) - 238px),680px)}
.client-layout .profile-tab-body{min-height:0;padding:15px 12px;overflow:auto}
.client-layout .profile-facts>div{padding:10px 4px}
.client-layout .profile-unavailable{min-height:220px}
.client-layout .page-title{margin-bottom:14px}
.client-layout .collection-toolbar,.client-layout .library-toolbar{margin-bottom:12px;flex-wrap:wrap}
.client-layout .library-toolbar .segmented{flex-wrap:wrap}
.client-layout .pet-center{padding:0;max-width:none}
.client-layout .pc-header{padding:0 4px 10px}
.client-layout .pc-roster,.client-layout .pc-detail{margin-bottom:10px;padding:12px}
.client-layout .pc-rosters{gap:12px}
.client-layout .pc-rosters .pc-card-image img{height:clamp(110px,20vh,190px);aspect-ratio:auto}
.client-layout .pc-rosters .pc-empty-card{min-height:180px}
.client-layout .pc-card-name{white-space:normal;overflow-wrap:anywhere}
.client-layout .pc-detail-body{padding:12px 3px;gap:14px}
.client-layout .pc-stats{gap:7px 12px;margin:8px 0 12px}
.client-layout .pc-team-controls{padding-top:9px}
.client-layout .egg-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.client-layout .skill-library,.client-layout .shop-book-grid{gap:12px}
/* Paged descendants must remain visible even when their decorative container grows. */
.client-layout .gacha-hero,.client-layout .reveal-shell{overflow:visible}
.client-layout .gacha-wallet{margin:4px 0}
.client-layout .gacha-wallet span{padding:4px 12px}
.client-layout .gacha-month{padding:7px}
.client-layout .gacha-integrated .gacha-banner-image{height:clamp(180px,30vh,350px);object-fit:contain}
.client-layout .gacha-integrated .gacha-controls{padding:12px 18px}
.client-layout .gacha-integrated .gacha-theme-cards img{height:clamp(85px,13vh,140px)}
.client-layout .gacha-integrated .gacha-info{margin:8px 0;padding:10px 14px}
.client-layout .gacha-pity{margin:8px 0}
.client-layout .gacha-draws{margin:8px 0}
/* Keep the summon type, artwork and payment controls together on desktop. */
@media(min-width:1101px){
.client-layout .gacha-integrated .gacha-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);align-items:start}
.client-layout .gacha-integrated .gacha-hero>.gacha-switch{grid-column:1/-1;padding:5px}
.client-layout .gacha-integrated .gacha-switch button{padding:5px 10px}
.client-layout .gacha-integrated .gacha-banner-image{height:140px}
.client-layout .gacha-integrated .gacha-theme-visual{padding:6px}
.client-layout .gacha-integrated .gacha-theme-visual h2{font-size:16px;margin:2px}
.client-layout .gacha-integrated .gacha-theme-cards{gap:4px}
.client-layout .gacha-integrated .gacha-theme-cards article{flex:1 1 65px;max-width:100px;padding:3px}
.client-layout .gacha-integrated .gacha-theme-cards img{height:60px}
.client-layout .gacha-integrated .gacha-controls{padding:6px 10px}
.client-layout .gacha-integrated .gacha-controls label{display:flex;align-items:center;gap:8px;margin:4px 0}
.client-layout .gacha-integrated .gacha-controls select{flex:1;min-width:0;margin:0;padding:4px}
.client-layout .gacha-integrated .gacha-dock-body{gap:8px}
.client-layout .gacha-integrated .gacha-pity,.client-layout .gacha-integrated .gacha-draws{margin:4px 0}
}
.client-layout .adv-frame{min-height:0;overflow:visible}
.client-layout .adv-scroll{overflow-y:visible}
.client-layout .adv-region-plate,.client-layout .adv-scene-plate{height:clamp(280px,calc(var(--client-viewport-height) - 330px),600px);min-height:0}
.client-layout .adv-world-plate{height:clamp(300px,calc(var(--client-viewport-height) - 190px),740px);min-height:0}
.client-layout .adv-world-dialog .adv-world-plate{width:100%;height:auto;min-width:0;aspect-ratio:1672/941}
.client-layout .adv-travel-tools{margin-top:8px;padding:8px 10px}
.client-layout .adv-heading{padding-bottom:10px}
.client-layout .adv-pool details p{max-height:none;overflow:visible}
/* Native dialog stays open while original controls are paged inside it. */
dialog.client-layout{position:fixed;inset:auto;top:50%;left:50%;transform:translate(-50%,-50%);width:min(960px,calc(100vw - 40px));max-width:calc(100vw - 40px);max-height:none;height:auto;overflow:visible;padding:20px;margin:0}
/* Long reference dialogs keep one scrollable surface instead of being split into pages. */
dialog.client-layout[data-client-atomic]{max-height:92dvh;overflow:auto}
dialog.client-layout .dialog-heading{margin-bottom:12px;padding-bottom:10px}
dialog.client-layout .dialog-buttons{margin-top:12px;padding-top:10px}
dialog.client-layout .detail-section,dialog.client-layout .setting-block{padding-top:12px;margin-top:12px}
dialog.client-layout .setting-row{padding:12px 0}
dialog.client-layout .discard-preview,dialog.client-layout .skill-options,dialog.client-layout #skill-picker-results{max-height:none;overflow:visible}
dialog.client-layout .intro-reveal,dialog.client-layout .hatch-reveal{padding:10px 0}
dialog.client-layout .hatch-reveal>img,dialog.client-layout .intro-reveal>img{max-height:150px;width:auto;margin:4px auto}
dialog.client-layout .result-hero{padding:10px 0}
dialog.client-layout.gacha-dialog{padding:0}
dialog.client-layout.adv-world-dialog{width:min(1300px,96vw);max-width:96vw;max-height:94dvh;padding:0;overflow:auto}
.client-layout .reveal-shell{min-height:0;padding:16px}
.client-layout .reveal-summary{margin:8px 0}
.client-layout .cb-log{max-height:none;overflow:visible}
.client-layout .classic-battle .cb-result .cb-settle-error{max-height:none;overflow:visible}
@media(max-width:1350px){.client-layout .classic-topbar{gap:8px;padding-inline:10px}.client-layout .classic-title{min-width:95px}.client-layout .classic-title b{font-size:21px}.client-layout .classic-resources .resource{padding:5px 7px}.client-layout .classic-resources .resource b{font-size:12px}.client-layout .classic-primary-nav,.client-layout .classic-tools{gap:5px}}
@media(max-height:800px){.client-layout #main-content{padding-top:10px;padding-bottom:10px}.client-layout .pc-header h1{font-size:25px}.client-layout .pc-rosters .pc-card-image img{height:125px}.client-layout .pc-rosters .pc-empty-card{min-height:180px}.client-layout .pc-detail-heading{padding-bottom:8px}.client-layout .adv-region-plate,.client-layout .adv-scene-plate{height:300px}.client-layout .classic-page-heading{padding-bottom:10px}}
@media(max-width:1100px){.client-layout .classic-topbar{flex-wrap:wrap}.client-layout .classic-title{order:0;width:auto;display:block}.client-layout .classic-tools{width:auto;margin-left:auto}.client-layout .classic-title span{letter-spacing:2px}.client-layout .classic-resources{margin-left:auto}.client-layout .egg-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Account equipment */
.equipment-page{display:flex;flex-direction:column;gap:12px}
.equipment-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-end}
.equipment-heading h2{margin:4px 0;font-size:24px}
.equipment-heading p{margin:0;color:var(--muted);font-size:12px}
.equipment-wallet{display:flex;gap:10px;font-size:12px;color:var(--muted)}
.equipment-wallet b{color:var(--text)}
.equipment-summary{display:flex;flex-wrap:wrap;gap:6px 12px;padding:10px 12px;font-size:12px}
.equipment-summary-stat b{color:var(--text)}
.equipment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.equipment-slot{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px;min-width:0}
.equipment-slot header{display:flex;justify-content:space-between;gap:6px;align-items:center}
.equipment-slot header b{font-size:14px}
.equipment-slot header small{display:block;color:var(--muted);font-size:10px}
.equipment-slot h3{margin:6px 0;font-size:18px}
.equipment-meta{color:var(--muted);font-size:11px;margin:0 0 6px}
.equipment-subs{display:flex;flex-direction:column;gap:3px;font-size:11px;color:var(--muted);min-height:32px}
.equipment-subs span{background:#ffffff0a;border-radius:5px;padding:2px 5px}
.equipment-card-picker{display:flex;flex-direction:column;gap:3px;font-size:10px;color:var(--muted);margin:7px 0}
.equipment-card-picker select{width:100%;font-size:11px;padding:4px;border-radius:6px;background:var(--panel);color:var(--text);border:1px solid var(--line)}
.equipment-slot footer{display:flex;justify-content:space-between;align-items:center;gap:6px;font-size:10px;color:var(--muted)}
.equipment-slot footer .btn{font-size:11px;padding:5px 8px}
.equipment-slot .btn.ghost{margin-top:5px;font-size:10px}
.equipment-rarity{font-weight:800;font-size:12px;color:#f6d58b}
.equipment-rarity.rarity-d{color:#aab3c2}.equipment-rarity.rarity-c{color:#66d6a6}.equipment-rarity.rarity-b{color:#61a6ff}.equipment-rarity.rarity-a{color:#c88cff}.equipment-rarity.rarity-s{color:#ffd166}
.equipment-bag-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.equipment-bag-item{border:1px solid var(--line);border-radius:8px;padding:8px;font-size:11px}
.equipment-bag-item header{display:flex;justify-content:space-between;gap:4px}
.equipment-bag-item p{color:var(--muted);margin:4px 0}
.equipment-bag-item .detail-actions{gap:4px;flex-wrap:wrap}
.equipment-bag-item .btn{font-size:10px;padding:4px 6px}
.equipment-card-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.equipment-card-chip{border:1px solid var(--line);border-radius:999px;padding:4px 9px;font-size:11px;color:var(--muted)}
.equipment-hint{color:var(--muted);font-size:11px}
.equipment-bag h3,.equipment-cards h3{margin:0 0 8px}
@media(max-width:1100px){.equipment-grid,.equipment-bag-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.equipment-grid,.equipment-bag-grid{grid-template-columns:1fr}}

.starter-gift{display:inline-block;margin:10px 0 4px;padding:7px 12px;border:1px solid #d9b765;border-radius:8px;background:#d9b7651a;color:#ffe6ac;font-weight:700;font-size:13px}