:root{
  --bg:#111827;
  --fg:#e5e7eb;
  --muted:#9ca3af;
  --line:#1f2937;
  --accent:#06b6d4;
  --accent-2:#0891b2;
  --gap:56px;
  --radius:8px;
  --shadow:0 0 18px rgba(6,182,212,.20);
  --font:"Segoe UI","Microsoft YaHei",sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background-color:var(--bg);
  background-image:linear-gradient(rgba(6,182,212,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(6,182,212,.055) 1px,transparent 1px);
  background-size:38px 38px;
  color:var(--fg);
  font-family:"Segoe UI","Microsoft YaHei",sans-serif;
  font-size:15px;
  line-height:1.8;
}
a{color:var(--accent);text-decoration:none;transition:color .2s;}
a:hover{color:#22d3ee;}
img{display:block;max-width:100%;height:auto;}
h1,h2,h3,p{margin:0;}
.codepgplayqq-shell{display:flex;flex-direction:column;min-height:100vh;}
.codepgplayqq-nav{background:#0b1220;border-bottom:1px solid var(--accent);position:sticky;top:0;z-index:20;}
.codepgplayqq-nav-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;max-width:1120px;margin:0 auto;padding:10px 20px;}
.codepgplayqq-brand{font-size:18px;font-weight:700;color:#fff;letter-spacing:.5px;}
.codepgplayqq-brand span{color:var(--accent);}
.codepgplayqq-nav-links,.nav-links{display:flex;flex-wrap:wrap;gap:18px;}
.nav-links a{color:#fff;font-size:15px;padding:3px 0;border-bottom:2px solid transparent;}
.nav-links a:hover,.nav-links a:focus-visible{border-bottom-color:var(--accent);color:var(--accent);}
.codepgplayqq-main{display:flex;flex-direction:column;width:100%;max-width:1120px;margin:0 auto;padding:0 20px;}
.codepgplayqq-block{display:flex;flex-direction:column;padding:var(--gap) 0;border-bottom:1px solid var(--line);}
.codepgplayqq-block:last-child{border-bottom:none;}
.codepgplayqq-band{display:flex;align-items:center;background:#0c1626;border-left:4px solid var(--accent);border-radius:0 6px 6px 0;padding:8px 16px;margin-bottom:22px;box-shadow:var(--shadow);}
.codepgplayqq-h2{font-size:24px;font-weight:700;color:#fff;line-height:1.4;}
.codepgplayqq-row{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start;}
.codepgplayqq-thumb{flex:0 0 96px;margin:0;}
.codepgplayqq-thumb img{width:96px;height:96px;border:1px solid rgba(6,182,212,.45);border-radius:var(--radius);box-shadow:var(--shadow);}
.codepgplayqq-text{flex:1 1 320px;min-width:260px;color:var(--fg);}
.codepgplayqq-hero{display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:48px 0 20px;}
.codepgplayqq-hero-figure{margin:0;flex:0 0 auto;}
.codepgplayqq-hero-figure img{width:128px;height:128px;border:1px solid var(--accent);border-radius:var(--radius);box-shadow:var(--shadow);}
.codepgplayqq-h1{font-size:34px;font-weight:700;line-height:1.35;color:#fff;}
.codepgplayqq-hero-p{max-width:860px;color:var(--fg);}
.codepgplayqq-timeline{display:flex;flex-direction:column;position:relative;padding-left:26px;}
.codepgplayqq-timeline::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,var(--accent),rgba(6,182,212,0));}
.codepgplayqq-timeline-entry{position:relative;padding:0 0 22px 10px;}
.codepgplayqq-timeline-entry::before{content:"";position:absolute;left:-24px;top:11px;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px rgba(6,182,212,.9);}
.codepgplayqq-timeline-entry:nth-child(even)::before{background:#22d3ee;}
.codepgplayqq-timeline-label{display:inline-block;font-size:15px;font-weight:700;color:var(--accent);letter-spacing:.5px;}
.codepgplayqq-timeline-title{font-size:18px;font-weight:700;color:#fff;margin:2px 0 4px;line-height:1.5;}
.codepgplayqq-timeline-text{color:var(--muted);}
.codepgplayqq-news-date{display:inline-block;font-size:15px;color:var(--accent-2);font-weight:700;margin-bottom:2px;}
.codepgplayqq-faq-list{display:flex;flex-wrap:wrap;gap:14px;}
.codepgplayqq-faq-card{flex:1 1 100%;background:#0e1a28;border:1px solid rgba(6,182,212,.35);border-radius:8px;padding:4px 18px;box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s;}
.codepgplayqq-faq-card:hover{border-color:var(--accent);}
.codepgplayqq-faq-card summary{cursor:pointer;font-size:18px;font-weight:700;color:#fff;padding:10px 0;list-style:none;}
.codepgplayqq-faq-card summary::-webkit-details-marker{display:none;}
.codepgplayqq-faq-card p{color:var(--muted);padding:0 0 14px;font-size:15px;}
.codepgplayqq-card{display:flex;flex-direction:column;gap:14px;background:#132234;border-radius:var(--radius);padding:22px;transition:transform .2s,box-shadow .2s;}
.codepgplayqq-card:hover{transform:translateY(-4px);box-shadow:0 0 24px rgba(6,182,212,.35);}
.codepgplayqq-card-head{align-self:flex-start;background:var(--accent-2);color:#fff;font-size:18px;font-weight:700;padding:6px 14px;border-radius:6px;}
.codepgplayqq-btn{display:inline-block;align-self:flex-start;padding:10px 24px;background:var(--accent);color:#04131a;font-weight:700;font-size:15px;border:none;border-radius:6px;cursor:pointer;transition:background .2s,transform .1s;}
.codepgplayqq-btn:hover{background:#22d3ee;color:#04131a;}
.codepgplayqq-btn:active{transform:translateY(2px);}
.codepgplayqq-footer{background:#0b1220;border-top:1px solid var(--accent);padding:30px 20px 22px;margin-top:var(--gap);}
.codepgplayqq-footer-inner{display:flex;flex-wrap:wrap;gap:22px;max-width:1120px;margin:0 auto;}
.codepgplayqq-footer-col{flex:1 1 260px;min-width:240px;}
.codepgplayqq-footer-line{color:var(--muted);font-size:15px;line-height:2;}
.codepgplayqq-footer-line a{color:var(--accent);}
.codepgplayqq-footer-line a:hover{color:#22d3ee;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;}
@media (max-width:1024px){
  .codepgplayqq-h1{font-size:24px;}
  .codepgplayqq-h2{font-size:18px;}
  .codepgplayqq-thumb{flex:0 0 72px;}
  .codepgplayqq-thumb img{width:72px;height:72px;}
  .codepgplayqq-block{padding:44px 0;}
}
@media (max-width:720px){
  body{font-size:15px;line-height:1.8;}
  .codepgplayqq-nav-inner{padding:10px 14px;}
  .codepgplayqq-nav-links,.nav-links{gap:12px;}
  .nav-links a{font-size:15px;}
  .codepgplayqq-main{padding:0 14px;}
  .codepgplayqq-hero{padding:32px 0 14px;}
  .codepgplayqq-hero-figure img{width:128px;height:128px;}
  .codepgplayqq-h1{font-size:24px;}
  .codepgplayqq-thumb{flex:0 0 64px;}
  .codepgplayqq-thumb img{width:64px;height:64px;}
  .codepgplayqq-faq-card summary{font-size:15px;}
  .codepgplayqq-block{padding:36px 0;}
}
/* 图片按原尺寸显示，不放大 */
img[src^="/img/"]{max-width:256px;max-height:256px;width:auto;height:auto;object-fit:contain;display:inline-block;}
