:root{--blue:#1268bd;--top:#1449f5;--red:#ff4a4f;--text:#222;--muted:#777;--line:#eceff3;--bg:#fff}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:#fff;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.topbar{height:22px;background:var(--top)}
.site-header{padding:18px 0 14px;background:#fff}.wrap{width:min(980px,calc(100% - 28px));margin:0 auto}.brand{display:flex;align-items:center;justify-content:center;gap:9px;font-weight:700;font-size:22px;letter-spacing:.5px}.brand-logo{display:block;width:100%;object-fit:contain}.brand-mark{width:22px;height:22px;border:3px solid #15d6ea;transform:rotate(45deg);border-radius:5px;position:relative}.brand-mark:after{content:"";position:absolute;width:6px;height:6px;background:#15d6ea;border-radius:50%;left:5px;top:5px}.subtitle{text-align:center;margin-top:4px;color:#999;font-size:12px}
.order-box{border:1px solid var(--line);background:#fff;margin:4px auto 14px;padding:14px 18px}.order-head{display:flex;align-items:center;gap:12px;border-bottom:1px solid #f0f1f4;padding-bottom:10px;margin-bottom:12px}.order-head b{font-size:15px;color:#f04444}.order-head span{font-size:11px;color:#999}.order-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:12px;align-items:end}.order-field label{display:block;font-size:12px;color:#555;margin-bottom:6px}.order-field .input{width:100%}.order-action .btn{min-width:92px}.order-result{margin-top:14px;border-top:1px dashed #eceff3;padding-top:12px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 14px}.order-result>div{min-width:0}.order-result span{display:block;font-size:11px;color:#999;margin-bottom:4px}.order-result b{font-size:13px;font-weight:600;word-break:break-all}.order-result .order-status{color:#16a34a}.order-note{grid-column:1/-1;border-top:1px dashed #eceff3;padding-top:10px}.order-note p{margin:0;font-size:12px;line-height:1.65;color:#555}.order-error{margin-top:12px;padding:9px 11px;background:#fff5f5;border:1px solid #ffd5d7;color:#c43d42;font-size:12px}.order-success{margin-top:12px;padding:9px 11px;background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d;font-size:12px}.submit-order-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 150px;gap:12px;align-items:end}.submit-order-form .submit-note{grid-column:1/3}.submit-actions{display:flex;gap:8px;align-items:end}.submit-actions .btn{min-width:86px}.my-order-table-wrap{margin-top:14px;border-top:1px dashed #eceff3;padding-top:10px;overflow-x:auto}.my-order-table{width:100%;border-collapse:collapse;font-size:12px}.my-order-table th,.my-order-table td{padding:9px 8px;border-bottom:1px solid #f0f1f4;text-align:left;white-space:nowrap}.my-order-table th{color:#777;font-weight:500;background:#fafafa}.my-order-table td:last-child{white-space:normal;min-width:150px;color:#666}.my-order-table .order-status{color:#16a34a;font-weight:600}
.filter-box{border:1px solid var(--line);padding:16px 18px;margin:4px auto 16px;border-radius:2px;background:#fff}.filter-line{display:flex;gap:10px;align-items:center;min-height:32px;border-bottom:1px dashed #f0f1f4}.filter-line:last-child{border-bottom:0}.filter-label{width:74px;color:#555;font-size:13px;flex:none}.filter-options{display:flex;gap:8px;flex-wrap:wrap}.chip{font-size:12px;padding:4px 8px;border-radius:2px;color:#666}.chip.active,.chip:hover{background:var(--red);color:#fff}.search-line{display:grid;grid-template-columns:1fr 150px 120px auto;gap:8px;margin-top:12px}.input,.select{height:34px;border:1px solid #e2e5e9;padding:0 10px;font-size:13px;background:white}.btn{height:34px;border:0;padding:0 16px;border-radius:2px;cursor:pointer;font-size:13px}.btn-red{background:var(--red);color:white}.btn-green{background:#22c55e;color:#fff}.section-title{display:flex;align-items:center;justify-content:space-between;margin:14px 0 10px}.section-title h2{font-size:16px;margin:0;color:#f04444;font-weight:700}.section-title small{color:#aaa;font-weight:400}
.toolbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #eee;padding:0 0 9px;margin-bottom:10px;gap:10px}.tabs{display:flex;gap:4px;flex-wrap:wrap}.tab{padding:6px 13px;font-size:12px;color:#666;border:1px solid transparent}.tab.active{background:var(--red);color:#fff}.sorts{display:flex;align-items:center;gap:8px;font-size:12px;color:#777}.sorts select{height:28px;border:1px solid #e6e6e6;background:#fff}
.game-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px 12px}.game-card{min-width:0}.cover-wrap{position:relative;border:1px solid #e9ebef;background:#f7f8fa;overflow:hidden}.platform-ribbon{height:24px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 7px;font-size:11px;font-weight:600}.platform-ribbon .tag{background:#f84040;border-radius:2px;padding:1px 4px;font-size:10px}.cover{width:100%;aspect-ratio:44/49;object-fit:cover;background:#f2f3f5}.game-card h3{font-size:13px;line-height:1.35;margin:6px 0 2px;height:35px;overflow:hidden;font-weight:600}.meta{display:flex;gap:5px;align-items:center;color:#999;font-size:10px;white-space:nowrap;overflow:hidden}.meta .dot{width:3px;height:3px;border-radius:50%;background:#bbb}.summary{font-size:12px;color:#888;line-height:1.6;margin-top:6px}.empty{padding:50px;text-align:center;color:#999;border:1px dashed #ddd}.pagination{display:flex;justify-content:center;gap:6px;margin:24px 0 40px}.pagination a,.pagination span{min-width:30px;height:30px;padding:0 8px;border:1px solid #e3e5e8;display:flex;align-items:center;justify-content:center;font-size:12px}.pagination .active{background:var(--red);color:#fff;border-color:var(--red)}
.detail{display:grid;grid-template-columns:280px 1fr;gap:24px;margin-top:14px}.detail-cover{border:1px solid #eee}.detail-title{margin:0 0 12px;font-size:25px}.detail-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;font-size:13px;color:#666}.detail-meta b{color:#333}.content{margin-top:24px;border-top:1px solid #eee;padding-top:20px;line-height:1.85;font-size:15px}.content img{max-width:100%;height:auto;margin:12px auto}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;border:1px solid #eee}.notice{background:#fff8e6;border:1px solid #f7df9d;color:#8a6511;padding:10px 12px;font-size:12px;margin:10px 0 16px}.footer{border-top:1px solid #eee;padding:25px 0 35px;text-align:center;color:#aaa;font-size:12px;margin-top:30px}
@media(max-width:760px){.order-form,.submit-order-form{grid-template-columns:1fr}.submit-order-form .submit-note{grid-column:auto}.submit-actions{width:100%}.submit-actions .btn{flex:1}.order-result{grid-template-columns:repeat(2,minmax(0,1fr))}.order-action .btn{width:100%}.order-head{align-items:flex-start;flex-direction:column;gap:4px}.wrap{width:min(100% - 18px,980px)}.search-line{grid-template-columns:1fr 1fr}.search-line .input{grid-column:1/-1}.game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 9px}.filter-label{width:62px}.detail{grid-template-columns:1fr}.detail-cover{max-width:360px}.gallery{grid-template-columns:repeat(2,1fr)}}

/* 采购式前台 */
.purchase-page{padding-bottom:24px}.purchase-message{margin:4px 0 16px;padding:12px 14px;border-radius:4px;font-size:13px}.purchase-message.success{background:#f0fdf4;border:1px solid #bbf7d0;color:#15803d}.purchase-message.error{background:#fff5f5;border:1px solid #ffd5d7;color:#c43d42}.purchase-summary-card,.capacity-card{background:#fff;border:1px solid #f0f1f3;border-radius:9px;box-shadow:0 3px 15px rgba(0,0,0,.08);margin:8px 0 22px;padding:14px 15px}.capacity-summary{width:100%;border-collapse:collapse;border:1px solid #eceef1;font-size:13px}.capacity-summary th,.capacity-summary td{border:1px solid #eceef1;height:42px;padding:0 14px;text-align:left}.capacity-summary th{width:126px;font-weight:600}.capacity-summary td strong{font-weight:500}.btn-small{height:30px;font-size:12px;padding:0 12px}.summary-link-btn{border:0;background:transparent;color:#888;font-size:12px;margin-left:10px;cursor:pointer}.summary-link-btn:hover{color:var(--red)}.purchase-summary-actions{display:flex;justify-content:center;gap:30px;padding:24px 0 4px}.purchase-summary-actions .btn{min-width:86px}.capacity-card{padding:0 0 22px}.capacity-title{font-size:16px;padding:15px 16px;border-bottom:1px solid #f0f0f0}.capacity-title span{color:#ff4a4f}.capacity-options{display:flex;flex-wrap:wrap;align-items:stretch;gap:16px 18px;padding:25px 28px 0}.capacity-option{min-height:52px;height:auto;width:auto;max-width:100%;flex:0 0 auto;border:1px solid #eceef1;border-radius:4px;display:inline-flex;align-items:center;padding:10px 20px;cursor:pointer;white-space:nowrap;font-size:13px;line-height:1.45;transition:border-color .15s,color .15s,background .15s,box-shadow .15s,transform .15s;background:#fff;box-sizing:border-box}.capacity-option:hover{border-color:#ff9da0;box-shadow:0 4px 12px rgba(255,74,79,.08);transform:translateY(-1px)}.capacity-option .capacity-label{min-width:0;white-space:nowrap}.capacity-option strong{white-space:nowrap}.capacity-option input{position:absolute;opacity:0;pointer-events:none}.capacity-option .radio-dot{width:14px;height:14px;border:1px solid #dfe3e7;border-radius:50%;margin-right:10px;position:relative;flex:none}.capacity-option strong{font-size:12px;margin-left:4px;font-weight:600}.capacity-option.active{border-color:#ff6b70;color:#ff5a5f;background:#fffafa;box-shadow:0 4px 12px rgba(255,74,79,.08)}.capacity-option.active .radio-dot{border-color:#ff6b70;background:#ff6b70;box-shadow:inset 0 0 0 3px #ff6b70}.purchase-filter{margin:0 0 14px}.purchase-filter-row{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}.purchase-big-select{height:44px;border:1px solid #eceef1;background:#fff;padding:0 16px;font-size:15px;appearance:auto}.purchase-search{display:grid;grid-template-columns:1fr 92px}.purchase-search input{height:44px;border:1px solid #eceef1;border-right:0;padding:0 16px;font-size:15px;outline:none}.purchase-search .btn{height:44px;border-radius:0;font-size:15px}.purchase-tabs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:20px;padding:10px;background:#f7f8fa;border:1px solid #f0f1f3;border-radius:12px}.purchase-tab{height:48px;display:flex;align-items:center;justify-content:center;background:#fff;border:1px solid #e7e9ed;border-radius:9px;font-size:14px;font-weight:600;color:#3e434b;box-shadow:0 2px 8px rgba(0,0,0,.035);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,color .16s ease,background .16s ease}.purchase-tab span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.purchase-tab:hover{border-color:#ff9da0;color:#ff555b;box-shadow:0 6px 16px rgba(255,74,79,.10);transform:translateY(-1px)}.purchase-tab.active{background:linear-gradient(135deg,#ff7075,#ff5057);border-color:#ff565c;color:#fff;box-shadow:0 7px 18px rgba(255,74,79,.22);transform:translateY(-1px)}.purchase-page .section-title{margin-top:16px}.purchase-page .game-card{position:relative}.game-cover-button{width:100%;padding:0;margin:0;border:0;background:transparent;cursor:pointer;text-align:inherit;display:block}.game-card .cover-wrap{transition:.16s}.game-card.selected .cover-wrap{border:2px solid #ff595f}.selected-mask{position:absolute;inset:auto 6px 6px auto;background:rgba(255,78,84,.93);color:#fff;font-size:11px;padding:4px 7px;border-radius:2px;display:none}.selected-mask i{font-style:normal;margin-right:2px}.game-card.selected .selected-mask{display:block}.game-card.selected h3{color:#ff4f55}.game-card h3{cursor:default}.front-toast{position:fixed;left:50%;top:90px;transform:translate(-50%,-15px);background:rgba(30,30,30,.92);color:#fff;padding:10px 16px;border-radius:4px;z-index:1200;font-size:13px;opacity:0;visibility:hidden;transition:.2s;pointer-events:none}.front-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0)}body.modal-open{overflow:hidden}.purchase-modal{position:fixed;inset:0;background:rgba(0,0,0,.48);z-index:1100;display:none;align-items:center;justify-content:center;padding:22px}.purchase-modal.show{display:flex}.purchase-modal-card{width:min(1000px,96vw);height:min(790px,90vh);background:#fff;box-shadow:0 12px 42px rgba(0,0,0,.18);display:flex;flex-direction:column}.purchase-modal-head{height:76px;flex:none;background:#fafafa;border-bottom:1px solid #f1f1f1;position:relative;display:flex;align-items:center;justify-content:center}.purchase-modal-head h2{font-size:20px;font-weight:500;margin:0}.purchase-modal-close{position:absolute;right:24px;top:50%;transform:translateY(-50%);border:0;background:none;color:#ff6469;font-size:15px;cursor:pointer}.purchase-modal-card form{display:flex;flex-direction:column;min-height:0;flex:1}.purchase-customer-row,.my-orders-search{display:grid;grid-template-columns:1fr 1fr 118px;gap:24px;padding:24px 26px}.purchase-customer-row input,.my-orders-search input{height:50px;border:1px solid #e8eaed;padding:0 16px;font-size:14px;outline:none}.purchase-customer-row .btn,.my-orders-search .btn{height:50px;font-size:14px}.selected-table-wrap{margin:0 26px;border:1px solid #e8eaed;min-height:0;flex:1;overflow:auto;position:relative}.selected-table{width:100%;border-collapse:collapse;font-size:13px}.selected-table td{height:50px;border-bottom:1px solid #eceef1;border-right:1px solid #eceef1;padding:0 10px}.selected-table td:last-child{border-right:0}.sel-index{width:60px;text-align:center}.sel-name{text-align:center}.sel-size{width:82px;text-align:center}.sel-code{width:190px;white-space:nowrap}.sel-remove{width:62px;text-align:center}.sel-remove button{border:0;background:none;color:#ff5d63;cursor:pointer}.selected-empty{padding:36px 20px;text-align:center;color:#aaa;font-size:13px}.selected-modal-summary{flex:none;padding:14px 26px 22px;text-align:right;color:#777;font-size:13px}.selected-modal-summary b{color:#ff555b}.my-orders-modal-card{height:min(720px,88vh)}.my-orders-search{padding-bottom:18px}.my-orders-list{margin:0 26px 26px;overflow:auto;border:1px solid #eceef1}.my-order-item{padding:14px 16px;border-bottom:1px solid #eee}.my-order-item:last-child{border-bottom:0}.my-order-top{display:flex;justify-content:space-between;gap:12px}.my-order-top span{color:#16a34a;font-size:12px}.my-order-info{display:flex;gap:18px;flex-wrap:wrap;margin-top:8px;color:#888;font-size:12px}.my-order-games{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.my-order-games span{background:#f7f7f7;padding:5px 7px;font-size:11px;color:#666}.order-query-tip{padding-top:60px}
@media(max-width:760px){.purchase-summary-card,.capacity-card{border-radius:5px;margin-bottom:14px}.capacity-summary th{width:100px}.capacity-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:14px}.capacity-option{width:100%;max-width:none;min-width:0;min-height:48px;padding:8px 6px;justify-content:center;white-space:normal;font-size:11px;line-height:1.35;text-align:center}.capacity-option .radio-dot{width:12px;height:12px;margin-right:6px}.capacity-option .capacity-label,.capacity-option strong{white-space:normal;overflow-wrap:anywhere}.capacity-option strong{font-size:10px;margin-left:2px}.purchase-filter-row{grid-template-columns:1fr;gap:10px}.purchase-tabs{grid-template-columns:repeat(3,1fr);gap:7px;margin-top:10px;padding:7px;border-radius:9px}.purchase-tab{height:40px;font-size:12px;border-radius:7px}.purchase-modal{padding:0}.purchase-modal-card,.my-orders-modal-card{width:100vw;height:100vh;max-height:none}.purchase-modal-head{height:58px}.purchase-modal-head h2{font-size:18px}.purchase-modal-close{right:14px}.purchase-customer-row,.my-orders-search{grid-template-columns:1fr;padding:14px;gap:10px}.purchase-customer-row input,.my-orders-search input,.purchase-customer-row .btn,.my-orders-search .btn{height:42px}.selected-table-wrap{margin:0 14px}.sel-index{width:36px}.sel-size{width:60px}.sel-code{width:116px;font-size:11px}.sel-remove{width:48px}.selected-table td{padding:0 5px}.selected-modal-summary{padding:12px 14px 16px}.summary-link-btn{display:block;margin:7px 0 0}.purchase-summary-actions{gap:14px;padding-top:18px}}