.github-banner {position:relative; display:flex; align-items:center; gap:18px; padding:22px 26px; border-radius:18px; background:linear-gradient(135deg,#24292e 0%,#1b1f23 70%,#0d1117 100%); box-shadow:0 6px 22px -6px rgba(0,0,0,.6), 0 0 0 1px rgba(255,255,255,.06) inset; margin:14px auto; max-width:820px; color:#e6edf3; text-decoration:none; overflow:hidden; isolation:isolate; transform:translate3d(0,0,0); backface-visibility:hidden; will-change:transform,box-shadow; transition:transform .6s cubic-bezier(.23,1,.32,1), box-shadow .6s cubic-bezier(.23,1,.32,1); }
.github-banner::before{content:""; position:absolute; inset:0; background:radial-gradient(circle at 18% 25%,rgba(255,255,255,.2) 0%,rgba(255,255,255,0) 60%),linear-gradient(120deg,rgba(255,255,255,.09),rgba(255,255,255,0) 70%); opacity:.35; pointer-events:none; mix-blend-mode:overlay;}
.github-banner:hover{transform:translate3d(0,-4px,0); box-shadow:0 18px 46px -12px rgba(0,0,0,.72), 0 0 0 1px rgba(255,255,255,.08) inset;}
.github-banner:active{transform:translateY(-1px);}
.github-banner .gh-icon{width:68px; height:68px; flex-shrink:0; display:flex; align-items:center; justify-content:center; border-radius:16px; background:linear-gradient(135deg,#2d333b,#1b1f24); box-shadow:0 4px 14px -4px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.05) inset; position:relative; overflow:hidden;}
.github-banner .gh-icon svg{width:38px; height:38px; color:#fff; filter:drop-shadow(0 4px 10px rgba(0,0,0,.6));}
.github-banner .gh-text{display:flex; flex-direction:column; gap:6px; min-width:0;}
.github-banner .gh-title{font-size:1.35rem; font-weight:700; line-height:1.15; color:#fff; margin:0; letter-spacing:.5px;}
.github-banner .gh-desc{margin:0; font-size:.9rem; color:#c9d1d9; line-height:1.35;}
.github-banner .gh-meta{display:flex; gap:10px; flex-wrap:wrap; font-size:.7rem; letter-spacing:.5px; margin-top:4px;}
.github-banner .gh-pill{display:inline-flex; align-items:center; gap:4px; padding:4px 10px 4px 8px; border-radius:999px; background:rgba(255,255,255,.08); backdrop-filter:blur(4px); font-weight:600; color:#d0d7de; position:relative; overflow:hidden;}
.github-banner .gh-pill.lang::before{content:""; width:8px; height:8px; border-radius:50%; background:#3572A5; box-shadow:0 0 0 4px rgba(53,114,165,.25);} /* Python color */
.github-banner * {text-decoration:none !important;}
.github-banner .skeleton{position:relative; background:rgba(255,255,255,.12); color:transparent!important; border-radius:6px; overflow:hidden;}
.github-banner .skeleton::after{content:""; position:absolute; inset:0; background:linear-gradient(110deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.25) 40%,rgba(255,255,255,.05) 80%); animation:skeleton 1.4s infinite linear;}
@keyframes skeleton{to{transform:translateX(100%);}}
@media (max-width:640px){.github-banner{flex-direction:column; text-align:center; padding:20px 20px 24px;}.github-banner .gh-text{align-items:center;}.github-banner .gh-meta{justify-content:center;}}

.github-banner {flex-direction:column; text-align:center;}
.github-banner .gh-text {align-items:center;}
.github-banner .gh-meta {justify-content:center;}

.accordion-content a.github-banner,
.accordion-content a.github-banner:hover,
.accordion-content a.github-banner:focus,
#modal-other .modal-content .accordion-content a.github-banner,
#modal-other .modal-content .accordion-content a.github-banner:hover,
#modal-other .modal-content .accordion-content a.github-banner:focus,
#modal-other-1 .modal-content .accordion-content a.github-banner,
#modal-other-1 .modal-content .accordion-content a.github-banner:hover,
#modal-other-1 .modal-content .accordion-content a.github-banner:focus,
#modal-other-2 .modal-content .accordion-content a.github-banner,
#modal-other-2 .modal-content .accordion-content a.github-banner:hover,
#modal-other-2 .modal-content .accordion-content a.github-banner:focus { text-decoration:none !important; }