/* OBS Browser Source Overlay — transparent background, compact layout */

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background: transparent !important;
    font-family: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
}

.obs-card {
    display: inline-flex;
    flex-direction: column;
    background: rgba(6, 4, 2, 0.82);
    border: 1px solid rgba(217, 115, 24, 0.5);
    border-radius: 10px;
    padding: 10px 14px;
    min-width: 280px;
    backdrop-filter: blur(8px);
    box-shadow: 0 4px 24px rgba(0,0,0,.6);
}

.obs-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(217,115,24,.35);
}

.obs-logo {
    width: 32px;
    height: 32px;
    object-fit: contain;
    border-radius: 4px;
}

.obs-team-name {
    font-size: 15px;
    font-weight: 700;
    color: #f0a035;
    letter-spacing: .03em;
}

.obs-roster {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.obs-player {
    display: grid;
    grid-template-columns: 72px 1fr auto;
    align-items: center;
    gap: 8px;
    font-size: 12px;
}

.obs-role {
    color: #c89b3c;
    font-weight: 700;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.obs-riot {
    color: #e8dcc8;
    font-weight: 600;
}
.obs-tag { color: #5a6a7a; font-size: .9em; }

.obs-rank {
    font-size: 11px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 8px;
    border: 1px solid;
    white-space: nowrap;
}

.obs-unranked   { color: #5a6a7a; border-color: #2a3a4a; background: transparent; }
.obs-iron       { color: #9eaab8; border-color: #4a5a68; background: rgba(78,90,104,.2); }
.obs-bronze     { color: #c8a87a; border-color: #7a5a30; background: rgba(120,88,46,.2); }
.obs-silver     { color: #c0c8d0; border-color: #6a7a88; background: rgba(90,106,120,.2); }
.obs-gold       { color: #d4aa40; border-color: #7a6020; background: rgba(200,155,60,.2); }
.obs-platinum   { color: #5fc4c4; border-color: #2a7a7a; background: rgba(47,124,124,.2); }
.obs-emerald    { color: #56d98c; border-color: #1a7a4a; background: rgba(26,122,74,.2); }
.obs-diamond    { color: #8ab4f8; border-color: #3a68c8; background: rgba(58,104,200,.2); }
.obs-master     { color: #e8b4ff; border-color: #8830cc; background: rgba(136,48,204,.2); }
.obs-grandmaster{ color: #ff7c7c; border-color: #cc3030; background: rgba(204,48,48,.2); }
.obs-challenger { color: #ffe066; border-color: #cc9900; background: rgba(204,153,0,.2); }
