/* Compact shared shell; retain the illustrated game index styling. */
.page { max-width:1560px; padding:12px 18px; height:100dvh; display:flex; flex-direction:column; }
.index-shell { flex:1; min-height:0; display:flex; flex-direction:column; border-width:3px; border-radius:14px; }
.index-header { height:76px; min-height:76px; padding:0 22px; border-bottom-width:4px; gap:20px; }
.index-title { gap:16px; min-width:0; }
.index-title h1 { font-size:clamp(25px,2.8vw,39px); letter-spacing:-1.4px; -webkit-text-stroke:1px var(--ink); text-shadow:0 3px 0 #0a1639,2px 2px 0 #0a1639; }
.book { width:38px; height:49px; font-size:26px; border-width:3px; border-radius:5px; flex-shrink:0; box-shadow:3px 3px 0 #0b1731,inset 0 -7px #ffde76; }
.header-actions { display:flex; align-items:center; gap:19px; flex-shrink:0; }
.header-count { font-size:11px; white-space:nowrap; }
.header-count strong { display:inline; font-size:17px; margin-right:3px; }
.page-nav { display:flex; align-items:center; gap:5px; }
.page-nav a { padding:9px 13px; border:1px solid #b2e5ff80; border-radius:6px; color:#f4faff; background:#0b3c994d; font-size:12px; font-weight:800; text-decoration:none; box-shadow:0 2px 0 #194c9c; }
.page-nav a:hover { background:#174ca2; }
.page-nav a[aria-current="page"] { color:#311a35; background:linear-gradient(#ffc7e7,#ff8bc8); border-color:#ffc5e6; box-shadow:0 2px 0 #9b4b81; }
.toolbar { padding:10px 14px; gap:14px; flex-shrink:0; }
.tab { padding:8px 16px; font-size:13px; border-radius:7px; }
.search { height:36px; flex-basis:290px; }
.search input { font-size:12px; }
.workspace { flex:1; min-height:0; grid-template-columns:minmax(0,1fr) 310px; gap:12px; padding:12px; align-items:stretch; }
.collection-pane { display:flex; flex-direction:column; height:100%; min-height:0; border-radius:9px; }
.collection-controls { padding:9px 12px; gap:12px; flex-shrink:0; }
.select-wrap select { padding-top:6px; padding-bottom:6px; }
.groups { height:auto; min-height:0; flex:1; padding:11px; }
.area-section { grid-template-columns:108px minmax(0,1fr); gap:11px; margin-bottom:16px; }
.area-banner { min-height:0; border-radius:9px; }
.area-banner h2 { font-size:23px; }
.area-banner-text { padding:13px 7px 11px; }
.area-total { font-size:11px; }
.area-cards { grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
.character-card { height:clamp(116px,calc((100dvh - 330px)/2),168px); aspect-ratio:auto; border-radius:11px; }
.character-name { font-size:18px; top:8px; }
.character-name.long { font-size:13px; }
.character-card img { height:90%; }
.catalog-footer { padding:9px 12px; flex-shrink:0; }
.detail { height:100%; min-height:0; max-height:none; border-radius:9px; }
.detail-hero { height:176px; }
.detail-hero img { height:166px; }
.detail-heading { padding:12px 15px; }
.detail-heading h2 { font-size:25px; margin-bottom:6px; }
.detail-section { padding:12px 15px; }
.detail-section h3 { margin-bottom:9px; }
.egg-art { width:53px; height:58px; }
.egg-primary strong { font-size:13px; }
.egg-stat { padding:7px 9px; }
.egg-stat strong { font-size:13px; }
.egg-primary a,.source-info a { text-decoration-color:#8ca6c4; text-underline-offset:3px; }
.egg-primary a:hover,.source-info a:hover { color:#ffd0eb; }
.site-footer { padding:0 14px 9px; flex-shrink:0; font-size:9px; }
@media(min-width:1600px){.character-card{height:clamp(116px,calc((100dvh - 330px)/2),176px)}.detail-hero{height:190px}.detail-hero img{height:180px}}
@media(max-width:1150px){
 .header-count{display:none}.index-title h1{font-size:31px}.header-actions{gap:0}
 .workspace{grid-template-columns:minmax(0,1fr) 280px;padding:10px;gap:10px}
 .area-section{grid-template-columns:92px minmax(0,1fr);gap:9px}
 .area-banner h2{font-size:20px}.character-name{font-size:16px}.character-name.long{font-size:12px}
 .select-wrap{display:flex}.select-wrap>span{margin:0}.select-wrap select{max-width:145px}
}
@media(max-width:900px) and (min-width:801px){
 .page{padding:9px}.workspace{grid-template-columns:minmax(0,1fr) 250px}
 .area-section{grid-template-columns:minmax(0,1fr)}
 .area-banner{height:54px}.area-banner img{object-position:center 55%}
 .area-banner-text{flex-direction:row;justify-content:space-between;text-align:left;padding:8px 12px;gap:10px}
 .area-banner h2{margin:0}.area-meta{margin:0;padding:0;text-align:right}
 .area-total{margin-bottom:2px}.speed-label{font-size:9px}.speed-label strong{display:inline;font-size:11px;margin-left:5px}
 .character-card{height:clamp(100px,calc((100dvh - 400px)/2),146px)}.index-title h1{font-size:26px}
}
@media(max-width:800px){
 .page{height:auto;min-height:100dvh;padding:9px}
 .index-shell{flex:initial;min-height:calc(100dvh - 18px)}
 .index-header{min-height:72px;height:auto;padding:12px 15px;gap:13px}
 .index-title h1{font-size:28px;line-height:1.05;letter-spacing:-1px}
 .index-title{gap:12px}.book{width:32px;height:43px;font-size:23px}
 .page-nav a{padding:9px 10px;font-size:11px}
 .workspace{flex:initial;display:grid;grid-template-columns:minmax(0,1fr);padding:10px}
 .collection-pane{height:auto}.groups{height:auto;flex:initial;min-height:280px;overflow:visible}
 .detail{height:auto;max-height:88dvh;min-height:0;left:10px;right:10px;bottom:10px}
 .detail-hero{height:185px}.detail-hero img{height:175px}
 .area-section{grid-template-columns:100px minmax(0,1fr)}
 .character-card{height:148px}.character-name{font-size:17px}.character-name.long{font-size:12px}
 .toolbar{flex-wrap:nowrap}.tabs{flex:initial}.tab{padding:9px 11px;font-size:12px}
 .search{flex:1 1 160px}.site-footer{margin-top:auto}
}
@media(max-width:540px){
 .page{padding:6px}.index-shell{min-height:calc(100dvh - 12px);border-radius:10px}
 .index-header{display:grid;grid-template-columns:1fr;gap:9px;padding:11px 13px}
 .index-title h1{font-size:26px}.index-title{gap:11px}.book{height:36px;width:29px;font-size:21px}
 .header-actions{justify-content:flex-end}.page-nav{gap:6px}.page-nav a{padding:7px 12px;min-height:32px}
 .toolbar{padding:9px;flex-wrap:wrap;gap:9px}.tabs{flex-basis:100%}.tab{padding:9px 10px}
 .search{flex-basis:100%;height:35px}.workspace{padding:8px}
 .collection-controls{padding:9px;gap:8px}.select-wrap>span{display:none}.select-wrap select{max-width:none}
 .results{margin-top:1px}.groups{padding:9px}
 .area-section{grid-template-columns:minmax(0,1fr);gap:8px}
 .area-banner{height:57px}.area-banner h2{font-size:23px}
 .area-banner-text{padding:9px 11px;flex-direction:row;justify-content:space-between;text-align:left}
 .area-meta{margin:0;padding:0;text-align:right}.area-total{margin-bottom:2px;font-size:10px}
 .area-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .character-card{height:151px}.character-name{font-size:19px}.character-name.long{font-size:13px}
 .catalog-footer{padding:8px 9px}.site-footer{padding:0 11px 8px}
}