*{box-sizing:border-box}
html,body{overflow-x:hidden}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;background:#f4f5f8;color:#1f2430;font-size:14px}
a{text-decoration:none;color:inherit}
.desktop-tip{position:fixed;inset:0;background:#111;color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;z-index:9999}
.app,.detail,.admin{max-width:372px;margin:0 auto;padding:0 12px 22px}
.hero{margin-top:12px;border-radius:24px;padding:20px 12px 14px;background:linear-gradient(135deg,#4f69d9,#5b6fdc 48%,#7e57c2);color:#fff;text-align:center}
.hero__title{font-size:26px;font-weight:800;letter-spacing:1px}
.hero__sub{margin-top:6px;font-size:13px;opacity:.9}
.control-panel{margin-top:10px;padding:12px;border-radius:22px;background:#fff;box-shadow:0 8px 20px rgba(28,31,44,.07)}
.searchbar{display:flex;gap:8px;padding:0;background:transparent}
.searchbar input{flex:1;border:1px solid #ddd;border-radius:20px;padding:11px 14px;font-size:13px;outline:none}
.searchbar button{border:0;border-radius:20px;padding:0 16px;min-width:72px;height:42px;background:linear-gradient(135deg,#4f69d9,#7b63d1);color:#fff;font-size:13px;font-weight:700}
.tabs{display:flex;gap:8px;padding:10px 0 0;background:transparent;overflow:auto}
.tab{padding:10px 12px;border-radius:18px;background:#f1f2f6;white-space:nowrap;font-weight:600;font-size:13px}
.tab.active{background:linear-gradient(135deg,#4f69d9,#7b63d1);color:#fff}
.list{padding:10px 0 22px;display:grid;grid-template-columns:1fr;gap:10px}
.card{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 8px 20px rgba(28,31,44,.07)}
.card img{display:block;width:100%;height:128px;object-fit:cover}
.card h2{margin:10px 12px 5px;font-size:16px;line-height:1.25}
.tags{display:flex;gap:6px;flex-wrap:wrap;padding:0 12px 12px}
.tags span{padding:5px 8px;border-radius:8px;background:#f1f2f6;color:#7a7f8c;font-size:11px}
.modal{display:none;position:fixed;inset:0;z-index:1000}
.modal.open{display:block}
.modal__mask{position:absolute;inset:0;background:rgba(15,18,28,.42)}
.modal__panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(88vw,340px);background:#fff;border-radius:16px;padding:16px;box-shadow:0 26px 72px rgba(0,0,0,.18)}
.modal__title{font-size:17px;font-weight:800;text-align:center;margin-bottom:10px}
.modal__content{font-size:12px;line-height:1.65;color:#555;background:#f7f8fb;border-radius:10px;padding:10px}
.modal__actions{display:flex;gap:12px;margin-top:18px}
.btn{flex:1;display:flex;align-items:center;justify-content:center;height:38px;border-radius:12px;font-weight:700;font-size:12px}
.btn-ghost{background:#fff;border:1px solid #d7dbe6;color:#666}
.btn-primary{background:linear-gradient(135deg,#4f69d9,#7b63d1);color:#fff}
.detail{padding:0 0 24px}
.back{display:inline-block;margin:14px 4px 10px;padding:6px 0;font-size:18px;font-weight:700;color:#6b7280}
.cover-wrap{padding:0 0 10px}
.cover{width:100%;height:180px;object-fit:cover;display:block;border-radius:18px}
.detail-card,.promo-card,.article{margin:0 0 10px;background:#fff;border-radius:18px;padding:14px;box-shadow:0 8px 20px rgba(28,31,44,.07)}
.detail-card h1{margin:0 0 8px;font-size:20px}
.download-btn,.promo-btn{display:block;height:40px;line-height:40px;text-align:center;border-radius:12px;font-weight:800;font-size:13px;color:#fff;background:linear-gradient(135deg,#4f69d9,#7b63d1)}
.promo-card{padding:18px 12px;text-align:center;background:linear-gradient(135deg,#ff7eb6,#8e54e9);color:#fff;max-width:320px;margin-left:auto;margin-right:auto}
.promo-card.blue{background:linear-gradient(135deg,#43cea2,#185a9d)}
.promo-card .promo-title{font-size:18px;font-weight:800}
.promo-card .promo-text{margin:8px 0 10px;font-size:12px;opacity:.95}
.promo-card .promo-btn{background:#fff;color:#5f61d7}
.article h3{margin:0 0 10px;font-size:18px;border-left:4px solid #6b63d8;padding-left:8px}
.article p{line-height:1.8;font-size:14px;color:#444}
.admin{padding:24px;max-width:none}
.admin form{display:grid;gap:12px;background:#fff;border-radius:18px;padding:18px}
.admin h1,.admin h2{margin:8px 0}
.admin label{display:grid;gap:6px;font-weight:600}
.admin input,.admin textarea,.admin button{font:inherit;padding:10px 12px;border-radius:10px;border:1px solid #d9dce5}
.admin button{background:#4f69d9;color:#fff;font-weight:700;border:0}
.admin-grid{display:grid;grid-template-columns:minmax(360px,420px) minmax(360px,420px) minmax(320px,1fr);gap:18px;align-items:start}
.section-box{min-width:0;margin:0}
.login-box{max-width:480px;margin:0 auto 16px}
.panel-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.inline-form{margin:0}
.ghost{background:#f1f2f6 !important;color:#333 !important}
.game-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid #eee}
.tip{font-size:12px;color:#7a7f8c;margin-top:4px}
@media (max-width: 1100px){
  .admin-grid{grid-template-columns:1fr}
}
