/* ========== Reset & Base ========== */
    *,*::before,*::after{box-sizing:border-box}
    :where(html,body){margin:0;padding:0}
    :where(img){max-width:100%;display:block}
    :where(a){color:inherit;text-decoration:none}
    :where(button,select,input,textarea){font:inherit;color:inherit}
    :where(ul){margin:0;padding:0;list-style:none}

    :root{
      --bg: #f8fafc;
      --bg-2: #ffffff;
      --text: #0f172a;
      --muted: #64748b;
      --border: rgba(0,0,0,0.08);
      --glass-1: rgba(255,255,255,0.7);
      --glass-2: rgba(255,255,255,0.4);
      --shadow-1: 0 10px 30px rgba(0,0,0,0.05);
      --shadow-2: 0 20px 60px rgba(112,0,255,0.15);
      --radius: 24px;
      --blur: 20px;
      --container: 1200px;
      --accent: 0,180,255;      /* Deep Cyan untuk Light Mode */
      --accent-alt: 112,0,255;  /* Electric Purple */
      --header-h: 72px;
      --header-gap: 12px;
    }
    .dark{
      --bg: #030508;
      --bg-2: #080c14;
      --text: #ffffff;
      --muted: #94a3b8;
      --border: rgba(255,255,255,0.12);
      --glass-1: rgba(255,255,255,0.08);
      --glass-2: rgba(255,255,255,0.03);
      --shadow-1: 0 10px 30px rgba(0,0,0,0.50);
      --shadow-2: 0 20px 60px rgba(112,0,255,0.20);
    }
    /* Lite mode */
    .lite{
      --blur: 0px;
      --shadow-1: 0 4px 10px rgba(16,24,40,.06);
      --shadow-2: 0 8px 24px rgba(16,24,40,.10);
    }
    .lite .site-header,
    .lite .card,
    .lite .search,
    .lite .btn,
    .lite .powered,
    .lite .share-toast,
    .lite .modal .dialog {
      background: var(--bg-2);
      backdrop-filter: none !important;
      -webkit-backdrop-filter: none !important;
      box-shadow: none;
    }
    .lite .splash{ backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
    .lite .skeleton::after{ animation-duration: 1.8s; }

    body{
      font-family:"Inter",system-ui,-apple-system,sans-serif;
      background:
        radial-gradient(1000px 500px at 12% -10%, rgba(var(--accent-alt),.15), transparent 60%),
        radial-gradient(800px 450px at 105% 18%, rgba(var(--accent),.15), transparent 55%),
        linear-gradient(180deg,var(--bg),var(--bg));
      color:var(--text);
      line-height:1.6;
      min-height:100dvh;
      -webkit-font-smoothing:antialiased;
    }
    h1, h2, h3, h4, .title, .section-title, .name, .stat strong {
      font-family: "Space Grotesk", sans-serif;
      letter-spacing: -0.02em;
    }

    :where(section,[id]){ scroll-margin-top: calc(var(--header-h) + var(--header-gap)); }

    /* ========== Header ========== */
    .site-header{
      position:sticky;top:0;z-index:100;
      backdrop-filter: blur(var(--blur));
      -webkit-backdrop-filter: blur(var(--blur));
      background: linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border-bottom:1px solid var(--border);
      box-shadow: var(--shadow-1);
      isolation:isolate;
    }
    .header-wrap{
      max-width:var(--container);
      margin:0 auto;
      padding:10px clamp(12px,3vw,20px);
      padding-top: calc(10px + env(safe-area-inset-top));
      display:grid;
      grid-template-columns: auto 1fr auto;
      gap:24px;
      align-items:center;
    }

    .brand{
      display:flex;align-items:center;gap:10px;min-width:0;
    }
    .brand .logo{
      width:36px;height:36px;border-radius:12px;display:grid;place-items:center;
      background:linear-gradient(135deg, rgba(var(--accent),.25), rgba(var(--accent),.12));
      border:1px solid var(--border);
      box-shadow: var(--shadow-1);
      flex:0 0 auto;
    }
    .brand .title{ font-weight:800; letter-spacing:.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width: clamp(100px,18vw,260px) }
    .brand .subtitle{ color:var(--muted); font-weight:600; margin-left:6px }

    /* Desktop search */
    .search{
      display:flex;align-items:center;gap:8px;
      padding:10px 14px;border-radius:22px;
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border:1px solid var(--border); box-shadow: var(--shadow-1);
      max-width:clamp(420px, 44vw, 720px); margin:0 auto; width:100%;
      min-width: 0;
    }
    .search input{flex:1; background:transparent; border:0; outline:0; color:var(--text); font-size:10px; min-width: 80px}
    .toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end;min-width:0;overflow:visible}

    .btn{
      display:inline-flex; align-items:center; gap:8px;
      padding:9px 12px; border-radius:12px;
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border:1px solid var(--border); box-shadow: var(--shadow-1);
      transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
      white-space:nowrap;
      cursor: pointer;
    }
    .btn:hover{ transform: translateY(-1px); box-shadow: var(--shadow-2); }
    .btn.accent{ background: rgba(var(--accent),.22); border-color: rgba(var(--accent),.45); color:var(--text); font-weight:600; }
    .btn .dot{ width:12px; height:12px; border-radius:999px; background:rgb(var(--accent)); box-shadow:0 0 0 2px rgba(var(--accent),.25) }

    .navlinks{ display:flex; gap:6px; align-items:center; flex-wrap:wrap; overflow:visible; justify-content:flex-end; }
    .navlinks .btn{ padding:7px 10px; font-size:13px; }

    .hide-sm{ display:inline-flex }
    .show-sm{ display:none }
    @media (max-width: 960px){
      .hide-sm{ display:none !important }
      .show-sm{ display:inline-flex !important }
    }

    .hamburger{
      display:none; align-items:center; justify-content:center;
      width:40px; height:40px; border-radius:12px;
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border:1px solid var(--border); box-shadow: var(--shadow-1);
    }

    .mobile-panel{
      display:none; overflow:hidden;
      max-height:0; transition:max-height .3s ease;
      border-top:1px solid var(--border);
      background: linear-gradient(180deg,var(--glass-1),var(--glass-2));
      backdrop-filter: blur(var(--blur));
      -webkit-backdrop-filter: blur(var(--blur));
    }
    .mobile-panel.open{ display:block; max-height:1000px; }
    .mobile-inner{
      max-width:var(--container);
      margin:0 auto;
      padding:12px clamp(12px,3vw,20px);
      display:grid; gap:10px;
    }

    .mobile-nav{ display:flex; gap:8px; flex-wrap:wrap }
    .mobile-nav .btn{ flex:1 1 calc(50% - 8px) }

    @media (max-width:960px){
      #mobilePanel form.search{ display:none !important; }
    }

    @media (max-width: 1080px){
      .brand .title{ max-width:220px }
      .search{ max-width:clamp(360px, 40vw, 600px) }
    }
    @media (max-width: 960px){
      .header-wrap{
        grid-template-columns: auto 1fr auto;
      }
      .search{ display:none; }
      .hamburger{ display:inline-flex; }
      .brand .subtitle{ display:none; }
      .navlinks{ display:none }
    }

    /* ========== Search Popover (mobile) ========== */
    .search-popover{
      position:absolute; inset:auto 0 auto 0; top:100%;
      padding:8px clamp(12px,3vw,20px) calc(10px + env(safe-area-inset-bottom));
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border-bottom:1px solid var(--border);
      box-shadow: var(--shadow-2);font-size:15px;
      display:none; opacity:0; max-height:0; overflow:hidden;
      transition: opacity .18s ease, max-height .25s ease;
      z-index:101;
    }
    .search-popover.open{ display:block; opacity:1; max-height:140px }
    .search-popover .search{ display:flex; max-width:none; margin:0; }

    .popover-panel {
      position:absolute; left:0; top:calc(100% + 12px);
      width:max-content; min-width:320px;
      background:var(--bg-2); /* Background solid (bukan glass) agar teks belakang tidak tembus! */
      border:1px solid var(--border);
      border-radius:14px;
      box-shadow:var(--shadow-2), 0 0 0 1px rgba(0,0,0,0.05);
      z-index:200;
      opacity:0;
      transform:translateY(-10px) scale(0.95);
      visibility:hidden;
      pointer-events:none;
      transition: opacity 0.25s ease, transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), visibility 0.25s;
    }
    .popover-panel.open {
      opacity:1; transform:translateY(0) scale(1);
      visibility:visible; pointer-events:auto;
    }

    /* ========== Layout Asli ========== */
    .container{
      max-width:var(--container);
      margin:22px auto;
      padding:0 clamp(12px,3vw,20px);
      display:grid; grid-template-columns: 320px 1fr; gap:24px; align-items:start;
    }
    @media (max-width: 1024px){ .container{ grid-template-columns: 1fr; } }
    
    .sidebar{ position:sticky; top:calc(var(--header-h) + var(--header-gap)); display:flex; flex-direction:column; gap:16px; z-index:10; }
    @media (max-width:1024px){ .sidebar{ position:static } }
    
    .stack { display:flex; flex-direction:column; gap:24px; min-width: 0; }
    
    .card-body { padding: 24px; }

    .card{
      position:relative; border-radius:var(--radius); overflow:clip;
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border:1px solid var(--border); box-shadow: var(--shadow-1);
      backdrop-filter: blur(var(--blur));
      -webkit-backdrop-filter: blur(var(--blur));
      transition: transform .3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow .3s cubic-bezier(0.4, 0, 0.2, 1), border-color 0.3s;
    }
    .card::before {
      content: ""; position: absolute; inset: 0;
      background: radial-gradient(800px circle at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(255,255,255,0.06), transparent 40%);
      opacity: 0; transition: opacity 0.5s; pointer-events: none; z-index: 1;
    }
    .card:hover::before { opacity: 1; }
    .card:hover{ transform: translateY(-4px) scale(1.01); box-shadow: var(--shadow-2); border-color: rgba(var(--accent-alt), 0.3); }
    .row{ display:flex; align-items:center; gap:12px; margin-bottom:16px; width:100%; }
    .space{ flex:1 }
    .section-title{ display:flex; align-items:center; gap:10px; font-size:20px; font-weight:700; margin:0 }
    .divider{ height:1px; background:var(--border); margin:16px 0 }

    /* ========== Profil ========== */
    .profile-top{ display:flex; gap:14px; align-items:center }
    .avatar{ width:112px; height:112px; border-radius:16px; overflow:hidden; border:1px solid var(--border); box-shadow: var(--shadow-1) }
    .name{ font-size:20px; font-weight:800; margin:0 }
    .username{ color:var(--muted); font-weight:600 }
    .bio{ margin:8px 0 0 }
    .meta{ display:grid; gap:8px; margin-top:8px }
    .meta-item{ display:flex; align-items:center; gap:8px; color:var(--muted); font-weight:600; font-size:14px; min-width:0 }
    .counts{ display:flex; gap:14px; align-items:center; margin-top:6px; color:var(--muted); font-weight:600 }
    .counts strong{ color:var(--text) }
    .profile-actions{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px }
    .link-btn{ padding:8px 10px; border-radius:10px; border:1px solid var(--border); background:linear-gradient(180deg,var(--glass-1),var(--glass-2)); display:inline-flex; gap:8px; align-items:center }
    .link-btn:hover{ transform: translateY(-1px); box-shadow: var(--shadow-1) }
    .stat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:10px }
    .stat{ padding:10px; border-radius:12px; border:1px solid var(--border); background:linear-gradient(180deg,var(--glass-1),var(--glass-2)); display:grid; gap:2px }
    .stat .label{ font-size:12px; color:var(--muted); font-weight:600 }
    .tag{ display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; border:1px solid var(--border); background:linear-gradient(180deg,var(--glass-1),var(--glass-2)); font-size:12px; margin:2px 6px 2px 0 }

    .quick-nav{ display:grid; gap:8px }
    .quick-nav a{ display:flex; gap:8px; align-items:center; padding:8px 10px; border:1px solid var(--border); border-radius:10px; background:linear-gradient(180deg,var(--glass-1),var(--glass-2)) }
    .quick-nav a:hover{ transform: translateY(-1px) }

    /* ========== Main / Repositories ========== */
    .stack{ display:grid; gap:16px }
    .filters{ display:flex; gap:8px; flex-wrap:wrap; align-items:center }
    .select, .input, .textarea{
      padding:9px 12px; border-radius:12px; border:1px solid var(--border);
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2)); box-shadow: var(--shadow-1); color:var(--text)
    }
    .textarea{ width:100%; min-height:84px; resize:vertical }

    .repo-list{ display:grid; gap:12px }
    .repo{
      display:grid; gap:10px; padding:14px; border-radius:14px; border:1px solid var(--border);
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2)); box-shadow: var(--shadow-1);
      cursor:pointer; transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease;
      overflow: hidden;
    }
    .repo:hover{
      transform: translateY(-3px); box-shadow: var(--shadow-2);
      border-color: rgba(var(--accent), 0.4);
    }
    .repo-preview{
      position: relative; width: 100%; border-radius: 10px; overflow: hidden;
      border: 1px solid var(--border); background: var(--glass-1);
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 2px;
    }
    .repo-preview img{
      width: 100%; height: auto; display: block;
      transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .repo:hover .repo-preview img{
      transform: scale(1.05);
    }
    .repo-top{ display:flex; gap:10px; align-items:center; justify-content:space-between; min-width:0; flex-wrap:wrap }
    .repo-name{ font-weight:800; font-size:16px; display:inline-flex; gap:10px; align-items:center; min-width:0 }
    .repo-name a{ overflow:hidden; text-overflow:ellipsis }
    .muted{ color:var(--muted); font-weight:600; font-size:13px }
    .repo-foot{ display:flex; gap:8px; align-items:center; flex-wrap:wrap }
    .pill{ display:inline-flex; gap:6px; align-items:center; font-size:12px; padding:6px 8px; border-radius:999px; border:1px solid var(--border); background:linear-gradient(180deg,var(--glass-1),var(--glass-2)) }
    .lang-dot{ width:10px; height:10px; border-radius:999px; box-shadow:0 0 0 2px var(--border) }

    .markdown{ font-size:14.5px }
    .markdown p{ margin:0 0 10px }
    .markdown ul{ list-style:disc; padding-left:18px }
    .markdown li{ margin:6px 0 }

    /* ========== Modal ========== */
    .modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; padding:20px; z-index:120 }
    .modal.open{ display:flex }
    .overlay{ position:absolute; inset:0; background:rgba(0,0,0,.45); backdrop-filter: blur(6px) }
    .dialog{
      position:relative; max-width:820px; width:100%; border-radius:16px; overflow:clip;
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border:1px solid var(--border); box-shadow: var(--shadow-2); backdrop-filter: blur(var(--blur));
      -webkit-backdrop-filter: blur(var(--blur));
      animation: pop .22s ease;
    }
    @keyframes pop{ from{ transform:translateY(6px) scale(.98); opacity:.6 } to{ transform:translateY(0) scale(1); opacity:1 } }
    .modal .header,.modal .footer{ padding:14px 16px }
    .modal .header{ display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--border) }
    .modal .content{ padding:16px }
    .modal-preview{
      width: 100%; border-radius: 12px; overflow: hidden; margin-bottom: 14px;
      border: 1px solid var(--border); background: var(--glass-1);
      box-shadow: var(--shadow-1); display: flex; align-items: center; justify-content: center;
    }
    .modal-preview img{
      width: 100%; height: auto; display: block;
    }
    .close{ border-radius:10px; padding:8px }
    .close:hover{ background: rgba(var(--accent),.12) }

    /* ========== Skeleton ========== */
    .skeleton{ position:relative; overflow:hidden; background: rgba(160,170,190,.18); border-radius:10px; min-height:14px }
    .skeleton::after{ content:""; position:absolute; inset:0; transform:translateX(-100%);
      background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent); animation: shimmer 1.2s infinite }
    @keyframes shimmer{ 100%{ transform:translateX(100%) } }

    /* ========== Reveal ========== */
    .reveal{ opacity:0; transform:translateY(10px); transition: opacity .5s ease, transform .5s ease }
    .reveal.show{ opacity:1; transform:translateY(0) }

    /* ========== Footer ========== */
    footer{
      max-width:var(--container); margin:18px auto 90px; margin-bottom:18px; margin-top:10px;
      padding:0 clamp(12px,3vw,20px); display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px;
      color:var(--muted); position:relative;
    }
    footer a{ color: rgb(var(--accent)) }

    .powered{
      display:flex; align-items:center; gap:8px; font-size:13px;
      padding:8px 10px; border-radius:10px; border:1px solid var(--border);
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
    }

    /* ========== Floating actions ========== */
    .fab{
      position:fixed; right:16px; bottom:16px; display:grid; gap:10px; z-index:110;
    }
    .fab .btn{ width:44px; height:44px; padding:0; align-items:center; justify-content:center; border-radius:12px }
    .fab .btn i{ width:20px; height:20px }
    .fab .btn.hidden{ opacity:0; pointer-events:none; transform: translateY(6px); transition: .2s ease }

    /* Share panel */
    .share-toast{
      position:fixed; right:16px; bottom:86px;
      background:linear-gradient(180deg,var(--glass-1),var(--glass-2));
      border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-2);
      padding:10px 12px; color:var(--text); display:none; z-index:110;
    }
    .share-toast.show{ display:block; animation: pop .22s ease }

    /* ========== Loading Screen ========== */
    .splash{
      position:fixed; inset:0; display:grid; place-items:center; z-index:130;
      background:
        radial-gradient(1000px 500px at 12% -10%, rgba(var(--accent),.12), transparent 60%),
        radial-gradient(800px 450px at 105% 18%, rgba(var(--accent),.10), transparent 55%),
        linear-gradient(180deg,var(--bg),var(--bg));
      transition: opacity .35s ease, visibility .35s ease;
    }
    .splash.hidden{ opacity:0; visibility:hidden }
    .spinner{
      width:74px; height:74px; position:relative; border-radius:50%;
      border:4px solid rgba(var(--accent),.18); border-top-color: rgb(var(--accent));
      animation: spin 1s linear infinite;
      box-shadow: 0 10px 28px rgba(0,0,0,.12), inset 0 0 18px rgba(var(--accent),.15);
    }
    .spinner::after{
      content:""; position:absolute; inset:8px; border-radius:50%;
      border:3px solid transparent; border-right-color: rgba(var(--accent),.65);
      filter: blur(.2px);
    }
    @keyframes spin{ to{ transform:rotate(360deg) } }
    .splash-label{ margin-top:14px; text-align:center; font-weight:700; color:var(--muted) }
    @media (prefers-reduced-motion: reduce){
      .spinner{ animation: none }
    }

    .row{ display:flex; align-items:center; gap:10px }
    .space{ flex:1 }
    html{ scroll-behavior: smooth }
    @media (prefers-reduced-motion: reduce){
      *{ animation: none !important; transition: none !important }
    }

    /* Load more button */
    #loadMoreWrap { margin-top:12px; display:flex; justify-content:center; }

    .btn.load-more {
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:8px 12px;
      border-radius:999px;
      min-width:120px;
      max-height:40px;
      font-size:14px;
      line-height:1;
      background: linear-gradient(90deg, rgba(var(--accent),0.98), rgba(var(--accent),0.86));
      color: #fff;
      border: 1px solid rgba(255,255,255,0.12);
      cursor:pointer;
      transition: transform .16s cubic-bezier(.2,.9,.2,1), box-shadow .18s ease, opacity .12s ease, background .18s ease;
      box-shadow:
        0 6px 14px rgba(2,6,23,0.14),
        0 8px 28px rgba(var(--accent),0.14),
        inset 0 -3px 6px rgba(0,0,0,0.06);
    }

    .btn.load-more:hover {
      transform: translateY(-3px);
      box-shadow:
        0 12px 30px rgba(2,6,23,0.16),
        0 18px 44px rgba(var(--accent),0.20),
        inset 0 -3px 6px rgba(0,0,0,0.06);
    }

    .btn.load-more.loading .lm-icon { visibility:hidden; }
    .btn.load-more.loading .lm-spinner { display:inline-block; }
    .btn.load-more.all-loaded {
      background: linear-gradient(90deg, rgba(60,180,100,0.98), rgba(40,150,80,0.92));
      color: #fff;
      box-shadow:
        0 8px 20px rgba(12,50,20,0.14),
        0 14px 34px rgba(40,150,80,0.18);
    }

    @keyframes lm-spin { to { transform: rotate(360deg); } }

    @media (max-width:420px){
      .btn.load-more { min-width:110px; padding:7px 10px; gap:6px; font-size:13px; }
      .btn.load-more .lm-icon { width:14px; height:14px; }
      .btn.load-more .lm-spinner { width:12px; height:12px; border-width:2px; }
    }

    /* ========== Comprehensive Mobile HP Responsive Optimizations ========== */
    @media (max-width: 640px){
      .container{ gap: 14px; margin: 14px auto; padding: 0 12px; }
      .card-body{ padding: 14px !important; }
      .section-title{ font-size: 16px; gap: 8px; }
      .profile-top{ gap: 10px; }
      .avatar{ width: 92px; height: 92px; border-radius: 14px; }
      .name{ font-size: 18px; }
      .stat-grid{ gap: 6px; }
      .stat{ padding: 8px 6px; }
      .stat .label{ font-size: 11px; }
      .stat strong{ font-size: 15px; }
      .doc-tabs{ gap: 6px; margin-bottom: 10px !important; }
      .doc-tab-btn{ flex: 1 1 100%; justify-content: center; padding: 10px 12px !important; font-size: 13.5px !important; }
      .doc-viewer-box object, .doc-viewer-box iframe{ height: 380px !important; }
      .doc-pane > div:first-child{ flex-direction: column; align-items: flex-start !important; gap: 10px !important; padding: 10px 12px !important; }
      .doc-pane > div:first-child > div:last-child{ width: 100%; display: flex; gap: 6px; }
      .doc-pane > div:first-child > div:last-child a{ flex: 1; justify-content: center; text-align: center; padding: 8px 10px !important; font-size: 13px !important; }
      .repo-top{ flex-direction: column; align-items: flex-start; gap: 4px; }
      .repo-foot{ gap: 6px; }
      .mobile-nav .btn{ flex: 1 1 100%; justify-content: flex-start; padding: 10px 12px; font-size: 14px; }
      footer{ flex-direction: column; align-items: center; text-align: center; gap: 14px; margin-bottom: 120px !important; padding: 0 14px; }
      footer .powered{ width: 100%; justify-content: center; text-align: center; font-size: 12.5px; line-height: 1.4; padding: 10px; }
      footer > div:first-child{ font-size: 13.5px; text-align: center; line-height: 1.5; }
    }
    @media (max-width: 480px){
      .avatar{ width: 80px; height: 80px; }
      .name{ font-size: 17px; }
      .profile-actions .btn, .profile-actions .link-btn{ flex: 1 1 calc(50% - 4px); justify-content: center; }
      .stat-grid{ grid-template-columns: repeat(3, 1fr); gap: 4px; }
      .stat{ padding: 6px 4px; text-align: center; }
      .stat .label{ font-size: 10.5px; }
      .stat strong{ font-size: 14px; }
      .quick-nav a{ padding: 10px 12px; font-size: 14px; }
    }