{} *{} {} #IE-warning { display: none; position: fixed; width: 100%; height: 100%; z-index: 9999; background: white; } .IE-warning-message { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; } :root { --bg: #070a12; --panel: #0b1020; --panel2: #111827; --gold: #d4af37; --gold2: #ffd700; --ink: #f5f5dc; --muted: #aeb6d6; --line: rgba(212, 175, 55, 0.45); --line2: rgba(148, 163, 184, 0.22); --good: #32cd32; --goodLine: rgba(50, 205, 50, 0.35); --shadow: 0 20px 50px rgba(0, 0, 0, 0.6); --radius: 24px; } * { box-sizing: border-box; margin: 0; padding: 0; } body { background: radial-gradient(1200px 600px at 20% -20%, rgba(212, 175, 55, 0.15), transparent 70%), radial-gradient(1000px 500px at 90% 20%, rgba(124, 58, 237, 0.12), transparent 65%), linear-gradient(180deg, var(--bg), #05060b 80%); color: var(--ink); font-family: "Georgia", serif; line-height: 1.7; -webkit-font-smoothing: antialiased; padding: 30px 20px; } .wrap { max-width: 900px; margin: 0 auto; } .card { background: linear-gradient(180deg, rgba(11, 16, 32, 0.95), rgba(17, 24, 39, 0.95)); border: 3px solid var(--line); border-radius: var(--radius); padding: 80px 60px; text-align: center; box-shadow: var(--shadow); position: relative; overflow: hidden; } .icon { font-size: 80px; margin-bottom: 30px; text-shadow: 0 8px 20px rgba(0, 0, 0, 0.5); } .title { font-family: "Crimson Text", Georgia, serif; font-size: 52px; color: var(--gold2); line-height: 1.2; font-weight: 700; margin-bottom: 20px; text-shadow: 0 6px 16px rgba(0, 0, 0, 0.7); } .subtitle { font-size: 24px; color: var(--ink); max-width: 700px; margin: 0 auto 40px; line-height: 1.6; } .verse-box { background: rgba(212, 175, 55, 0.08); border: 2px solid rgba(212, 175, 55, 0.4); border-radius: 20px; padding: 40px 30px; max-width: 700px; margin: 50px auto; box-shadow: 0 10px 30px rgba(212, 175, 55, 0.15); } .verse-text { font-family: "Crimson Text", serif; font-size: 28px; color: var(--gold2); font-weight: 600; line-height: 1.5; margin-bottom: 16px; } .verse-ref { font-size: 20px; color: var(--ink); opacity: 0.9; } .notice { background: linear-gradient(135deg, rgba(139, 0, 0, 0.85), rgba(220, 20, 60, 0.78)); border: 2px solid rgba(255, 215, 0, 0.4); border-radius: 20px; padding: 40px 30px; max-width: 700px; margin: 50px auto; box-shadow: 0 15px 40px rgba(220, 20, 60, 0.3); } .notice-title { font-size: 28px; color: var(--gold2); margin-bottom: 16px; letter-spacing: 1px; } .notice-text { font-size: 20px; color: #ffffff; line-height: 1.6; } .steps { background: rgba(50, 205, 50, 0.08); border: 2px solid rgba(50, 205, 50, 0.4); border-radius: 20px; padding: 40px 50px; max-width: 700px; margin: 50px auto; text-align: left; } .steps-title { font-size: 24px; color: var(--good); margin-bottom: 20px; text-align: center; } .steps ol { padding-left: 30px; font-size: 19px; color: var(--ink); } .steps li { margin: 16px 0; line-height: 1.6; } /* ===== Quick Start ===== */ .quick-start { max-width: 760px; margin: 55px auto 10px; text-align: left; border-radius: 22px; border: 2px solid var(--line2); background: linear-gradient(180deg, rgba(10, 14, 28, 0.65), rgba(17, 24, 39, 0.45)); padding: 38px 34px; box-shadow: 0 14px 45px rgba(0, 0, 0, 0.35); } .qs-title { font-family: "Crimson Text", Georgia, serif; font-size: 28px; color: var(--gold2); text-align: center; margin-bottom: 22px; letter-spacing: 0.2px; text-shadow: 0 6px 16px rgba(0, 0, 0, 0.45); } .qs-grid { display: grid; grid-template-columns: 1fr; gap: 14px; } .qs-step { border-radius: 18px; border: 1px solid rgba(212, 175, 55, 0.22); background: rgba(8, 10, 18, 0.35); padding: 18px 18px; } .qs-step-title { display: flex; align-items: center; gap: 12px; font-size: 20px; color: var(--ink); margin-bottom: 8px; line-height: 1.35; } .step-number { width: 34px; height: 34px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; color: #0b1020; background: linear-gradient(180deg, var(--gold2), var(--gold)); box-shadow: 0 10px 22px rgba(212, 175, 55, 0.22); flex: 0 0 auto; } .qs-step-text { font-size: 18px; color: rgba(245, 245, 220, 0.92); line-height: 1.65; } /* ===== Section header ===== */ .section-header { margin: 70px auto 18px; max-width: 760px; font-family: "Crimson Text", Georgia, serif; font-size: 30px; color: var(--gold2); text-shadow: 0 6px 18px rgba(0, 0, 0, 0.5); } /* ===== Upcoming Deliveries ===== */ .downloads { max-width: 760px; margin: 0 auto; display: grid; gap: 16px; } .download-module { text-align: left; border-radius: 20px; border: 2px solid rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.07); padding: 22px 22px; box-shadow: 0 12px 34px rgba(212, 175, 55, 0.12); } .dm-title { font-size: 20px; color: var(--gold2); margin-bottom: 10px; line-height: 1.35; } .dm-text { font-size: 18px; color: rgba(245, 245, 220, 0.92); line-height: 1.65; } .dm-pill { display: inline-block; margin-top: 12px; padding: 10px 12px; border-radius: 999px; border: 1px solid var(--goodLine); background: rgba(50, 205, 50, 0.1); color: var(--good); font-weight: 700; font-size: 15px; letter-spacing: 0.2px; } /* ===== Important Links ===== */ .important-links { max-width: 760px; margin: 55px auto 0; text-align: left; border-radius: 22px; border: 2px solid var(--line2); background: linear-gradient(180deg, rgba(11, 16, 32, 0.6), rgba(17, 24, 39, 0.35)); padding: 32px 28px; } .il-title { font-family: "Crimson Text", Georgia, serif; font-size: 26px; color: var(--gold2); margin-bottom: 16px; text-align: center; } .link-item { border-radius: 18px; border: 1px solid rgba(148, 163, 184, 0.22); background: rgba(8, 10, 18, 0.28); padding: 18px 18px; } .li-title { font-size: 20px; color: var(--ink); margin-bottom: 6px; } .li-text { font-size: 17px; color: rgba(245, 245, 220, 0.86); } .link-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; } .pill-link { display: inline-flex; align-items: center; justify-content: center; padding: 10px 14px; border-radius: 999px; border: 1px solid rgba(212, 175, 55, 0.28); background: rgba(212, 175, 55, 0.08); color: var(--gold2); text-decoration: none; font-weight: 700; font-size: 15px; transition: transform 160ms ease, background 160ms ease, border-color 160ms ease; } .pill-link:hover { transform: translateY(-1px); background: rgba(212, 175, 55, 0.14); border-color: rgba(212, 175, 55, 0.42); } .pill-link:focus { outline: 2px solid rgba(50, 205, 50, 0.7); outline-offset: 3px; } /* ===== Support + Footer ===== */ .support { margin-top: 55px; padding-top: 40px; border-top: 2px solid var(--line); } .support-title { font-size: 24px; color: var(--gold2); margin-bottom: 16px; } .support-text { font-size: 20px; color: var(--ink); line-height: 1.6; } .support a { color: var(--good); font-weight: 700; text-decoration: underline; } .footer { margin-top: 60px; padding-top: 40px; border-top: 2px solid var(--line); font-family: "Crimson Text", serif; } .footer-line { font-size: 24px; color: var(--gold2); margin-bottom: 12px; } .footer-mini { font-size: 15px; color: var(--muted); } @media (max-width: 768px) { .card { padding: 56px 26px; } .title { font-size: 40px; } .subtitle { font-size: 20px; } .icon { font-size: 60px; } .verse-box, .notice, .steps { padding: 28px 20px; } .verse-text { font-size: 24px; } .notice-title { font-size: 24px; } .steps-title { font-size: 22px; } .quick-start, .important-links { padding: 26px 18px; } .section-header { font-size: 26px; margin-top: 58px; } }