*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
        html { scroll-behavior: smooth; }
        * { scrollbar-width: thin; scrollbar-color: #65067c transparent; }
        *::-webkit-scrollbar { width: 5px; height: 5px; }
        *::-webkit-scrollbar-track { background: transparent; }
        *::-webkit-scrollbar-thumb { background: #65067c; border-radius: 10px; }

        :root {
            --purple-deep: #3d1c75; --purple-mid: #52168a;
            --purple-vivid: #65067c; --purple-glow: #8b2fc9; --purple-light: #c084fc;
            --gradient: linear-gradient(135deg, var(--purple-deep) 0%, var(--purple-vivid) 100%);
            --gradient-text: linear-gradient(90deg, #65067c, #9937f5, #7c3aed, #65067c);
            --glow: 0 0 40px rgba(101,6,124,0.5), 0 0 80px rgba(61,28,117,0.3);
            --glow-sm: 0 0 20px rgba(101,6,124,0.4);
            --success: #4caf80; --danger: #e05555; --warning: #f5a623; --info: #3a9de0;
            --font-display: 'Kanit', monospace;
            --font-body: 'Syne', sans-serif;
            --font-mono: 'Syne', monospace;
            /* Light theme default */
            --bg: #f4f5f8; --bg-card: #ffffff; --bg-3: #e8eaf2; --bg-4: #dde0ec;
            --border: rgba(61,28,117,0.15); --border-s: rgba(61,28,117,0.3);
            --grey: #2b2b2b; --grey-dim: #5c6478; --grey-ghost: rgba(0,0,0,0.06);
            --deep: #0d0b18;
        }
        [data-theme="dark"] {
            --bg: #06060b; --bg-card: #0d0b18; --bg-3: #12101f; --bg-4: #1a1e26;
            --border: rgba(101,6,124,0.2); --border-s: rgba(101,6,124,0.4);
            --grey: #f4f0ff; --grey-dim: #9aa0b0; --grey-ghost: rgba(255,255,255,0.05);
        }

        body {
            background: var(--bg); color: var(--grey);
            font-family: var(--font-body); overflow-x: hidden;
            cursor: none; transition: background 0.3s, color 0.3s; min-height: 100vh;
        }

        /* CURSOR */
        .cursor, .cursor-ring { position: fixed; pointer-events: none; z-index: 9999; transform: translate(-50%,-50%); }
        .cursor { width: 12px; height: 12px; background: var(--purple-vivid); border-radius: 50%; transition: transform 0.1s, width 0.3s, height 0.3s; mix-blend-mode: screen; }
        .cursor-ring { width: 36px; height: 36px; border: 1px solid rgba(101,6,124,0.6); border-radius: 50%; transition: transform 0.15s ease-out, width 0.3s, height 0.3s; }

        /* STARS */
        .stars-canvas { position: fixed; top:0; left:0; width:100%; height:100%; z-index:0; pointer-events:none; }

        /* NAV */
        nav { position: fixed; top:0; left:0; right:0; z-index:200; display:flex; align-items:center; justify-content:space-between; padding:0 6%; height:72px; background:var(--purple-mid); backdrop-filter:blur(20px); border-bottom:1px solid rgba(255,255,255,0.12); transition:all 0.3s; }
        nav.scrolled { border-bottom-color: rgba(101,6,124,0.4); }
        .nav-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
        .logo-img { height:60px; width:auto; }
        .nav-links { display:flex; align-items:center; gap:2.5rem; list-style:none; }
        .nav-links a { font-size:0.8rem; letter-spacing:0.12em; text-transform:uppercase; color:#fff; text-decoration:none; font-weight:600; transition:color 0.3s; }
        .nav-links a:hover, .nav-links a.active { color:var(--purple-light); }
        .nav-actions { display:flex; align-items:center; gap:0.8rem; }
        .btn-icon-nav { background:none; border:1px solid rgba(255,255,255,0.2); color:#fff; width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:all 0.2s; font-size:0.95rem; }
        .btn-icon-nav:hover { border-color:var(--purple-light); color:var(--purple-light); }
        .hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
        .hamburger span { width:24px; height:1px; background:#fff; display:block; transition:all 0.3s; }
        .mobile-menu { display:none; position:fixed; top:72px; left:0; right:0; background:var(--purple-mid); z-index:199; flex-direction:column; border-bottom:1px solid rgba(255,255,255,0.15); }
        .mobile-menu.open { display:flex; }
        .mobile-menu a { padding:1rem 6%; color:#fff; text-decoration:none; font-size:0.9rem; font-weight:600; text-transform:uppercase; letter-spacing:0.1em; border-bottom:1px solid rgba(255,255,255,0.08); transition:color 0.2s; }
        .mobile-menu a:hover { color:var(--purple-light); }

        /* USER CHIP */
        .user-chip { display:flex; align-items:center; gap:0.6rem; padding:0.4rem 0.8rem 0.4rem 0.4rem; border:1px solid rgba(255,255,255,0.2); border-radius:50px; cursor:pointer; transition:0.2s; background:rgba(255,255,255,0.08); position:relative; }
        .user-chip:hover { border-color:var(--purple-light); }
        .user-avatar-sm { width:32px; height:32px; border-radius:50%; background:var(--bg-4); display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:700; color:var(--purple-light); overflow:hidden; flex-shrink:0; }
        .user-avatar-sm img { width:100%; height:100%; object-fit:cover; border-radius:50%; display:block; }
        .user-chip-name { font-size:0.8rem; font-weight:600; color:#fff; }
        .user-dropdown { position:absolute; right:0; top:calc(100% + 8px); background:var(--bg-card); border:1px solid var(--border); border-radius:12px; padding:0.5rem; min-width:200px; box-shadow:var(--glow-sm); display:none; z-index:999; }
        .user-dropdown.open { display:block; animation:fadeDown 0.15s ease; }
        @keyframes fadeDown { from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);} }
        .dropdown-item { display:flex; align-items:center; gap:0.7rem; padding:0.6rem 0.8rem; border-radius:8px; font-size:0.85rem; font-weight:500; color:var(--grey-dim); cursor:pointer; transition:0.15s; border:none; background:none; width:100%; text-align:left; }
        .dropdown-item:hover { background:var(--bg-3); color:var(--grey); }
        .dropdown-item i { width:16px; color:var(--purple-light); }
        .dropdown-divider { height:1px; background:var(--border); margin:0.3rem 0; }
        .dropdown-item.danger { color:var(--danger); }
        .dropdown-item.danger i { color:var(--danger); }

        /* MAIN */
        #main-content { position:relative; z-index:2; padding-top:96px; min-height:100vh; max-width:1100px; margin:0 auto; padding-left:6%; padding-right:6%; padding-bottom:4rem; }

        /* HERO DO PERFIL */
        .perfil-hero {
            display:flex; align-items:flex-end; gap:2rem;
            background:linear-gradient(135deg, rgba(61, 28, 117, 0.877) 0%, rgba(100, 6, 124, 0.89) 100%);
            border:1px solid var(--border); border-radius:20px;
            padding:2rem 2.5rem; margin-bottom:2rem; position:relative; overflow:hidden;
        }
        
        .perfil-hero::before {
            content:''; position:absolute; top:-40px; right:-40px;
            width:420px; height:320px; border-radius:50%;
            background:radial-gradient(circle, rgba(218, 70, 255, 0.438) 0%, transparent 70%);
            pointer-events:none;
        }
        .perfil-avatar-wrap { position:relative; flex-shrink:0; }
        .perfil-avatar {
            width:100px; height:100px; border-radius:50%;
            border:3px solid var(--purple-vivid); overflow:hidden;
            background:var(--bg-4); display:flex; align-items:center; justify-content:center;
            font-family:var(--font-display); font-size:2.2rem; font-weight:900; color:var(--purple-light);
            box-shadow:0 0 30px rgba(101,6,124,0.4);
        }
        .perfil-avatar img { width:100%; height:100%; object-fit:cover; }
        .btn-avatar-upload {
            position:absolute; bottom:2px; right:2px;
            width:28px; height:28px; border-radius:50%;
            background:var(--purple-vivid); border:2px solid var(--bg-card);
            color:#fff; font-size:0.65rem; display:flex; align-items:center; justify-content:center;
            cursor:pointer; transition:all 0.2s;
        }
        .btn-avatar-upload:hover { background:var(--purple-glow); transform:scale(1.1); }
        .perfil-hero-info { flex:1; min-width:0; }
        .perfil-hero-name {
            font-family:var(--font-display); font-size:1.9rem; font-weight:900; line-height:1.1;
            color:whitesmoke;
            background-size:200%; animation:shimmer 4s linear infinite;
        }
        @keyframes shimmer { 0%{background-position:0% 50%;} 100%{background-position:200% 50%;} }
        .perfil-hero-email { font-family:var(--font-mono); font-size:0.78rem; color:var(--grey-dim); margin-top:0.3rem; }
        .perfil-hero-badges { display:flex; gap:0.6rem; flex-wrap:wrap; margin-top:0.8rem; }
        .nivel-badge {
            display:inline-flex; align-items:center; gap:0.4rem;
            padding:0.3rem 0.9rem; border-radius:20px;
            font-family:var(--font-mono); font-size:0.7rem; font-weight:700; letter-spacing:0.1em;
            text-transform:uppercase; border:1px solid;
        }
        .nivel-bronze { background:rgba(205,127,50,0.12); border-color:rgba(205,127,50,0.4); color:#cd7f32; }
        .nivel-prata  { background:rgba(180,180,180,0.12); border-color:rgba(180,180,180,0.4); color:#b4b4b4; }
        .nivel-ouro   { background:rgba(255,215,0,0.12);   border-color:rgba(255,215,0,0.4);   color:#ffd700; }
        .nivel-diamante { background:rgba(130,220,255,0.12); border-color:rgba(130,220,255,0.4); color:#82dcff; }
        .pontos-hero {
            margin-left:auto; text-align:right; flex-shrink:0;
        }
        .pontos-hero-num {
            font-family:var(--font-display); font-size:2.4rem; font-weight:600;
            color:var(--warning); line-height:1;
        }
        .pontos-hero-label { font-family:var(--font-mono); font-size:0.68rem; color:whitesmoke; letter-spacing:0.12em; text-transform:uppercase; }

        /* ABAS */
        .perfil-tabs { display:flex; gap:4px; margin-bottom:1.8rem; background:var(--bg-card); border:1px solid var(--border); border-radius:14px; padding:5px; }
        .ptab {
            flex:1; padding:0.65rem 1rem; background:transparent; border:none; border-radius:10px;
            font-family:var(--font-display); font-size:0.78rem; font-weight:700; letter-spacing:0.07em;
            text-transform:uppercase; color:var(--grey-dim); cursor:pointer; transition:all 0.2s;
            display:flex; align-items:center; justify-content:center; gap:0.5rem;
        }
        .ptab:hover { color:var(--grey); background:var(--bg-3); }
        .ptab.active { background:var(--gradient); color:#fff;  }
        .ptab-panel { display:none; }
        .ptab-panel.active { display:block; animation:fadeUp 0.25s ease; }
        @keyframes fadeUp { from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);} }

        /* CARDS / BLOCOS */
        .card-section {
            background:var(--bg-card); border:1px solid var(--border);
            border-radius:16px; margin-bottom:1.2rem; overflow:hidden;
        }
        .card-header {
            display:flex; align-items:center; justify-content:space-between;
            padding:1rem 1.4rem; border-bottom:1px solid var(--border);
            background:var(--bg-3);
        }
        .card-header h3 {
            font-family:var(--font-display); font-size:0.82rem; font-weight:700;
            letter-spacing:0.1em; text-transform:uppercase;
            display:flex; align-items:center; gap:0.5rem; color:var(--grey);
        }
        .card-header h3 i { color:var(--purple-light); }
        .card-body { padding:1.4rem; }

        /* FORM */
        .form-grid-2 { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
        .form-grid-3 { display:grid; grid-template-columns:1fr 1fr 1fr; gap:1rem; }
        .form-group { display:flex; flex-direction:column; gap:0.35rem; margin-bottom:0.8rem; }
        .form-group:last-child { margin-bottom:0; }
        .form-label { font-family:var(--font-mono); font-size:0.65rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--grey-dim); }
        .form-input, .form-select {
            padding:0.65rem 0.9rem; background:var(--bg-3); border:1px solid var(--border);
            border-radius:9px; color:var(--grey); font-family:var(--font-body); font-size:0.88rem;
            transition:border-color 0.2s, box-shadow 0.2s; outline:none; width:100%;
        }
        .form-input:focus, .form-select:focus { border-color:var(--purple-vivid); box-shadow:0 0 0 3px rgba(101,6,124,0.15); }
        .form-input::placeholder { color:var(--grey-dim); opacity:0.6; }
        .form-input:disabled { opacity:0.5; cursor:not-allowed; }
        .form-section-title {
            font-family:var(--font-display); font-size:0.72rem; font-weight:700;
            letter-spacing:0.14em; text-transform:uppercase; color:var(--purple-light);
            margin:1.2rem 0 0.8rem; padding-bottom:0.4rem;
            border-bottom:1px solid var(--border);
        }
        .form-section-title:first-child { margin-top:0; }
        .req { color:var(--danger); font-size:0.75rem; }
        .cep-wrap { position:relative; }
        .cep-spinner {
            position:absolute; right:0.8rem; top:50%; transform:translateY(-50%);
            width:16px; height:16px; border-radius:50%;
            border:2px solid var(--border); border-top-color:var(--purple-vivid);
            animation:spin 0.7s linear infinite; display:none;
        }
        .cep-spinner.show { display:block; }
        @keyframes spin { to{transform:translateY(-50%) rotate(360deg);} }

        /* BUTTONS */
        .btn { display:inline-flex; align-items:center; gap:0.5rem; padding:0.65rem 1.3rem; border-radius:11px; font-family:var(--font-display); font-size:0.74rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; cursor:pointer; transition:all 0.3s; border:none; text-decoration:none; }
        .btn-primary { background:var(--gradient); color:white; border:1px solid rgba(101,6,124,0.4); box-shadow:var(--glow-sm); }
        .btn-primary:hover { box-shadow:var(--glow); transform:translateY(-2px); }
        .btn-primary:disabled { opacity:0.5; transform:none; cursor:not-allowed; }
        .btn-ghost { background:transparent; color:var(--grey-dim); border:1px solid var(--border); }
        .btn-ghost:hover { border-color:var(--purple-vivid); color:var(--purple-light); background:rgba(101,6,124,0.06); }
        .btn-sm { padding:0.4rem 0.9rem; font-size:0.68rem; }
        .btn-danger-ghost { background:transparent; color:var(--danger); border:1px solid rgba(224,85,85,0.3); }
        .btn-danger-ghost:hover { background:rgba(224,85,85,0.08); border-color:var(--danger); }

        /* PEDIDOS */
        .pedido-card {
            background:var(--bg-card); border:1px solid var(--border); border-radius:14px;
            margin-bottom:1rem; overflow:hidden; transition:border-color 0.2s;
        }
        .pedido-card:hover { border-color:var(--border-s); }
        .pedido-card-head {
            display:flex; align-items:center; gap:1rem; padding:1rem 1.4rem;
            border-bottom:1px solid var(--border); background:var(--bg-3); flex-wrap:wrap;
        }
        .pedido-id-tag {
            font-family:var(--font-mono); font-size:0.82rem; font-weight:700;
            color:var(--purple-light); background:rgba(101,6,124,0.1);
            padding:0.2rem 0.7rem; border-radius:20px; border:1px solid rgba(101,6,124,0.2);
        }
        .pedido-data { font-family:var(--font-mono); font-size:0.72rem; color:var(--grey-dim); }
        .pedido-total { font-family:var(--font-display); font-size:1rem; font-weight:900; color:var(--grey); margin-left:auto; }
        .status-badge {
            display:inline-flex; align-items:center; gap:0.3rem;
            font-family:var(--font-mono); font-size:0.65rem; font-weight:700;
            letter-spacing:0.08em; text-transform:uppercase;
            padding:0.2rem 0.6rem; border-radius:20px;
        }
        .badge-pendente   { background:rgba(245,166,35,0.12); color:var(--warning); border:1px solid rgba(245,166,35,0.25); }
        .badge-producao   { background:rgba(58,157,224,0.12); color:var(--info);    border:1px solid rgba(58,157,224,0.25); }
        .badge-enviado    { background:rgba(76,175,128,0.12); color:var(--success); border:1px solid rgba(76,175,128,0.25); }
        .badge-entregue   { background:rgba(76,175,128,0.2);  color:var(--success); border:1px solid rgba(76,175,128,0.4); }
        .badge-cancelado  { background:rgba(224,85,85,0.12);  color:var(--danger);  border:1px solid rgba(224,85,85,0.25); }
        .badge-aguardando { background:rgba(245,166,35,0.12); color:var(--warning); border:1px solid rgba(245,166,35,0.25); }

        .pedido-timeline {
            display:flex; align-items:center; gap:0; padding:1.2rem 1.4rem;
            overflow-x:auto; border-bottom:1px solid var(--border);
        }
        .timeline-step { display:flex; flex-direction:column; align-items:center; gap:0.3rem; flex:1; min-width:80px; position:relative; }
        .timeline-step + .timeline-step::before {
            content:''; position:absolute; left:-50%; top:14px;
            width:100%; height:2px; background:var(--border); z-index:0;
        }
        .timeline-step.done + .timeline-step::before { background:var(--purple-vivid); }
        .ts-dot {
            width:28px; height:28px; border-radius:50%; border:2px solid var(--border);
            background:var(--bg-3); display:flex; align-items:center; justify-content:center;
            font-size:0.7rem; color:var(--grey-dim); z-index:1; transition:all 0.3s;
        }
        .timeline-step.done .ts-dot { background:var(--purple-vivid); border-color:var(--purple-vivid); color:#fff; box-shadow:0 0 10px rgba(101,6,124,0.4); }
        .timeline-step.current .ts-dot { background:var(--bg-card); border-color:var(--purple-light); color:var(--purple-light); box-shadow:0 0 12px rgba(192,132,252,0.4); animation:pulse 1.5s ease-in-out infinite; }
        @keyframes pulse { 0%,100%{box-shadow:0 0 8px rgba(192,132,252,0.4);}50%{box-shadow:0 0 20px rgba(192,132,252,0.7);} }
        .ts-label { font-family:var(--font-mono); font-size:0.6rem; text-align:center; color:var(--grey-dim); line-height:1.3; }
        .timeline-step.done .ts-label, .timeline-step.current .ts-label { color:var(--grey); }

        .pedido-itens { padding:1rem 1.4rem; }
        .pedido-item-row { display:flex; align-items:center; gap:0.8rem; padding:0.5rem 0; border-bottom:1px solid var(--border); }
        .pedido-item-row:last-child { border-bottom:none; }
        .pi-img { width:46px; height:46px; border-radius:8px; background:var(--bg-3); overflow:hidden; flex-shrink:0; }
        .pi-img img { width:100%; height:100%; object-fit:cover; }
        .pi-nome { font-size:0.85rem; font-weight:600; flex:1; }
        .pi-qtd { font-family:var(--font-mono); font-size:0.72rem; color:var(--grey-dim); }
        .pi-preco { font-family:var(--font-mono); font-size:0.82rem; color:var(--purple-light); font-weight:700; }

        .pedido-card-footer { display:flex; justify-content:space-between; align-items:center; padding:0.8rem 1.4rem; background:var(--bg-3); flex-wrap:wrap; gap:0.5rem; }
        .pedido-footer-meta { font-family:var(--font-mono); font-size:0.7rem; color:var(--grey-dim); }

        .filter-tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:1.4rem; }
        .ftab { padding:0.4rem 1rem; background:transparent; border:1px solid var(--border); color:var(--grey-dim); border-radius:30px; font-family:var(--font-mono); font-size:0.72rem; letter-spacing:0.06em; cursor:pointer; transition:all 0.2s; }
        .ftab.active, .ftab:hover { background:var(--gradient); border-color:transparent; color:white; }

        /* CLUBE DE VANTAGENS */
        .clube-header {
            background:linear-gradient(135deg, #3d1c75 0%, #65067c 50%, #8b2fc9 100%);
            border-radius:16px; padding:2rem; margin-bottom:1.4rem; position:relative; overflow:hidden;
        }
        .clube-header::after {
            content:url(https://res.cloudinary.com/dsypqcdvp/image/upload/v1774775135/bpkfymkki0jz2yag2vcv.png);
             position:absolute; right:1.5rem; top:50%; transform:translateY(-50%);
            font-size:5rem; opacity:0.08;

        }
        .clube-header h2 { font-family:var(--font-display); font-size:1.4rem; font-weight:900; color:#fff; }
        .clube-header p { color:rgba(255,255,255,0.75); font-size:0.85rem; margin-top:0.3rem; }
        .clube-stats { display:flex; gap:1.2rem; margin-top:1.2rem; flex-wrap:wrap; }
        .clube-stat { background:rgba(255,255,255,0.1); border:1px solid rgba(255,255,255,0.15); border-radius:12px; padding:0.8rem 1.2rem; }
        .clube-stat-num { font-family:var(--font-display); font-size:1.6rem; font-weight:900; color:#fff; }
        .clube-stat-label { font-family:var(--font-mono); font-size:0.65rem; color:rgba(255,255,255,0.7); text-transform:uppercase; letter-spacing:0.1em; }

        /* BARRA DE PROGRESSO DE NÍVEL */
        .nivel-progress-wrap { margin-bottom:1.2rem; }
        .nivel-labels { display:flex; justify-content:space-between; align-items:center; margin-bottom:0.5rem; }
        .nivel-atual-label { font-family:var(--font-mono); font-size:0.72rem; color:var(--grey-dim); }
        .nivel-proximo-label { font-family:var(--font-mono); font-size:0.72rem; color:var(--grey-dim); }
        .nivel-bar { height:8px; background:var(--bg-3); border-radius:20px; overflow:hidden; position:relative; }
        .nivel-bar-fill { height:100%; border-radius:20px; background:var(--gradient); transition:width 0.8s cubic-bezier(0.4,0,0.2,1); position:relative; }
        .nivel-bar-fill::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.25),transparent); animation:shimBar 2s ease-in-out infinite; }
        @keyframes shimBar { 0%{transform:translateX(-100%);}100%{transform:translateX(200%);} }
        .nivel-pct { font-family:var(--font-mono); font-size:0.68rem; color:var(--purple-light); text-align:right; margin-top:0.35rem; }

        /* COMO GANHAR PONTOS */
        .como-ganhar-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:0.8rem; margin-bottom:1.2rem; }
        .como-ganhar-item { background:var(--bg-3); border:1px solid var(--border); border-radius:12px; padding:1rem; text-align:center; }
        .como-ganhar-item i { font-size:1.6rem; color:var(--purple-light); margin-bottom:0.5rem; display:block; }
        .como-ganhar-item strong { font-family:var(--font-display); font-size:0.85rem; display:block; margin-bottom:0.2rem; }
        .como-ganhar-item span { font-size:0.75rem; color:var(--grey-dim); }

        /* CATÁLOGO DE PRÊMIOS */
        .premios-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1rem; }
        .premio-card {
            background:var(--bg-card); border:1px solid var(--border); border-radius:14px;
            overflow:hidden; transition:all 0.3s; display:flex; flex-direction:column;
        }
        .premio-card:hover { transform:translateY(-3px); box-shadow:var(--glow-sm); border-color:rgba(101,6,124,0.4); }
        .premio-card.esgotado { opacity:0.5; pointer-events:none; }
        .premio-img { height:130px; background:var(--bg-3); display:flex; align-items:center; justify-content:center; font-size:2.8rem; }
        .premio-img img { width:100%; height:100%; object-fit:cover; }
        .premio-info { padding:1rem; flex:1; display:flex; flex-direction:column; }
        .premio-nome { font-family:var(--font-display); font-size:0.9rem; font-weight:700; margin-bottom:0.25rem; }
        .premio-desc { font-size:0.76rem; color:var(--grey-dim); line-height:1.5; flex:1; }
        .premio-footer { display:flex; align-items:center; justify-content:space-between; margin-top:0.8rem; }
        .premio-pontos { font-family:var(--font-mono); font-size:0.8rem; font-weight:700; color:var(--purple-light); display:flex; align-items:center; gap:0.3rem; }
        .btn-resgatar {
            padding:0.35rem 0.8rem; background:var(--gradient); border:none; border-radius:8px;
            color:#fff; font-family:var(--font-display); font-size:0.65rem; font-weight:700;
            letter-spacing:0.08em; text-transform:uppercase; cursor:pointer; transition:all 0.2s;
        }
        .btn-resgatar:hover { box-shadow:var(--glow-sm); }
        .btn-resgatar:disabled { opacity:0.4; cursor:not-allowed; }
        .premio-tag { font-family:var(--font-mono); font-size:0.58rem; padding:0.15rem 0.5rem; border-radius:20px; text-transform:uppercase; letter-spacing:0.08em; }
        .tag-arte    { background:rgba(101,6,124,0.15); color:var(--purple-light); border:1px solid rgba(101,6,124,0.2); }
        .tag-cupom   { background:rgba(76,175,128,0.12); color:var(--success); border:1px solid rgba(76,175,128,0.2); }
        .tag-brinde  { background:rgba(245,166,35,0.12); color:var(--warning); border:1px solid rgba(245,166,35,0.2); }
        .tag-beneficio { background:rgba(58,157,224,0.12); color:var(--info); border:1px solid rgba(58,157,224,0.2); }

        /* HISTÓRICO DE PONTOS */
        .historico-item { display:flex; align-items:center; gap:1rem; padding:0.75rem 0; border-bottom:1px solid var(--border); }
        .historico-item:last-child { border-bottom:none; }
        .hist-icon { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:0.85rem; flex-shrink:0; }
        .hist-ganho  { background:rgba(76,175,128,0.12); color:var(--success); }
        .hist-resgate{ background:rgba(101,6,124,0.12); color:var(--purple-light); }
        .hist-bonus  { background:rgba(245,166,35,0.12); color:var(--warning); }
        .hist-body { flex:1; }
        .hist-desc { font-size:0.85rem; font-weight:500; }
        .hist-data { font-family:var(--font-mono); font-size:0.68rem; color:var(--grey-dim); }
        .hist-pts { font-family:var(--font-display); font-size:0.95rem; font-weight:700; white-space:nowrap; }
        .hist-pts.positivo { color:var(--success); }
        .hist-pts.negativo { color:var(--purple-light); }

        /* MODAL */
        .modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.8); backdrop-filter:blur(8px); z-index:2000; display:none; align-items:center; justify-content:center; padding:2rem; }
        .modal-overlay.open { display:flex; }
        .modal-box { background:var(--bg-card); border:1px solid var(--border); border-radius:16px; max-width:480px; width:100%; max-height:90vh; overflow-y:auto; animation:modalIn 0.2s ease; }
        @keyframes modalIn { from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);} }
        .modal-header { display:flex; justify-content:space-between; align-items:center; padding:1.1rem 1.4rem; border-bottom:1px solid var(--border); }
        .modal-header h2 { font-family:var(--font-display); font-size:1.1rem; font-weight:700; }
        .modal-close { background:none; border:none; font-size:1rem; color:var(--grey-dim); cursor:pointer; }
        .modal-body { padding:1.4rem; }
        .modal-footer { padding:1rem 1.4rem; border-top:1px solid var(--border); display:flex; gap:0.75rem; justify-content:flex-end; }

        /* CODE BOX */
        .codigo-resgate {
            text-align:center; padding:1.5rem;
            background:linear-gradient(135deg,rgba(101,6,124,0.15),rgba(61,28,117,0.1));
            border:2px dashed var(--purple-vivid); border-radius:14px; margin-top:1rem;
        }
        .codigo-resgate .codigo {
            font-family:var(--font-mono); font-size:2rem; font-weight:700;
            color:var(--purple-light); letter-spacing:0.3em;
        }
        .codigo-resgate p { font-size:0.8rem; color:var(--grey-dim); margin-top:0.5rem; }

        /* TOAST */
        .toast-container { position:fixed; bottom:1.5rem; right:1.5rem; z-index:9999; display:flex; flex-direction:column; gap:0.5rem; }
        .toast { background:var(--bg-card); border:1px solid var(--border); border-radius:9px; padding:0.75rem 1rem; font-size:0.83rem; color:var(--grey); display:flex; align-items:center; gap:0.55rem; animation:toastIn 0.25s ease; box-shadow:0 4px 20px rgba(0,0,0,0.3); min-width:240px; }
        @keyframes toastIn { from{opacity:0;transform:translateX(20px);}to{opacity:1;transform:translateX(0);} }
        .toast.success i { color:var(--success); }
        .toast.error i { color:var(--danger); }
        .toast.info i { color:var(--info); }

        /* LOADING */
        .loading-box { text-align:center; padding:3rem 2rem; color:var(--grey-dim); }
        .spinner { width:36px; height:36px; border-radius:50%; border:2px solid var(--border); border-top-color:var(--purple-vivid); animation:spin 0.8s linear infinite; margin:0 auto 1rem; }
        .empty-state { text-align:center; padding:2.5rem 2rem; color:var(--grey-dim); }
        .empty-state i { font-size:2.5rem; opacity:0.25; margin-bottom:0.8rem; display:block; }
        .empty-state p { font-family:var(--font-mono); font-size:0.82rem; }

        /* GATE DE LOGIN */
        #gate-login { position:fixed; inset:0; background:var(--bg); z-index:5000; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:1.2rem; padding:2rem; text-align:center; }
        .gate-logo { font-family:var(--font-display); font-size:2rem; font-weight:900; }
        .gate-logo span { background:var(--gradient-text); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
        #gate-login p { color:var(--grey-dim); max-width:340px; }

        /* FOOTER */
        footer { position:relative; z-index:2; padding:24px 6%; border-top:1px solid var(--border); background:var(--deep); }
        .footer-bottom { display:flex; justify-content:space-between; align-items:center; font-size:0.72rem; color:var(--grey-dim); font-family:var(--font-mono); flex-wrap:wrap; gap:8px; }
        .footer-bottom span { color:var(--purple-light); }

        /* RESPONSIVE */
        @media (max-width:900px) {
            .form-grid-2, .form-grid-3 { grid-template-columns:1fr; }
            .perfil-hero { flex-direction:column; align-items:flex-start; }
            .pontos-hero { margin-left:0; text-align:left; }
            .ptab span { display:none; }
        }
        @media (max-width:768px) {
            .nav-links { display:none; }
            .hamburger { display:flex; }
            .clube-stats { flex-direction:column; }
            .premios-grid { grid-template-columns:1fr 1fr; }
        }
        @media (max-width:480px) {
            #main-content { padding-left:1rem; padding-right:1rem; }
            .perfil-hero {
                display:grid;
                grid-template-columns:72px minmax(0, 1fr) auto;
                grid-template-areas:
                    "avatar info points";
                align-items:center;
                column-gap:0.85rem;
                row-gap:0;
                padding:1rem;
            }
            .perfil-avatar-wrap {
                grid-area:avatar;
                align-self:start;
            }
            .perfil-avatar {
                width:72px;
                height:72px;
                font-size:1.6rem;
            }
            .btn-avatar-upload {
                width:22px;
                height:22px;
                bottom:0;
                right:0;
            }
            .perfil-hero-info {
                grid-area:info;
                min-width:0;
                align-self:center;
            }
            .perfil-hero-name {
                font-size:1.06rem;
                line-height:1.02;
            }
            .perfil-hero-email {
                font-size:0.66rem;
                margin-top:0.12rem;
                word-break:break-word;
            }
            .perfil-hero-badges {
                display:flex;
                align-items:center;
                flex-wrap:nowrap;
                gap:0.28rem;
                width:100%;
                margin-top:0.35rem;
                min-width:0;
            }
            .perfil-hero-badges .nivel-badge {
                flex:0 1 auto;
                min-width:0;
                justify-content:center;
                gap:0.16rem;
                padding:0.16rem 0.32rem;
                text-align:center;
                font-size:0.48rem;
                white-space:nowrap;
                letter-spacing:0;
                overflow:hidden;
                text-overflow:ellipsis;
                text-transform:none;
                border-radius:12px;
            }
            .perfil-hero-badges .nivel-badge:first-child {
                flex:0 0 auto;
            }
            .pontos-hero {
                grid-area:points;
                margin-left:0;
                text-align:right;
                width:auto;
                justify-self:end;
                align-self:center;
                padding-top:0;
            }
            .pontos-hero-num {
                font-size:1.5rem;
            }
            .pontos-hero-label {
                font-size:0.54rem;
                letter-spacing:0;
                text-transform:none;
            }
            .perfil-tabs { flex-wrap:wrap; }
            .premios-grid { grid-template-columns:1fr; }
            .pedido-timeline { display:none; }
        }