init

1 files changed, 560 insertions, 0 deletions

diff --git a/acarp.css b/acarp.css
new file mode 100644
index 0000000..6395e52
--- /dev/null
+++ b/acarp.css
@@ -0,0 +1,560 @@
+/*
+ * Academic Marp (acarp) Theme
+ * Version: 1.0.0
+ * License: MIT
+ * Repository: https://git.samsci.com/cgit.cgi/acarp-marp-theme/
+ * 
+ * A minimal, grid-based theme for Marp presentations designed for academic content.
+ * Grid-only layouts - no flexbox, no utility classes, explicit contracts.
+ */
+
+/* @theme acarp */
+@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400;700&display=swap');
+
+/* Import syntax highlighting theme */
+@import url('https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9.0/build/styles/github.min.css');
+
+/* Academic Marp (acarp) Theme Base
+   Grid-only layout system. No flexbox. No utility classes.
+   Explicit grid contracts for all layouts.
+*/
+
+:root {
+  --slide-width: 1280px;
+  --slide-height: 720px;
+  --padding: 70px;
+  --title-top: 40px;
+  --color-background: #fdfcff;
+  --color-background-code: #f2f1f4;
+  --color-foreground: #202228;
+  --color-highlight: #009dd5;
+  --color-highlight-hover: #087eaa;
+  --color-highlight-heading: #33b1dd;
+}
+
+/* Base section styling */
+section {
+  /* Visual appearance */
+  background: var(--color-background);
+  color: var(--color-foreground);
+  
+  /* Layout and positioning */
+  display: block;
+  position: relative;
+  width: var(--slide-width);
+  height: var(--slide-height);
+  padding: 30px var(--padding);
+  z-index: 0;
+  
+  /* Typography */
+  font-family: 'EB Garamond', 'Times New Roman', serif;
+  font-size: 28px;
+  letter-spacing: 2px;
+  line-height: 1.4;
+  
+  /* Text behavior */
+  text-align: left;
+  word-wrap: break-word;
+}
+
+/* Just change the color and styling of Marp's default pagination */
+section::after {
+  color: #888888 !important;
+  font-size: 18px !important;
+  font-family: 'EB Garamond', 'Times New Roman', serif !important;
+}
+
+/* Hide pagination on title slides */
+section.title::after {
+  display: none !important;
+}
+
+/* Logo support - top right corner */
+section:not(.title)::before {
+  content: '';
+  position: absolute;
+  top: var(--logo-top, 20px);
+  right: var(--logo-right, 20px);
+  width: var(--logo-width, 100px);
+  height: var(--logo-height, 40px);
+  background-image: var(--logo-image, none);
+  background-repeat: no-repeat;
+  background-position: right center;
+  background-size: contain;
+  opacity: var(--logo-opacity, 0.7);
+  z-index: 1;
+}
+
+
+
+section:not([data-marpit-pagination])::after {
+  display: none;
+}
+
+/* Typography */
+/* Remove top margin from first element and last element */
+section > *:first-child,
+section[data-header] > :nth-child(2) {
+  margin-top: 0;
+}
+
+section > *:last-child,
+section[data-footer] > :nth-last-child(2) {
+  margin-bottom: 0;
+}
+
+/* Paragraph and blockquote spacing */
+section p, section blockquote {
+  margin: 0 0 15px;
+}
+
+/* Heading spacing and sizing */
+section h1, section h2, section h3, section h4, section h5, section h6 {
+  margin: 15px 0 30px;
+}
+
+/* Highlight styling for bold text in headings */
+section h1 strong, section h2 strong, section h3 strong,
+section h4 strong, section h5 strong, section h6 strong {
+  color: var(--color-highlight-heading);
+  font-weight: inherit;
+}
+
+/* Auto-scaling constraint for headings */
+section h1::part(auto-scaling),
+section h2::part(auto-scaling),
+section h3::part(auto-scaling),
+section h4::part(auto-scaling),
+section h5::part(auto-scaling),
+section h6::part(auto-scaling) {
+  max-height: 660px;
+}
+
+/* Heading font sizes */
+section h1 { font-size: 2.2em; }
+section h2 { font-size: 1.8em; }
+section h3 { font-size: 1.5em; letter-spacing: 2px; }
+section h4 { font-size: 1.3em; letter-spacing: 2px; }
+section h5 { font-size: 1.1em; letter-spacing: 1px; }
+section h6 { font-size: 0.9em; letter-spacing: 1px; }
+
+/* Code and preformatted text */
+/* Inline code styling */
+code {
+  font-family: Monaco, monospace;
+  letter-spacing: 0;
+}
+
+/* Background for inline code */
+section > code,
+section *:not(pre) > code {
+  background: var(--color-background-code);
+  color: var(--color-foreground);
+  margin: -0.2em 0.2em 0.2em;
+  padding: 0.15em 0.3em;
+  border-radius: 2px;
+  font-size: 0.85em;
+  border: 1px solid rgba(0, 0, 0, 0.08);
+  font-family: Monaco, monospace;
+  letter-spacing: -0.02em;
+}
+
+/* Code block styling */
+pre {
+  filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.2));
+  font-size: 70%;
+  line-height: 1.15;
+  margin: 15px 0 30px;
+  text-align: left;
+  padding: 0;
+  overflow-x: auto;
+  border-radius: 6px;
+  position: relative;
+}
+
+/* Add subtle background pattern for code blocks */
+pre::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 3px;
+  background: linear-gradient(90deg, var(--color-highlight), var(--color-highlight-hover));
+  border-radius: 6px 6px 0 0;
+}
+
+/* Code block content styling */
+pre > code {
+  background: var(--color-background-code);
+  box-sizing: content-box;
+  color: var(--color-foreground);
+  display: block;
+  margin: 0 auto;
+  min-width: 456px;
+  padding: 0.8em 1em;
+  font-size: 0.9em;
+  border-radius: 4px;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+}
+
+/* Enhanced syntax highlighting for academic theme - override github theme */
+pre code .hljs-keyword,
+.hljs-keyword {
+  color: #d73a49 !important;
+  font-weight: 600 !important;
+}
+
+pre code .hljs-string,
+.hljs-string {
+  color: #032f62 !important;
+}
+
+pre code .hljs-comment,
+.hljs-comment {
+  color: #6a737d !important;
+  font-style: italic;
+}
+
+pre code .hljs-number,
+.hljs-number {
+  color: #005cc5 !important;
+}
+
+pre code .hljs-function,
+.hljs-function {
+  color: #6f42c1 !important;
+}
+
+pre code .hljs-variable,
+.hljs-variable {
+  color: #24292e !important;
+}
+
+pre code .hljs-class,
+.hljs-class {
+  color: #6f42c1 !important;
+  font-weight: 600 !important;
+}
+
+pre code .hljs-tag,
+.hljs-tag {
+  color: #22863a !important;
+}
+
+/* Language-specific highlights */
+pre code .hljs-built_in,
+.hljs-built_in {
+  color: #e36209 !important;
+}
+
+pre code .hljs-operator,
+.hljs-operator {
+  color: #d73a49 !important;
+}
+
+pre code .hljs-punctuation,
+.hljs-punctuation {
+  color: #586069 !important;
+}
+
+/* Additional syntax elements */
+pre code .hljs-title,
+.hljs-title {
+  color: #6f42c1 !important;
+  font-weight: 600 !important;
+}
+
+pre code .hljs-params,
+.hljs-params {
+  color: #24292e !important;
+}
+
+pre code .hljs-attr,
+.hljs-attr {
+  color: #6f42c1 !important;
+}
+
+pre code .hljs-name,
+.hljs-name {
+  color: #22863a !important;
+}
+
+/* Math formulas */
+math {
+  font-size: 1.1em;
+}
+
+/* ============================================================================
+   UTILITY CLASSES
+   ============================================================================ */
+
+/* Vertical spacing utilities */
+.vspace-small { margin-top: 1em !important; }
+.vspace-medium { margin-top: 2em !important; }
+.vspace-large { margin-top: 3em !important; }
+.vspace-xlarge { margin-top: 4em !important; }
+
+/* Spacing that works on any element */
+.push-down { margin-bottom: 1.5em !important; }
+.push-up { margin-top: 1.5em !important; }
+
+/* Center figures and their content */
+.centered-figure {
+  text-align: center;
+}
+
+/* Auto-center images that are alone in a paragraph */
+section p > img:only-child {
+  display: block;
+  margin: 0 auto;
+}
+
+/* ============================================================================
+   LAYOUT: title
+   
+   Centered title slide for cover pages.
+   ============================================================================ */
+
+section.title {
+  text-align: center;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  min-height: 100vh;
+  box-sizing: border-box;
+}
+
+section.title > h1 {
+  font-size: 64px;
+  margin: 0;
+  padding: 0;
+}
+
+section.title > h2 {
+  font-size: 24px;
+  color: #666;
+  margin: 0.5em 0 0 0;
+  padding: 0;
+  font-weight: normal;
+  letter-spacing: 1px;
+}
+
+/* Images in title slides behave normally */
+section.title > img {
+  margin: 2em 0;
+  max-width: 80%;
+  height: auto;
+}
+
+/* ============================================================================
+   LAYOUT: layout-2col
+   
+   Two-column layout: left and right columns with title at top.
+   
+   Grid contract:
+   ┌─────────────────────────────┐
+   │         title               │
+   ├──────────────┬──────────────┤
+   │              │              │
+   │  left-col    │  right-col   │
+   │              │              │
+   ├──────────────┴──────────────┤
+   │         pagination          │
+   └─────────────────────────────┘
+   
+   Grid areas: title, left, right, footer
+   Default gap: 2em
+   Columns: 1fr 1fr (equal)
+   ============================================================================ */
+
+section.layout-2col {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  grid-template-rows: auto 1fr auto;
+  grid-template-areas:
+    "title title"
+    "left right"
+    "footer footer";
+  gap: 2em;
+  padding: 0;
+  height: 100%;
+  width: 100%;
+  overflow: hidden;
+}
+
+section.layout-2col > h1:first-child,
+section.layout-2col > h2:first-child,
+section.layout-2col > h3:first-child {
+  grid-area: title;
+  padding: 30px var(--padding) 0;
+  margin: 0 0 10px 0;
+  position: static;
+}
+
+section.layout-2col .left-column {
+  grid-area: left;
+  padding: 0 var(--padding) 0 var(--padding);
+  min-height: 0;
+}
+
+section.layout-2col .right-column {
+  grid-area: right;
+  padding: 0 var(--padding) 0 0;
+  min-height: 0;
+}
+
+section.layout-2col::after {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  color: #888888 !important;
+  font-size: 18px !important;
+  font-family: 'EB Garamond', 'Times New Roman', serif !important;
+  grid-area: unset;
+  padding: 30px var(--padding);
+  margin: 0;
+}
+
+section.layout-2col img {
+  max-width: 90%;
+  max-height: 90%;
+  height: auto;
+  width: auto;
+  object-fit: contain;
+  display: block;
+}
+
+/* ============================================================================
+   SYNTAX HIGHLIGHTING OVERRIDE
+   
+   Force override of highlight.js theme colors for consistent academic styling.
+   ============================================================================ */
+
+/* Base code block colors */
+pre {
+  --hljs-bg: var(--color-background-code) !important;
+  --hljs-fg: var(--color-foreground) !important;
+  background: var(--hljs-bg) !important;
+}
+
+pre code {
+  background: var(--hljs-bg) !important;
+  color: var(--hljs-fg) !important;
+}
+
+/* Syntax-specific colors with maximum specificity */
+section pre code .token.keyword,
+section pre code .hljs-keyword,
+.token.keyword,
+.hljs-keyword {
+  color: #d73a49 !important;
+  font-weight: 600 !important;
+}
+
+section pre code .token.string,
+section pre code .hljs-string,
+.token.string,
+.hljs-string {
+  color: #032f62 !important;
+}
+
+section pre code .token.comment,
+section pre code .hljs-comment,
+.token.comment,
+.hljs-comment {
+  color: #6a737d !important;
+  font-style: italic !important;
+}
+
+section pre code .token.number,
+section pre code .hljs-number,
+.token.number,
+.hljs-number {
+  color: #005cc5 !important;
+}
+
+section pre code .token.function,
+section pre code .hljs-function,
+.token.function,
+.hljs-function {
+  color: #6f42c1 !important;
+}
+
+section pre code .token.class-name,
+section pre code .hljs-class,
+.token.class-name,
+.hljs-class {
+  color: #6f42c1 !important;
+  font-weight: 600 !important;
+}
+
+section pre code .token.tag,
+section pre code .hljs-tag,
+.token.tag,
+.hljs-tag {
+  color: #22863a !important;
+}
+
+section pre code .token.builtin,
+section pre code .hljs-built_in,
+.token.builtin,
+.hljs-built_in {
+  color: #e36209 !important;
+}
+
+section pre code .token.operator,
+section pre code .hljs-operator,
+.token.operator,
+.hljs-operator {
+  color: #d73a49 !important;
+}
+
+section pre code .token.punctuation,
+section pre code .hljs-punctuation,
+.token.punctuation,
+.hljs-punctuation {
+  color: #586069 !important;
+}
+
+/* Additional syntax elements */
+section pre code .token.title,
+section pre code .hljs-title,
+.token.title,
+.hljs-title {
+  color: #6f42c1 !important;
+  font-weight: 600 !important;
+}
+
+section pre code .token.parameter,
+section pre code .hljs-params,
+.token.parameter,
+.hljs-params {
+  color: #24292e !important;
+}
+
+section pre code .token.attr-name,
+section pre code .hljs-attr,
+.token.attr-name,
+.hljs-attr {
+  color: #6f42c1 !important;
+}
+
+section pre code .token.attr-value,
+section pre code .hljs-string,
+.token.attr-value {
+  color: #032f62 !important;
+}
+
+
+/* ============================================================================
+   LAYOUT: default (no class)
+   
+   Simple single-column layout - just use normal document flow.
+   ============================================================================ */
+
+section:not(.title):not(.layout-2col) {
+  padding: 30px var(--padding);
+}