:root{--bg:#0b0c10;--card:#151822;--text:#f4f6f8;--muted:#9aa3b2;--accent:#4aa3ff;--ok:#1bd97b}
.bank-stories{width:100%;overflow-x:auto;padding:12px 0;margin:0 0 12px;position:relative;z-index:1}
.bank-stories::-webkit-scrollbar{height:4px}
.bank-stories::-webkit-scrollbar-track{background:rgba(255,255,255,0.05);border-radius:2px}
.bank-stories::-webkit-scrollbar-thumb{background:rgba(74,163,255,0.5);border-radius:2px}
.bank-stories::-webkit-scrollbar-thumb:hover{background:rgba(74,163,255,0.7)}
.bank-stories-container{display:flex;gap:8px;padding:0 16px;align-items:center}
.bank-story-item{background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:transform 0.2s;width:auto;min-width:auto;max-width:none}
.bank-story-item:hover{transform:scale(1.05)}
.bank-story-item:active{transform:scale(0.95)}
.bank-story-circle{width:64px;height:64px;border-radius:50%;background:rgba(21,24,34,0.8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:2px solid rgba(255,255,255,0.1);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;transition:all 0.3s;box-shadow:0 2px 8px rgba(0,0,0,0.3);flex-shrink:0}
@supports not (backdrop-filter: blur(8px)){.bank-story-circle{background:rgba(21,24,34,0.95)}}
.bank-story-circle.active{border-color:var(--accent);border-width:3px;box-shadow:0 0 0 3px rgba(74,163,255,0.2),0 4px 12px rgba(74,163,255,0.3);transform:scale(1.1)}
.bank-story-logo{width:100%;height:100%;object-fit:cover;border-radius:50%}
.bank-story-text{font-size:12px;font-weight:700;color:var(--text);text-transform:uppercase;letter-spacing:0.5px}
*{box-sizing:border-box}html,body{padding:0;margin:0;background:linear-gradient(135deg,#0b0c10 0%,#0f1218 50%,#0b0c10 100%);background-attachment:fixed;color:var(--text);font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto,Ubuntu,Apple Color Emoji,Noto Color Emoji,Arial,sans-serif}
body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 50%,rgba(74,163,255,0.03) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,193,7,0.02) 0%,transparent 50%);pointer-events:none;z-index:0}
.wrap{max-width:1200px;margin:0 auto;padding:16px;position:relative;z-index:1}
header h1{margin:24px 0 4px;font-size:24px}header .sub{margin:0;color:var(--muted)}
.card{background:var(--card);padding:14px 12px;border-radius:12px;margin:12px 0}
label{display:block;font-size:14px;color:var(--muted);margin-bottom:6px}
input,select,button{width:100%;padding:12px 10px;border-radius:10px;border:1px solid #272a33;background:#0f121a;color:var(--text);transition:border-color 0.2s,box-shadow 0.2s}
input:focus,select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(74,163,255,0.1)}
select[multiple]{height:96px}
button{margin-top:10px;background:var(--accent);border:none;color:#001833;font-weight:600;cursor:pointer}
button:hover{opacity:0.9}
.results{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:14px 0}
.item{background:rgba(21,24,34,0.85);backdrop-filter:blur(10px) saturate(150%);-webkit-backdrop-filter:blur(10px) saturate(150%);border:1px solid rgba(255,255,255,0.08);border-radius:16px;padding:0;display:flex;flex-direction:column;min-height:420px;height:auto;overflow:hidden;transition:transform 0.2s,box-shadow 0.2s,border-color 0.2s,background 0.2s;position:relative;box-shadow:0 4px 16px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.05);will-change:transform}
@supports not (backdrop-filter: blur(10px)){.item{background:rgba(21,24,34,0.95)}}
.item.no-image{min-height:auto;height:auto}
.item:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.4),inset 0 1px 0 rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.12);background:rgba(21,24,34,0.9)}
@supports not (backdrop-filter: blur(10px)){.item:hover{background:rgba(21,24,34,0.98)}}
.item:focus-within{outline:2px solid var(--accent);outline-offset:2px}
.item[style*="cursor: pointer"]{cursor:pointer}
.item[style*="cursor: pointer"]:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(74,163,255,0.3),inset 0 1px 0 rgba(255,255,255,0.08);border-color:rgba(74,163,255,0.4);background:rgba(21,24,34,0.95)}
@supports not (backdrop-filter: blur(10px)){.item[style*="cursor: pointer"]:hover{background:rgba(21,24,34,0.98)}}
.item[style*="cursor: pointer"]:active{transform:translateY(-2px)}
.campaign-image-container{width:100%;height:180px;background:rgba(15,18,26,0.5);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:16px 16px 0 0;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center;position:relative;border-bottom:1px solid rgba(255,255,255,0.05)}
@supports not (backdrop-filter: blur(6px)){.campaign-image-container{background:rgba(15,18,26,0.8)}}
.campaign-image{width:100%;height:100%;object-fit:cover;display:block;transition:transform 0.3s}
.item:hover .campaign-image{transform:scale(1.05)}
.item-content{flex:1;display:flex;flex-direction:column;padding:12px;gap:6px;min-height:0;position:relative}
.item.no-image .item-content{padding-top:16px}
.card-header{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end;margin-bottom:8px;min-height:24px}
.category-badge{font-size:11px;background:linear-gradient(135deg,rgba(74,163,255,0.3) 0%,rgba(53,122,189,0.3) 100%);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#fff;border:1px solid rgba(74,163,255,0.3);border-radius:12px;padding:4px 10px;font-weight:600;text-transform:capitalize;box-shadow:0 2px 8px rgba(74,163,255,0.2),inset 0 1px 0 rgba(255,255,255,0.1);white-space:nowrap}
@supports not (backdrop-filter: blur(6px)){.category-badge{background:linear-gradient(135deg,rgba(74,163,255,0.5) 0%,rgba(53,122,189,0.5) 100%)}}
.end-date-badge{font-size:11px;background:rgba(255,193,7,0.15);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:#ffc107;border:1px solid rgba(255,193,7,0.25);border-radius:12px;padding:4px 10px;font-weight:500;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;box-shadow:0 1px 4px rgba(255,193,7,0.15),inset 0 1px 0 rgba(255,255,255,0.05)}
@supports not (backdrop-filter: blur(4px)){.end-date-badge{background:rgba(255,193,7,0.25)}}
.end-date-icon{font-size:10px;opacity:0.9}
.end-date-text{font-size:11px}
.merchant-badge{font-size:10px;background:rgba(39,42,51,0.5);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);color:var(--muted);border:1px solid rgba(58,63,77,0.3);border-radius:10px;padding:3px 8px;font-weight:500;white-space:nowrap;opacity:0.8}
@supports not (backdrop-filter: blur(3px)){.merchant-badge{background:rgba(39,42,51,0.7)}}
.bank-section{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.bank-logo-main{height:36px;width:36px;object-fit:cover;border-radius:50%;padding:0;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);box-shadow:none;flex-shrink:0;transition:transform 0.2s}
@supports not (backdrop-filter: blur(3px)){.bank-logo-main{background:rgba(21,24,34,0.9)}}
.bank-logo-main:hover{transform:scale(1.05)}
.bank-name-text{font-size:14px;font-weight:600;color:var(--text);opacity:0.9}
.bank-tag{font-size:12px;background:linear-gradient(135deg,rgba(74,163,255,0.35) 0%,rgba(53,122,189,0.35) 100%);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);color:#fff;border-radius:999px;padding:4px 10px;font-weight:600;display:inline-block;box-shadow:0 2px 4px rgba(0,0,0,0.2),inset 0 1px 0 rgba(255,255,255,0.1)}
@supports not (backdrop-filter: blur(4px)){.bank-tag{background:linear-gradient(135deg,rgba(74,163,255,0.6) 0%,rgba(53,122,189,0.6) 100%)}}
.title{display:flex;justify-content:space-between;gap:8px;align-items:flex-start;margin:8px 0 4px}
.title-text{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;line-height:1.4;max-height:4.2em;word-break:normal;overflow-wrap:anywhere;hyphens:none;font-size:16px;font-weight:600;color:var(--text)}
.cards-apps-badges{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0 8px 0;align-items:center;min-height:20px}
.card-app-badge{font-size:11px;background:#272a33;color:var(--muted);border:1px solid #3a3f4d;border-radius:4px;padding:4px 8px;display:inline-block;text-transform:capitalize;white-space:nowrap}
.conditions-section{display:flex;flex-direction:column;gap:6px;margin:8px 0;padding:10px;background:rgba(255,193,7,0.08);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border:1px solid rgba(255,193,7,0.2);border-left:3px solid rgba(255,193,7,0.5);border-radius:8px;box-shadow:0 2px 4px rgba(255,193,7,0.1),inset 0 1px 0 rgba(255,255,255,0.05)}
@supports not (backdrop-filter: blur(3px)){.conditions-section{background:rgba(255,193,7,0.12)}}
.conditions-label{font-size:12px;color:#ffc107;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px}
.conditions-badges{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.condition-badge{font-size:12px;background:rgba(255,193,7,0.15);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);color:#ffc107;border:1px solid rgba(255,193,7,0.25);border-radius:6px;padding:6px 10px;display:inline-block;font-weight:500;white-space:nowrap;box-shadow:0 1px 3px rgba(255,193,7,0.1),inset 0 1px 0 rgba(255,255,255,0.05)}
@supports not (backdrop-filter: blur(3px)){.condition-badge{background:rgba(255,193,7,0.22)}}
.benefits-section{display:flex;flex-direction:column;gap:6px;margin:8px 0;padding:10px;background:rgba(74,163,255,0.08);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);border:1px solid rgba(74,163,255,0.2);border-left:3px solid rgba(74,163,255,0.5);border-radius:8px;box-shadow:0 2px 4px rgba(74,163,255,0.1),inset 0 1px 0 rgba(255,255,255,0.05)}
@supports not (backdrop-filter: blur(3px)){.benefits-section{background:rgba(74,163,255,0.12)}}
.benefits-label{font-size:12px;color:var(--accent);font-weight:700;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:4px}
.benefits-badges{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.benefit-badge{font-size:12px;background:rgba(74,163,255,0.15);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);color:var(--accent);border:1px solid rgba(74,163,255,0.25);border-radius:6px;padding:6px 10px;display:inline-block;font-weight:500;white-space:nowrap;box-shadow:0 1px 3px rgba(74,163,255,0.1),inset 0 1px 0 rgba(255,255,255,0.05)}
@supports not (backdrop-filter: blur(3px)){.benefit-badge{background:rgba(74,163,255,0.22)}}
@media(max-width:1024px){.results{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.results{grid-template-columns:1fr}}
@media(max-width:480px){.card>div[style*="grid"]{grid-template-columns:1fr!important}.card>div[style*="grid"]>div:last-child{grid-column:1/-1;margin-top:12px}}
#pagination button{min-width:40px;font-size:18px;line-height:1}
#pagination button:disabled{opacity:0.5;cursor:not-allowed}
#pagination button:not(:disabled):hover{opacity:0.9}
.top{border-color:var(--ok)}
.tag{font-size:12px;background:#0f121a;border:1px solid #232735;border-radius:999px;padding:4px 8px;color:var(--muted)}
.bank-logo{height:24px;max-width:80px;object-fit:contain;filter:brightness(0) invert(1)}
.detaylar-indicator{display:block;margin-top:auto;padding:8px 0;color:var(--accent);font-size:13px;font-weight:500;text-align:center;flex-shrink:0;opacity:0.7;pointer-events:none}
.muted{color:var(--muted);text-align:center;padding-bottom:24px}
@media(min-width:720px){header h1{font-size:28px}}
.campaign-modal{display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:10000;align-items:center;justify-content:center;padding:20px}
.campaign-modal-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.8);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.campaign-modal-container{position:relative;background:var(--card);border-radius:16px;max-width:900px;max-height:90vh;width:100%;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,0.5);border:1px solid rgba(255,255,255,0.1)}
.campaign-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid rgba(255,255,255,0.1)}
.campaign-modal-header h2{margin:0;font-size:20px;font-weight:600;color:var(--text)}
.campaign-modal-close{background:none;border:none;color:var(--text);font-size:32px;line-height:1;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:background 0.2s}
.campaign-modal-close:hover{background:rgba(255,255,255,0.1)}
.campaign-modal-body{flex:1;overflow-y:auto;padding:24px;max-height:calc(90vh - 80px)}
.campaign-modal-loading{text-align:center;padding:40px;color:var(--muted)}
.campaign-modal-error{color:#ff6b6b;padding:16px;background:rgba(255,107,107,0.1);border-radius:8px;border:1px solid rgba(255,107,107,0.3)}
.campaign-detail-content{color:var(--text);line-height:1.6}
.campaign-detail-content img{max-width:100%;height:auto;border-radius:8px;margin:16px 0}
.campaign-detail-content a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent)}
.campaign-detail-content a:hover{opacity:0.8}
.campaign-detail-images{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;margin:20px 0}
.campaign-detail-images img{width:100%;height:auto;border-radius:8px;object-fit:cover}
.campaign-detail-external-link{display:inline-block;margin-top:24px;padding:12px 24px;background:var(--accent);color:#001833;border-radius:8px;font-weight:600;text-decoration:none;transition:opacity 0.2s}
.campaign-detail-external-link:hover{opacity:0.9}