/* ========== 基础变量与全局样式 ========== */
 :root{
   color-scheme:light;
   font-family:"Segoe UI Variable","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
   --shell-width:624px;
   --ink:#203247;
   --line:rgba(74,122,168,.16);
   --paper:#f7fbff;
   --shadow:0 18px 50px rgba(27,61,96,.16);
 }
 *{box-sizing:border-box}
 html{min-width:320px;background:#dce6f0}
 body{min-width:320px;min-height:100vh;margin:0;color:var(--ink)}
 a{color:inherit;text-decoration:none}

 /* 页面主容器：移动端居中的浅蓝渐变外壳 */
 .page-shell{
   width:100%;
   max-width:var(--shell-width);
   min-height:100dvh;
   margin:0 auto;
   overflow:hidden;
   background:linear-gradient(180deg,#eef6ff 0,#f8fcff 190px,var(--paper) 100%);
   box-shadow:var(--shadow);
 }

 /* ========== 顶部信息区 ========== */
 .selector-head{
   padding:20px 18px 18px;
   border-bottom:1px solid var(--line);
   background:linear-gradient(180deg,#fff,#f3f9ff);
 }
 .brand{
   display:grid;
   grid-template-columns:76px minmax(0,1fr);
   gap:14px;
   align-items:center;
 }
 .game-icon{
   display:block;
   width:76px;
   height:76px;
   overflow:hidden;
   border:1px solid rgba(245,171,43,.48);
   border-radius:18px;
   background:#fff;
   box-shadow:0 8px 18px rgba(40,76,112,.16);
   object-fit:cover;
 }
 .brand-copy{min-width:0}
 .collection-title-row{
   display:flex;
   min-width:0;
   align-items:center;
   gap:8px;
 }
 .collection-title-row h1{
   min-width:0;
   margin:0;
   overflow:hidden;
   font-size:24px;
   line-height:1.15;
   text-overflow:ellipsis;
   white-space:nowrap;
 }
 .release-badge{
   display:inline-flex;
   min-height:28px;
   padding:0 11px;
   border:1px solid #c6d3ff;
   border-radius:999px;
   background:#f0f3ff;
   color:#5867de;
   align-items:center;
   flex:0 0 auto;
   font-size:13px;
   font-weight:700;
   white-space:nowrap;
 }
 .release-badge::before{
   width:8px;
   height:8px;
   margin-right:7px;
   border-radius:50%;
   background:#6d5dfc;
   content:"";
 }
 .fixed-tags{
   display:flex;
   min-width:0;
   margin-top:10px;
   gap:6px;
   flex-wrap:nowrap;
 }
 .fixed-tags span{
   min-width:0;
   overflow:hidden;
   padding:3px 10px;
   border:1px solid #bee8ce;
   border-radius:999px;
   background:#ecfaf2;
   color:#259362;
   font-size:12px;
   line-height:1.35;
   text-overflow:ellipsis;
   white-space:nowrap;
 }
 .fixed-tags span:last-child{
   border-color:#c9d9ff;
   background:#eff5ff;
   color:#3672d5;
 }

 /* ========== 内容区 ========== */
 main{
   display:grid;
   padding:14px 14px 24px;
   gap:12px;
 }

 /* 顶部大图横幅 */
 .intro-card{
   position:relative;
   width:100%;
   aspect-ratio:1248/520;
   overflow:hidden;
   border:1px solid rgba(38,55,73,.18);
   border-radius:16px;
   background:#dbe5ed;
   box-shadow:0 10px 24px rgba(33,56,80,.14);
 }
 .intro-card img{
   display:block;
   width:100%;
   height:100%;
   object-fit:cover;
 }
 .intro-card::after{
   position:absolute;
   inset:0;
   background:linear-gradient(0deg,rgba(12,24,38,.42) 0,rgba(12,24,38,.03) 54%,transparent 72%);
   content:"";
 }
 .intro-card p{
   position:absolute;
   z-index:1;
   bottom:11px;
   left:50%;
   display:grid;
   width:max-content;
   max-width:calc(100% - 30px);
   min-height:42px;
   margin:0;
   padding:0 15px;
   border:1px solid rgba(255,255,255,.72);
   border-radius:12px;
   background:rgba(248,252,255,.9);
   box-shadow:0 8px 22px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.7);
   color:#24384c;
   grid-template-columns:5px minmax(0,1fr);
   align-items:center;
   gap:9px;
   font-size:15px;
   font-weight:800;
   line-height:1.35;
   text-align:left;
   transform:translateX(-50%);
   white-space:nowrap;
   backdrop-filter:blur(9px) saturate(1.08);
   -webkit-backdrop-filter:blur(9px) saturate(1.08);
 }
 .intro-card p::before{
   width:5px;
   height:20px;
   border-radius:999px;
   background:linear-gradient(180deg,#48a9ff,#6d5dfc);
   box-shadow:0 0 0 3px rgba(82,139,242,.1);
   content:"";
 }

 /* ========== 版本列表 ========== */
 .version-list{display:grid;gap:11px}
 .games-item{
   position:relative;
   display:block;
   width:100%;
   max-width:100%;
   overflow:hidden;
   padding:9px;
   border:1px solid rgba(26,35,50,.09);
   border-radius:15px;
   background:#fff;
   color:inherit;
   cursor:pointer;
   box-shadow:0 6px 17px rgba(34,67,101,.07);
   -webkit-tap-highlight-color:transparent;
   transition:border-color 120ms linear,box-shadow 120ms linear,transform 120ms linear;
 }
 .games-item::before{
   position:absolute;
   z-index:1;
   top:15px;
   left:0;
   width:4px;
   height:30px;
   border-radius:0 4px 4px 0;
   background:#2ea675;
   content:"";
 }
 .games-item:nth-child(3n+2)::before{background:#4f82de}
 .games-item:nth-child(3n+3)::before{background:#df9328}
 .games-item:active{
   border-color:rgba(34,160,107,.28);
   transform:scale(.995);
 }
 .games-item:focus-visible{
   outline:3px solid rgba(34,160,107,.22);
   outline-offset:2px;
 }
 .games-main{
   display:grid;
   min-width:0;
   grid-template-columns:126px minmax(0,1fr);
   gap:12px;
   align-items:start;
 }
 /* 横向长条图入口：覆盖 grid 布局，让图片按自身比例自适应，不被 126px 列压扁 */
 .games-item.is-wide .games-main{
   display:block;
   padding:0;
 }
 .games-item.is-wide .games-main img{
   display:block;
   width:100%;
   max-width:100%;
   height:auto;
   object-fit:contain;
 }
 .games-cover{
   display:block;
   width:126px;
   height:126px;
   overflow:hidden;
   border-radius:12px;
   background:#edf2f5;
   box-shadow:inset 0 0 0 1px rgba(67,86,105,.1);
 }
 .games-cover img{
   display:block;
   width:100%;
   height:100%;
   object-fit:cover;
 }
 .games-info{
   display:flex;
   width:100%;
   max-width:100%;
   min-width:0;
   min-height:126px;
   overflow:hidden;
   flex-direction:column;
   justify-content:center;
 }
 .games-title-row{
   display:flex;
   min-width:0;
   max-width:100%;
   margin:0 0 10px;
   overflow:hidden;
   align-items:center;
 }
 .games-title-row b{
   display:block;
   min-width:0;
   overflow:hidden;
   color:#203247;
   font-size:17px;
   font-weight:750;
   text-overflow:ellipsis;
   white-space:nowrap;
 }
 .store-tags{
   display:flex;
   width:100%;
   min-width:0;
   margin:0;
   overflow:visible;
   gap:5px;
   align-content:center;
   align-items:center;
   flex-wrap:wrap;
 }
 .store-tag{
   display:inline-flex;
   min-width:0;
   max-width:100%;
   overflow:hidden;
   padding:2px 7px;
   border:1px solid transparent;
   border-radius:999px;
   align-items:center;
   flex:0 0 auto;
   font-size:10px;
   font-weight:500;
   line-height:1.3;
   text-overflow:ellipsis;
   white-space:nowrap;
 }
 /* 标签配色：5 套色调循环使用，保持与原站一致的观感 */
 .store-tag.is-tone-0{border-color:#b7e2c8;background:#e8f7ef;color:#1f8f5f}
 .store-tag.is-tone-1{border-color:#c7d5f8;background:#eef3ff;color:#3b6fd4}
 .store-tag.is-tone-2{border-color:#f3d2a8;background:#fff4e8;color:#c27803}
 .store-tag.is-tone-3{border-color:#f3c2cd;background:#fdecef;color:#c2415f}
 .store-tag.is-tone-4{border-color:#d4caf5;background:#f1eefc;color:#6d4fc4}

 /* ========== 页脚声明 ========== */
 .games-legal{
   padding:2px 18px max(22px,env(safe-area-inset-bottom));
   color:#8a97a6;
   font-size:11px;
   line-height:1.65;
   text-align:center;
 }
 .games-legal p{margin:3px 0}
 .company-filing{color:#758597}

 /* ========== 桌面端悬浮态 ========== */
 @media(hover:hover) and (pointer:fine){
   .games-item:hover{
     border-color:rgba(34,160,107,.28);
     box-shadow:0 10px 22px rgba(34,67,101,.11);
     transform:translateY(-1px);
   }
 }

 /* ========== 小屏适配 ========== */
 @media(max-width:460px){
   .selector-head{padding:18px 14px 16px}
   .brand{grid-template-columns:68px minmax(0,1fr);gap:12px}
   .game-icon{width:68px;height:68px;border-radius:16px}
   .collection-title-row h1{font-size:22px}
   .release-badge{min-height:26px;padding:0 9px;font-size:12px}
   .fixed-tags span{padding-inline:8px;font-size:11px}
   main{padding:12px 10px 20px}
   .intro-card{border-radius:14px}
   .intro-card p{bottom:9px;min-height:36px;padding:0 12px;border-radius:10px;gap:8px;font-size:13px}
   .intro-card p::before{height:17px}
   .games-item{padding:9px}
   .games-main{grid-template-columns:116px minmax(0,1fr);gap:10px}
   .games-cover{width:116px;height:116px}
   .games-info{min-height:116px}
   .games-title-row{margin-bottom:8px}
   .games-title-row b{font-size:clamp(13px,4vw,15px)}
   .store-tags{gap:4px}
   .store-tag{padding:2px 6px;font-size:clamp(9px,2.7vw,10px)}
 }
 @media(max-width:355px){
   .brand{grid-template-columns:62px minmax(0,1fr);gap:10px}
   .game-icon{width:62px;height:62px}
   .collection-title-row h1{font-size:20px}
   .release-badge{padding-inline:7px}
   .fixed-tags span{font-size:10px}
   .games-item{padding:8px}
   .games-main{grid-template-columns:104px minmax(0,1fr);gap:9px}
   .games-cover{width:104px;height:104px}
   .games-info{min-height:104px}
   .store-tag{font-size:9px}
 }
 @media(prefers-reduced-motion:reduce){
   *,*::before,*::after{transition:none!important}
 }