:root {
  --bs-primary: #FFD700;
  --bs-body-bg: #ffffff;
  --gold-shadow: rgba(255, 215, 0, 0.25);
  --text-dark: #18191c;
  --text-gray: #61666d;
}

body {
  background: var(--bs-body-bg);
  color: var(--text-dark);
  font-family: Inter, system-ui, Segoe UI, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* Typography Overrides */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  color: var(--text-dark);
}

.text-muted { color: var(--text-gray) !important; }

/* Flowing Gold Line */
.flowing-gold-line {
  height: 2px;
  width: 100%;
  background: linear-gradient(90deg, #FFD700, #ffeaa7, #FFD700);
  background-size: 200% 100%;
  animation: flowingGold 3s linear infinite;
}

@keyframes flowingGold {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

/* 首页水印蒙版 */
.watermark-overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: repeating-linear-gradient(
    45deg,
    transparent,
    transparent 15%,
    rgba(255, 255, 255, 0.15) 15%,
    rgba(255, 255, 255, 0.15) 16%
  );
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  overflow: hidden;
  z-index: 2; /* 确保在图片之上 */
}

.watermark-text {
  color: rgba(255, 255, 255, 0.85);
  font-size: 1.5rem; /* 字体调大 */
  font-weight: 900; /* 字体加粗 */
  text-transform: uppercase;
  letter-spacing: 3px;
  transform: rotate(-30deg);
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7); /* 增加阴影提升对比度 */
  white-space: nowrap;
  user-select: none;
}

/* Hero Section */
.hero {
  min-height: 160px;
  display: flex; align-items: center; justify-content: center;
  background:
    radial-gradient(800px 320px at 0% 0%, rgba(255, 215, 0, 0.15), transparent),
    radial-gradient(800px 320px at 100% 0%, rgba(255, 215, 0, 0.15), transparent);
  font-weight: 800; letter-spacing: .5px;
}

/* Card Styles - Bilibili Style */
.card {
  border: 1px solid rgba(0, 0, 0, .05);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
  background: #ffffff;
  border-radius: 12px;
  transition: transform 0.2s, box-shadow 0.2s;
}
.card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px var(--gold-shadow);
}

/* Caps/Badges */
.caps { display: flex; flex-wrap: wrap; gap: 8px; }
.cap {
  display: inline-flex; align-items: center; padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255, 215, 0, 0.15);
  color: #0b1b3f; font-size: 12px;
  border: 1px solid rgba(255, 215, 0, 0.3);
}

/* Inputs & Form */
.form-control:focus, .form-select:focus {
  border-color: #FFD700;
  box-shadow: 0 0 0 0.25rem rgba(255, 215, 0, 0.25);
}

.gold-divider {
  border: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #FFD700, transparent);
  margin: 1.5rem 0;
  opacity: 0.6;
}

/* Buttons */
.btn-primary {
  background: linear-gradient(135deg, #FFD700, #ffc800);
  border: none;
  color: #0b1b3f;
  font-weight: 600;
  box-shadow: 0 4px 10px rgba(255, 215, 0, 0.3);
  transition: all 0.3s ease;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #ffe033, #ffd033);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(255, 215, 0, 0.4);
  color: #0b1b3f;
}

/* Purple Button for Linkage */
.btn-purple {
  background: linear-gradient(135deg, #9C27B0, #7B1FA2);
  border: none;
  color: #ffffff;
  font-weight: 600;
  box-shadow: 0 4px 10px rgba(156, 39, 176, 0.3);
  transition: all 0.3s ease;
  min-width: 120px; /* Wider button */
}
.btn-purple:hover {
  background: linear-gradient(135deg, #AB47BC, #8E24AA);
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(156, 39, 176, 0.4);
  color: #ffffff;
}

.btn-outline-primary {
  color: #b39700; border-color: #FFD700;
}
.btn-outline-primary:hover {
  background-color: #FFD700; border-color: #FFD700; color: #0b1b3f;
}

/* Floating Action Button (FAB) */
.fab-container {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 12px;
  z-index: 1050;
  padding: 8px 16px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
  border: 1px solid rgba(255, 215, 0, 0.3);
}

/* Parchment Box for AI Results */
.parchment-box {
  background: #fffdf5;
  border: 1px solid #eaddcf;
  border-radius: 8px;
  padding: 1.5rem;
  position: relative;
  box-shadow: inset 0 0 20px rgba(255, 215, 0, 0.05);
}
.parchment-box::before {
  content: '';
  position: absolute;
  top: 4px; bottom: 4px; left: 4px; right: 4px;
  border: 1px solid rgba(255, 215, 0, 0.3);
  border-radius: 6px;
  pointer-events: none;
}

/* Truncate Text */
.text-truncate-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Typewriter Cursor */
.typewriter-cursor::after {
  content: '|';
  animation: blink 1s infinite;
  color: #FFD700;
  font-weight: bold;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* Animations */
.loading-halo {
  width: 40px; height: 40px;
  border: 3px solid rgba(255, 215, 0, 0.2);
  border-top-color: #FFD700;
  border-radius: 50%;
  animation: spin 1s infinite linear;
  margin: 20px auto;
}
@keyframes spin { 100% { transform: rotate(360deg); } }

.fade-in-text {
  animation: fadeIn 1.5s ease-out forwards;
  opacity: 0;
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 首页卡片悬浮提升效果 */
.hover-lift {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
}
.hover-lift:hover {
  transform: translateY(-8px);
  box-shadow: 0 12px 24px -6px var(--gold-shadow), 0 0 0 1px rgba(255, 215, 0, 0.2); /* 金色微弱边框阴影 */
}

/* 骨架屏流光动画 */
.skeleton {
  background: #f0f0f0;
  position: relative;
  overflow: hidden;
}
.skeleton::after {
  content: '';
  position: absolute;
  top: 0; left: 0; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.2), transparent); /* 金色流光 */
  transform: translateX(-100%);
  animation: shimmer 1.5s infinite;
}
@keyframes shimmer {
  100% { transform: translateX(100%); }
}

/* 详情页优化 */
.avatar-frame {
  object-fit: cover;
  border: 3px solid #fff;
  box-shadow: 0 0 0 2px #FFD700; /* 圆角金色边框 */
}

.detail-section {
  background-color: #fdfaf2; /* 羊皮纸色 */
  line-height: 1.8;
}

/* 点赞按钮动画 */
.btn-like-anim {
  transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.btn-like-anim:active {
  transform: scale(0.8);
}
.btn-like-anim.liked i {
  animation: heartPop 0.4s ease-out forwards;
}
@keyframes heartPop {
  0% { transform: scale(1); }
  50% { transform: scale(1.4); }
  100% { transform: scale(1); }
}

/* 评论列表美化 */
.comment-item {
  transition: background-color 0.2s;
}
.comment-item:hover {
  background-color: rgba(255, 255, 255, 0.5);
}
.comment-avatar {
  width: 32px; height: 32px;
  background-color: #eee;
  color: #999;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px;
}

/* Square Like Button (Optimized) */
.btn-like-square {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px; 
  border: 2px solid #FFD700; /* 黄色边框 */
  background-color: #fff; /* 白底 */
  color: #FFD700; /* 黄色图标 */
  padding: 0;
  transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.btn-like-square:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(255, 215, 0, 0.3);
}

.btn-like-square:active {
  transform: scale(0.9); /* 点击缩放 */
}

/* 激活状态 */
.btn-like-square.active {
  background-color: #FFD700; /* 黄底 */
  color: #fff; /* 白色图标 */
  box-shadow: 0 4px 12px var(--gold-shadow);
}

/* 内部图标样式 */
.btn-like-square i {
  font-size: 1.25rem; /* fs-5 approx 1.25rem */
  line-height: 1;
  display: flex;
}

/* Specific for Index Card Footer Positioning */
.card-footer-action {
  position: absolute;
  bottom: 16px;
  right: 16px;
  z-index: 2;
}

/* Navbar */
.navbar-nav .nav-link.active { color: #b39700 !important; font-weight: bold; position: relative; }
.navbar-nav .nav-link.active::after {
  content: ''; position: absolute; bottom: 0; left: 10%; width: 80%; height: 2px;
  background: #FFD700; border-radius: 2px;
}

/* 沉浸式星空编辑环境 (Immersive Starry Sky) */
.no-select {
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  cursor: default;
}

/* 通用星空背景类 (供 Login/Register/Modal 使用) */
.starry-sky-bg {
  background: linear-gradient(135deg, #05070a 0%, #111827 100%);
  position: relative;
  overflow: hidden;
}

.starry-sky-bg::before {
  content: " ";
  position: absolute;
  top: 0; left: 0;
  width: 1px; height: 1px;
  background: transparent;
  box-shadow: 257px 1743px #FFF, 1388px 572px #FFF, 1555px 1251px #FFF, 1212px 1308px #FFF, 257px 733px #FFF, 1238px 1041px #FFF, 920px 929px #FFF, 556px 345px #FFF, 791px 1738px #FFF, 1630px 1963px #FFF, 1948px 1424px #FFF, 1917px 38px #FFF, 1954px 570px #FFF, 264px 45px #FFF, 508px 1776px #FFF, 773px 635px #FFF, 116px 273px #FFF, 90px 980px #FFF, 1375px 869px #FFF, 844px 1626px #FFF, 633px 1156px #FFF, 1854px 130px #FFF, 1021px 1220px #FFF, 1775px 529px #FFF, 264px 246px #FFF, 1229px 1702px #FFF, 1864px 993px #FFF, 773px 365px #FFF, 1042px 1472px #FFF, 1018px 478px #FFF, 327px 1359px #FFF, 1577px 1486px #FFF, 936px 1883px #FFF, 1621px 1793px #FFF, 707px 1693px #FFF, 1128px 230px #FFF, 1520px 699px #FFF, 317px 747px #FFF, 739px 380px #FFF, 423px 729px #FFF, 1298px 1930px #FFF, 1045px 142px #FFF, 1072px 1938px #FFF, 604px 809px #FFF, 1818px 931px #FFF, 1464px 407px #FFF, 1514px 475px #FFF, 1014px 935px #FFF, 604px 1435px #FFF, 231px 299px #FFF, 996px 902px #FFF, 963px 1290px #FFF, 1419px 1820px #FFF, 1712px 1732px #FFF, 1882px 783px #FFF, 809px 1890px #FFF, 1565px 977px #FFF, 1679px 1159px #FFF, 1846px 1962px #FFF, 1147px 1230px #FFF, 129px 825px #FFF, 953px 716px #FFF, 1454px 311px #FFF, 666px 1820px #FFF, 1550px 406px #FFF, 90px 1303px #FFF, 1003px 1296px #FFF, 1939px 1588px #FFF, 244px 123px #FFF, 417px 841px #FFF, 1768px 504px #FFF, 1870px 1397px #FFF, 168px 545px #FFF, 1401px 1994px #FFF, 1914px 669px #FFF, 11px 1462px #FFF, 1761px 1011px #FFF, 771px 361px #FFF, 469px 434px #FFF, 1088px 929px #FFF, 530px 869px #FFF, 227px 1466px #FFF, 381px 1744px #FFF, 964px 414px #FFF, 282px 995px #FFF, 373px 1719px #FFF, 1412px 1641px #FFF, 1641px 175px #FFF, 1961px 1849px #FFF, 1884px 856px #FFF, 1943px 1705px #FFF, 87px 307px #FFF, 680px 937px #FFF, 1264px 1443px #FFF, 520px 1911px #FFF, 1017px 984px #FFF, 275px 711px #FFF, 781px 1134px #FFF, 975px 648px #FFF, 25px 1887px #FFF, 1539px 118px #FFF, 315px 619px #FFF, 1125px 1731px #FFF, 1325px 190px #FFF, 684px 446px #FFF, 1550px 765px #FFF;
  animation: star-float 100s linear infinite;
  opacity: 0.6;
  pointer-events: none;
  z-index: 0;
}

.starry-sky-bg::after {
  content: " ";
  position: absolute;
  top: 0; left: 0;
  width: 2px; height: 2px;
  background: transparent;
  box-shadow: 1833px 1820px #FFF, 1291px 1525px #FFF, 946px 801px #FFF, 1427px 602px #FFF, 1857px 1256px #FFF, 1494px 102px #FFF, 965px 341px #FFF, 1436px 33px #FFF, 1811px 1965px #FFF, 1330px 1196px #FFF, 462px 884px #FFF, 1976px 1220px #FFF, 1458px 606px #FFF, 1624px 159px #FFF, 1386px 1379px #FFF, 438px 1240px #FFF, 418px 1504px #FFF, 1775px 613px #FFF, 1727px 205px #FFF, 1209px 1341px #FFF, 785px 906px #FFF, 180px 1087px #FFF, 1400px 1454px #FFF, 1808px 1224px #FFF, 1944px 1635px #FFF, 838px 857px #FFF, 736px 1781px #FFF, 311px 1070px #FFF, 1923px 1662px #FFF, 77px 1924px #FFF, 1466px 1879px #FFF, 1830px 842px #FFF, 750px 459px #FFF, 1426px 167px #FFF, 1996px 885px #FFF, 690px 95px #FFF, 1698px 1377px #FFF, 1432px 836px #FFF, 525px 1860px #FFF, 11px 270px #FFF, 393px 691px #FFF, 1942px 484px #FFF, 223px 1893px #FFF, 1559px 765px #FFF, 10px 194px #FFF, 265px 773px #FFF, 133px 1275px #FFF, 1270px 1039px #FFF, 1649px 684px #FFF, 25px 1615px #FFF;
  animation: star-float 150s linear infinite;
  opacity: 0.8;
  pointer-events: none;
  z-index: 0;
}

/* 1. 模态框背景与基础样式 */
#focusModal .modal-content {
  /* 继承通用星空背景 */
  background: linear-gradient(135deg, #05070a 0%, #111827 100%);
  border: none;
  box-shadow: none;
  position: relative;
  overflow: hidden; 
}

/* 2. 星空粒子效果 (Star Particles) */
/* 使用 box-shadow 生成随机分布的星星 */

/* starLayer 1: 小星星 */
#focusModal .modal-content::before {
  content: " ";
  position: absolute;
  top: 0; left: 0;
  width: 1px; height: 1px;
  background: transparent;
  /* 随机生成的 box-shadow 坐标 */
  box-shadow: 257px 1743px #FFF, 1388px 572px #FFF, 1555px 1251px #FFF, 1212px 1308px #FFF, 257px 733px #FFF, 1238px 1041px #FFF, 920px 929px #FFF, 556px 345px #FFF, 791px 1738px #FFF, 1630px 1963px #FFF, 1948px 1424px #FFF, 1917px 38px #FFF, 1954px 570px #FFF, 264px 45px #FFF, 508px 1776px #FFF, 773px 635px #FFF, 116px 273px #FFF, 90px 980px #FFF, 1375px 869px #FFF, 844px 1626px #FFF, 633px 1156px #FFF, 1854px 130px #FFF, 1021px 1220px #FFF, 1775px 529px #FFF, 264px 246px #FFF, 1229px 1702px #FFF, 1864px 993px #FFF, 773px 365px #FFF, 1042px 1472px #FFF, 1018px 478px #FFF, 327px 1359px #FFF, 1577px 1486px #FFF, 936px 1883px #FFF, 1621px 1793px #FFF, 707px 1693px #FFF, 1128px 230px #FFF, 1520px 699px #FFF, 317px 747px #FFF, 739px 380px #FFF, 423px 729px #FFF, 1298px 1930px #FFF, 1045px 142px #FFF, 1072px 1938px #FFF, 604px 809px #FFF, 1818px 931px #FFF, 1464px 407px #FFF, 1514px 475px #FFF, 1014px 935px #FFF, 604px 1435px #FFF, 231px 299px #FFF, 996px 902px #FFF, 963px 1290px #FFF, 1419px 1820px #FFF, 1712px 1732px #FFF, 1882px 783px #FFF, 809px 1890px #FFF, 1565px 977px #FFF, 1679px 1159px #FFF, 1846px 1962px #FFF, 1147px 1230px #FFF, 129px 825px #FFF, 953px 716px #FFF, 1454px 311px #FFF, 666px 1820px #FFF, 1550px 406px #FFF, 90px 1303px #FFF, 1003px 1296px #FFF, 1939px 1588px #FFF, 244px 123px #FFF, 417px 841px #FFF, 1768px 504px #FFF, 1870px 1397px #FFF, 168px 545px #FFF, 1401px 1994px #FFF, 1914px 669px #FFF, 11px 1462px #FFF, 1761px 1011px #FFF, 771px 361px #FFF, 469px 434px #FFF, 1088px 929px #FFF, 530px 869px #FFF, 227px 1466px #FFF, 381px 1744px #FFF, 964px 414px #FFF, 282px 995px #FFF, 373px 1719px #FFF, 1412px 1641px #FFF, 1641px 175px #FFF, 1961px 1849px #FFF, 1884px 856px #FFF, 1943px 1705px #FFF, 87px 307px #FFF, 680px 937px #FFF, 1264px 1443px #FFF, 520px 1911px #FFF, 1017px 984px #FFF, 275px 711px #FFF, 781px 1134px #FFF, 975px 648px #FFF, 25px 1887px #FFF, 1539px 118px #FFF, 315px 619px #FFF, 1125px 1731px #FFF, 1325px 190px #FFF, 684px 446px #FFF, 1591px 1058px #FFF, 584px 1927px #FFF, 295px 1335px #FFF, 844px 847px #FFF, 390px 1083px #FFF, 717px 1606px #FFF, 1712px 811px #FFF, 550px 771px #FFF, 1611px 1513px #FFF, 499px 1591px #FFF, 806px 260px #FFF, 413px 1706px #FFF, 1529px 1508px #FFF, 737px 251px #FFF, 1835px 1603px #FFF, 1912px 537px #FFF, 35px 1672px #FFF, 1450px 699px #FFF, 452px 1588px #FFF, 9px 1106px #FFF, 369px 1570px #FFF, 1525px 561px #FFF, 1378px 12px #FFF, 1603px 997px #FFF, 649px 1954px #FFF, 299px 1961px #FFF, 1841px 1274px #FFF, 322px 1888px #FFF, 190px 1468px #FFF, 860px 546px #FFF, 307px 915px #FFF, 53px 1196px #FFF, 901px 258px #FFF, 727px 244px #FFF, 820px 1801px #FFF, 1463px 545px #FFF, 1318px 1233px #FFF, 1911px 1072px #FFF, 1116px 1423px #FFF, 1886px 1130px #FFF, 295px 1747px #FFF, 777px 185px #FFF, 1649px 19px #FFF, 546px 1407px #FFF, 1056px 1514px #FFF;
  
  /* 启动浮动动画 */
  animation: star-float 100s linear infinite;
  opacity: 0.6;
}

/* starLayer 2: 中等星星 */
#focusModal .modal-content::after {
  content: " ";
  position: absolute;
  top: 0; left: 0;
  width: 2px; height: 2px;
  background: transparent;
  box-shadow: 1833px 1820px #FFF, 1291px 1525px #FFF, 946px 801px #FFF, 1427px 602px #FFF, 1857px 1256px #FFF, 1494px 102px #FFF, 965px 341px #FFF, 1436px 33px #FFF, 1811px 1965px #FFF, 1330px 1196px #FFF, 462px 884px #FFF, 1976px 1220px #FFF, 1458px 606px #FFF, 1624px 159px #FFF, 1386px 1379px #FFF, 438px 1240px #FFF, 418px 1504px #FFF, 1775px 613px #FFF, 1727px 205px #FFF, 1209px 1341px #FFF, 785px 906px #FFF, 180px 1087px #FFF, 1400px 1454px #FFF, 1808px 1224px #FFF, 1944px 1635px #FFF, 838px 857px #FFF, 736px 1781px #FFF, 311px 1070px #FFF, 1923px 1662px #FFF, 77px 1924px #FFF, 1466px 1879px #FFF, 1830px 842px #FFF, 750px 459px #FFF, 1426px 167px #FFF, 1996px 885px #FFF, 690px 95px #FFF, 1698px 1377px #FFF, 1432px 836px #FFF, 525px 1860px #FFF, 11px 270px #FFF, 393px 691px #FFF, 1942px 484px #FFF, 223px 1893px #FFF, 1559px 765px #FFF, 10px 194px #FFF, 265px 773px #FFF, 133px 1275px #FFF, 1270px 1039px #FFF, 1649px 684px #FFF, 25px 1615px #FFF;
  
  animation: star-float 150s linear infinite;
  opacity: 0.8;
}

/* 3. 动画定义 (Animation) */
@keyframes star-float {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-2000px); /* 向上浮动一屏高度 */
  }
}

/* 4. 编辑区域优化 (Edit Area) */
#focusBioInput {
  color: #e2e8f0; /* 柔和月白色 */
  caret-color: #FFD700; /* 金色光标 */
  font-size: 1.1rem !important;
  line-height: 1.8;
  text-shadow: 0 0 2px rgba(0,0,0,0.5);
}

/* 占位符颜色 */
#focusBioInput::placeholder {
  color: rgba(226, 232, 240, 0.4);
}

/* 移除 focus 时的默认边框 */
#focusBioInput:focus {
  box-shadow: none;
  background: transparent;
}

/* 5. 组件适配 (UI Components) */
/* 标题 */
#focusModal .modal-title {
  color: #ffffff;
  text-shadow: 0 0 10px rgba(255, 215, 0, 0.5); /* 金色发光阴影 */
}

/* 关闭按钮反色 */
#focusModal .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}

/* 完成按钮 */
#focusSaveBtn {
  background: rgba(184, 134, 11, 0.3) !important;
  border: 1px solid #b8860b !important;
  color: #FFD700 !important;
  backdrop-filter: blur(4px);
  transition: all 0.3s ease;
}

#focusSaveBtn:hover {
  background: rgba(184, 134, 11, 0.6) !important;
  box-shadow: 0 0 15px rgba(184, 134, 11, 0.4);
}

/* 致创作者的一封信 - 视觉样式 */ 
.creator-card { 
    background: linear-gradient(135deg, #ffffff 0%, #fdfbf7 100%); 
    border: 1px solid rgba(184, 134, 11, 0.2); 
    border-radius: 12px; 
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); 
    position: relative; 
    line-height: 1.8; 
} 

.letter-title { 
    font-family: "Noto Serif SC", serif; 
    color: #8a6d3b; 
    font-weight: 700; 
    letter-spacing: 2px; 
} 

.seal-icon { 
    font-size: 2rem; 
    color: #b8860b; 
    text-shadow: 0 0 10px rgba(184, 134, 11, 0.3); 
} 

.value-item { 
    margin: 2rem 0; 
    padding-left: 1.5rem; 
    border-left: 2px solid #e0c38c; 
} 

.value-item h5 { 
    color: #b8860b; 
    font-size: 1.1rem; 
    font-weight: 600; 
} 

.letter-content p { 
    color: #5a5a5a; 
    font-size: 1rem; 
} 

/* 移动端适配 */ 
@media (max-width: 768px) { 
    .creator-card { 
        padding: 2rem 1.5rem !important; 
    } 
}
