.emdash-image-media[data-astro-cid-ntfj7e2f] {
  max-width: 100%;
  height: auto;
}
/* A `dark` or `light` class on <html> wins over the system preference. */
	:where(:root.dark) .emdash-image--light {
		display: none;
	}
	:where(:root.light) .emdash-image--dark {
		display: none;
	}
	@media (prefers-color-scheme: dark) {
		:where(:root:not(.light)) .emdash-image--light {
			display: none;
		}
	}
	@media (prefers-color-scheme: light) {
		:where(:root:not(.dark)) .emdash-image--dark {
			display: none;
		}
	}.has-text-align-center[data-astro-cid-7fvsivsc] {
  text-align: center;
}

.has-text-align-right[data-astro-cid-7fvsivsc] {
  text-align: right;
}

.has-text-align-justify[data-astro-cid-7fvsivsc] {
  text-align: justify;
}
.emdash-image[data-astro-cid-h2hj26nf] {
  margin: 1.5rem 0;
}

.emdash-image[data-astro-cid-h2hj26nf] img[data-astro-cid-h2hj26nf] {
  max-width: 100%;
  height: auto;
}

.emdash-image[data-astro-cid-h2hj26nf] figcaption[data-astro-cid-h2hj26nf] {
  font-size: .875rem;
  color: var(--emdash-caption-color, var(--color-muted, #666));
  margin-top: .5rem;
  text-align: center;
}

.emdash-image--align-left[data-astro-cid-h2hj26nf], .emdash-image--align-right[data-astro-cid-h2hj26nf] {
  width: fit-content;
  max-width: 50%;
}

.emdash-image--align-left[data-astro-cid-h2hj26nf] {
  float: left;
  margin: 0 1.5rem 1rem 0;
}

.emdash-image--align-right[data-astro-cid-h2hj26nf] {
  float: right;
  margin: 0 0 1rem 1.5rem;
}

.emdash-image--align-center[data-astro-cid-h2hj26nf] {
  width: fit-content;
  margin-inline: auto;
}

.emdash-image--align-wide[data-astro-cid-h2hj26nf], .emdash-image--align-full[data-astro-cid-h2hj26nf] {
  width: 100%;
}

@media (width <= 640px) {
  .emdash-image--align-left[data-astro-cid-h2hj26nf], .emdash-image--align-right[data-astro-cid-h2hj26nf] {
    float: none;
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
  }
}
.emdash-code[data-astro-cid-qhxwdfls] {
  margin: 1.5rem 0;
}

.emdash-code-filename[data-astro-cid-qhxwdfls] {
  font-size: .75rem;
  font-family: monospace;
  background: #2d2d2d;
  color: #ccc;
  padding: .5rem 1rem;
  border-radius: .5rem .5rem 0 0;
}

.emdash-code[data-astro-cid-qhxwdfls] pre[data-astro-cid-qhxwdfls] {
  margin: 0;
  padding: 1rem;
  background: #1e1e1e;
  border-radius: .5rem;
  overflow-x: auto;
}

.emdash-code-filename[data-astro-cid-qhxwdfls] + pre[data-astro-cid-qhxwdfls] {
  border-radius: 0 0 .5rem .5rem;
}

.emdash-code[data-astro-cid-qhxwdfls] code[data-astro-cid-qhxwdfls] {
  font-family: Fira Code, Consolas, monospace;
  font-size: .875rem;
  color: #e0e0e0;
}
.emdash-embed[data-astro-cid-knq4klfz] {
  margin: 1.5rem 0;
}

.emdash-embed-video[data-astro-cid-knq4klfz] {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
}

.emdash-embed-video[data-astro-cid-knq4klfz] iframe[data-astro-cid-knq4klfz], .emdash-embed-video[data-astro-cid-knq4klfz] video[data-astro-cid-knq4klfz] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.emdash-embed-audio[data-astro-cid-knq4klfz] {
  width: 100%;
}

.emdash-embed-audio[data-astro-cid-knq4klfz] audio[data-astro-cid-knq4klfz] {
  width: 100%;
}

.emdash-embed[data-astro-cid-knq4klfz] figcaption[data-astro-cid-knq4klfz] {
  font-size: .875rem;
  color: var(--emdash-caption-color, var(--color-muted, #666));
  margin-top: .5rem;
  text-align: center;
}
.emdash-gallery[data-astro-cid-4nywqrbh] {
  display: grid;
  grid-template-columns: repeat(var(--columns, 3), 1fr);
  gap: 1rem;
  margin: 1.5rem 0;
}

.emdash-gallery-item[data-astro-cid-4nywqrbh] {
  margin: 0;
}

.emdash-gallery-item[data-astro-cid-4nywqrbh] img[data-astro-cid-4nywqrbh] {
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 1;
}

.emdash-gallery-item[data-astro-cid-4nywqrbh] figcaption[data-astro-cid-4nywqrbh] {
  font-size: .75rem;
  color: var(--emdash-caption-color, var(--color-muted, #666));
  margin-top: .25rem;
  text-align: center;
}

@media (width <= 640px) {
  .emdash-gallery[data-astro-cid-4nywqrbh] {
    grid-template-columns: repeat(2, 1fr);
  }
}
.emdash-columns[data-astro-cid-rklnkae3] {
  display: flex;
  gap: 2rem;
  margin: 1.5rem 0;
}

.emdash-column[data-astro-cid-rklnkae3] {
  flex: 1;
  min-width: 0;
}

@media (width <= 768px) {
  .emdash-columns[data-astro-cid-rklnkae3] {
    flex-direction: column;
    gap: 1rem;
  }
}
.emdash-break[data-astro-cid-d7kaute7] {
  margin: 2rem 0;
}

.emdash-break-line[data-astro-cid-d7kaute7] {
  border: none;
  border-top: 1px solid var(--emdash-break-color, var(--color-border, #e0e0e0));
}

.emdash-break-dots[data-astro-cid-d7kaute7] {
  text-align: center;
  color: var(--emdash-break-dots-color, var(--color-muted, #999));
  letter-spacing: .5em;
}

.emdash-break-space[data-astro-cid-d7kaute7] {
  height: 2rem;
}
.emdash-html-block[data-astro-cid-trl447x3] {
  margin: 1.5rem 0;
}
.emdash-table-wrapper[data-astro-cid-fgaa2tw6] {
  max-inline-size: 100%;
  margin-block: 1.5rem;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
}

.emdash-table[data-astro-cid-fgaa2tw6] {
  inline-size: 100%;
  border-collapse: collapse;
  font-size: .9rem;
}

.emdash-table[data-astro-cid-fgaa2tw6] th[data-astro-cid-fgaa2tw6], .emdash-table[data-astro-cid-fgaa2tw6] td[data-astro-cid-fgaa2tw6] {
  position: relative;
  border: 1px solid var(--color-border, #ddd);
  padding: .75rem;
  text-align: start;
  vertical-align: top;
}

.emdash-table[data-astro-cid-fgaa2tw6] th[data-astro-cid-fgaa2tw6] p, .emdash-table[data-astro-cid-fgaa2tw6] td[data-astro-cid-fgaa2tw6] p {
  margin: 0;
}

.emdash-table[data-astro-cid-fgaa2tw6] th[data-astro-cid-fgaa2tw6] {
  background: var(--color-surface, #f5f5f5);
  font-weight: 600;
}

.emdash-table[data-astro-cid-fgaa2tw6] tbody[data-astro-cid-fgaa2tw6] tr[data-astro-cid-fgaa2tw6]:nth-child(2n) {
  background: var(--color-bg-subtle, #fafafa);
}

.emdash-table[data-astro-cid-fgaa2tw6] tbody[data-astro-cid-fgaa2tw6] tr[data-astro-cid-fgaa2tw6]:hover {
  background: var(--color-surface, #f0f0f0);
}
.emdash-button[data-astro-cid-4uvb4ph3] {
  display: inline-block;
  padding: .75em 1.5em;
  border-radius: 4px;
  text-decoration: none;
  font-weight: 500;
  cursor: pointer;
  transition: background-color .2s, border-color .2s, color .2s;
}

.emdash-button--default[data-astro-cid-4uvb4ph3], .emdash-button--fill[data-astro-cid-4uvb4ph3] {
  background-color: var(--emdash-button-bg, #0073aa);
  color: var(--emdash-button-color, #fff);
  border: 2px solid var(--emdash-button-bg, #0073aa);
}

.emdash-button--default[data-astro-cid-4uvb4ph3]:hover, .emdash-button--fill[data-astro-cid-4uvb4ph3]:hover {
  background-color: var(--emdash-button-bg-hover, #005177);
  border-color: var(--emdash-button-bg-hover, #005177);
}

.emdash-button--outline[data-astro-cid-4uvb4ph3] {
  background-color: #0000;
  color: var(--emdash-button-bg, #0073aa);
  border: 2px solid var(--emdash-button-bg, #0073aa);
}

.emdash-button--outline[data-astro-cid-4uvb4ph3]:hover {
  background-color: var(--emdash-button-bg, #0073aa);
  color: var(--emdash-button-color, #fff);
}
.emdash-buttons[data-astro-cid-dsh4b4jb] {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  margin: 1.5rem 0;
}

.emdash-buttons--vertical[data-astro-cid-dsh4b4jb] {
  flex-direction: column;
  align-items: flex-start;
}

.emdash-buttons--horizontal[data-astro-cid-dsh4b4jb] {
  flex-direction: row;
  align-items: center;
}
.emdash-cover[data-astro-cid-ivfzfo3k] {
  position: relative;
  display: flex;
  align-items: center;
  padding: 2rem;
  margin: 1.5rem 0;
  overflow: hidden;
  border-radius: 4px;
  background-color: var(--emdash-cover-fallback-bg, #333);
}

.emdash-cover__background[data-astro-cid-ivfzfo3k] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.emdash-cover__video[data-astro-cid-ivfzfo3k] {
  object-fit: cover;
}

.emdash-cover__overlay[data-astro-cid-ivfzfo3k] {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.emdash-cover__content[data-astro-cid-ivfzfo3k] {
  position: relative;
  z-index: 2;
  width: 100%;
  color: var(--emdash-cover-text-color, #fff);
}

.emdash-cover--align-left[data-astro-cid-ivfzfo3k] {
  justify-content: flex-start;
  text-align: left;
}

.emdash-cover--align-center[data-astro-cid-ivfzfo3k] {
  justify-content: center;
  text-align: center;
}

.emdash-cover--align-right[data-astro-cid-ivfzfo3k] {
  justify-content: flex-end;
  text-align: right;
}

.emdash-cover__content[data-astro-cid-ivfzfo3k] h1, .emdash-cover__content[data-astro-cid-ivfzfo3k] h2, .emdash-cover__content[data-astro-cid-ivfzfo3k] h3, .emdash-cover__content[data-astro-cid-ivfzfo3k] h4, .emdash-cover__content[data-astro-cid-ivfzfo3k] p {
  color: inherit;
}
.emdash-file[data-astro-cid-p35643fq] {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem;
  margin: 1rem 0;
  background-color: var(--emdash-file-bg, #f5f5f5);
  border-radius: 4px;
  border: 1px solid var(--emdash-file-border, #e0e0e0);
}

.emdash-file__link[data-astro-cid-p35643fq] {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex: 1;
  text-decoration: none;
  color: var(--emdash-file-color, #333);
}

.emdash-file__link[data-astro-cid-p35643fq]:hover {
  text-decoration: underline;
}

.emdash-file__icon[data-astro-cid-p35643fq] {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
  color: var(--emdash-file-icon-color, #666);
}

.emdash-file__name[data-astro-cid-p35643fq] {
  font-weight: 500;
  word-break: break-all;
}

.emdash-file__download[data-astro-cid-p35643fq] {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  background-color: var(--emdash-button-bg, #0073aa);
  color: var(--emdash-button-color, #fff);
  border-radius: 4px;
  transition: background-color .2s;
}

.emdash-file__download[data-astro-cid-p35643fq]:hover {
  background-color: var(--emdash-button-bg-hover, #005177);
}

.emdash-file__download[data-astro-cid-p35643fq] svg[data-astro-cid-p35643fq] {
  width: 1.25rem;
  height: 1.25rem;
}
.emdash-pullquote[data-astro-cid-edjwxjoh] {
  margin: 2rem 0;
  padding: 1.5rem 2rem;
  border-top: 4px solid var(--emdash-pullquote-border, #0073aa);
  border-bottom: 4px solid var(--emdash-pullquote-border, #0073aa);
  text-align: center;
}

.emdash-pullquote__text[data-astro-cid-edjwxjoh] {
  font-size: 1.5rem;
  font-style: italic;
  line-height: 1.4;
  color: var(--emdash-pullquote-color, #333);
  margin: 0;
}

.emdash-pullquote__citation[data-astro-cid-edjwxjoh] {
  margin-top: 1rem;
  font-size: .9rem;
  font-style: normal;
  color: var(--emdash-pullquote-citation-color, #666);
}
.emdash-live-search[data-astro-cid-liigmimj] {
  position: relative;
  display: inline-block;
}

.emdash-live-search-input[data-astro-cid-liigmimj] {
  width: 100%;
  padding: .5rem 1rem;
  font-size: 1rem;
  border: 1px solid var(--emdash-search-border, #ccc);
  border-radius: .25rem;
  background: var(--emdash-search-bg, white);
  color: var(--emdash-search-text, inherit);
}

.emdash-live-search-input[data-astro-cid-liigmimj]:focus {
  outline: none;
  border-color: var(--emdash-search-border-focus, #666);
}

.emdash-live-search-results[data-astro-cid-liigmimj] {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin-top: .25rem;
  background: var(--emdash-search-bg, white);
  border: 1px solid var(--emdash-search-border, #ccc);
  border-radius: .25rem;
  box-shadow: 0 4px 6px #0000001a;
  max-height: 400px;
  overflow-y: auto;
  z-index: 1000;
}

.emdash-live-search-loading[data-astro-cid-liigmimj], .emdash-live-search-no-results[data-astro-cid-liigmimj] {
  padding: 1rem;
  text-align: center;
  color: var(--emdash-search-muted, #666);
}

.emdash-live-search-result[data-astro-cid-liigmimj] {
  display: block;
  padding: .75rem 1rem;
  text-decoration: none;
  color: var(--emdash-search-text, inherit);
  border-bottom: 1px solid var(--emdash-search-border, #eee);
}

.emdash-live-search-result[data-astro-cid-liigmimj]:last-child {
  border-bottom: none;
}

.emdash-live-search-result[data-astro-cid-liigmimj]:hover, .emdash-live-search-result[data-astro-cid-liigmimj]:focus, .emdash-live-search-result[data-astro-cid-liigmimj].focused {
  background: var(--emdash-search-hover, #f5f5f5);
  outline: none;
}

.emdash-live-search-result-title[data-astro-cid-liigmimj] {
  display: block;
  font-weight: 500;
}

.emdash-live-search-result-collection[data-astro-cid-liigmimj] {
  display: block;
  font-size: .75rem;
  color: var(--emdash-search-muted, #888);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-top: .125rem;
}

.emdash-live-search-result-snippet[data-astro-cid-liigmimj] {
  display: block;
  font-size: .875rem;
  color: var(--emdash-search-muted, #666);
  margin-top: .25rem;
}

.emdash-live-search-result-snippet[data-astro-cid-liigmimj] mark {
  font-weight: 600;
  background: none;
  color: var(--emdash-search-highlight, var(--emdash-search-text, #000));
}
/*
  tokens.css -- the design tokens for this template. These are the
  defaults; to customize the site, override any variable in
  src/styles/theme.css rather than editing this file. Declarations in
  theme.css are unlayered, so they always beat these @layer base
  defaults -- no specificity tricks needed.

  Colors use light-dark(): the first value applies in light mode, the
  second in dark mode. Overriding a color with a plain value changes
  both modes at once; use light-dark(<light>, <dark>) in an override to
  keep them distinct.

  --font-body is defined by the font pipeline in astro.config.mjs, not
  here. To swap the loaded webfont, edit the fonts entry there. To use a
  system font, or a different face for headings only, override
  --font-body / --font-heading in theme.css.
*/

@layer base {
	:root {
		color-scheme: light dark;

		/* Colors */
		--color-bg: light-dark(#ffffff, #0d0d0d);
		--color-bg-subtle: light-dark(#fafafa, #141414);
		--color-text: light-dark(#1a1a1a, #ededed);
		--color-text-secondary: light-dark(#525252, #a0a0a0);
		--color-muted: light-dark(#8b8b8b, #6b6b6b);
		--color-border: light-dark(#e5e5e5, #2a2a2a);
		--color-border-subtle: light-dark(#f0f0f0, #1f1f1f);
		--color-surface: light-dark(#f7f7f7, #181818);
		--color-brand: light-dark(#0066cc, #4d9fff);
		--color-brand-hover: light-dark(#0052a3, #6eb0ff);
		--color-on-brand: white;
		--color-brand-ring: color-mix(in srgb, var(--color-brand) 25%, transparent);

		/* EmDash search theming */
		--emdash-search-bg: var(--color-bg);
		--emdash-search-text: var(--color-text);
		--emdash-search-muted: var(--color-muted);
		--emdash-search-border: var(--color-border);
		--emdash-search-hover: var(--color-surface);
		--emdash-search-highlight: var(--color-text);

		/* Typography */
		--font-heading: var(--font-body);
		--font-weight-heading: 600; /* h2-h6, card and list titles */
		--font-weight-display: 700; /* h1 and large page titles */

		/* Type scale */
		--font-size-xs: 0.8125rem;
		--font-size-sm: 0.875rem;
		--font-size-base: 1rem;
		--font-size-lg: 1.125rem;
		--font-size-xl: 1.25rem;
		--font-size-2xl: 1.5rem;
		--font-size-3xl: 2rem;
		--font-size-4xl: 2.5rem;
		--font-size-5xl: 3.5rem;

		/* Line heights */
		--leading-tight: 1.15;
		--leading-snug: 1.3;
		--leading-normal: 1.5;
		--leading-relaxed: 1.7;

		/* Letter spacing */
		--tracking-tight: -0.03em; /* h1 and large titles */
		--tracking-snug: -0.02em; /* h2-h6, site/card titles */
		--tracking-wide: 0.06em; /* meta labels, TOC/widget titles */
		--tracking-wider: 0.08em; /* footer headings, section labels */

		/* Spacing */
		--spacing-1: 0.25rem;
		--spacing-2: 0.5rem;
		--spacing-3: 0.75rem;
		--spacing-4: 1rem;
		--spacing-5: 1.25rem;
		--spacing-6: 1.5rem;
		--spacing-8: 2rem;
		--spacing-10: 2.5rem;
		--spacing-12: 3rem;
		--spacing-16: 4rem;
		--spacing-20: 5rem;
		--spacing-24: 6rem;

		/* Legacy spacing aliases */
		--spacing-xs: var(--spacing-1);
		--spacing-sm: var(--spacing-2);
		--spacing-md: var(--spacing-4);
		--spacing-lg: var(--spacing-6);
		--spacing-xl: var(--spacing-8);
		--spacing-2xl: var(--spacing-12);
		--spacing-3xl: var(--spacing-16);

		/* Layout */
		--content-width: 680px; /* article/page body column */
		--wide-width: 1200px; /* max container (home, archives) */
		--max-width: var(--content-width);
		--gutter-width: 200px; /* right sidebar column (TOC) on article pages */
		--meta-col-width: 180px; /* left meta column on article pages */
		--nav-height: 64px; /* sticky header height */
		--search-input-width: 180px; /* nav search box width */

		/* Borders & radius */
		--radius: 4px;
		--radius-lg: 8px;

		/* Transitions */
		--transition-fast: 120ms ease;
		--transition-base: 180ms ease;

		/* Avatars */
		--avatar-size-xs: 18px; /* card byline avatars */
		--avatar-size-sm: 20px; /* post list byline avatars */
		--avatar-size-md: 24px; /* featured post byline avatars */
		--avatar-size-lg: 32px; /* single post byline avatars */

		/* Shadows */
		--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
		--shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);

		/* Misc */
		--tag-padding-y: 2px; /* vertical padding on tag pills */
	}

	/*
	 * Light-mode values for browsers without light-dark() (Safari < 17.5,
	 * Chrome < 123). Must mirror the light values above.
	 */
	@supports not (color: light-dark(#000, #fff)) {
		:root {
			color-scheme: light;
			--color-bg: #ffffff;
			--color-bg-subtle: #fafafa;
			--color-text: #1a1a1a;
			--color-text-secondary: #525252;
			--color-muted: #8b8b8b;
			--color-border: #e5e5e5;
			--color-border-subtle: #f0f0f0;
			--color-surface: #f7f7f7;
			--color-brand: #0066cc;
			--color-brand-hover: #0052a3;
		}
	}
}
/*
  theme.css -- override token di sini. Nilai default ada di tokens.css;
  deklarasi di file ini tidak berlapis (unlayered) sehingga selalu menang.

  Arah desain: mengikuti haris.ai.id & arsip.haris.ai.id -- kanvas gelap
  hangat (default) atau kertas krem (mode terang), aksen amber, judul
  Instrument Serif, UI Geist, label Geist Mono, badan tulisan Lora.

  Mode: default GELAP. Kelas `light` di <html> (dari cookie `theme=light`)
  mengaktifkan mode terang. Semua warna memakai light-dark(), jadi cukup
  `color-scheme` yang menentukan nilai mana yang dipakai.
*/

:root {
	/* Default gelap; tombol tema menambah kelas .light / .dark. */
	color-scheme: dark;

	/* Warna (terang, gelap) */
	--color-bg: light-dark(#f4efe6, #0e0d0c);
	--color-bg-subtle: light-dark(#efe9de, #131210);
	--color-surface: light-dark(#ebe4d7, #181614);
	--color-text: light-dark(#1c1a17, #eee8dd);
	--color-text-secondary: light-dark(#4a453e, #c4bdb1);
	--color-muted: light-dark(#6b645a, #a59e93);
	--color-border: light-dark(#1c1a1726, #eee8dd29);
	--color-border-subtle: light-dark(#1c1a1714, #eee8dd14);

	--color-brand: light-dark(#96703c, #c9a26b);
	--color-brand-hover: light-dark(#7a5a2e, #dbb987);
	--color-on-brand: light-dark(#f4efe6, #0e0d0c);
	--color-brand-ring: color-mix(in srgb, var(--color-brand) 25%, transparent);

	/* Tipografi */
	--font-heading: var(--font-serif), "Instrument Serif", Georgia, serif;
	--font-weight-heading: 400;
	--font-weight-display: 400;
	--font-article: var(--font-reading), Lora, Georgia, serif;

	--font-size-base: 1rem;
	--font-size-lg: 1.125rem;
	--font-size-xl: 1.375rem;
	--font-size-2xl: 1.75rem;
	--font-size-3xl: 2.25rem;
	--font-size-4xl: 3rem;
	--font-size-5xl: 4rem;
	--tracking-tight: -0.01em;
	--tracking-snug: -0.005em;
	--tracking-wide: 0.08em;
	--tracking-wider: 0.12em;
	--leading-tight: 1.08;
	--leading-snug: 1.2;
	--leading-relaxed: 1.7;

	/* Tata letak */
	--content-width: 700px;
	--wide-width: 1080px;
	--nav-height: 64px;

	--radius: 3px;
	--radius-lg: 6px;

	--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.12);
	--shadow-lg: 0 12px 40px rgba(0, 0, 0, 0.28);
}

/* Harus di sini (unlayered): aturan berlapis di Base.astro kalah oleh
   `color-scheme: dark` di atas, berapa pun spesifisitasnya. */
:root.light {
	color-scheme: light;
}

:root.dark {
	color-scheme: dark;
}

/* Browser lama tanpa light-dark(): pakai palet gelap sebagai default. */
@supports not (color: light-dark(#000, #fff)) {
	:root {
		color-scheme: dark;
		--color-bg: #0e0d0c;
		--color-bg-subtle: #131210;
		--color-surface: #181614;
		--color-text: #eee8dd;
		--color-text-secondary: #c4bdb1;
		--color-muted: #a59e93;
		--color-border: #eee8dd29;
		--color-border-subtle: #eee8dd14;
		--color-brand: #c9a26b;
		--color-brand-hover: #dbb987;
		--color-on-brand: #0e0d0c;
	}

	:root.light {
		color-scheme: light;
		--color-bg: #f4efe6;
		--color-bg-subtle: #efe9de;
		--color-surface: #ebe4d7;
		--color-text: #1c1a17;
		--color-text-secondary: #4a453e;
		--color-muted: #6b645a;
		--color-border: #1c1a1726;
		--color-border-subtle: #1c1a1714;
		--color-brand: #96703c;
		--color-brand-hover: #7a5a2e;
		--color-on-brand: #f4efe6;
	}
}

/* Label seksi bergaya "01 — Tulisan" (Geist Mono). */
.mono-label {
	display: inline-flex;
	align-items: center;
	gap: 0.6em;
	font-family: var(--font-mono);
	font-size: 0.75rem;
	font-weight: 400;
	text-transform: uppercase;
	letter-spacing: var(--tracking-wider);
	color: var(--color-muted);
}

.mono-label .num {
	color: var(--color-brand);
}

/* Kata miring beraksen di judul serif, mis. "Haris <em>Firdaus</em>". */
.serif-accent {
	font-style: italic;
	color: var(--color-brand);
}

/* Tautan teks di dalam artikel memakai garis bawah tipis. */
.article-body a {
	text-decoration: underline;
	text-underline-offset: 3px;
	text-decoration-thickness: 1px;
	text-decoration-color: color-mix(in srgb, var(--color-brand) 45%, transparent);
}

.article-body a:hover {
	text-decoration-color: var(--color-brand);
}

/* Tautan nav: tanpa garis bawah. */
.site-nav a {
	text-decoration: none;
}
@layer base;

			@layer base {
				*:where(:not([class*="emdash"]):not([class*="ec-"])),
				*:where(:not([class*="emdash"]):not([class*="ec-"]))::before,
				*:where(:not([class*="emdash"]):not([class*="ec-"]))::after {
					box-sizing: border-box;
				}

				body,
				h1,
				h2,
				h3,
				h4,
				h5,
				h6,
				p,
				ul,
				ol,
				figure,
				blockquote,
				dl,
				dd {
					margin: 0;
				}

				ul,
				ol {
					padding: 0;
				}

				@supports (color: light-dark(#000, #fff)) {
					:root.light {
						color-scheme: light;
					}
					:root.dark {
						color-scheme: dark;
					}
				}

				html {
					scroll-behavior: smooth;
				}

				body {
					font-family: var(--font-body);
					font-size: var(--font-size-base);
					line-height: var(--leading-relaxed);
					color: var(--color-text);
					background: var(--color-bg);
					-webkit-font-smoothing: antialiased;
					-moz-osx-font-smoothing: grayscale;
					min-height: 100vh;
					text-rendering: optimizeLegibility;
				}

				a:where(:not([class*="emdash"]):not([class*="ec-"])) {
					color: var(--color-brand);
					transition: color var(--transition-fast);
				}

				a:where(:not([class*="emdash"]):not([class*="ec-"])):hover {
					color: var(--color-brand-hover);
				}

				img {
					max-width: 100%;
					height: auto;
					display: block;
				}

				h1,
				h2,
				h3,
				h4,
				h5,
				h6 {
					font-family: var(--font-heading);
					line-height: var(--leading-tight);
					font-weight: var(--font-weight-heading);
					letter-spacing: var(--tracking-snug);
					text-wrap: balance;
				}

				h1 {
					font-weight: var(--font-weight-display);
					letter-spacing: var(--tracking-tight);
				}

				p {
					text-wrap: pretty;
				}

				::selection {
					background: var(--color-brand);
					color: var(--color-on-brand);
				}
			}.nav-inner[data-astro-cid-hkbrpulz], .footer-inner[data-astro-cid-hkbrpulz] {
  width: 100%;
  max-width: var(--wide-width);
  margin: 0 auto;
  padding-inline: var(--spacing-6);
}

.site-header[data-astro-cid-hkbrpulz] {
  position: sticky;
  top: 0;
  z-index: 100;
  background-color: var(--color-bg);
  border-bottom: 1px solid var(--color-border-subtle);
}

.site-nav[data-astro-cid-hkbrpulz] {
  display: flex;
  align-items: center;
  gap: var(--spacing-6);
  height: var(--nav-height);
}

.brand[data-astro-cid-hkbrpulz] {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: 1.625rem;
  line-height: 1;
  letter-spacing: var(--tracking-snug);
  color: var(--color-text);
  text-decoration: none;
  white-space: nowrap;
}

.brand[data-astro-cid-hkbrpulz]:hover {
  color: var(--color-text);
}

.brand[data-astro-cid-hkbrpulz]:hover .serif-accent[data-astro-cid-hkbrpulz] {
  color: var(--color-brand-hover);
}

.brand-logo[data-astro-cid-hkbrpulz] {
  height: 28px;
  width: auto;
}

.nav-links[data-astro-cid-hkbrpulz] {
  display: flex;
  gap: var(--spacing-5);
  font-size: var(--font-size-sm);
  color: var(--color-muted);
}

.nav-links[data-astro-cid-hkbrpulz] a[data-astro-cid-hkbrpulz] {
  color: var(--color-muted);
  transition: color var(--transition-fast);
}

.nav-links[data-astro-cid-hkbrpulz] a[data-astro-cid-hkbrpulz]:hover {
  color: var(--color-text);
}

.nav-tools[data-astro-cid-hkbrpulz] {
  display: flex;
  align-items: center;
  gap: var(--spacing-4);
  margin-inline-start: auto;
}

.nav-admin[data-astro-cid-hkbrpulz] {
  font-size: var(--font-size-sm);
  color: var(--color-text-secondary);
  text-decoration: none;
}

.nav-admin[data-astro-cid-hkbrpulz]:hover {
  color: var(--color-text);
}

.site-search[data-astro-cid-hkbrpulz] {
  position: relative;
  width: 160px;
  --emdash-search-border-focus: var(--color-brand);
}

.site-search-input {
  width: 160px;
  padding: var(--spacing-1) var(--spacing-3);
  font-family: var(--font-body);
  font-size: var(--font-size-sm);
  border: 1px solid var(--color-border);
  border-radius: var(--radius);
  background: none;
  color: var(--color-text);
  transition: border-color var(--transition-fast),
					background var(--transition-fast);
}

.site-search-input::placeholder {
  color: var(--color-muted);
}

.site-search-input:focus, .site-search-input:focus-visible {
  outline: none;
  background: var(--color-bg);
  border-color: var(--color-brand) !important;
}

.site-search-results {
  position: absolute;
  top: calc(100% + var(--spacing-2));
  right: 0;
  width: 320px;
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg);
  max-height: 400px;
  overflow-y: auto;
  z-index: 1000;
}

.site-search-results .emdash-live-search-loading, .site-search-results .emdash-live-search-no-results {
  padding: var(--spacing-4);
  text-align: center;
  color: var(--color-muted);
  font-size: var(--font-size-sm);
}

.site-search-result {
  display: block;
  padding: var(--spacing-3) var(--spacing-4);
  text-decoration: none;
  color: var(--color-text);
  border-bottom: 1px solid var(--color-border-subtle);
}

.site-search-result:last-child {
  border-bottom: none;
}

.site-search-result:hover, .site-search-result.focused {
  background: var(--color-surface);
}

.site-search-result .emdash-live-search-result-title {
  display: block;
  font-weight: 500;
  font-size: var(--font-size-sm);
}

.site-search-result .emdash-live-search-result-collection {
  display: none;
}

.site-search-result .emdash-live-search-result-snippet {
  display: block;
  font-size: var(--font-size-xs);
  color: var(--color-muted);
  margin-top: 2px;
}

.theme-toggle[data-astro-cid-hkbrpulz] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  background: none;
  border: 1px solid var(--color-border);
  border-radius: 999px;
  color: var(--color-muted);
  cursor: pointer;
  transition: color var(--transition-fast),
					border-color var(--transition-fast);
}

.theme-toggle[data-astro-cid-hkbrpulz]:hover {
  color: var(--color-brand);
  border-color: var(--color-brand);
}

.theme-toggle[data-astro-cid-hkbrpulz] svg[data-astro-cid-hkbrpulz] {
  width: 16px;
  height: 16px;
}

.theme-toggle[data-astro-cid-hkbrpulz] .icon-moon[data-astro-cid-hkbrpulz] {
  display: none;
}

:root.light .theme-toggle[data-astro-cid-hkbrpulz] .icon-sun[data-astro-cid-hkbrpulz] {
  display: none;
}

:root.light .theme-toggle[data-astro-cid-hkbrpulz] .icon-moon[data-astro-cid-hkbrpulz] {
  display: block;
}

main[data-astro-cid-hkbrpulz] {
  min-height: 50vh;
}

.site-footer[data-astro-cid-hkbrpulz] {
  margin-top: var(--spacing-24);
  border-top: 1px solid var(--color-border);
}

.footer-inner[data-astro-cid-hkbrpulz] {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--spacing-4) var(--spacing-8);
  padding-block: var(--spacing-8);
  flex-wrap: wrap;
  font-size: var(--font-size-sm);
  color: var(--color-muted);
}

.footer-copy[data-astro-cid-hkbrpulz] {
  margin: 0;
}

.footer-links[data-astro-cid-hkbrpulz] {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-5);
  list-style: none;
}

.footer-links[data-astro-cid-hkbrpulz] a[data-astro-cid-hkbrpulz] {
  color: var(--color-muted);
  text-decoration: none;
}

.footer-links[data-astro-cid-hkbrpulz] a[data-astro-cid-hkbrpulz]:hover {
  color: var(--color-brand);
}

@media (width <= 720px) {
  .site-nav[data-astro-cid-hkbrpulz] {
    flex-wrap: wrap;
    height: auto;
    padding-block: var(--spacing-3);
    gap: var(--spacing-3);
  }

  .nav-tools[data-astro-cid-hkbrpulz] {
    width: 100%;
    margin-inline-start: 0;
  }

  .site-search[data-astro-cid-hkbrpulz] {
    flex: 1;
    width: auto;
  }

  .site-search-input {
    width: 100%;
  }

  .site-search-results {
    width: 100%;
    left: 0;
    right: auto;
  }
}