:root { --gold: #d6aa5c; --gold-deep: #8c5f25; --ink: #f7ecd8; --muted: #c8b99e; }
body { color: var(--ink); background: #090704; }
.app-shell { padding: max(18px,env(safe-area-inset-top)) 24px max(38px,env(safe-area-inset-bottom)); background: radial-gradient(circle at 50% 0,rgba(117,78,29,.34),transparent 33%),linear-gradient(180deg,rgba(15,11,8,.78),#0c0906 68%),url("../images/bg-main.webp") top center/100% auto no-repeat; box-shadow: 0 0 58px #000; }
.site-header { padding-top: 5px; text-align: center; }
.top-line { display: flex; align-items: center; justify-content: space-between; color: #caa25f; font: 11px/1 Arial,sans-serif; letter-spacing: .22em; }
.favorite-button { padding: 8px 12px; border: 1px solid rgba(214,170,92,.48); border-radius: 6px; color: #f2d69d; background: rgba(20,15,10,.70); letter-spacing: .05em; }
.brand-logo { width: min(68%,480px); margin: 8px auto 1px; filter: drop-shadow(0 8px 18px rgba(0,0,0,.55)); }
.header-rule { margin: 6px 0 14px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 14px; color: #e5c47f; font-size: 14px; letter-spacing: .25em; }
.header-rule i { height: 1px; background: linear-gradient(90deg,transparent,#a98040); }
.header-rule i:last-child { transform: rotate(180deg); }
main { display: grid; gap: 14px; }
.notice-bar { min-height: 68px; padding: 12px 18px; border: 1px solid rgba(214,170,92,.38); border-radius: 8px; background: linear-gradient(100deg,rgba(49,36,22,.94),rgba(22,16,11,.92)); box-shadow: inset 0 1px rgba(255,226,165,.12),0 10px 24px rgba(0,0,0,.28); }
.notice-bar p { display: grid; gap: 5px; color: #c9bba4; font-size: 13px; line-height: 1.4; }
.notice-bar p strong { color: #edcc89; font-size: 12px; letter-spacing: .12em; }
.notice-icon,.notice-arrow { color: #d6aa5c; }
.advertisement-list { gap: 12px; counter-reset: ad; }
.ad-card { min-height: 116px; padding: 16px 18px; grid-template-columns: 82px minmax(0,1fr) 168px; gap: 17px; border: 1px solid rgba(214,170,92,.32); border-radius: 10px; background: linear-gradient(110deg,rgba(35,27,19,.96),rgba(16,12,8,.96)); box-shadow: inset 3px 0 #b28239,0 12px 26px rgba(0,0,0,.32); }
.ad-card::after { content:""; position:absolute; right:-40px; top:-50px; width:150px; height:150px; border:1px solid rgba(214,170,92,.08); transform:rotate(45deg); }
.ad-card.is-featured { min-height: 134px; border-color: rgba(225,184,104,.70); background: linear-gradient(110deg,rgba(58,42,24,.98),rgba(20,14,9,.98)); }
.ad-icon { width: 68px; height: 68px; margin: auto; border: 1px solid #a97934; border-radius: 50%; background: linear-gradient(145deg,#f5d592,#9b682c 52%,#332012); box-shadow: inset 0 0 0 5px rgba(10,7,4,.38),0 8px 20px rgba(0,0,0,.34); }
.ad-icon img { filter: brightness(1.22) sepia(.25); }
.ad-copy h2 { color: #fff3dd; font-family: "STSong",serif; font-size: 25px; letter-spacing: .05em; }
.ad-copy p { color: #bfb09a; font-size: 14px; }
.enter-button { padding: 0 18px; border: 1px solid #c99a4c; color: #1c1208; font-weight: 800; font-size: 17px; background: linear-gradient(180deg,#f7dda5,#b88337); box-shadow: inset 0 1px #fff2ce,0 6px 15px rgba(0,0,0,.28); }
.ad-number { right: 200px; top: 14px; color: rgba(214,170,92,.18); font: 700 18px/1 Georgia,serif; letter-spacing: .1em; }
.featured-badge { top: 0; right: 0; padding: 6px 15px; color: #1b1107; font-size: 12px; font-weight: 800; letter-spacing: .12em; background: linear-gradient(90deg,#ad7d34,#f0cf86); }
.trust-row { margin-top: 2px; border: 1px solid rgba(214,170,92,.25); background: rgba(18,13,9,.82); }
.trust-item { min-height: 72px; gap: 10px; border-right: 1px solid rgba(214,170,92,.20); }
.trust-item:last-child { border-right: 0; }
.trust-item b { color: #d6aa5c; font: 16px/1 Georgia,serif; }
.trust-item p { margin: 0; }
.trust-item strong { color: #f1dcc0; font-size: 13px; }
.trust-item span { margin-top: 4px; color: #988973; font-size: 10px; }
.bottom-card { padding: 18px; gap: 22px; border: 1px solid rgba(214,170,92,.25); border-radius: 10px; background: rgba(18,13,9,.90); box-shadow: 0 12px 26px rgba(0,0,0,.28); }
.bottom-card h2 { color: #edcc89; letter-spacing: .08em; }
.browser-group { border-right: 1px solid rgba(214,170,92,.20); }
.browser-list img { filter: drop-shadow(0 4px 8px rgba(0,0,0,.45)); }
.browser-list p { color: #f1dcc0; }
.browser-list small { color: #988973; }
.tips-copy h2 span { border: 1px solid #d6aa5c; color: #d6aa5c; }
.tips-copy ol { color: #bfb09a; }
.page-footer { padding-top: 28px; color: #9a7845; }
.page-footer p { font-size: 11px; letter-spacing: .04em; }
.page-footer p span { background: linear-gradient(90deg,transparent,#9a7845); }
.page-footer small { display:block; margin-top:6px; color:#d1aa63; font:9px/1.4 Arial,sans-serif; letter-spacing:.22em; }
.page-footer em { margin-top: 16px; color: #b88b47; font-family: "STKaiti","KaiTi",serif; font-size: 16px; }
@media (max-width:520px) {
  .app-shell { padding-inline: 12px; }
  .top-line span { font-size: 8px; }
  .favorite-button { padding: 7px 9px; font-size: 12px; }
  .brand-logo { width: 66%; margin-top: 14px; }
  .header-rule { gap: 8px; font-size: 12px; }
  .notice-bar { padding: 10px 12px; }
  .ad-card,.ad-card.is-featured { min-height: 104px; padding: 13px 12px; grid-template-columns: 58px minmax(0,1fr) 108px; gap: 10px; }
  .ad-icon { width: 54px; height: 54px; }
  .ad-copy h2 { font-size: 18px; }
  .enter-button { padding: 0 9px; }
  .ad-number { right: 126px; font-size: 14px; }
  .trust-item { min-height: 64px; gap: 5px; }
  .trust-item strong { font-size: 11px; }
  .trust-item span { font-size: 9px; }
  .bottom-card { gap: 18px; }
  .browser-group { padding-bottom: 18px; border-right: 0; border-bottom: 1px solid rgba(214,170,92,.18); }
  .page-footer p { font-size: 9px; gap: 4px; }
  .page-footer p span { width: 14px; }
}