.banner-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;margin-bottom:12px;border:1px solid #d8ecfb;border-radius:16px;background:linear-gradient(112deg,#fafdff,#edf8ff 52%,#f7fcff);box-shadow:0 8px 24px #1b79b10d}.banner-kicker{margin:0 0 3px;color:#1689ce;font-size:10px;font-weight:800;letter-spacing:1.2px}.banner-toolbar h2{margin:0;color:#163b5d;font-size:20px}.banner-toolbar p{margin:4px 0 0;color:#7790a5;font-size:13px}.banner-create{border-radius:9px;box-shadow:0 6px 14px #1477d22b}.banner-stats{display:flex;gap:9px;margin:0 0 12px}.banner-stats span{min-width:104px;padding:8px 11px;border:1px solid #e1eef7;border-radius:10px;background:#fff;color:#7690a3;font-size:12px}.banner-stats b{margin-right:5px;color:#137bc1;font-size:17px}.banner-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:12px}.banner-card{display:flex;min-height:156px;overflow:hidden;border:1px solid #dcecf6;border-radius:14px;background:#fff;box-shadow:0 6px 18px #173a5d0a;transition:transform .18s,box-shadow .18s}.banner-card:hover{transform:translateY(-2px);box-shadow:0 12px 24px #173a5d14}.banner-art{display:grid;flex:0 0 31%;place-items:center;overflow:hidden;background:linear-gradient(145deg,#d8f3ff,#effaff);color:#5d9fc3;font-size:11px}.banner-art img{width:100%;height:100%;object-fit:cover}.banner-info{display:flex;min-width:0;flex:1;flex-direction:column;padding:12px}.banner-head{display:flex;justify-content:space-between;gap:8px}.banner-head h2{margin:3px 0 0;overflow:hidden;color:#214966;font-size:15px;text-overflow:ellipsis;white-space:nowrap}.banner-type{display:inline-block;color:#1885c9;font-size:10px;font-weight:700;letter-spacing:.2px}.banner-status{flex:0 0 auto;padding:3px 7px;border-radius:99px;font-size:10px;font-weight:700}.banner-status.live{background:#e8f9ef;color:#16834b}.banner-status.scheduled{background:#edf5ff;color:#2878be}.banner-status.expired{background:#fff6e6;color:#b7791f}.banner-status.off{background:#f2f4f6;color:#758392}.banner-info>p{min-height:30px;overflow:hidden;margin:7px 0;color:#71889a;font-size:12px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.banner-period{display:grid;grid-template-columns:1fr;gap:4px;color:#608096;font-size:11px}.banner-period span{overflow:hidden;padding:3px 5px;border-radius:5px;background:#f4f9fc;text-overflow:ellipsis;white-space:nowrap}.banner-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:auto;padding-top:7px}.banner-actions button{border:1px solid #cce1f0;border-radius:6px;background:#fff;color:#35617e;padding:5px 8px;font:inherit;font-size:12px;cursor:pointer}.banner-actions button:hover{border-color:#50a5dd;color:#137bc1;background:#f4fbff}.banner-empty{padding:54px 20px;border:1px dashed #bdd8e9;border-radius:14px;background:#fbfdff;color:#7893a5;text-align:center}.banner-editor-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.banner-editor-grid .wide{grid-column:1/-1}.banner-upload-preview{display:grid;place-items:center;width:100%;height:170px;overflow:hidden;margin-top:6px;border:1px dashed #9ec7e2;border-radius:12px;background:#f4fbff;color:#6e97b0}.banner-upload-preview img{width:100%;height:100%;object-fit:cover}.banner-file-button{display:inline-block;width:auto;margin:10px 0 0!important;padding:8px 12px;border:1px solid #b8d9ee;border-radius:8px;background:#edf8ff;color:#1379ba;cursor:pointer}.banner-file-button input{display:none}.banner-editor-grid small{display:block;margin-top:6px;color:#8b9ba8}.banner-preview-panel{overflow:hidden;border:1px solid #d9eaf5;border-radius:14px;background:#f7fbfe}.banner-preview-panel img{display:block;width:100%;height:260px;object-fit:cover;background:linear-gradient(145deg,#d8f3ff,#effaff)}.banner-preview-panel>p{padding:0 18px;color:#547287}.banner-preview-panel>div{display:flex;justify-content:space-between;gap:10px;padding:13px 18px;border-top:1px solid #e2edf4;color:#5f8197;font-size:12px}@media(max-width:760px){.banner-toolbar,.banner-card{flex-direction:column;align-items:stretch}.banner-toolbar{gap:14px}.banner-grid{grid-template-columns:1fr}.banner-art{min-height:170px;flex-basis:auto}.banner-editor-grid{grid-template-columns:1fr}.banner-editor-grid .wide{grid-column:auto}.banner-stats{overflow:auto}.banner-stats span{min-width:115px}.banner-preview-panel>div{align-items:flex-start;flex-direction:column}}