/* PeepConnect [Abel Odorico] - 2026-05-22 15:30 | CSS modularizado da home */
        :root { --score: #f7d54a; }
        * { margin:0; padding:0; box-sizing:border-box; }
        html, body { height: 100%; width: 100%; }
        body {
            font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
            background: #000 url('fut.jpg') center/cover no-repeat fixed;
            color: #fff;
        }
        body::before {
            content: "";
            position: fixed;
            inset: 0;
            background: linear-gradient(to bottom, rgba(0,0,0,0.75), rgba(0,0,0,0.45), rgba(0,0,0,0.8));
            z-index: 0;
            pointer-events: none;
        }

        .header {
            position: fixed;
            top: 0; left: 0; right: 0;
            padding: 16px 15px;
            background: rgba(10,10,25,0.95);
            border-bottom: 1px solid rgba(255,208,0,0.3);
            text-align: center;
            z-index: 100;
        }
        .header .title {
            font-size: 1.5rem;
            font-weight: 800;
            color: #ffd000;
            text-shadow: 0 0 15px rgba(255, 208, 0, 0.6);
            animation: piscante 2s infinite;
        }
        @keyframes piscante {
            0%, 100% { opacity: 1; }
            50% { opacity: 0.75; }
        }

        .scroll-container {
            position: fixed;
            top: 70px; left: 0; right: 0; bottom: 0;
            overflow-y: auto;
            overflow-x: hidden;
            z-index: 10;
        }

        .scroll-content {
            max-width: 720px;
            margin: 0 auto;
            padding: 16px 12px 100px;
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        /* Barra de busca sticky */
        .search-bar-wrap {
            position: sticky;
            top: 0;
            z-index: 90;
            padding: 6px 0 8px;
            background: rgba(0,0,0,0.92);
            margin: 0 -2px;
        }
        .search-bar-inner {
            display: flex;
            align-items: center;
            gap: 8px;
            background: rgba(18,26,42,0.96);
            border: 1px solid rgba(255,208,0,0.25);
            border-radius: 50px;
            padding: 8px 16px;
            transition: border-color .2s;
        }
        .search-bar-inner:focus-within {
            border-color: rgba(255,208,0,0.7);
            box-shadow: 0 0 0 3px rgba(255,208,0,0.1);
        }
        .search-bar-inner .search-ico {
            color: rgba(255,208,0,0.6);
            font-size: 0.9rem;
            flex-shrink: 0;
        }
        #search-input {
            flex: 1;
            background: none;
            border: none;
            outline: none;
            color: #fff;
            font-size: 0.88rem;
            font-weight: 600;
            font-family: inherit;
        }
        #search-input::placeholder { color: rgba(255,255,255,0.3); }
        #search-clear {
            background: none; border: none; color: rgba(255,255,255,0.4);
            cursor: pointer; font-size: 1rem; padding: 0; line-height: 1;
            display: none;
            -webkit-tap-highlight-color: transparent;
        }
        .day-filter-wrap {
            display: flex;
            gap: 8px;
            overflow-x: auto;
            padding: 8px 0 12px;
            scrollbar-width: none;
        }
        .day-filter-wrap::-webkit-scrollbar { display: none; }
        .day-chip {
            min-height: 36px;
            padding: 0 14px;
            border-radius: 12px;
            border: 1px solid rgba(31,116,255,0.24);
            background: rgba(12,25,44,0.86);
            color: rgba(255,255,255,0.76);
            font-family: inherit;
            font-size: 0.82rem;
            font-weight: 800;
            white-space: nowrap;
            cursor: pointer;
        }
        .day-chip.ativo {
            background: linear-gradient(135deg, #1F74FF, #0057FF);
            border-color: rgba(255,255,255,0.10);
            color: #FFFFFF;
            box-shadow: 0 8px 28px rgba(31,116,255,0.20);
        }
        .search-nenhum {
            text-align: center; color: #555; font-size: 0.88rem;
            padding: 32px 16px; display: none;
        }

        .campeonato-titulo {
            background: linear-gradient(135deg, #ffd000, #ffaa00);
            color: #111;
            padding: 9px 24px;
            border-radius: 50px;
            font-weight: 800;
            text-transform: uppercase;
            font-size: 0.9rem;
            letter-spacing: 1px;
            display: inline-block;
            margin: 0 auto;
        }

        .comp-titulo-wrapper {
            margin-top: 30px;
            margin-bottom: 12px;
        }

        .welcome-msg {
            background: rgba(10, 14, 25, 0.85);
            border: 1px solid rgba(255, 208, 0, 0.25);
            border-radius: 16px;
            padding: 18px 16px;
            text-align: center;
            animation: fadeIn 0.6s ease-in;
            backdrop-filter: blur(12px);
            margin-bottom: 10px;
            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4), 0 0 15px rgba(255, 208, 0, 0.05);
            transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
            cursor: pointer;
        }
        .welcome-msg:hover, .welcome-msg:active {
            transform: translateY(-2px) scale(1.02);
            border-color: rgba(255, 208, 0, 0.5);
            box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6), 0 0 25px rgba(255, 208, 0, 0.15);
            background: rgba(14, 20, 36, 0.95);
        }
        .welcome-msg h2 {
            font-size: 1.15rem;
            color: #ffd000;
            margin: 6px 0 4px;
            font-weight: 800;
            letter-spacing: 0.5px;
            text-shadow: 0 0 12px rgba(255, 208, 0, 0.4);
        }
        .welcome-msg p {
            color: #94a3b8;
            font-size: 0.85rem;
            line-height: 1.4;
            margin: 0;
        }
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(-10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        .jogo-linha {
            background: rgba(18, 26, 42, 0.95);
            border-radius: 16px;
            padding: 15px 18px;
            border: 1px solid rgba(255,255,255,0.08);
            cursor: pointer;
            transition: all 0.3s;
            margin-bottom: 8px;
        }
        .jogo-linha:active {
            border-color: #8b35ff;
            background: rgba(139, 53, 255, 0.2);
        }

        .top-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
        }

        .time {
            display: flex;
            align-items: center;
            gap: 12px;
            flex: 1;
            min-width: 0;
        }
        .time img {
            width: 48px;
            height: 48px;
            object-fit: contain;
            flex-shrink: 0;
        }
        .time-name {
            font-size: 1rem;
            font-weight: 700;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .placar-area {
            display: flex;
            align-items: center;
            gap: 10px;
            font-weight: 800;
            flex-shrink: 0;
        }
        .score {
            font-size: 1.9rem;
            color: var(--score);
            min-width: 38px;
            text-align: center;
        }
        .vs-img {
            width: 32px;
            height: auto;
            opacity: 0.8;
        }

        .bottom-row {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-top: 12px;
            border-top: 1px solid rgba(255,255,255,0.1);
            margin-top: 10px;
            gap: 10px;
        }

        .canal-link {
            display: flex;
            align-items: center;
            gap: 8px;
            background: rgba(255,255,255,0.08);
            padding: 7px 14px;
            border-radius: 30px;
            font-size: 0.78rem;
            font-weight: 700;
            text-decoration: none;
            color: #fff;
            transition: all 0.3s;
        }
        .canal-link:hover {
            background: rgba(9, 217, 118, 0.3);
        }
        .canal-link img {
            width: 18px;
            height: 18px;
            object-fit: contain;
        }

        .hora {
            font-size: 1.2rem;
            font-weight: 800;
            color: #f7d54a;
        }

        .section-title {
            text-align: center;
            font-size: 1rem;
            font-weight: 800;
            color: #ef4444;
            margin-top: 30px;
            margin-bottom: 25px;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .jogo-linha.sem-transmissao {
            background: rgba(25, 22, 45, 0.9);
            border: 1px solid rgba(140, 130, 170, 0.25);
        }
        .jogo-linha.sem-transmissao:active {
            background: rgba(140, 130, 170, 0.15);
            border-color: rgba(140, 130, 170, 0.4);
        }

        /* Modal */
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.8);
            backdrop-filter: blur(4px);
            align-items: center;
            justify-content: center;
        }
        .modal.active {
            display: flex;
        }
        .modal-content {
            background: linear-gradient(135deg, #0a0e27 0%, #1a1642 100%);
            border: 2px solid rgba(139, 53, 255, 0.5);
            border-radius: 16px;
            padding: 20px;
            width: 90%;
            max-width: 350px;
            max-height: 80vh;
            display: flex;
            flex-direction: column;
            box-shadow: 0 0 50px rgba(139, 53, 255, 0.3);
            position: relative;
        }
        
        .modal-premium {
            background: linear-gradient(135deg, #0f172a 0%, #1e1b4b 100%) !important;
            border: 1px solid rgba(255, 208, 0, 0.3) !important;
            border-radius: 24px !important;
            padding: 35px !important;
            max-width: 420px !important;
            box-shadow: 0 20px 50px rgba(0,0,0,0.8), 0 0 20px rgba(255,208,0,0.1) !important;
            animation: modalPop 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            max-height: none !important;
        }
        
        .modal-premium::before {
            content: '';
            position: absolute;
            top: -50%; left: -50%; width: 200%; height: 200%;
            background: radial-gradient(circle, rgba(255,208,0,0.05) 0%, transparent 70%);
            pointer-events: none;
        }
        @keyframes modalPop {
            from { transform: scale(0.9); opacity: 0; }
            to { transform: scale(1); opacity: 1; }
        }
        .modal-title {
            font-size: 1.2rem;
            color: #ffd000;
            margin-bottom: 15px;
            font-weight: 800;
        }
        .modal-buttons-top {
            display: flex;
            gap: 8px;
            margin-bottom: 15px;
        }
        .btn-modal {
            flex: 1;
            padding: 10px;
            border: none;
            border-radius: 8px;
            font-weight: 800;
            cursor: pointer;
            font-size: 0.75rem;
            text-transform: uppercase;
        }
        .btn-select {
            background: linear-gradient(135deg, #09d976, #06b85c);
            color: #000;
        }
        .btn-deselect {
            background: linear-gradient(135deg, #ef4444, #b91c1c);
            color: #fff;
        }
        .modal-checkboxes {
            flex: 1;
            overflow-y: auto;
            display: flex;
            flex-direction: column;
            gap: 8px;
            margin-bottom: 15px;
            padding-right: 5px;
        }
        .checkbox-item {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 10px;
            background: rgba(139, 53, 255, 0.1);
            border-radius: 8px;
            cursor: pointer;
        }
        .checkbox-item:hover {
            background: rgba(139, 53, 255, 0.2);
        }
        .checkbox-item input[type="checkbox"] {
            cursor: pointer;
            width: 18px;
            height: 18px;
        }
        .checkbox-item label {
            flex: 1;
            cursor: pointer;
            font-weight: 600;
            font-size: 0.9rem;
        }
        .btn-close {
            padding: 12px;
            background: linear-gradient(135deg, #ffd000, #ffb700);
            color: #000;
            border: none;
            border-radius: 8px;
            font-weight: 800;
            cursor: pointer;
            text-transform: uppercase;
        }
        .btn-close:hover {
            box-shadow: 0 0 20px rgba(255, 208, 0, 0.6);
        }

        /* Botão Flutuante */
        .floating-btn {
            position: fixed;
            bottom: 30px;
            right: 30px;
            background: linear-gradient(135deg, #ffd000, #ffb700);
            color: #000;
            border: none;
            border-radius: 50px;
            padding: 10px 15px;
            font-weight: 800;
            font-size: 1rem;
            cursor: pointer;
            box-shadow: 0 4px 20px rgba(255, 208, 0, 0.4);
            transition: all 0.3s;
            z-index: 100;
            animation: piscanteBtn 1.5s ease-in-out infinite;
        }
        @keyframes piscanteBtn {
            0%, 100% { opacity: 1; box-shadow: 0 4px 20px rgba(255, 208, 0, 0.4); }
            50% { opacity: 0.7; box-shadow: 0 6px 30px rgba(255, 208, 0, 0.8); }
        }
        .floating-btn:hover {
            box-shadow: 0 6px 30px rgba(255, 208, 0, 0.6);
            transform: scale(1.05);
            animation: none;
        }

        /* Botão Flutuante Esquerdo ("Todos Canais" Verde Piscante) */
        .floating-btn-left {
            position: fixed;
            bottom: 30px;
            left: 30px;
            background: linear-gradient(135deg, #09d976, #06b85c);
            color: #000;
            border: none;
            border-radius: 50px;
            padding: 10px 15px;
            font-weight: 800;
            font-size: 1rem;
            cursor: pointer;
            box-shadow: 0 4px 20px rgba(9, 217, 118, 0.4);
            transition: all 0.3s;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 6px;
            z-index: 100;
            animation: piscanteBtnGreen 1.5s ease-in-out infinite;
        }
        @keyframes piscanteBtnGreen {
            0%, 100% { opacity: 1; box-shadow: 0 4px 20px rgba(9, 217, 118, 0.4); }
            50% { opacity: 0.7; box-shadow: 0 6px 30px rgba(9, 217, 118, 0.8); }
        }
        .floating-btn-left:hover {
            box-shadow: 0 6px 30px rgba(9, 217, 118, 0.6);
            transform: scale(1.05);
            animation: none;
            color: #000;
        }

        .scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }
        .scrollbar-hide::-webkit-scrollbar { display: none; }

        /* Botão Ao Vivo flutuante */
        .floating-btn-aovivo {
            position: fixed;
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%);
            background: rgba(20,20,20,0.92);
            color: #ff4444;
            border: 1.5px solid #ff4444;
            border-radius: 50px;
            padding: 9px 18px;
            font-weight: 800;
            font-size: 0.9rem;
            cursor: pointer;
            z-index: 100;
            display: flex;
            align-items: center;
            gap: 6px;
            transition: all 0.25s;
            backdrop-filter: blur(8px);
        }
        .floating-btn-aovivo .dot {
            width: 8px; height: 8px; border-radius: 50%;
            background: #ff4444;
            animation: pulseDot 1s ease-in-out infinite;
        }
        @keyframes pulseDot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.5;transform:scale(1.4)} }
        .floating-btn-aovivo.ativo {
            background: #ff4444;
            color: #fff;
            box-shadow: 0 4px 20px rgba(255,68,68,0.5);
        }
        .floating-btn-aovivo.ativo .dot { background: #fff; }

        /* Badge status inline no card */
        .badge-ao-vivo {
            display: inline-flex; align-items: center; gap: 4px;
            background: rgba(255,68,68,0.15); color: #ff4444;
            border: 1px solid rgba(255,68,68,0.35); border-radius: 20px;
            padding: 2px 8px; font-size: 0.7rem; font-weight: 700;
        }
        .badge-ao-vivo .dot { width:6px; height:6px; border-radius:50%; background:#ff4444; animation:pulseDot 1s ease-in-out infinite; }
        .badge-encerrado { display:inline-flex; align-items:center; gap:4px; background:rgba(100,100,100,0.15); color:#888; border:1px solid rgba(100,100,100,0.3); border-radius:20px; padding:2px 8px; font-size:0.7rem; font-weight:700; }
        .badge-agendado { display:inline-flex; align-items:center; gap:4px; background:rgba(255,208,0,0.1); color:#ffd000; border:1px solid rgba(255,208,0,0.3); border-radius:20px; padding:2px 8px; font-size:0.7rem; font-weight:700; }

        /* Drawer de detalhes */
        #drawer-jogo {
            position: fixed; inset: 0; z-index: 1100;
            display: flex; align-items: flex-end;
            pointer-events: none;
        }
        #drawer-jogo.open { pointer-events: all; }
        #drawer-backdrop {
            position: absolute; inset: 0;
            background: rgba(0,0,0,0.7);
            opacity: 0; transition: opacity 0.3s;
            backdrop-filter: blur(3px);
        }
        #drawer-jogo.open #drawer-backdrop { opacity: 1; }
        #drawer-panel {
            position: relative; z-index: 1;
            width: 100%; max-width: 700px; margin: 0 auto;
            background: linear-gradient(180deg, #0d1117 0%, #0a0e14 100%);
            border-top: 1px solid rgba(255,255,255,0.1);
            border-radius: 20px 20px 0 0;
            padding: 0;
            max-height: 90dvh;
            overflow-y: auto;
            overflow-x: hidden;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
            transform: translateY(100%);
            transition: transform 0.35s cubic-bezier(0.32,0.72,0,1);
        }
        #drawer-jogo.open #drawer-panel { transform: translateY(0); }
        .drawer-handle {
            width: 40px; height: 4px; background: rgba(255,255,255,0.2);
            border-radius: 2px; margin: 12px auto 8px;
            touch-action: none;
        }
        .drawer-close {
            position:absolute; top:12px; right:16px; background:none; border:none;
            color:#aaa; font-size:1.4rem; cursor:pointer; line-height:1;
            min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center;
            -webkit-tap-highlight-color: transparent;
        }
        /* Cabeçalho do drawer: competição em cima */
        .drawer-comp-header { display:flex; align-items:center; justify-content:center; gap:6px; padding:6px 20px 10px; }
        .drawer-comp-header img { width:16px; height:16px; object-fit:contain; }
        .drawer-comp-header span { font-size:0.72rem; color:#94a3b8; font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
        /* Times e placar */
        .drawer-teams { display:flex; align-items:center; justify-content:center; gap:10px; padding:0 16px 12px; }
        .drawer-team { display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; min-width:0; }
        .drawer-team img { width:64px; height:64px; object-fit:contain; }
        .drawer-team-name { font-size:0.85rem; font-weight:700; text-align:center; line-height:1.2; word-break:break-word; }
        .drawer-score-box { display:flex; flex-direction:column; align-items:center; gap:6px; flex-shrink:0; }
        .drawer-placar { font-size:2.4rem; font-weight:900; color:#ffd000; letter-spacing:3px; line-height:1; }
        .drawer-status-badge { font-size:0.75rem; }
        /* Linha de info (hora / data) */
        .drawer-info-row { display:flex; align-items:center; justify-content:center; gap:8px; padding:8px 16px 4px; flex-wrap:wrap; }
        .drawer-info-pill { display:inline-flex; align-items:center; gap:4px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.1); border-radius:20px; padding:4px 10px; font-size:0.72rem; color:#94a3b8; }
        /* Bloco de tempo/minuto em destaque */
        .drawer-match-info {
            display:flex; align-items:center; justify-content:center; gap:16px;
            padding: 8px 20px 12px; flex-wrap: wrap;
        }
        .drawer-minute-box {
            display:flex; flex-direction:column; align-items:center;
            background: rgba(255,68,68,0.12); border:1px solid rgba(255,68,68,0.35);
            border-radius: 16px; padding: 8px 20px; min-width:80px;
        }
        .drawer-minute-val { font-size:2rem; font-weight:900; color:#ff4444; line-height:1; }
        .drawer-minute-lbl { font-size:0.65rem; color:#ff8888; text-transform:uppercase; letter-spacing:.05em; margin-top:2px; }
        .drawer-progress-wrap { flex:1; min-width:120px; }
        .drawer-progress-track {
            height:6px; background:rgba(255,255,255,0.08); border-radius:3px; overflow:hidden; margin-bottom:4px;
        }
        .drawer-progress-fill { height:100%; background:linear-gradient(90deg,#ff4444,#ff8800); border-radius:3px; transition:width .5s; }
        .drawer-progress-lbl { font-size:0.7rem; color:#888; text-align:center; }
        .drawer-comp { display:none; }
        .drawer-video-wrap { padding:12px 16px 0; }
        .drawer-video-wrap video { width:100%; border-radius:10px; background:#000; max-height:200px; }
        /* Canais: grid de cards */
        .drawer-canais-section { padding:12px 16px; }
        .drawer-canais-label { font-size:0.7rem; color:#64748b; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
        .drawer-canais {
            display:flex; gap:8px; overflow-x:auto; padding-bottom:8px;
            -webkit-overflow-scrolling: touch;
        }
        .drawer-canal-card {
            display:flex; flex-direction:column; align-items:center; gap:6px;
            background:rgba(255,255,255,0.05); border:1.5px solid rgba(255,255,255,0.1);
            border-radius:16px; padding:10px 14px; cursor:pointer; min-width:80px;
            transition:background .15s, border-color .15s; flex-shrink:0;
            -webkit-tap-highlight-color: transparent;
            touch-action: manipulation;
            user-select: none;
        }
        .drawer-canal-card img { width:40px; height:40px; object-fit:contain; border-radius:6px; }
        .drawer-canal-card .dc-nome { font-size:0.68rem; font-weight:700; color:#fff; text-align:center; max-width:80px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .drawer-canal-card .dc-play { font-size:0.62rem; font-weight:700; color:#00d2ff; margin-top:1px; }
        .drawer-canal-card .dc-nosignal { font-size:0.62rem; color:#555; margin-top:1px; }
        .drawer-canal-card.tem-stream:hover,
        .drawer-canal-card.tem-stream:active { background:rgba(0,210,255,0.1); border-color:rgba(0,210,255,0.4); }
        .drawer-canal-card.sem-stream { cursor:default; opacity:.6; }
        .drawer-canal-card.ativo { background:rgba(0,210,255,0.1); border-color:rgba(0,210,255,0.5); }
        .drawer-actions {
            display:flex; gap:10px;
            padding:10px 16px calc(28px + env(safe-area-inset-bottom, 0px));
        }
        .drawer-btn-full {
            flex:1; background:linear-gradient(135deg,#ffd000,#ffb700); color:#000;
            border:none; border-radius:12px; padding:16px; font-weight:800; font-size:1rem;
            cursor:pointer; min-height:52px;
            -webkit-tap-highlight-color: transparent;
            touch-action: manipulation;
        }
        .drawer-btn-full:active { opacity:0.85; transform:scale(.98); }
        .drawer-no-stream { text-align:center; color:#555; padding:16px; font-size:0.85rem; }
        @media (max-width: 600px) {
            #drawer-panel {
                max-height: calc(92dvh - env(safe-area-inset-bottom, 0px));
            }
            .drawer-actions {
                padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
            }
        }

        /* Estilo para Jogos Encerrados */
        .jogo-encerrado {
            opacity: 0.5;
            filter: grayscale(1);
            cursor: pointer;
            border-color: rgba(255,255,255,0.1) !important;
        }
        .jogo-encerrado .canal-link {
            background: #333 !important;
            box-shadow: none !important;
            color: #888 !important;
        }
        .jogo-encerrado .score {
            color: #888 !important;
        }

        /* PeepConnect [Abel Odorico] - 2026-05-19 08:36 */
        :root {
            --brand-primary: #1F74FF;
            --brand-accent: #E51E2A;
            --brand-premium: #FFD700;
            --cyan-neon: #00E0FF;
            --green-neon: #00FFB3;
            --black-premium: #050816;
            --night-blue: #00002E;
            --dark-blue: #0C192C;
            --white-premium: #FAFAFA;
        }
        .mobile-bottom-nav { display:none; }
        .account-summary { display:flex; flex-direction:column; gap:8px; margin: 8px 0 18px; }
        .account-row {
            display:flex; justify-content:space-between; align-items:center; gap:14px;
            padding:12px 0; border-bottom:1px solid rgba(250,250,250,0.08);
        }
        .account-row span:first-child { color:rgba(250,250,250,0.62); font-size:.8rem; }
        .account-row strong { color:var(--white-premium); font-size:.9rem; text-align:right; }
        .account-status-ok { color:var(--green-neon) !important; }
        .account-status-bad { color:var(--brand-accent) !important; }
        .renew-card { margin: 12px 0 14px; padding:16px; border-radius:16px; border:1px solid rgba(255,215,0,.22); background:linear-gradient(135deg, rgba(255,215,0,.08), rgba(0,224,255,.05)); }
        .renew-card-title { display:flex; align-items:center; justify-content:space-between; gap:10px; color:var(--brand-premium); font-weight:800; font-size:.92rem; margin-bottom:6px; }
        .renew-card p { color:#94a3b8; font-size:.82rem; margin:0 0 12px; line-height:1.35; }
        .renew-btn { width:100%; border:none; border-radius:12px; padding:12px 14px; background:linear-gradient(135deg, var(--brand-premium), #ffb703); color:#050816; font-weight:900; cursor:pointer; }
        .renew-btn:disabled { opacity:.65; cursor:not-allowed; }
        /* PeepConnect [Abel Odorico] - 2026-05-19 18:47 */
        .pix-box-account { display:none; margin-top:12px; text-align:left; background:rgba(0,224,255,.06); border:1px solid rgba(0,224,255,.18); border-radius:16px; padding:12px; overflow:hidden; }
        .pix-box-account textarea { width:100%; min-height:72px; resize:none; border-radius:10px; border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.45); color:#fff; padding:10px; font-size:.78rem; overflow-wrap:anywhere; box-sizing:border-box; }
        .pix-document-box { margin:12px 0; }
        .pix-document-box label { display:block; color:#94a3b8; font-size:.78rem; margin-bottom:6px; }
        .pix-document-box input { width:100%; box-sizing:border-box; border-radius:12px; border:1px solid rgba(255,215,0,.2); background:rgba(5,8,22,.72); color:#fff; padding:12px; font-size:.9rem; outline:none; }
        .pix-document-box input:focus { border-color:rgba(255,215,0,.72); box-shadow:0 0 0 3px rgba(255,215,0,.12); }
        .pix-document-box small { display:block; margin-top:6px; color:rgba(250,250,250,.52); font-size:.72rem; line-height:1.3; }
        .pix-qr-account { display:flex; justify-content:center; background:#fff; border-radius:12px; padding:10px; margin:0 auto 10px; width:180px; min-height:180px; max-width:100%; box-sizing:border-box; }
        .pix-qr-account canvas, .pix-qr-account img { max-width:100%; height:auto !important; }
        .pix-feedback-account { margin:10px 0 0; color:#94a3b8; font-size:.82rem; line-height:1.35; text-align:center; overflow-wrap:anywhere; word-break:break-word; }

        #modal-conta .modal-premium {
            background: linear-gradient(145deg, rgba(5,8,22,.98), rgba(12,25,44,.98)) !important;
            border:1px solid rgba(0,224,255,.18) !important;
            box-shadow:0 24px 70px rgba(0,0,0,.72), 0 0 32px rgba(31,116,255,.16) !important;
            max-height: calc(100dvh - 32px - env(safe-area-inset-bottom, 0px)) !important;
            overflow-y: auto;
            overscroll-behavior: contain;
            -webkit-overflow-scrolling: touch;
        }
        @media (max-width: 600px) {
            .floating-btn, .floating-btn-left, .floating-btn-aovivo { display:none !important; }
            .mobile-bottom-nav {
                position: fixed; left: 14px; right: 14px;
                bottom: calc(10px + env(safe-area-inset-bottom, 0px));
                z-index: 950; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
                gap: 7px; padding: 7px;
                background: linear-gradient(180deg, rgba(12,25,44,.92), rgba(5,8,22,.96));
                border: 1px solid rgba(0,224,255,.16);
                border-radius: 22px;
                box-shadow: 0 18px 46px rgba(0,0,0,.58), 0 0 28px rgba(31,116,255,.12);
                backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
            }
            .mobile-bottom-nav::before {
                content:""; position:absolute; inset:0; border-radius:22px; pointer-events:none;
                background: linear-gradient(90deg, rgba(0,224,255,.18), rgba(31,116,255,.08), rgba(255,215,0,.12));
                opacity:.55; mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
                -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
                padding:1px; -webkit-mask-composite:xor; mask-composite:exclude;
            }
            .mobile-nav-item {
                min-height: 54px; border:0; border-radius:17px; background: transparent;
                color: rgba(250,250,250,.72); text-decoration:none;
                display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
                font-size:.66rem; font-weight:800; line-height:1;
                touch-action: manipulation; -webkit-tap-highlight-color: transparent; user-select:none;
                position:relative; overflow:hidden;
            }
            .mobile-nav-item .ico {
                width:30px; height:30px; border-radius:12px; display:grid; place-items:center;
                background:rgba(250,250,250,.06);
                box-shadow: inset 0 0 0 1px rgba(250,250,250,.06);
            }
            .mobile-nav-item .ico svg {
                width:17px; height:17px; stroke:currentColor; fill:none;
                stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round;
            }
            .mobile-nav-item.live .ico svg .live-dot { fill:currentColor; stroke:none; }
            .mobile-nav-item:active { transform: translateY(1px) scale(.985); }
            .mobile-nav-item.primary { color:var(--green-neon); }
            .mobile-nav-item.primary .ico { background:rgba(0,255,179,.12); box-shadow:0 0 16px rgba(0,255,179,.16), inset 0 0 0 1px rgba(0,255,179,.18); }
            .mobile-nav-item.live { color:rgba(250,250,250,.72); }
            .mobile-nav-item.live .ico { background:rgba(229,30,42,.12); box-shadow: inset 0 0 0 1px rgba(229,30,42,.22); }
            .mobile-nav-item.live.ativo { color:var(--white-premium); background:linear-gradient(180deg, rgba(229,30,42,.28), rgba(229,30,42,.12)); }
            .mobile-nav-item.filter { color:var(--brand-premium); }
            .mobile-nav-item.filter .ico { background:rgba(255,215,0,.13); box-shadow:0 0 16px rgba(255,215,0,.13), inset 0 0 0 1px rgba(255,215,0,.2); }
            .mobile-nav-item.account { color:var(--cyan-neon); }
            .mobile-nav-item.account .ico { background:rgba(0,224,255,.12); box-shadow:0 0 16px rgba(0,224,255,.14), inset 0 0 0 1px rgba(0,224,255,.2); }
            .mobile-nav-item.disabled { opacity:.35; pointer-events:none; }
            .mobile-nav-spacer { display:block; height: calc(90px + env(safe-area-inset-bottom, 0px)); }
            #modal-conta { align-items:flex-start; overflow-y:auto; padding:10px 0 calc(110px + env(safe-area-inset-bottom, 0px)); }
            #modal-conta .modal-premium { width:calc(100% - 28px) !important; max-width:520px !important; max-height:calc(100dvh - 22px - env(safe-area-inset-bottom, 0px)) !important; margin:0 auto calc(110px + env(safe-area-inset-bottom, 0px)); padding:18px !important; border-radius:18px !important; }
            #modal-conta .modal-title { position:sticky; top:-18px; z-index:2; margin:-18px -18px 10px; padding:18px 18px 10px; background:linear-gradient(180deg, rgba(5,8,22,.98), rgba(5,8,22,.88)); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
            #modal-conta .account-summary { gap:0; margin:4px 0 14px; }
            #modal-conta .account-row { padding:10px 0; }
            #modal-conta .renew-card { margin:10px 0 14px; padding:12px; }
            #modal-conta .renew-card-title { font-size:.9rem; }
            #modal-conta .pix-box-account { padding:10px; }
            #modal-conta .pix-qr-account { width:min(150px, 52vw); min-height:min(150px, 52vw); padding:8px; }
            #modal-conta .pix-box-account textarea { min-height:62px; font-size:.76rem; }
            #modal-conta .pix-feedback-account { margin-top:10px; padding:9px 10px; border-radius:10px; background:rgba(5,8,22,.48); text-align:left; }
        }
        @media (min-width: 601px) { .mobile-nav-spacer { display:none; } }

        /* PeepConnect [Abel Odorico] - 2026-05-19 08:20 */
        .floating-btn, .floating-btn-left, .floating-btn-aovivo {
            z-index: 950;
            min-height: 48px;
            touch-action: manipulation;
            -webkit-tap-highlight-color: transparent;
            user-select: none;
        }
        .floating-btn:active, .floating-btn-left:active, .floating-btn-aovivo:active {
            transform: scale(0.98);
        }
        @supports (bottom: env(safe-area-inset-bottom)) {
            .floating-btn, .floating-btn-left, .floating-btn-aovivo {
                bottom: calc(22px + env(safe-area-inset-bottom));
            }
        }

        @media (max-width: 600px) {
            .header .title { font-size: 1.2rem; }
            .floating-btn { bottom: 20px; right: 20px; padding: 12px 16px; font-size: 0.85rem; }
            .floating-btn-left { bottom: 20px; left: 20px; padding: 12px 16px; font-size: 0.85rem; }
            .modal-content { width: 95%; max-height: 80vh; }
            .time-name { font-size: 0.85rem; }
            .time img { width: 40px; height: 40px; }
            .placar-area { gap: 6px; }
            .score { font-size: 1.5rem; }
            .vs-img { width: 24px; }
            .jogo-linha { padding: 12px 14px; }
        }

        @media (max-width: 480px) {
            .time-name { font-size: 0.75rem; }
            .time img { width: 36px; height: 36px; }
            .score { font-size: 1.3rem; }
            .hora { font-size: 1rem; }
            .jogo-linha { padding: 10px 12px; margin-bottom: 6px; }
        }

        .form-input {
            width: 100%;
            display: block;
            padding: 16px;
            background: rgba(0, 0, 0, 0.4) !important;
            border: 1px solid rgba(255, 208, 0, 0.3) !important;
            border-radius: 12px;
            color: #fff !important;
            font-family: inherit;
            margin-bottom: 15px;
            transition: all 0.3s;
            font-size: 1.1rem;
            box-sizing: border-box;
        }
        .form-input::placeholder {
            color: rgba(255, 255, 255, 0.4);
        }
        .form-input:focus {
            border-color: #ffd000 !important;
            outline: none;
            background: rgba(255, 208, 0, 0.1) !important;
            box-shadow: 0 0 20px rgba(255, 208, 0, 0.2);
        }
        .mb-3 { width: 100%; margin-bottom: 5px; }
    

        /* PeepConnect [Abel Odorico] - 2026-05-21 23:18 */
        :root {
            --pc-blue: #1F74FF;
            --pc-red: #E51E2A;
            --pc-yellow: #FFD700;
            --pc-white: #FFFFFF;
            --pc-black: #000000;
            --pc-dark: #0C192C;
            --pc-bg-secondary: #071120;
            --pc-text-secondary: rgba(255,255,255,0.72);
            --pc-border-primary: rgba(31,116,255,0.22);
            --pc-border-secondary: rgba(255,255,255,0.08);
            --pc-success: #4ADE80;
        }
        .pc-renewal-card,
        .pc-account-renewal {
            width: min(100%, 460px);
            max-height: calc(100dvh - 32px);
            overflow-y: auto;
            margin: 0 auto;
            padding: 20px;
            border: 1px solid var(--pc-border-primary);
            border-radius: 18px;
            background: linear-gradient(180deg, rgba(12,25,44,0.96), rgba(7,17,32,0.96));
            box-shadow: 0 16px 48px rgba(0,0,0,0.48), 0 0 32px rgba(31,116,255,0.14);
            backdrop-filter: blur(18px);
        }
        .pc-renewal-header { text-align: center; margin-bottom: 24px; }
        .pc-renewal-title { margin: 0 0 8px; color: var(--pc-red); font-size: clamp(1.4rem, 5vw, 1.75rem); line-height: 1.1; font-weight: 800; letter-spacing: 0; }
        .pc-renewal-copy { margin: 0; color: var(--pc-text-secondary); font-size: 0.95rem; line-height: 1.45; }
        .pc-price-panel { display:flex; align-items:center; justify-content:center; min-height:64px; margin-bottom:24px; border:1px solid rgba(255,215,0,0.18); border-radius:16px; background:rgba(255,215,0,0.08); color:var(--pc-yellow); font-size:1.45rem; font-weight:800; }
        .pc-form-field { margin-bottom:16px; text-align:left; }
        .pc-form-field label { display:block; margin-bottom:8px; color:rgba(255,255,255,0.84); font-size:0.82rem; font-weight:700; }
        .pc-form-field input { width:100%; height:48px; border-radius:12px; border:1px solid var(--pc-border-secondary); background:rgba(0,0,0,0.35); color:var(--pc-white); padding:0 16px; font-size:1rem; font-weight:700; outline:none; transition:border-color .2s ease, box-shadow .2s ease, background .2s ease; }
        .pc-form-field input:focus { border-color:rgba(31,116,255,0.68); box-shadow:0 0 0 4px rgba(31,116,255,0.14); background:rgba(0,0,0,0.48); }
        .pc-form-hint { display:block; margin-top:8px; color:rgba(255,255,255,0.56); font-size:0.78rem; line-height:1.35; }
        .pc-btn-stack { display:flex; flex-direction:column; gap:12px; margin-top:16px; }
        .pc-btn { display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; padding:0 16px; border-radius:12px; border:1px solid rgba(255,255,255,0.08); font-weight:800; text-decoration:none; cursor:pointer; transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease; }
        .pc-btn:hover { transform:translateY(-1px); }
        .pc-btn:focus-visible { outline:2px solid rgba(31,116,255,0.8); outline-offset:3px; }
        .pc-btn:disabled { opacity:.62; cursor:not-allowed; transform:none; }
        .pc-btn-primary { background:linear-gradient(135deg, #1F74FF, #0057FF); color:var(--pc-white); box-shadow:0 8px 30px rgba(31,116,255,0.22); }
        .pc-btn-success { background:linear-gradient(135deg, rgba(74,222,128,0.24), rgba(34,197,94,0.16)); color:#66FF9A; border-color:rgba(74,222,128,0.22); }
        .pc-btn-secondary { background:rgba(255,255,255,0.08); color:var(--pc-white); }
        .pc-pix-area { display:none; margin-top:16px; padding:16px; border:1px solid rgba(31,116,255,0.28); border-radius:16px; background:rgba(31,116,255,0.08); }
        .pc-pix-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
        .pc-pix-title { color:#5BE7FF; font-weight:800; }
        .pc-status-pill { padding:4px 8px; border-radius:8px; background:rgba(255,215,0,0.12); color:var(--pc-yellow); font-size:0.74rem; font-weight:800; }
        .pc-pix-qr-shell { display:flex; justify-content:center; align-items:center; width:min(100%, 188px); min-height:188px; margin:0 auto 16px; padding:16px; border-radius:16px; background:var(--pc-white); box-shadow:0 0 28px rgba(31,116,255,0.18); }
        .pc-pix-copy-label { display:block; margin-bottom:8px; color:rgba(255,255,255,0.68); font-size:0.78rem; font-weight:700; }
        .pc-pix-copy { width:100%; min-height:88px; resize:vertical; border-radius:12px; border:1px solid var(--pc-border-secondary); background:rgba(0,0,0,0.42); color:var(--pc-white); padding:12px; font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size:0.78rem; line-height:1.45; outline:none; }
        .pc-pix-copy:focus { border-color:rgba(31,116,255,0.68); box-shadow:0 0 0 4px rgba(31,116,255,0.14); }
        .pc-feedback { margin:12px 0 0; color:rgba(255,255,255,0.68); font-size:0.84rem; line-height:1.4; text-align:center; }
        @media (max-width: 420px) {
            .pc-renewal-card,
            .pc-account-renewal { width: calc(100vw - 32px); max-height: calc(100dvh - 32px); padding:16px; border-radius:16px; }
            .pc-renewal-header { margin-bottom:16px; }
            .pc-price-panel { min-height:56px; margin-bottom:16px; }
            .pc-pix-area { padding:12px; }
            .pc-pix-qr-shell { width:min(100%, 160px); min-height:160px; }
            .pc-pix-copy { min-height:72px; }
        }



        /* PeepConnect [Abel Odorico] - 2026-05-22 00:03 | pc-games-rework-v2 */
        :root {
            --pc-game-surface: rgba(12,25,44,0.94);
            --pc-game-surface-2: rgba(7,17,32,0.96);
            --pc-game-border: rgba(31,116,255,0.22);
            --pc-game-border-soft: rgba(255,255,255,0.08);
            --pc-game-muted: rgba(255,255,255,0.68);
            --pc-game-blue: #1F74FF;
            --pc-game-red: #E51E2A;
            --pc-game-yellow: #FFD700;
            --pc-game-green: #4ADE80;
        }
        body {
            background: #000 !important;
            letter-spacing: 0;
        }
        body::before {
            background:
                linear-gradient(180deg, rgba(0,0,0,0.82), rgba(0,0,0,0.7)),
                radial-gradient(circle at top center, rgba(31,116,255,0.16), transparent 52%) !important;
        }
        .header {
            padding: 12px 16px !important;
            background: rgba(0,0,0,0.82) !important;
            border-bottom: 1px solid var(--pc-game-border) !important;
            backdrop-filter: blur(18px);
        }
        .header .title {
            color: var(--pc-game-yellow) !important;
            font-size: 1.2rem !important;
            text-shadow: none !important;
            animation: none !important;
            letter-spacing: 0;
        }
        .scroll-container {
            top: 64px !important;
            scrollbar-color: rgba(31,116,255,0.45) rgba(255,255,255,0.04);
        }
        .scroll-content {
            max-width: 820px !important;
            padding: 16px 16px 112px !important;
            gap: 12px !important;
        }
        .search-bar-wrap {
            padding: 8px 0 12px !important;
            background: linear-gradient(180deg, rgba(0,0,0,0.92), rgba(0,0,0,0.72)) !important;
            margin: 0 !important;
        }
        .search-bar-inner {
            min-height: 48px;
            border-radius: 12px !important;
            background: linear-gradient(180deg, rgba(12,25,44,0.96), rgba(7,17,32,0.96)) !important;
            border: 1px solid var(--pc-game-border) !important;
            box-shadow: 0 8px 28px rgba(0,0,0,0.28);
            padding: 0 16px !important;
        }
        .search-bar-inner:focus-within {
            border-color: rgba(31,116,255,0.72) !important;
            box-shadow: 0 0 0 4px rgba(31,116,255,0.14) !important;
        }
        .search-bar-inner .search-ico { color: rgba(255,255,255,0.62) !important; }
        #search-input { font-size: 0.95rem !important; color: #fff !important; }
        #search-input::placeholder { color: rgba(255,255,255,0.42) !important; }
        .welcome-msg {
            background: linear-gradient(180deg, var(--pc-game-surface), var(--pc-game-surface-2)) !important;
            border: 1px solid var(--pc-game-border) !important;
            border-radius: 16px !important;
            padding: 20px !important;
            box-shadow: 0 16px 44px rgba(0,0,0,0.36), 0 0 24px rgba(31,116,255,0.1) !important;
        }
        .welcome-msg h2 { color: var(--pc-game-yellow) !important; text-shadow: none !important; letter-spacing: 0; }
        .welcome-msg p { color: var(--pc-game-muted) !important; }
        .comp-titulo-wrapper {
            display: flex;
            justify-content: flex-start;
            margin: 24px 0 8px !important;
        }
        .campeonato-titulo {
            background: rgba(31,116,255,0.12) !important;
            color: rgba(255,255,255,0.86) !important;
            border: 1px solid rgba(31,116,255,0.26);
            border-radius: 12px !important;
            padding: 8px 12px !important;
            font-size: 0.78rem !important;
            letter-spacing: 0 !important;
            text-align: left;
        }
        .jogo-linha {
            position: relative;
            overflow: hidden;
            border-radius: 16px !important;
            padding: 16px !important;
            margin-bottom: 8px !important;
            background: linear-gradient(180deg, var(--pc-game-surface), var(--pc-game-surface-2)) !important;
            border: 1px solid var(--pc-game-border-soft) !important;
            box-shadow: 0 12px 32px rgba(0,0,0,0.24) !important;
            transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
        }
        .jogo-linha::before {
            content: "";
            position: absolute;
            inset: 0 0 auto 0;
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(31,116,255,0.58), transparent);
            opacity: .72;
        }
        .jogo-linha:hover {
            transform: translateY(-2px);
            border-color: rgba(31,116,255,0.42) !important;
            box-shadow: 0 16px 44px rgba(0,0,0,0.34), 0 0 24px rgba(31,116,255,0.12) !important;
        }
        .jogo-linha:active { transform: scale(.992); }
        .jogo-linha.sem-transmissao {
            background: linear-gradient(180deg, rgba(12,25,44,0.82), rgba(7,17,32,0.9)) !important;
            border-color: rgba(255,255,255,0.08) !important;
        }
        .top-row { gap: 12px !important; }
        .time { gap: 8px !important; }
        .time img {
            width: 44px !important;
            height: 44px !important;
            padding: 4px;
            border-radius: 12px;
            background: rgba(255,255,255,0.06);
            border: 1px solid rgba(255,255,255,0.08);
        }
        .time-name {
            font-size: 0.94rem !important;
            line-height: 1.2;
            color: rgba(255,255,255,0.92);
        }
        .placar-area {
            gap: 8px !important;
            padding: 8px;
            border-radius: 16px;
            background: rgba(0,0,0,0.2);
            border: 1px solid rgba(255,255,255,0.06);
        }
        .score {
            min-width: 32px !important;
            font-size: 1.55rem !important;
            color: var(--pc-game-yellow) !important;
            line-height: 1;
        }
        .vs-img { width: 24px !important; opacity: .72 !important; }
        .bottom-row {
            padding-top: 12px !important;
            margin-top: 12px !important;
            border-top: 1px solid rgba(255,255,255,0.08) !important;
        }
        .canal-link {
            min-height: 36px;
            border-radius: 12px !important;
            padding: 8px 12px !important;
            background: rgba(31,116,255,0.14) !important;
            border: 1px solid rgba(31,116,255,0.24);
            color: #fff !important;
        }
        .canal-link:hover { background: rgba(31,116,255,0.22) !important; }
        .badge-ao-vivo,
        .badge-encerrado,
        .badge-agendado {
            min-height: 28px;
            border-radius: 12px !important;
            padding: 4px 8px !important;
            letter-spacing: 0;
        }
        .badge-ao-vivo { color: #ff6b72 !important; border-color: rgba(229,30,42,0.38) !important; background: rgba(229,30,42,0.12) !important; }
        .badge-agendado { color: var(--pc-game-yellow) !important; border-color: rgba(255,215,0,0.26) !important; background: rgba(255,215,0,0.1) !important; }
        #drawer-backdrop { background: rgba(0,0,0,0.78) !important; backdrop-filter: blur(8px) !important; }
        #drawer-panel {
            max-width: 760px !important;
            background: linear-gradient(180deg, rgba(12,25,44,0.98), rgba(7,17,32,0.98)) !important;
            border: 1px solid var(--pc-game-border) !important;
            border-bottom: 0 !important;
            border-radius: 18px 18px 0 0 !important;
            box-shadow: 0 -20px 64px rgba(0,0,0,0.54), 0 0 32px rgba(31,116,255,0.12) !important;
            scrollbar-color: rgba(31,116,255,0.45) rgba(255,255,255,0.04);
        }
        .drawer-handle { background: rgba(31,116,255,0.42) !important; width: 48px !important; }
        .drawer-comp-header { padding: 12px 20px 8px !important; }
        .drawer-comp-header span { color: rgba(255,255,255,0.68) !important; letter-spacing: 0 !important; }
        .drawer-team img {
            width: 64px !important;
            height: 64px !important;
            padding: 6px;
            border-radius: 16px;
            background: rgba(255,255,255,0.06);
            border: 1px solid rgba(255,255,255,0.08);
        }
        .drawer-team-name { color: rgba(255,255,255,0.9) !important; }
        .drawer-placar { color: var(--pc-game-yellow) !important; letter-spacing: 0 !important; }
        .drawer-info-pill,
        .drawer-canal-card {
            border-color: rgba(31,116,255,0.18) !important;
            background: rgba(31,116,255,0.08) !important;
            border-radius: 12px !important;
        }
        .drawer-canal-card.tem-stream:hover,
        .drawer-canal-card.tem-stream:active,
        .drawer-canal-card.ativo {
            border-color: rgba(31,116,255,0.48) !important;
            background: rgba(31,116,255,0.16) !important;
        }
        .drawer-btn-full {
            background: linear-gradient(135deg, #1F74FF, #0057FF) !important;
            color: #fff !important;
            border: 1px solid rgba(255,255,255,0.08) !important;
            border-radius: 12px !important;
            box-shadow: 0 8px 30px rgba(31,116,255,0.22);
        }
        @media (max-width: 600px) {
            .header { padding: 12px !important; }
            .scroll-container { top: 60px !important; }
            .scroll-content { padding: 12px 12px 104px !important; }
            .jogo-linha { padding: 12px !important; border-radius: 16px !important; }
            .top-row { align-items: stretch !important; gap: 8px !important; }
            .time { flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px !important; }
            .time[style*="justify-content:flex-end"] { justify-content: center !important; }
            .time img { width: 36px !important; height: 36px !important; }
            .time-name { max-width: 96px; white-space: normal !important; font-size: 0.78rem !important; }
            .placar-area { align-self: center; gap: 4px !important; padding: 8px !important; }
            .score { min-width: 24px !important; font-size: 1.2rem !important; }
            .vs-img { width: 20px !important; }
            .bottom-row { align-items: stretch !important; gap: 8px !important; }
            .canal-link { flex: 1; justify-content: center; padding: 8px !important; }
            .badge-ao-vivo,
            .badge-encerrado,
            .badge-agendado { white-space: nowrap; }
            .drawer-teams { gap: 8px !important; padding: 0 12px 12px !important; }
            .drawer-team img { width: 52px !important; height: 52px !important; }
            .drawer-placar { font-size: 1.8rem !important; }
            .drawer-actions { flex-direction: column; }
        }

        /* PeepConnect [Abel Odorico] - 2026-05-22 00:00 | pc-account-rework-v3 */
        #modal-conta {
            padding: 16px !important;
            background: rgba(0,0,0,0.72) !important;
            backdrop-filter: blur(8px);
            -webkit-backdrop-filter: blur(8px);
            overflow-y: auto;
        }
        #modal-conta .modal-premium {
            width: min(100%, 520px) !important;
            max-height: calc(100dvh - 32px - env(safe-area-inset-bottom, 0px)) !important;
            margin: auto !important;
            padding: 24px !important;
            border-radius: 18px !important;
            background: linear-gradient(180deg, rgba(12,25,44,0.98), rgba(7,17,32,0.98)) !important;
            border: 1px solid rgba(31,116,255,0.22) !important;
            box-shadow: 0 24px 64px rgba(0,0,0,0.6), 0 0 32px rgba(31,116,255,0.14) !important;
            scrollbar-color: rgba(31,116,255,0.45) rgba(255,255,255,0.04);
        }
        #modal-conta .modal-title {
            margin: 0 0 20px !important;
            padding: 0 36px 0 0 !important;
            color: #FFFFFF !important;
            font-size: 1.3rem !important;
            line-height: 1.2 !important;
            letter-spacing: 0 !important;
            text-align: left !important;
        }
        #modal-conta .account-summary {
            display: grid !important;
            gap: 8px !important;
            margin: 0 0 16px !important;
        }
        #modal-conta .account-row {
            gap: 12px !important;
            padding: 12px !important;
            border: 1px solid rgba(255,255,255,0.08) !important;
            border-radius: 12px !important;
            background: rgba(0,0,0,0.24) !important;
        }
        #modal-conta .account-row span:first-child {
            color: rgba(255,255,255,0.64) !important;
            font-size: 0.78rem !important;
            font-weight: 700 !important;
        }
        #modal-conta .account-row strong {
            color: #FFFFFF !important;
            font-size: 0.9rem !important;
            line-height: 1.25 !important;
            overflow-wrap: anywhere;
        }
        #modal-conta .account-status-ok { color: #4ADE80 !important; }
        #modal-conta .account-status-bad { color: #E51E2A !important; }
        #modal-conta .pc-account-renewal {
            width: 100% !important;
            max-height: none !important;
            overflow: visible !important;
            margin: 0 !important;
            padding: 16px !important;
            border-radius: 16px !important;
            box-shadow: 0 12px 36px rgba(0,0,0,0.28), 0 0 24px rgba(31,116,255,0.1) !important;
        }
        #modal-conta .pc-renewal-header {
            margin-bottom: 16px !important;
            text-align: left !important;
        }
        #modal-conta .pc-renewal-title {
            margin-bottom: 8px !important;
            color: #FFD700 !important;
            font-size: 1.2rem !important;
        }
        #modal-conta .pc-price-panel {
            min-height: 56px !important;
            margin-bottom: 16px !important;
            font-size: 1.35rem !important;
        }
        #modal-conta .pc-pix-area {
            display: none;
            padding: 16px !important;
            border-radius: 16px !important;
            background: rgba(31,116,255,0.1) !important;
        }
        #modal-conta .pc-pix-copy {
            max-height: 120px;
            overflow-y: auto;
        }
        #modal-conta .pc-feedback {
            padding: 12px;
            border-radius: 12px;
            background: rgba(0,0,0,0.24);
            text-align: left !important;
        }
        #modal-conta a.btn-close {
            min-height: 48px;
            margin-top: 12px;
            border-radius: 12px !important;
            background: rgba(255,255,255,0.08) !important;
            color: #FFFFFF !important;
        }
        .mobile-bottom-nav {
            left: 12px !important;
            right: 12px !important;
            gap: 8px !important;
            padding: 8px !important;
            border-radius: 18px !important;
            border-color: rgba(31,116,255,0.22) !important;
            background: linear-gradient(180deg, rgba(12,25,44,0.96), rgba(7,17,32,0.98)) !important;
        }
        .mobile-nav-item {
            min-height: 52px !important;
            border-radius: 12px !important;
            letter-spacing: 0 !important;
        }
        .mobile-nav-item .ico {
            width: 32px !important;
            height: 32px !important;
            border-radius: 12px !important;
        }
        @media (max-width: 420px) {
            #modal-conta { padding: 16px !important; align-items: flex-start !important; }
            #modal-conta .modal-premium {
                width: calc(100vw - 32px) !important;
                max-height: calc(100dvh - 32px - env(safe-area-inset-bottom, 0px)) !important;
                padding: 16px !important;
                border-radius: 16px !important;
            }
            #modal-conta .modal-title { font-size: 1.15rem !important; margin-bottom: 16px !important; }
            #modal-conta .account-row { align-items: flex-start !important; flex-direction: column !important; }
            #modal-conta .account-row strong { text-align: left !important; }
            #modal-conta .pc-account-renewal { padding: 12px !important; }
            #modal-conta .pc-pix-qr-shell { width: min(100%, 160px) !important; min-height: 160px !important; }
            #modal-conta .pc-pix-copy { min-height: 80px !important; }
            .mobile-bottom-nav { bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important; }
            .mobile-nav-item { font-size: 0.64rem !important; }
        }

        /* PeepConnect [Abel Odorico] - 2026-05-22 00:14 | pc-desktop-menu-v3 */
        .mobile-bottom-nav {
            position: fixed !important;
            top: 68px !important;
            left: 50% !important;
            right: auto !important;
            bottom: auto !important;
            transform: translateX(-50%) !important;
            z-index: 1200 !important;
            display: grid !important;
            grid-template-columns: repeat(4, minmax(124px, 1fr)) !important;
            width: min(680px, calc(100vw - 32px)) !important;
            gap: 8px !important;
            padding: 8px !important;
            border-radius: 16px !important;
            border: 1px solid rgba(31,116,255,0.30) !important;
            background: linear-gradient(180deg, rgba(12,25,44,0.98), rgba(7,17,32,0.98)) !important;
            box-shadow: 0 16px 44px rgba(0,0,0,0.50), 0 0 28px rgba(31,116,255,0.14) !important;
            backdrop-filter: blur(18px);
            -webkit-backdrop-filter: blur(18px);
        }
        .mobile-bottom-nav::before {
            display: none !important;
        }
        .mobile-nav-item,
        .mobile-bottom-nav a.mobile-nav-item,
        .mobile-bottom-nav button.mobile-nav-item,
        .mobile-bottom-nav span.mobile-nav-item {
            appearance: none !important;
            -webkit-appearance: none !important;
            min-width: 0 !important;
            min-height: 44px !important;
            padding: 0 12px !important;
            border: 1px solid rgba(255,255,255,0.10) !important;
            border-radius: 12px !important;
            background: rgba(255,255,255,0.055) !important;
            color: #F8FAFC !important;
            display: flex !important;
            flex-direction: row !important;
            align-items: center !important;
            justify-content: center !important;
            gap: 8px !important;
            font-family: inherit !important;
            font-size: 0.78rem !important;
            font-weight: 800 !important;
            line-height: 1 !important;
            letter-spacing: 0 !important;
            text-decoration: none !important;
            text-shadow: none !important;
            cursor: pointer !important;
            box-shadow: none !important;
            transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease !important;
        }
        .mobile-nav-item .ico {
            flex: 0 0 auto !important;
            width: 28px !important;
            height: 28px !important;
            border-radius: 10px !important;
            display: grid !important;
            place-items: center !important;
            background: rgba(31,116,255,0.14) !important;
            box-shadow: inset 0 0 0 1px rgba(31,116,255,0.24) !important;
            color: #9EC5FF !important;
        }
        .mobile-nav-item .ico svg {
            width: 16px !important;
            height: 16px !important;
            stroke: currentColor !important;
            fill: none !important;
        }
        .mobile-nav-item .ico svg .live-dot {
            fill: currentColor !important;
            stroke: none !important;
        }
        .mobile-nav-item.primary .ico { color: #4ADE80 !important; background: rgba(74,222,128,0.12) !important; box-shadow: inset 0 0 0 1px rgba(74,222,128,0.24) !important; }
        .mobile-nav-item.live .ico { color: #FF6B72 !important; background: rgba(229,30,42,0.12) !important; box-shadow: inset 0 0 0 1px rgba(229,30,42,0.24) !important; }
        .mobile-nav-item.filter .ico { color: #FFD700 !important; background: rgba(255,215,0,0.12) !important; box-shadow: inset 0 0 0 1px rgba(255,215,0,0.24) !important; }
        .mobile-nav-item.account .ico { color: #5BE7FF !important; background: rgba(31,116,255,0.16) !important; box-shadow: inset 0 0 0 1px rgba(31,116,255,0.30) !important; }
        .mobile-nav-item:hover,
        .mobile-nav-item:active {
            transform: translateY(-1px) !important;
            border-color: rgba(31,116,255,0.42) !important;
            background: rgba(31,116,255,0.12) !important;
            color: #FFFFFF !important;
        }
        .mobile-nav-item:focus-visible {
            outline: 2px solid rgba(31,116,255,0.78) !important;
            outline-offset: 3px !important;
        }
        .mobile-nav-item.disabled {
            opacity: .42 !important;
            pointer-events: none !important;
        }
        .mobile-nav-spacer {
            display: none !important;
        }
        @media (min-width: 901px) {
            .scroll-content {
                padding-top: 92px !important;
                padding-bottom: 80px !important;
            }
            .search-bar-wrap {
                padding-top: 0 !important;
            }
        }
        @media (max-width: 900px) {
            .mobile-bottom-nav {
                top: auto !important;
                left: 12px !important;
                right: 12px !important;
                bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;
                transform: none !important;
                width: auto !important;
                max-width: none !important;
                grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
            }
            .mobile-nav-item,
            .mobile-bottom-nav a.mobile-nav-item,
            .mobile-bottom-nav button.mobile-nav-item,
            .mobile-bottom-nav span.mobile-nav-item {
                min-height: 52px !important;
                padding: 0 8px !important;
                flex-direction: column !important;
                gap: 4px !important;
                font-size: 0.64rem !important;
            }
            .mobile-nav-item .ico {
                width: 32px !important;
                height: 32px !important;
                border-radius: 12px !important;
            }
            .mobile-nav-spacer {
                display: block !important;
                height: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
            }
            .scroll-content {
                padding-bottom: 112px !important;
            }
        }
        /* PeepConnect [Abel Odorico] - 2026-05-22 13:40 | home-api-data-v1 */
        .match-meta-row { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-bottom:12px; margin-bottom:12px; border-bottom:1px solid rgba(255,255,255,0.08); color:rgba(255,255,255,0.68); font-size:0.76rem; font-weight:800; }
        .match-meta-left, .match-meta-right { display:flex; align-items:center; gap:8px; min-width:0; }
        .match-comp-logo { width:22px; height:22px; object-fit:contain; border-radius:8px; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.08); flex:0 0 auto; }
        .match-comp-name, .match-channel-summary { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
        .match-data-pill { min-height:28px; padding:4px 8px; border-radius:8px; background:rgba(31,116,255,0.12); color:rgba(255,255,255,0.82); border:1px solid rgba(31,116,255,0.20); white-space:nowrap; }
        .match-channel-summary { max-width:52%; color:rgba(255,255,255,0.62); font-size:0.76rem; font-weight:800; }
        @media (max-width:600px) { .match-meta-row { align-items:flex-start; flex-direction:column; gap:8px; } .match-meta-left, .match-meta-right { width:100%; } .match-channel-summary { max-width:100%; white-space:normal; } }

/* PeepConnect [Abel Odorico] - 2026-05-23 13:20 | Home premium UX */
:root {
    --pc-blue: #1F74FF;
    --pc-red: #E51E2A;
    --pc-yellow: #FFD700;
    --pc-white: #FFFFFF;
    --pc-black: #000000;
    --pc-dark: #0C192C;
    --bg-primary: #000000;
    --bg-secondary: #071120;
    --bg-card: #0C192C;
    --text-primary: #FFFFFF;
    --text-secondary: rgba(255,255,255,0.72);
    --border-primary: rgba(31,116,255,0.22);
    --border-secondary: rgba(255,255,255,0.08);
    --success: #4ADE80;
    --warning: #FFD700;
    --danger: #E51E2A;
    --radius: 8px;
}
body {
    background-color: var(--bg-primary) !important;
}
.pc-home-header {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 100;
    background: rgba(0,0,0,.84);
    border-bottom: 1px solid var(--border-primary);
    backdrop-filter: blur(16px);
}
.pc-home-header-inner {
    width: min(1180px, calc(100% - 32px));
    min-height: 64px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.pc-brand {
    color: var(--text-primary);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-weight: 950;
    font-size: 1.08rem;
}
.pc-brand:hover { color: var(--text-primary); }
.pc-brand span span { color: var(--pc-yellow); }
.pc-brand-ball {
    width: 36px;
    height: 36px;
    border-radius: var(--radius);
    display: grid;
    place-items: center;
    background: rgba(31,116,255,.14);
    border: 1px solid rgba(31,116,255,.3);
}
.pc-brand-logo {
    display:block;
    width:auto;
    max-width:180px;
    height:36px;
    object-fit:contain;
}
.pc-brand-img {
    object-fit:cover;
    padding:0;
}
.pc-header-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.pc-update-pill,
.pc-header-btn {
    min-height: 36px;
    border-radius: var(--radius);
    border: 1px solid var(--border-secondary);
    background: rgba(255,255,255,.05);
    color: var(--text-primary);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    font-size: .8rem;
    font-weight: 800;
    text-decoration: none;
    font-family: inherit;
}
.pc-header-btn { cursor: pointer; }
.pc-header-btn:hover {
    border-color: rgba(91,231,255,.42);
    background: rgba(31,116,255,.14);
    color: #fff;
}
.pc-header-btn-danger {
    color: #FF737B;
    border-color: rgba(229,30,42,.34);
    background: rgba(229,30,42,.12);
}
.pc-header-btn-danger:hover {
    color: #fff;
    background: rgba(229,30,42,.22);
}
.scroll-container {
    top: 64px !important;
}
.scroll-content {
    width: min(1180px, 100%) !important;
    max-width: 1180px !important;
    gap: 14px !important;
    padding-top: 20px !important;
}
.pc-discovery {
    border: 1px solid var(--border-primary);
    background: linear-gradient(180deg, rgba(12,25,44,.92), rgba(7,17,32,.92));
    border-radius: var(--radius);
    padding: 20px;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    box-shadow: 0 24px 70px rgba(0,0,0,.34);
}
.pc-discovery h1 {
    margin: 4px 0 8px;
    font-size: clamp(1.55rem, 4vw, 2.55rem);
    line-height: 1.02;
    font-weight: 950;
    letter-spacing: 0;
}
.pc-discovery p {
    margin: 0;
    color: var(--text-secondary);
    line-height: 1.45;
}
.pc-kicker {
    color: var(--pc-yellow);
    font-weight: 900;
    font-size: .78rem;
    text-transform: uppercase;
}
.pc-primary-action {
    min-height: 44px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--radius);
    padding: 0 16px;
    background: linear-gradient(135deg, var(--pc-blue), #0057FF);
    color: #fff;
    font-weight: 900;
    white-space: nowrap;
    font-family: inherit;
    cursor: pointer;
}
.search-bar-wrap {
    background: linear-gradient(180deg, rgba(0,0,0,.88), rgba(0,0,0,.56)) !important;
    padding: 8px 0 !important;
}
.search-bar-inner {
    border-radius: var(--radius) !important;
    border-color: var(--border-primary) !important;
    background: rgba(7,17,32,.92) !important;
    padding: 12px 14px !important;
}
.day-filter-wrap {
    padding: 2px 0 12px !important;
}
.day-chip {
    border-radius: var(--radius) !important;
    border: 1px solid var(--border-primary) !important;
    background: rgba(12,25,44,.88) !important;
    color: var(--text-secondary) !important;
}
.day-chip.ativo,
.day-chip-live.ativo {
    background: linear-gradient(135deg, var(--pc-blue), #0057FF) !important;
    color: #fff !important;
    border-color: rgba(255,255,255,.12) !important;
}
.jogo-linha {
    border-radius: var(--radius) !important;
    border: 1px solid var(--border-secondary) !important;
    background: linear-gradient(135deg, rgba(12,25,44,.94), rgba(0,0,0,.64)) !important;
    padding: 16px !important;
    margin-bottom: 10px !important;
    transition: transform .18s ease, border-color .18s ease, background .18s ease !important;
}
.jogo-linha:hover {
    transform: translateY(-2px);
    border-color: rgba(91,231,255,.38) !important;
}
.match-card-head,
.bottom-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.match-league,
.match-card-pills,
.match-team,
.match-score {
    display: flex;
    align-items: center;
    gap: 8px;
}
.match-league {
    min-width: 0;
    color: rgba(255,255,255,.82);
    font-size: .78rem;
    font-weight: 900;
}
.match-card-pills {
    flex-wrap: wrap;
    justify-content: flex-end;
}
.match-card-pills span {
    border: 1px solid var(--border-secondary);
    border-radius: var(--radius);
    background: rgba(255,255,255,.05);
    padding: 6px 8px;
    color: var(--text-secondary);
    font-size: .74rem;
    font-weight: 800;
}
.match-card-main {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto minmax(0,1fr);
    gap: 12px;
    align-items: center;
    padding: 16px 0;
}
.match-team img {
    width: 44px;
    height: 44px;
    object-fit: contain;
    border-radius: var(--radius);
    background: rgba(255,255,255,.06);
    border: 1px solid var(--border-secondary);
    flex: 0 0 auto;
}
.match-team strong {
    overflow-wrap: anywhere;
    font-size: .95rem;
    line-height: 1.2;
}
.match-team-away {
    justify-content: flex-end;
    text-align: right;
}
.match-score {
    min-width: 96px;
    justify-content: center;
    border-radius: var(--radius);
    background: rgba(0,0,0,.28);
    border: 1px solid rgba(255,255,255,.06);
    color: var(--pc-yellow);
    font-size: 1.15rem;
    font-weight: 950;
    padding: 8px 12px;
}
.match-score b {
    color: rgba(255,255,255,.46);
}
.canal-link {
    border-radius: var(--radius) !important;
    background: rgba(31,116,255,.18) !important;
    border: 1px solid rgba(31,116,255,.28) !important;
    color: #dbeafe !important;
    font-weight: 900 !important;
}
.canal-link img {
    width: 22px;
    height: 22px;
    object-fit: contain;
}
.match-channel-summary {
    color: rgba(255,255,255,.66) !important;
    font-size: .78rem !important;
}
.badge-ao-vivo,
.badge-encerrado,
.badge-agendado {
    border-radius: var(--radius) !important;
    border: 1px solid var(--border-secondary);
    padding: 7px 9px !important;
    font-weight: 900 !important;
}
.badge-ao-vivo {
    color: #fff !important;
    background: rgba(229,30,42,.16) !important;
    border-color: rgba(229,30,42,.28) !important;
}
.badge-encerrado {
    color: rgba(255,255,255,.68) !important;
    background: rgba(255,255,255,.06) !important;
}
.badge-agendado {
    color: var(--pc-yellow) !important;
    background: rgba(255,215,0,.10) !important;
    border-color: rgba(255,215,0,.24) !important;
}
@media (max-width: 760px) {
    .pc-home-header-inner {
        width: calc(100% - 24px);
        min-height: 60px;
        align-items: flex-start;
        flex-direction: column;
        padding: 10px 0;
    }
    .pc-header-actions {
        width: 100%;
        justify-content: flex-start;
    }
    .pc-update-pill {
        flex: 1;
        min-width: 172px;
    }
    .scroll-container {
        top: 118px !important;
    }
    .scroll-content {
        padding: 14px 12px 112px !important;
    }
    .pc-discovery {
        align-items: stretch;
        flex-direction: column;
        padding: 16px;
    }
    .pc-primary-action {
        width: 100%;
        justify-content: center;
    }
    .match-card-main {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .match-team-away {
        justify-content: flex-start;
        text-align: left;
        flex-direction: row-reverse;
    }
    .match-score {
        width: 100%;
    }
    .bottom-row,
    .match-card-head {
        align-items: flex-start;
        flex-direction: column;
    }
    .match-card-pills {
        justify-content: flex-start;
    }
    .match-channel-summary {
        max-width: 100%;
        white-space: normal;
    }
}

/* PeepConnect [Abel Odorico] - 2026-05-23 14:20 | Conta e Pix premium */
#modal-conta .modal-premium {
    width: min(100%, 640px) !important;
    border-radius: 8px !important;
    border: 1px solid var(--border-primary) !important;
    background: linear-gradient(180deg, rgba(12,25,44,.98), rgba(7,17,32,.98)) !important;
    box-shadow: 0 28px 90px rgba(0,0,0,.58), 0 0 34px rgba(31,116,255,.14) !important;
}
.account-hero {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin-bottom:16px;
    padding:16px;
    border:1px solid var(--border-secondary);
    border-radius:8px;
    background:rgba(0,0,0,.22);
}
.account-hero h2 {
    margin:4px 0 6px;
    color:#fff;
    font-size:clamp(1.35rem,4vw,2rem);
    font-weight:950;
    letter-spacing:0;
}
.account-hero p {
    margin:0;
    color:var(--text-secondary);
    line-height:1.4;
}
.account-kicker {
    color:var(--pc-yellow);
    font-size:.74rem;
    font-weight:900;
    text-transform:uppercase;
}
.account-status-pill {
    border-radius:8px;
    border:1px solid var(--border-secondary);
    padding:7px 10px;
    font-size:.78rem;
    font-weight:950;
    white-space:nowrap;
}
.account-status-pill.ok {
    color:var(--success);
    background:rgba(74,222,128,.12);
    border-color:rgba(74,222,128,.24);
}
.account-status-pill.bad {
    color:#FF737B;
    background:rgba(229,30,42,.12);
    border-color:rgba(229,30,42,.28);
}
.account-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-bottom:16px;
}
.account-info-card {
    min-height:100px;
    border:1px solid var(--border-secondary);
    border-radius:8px;
    background:rgba(255,255,255,.035);
    padding:12px;
}
.account-info-card span,
.account-info-card small {
    display:block;
    color:rgba(255,255,255,.62);
    font-size:.76rem;
    font-weight:800;
}
.account-info-card strong {
    display:block;
    color:#fff;
    margin:7px 0;
    font-size:1rem;
    overflow-wrap:anywhere;
}
.account-info-card-strong strong {
    color:var(--pc-yellow);
    font-size:1.35rem;
    letter-spacing:0;
}
.account-renew-panel {
    border:1px solid rgba(31,116,255,.26);
    border-radius:8px;
    background:rgba(31,116,255,.08);
    padding:16px;
}
.account-renew-head {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
    margin-bottom:14px;
}
.account-renew-head h3 {
    margin:4px 0 6px;
    color:#fff;
    font-size:1.2rem;
    font-weight:950;
}
.account-renew-head p {
    margin:0;
    color:var(--text-secondary);
    line-height:1.4;
}
.account-price {
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:8px;
    border:1px solid rgba(255,215,0,.26);
    background:rgba(255,215,0,.12);
    color:var(--pc-yellow);
    padding:0 14px;
    white-space:nowrap;
    font-size:1.18rem;
}
.account-pix-area {
    border-radius:8px !important;
}
.account-support-btn {
    margin-top:12px;
}
.account-guest-actions {
    display:grid;
    gap:10px;
}
#modal-conta .pc-status-pill.status-falha,
#modal-conta .pc-status-pill.status-documento {
    color:#FF737B;
    background:rgba(229,30,42,.12);
    border-color:rgba(229,30,42,.28);
}
#modal-conta .pc-status-pill.status-pago {
    color:var(--success);
    background:rgba(74,222,128,.12);
    border-color:rgba(74,222,128,.24);
}
#modal-conta .pc-status-pill.status-gerando,
#modal-conta .pc-status-pill.status-aguardando {
    color:var(--pc-yellow);
    background:rgba(255,215,0,.12);
    border-color:rgba(255,215,0,.24);
}

/* PeepConnect [Abel Odorico] - 2026-05-24 10:30 | Cadastro e login premium */
#modal-registro {
    padding:16px;
    align-items:center;
}
#modal-registro .access-modal-card {
    width:min(100%, 560px) !important;
    max-height:calc(100dvh - 32px);
    overflow-y:auto;
    border-radius:8px !important;
    border:1px solid var(--border-primary) !important;
    background:linear-gradient(180deg, rgba(12,25,44,.98), rgba(7,17,32,.98)) !important;
    box-shadow:0 28px 90px rgba(0,0,0,.58), 0 0 34px rgba(31,116,255,.14) !important;
    padding:18px !important;
}
.access-view {
    display:block;
}
.access-hero {
    padding:16px;
    margin-bottom:16px;
    border:1px solid var(--border-secondary);
    border-radius:8px;
    background:rgba(0,0,0,.22);
}
.access-hero h2 {
    margin:4px 0 8px;
    color:#fff;
    font-size:clamp(1.35rem, 4vw, 1.9rem);
    line-height:1.08;
    font-weight:950;
    letter-spacing:0;
}
.access-hero p {
    margin:0;
    color:var(--text-secondary);
    font-size:.95rem;
    line-height:1.42;
}
.access-form-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
}
.access-field-full {
    grid-column:1 / -1;
}
#modal-registro .pc-form-field {
    margin-bottom:12px;
}
#modal-registro .pc-form-field input {
    height:52px;
    border-radius:8px;
    border-color:rgba(255,255,255,.1);
    background:rgba(0,0,0,.34);
}
#modal-registro .pc-form-field input:focus {
    border-color:rgba(31,116,255,.72);
    box-shadow:0 0 0 4px rgba(31,116,255,.14);
}
#log-usuario {
    text-align:center;
    font-size:1.28rem !important;
    font-weight:950;
    font-variant-numeric:tabular-nums;
}
.access-main-btn {
    gap:8px;
    min-height:52px;
    margin-top:4px;
    border-radius:8px;
}
.access-switch {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    flex-wrap:wrap;
    margin-top:16px;
    color:rgba(255,255,255,.62);
    font-size:.9rem;
}
.access-switch button {
    border:0;
    background:transparent;
    color:var(--pc-yellow);
    font:inherit;
    font-weight:900;
    cursor:pointer;
    padding:4px;
}
.access-switch button:focus-visible,
.access-modal-close:focus-visible {
    outline:2px solid rgba(31,116,255,.8);
    outline-offset:3px;
}
.access-alert {
    display:none;
    margin:14px 0 0;
    color:#FF737B;
    font-size:.86rem;
    line-height:1.38;
    text-align:left;
    background:rgba(229,30,42,.12);
    border:1px solid rgba(229,30,42,.24);
    padding:12px;
    border-radius:8px;
}
.access-modal-close {
    position:absolute;
    top:14px;
    right:14px;
    width:36px;
    height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.1);
    border-radius:8px;
    background:rgba(0,0,0,.3);
    color:rgba(255,255,255,.72);
    cursor:pointer;
}
.access-modal-close:hover {
    color:#fff;
    border-color:rgba(31,116,255,.35);
}
@media (max-width: 560px) {
    #modal-registro {
        align-items:flex-start;
        padding:10px 0 calc(110px + env(safe-area-inset-bottom, 0px));
    }
    #modal-registro .access-modal-card {
        width:calc(100% - 24px) !important;
        max-height:calc(100dvh - 22px - env(safe-area-inset-bottom, 0px));
        margin:0 auto calc(110px + env(safe-area-inset-bottom, 0px));
        padding:14px !important;
    }
    .access-form-grid {
        grid-template-columns:1fr;
        gap:0;
    }
    .access-hero {
        padding:14px;
    }
    .access-main-btn {
        min-height:50px;
    }
    #modal-conta .modal-premium {
        width:calc(100% - 24px) !important;
        padding:14px !important;
    }
    .account-hero,
    .account-renew-head {
        flex-direction:column;
    }
    .account-grid {
        grid-template-columns:1fr;
    }
    .account-price {
        width:100%;
    }
}