:root { --transition-theme: background 0.5s ease, color 0.5s ease, border-color 0.5s ease; }

    [data-theme="dark"] {
      --bg-base:#080910; --bg-surface:#0f1018; --bg-card:#13141f; --bg-card-hover:#181929;
      --bg-nav:rgba(8,9,16,0.82); --border:rgba(255,255,255,0.07); --border-hover:rgba(255,255,255,0.18);
      --text-primary:#f0f2ff; --text-secondary:#8b8fa8; --text-muted:#4a4d65;
      --accent:#2ECC71; --accent-glow:rgba(46,204,113,0.25); --accent-subtle:rgba(46,204,113,0.08);
      --danger:#e74c3c; --warning:#f39c12; --info:#3498db;
      --card-shadow:0 4px 32px rgba(0,0,0,0.45); --noise-opacity:0.025; --grid-color:rgba(255,255,255,0.025);
      --gold:#f0c040; --silver:#b0b8c8; --bronze:#cd8040;
      --gold-bg:rgba(240,192,64,0.1); --silver-bg:rgba(176,184,200,0.08); --bronze-bg:rgba(205,128,64,0.08);
      --chart-line:rgba(46,204,113,0.8); --chart-fill:rgba(46,204,113,0.1); --chart-grid:rgba(255,255,255,0.04);
    }

    [data-theme="light"] {
      --bg-base:#f4f6f2; --bg-surface:#eef0ec; --bg-card:#ffffff; --bg-card-hover:#f9faf8;
      --bg-nav:rgba(244,246,242,0.88); --border:rgba(0,0,0,0.08); --border-hover:rgba(0,0,0,0.2);
      --text-primary:#111318; --text-secondary:#545a6e; --text-muted:#a0a8b8;
      --accent:#1a9e52; --accent-glow:rgba(26,158,82,0.2); --accent-subtle:rgba(26,158,82,0.07);
      --danger:#c0392b; --warning:#d68910; --info:#2980b9;
      --card-shadow:0 4px 24px rgba(0,0,0,0.07); --noise-opacity:0.012; --grid-color:rgba(0,0,0,0.04);
      --gold:#c9a227; --silver:#7a8494; --bronze:#a05c20;
      --gold-bg:rgba(201,162,39,0.08); --silver-bg:rgba(122,132,148,0.07); --bronze-bg:rgba(160,92,32,0.07);
      --chart-line:rgba(26,158,82,0.9); --chart-fill:rgba(26,158,82,0.08); --chart-grid:rgba(0,0,0,0.05);
    }

    *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
    html { scroll-behavior:smooth; }
    body {
      font-family:'DM Sans',sans-serif; background:var(--bg-base);
      color:var(--text-primary); line-height:1.6; overflow-x:hidden;
      transition:var(--transition-theme);
    }
    body::before {
      content:''; position:fixed; inset:0; pointer-events:none; z-index:1000;
      background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
      opacity:var(--noise-opacity);
    }
    .grid-bg {
      position:fixed; inset:0; z-index:0; pointer-events:none; transition:var(--transition-theme);
      background-image:linear-gradient(var(--grid-color) 1px,transparent 1px),linear-gradient(90deg,var(--grid-color) 1px,transparent 1px);
      background-size:64px 64px;
    }

    /* NAV */
    .nav { position:sticky; top:0; z-index:100; background:var(--bg-nav); backdrop-filter:blur(20px) saturate(180%); border-bottom:1px solid var(--border); transition:var(--transition-theme); }
    .nav-inner { max-width:1280px; margin:0 auto; padding:0 24px; height:72px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
    .nav-logo { display:flex; align-items:center; gap:12px; text-decoration:none; }
    .nav-logo-badge { width:38px; height:38px; background:var(--accent); border-radius:10px; display:flex; align-items:center; justify-content:center; font-family:'Bebas Neue',sans-serif; font-size:18px; color:#fff; letter-spacing:1px; box-shadow:0 0 20px var(--accent-glow); }
    .nav-logo-text { font-family:'Bebas Neue',sans-serif; font-size:22px; letter-spacing:2px; color:var(--text-primary); transition:var(--transition-theme); }
    .nav-links { display:flex; gap:32px; list-style:none; }
    .nav-links a { font-size:12px; font-weight:500; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-secondary); text-decoration:none; transition:color 0.2s; position:relative; }
    .nav-links a::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:1px; background:var(--accent); transition:width 0.3s; }
    .nav-links a:hover { color:var(--text-primary); }
    .nav-links a:hover::after, .nav-links a.active::after { width:100%; }
    .nav-links a.active { color:var(--accent); }
    .nav-right { display:flex; align-items:center; gap:16px; }
    .theme-toggle { width:48px; height:26px; background:var(--border); border-radius:13px; border:1px solid var(--border); cursor:pointer; position:relative; transition:background 0.3s,border-color 0.3s; flex-shrink:0; }
    .theme-toggle:hover { border-color:var(--accent); }
    .theme-toggle-knob { position:absolute; top:3px; left:3px; width:18px; height:18px; background:var(--text-primary); border-radius:50%; transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1),background 0.3s; display:flex; align-items:center; justify-content:center; font-size:10px; }
    [data-theme="light"] .theme-toggle-knob { transform:translateX(22px); background:var(--accent); }
    .btn-login { padding:9px 22px; background:var(--accent); color:#fff; border:none; border-radius:8px; font-size:12px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; text-decoration:none; cursor:pointer; transition:all 0.2s; }
    .btn-login:hover { transform:translateY(-1px); box-shadow:0 8px 24px var(--accent-glow); }
    .scroll-progress { position:fixed; top:0; left:0; height:2px; background:var(--accent); z-index:200; box-shadow:0 0 8px var(--accent-glow); }

    /* BREADCRUMB */
    .breadcrumb-bar { background:var(--bg-surface); border-bottom:1px solid var(--border); transition:var(--transition-theme); }
    .breadcrumb-inner { max-width:1280px; margin:0 auto; padding:12px 24px; display:flex; align-items:center; gap:8px; font-size:12px; color:var(--text-muted); }
    .breadcrumb-inner a { color:var(--text-muted); text-decoration:none; transition:color 0.2s; }
    .breadcrumb-inner a:hover { color:var(--accent); }
    .breadcrumb-inner .sep { opacity:0.4; }

    /* =============================================
       HERO DO ATLETA
    ============================================= */
    .athlete-hero {
      position:relative; overflow:hidden;
      padding:64px 24px 0; border-bottom:1px solid var(--border);
      transition:var(--transition-theme);
    }

    /* Fundo degradê animado atrás do hero */
    .hero-aura {
      position:absolute; inset:0; z-index:0; pointer-events:none; overflow:hidden;
    }
    .aura-blob {
      position:absolute; border-radius:50%; filter:blur(80px);
      animation:aura-drift 8s ease-in-out infinite alternate;
      will-change:transform;
    }
    .aura-blob-1 { width:500px; height:500px; background:var(--accent-subtle); top:-150px; left:-100px; animation-delay:0s; }
    .aura-blob-2 { width:400px; height:400px; background:rgba(52,152,219,0.06); top:-100px; right:-80px; animation-delay:-3s; }
    .aura-blob-3 { width:300px; height:300px; background:rgba(240,192,64,0.05); bottom:0; right:200px; animation-delay:-6s; }
    @keyframes aura-drift {
      0%   { transform:translate(0,0) scale(1); }
      100% { transform:translate(30px,20px) scale(1.1); }
    }

    .hero-grid-overlay {
      position:absolute; inset:0; pointer-events:none;
      background-image:linear-gradient(var(--grid-color) 1px,transparent 1px),linear-gradient(90deg,var(--grid-color) 1px,transparent 1px);
      background-size:48px 48px;
    }

    .athlete-hero-inner {
      position:relative; z-index:1; max-width:1280px; margin:0 auto;
      display:flex; gap:40px; align-items:flex-end; padding-bottom:0;
      flex-wrap:wrap;
    }

    /* Avatar grande */
    .athlete-avatar-wrap { position:relative; flex-shrink:0; }
    .athlete-avatar {
      width:140px; height:140px; border-radius:24px;
      display:flex; align-items:center; justify-content:center;
      font-family:'Bebas Neue',sans-serif; font-size:52px; color:#fff;
      border:3px solid var(--border);
      box-shadow:0 0 0 0 var(--accent-glow);
      animation:avatar-pulse 3s ease-in-out infinite;
      position:relative; overflow:hidden;
      transition:border-color 0.3s, transform 0.3s cubic-bezier(0.34,1.56,0.64,1);
      cursor:default;
    }
    .athlete-avatar:hover { transform:scale(1.04); border-color:var(--accent); }
    .athlete-avatar::before {
      content:''; position:absolute; inset:0;
      background:linear-gradient(135deg, rgba(255,255,255,0.08) 0%, transparent 60%);
    }
    @keyframes avatar-pulse {
      0%,100% { box-shadow:0 0 0 0 var(--accent-glow), 0 8px 32px rgba(0,0,0,0.3); }
      50%      { box-shadow:0 0 0 12px transparent, 0 8px 32px rgba(0,0,0,0.3); }
    }

    /* Online dot */
    .athlete-avatar-badge {
      position:absolute; bottom:-6px; right:-6px;
      background:var(--bg-card); border:2px solid var(--bg-card);
      border-radius:99px; padding:4px 10px;
      font-size:10px; font-weight:700; letter-spacing:0.1em; text-transform:uppercase;
      color:var(--accent); white-space:nowrap;
      transition:var(--transition-theme);
    }

    /* Info text */
    .athlete-info { flex:1; padding-bottom:32px; min-width:200px; }
    .athlete-category-badge {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 12px; border-radius:99px;
      background:var(--accent-subtle); border:1px solid rgba(46,204,113,0.2);
      font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
      color:var(--accent); margin-bottom:14px;
    }
    .athlete-name {
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(44px,7vw,80px);
      line-height:0.95; letter-spacing:0.01em;
      color:var(--text-primary); margin-bottom:6px;
      transition:var(--transition-theme);
    }
    .athlete-username {
      font-size:15px; color:var(--text-muted); font-style:italic;
      margin-bottom:16px; transition:var(--transition-theme);
    }
    .athlete-tags { display:flex; gap:10px; flex-wrap:wrap; }
    .athlete-tag {
      display:flex; align-items:center; gap:6px;
      padding:5px 12px; background:var(--bg-card); border:1px solid var(--border);
      border-radius:8px; font-size:12px; color:var(--text-secondary);
      transition:var(--transition-theme);
    }
    .athlete-tag svg { color:var(--accent); }

    /* =============================================
       STATS BAR — números grandes abaixo do hero
    ============================================= */
    .stats-bar {
      position:relative; z-index:1;
      background:var(--bg-surface); border-top:1px solid var(--border);
      transition:var(--transition-theme);
    }
    .stats-bar-inner {
      max-width:1280px; margin:0 auto; padding:0 24px;
      display:grid; grid-template-columns:repeat(4,1fr);
    }
    .stat-item {
      padding:28px 20px; border-right:1px solid var(--border);
      display:flex; flex-direction:column; gap:4px;
      transition:background 0.2s, var(--transition-theme);
    }
    .stat-item:last-child { border-right:none; }
    .stat-item:hover { background:var(--accent-subtle); }
    .stat-num {
      font-family:'Bebas Neue',sans-serif; font-size:42px;
      letter-spacing:0.02em; color:var(--text-primary);
      transition:var(--transition-theme); line-height:1;
    }
    .stat-num.accent { color:var(--accent); }
    .stat-label {
      font-size:11px; font-weight:600; letter-spacing:0.14em; text-transform:uppercase;
      color:var(--text-muted); transition:var(--transition-theme);
    }
    .stat-sub { font-size:12px; color:var(--text-muted); font-family:'DM Mono',monospace; margin-top:2px; transition:var(--transition-theme); }

    /* =============================================
       MAIN GRID
    ============================================= */
    .main-grid {
      max-width:1280px; margin:0 auto; padding:40px 24px 80px;
      display:grid; grid-template-columns:1fr 380px; gap:32px; align-items:start;
      position:relative; z-index:1;
    }

    /* =============================================
       MEDALS SECTION
    ============================================= */
    .section-title-row { display:flex; align-items:center; gap:12px; margin-bottom:24px; }
    .section-title-row svg { color:var(--accent); }
    .section-title-row h2 { font-size:18px; font-weight:700; color:var(--text-primary); transition:var(--transition-theme); }

    .medals-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:40px; }

    .medal-card {
      border-radius:16px; padding:24px 20px; text-align:center;
      border:1px solid; position:relative; overflow:hidden;
      transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1), var(--transition-theme);
      cursor:default;
    }
    .medal-card:hover { transform:translateY(-4px) scale(1.02); }
    .medal-card.gold   { background:var(--gold-bg);   border-color:rgba(240,192,64,0.2); }
    .medal-card.silver { background:var(--silver-bg); border-color:rgba(176,184,200,0.15); }
    .medal-card.bronze { background:var(--bronze-bg); border-color:rgba(205,128,64,0.15); }

    .medal-card::before {
      content:''; position:absolute; inset:0;
      background:radial-gradient(circle at 50% 0%, rgba(255,255,255,0.04) 0%, transparent 65%);
    }

    .medal-icon { font-size:36px; margin-bottom:10px; display:block; line-height:1; filter:drop-shadow(0 4px 12px rgba(0,0,0,0.3)); }
    .medal-count {
      font-family:'Bebas Neue',sans-serif; font-size:48px; line-height:1;
      margin-bottom:4px; transition:var(--transition-theme);
    }
    .medal-card.gold   .medal-count { color:var(--gold); }
    .medal-card.silver .medal-count { color:var(--silver); }
    .medal-card.bronze .medal-count { color:var(--bronze); }
    .medal-label { font-size:10px; font-weight:700; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted); transition:var(--transition-theme); }

    /* =============================================
       PERFORMANCE CHART
    ============================================= */
    .chart-card {
      background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
      padding:24px; margin-bottom:32px; transition:var(--transition-theme);
    }
    .chart-header { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:20px; flex-wrap:wrap; gap:12px; }
    .chart-title { font-size:15px; font-weight:700; color:var(--text-primary); transition:var(--transition-theme); }
    .chart-subtitle { font-size:12px; color:var(--text-muted); margin-top:2px; transition:var(--transition-theme); }
    .chart-legend { display:flex; gap:16px; }
    .chart-legend-item { display:flex; align-items:center; gap:6px; font-size:11px; color:var(--text-muted); }
    .chart-legend-dot { width:8px; height:8px; border-radius:50%; }

    .chart-canvas-wrap { position:relative; height:180px; }
    canvas#perfChart { width:100%!important; }

    /* =============================================
       TOURNAMENT HISTORY TABLE
    ============================================= */
    .history-card {
      background:var(--bg-card); border:1px solid var(--border);
      border-radius:16px; overflow:hidden; transition:var(--transition-theme);
    }
    .history-header {
      padding:18px 24px; border-bottom:1px solid var(--border);
      background:var(--bg-surface); display:flex; align-items:center; justify-content:space-between;
      gap:12px; flex-wrap:wrap; transition:var(--transition-theme);
    }
    .history-header h3 { font-size:15px; font-weight:700; color:var(--text-primary); transition:var(--transition-theme); }
    .history-header .total-badge {
      padding:3px 10px; background:var(--accent-subtle); border:1px solid rgba(46,204,113,0.2);
      border-radius:99px; font-size:11px; font-weight:700; color:var(--accent);
    }

    .history-table { width:100%; border-collapse:collapse; }
    .history-table th {
      padding:12px 20px; text-align:left; font-size:10px; font-weight:700;
      letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted);
      border-bottom:1px solid var(--border); background:var(--bg-surface);
      transition:var(--transition-theme);
    }
    .history-table th:not(:first-child) { text-align:center; }
    .history-table td {
      padding:13px 20px; font-size:13px; color:var(--text-secondary);
      border-bottom:1px solid var(--border); transition:var(--transition-theme);
    }
    .history-table td:not(:first-child) { text-align:center; }
    .history-table tr:last-child td { border-bottom:none; }
    .history-table tr:hover td { background:var(--accent-subtle); color:var(--text-primary); }
    .history-table a.tournament-link {
      color:var(--accent); text-decoration:none; font-weight:500;
      transition:color 0.2s;
    }
    .history-table a.tournament-link:hover { color:var(--text-primary); }
    .history-stat { font-family:'DM Mono',monospace; }
    .history-stat.wins { color:var(--accent); font-weight:600; }
    .history-stat.losses { color:var(--text-muted); }

    /* Resultado badge na linha */
    .result-badge {
      padding:3px 9px; border-radius:99px; font-size:10px; font-weight:700;
      letter-spacing:0.08em; text-transform:uppercase;
    }
    .result-badge.champion { background:var(--gold-bg); color:var(--gold); border:1px solid rgba(240,192,64,0.25); }
    .result-badge.vice     { background:var(--silver-bg); color:var(--silver); border:1px solid rgba(176,184,200,0.2); }
    .result-badge.third    { background:var(--bronze-bg); color:var(--bronze); border:1px solid rgba(205,128,64,0.2); }

    /* Pagination */
    .pagination {
      display:flex; align-items:center; justify-content:center; gap:8px;
      padding:20px 24px; border-top:1px solid var(--border);
      transition:var(--transition-theme);
    }
    .page-btn {
      width:34px; height:34px; border-radius:8px; border:1px solid var(--border);
      background:transparent; color:var(--text-secondary); font-size:13px;
      font-family:'DM Sans',sans-serif; cursor:pointer;
      display:flex; align-items:center; justify-content:center;
      transition:all 0.2s;
    }
    .page-btn:hover:not(:disabled) { border-color:var(--accent); color:var(--accent); }
    .page-btn.active { background:var(--accent); border-color:var(--accent); color:#fff; }
    .page-btn:disabled { opacity:0.3; cursor:not-allowed; }
    .page-info { font-size:12px; color:var(--text-muted); font-family:'DM Mono',monospace; padding:0 8px; }

    /* =============================================
       SIDEBAR
    ============================================= */
    .sidebar { display:flex; flex-direction:column; gap:24px; }

    .sidebar-card {
      background:var(--bg-card); border:1px solid var(--border); border-radius:16px;
      overflow:hidden; transition:var(--transition-theme);
    }
    .sidebar-card-head {
      padding:16px 20px; border-bottom:1px solid var(--border); background:var(--bg-surface);
      display:flex; align-items:center; gap:10px; transition:var(--transition-theme);
    }
    .sidebar-card-head h3 { font-size:14px; font-weight:700; color:var(--text-primary); transition:var(--transition-theme); }
    .sidebar-card-body { padding:20px; }

    /* Win rate ring */
    .winrate-wrap { display:flex; align-items:center; gap:20px; }
    .winrate-ring-wrap { position:relative; width:96px; height:96px; flex-shrink:0; }
    .winrate-ring-wrap svg { transform:rotate(-90deg); }
    .winrate-center {
      position:absolute; inset:0; display:flex; flex-direction:column;
      align-items:center; justify-content:center; gap:0;
    }
    .winrate-pct { font-family:'Bebas Neue',sans-serif; font-size:26px; color:var(--text-primary); line-height:1; transition:var(--transition-theme); }
    .winrate-pct-label { font-size:9px; font-weight:600; letter-spacing:0.1em; text-transform:uppercase; color:var(--text-muted); transition:var(--transition-theme); }
    .winrate-info { flex:1; }
    .winrate-row { display:flex; justify-content:space-between; align-items:center; padding:6px 0; border-bottom:1px solid var(--border); font-size:13px; transition:var(--transition-theme); }
    .winrate-row:last-child { border-bottom:none; }
    .winrate-row-label { color:var(--text-muted); }
    .winrate-row-val { font-weight:600; color:var(--text-primary); font-family:'DM Mono',monospace; }
    .winrate-row-val.accent { color:var(--accent); }

    /* Best results */
    .result-row {
      display:flex; align-items:center; gap:12px;
      padding:12px 0; border-bottom:1px solid var(--border);
      transition:var(--transition-theme);
    }
    .result-row:last-child { border-bottom:none; }
    .result-medal { font-size:20px; width:28px; text-align:center; flex-shrink:0; }
    .result-details { flex:1; min-width:0; }
    .result-name { font-size:13px; font-weight:500; color:var(--text-primary); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:var(--transition-theme); }
    .result-date { font-size:11px; color:var(--text-muted); transition:var(--transition-theme); }

    /* Activity heatmap */
    .heatmap-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:4px; }
    .heatmap-month { text-align:center; }
    .heatmap-label { font-size:9px; color:var(--text-muted); margin-bottom:4px; letter-spacing:0.05em; transition:var(--transition-theme); }
    .heatmap-cell {
      aspect-ratio:1; border-radius:3px; background:var(--border);
      transition:background 0.2s, transform 0.2s;
      cursor:default;
    }
    .heatmap-cell:hover { transform:scale(1.3); z-index:10; position:relative; }
    .heatmap-cell.lvl-1 { background:var(--accent-subtle); }
    .heatmap-cell.lvl-2 { background:rgba(46,204,113,0.25); }
    .heatmap-cell.lvl-3 { background:rgba(46,204,113,0.55); }
    .heatmap-cell.lvl-4 { background:var(--accent); }

    [data-theme="light"] .heatmap-cell.lvl-1 { background:rgba(26,158,82,0.12); }
    [data-theme="light"] .heatmap-cell.lvl-2 { background:rgba(26,158,82,0.28); }
    [data-theme="light"] .heatmap-cell.lvl-3 { background:rgba(26,158,82,0.55); }
    [data-theme="light"] .heatmap-cell.lvl-4 { background:var(--accent); }

    /* =============================================
       ENTRANCE ANIMATIONS
    ============================================= */
    .fade-up { opacity:0; transform:translateY(24px); transition:opacity 0.6s ease, transform 0.6s ease; }
    .fade-up.visible { opacity:1; transform:translateY(0); }

    /* =============================================
       RESPONSIVE
    ============================================= */
    @media (max-width:1024px) {
      .main-grid { grid-template-columns:1fr; }
      .sidebar { display:grid; grid-template-columns:1fr 1fr; }
      .stats-bar-inner { grid-template-columns:repeat(2,1fr); }
      .stats-bar-inner .stat-item:nth-child(2) { border-right:none; }
    }
    @media (max-width:768px) {
      .nav-links { display:none; }
      .stats-bar-inner { grid-template-columns:repeat(2,1fr); }
      .medals-grid { grid-template-columns:repeat(3,1fr); gap:10px; }
      .sidebar { grid-template-columns:1fr; }
      .athlete-hero { padding:40px 20px 0; }
      .athlete-avatar { width:100px; height:100px; font-size:38px; }
      .main-grid { padding:24px 16px 60px; }
    }
    @media (max-width:480px) {
      .athlete-hero-inner { flex-direction:column; align-items:flex-start; gap:20px; }
      .stats-bar-inner { grid-template-columns:1fr 1fr; }
    }
  
    /* =============================================
       HAMBURGER + MOBILE MENU
    ============================================= */
    .hamburger {
      display:none; flex-direction:column; justify-content:center; gap:5px;
      width:40px; height:40px; cursor:pointer; border:none;
      background:transparent; padding:6px; border-radius:8px;
      transition:background 0.2s;
    }
    .hamburger:hover { background:var(--accent-subtle); }
    .hamburger span {
      display:block; height:2px; background:var(--text-primary);
      border-radius:2px; transition:all 0.35s cubic-bezier(0.34,1.56,0.64,1);
      transform-origin:center;
    }
    .hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity:0; transform:scaleX(0); }
    .hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }

    .mobile-menu {
      position:fixed; inset:0; z-index:99;
      background:var(--bg-base); display:flex; flex-direction:column;
      padding:0; pointer-events:none;
      transform:translateX(100%);
      transition:transform 0.4s cubic-bezier(0.77,0,0.175,1);
    }
    .mobile-menu.open { transform:translateX(0); pointer-events:auto; }

    .mobile-menu-header {
      display:flex; align-items:center; justify-content:space-between;
      padding:16px 24px; border-bottom:1px solid var(--border);
      background:var(--bg-surface); min-height:72px;
    }
    .mobile-menu-logo { display:flex; align-items:center; gap:12px; text-decoration:none; }
    .mobile-menu-logo-badge {
      width:36px; height:36px; background:var(--accent); border-radius:9px;
      display:flex; align-items:center; justify-content:center;
      font-family:'Bebas Neue',sans-serif; font-size:16px; color:#fff;
    }
    .mobile-menu-logo-text { font-family:'Bebas Neue',sans-serif; font-size:20px; letter-spacing:2px; color:var(--text-primary); }

    .mobile-menu-body { flex:1; overflow-y:auto; padding:24px; display:flex; flex-direction:column; gap:8px; }
    .mobile-menu-item {
      display:flex; align-items:center; gap:14px;
      padding:14px 16px; border-radius:12px;
      font-size:16px; font-weight:500; color:var(--text-primary);
      text-decoration:none; border:1px solid transparent;
      transition:all 0.2s; cursor:pointer;
    }
    .mobile-menu-item:hover, .mobile-menu-item.active {
      background:var(--accent-subtle); border-color:rgba(46,204,113,0.2); color:var(--accent);
    }
    .mobile-menu-item svg { color:var(--accent); flex-shrink:0; }

    .mobile-menu-divider { height:1px; background:var(--border); margin:8px 0; }

    .mobile-menu-footer {
      padding:20px 24px; border-top:1px solid var(--border);
      display:flex; align-items:center; justify-content:space-between; gap:16px;
    }
    .mobile-theme-row { display:flex; align-items:center; gap:10px; font-size:13px; color:var(--text-secondary); }
    .mobile-assoc-btn {
      padding:11px 22px; background:var(--accent); color:#fff; border:none;
      border-radius:10px; font-size:13px; font-weight:700; font-family:'DM Sans',sans-serif;
      text-decoration:none; cursor:pointer; transition:all 0.2s; white-space:nowrap;
    }
    .mobile-assoc-btn:hover { box-shadow:0 6px 20px var(--accent-glow); }

    @media (max-width:860px) {
      .hamburger { display:flex; }
      .nav-links { display:none !important; }
      .nav-right .btn-login, .nav-right .btn-assoc { display:none; }
      .theme-toggle { display:none; }
    }

    /* FOOTER MOBILE */
    @media (max-width:768px) {
      .footer-top { grid-template-columns:1fr !important; gap:28px !important; padding:36px 20px 24px !important; }
      .footer-bottom { padding:16px 20px !important; }
      .footer-brand { text-align:center; }
      .footer-socials { justify-content:center; }
    }
    @media (max-width:480px) {
      .footer-top { padding:28px 16px 20px !important; }
    }