/** * GNSS-X site theme — geoscience base + 空天地海 domain accents. * Set on . */ @import url("./words.css"); :root, [data-domain="land"] { --bg: #ebe6dc; --bg-warm: #f7f3eb; --surface: #fffdf9; --surface-alt: #f5f1ea; --text: #3a3630; --muted: #6d665c; --line: #ddd5c8; --brand: #3f5c46; --brand-dark: #2f4635; --brand-soft: #e8f0e4; --accent: #9a6530; --accent-soft: #f3e8d8; --chip-border: #c5d4bc; --chip-text: #3f5c46; --hero-from: #2a3828; --hero-mid: #3d5240; --hero-to: #5c4a3a; --hero-glow-a: rgba(201, 166, 107, 0.22); --hero-glow-b: rgba(120, 155, 110, 0.18); --radius: 14px; --shadow: 0 10px 40px rgba(58, 54, 48, 0.09); --domain-label: "地"; } [data-domain="sky"] { --bg: #e4e8ec; --bg-warm: #f3f6f8; --surface: #fcfdfe; --surface-alt: #eef2f5; --text: #2f3840; --muted: #5f6b75; --line: #d2dae2; --brand: #4a6270; --brand-dark: #364a55; --brand-soft: #e4edf2; --accent: #6d7d5e; --accent-soft: #e8efe4; --chip-border: #b8c9d4; --chip-text: #3d5563; --hero-from: #2e3d45; --hero-mid: #4a6270; --hero-to: #5a6b5a; --hero-glow-a: rgba(180, 200, 220, 0.25); --hero-glow-b: rgba(140, 170, 150, 0.15); --domain-label: "天"; } [data-domain="sea"] { --bg: #dfe9e6; --bg-warm: #f0f7f5; --surface: #fbfefd; --surface-alt: #e8f2ef; --text: #2a3835; --muted: #5a6d68; --line: #c8dbd6; --brand: #2f5f58; --brand-dark: #234840; --brand-soft: #dff0ec; --accent: #3d8a7a; --accent-soft: #d9efe9; --chip-border: #a8ccc4; --chip-text: #2f5f58; --hero-from: #1e3532; --hero-mid: #2f5f58; --hero-to: #3a5a52; --hero-glow-a: rgba(100, 180, 160, 0.2); --hero-glow-b: rgba(80, 140, 130, 0.15); --domain-label: "海"; } [data-domain="space"] { --bg: #e6e2ea; --bg-warm: #f4f2f6; --surface: #fdfcfe; --surface-alt: #edeaf2; --text: #342f3a; --muted: #655f6e; --line: #d5cede; --brand: #544a63; --brand-dark: #3d3548; --brand-soft: #ebe6f0; --accent: #9a7b4f; --accent-soft: #f0e8dc; --chip-border: #c4b8d4; --chip-text: #4a4058; --hero-from: #2a2430; --hero-mid: #3d3548; --hero-to: #4a3f52; --hero-glow-a: rgba(180, 160, 200, 0.22); --hero-glow-b: rgba(154, 123, 79, 0.12); --domain-label: "空"; } * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif; line-height: 1.6; color: var(--text); background: linear-gradient(180deg, var(--bg-warm) 0%, var(--bg) 100%); padding: 20px; min-height: 100vh; } .site-wrap, .container { max-width: 1180px; margin: 0 auto; } .site-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 4px 20px rgba(58, 54, 48, 0.05); padding: 28px 32px; } .back-link { display: inline-block; margin-bottom: 16px; color: var(--muted); text-decoration: none; font-size: 0.88em; padding: 8px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; transition: background 0.15s, color 0.15s; } .back-link:hover { background: var(--brand-soft); color: var(--brand); } .domain-badge { display: inline-block; font-size: 0.72rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; background: var(--brand-soft); color: var(--brand); margin-bottom: 8px; } .page-banner { margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--line); } .page-banner h1 { font-size: 1.75rem; font-weight: 600; color: var(--text); margin-bottom: 6px; } .page-banner p { color: var(--muted); font-size: 0.92rem; } .hero { background: linear-gradient(135deg, var(--hero-from) 0%, var(--hero-mid) 48%, var(--hero-to) 100%); color: #f7f3eb; border-radius: calc(var(--radius) + 4px); padding: 28px 28px 24px; box-shadow: var(--shadow); margin-bottom: 24px; position: relative; overflow: hidden; } .hero::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 88% 12%, var(--hero-glow-a), transparent 42%), radial-gradient(circle at 12% 88%, var(--hero-glow-b), transparent 38%); pointer-events: none; } .hero-inner { position: relative; z-index: 1; } .section { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 4px 20px rgba(58, 54, 48, 0.05); padding: 24px; margin-bottom: 20px; } .section-title { font-size: 1.25rem; font-weight: 600; color: var(--text); margin-bottom: 6px; } .section-desc { color: var(--muted); font-size: 0.9rem; margin-bottom: 18px; } .info-box { background: var(--surface-alt); border: 1px solid var(--line); border-left: 4px solid var(--brand); padding: 14px 16px; border-radius: 10px; margin-bottom: 22px; color: var(--muted); font-size: 0.88rem; line-height: 1.7; } .info-box strong { color: var(--text); } .info-box a { color: var(--brand); } .info-box code { padding: 1px 6px; border-radius: 4px; background: var(--surface); font-size: 0.85em; } .data-table { width: 100%; border-collapse: collapse; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; } .data-table thead { background: linear-gradient(90deg, var(--surface-alt), var(--surface)); } .data-table th { padding: 12px 16px; text-align: left; font-weight: 600; font-size: 0.84rem; color: var(--muted); border-bottom: 1px solid var(--line); } .data-table td { padding: 10px 16px; border-bottom: 1px solid var(--line); font-size: 0.9rem; } .data-table tbody tr:hover { background: var(--brand-soft); } .data-table a { color: var(--brand); text-decoration: none; } .data-table a:hover { text-decoration: underline; } .nav-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; } .nav-card { border: 1px solid var(--line); border-radius: 12px; padding: 18px; background: linear-gradient(180deg, var(--surface) 0%, var(--surface-alt) 100%); transition: box-shadow 0.15s, transform 0.15s; } .nav-card:hover { box-shadow: 0 8px 24px rgba(63, 92, 70, 0.12); transform: translateY(-2px); } .nav-card h3 { font-size: 1rem; color: var(--text); margin-bottom: 6px; } .nav-card p { font-size: 0.84rem; color: var(--muted); margin-bottom: 14px; min-height: 2.6em; } .nav-card a { display: inline-flex; padding: 8px 14px; border-radius: 999px; background: var(--brand-soft); color: var(--brand); text-decoration: none; font-size: 0.84rem; font-weight: 600; } .nav-card a:hover { filter: brightness(0.96); } .link-chip { display: inline-flex; align-items: center; padding: 7px 12px; border-radius: 999px; background: var(--surface); border: 1px solid var(--chip-border); color: var(--chip-text); text-decoration: none; font-size: 0.82rem; transition: all 0.15s; } .link-chip:hover { background: var(--brand-soft); transform: translateY(-1px); } .link-chip.featured { background: linear-gradient(135deg, var(--accent-soft), var(--brand-soft)); border-color: var(--accent); color: var(--accent); font-weight: 600; } .status-pill { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font-size: 0.78rem; background: var(--brand-soft); border: 1px solid var(--chip-border); color: var(--brand); } .status-pill::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--brand); } .status-pill.error { background: #fff7ed; border-color: #fed7aa; color: #b54708; } .status-pill.error::before { background: #f97316; } #clock, .clock-pill { font-weight: 600; color: var(--text); padding: 8px 14px; background: var(--surface-alt); border: 1px solid var(--line); border-radius: 10px; font-size: 0.85rem; } .hero #clock, .hero .clock-pill { color: #e8e2d6; background: rgba(255, 251, 245, 0.12); border-color: rgba(230, 220, 200, 0.28); } .site-footer, .footer { text-align: center; color: var(--muted); font-size: 0.84rem; padding: 28px 8px 12px; margin-top: 32px; border-top: 1px solid var(--line); } .site-footer p + p, .footer p + p { margin-top: 6px; } .site-footer a, .footer a { color: var(--muted); text-decoration: none; } .site-footer a:hover, .footer a:hover { color: var(--brand); text-decoration: underline; } .beian-icon { vertical-align: middle; margin-right: 2px; } @media (max-width: 720px) { body { padding: 12px; } .site-panel { padding: 20px 18px; } .hero { padding: 24px 18px; } }