129 lines
3.7 KiB
CSS
129 lines
3.7 KiB
CSS
/* ══════════════════════════════════════════════
|
|
Atomaste Reveal.js Dark Theme (v2)
|
|
CDR Deck — GigaBIT M1 Primary Mirror
|
|
══════════════════════════════════════════════ */
|
|
|
|
:root {
|
|
--atomaste-bg: #0b0f14;
|
|
--atomaste-fg: #e8eef7;
|
|
--atomaste-muted: #a8b3c2;
|
|
--atomaste-accent: #7dd3fc; /* cyan */
|
|
--atomaste-accent-2: #a78bfa; /* violet */
|
|
--atomaste-green: #4ade80;
|
|
--atomaste-amber: #fbbf24;
|
|
--atomaste-red: #f87171;
|
|
--atomaste-surface: rgba(255,255,255,0.04);
|
|
--atomaste-border: rgba(232,238,247,0.10);
|
|
}
|
|
|
|
/* ── Base ── */
|
|
.reveal {
|
|
font-family: ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji", sans-serif;
|
|
color: var(--atomaste-fg);
|
|
}
|
|
|
|
.reveal .slides { text-align: left; }
|
|
|
|
/* ── Background ── */
|
|
.reveal-viewport {
|
|
background:
|
|
radial-gradient(1200px 800px at 15% 10%, rgba(125,211,252,0.14), transparent 55%),
|
|
radial-gradient(900px 600px at 85% 30%, rgba(167,139,250,0.12), transparent 60%),
|
|
linear-gradient(180deg, #070a0f 0%, #0b0f14 100%);
|
|
}
|
|
|
|
/* subtle floating glow */
|
|
.reveal-viewport::before {
|
|
content: "";
|
|
position: fixed;
|
|
inset: 0;
|
|
pointer-events: none;
|
|
background:
|
|
radial-gradient(500px 320px at 10% 20%, rgba(125,211,252,0.10), transparent 60%),
|
|
radial-gradient(420px 280px at 90% 40%, rgba(167,139,250,0.08), transparent 62%),
|
|
radial-gradient(520px 360px at 40% 95%, rgba(125,211,252,0.06), transparent 65%);
|
|
opacity: 0.9;
|
|
transform: translate3d(0,0,0);
|
|
animation: atomasteFloat 18s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes atomasteFloat {
|
|
0% { transform: translate3d(0,0,0); }
|
|
50% { transform: translate3d(18px,-10px,0); }
|
|
100% { transform: translate3d(0,0,0); }
|
|
}
|
|
|
|
/* ── Typography ── */
|
|
.reveal h1, .reveal h2, .reveal h3 {
|
|
font-weight: 700;
|
|
letter-spacing: -0.025em;
|
|
color: var(--atomaste-fg);
|
|
margin-bottom: 0.35em;
|
|
}
|
|
|
|
.reveal h1 { font-size: 2.25em; }
|
|
.reveal h2 { font-size: 1.65em; }
|
|
.reveal h3 { font-size: 1.15em; color: var(--atomaste-accent); font-weight: 600; }
|
|
|
|
.reveal p, .reveal li {
|
|
font-size: 0.76em;
|
|
line-height: 1.55;
|
|
color: var(--atomaste-fg);
|
|
}
|
|
|
|
.reveal a { color: var(--atomaste-accent); text-decoration: none; }
|
|
.reveal a:hover { text-decoration: underline; }
|
|
|
|
/* ── Lists ── */
|
|
.reveal ul { margin-left: 1.1em; }
|
|
.reveal ol { margin-left: 1.1em; }
|
|
.reveal li { margin: 0.35em 0; }
|
|
|
|
/* ── Images ── */
|
|
.reveal img {
|
|
max-height: 62vh;
|
|
border-radius: 10px;
|
|
border: 1px solid var(--atomaste-border);
|
|
}
|
|
|
|
/* ── Footer ── */
|
|
.atomaste-footer {
|
|
position: absolute;
|
|
left: 36px; right: 36px; bottom: 22px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
font-size: 14px;
|
|
color: rgba(232,238,247,0.65);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.atomaste-footer img { height: 22px; opacity: 0.9; }
|
|
|
|
.atomaste-chip {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 6px 10px;
|
|
border: 1px solid var(--atomaste-border);
|
|
border-radius: 999px;
|
|
background: rgba(255,255,255,0.03);
|
|
}
|
|
|
|
/* ── Section dividers ── */
|
|
.section-divider { display: grid; gap: 18px; }
|
|
.section-divider .kicker {
|
|
font-size: 0.9em;
|
|
color: var(--atomaste-muted);
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.12em;
|
|
}
|
|
.section-divider .title { font-size: 2.1em; line-height: 1.1; }
|
|
|
|
/* ── Fragment animation ── */
|
|
.reveal .fragment.fade-up { transform: translateY(6px); }
|
|
|
|
/* ── Code blocks ── */
|
|
.reveal pre code { font-size: 0.8em; line-height: 1.3; }
|