/** * SpaceX Theme (AK) * ───────────────────────────────────────────────────────── * AK 다크 UI — 미션 컨트롤·데이터 그리드·블루 액센트. * Paper Manual Theme(밝은 문서)과 짝을 이룹니다. * * 사용: * * (+ 페이지별: spacex-theme-list.css | spacex-theme-detail.css | …) * * Note: int/ppt/ppt-spacex.css 는 별도(PPT 라이트 UI)입니다. */ [data-ak-theme="spacex"] { --spx-bg: #0b0c10; --spx-panel: #111218; --spx-card: #161822; --spx-card-alt: #151821; --spx-ink: #e6e7ee; --spx-muted: #9aa0ad; --spx-line: #242739; --spx-pri: #5aa9e6; --spx-pri-bright: #58a6ff; --spx-accent: #c5171e; --spx-green: #7ee787; --spx-amber: #f2a93b; --spx-warn: #f2a93b; --spx-warn-bg: rgba(242, 169, 59, 0.12); --spx-cell-value-ink: #c5c9d4; --spx-cell-value-pri: #7db8e8; --spx-price-value-ink: #949ba8; --spx-row-hover: #141d2e; --spx-price-bg: #0a0c10; --spx-price-bg-hover: #141d2e; --spx-nav-bg: #0d1116; --spx-font: 'Pretendard', system-ui, -apple-system, 'Noto Sans KR', sans-serif; --ak-lock-bg: #050607; --ak-lock-header-bg: #050607; --ak-lock-border: #242739; --ak-lock-edge: #000000; --ak-lock-dot: #30363d; --ak-lock-dot-active: #58a6ff; --ak-lock-hover: var(--spx-row-hover); /* legacy aliases */ --bg: var(--spx-bg); --panel: var(--spx-panel); --card: var(--spx-card); --ink: var(--spx-ink); --muted: var(--spx-muted); --line: var(--spx-line); --pri: var(--spx-pri); --accent: var(--spx-accent); --cell-value-ink: var(--spx-cell-value-ink); --cell-value-pri: var(--spx-cell-value-pri); --price-value-ink: var(--spx-price-value-ink); --row-hover: var(--spx-row-hover); --price-bg: var(--spx-price-bg); --price-bg-hover: var(--spx-price-bg-hover); --warn: var(--spx-warn); --warn-bg: var(--spx-warn-bg); --green: var(--spx-green); --amber: var(--spx-amber); } [data-ak-theme="spacex"] *, [data-ak-theme="spacex"] *::before, [data-ak-theme="spacex"] *::after { box-sizing: border-box; } [data-ak-theme="spacex"], [data-ak-theme="spacex"] body { margin: 0; background: var(--spx-bg); color: var(--spx-ink); font-family: var(--spx-font); } [data-ak-theme="spacex"] body > .ak-nav header { position: sticky; top: 0; z-index: 10000; } /* ── Login ── */ [data-ak-theme="spacex"] body.ak-login { min-height: 100vh; display: flex; align-items: center; justify-content: center; line-height: 1.58; } [data-ak-theme="spacex"] .login-box { width: 90%; max-width: 400px; padding: 32px 28px; background: var(--spx-card); border: 1px solid var(--spx-line); border-radius: 12px; } [data-ak-theme="spacex"] .login-box h1 { margin: 0 0 8px; font-size: 1.25rem; } [data-ak-theme="spacex"] .login-box p { margin: 0 0 24px; color: var(--spx-muted); font-size: 0.875rem; } [data-ak-theme="spacex"] .login-box .error { margin-bottom: 16px; padding: 10px 12px; border-radius: 8px; background: rgba(197, 23, 30, 0.15); border: 1px solid var(--spx-accent); color: #ffb4b4; font-size: 0.875rem; } [data-ak-theme="spacex"] .login-box label { display: block; margin-bottom: 6px; font-size: 0.8125rem; color: var(--spx-muted); } [data-ak-theme="spacex"] .login-box input { width: 100%; margin-bottom: 16px; padding: 10px 12px; border: 1px solid var(--spx-line); border-radius: 8px; background: #111218; color: var(--spx-ink); font: inherit; } [data-ak-theme="spacex"] .login-box input:focus { outline: none; border-color: var(--spx-pri); } [data-ak-theme="spacex"] .login-box button { width: 100%; padding: 12px; border: none; border-radius: 8px; background: var(--spx-pri); color: var(--spx-bg); font: inherit; font-weight: 600; cursor: pointer; } [data-ak-theme="spacex"] .login-box button:hover { background: #7bbef0; }