/* ============================================
   code-section.css — 末尾「查看源码 + README」区块
   ============================================ */

.code-section{
  position:relative;padding:120px 6% 100px;z-index:1;
  background:linear-gradient(180deg,var(--ivory) 0%,#0A0306 100%);
  color: var(--text-light);
}
.code-section-inner{max-width:1100px;margin:0 auto;text-align:center}

.code-section-rosette{width:120px;height:120px;margin:0 auto 30px;filter:drop-shadow(0 0 16px rgba(var(--gold-rgb), 0.4));
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><defs><radialGradient id='cr'><stop offset='0%25' stop-color='%23FFD700'/><stop offset='100%25' stop-color='%23B8860B'/></radialGradient></defs><circle cx='50' cy='50' r='6' fill='url(%23cr)'/><path d='M50,8 Q58,28 50,48 Q42,28 50,8' fill='url(%23cr)' opacity='0.9'/><path d='M50,92 Q58,72 50,52 Q42,72 50,92' fill='url(%23cr)' opacity='0.9'/><path d='M8,50 Q28,42 48,50 Q28,58 8,50' fill='url(%23cr)' opacity='0.9'/><path d='M92,50 Q72,42 52,50 Q72,58 92,50' fill='url(%23cr)' opacity='0.9'/><path d='M20,20 Q35,35 50,50 Q35,35 20,20' fill='url(%23cr)' opacity='0.8'/><path d='M80,80 Q65,65 50,50 Q65,65 80,80' fill='url(%23cr)' opacity='0.8'/><path d='M20,80 Q35,65 50,50 Q35,65 20,80' fill='url(%23cr)' opacity='0.8'/><path d='M80,20 Q65,35 50,50 Q65,35 80,20' fill='url(%23cr)' opacity='0.8'/></svg>");
  background-size:contain;background-repeat:no-repeat}

.code-section-label{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:0.5em;color:var(--gold);
  text-transform:uppercase;margin-bottom:16px;opacity:0.8;
}
.code-section-title{
  font-family:'Noto Serif SC',serif;font-size:clamp(28px,4vw,42px);font-weight:700;
  letter-spacing:0.2em;margin:0 0 16px;
  background:linear-gradient(180deg,var(--gold-pale),var(--gold-bright),var(--gold),var(--gold-bright),var(--gold-pale));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.code-section-sub{
  font-family:'Cormorant Garamond',serif;font-size:18px;font-style:italic;
  color:#C97B84;letter-spacing:0.2em;margin:0 0 60px;
}

.code-cards{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:50px}
.code-cards-single{grid-template-columns:minmax(320px,560px);justify-content:center}
.code-card{
  position:relative;padding:40px 30px;
  background:rgba(255,255,255,0.05);
  border:1px solid var(--gold-light);
  text-align:center;transition:all 0.4s;
}
.code-card:hover{background:rgba(var(--gold-rgb), 0.08);border-color:var(--gold-bright);transform:translateY(-4px);box-shadow:0 20px 40px rgba(var(--gold-rgb), 0.15)}
.code-card-icon{font-size:48px;margin-bottom:20px;filter:drop-shadow(0 0 8px rgba(var(--gold-rgb), 0.4));font-family:'Cinzel Decorative',serif;color:var(--gold)}
.code-card-title{
  font-family:'Noto Serif SC',serif;font-size:22px;font-weight:600;letter-spacing:0.2em;
  color: var(--text-light);margin:0 0 12px;
}
.code-card-desc{
  font-family:'Noto Serif SC',serif;font-size:14px;line-height:1.8;color:#C97B84;
  margin:0 0 24px;opacity:0.9;
}
.code-card-btn{
  display:inline-block;padding:14px 40px;
  font-family:'Cinzel Decorative',serif;font-size:13px;letter-spacing:0.4em;
  color:var(--ink);
  background:linear-gradient(135deg,var(--gold-pale) 0%,var(--gold-bright) 50%,var(--gold) 100%);
  border:1px solid var(--gold-bright);cursor:pointer;
  transition:all 0.3s;text-transform:uppercase;text-decoration:none;
}
.code-card-btn:hover{letter-spacing:0.5em;box-shadow:0 0 20px rgba(var(--gold-rgb), 0.5);transform:translateY(-2px)}

.code-section-files{
  margin-top:80px;padding:40px 30px;
  background:rgba(0,0,0,0.4);border:1px solid var(--gold-light);
  text-align:left;font-family:'Courier New',monospace;font-size:13px;
  color:var(--gold-pale);line-height:2;letter-spacing:0.05em;
}
.code-section-files-label{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:0.4em;color:var(--gold);
  text-transform:uppercase;margin-bottom:16px;padding-bottom:8px;
  border-bottom:1px solid var(--gold-light);display:block;
}
.code-section-files code{display:block;color:var(--gold-bright)}
.code-section-files .comment{color:#C97B84;opacity:0.7}

/* v7.1.15: 开发实录区（lightbox 可点击） */
.code-section-records{
  margin-top:60px;padding:40px 30px;
  background:rgba(0,0,0,0.4);border:1px solid var(--gold-light);
}
.code-records-text{
  font-family:'Cormorant Garamond',serif;font-size:15px;line-height:1.9;
  color:var(--gold-pale);opacity:0.85;margin:0 0 24px;
  font-style:italic;letter-spacing:0.05em;
}
.code-records-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:24px;
}
.code-record-card{margin:0;position:relative;overflow:hidden;
  border:1px solid rgba(212,175,55,0.4);background:rgba(20,10,15,0.4);
  transition:transform 0.4s,box-shadow 0.4s;cursor:pointer;
}
.code-record-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(var(--gold-rgb),0.4)}
.code-record-card img{width:100%;height:auto;display:block}
.code-record-card figcaption{
  font-family:'Cinzel',serif;font-size:11px;letter-spacing:0.3em;
  color:var(--gold-bright);padding:14px 12px;text-align:center;
  background:rgba(0,0,0,0.5);text-transform:uppercase;
}
@media(max-width:768px){
  .code-records-grid{grid-template-columns:1fr;gap:16px}
}

/* v7.1.15: 开发实录暗色适配（用 .code-section 暗色背景 + 增强对比） */
:root[data-theme="dark"] .code-section-records,
:root[data-theme="dark"] .code-section-files {
  background:linear-gradient(180deg,rgba(20,30,48,0.6),rgba(15,27,42,0.4));
  border-color:var(--gold-light);
}
:root[data-theme="dark"] .code-record-card{
  background:rgba(10,20,35,0.6);border-color:rgba(168,192,216,0.35);
}
:root[data-theme="dark"] .code-record-card figcaption{
  color:var(--text-light);background:rgba(0,0,0,0.6);
}
:root[data-theme="dark"] .code-records-text{
  color:var(--text-light);opacity:0.9;
}

@media(max-width:900px){
  .code-cards{grid-template-columns:1fr;gap:24px}
  .code-section{padding:80px 4% 60px}
}

/* v7.1.10 暗色：code-section 全段文字清晰度提升 */
:root[data-theme="dark"] .code-section {
  background: linear-gradient(180deg, #0F1B2A 0%, #050A12 100%);
}
:root[data-theme="dark"] .code-section-rosette {
  filter: hue-rotate(195deg) saturate(0.4) brightness(1.5) drop-shadow(0 0 16px rgba(168, 192, 216, 0.5));
}
:root[data-theme="dark"] .code-section-label { color: var(--text-light); opacity: 0.9; }
:root[data-theme="dark"] .code-section-sub { color: var(--text-light); opacity: 0.85; }

:root[data-theme="dark"] .code-card {
  background: rgba(20, 35, 55, 0.7);
  border-color: var(--gold);
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
}
:root[data-theme="dark"] .code-card:hover {
  background: rgba(30, 50, 75, 0.85);
  border-color: var(--text-light);
}
:root[data-theme="dark"] .code-card-title { color: var(--text-light); }
:root[data-theme="dark"] .code-card-desc { color: var(--text-light); opacity: 0.9; }
:root[data-theme="dark"] .code-card-icon { color: var(--text-light); }

:root[data-theme="dark"] .code-card-btn {
  color: #0F1B2A; /* 深色字配月银按钮 */
  background: linear-gradient(135deg, var(--text-light) 0%, var(--gold-bright) 50%, var(--text-light) 100%);
  border-color: var(--text-light);
}
:root[data-theme="dark"] .code-card-btn:hover {
  color: #0F1B2A;
  box-shadow: 0 0 24px rgba(168, 192, 216, 0.6);
}

:root[data-theme="dark"] .code-section-files {
  background: rgba(10, 20, 35, 0.85);
  border-color: var(--gold);
  color: var(--text-light);
}
:root[data-theme="dark"] .code-section-files code { color: var(--text-light); }
:root[data-theme="dark"] .code-section-files .comment { color: var(--text-light); opacity: 0.6; }