:root {
--blt-blue:       #456990;
--blt-blue-dark:  #2d4a66;
--blt-gold:       #f7ca62;
--blt-gold-light: #e5d1b5;
--blt-bg:         #ffffff;
--blt-text:       #141617;
--blt-muted:      #6b7280;
--blt-border:     #e2e4e8;
--blt-red:        #d31100;
--blt-green:      #65bc7b;
--blt-shadow:     0 2px 12px rgba(0,0,0,0.10);
}
.blt-wrapper {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
max-width: 680px;
margin: 0 auto;
border-radius: 8px;
overflow: hidden;
box-shadow: var(--blt-shadow);
border: 1px solid var(--blt-border);
} .blt-header {
background: var(--blt-blue);
color: #fff;
padding: 14px 16px 12px;
} .blt-header-main {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 9px;
}
.blt-live-badge {
display: inline-flex;
align-items: center;
gap: 5px;
background: rgba(255,255,255,0.15);
border-radius: 4px;
padding: 3px 8px 3px 7px;
font-size: 10px;
font-weight: 800;
letter-spacing: 1.2px;
flex-shrink: 0;
}
.blt-live-dot {
width: 7px;
height: 7px;
border-radius: 50%;
background: var(--blt-gold);
flex-shrink: 0;
animation: blt-pulse 1.8s ease-in-out infinite;
}
@keyframes blt-pulse {
0%, 100% { opacity: 1;   transform: scale(1); }
50%       { opacity: 0.4; transform: scale(0.7); }
}
.blt-title {
font-size: 16px;
font-weight: 700;
line-height: 1.2;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis; } .blt-header-sub {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
min-height: 24px;
}
.blt-status {
font-size: 11px;
color: rgba(255,255,255,0.58);
white-space: nowrap;
flex: 1;
} .blt-push-btn {
display: inline-flex;
align-items: center;
gap: 5px;
background: rgba(255,255,255,0.12);
border: 1px solid rgba(255,255,255,0.3);
color: rgba(255,255,255,0.9);
font-size: 11px;
font-weight: 600;
padding: 4px 10px;
border-radius: 4px;
cursor: pointer;
white-space: nowrap;
flex-shrink: 0;
transition: background 0.15s, border-color 0.15s;
line-height: 1.4;
}
.blt-push-btn:hover {
background: rgba(255,255,255,0.2);
border-color: rgba(255,255,255,0.55);
}
.blt-push-btn.blt-push-active {
background: rgba(247,202,98,0.18);
border-color: var(--blt-gold);
color: var(--blt-gold);
}
.blt-push-btn.blt-push-blocked {
opacity: 0.45;
cursor: not-allowed;
} .blt-intro {
background: #f0f4f8;
border-bottom: 1px solid var(--blt-border);
padding: 9px 16px;
font-size: 13px;
color: #4a5568;
line-height: 1.5;
} .blt-feed {
background: var(--blt-bg); min-height: 120px;
overflow-y: auto;
scroll-behavior: smooth;
} @media (min-width: 769px) {
.blt-feed {
max-height: 600px;
}
}
.blt-feed::-webkit-scrollbar       { width: 4px; }
.blt-feed::-webkit-scrollbar-thumb { background: var(--blt-border); border-radius: 2px; } .blt-loading {
text-align: center;
padding: 40px 20px;
color: var(--blt-muted);
font-size: 14px;
}
.blt-spinner {
display: inline-block;
width: 14px;
height: 14px;
border: 2px solid var(--blt-border);
border-top-color: var(--blt-blue);
border-radius: 50%;
animation: blt-spin 0.7s linear infinite;
vertical-align: middle;
margin-right: 6px;
}
@keyframes blt-spin { to { transform: rotate(360deg); } } .blt-entry {
display: flex;
border-bottom: 1px solid var(--blt-border);
animation: blt-slide-in 0.3s ease;
}
.blt-entry:last-child { border-bottom: none; }
@keyframes blt-slide-in {
from { opacity: 0; transform: translateY(-5px); }
to   { opacity: 1; transform: translateY(0); }
}
.blt-entry.blt-new { background: #fffbee; } .blt-time-col {
display: flex;
flex-direction: column;
align-items: center;
justify-content: flex-start;
padding: 13px 10px 13px 14px;
min-width: 60px;
border-right: 1px solid var(--blt-border);
flex-shrink: 0;
}
.blt-time {
font-size: 13px;
font-weight: 700;
color: var(--blt-blue);
line-height: 1;
}
.blt-date {
font-size: 10px;
color: var(--blt-muted);
margin-top: 3px;
}
.blt-category-dot {
width: 7px;
height: 7px;
border-radius: 50%;
background: var(--blt-border);
margin-top: 8px;
}
.blt-category-dot[data-cat="result"] ,
.blt-category-dot[data-cat="ergebnis"] { background: var(--blt-gold); }
.blt-category-dot[data-cat="match"]  ,
.blt-category-dot[data-cat="kampf"]   { background: var(--blt-red); }
.blt-category-dot[data-cat="info"]    { background: var(--blt-green); }
.blt-category-dot[data-cat="alert"]  ,
.blt-category-dot[data-cat="wichtig"] { background: var(--blt-red); } .blt-content-col {
flex: 1;
padding: 12px 16px;
min-width: 0;
}
.blt-category-label {
display: inline-block;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.6px;
padding: 2px 7px;
border-radius: 3px;
background: #fef3d0;
color: #7a5a00;
margin-bottom: 5px;
}
.blt-category-label[data-cat="match"]  ,
.blt-category-label[data-cat="kampf"]  { background: #fde8e8; color: var(--blt-red); }
.blt-category-label[data-cat="info"]   { background: #e6f7ec; color: #2d7a4a; }
.blt-category-label[data-cat="alert"]  ,
.blt-category-label[data-cat="wichtig"]{ background: #fde8e8; color: var(--blt-red); }
.blt-message {
font-size: 14px;
line-height: 1.55;
color: var(--blt-text);
margin: 0;
word-break: break-word;
}
.blt-sender {
font-size: 11px;
color: var(--blt-muted);
margin-top: 5px;
} .blt-update-banner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
background: var(--blt-blue);
color: #fff;
padding: 10px 16px;
font-size: 13px;
font-weight: 600;
border-radius: 6px;
margin-bottom: 8px;
animation: blt-slide-in 0.3s ease;
}
.blt-update-btn {
background: var(--blt-gold);
color: #1a1a1a;
border: none;
border-radius: 4px;
padding: 5px 12px;
font-size: 12px;
font-weight: 700;
cursor: pointer;
white-space: nowrap;
flex-shrink: 0;
}
.blt-update-btn:hover { opacity: 0.9; } .blt-ios-banner {
max-width: 680px;
margin: 10px auto 0;
background: #fff;
border: 1px solid var(--blt-border);
border-left: 4px solid var(--blt-gold);
border-radius: 6px;
box-shadow: var(--blt-shadow);
animation: blt-slide-in 0.25s ease;
}
.blt-ios-inner {
position: relative;
padding: 16px 18px 14px;
}
.blt-ios-close {
position: absolute;
top: 10px;
right: 12px;
background: none;
border: none;
font-size: 20px;
color: var(--blt-muted);
cursor: pointer;
line-height: 1;
padding: 0;
}
.blt-ios-title {
display: block;
font-size: 14px;
color: var(--blt-text);
margin-bottom: 4px;
padding-right: 24px;
}
.blt-ios-sub {
font-size: 12px;
color: var(--blt-muted);
margin: 0 0 10px;
}
.blt-ios-steps {
margin: 0;
padding-left: 18px;
font-size: 13px;
color: var(--blt-text);
line-height: 1.8;
}
.blt-ios-icon {
display: inline-block;
font-size: 11px;
background: var(--blt-blue);
color: #fff;
border-radius: 4px;
padding: 1px 4px;
vertical-align: middle;
} .blt-image-link {
float: right;
margin: 0 0 6px 12px;
flex-shrink: 0;
}
.blt-image {
display: block;
width: 120px;
height: 90px;
object-fit: cover;
border-radius: 4px;
cursor: zoom-in;
}
.blt-content-col::after {
content: '';
display: table;
clear: both;
}
@media (max-width: 480px) {
.blt-image { width: 90px; height: 68px; }
} .blt-empty {
text-align: center;
padding: 48px 20px;
color: var(--blt-muted);
}
.blt-empty-icon { font-size: 30px; margin-bottom: 10px; }
.blt-empty p    { margin: 0; font-size: 14px; }
.blt-error {
text-align: center;
padding: 20px;
color: var(--blt-red);
font-size: 13px;
} .blt-new-badge {
display: none;
position: sticky;
top: 0;
z-index: 10;
text-align: center;
padding: 8px 12px;
background: var(--blt-blue);
color: #fff;
font-size: 12px;
font-weight: 600;
cursor: pointer;
}
.blt-new-badge:hover { background: var(--blt-blue-dark); } @media (max-width: 480px) {
.blt-wrapper { border-radius: 6px; }
.blt-header { padding: 12px 14px 10px; }
.blt-title { font-size: 15px; }
.blt-live-badge {
padding: 3px 7px 3px 6px;
font-size: 9px;
}
.blt-intro {
font-size: 12px;
padding: 8px 14px;
}
.blt-time-col {
min-width: 50px;
padding: 11px 8px 11px 10px;
}
.blt-time  { font-size: 12px; }
.blt-date  { display: none; }
.blt-category-dot { display: none; }
.blt-content-col { padding: 11px 12px; }
.blt-message     { font-size: 14px; }
.blt-sender      { font-size: 11px; }
}