@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root {
  --aikozo-bg: #10110f;
  --aikozo-panel: #171615;
  --aikozo-panel-muted: #12110f;
  --aikozo-surface: #1f1d1a;
  --aikozo-surface-raised: #25231f;
  --aikozo-border: #332f2a;
  --aikozo-border-soft: rgba(167, 160, 150, 0.22);
  --aikozo-text: #e8e2d8;
  --aikozo-muted: #a7a096;
  --aikozo-accent: #F2A814;
  --aikozo-accent-strong: #F8BE3F;
  --aikozo-accent-soft: rgba(242, 168, 20, 0.14);
  --aikozo-accent-line: rgba(242, 168, 20, 0.52);
  --aikozo-accent-border: rgba(242, 168, 20, 0.46);
  --aikozo-radius: 8px;
  --aikozo-shadow: 0 18px 38px rgba(0, 0, 0, 0.24);
  --aikozo-page-pattern:
    linear-gradient(to bottom, transparent 0 38px, rgba(232, 226, 216, 0.035) 38px 39px, transparent 39px 92px, rgba(232, 226, 216, 0.035) 92px 93px, transparent 93px 158px, rgba(232, 226, 216, 0.035) 158px 159px, transparent 159px 236px, rgba(232, 226, 216, 0.035) 236px 237px, transparent 237px),
    linear-gradient(90deg, transparent 0 29px, rgba(232, 226, 216, 0.03) 29px 30px, transparent 30px 78px, rgba(232, 226, 216, 0.03) 78px 79px, transparent 79px 118px, rgba(232, 226, 216, 0.03) 118px 119px, transparent 119px 186px, rgba(232, 226, 216, 0.03) 186px 187px, transparent 187px 282px, rgba(232, 226, 216, 0.03) 282px 283px, transparent 283px),
    linear-gradient(to bottom, transparent 0 172px, rgba(232, 226, 216, 0.035) 172px 173px, transparent 173px),
    linear-gradient(90deg, transparent 0 164px, rgba(232, 226, 216, 0.03) 164px 165px, transparent 165px),
    radial-gradient(circle at 50% -10%, rgba(242, 168, 20, 0.08), transparent 38%);
  --aikozo-page-pattern-size: 340px 274px, 318px 336px, 680px 548px, 636px 672px, 100% 100%;
  --aikozo-page-pattern-position: center top, 43px 21px, -112px -58px, 96px -28px, center top;
  --aikozo-topbar-texture:
    linear-gradient(180deg, rgba(255, 239, 205, 0.035), rgba(93, 54, 26, 0.035)),
    linear-gradient(87deg, transparent 0 9%, rgba(177, 111, 48, 0.045) 13%, transparent 21% 43%, rgba(242, 168, 20, 0.028) 49%, transparent 58% 77%, rgba(112, 67, 33, 0.045) 84%, transparent 100%),
    linear-gradient(94deg, transparent 0 17%, rgba(255, 226, 172, 0.016) 20%, transparent 24% 36%, rgba(95, 59, 31, 0.018) 42%, transparent 47% 64%, rgba(255, 226, 172, 0.012) 73%, transparent 79% 100%),
    linear-gradient(103deg, transparent 0 31%, rgba(95, 59, 31, 0.016) 35%, transparent 39% 71%, rgba(242, 168, 20, 0.014) 76%, transparent 82% 100%);
}

[data-md-color-scheme="slate"] {
  --md-default-bg-color: var(--aikozo-bg);
  --md-default-fg-color: var(--aikozo-text);
  --md-default-fg-color--light: var(--aikozo-muted);
  --md-default-fg-color--lighter: rgba(167, 160, 150, 0.72);
  --md-default-fg-color--lightest: rgba(167, 160, 150, 0.38);
  --md-primary-fg-color: var(--aikozo-accent);
  --md-primary-fg-color--light: var(--aikozo-accent-strong);
  --md-primary-fg-color--dark: var(--aikozo-accent-strong);
  --md-accent-fg-color: var(--aikozo-accent-strong);
  --md-typeset-a-color: var(--aikozo-accent);
}

body,
input,
button,
select,
textarea {
  font-family: "Inter", "Segoe UI", "Noto Sans", Arial, sans-serif;
}

body {
  line-height: 1.65;
}

.md-header,
.md-tabs {
  background-color: rgba(23, 22, 21, 0.97);
  background-image: var(--aikozo-topbar-texture);
}

.md-header,
.md-header__button,
.md-header__title,
.md-header__topic,
.md-header__source,
.md-tabs__link,
.md-search__icon,
.md-search__icon svg,
.md-search__input::placeholder {
  color: #ffffff;
}

.md-search__icon svg,
.md-header__button svg {
  fill: #ffffff;
}

.md-tabs__link--active,
.md-tabs__link:hover,
.md-header__button:hover {
  color: #ffffff;
  opacity: 0.9;
}

.md-header {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

.md-main {
  background-color: var(--aikozo-bg);
  background-image: var(--aikozo-page-pattern);
  background-position: var(--aikozo-page-pattern-position);
  background-size: var(--aikozo-page-pattern-size);
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-nav__title,
.md-tabs__link,
.md-header__title {
  font-family: "Inter", "Segoe UI", "Noto Sans", Arial, sans-serif;
  letter-spacing: 0;
}

.md-typeset {
  font-size: 0.8rem;
  line-height: 1.65;
}

.md-typeset p,
.md-typeset li,
.md-typeset td,
.md-typeset blockquote {
  color: var(--aikozo-muted);
}

.md-typeset strong,
.md-typeset th,
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  color: var(--aikozo-text);
}

.md-typeset h1 {
  font-weight: 700;
  font-size: clamp(1.22rem, 2.1vw, 1.58rem);
}

.md-typeset h2 {
  font-size: clamp(1.08rem, 1.76vw, 1.4rem);
}

.md-typeset h3 {
  font-size: 0.84rem;
}

.md-typeset p {
  margin: 0 0 0.6rem;
}

.md-nav,
.md-tabs__link,
.md-header__title {
  font-size: 0.72rem;
}

.md-sidebar--primary .md-sidebar__scrollwrap,
.md-sidebar--secondary .md-sidebar__scrollwrap {
  background: var(--aikozo-panel);
  border: 1px solid var(--aikozo-border-soft);
  border-radius: var(--aikozo-radius);
  box-shadow: var(--aikozo-shadow);
  overflow: hidden;
  position: relative;
}

.md-sidebar--primary .md-sidebar__scrollwrap::before,
.md-sidebar--secondary .md-sidebar__scrollwrap::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--aikozo-accent-line), rgba(242, 168, 20, 0));
}

.md-sidebar--primary .md-sidebar__inner,
.md-sidebar--secondary .md-sidebar__inner {
  padding: 0.55rem;
}

.md-sidebar--primary .md-nav,
.md-sidebar--secondary .md-nav {
  background: transparent;
}

.md-sidebar--primary .md-nav__title,
.md-sidebar--secondary .md-nav__title {
  background: transparent;
  box-shadow: none;
  color: var(--aikozo-text);
  font-weight: 700;
  padding-bottom: 0.4rem;
}

.md-sidebar--primary .md-nav__item,
.md-sidebar--secondary .md-nav__item {
  margin-bottom: 0.2rem;
}

.md-sidebar--primary .md-nav__link,
.md-sidebar--secondary .md-nav__link {
  border-radius: 12px;
  color: var(--aikozo-muted);
  padding: 0.45rem 0.6rem;
  transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.md-sidebar--primary .md-nav__link:hover,
.md-sidebar--secondary .md-nav__link:hover {
  background: var(--aikozo-surface-raised);
  color: var(--aikozo-text);
  transform: translateX(2px);
}

.md-sidebar--primary .md-nav__link--active,
.md-sidebar--secondary .md-nav__link--active {
  background: var(--aikozo-accent-soft);
  color: var(--aikozo-accent-strong);
  font-weight: 700;
}

.md-sidebar--primary .md-nav .md-nav {
  margin-left: 0.45rem;
  padding-left: 0.7rem;
  border-left: 1px solid var(--aikozo-border-soft);
}

.md-sidebar--primary .md-nav .md-nav .md-nav__link {
  padding-left: 0.35rem;
}

.md-sidebar--primary .md-nav__link .md-ellipsis,
.md-sidebar--secondary .md-nav__link .md-ellipsis,
.md-sidebar--primary .md-nav__title .md-ellipsis,
.md-sidebar--secondary .md-nav__title .md-ellipsis {
  color: inherit;
}

.md-typeset .admonition,
.md-typeset details,
.hero-callout,
.workflow-step,
.workflow-checklist {
  background: var(--aikozo-panel);
  border: 1px solid var(--aikozo-border-soft);
  border-radius: var(--aikozo-radius);
  box-shadow: var(--aikozo-shadow);
}

.hero-callout {
  padding: 1.4rem;
  margin-bottom: 1.4rem;
  position: relative;
  overflow: hidden;
}

.hero-callout::before,
.workflow-step::before,
.workflow-checklist::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--aikozo-accent-line), rgba(242, 168, 20, 0));
}

.hero-callout p:last-child {
  margin-bottom: 0;
}

.hero-kicker {
  color: var(--aikozo-accent);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem;
  font-weight: 700;
}

.grid.cards > ul > li,
.grid.cards > ol > li {
  background: var(--aikozo-panel);
  border: 1px solid var(--aikozo-border-soft);
  border-radius: var(--aikozo-radius);
  box-shadow: var(--aikozo-shadow);
  transition:
    background-color 160ms ease,
    color 160ms ease,
    transform 160ms ease;
}

.grid.cards > ul > li:hover,
.grid.cards > ol > li:hover {
  background: var(--aikozo-surface-raised);
  color: var(--aikozo-text);
  transform: translateX(2px);
}

.grid.cards strong {
  color: var(--aikozo-text);
}

.workflow-step,
.workflow-checklist {
  position: relative;
  padding: 1rem 1.1rem;
  margin: 1rem 0;
}

.workflow-step h3,
.workflow-checklist h3 {
  margin-top: 0;
}

.md-typeset table:not([class]) {
  border: 1px solid var(--aikozo-border-soft);
  border-radius: var(--aikozo-radius);
  overflow: hidden;
  box-shadow: var(--aikozo-shadow);
}

.md-typeset table:not([class]) th {
  background: var(--aikozo-accent-soft);
}

.md-typeset code {
  border-radius: 999px;
  border: 1px solid var(--aikozo-accent-border);
  background: var(--aikozo-accent-soft);
  color: var(--aikozo-accent-strong);
}

.md-typeset .md-button {
  border-radius: 999px;
}

.md-typeset .md-button--primary {
  background: var(--aikozo-accent-soft);
  border-color: var(--aikozo-accent-border);
  color: var(--aikozo-text);
}

.md-typeset .md-button--primary:hover {
  background: rgba(242, 168, 20, 0.2);
}

.caption {
  color: var(--aikozo-muted);
  font-size: 0.92rem;
}

.pill,
.status-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
}

.pill.status-new,
.status-badge.status-new {
  background: rgba(167, 160, 150, 0.2);
  color: #cbd5e1;
  border: 1px solid rgba(167, 160, 150, 0.4);
}

.pill.status-draft,
.status-badge.status-draft {
  background: var(--aikozo-accent-soft);
  color: var(--aikozo-accent);
  border: 1px solid var(--aikozo-accent-border);
}

.pill.status-final,
.status-badge.status-final {
  background: rgba(74, 222, 128, 0.15);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.4);
}

.pill.status-deferred,
.status-badge.status-deferred {
  background: rgba(167, 160, 150, 0.3);
  color: #111111;
  border: 1px solid #111111;
}

.pill.status-generated,
.status-badge.status-generated {
  background: rgba(74, 222, 128, 0.15);
  color: #4ade80;
  border: 1px solid rgba(74, 222, 128, 0.4);
}

.pill.status-enhancing,
.status-badge.status-enhancing {
  background: rgba(59, 130, 246, 0.18);
  color: #93c5fd;
  border: 1px dashed rgba(59, 130, 246, 0.6);
  font-weight: 800;
}

.pill.status-error,
.status-badge.status-error {
  background: rgba(239, 68, 68, 0.2);
  color: #fca5a5;
  border: 1px solid rgba(239, 68, 68, 0.6);
}

.pill.status-executing,
.pill.status-running,
.status-badge.status-executing,
.status-badge.status-running {
  background: rgba(56, 189, 248, 0.18);
  color: #38bdf8;
  border: 1px solid rgba(56, 189, 248, 0.5);
}

.pill.status-pr-created,
.status-badge.status-pr-created {
  background: rgba(250, 204, 21, 0.2);
  color: #facc15;
  border: 1px solid rgba(250, 204, 21, 0.5);
}

.pill.status-completed,
.status-badge.status-completed {
  background: rgba(34, 197, 94, 0.18);
  color: #4ade80;
  border: 1px solid rgba(34, 197, 94, 0.5);
}

.pill.status-failed,
.status-badge.status-failed {
  background: rgba(239, 68, 68, 0.18);
  color: #fca5a5;
  border: 1px solid rgba(239, 68, 68, 0.5);
}

.bookmark-ribbon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 20px;
  margin: 0 0.3rem -0.28rem 0.1rem;
  background: linear-gradient(180deg, var(--aikozo-accent-strong) 0%, var(--aikozo-accent) 100%);
  color: #1a130f;
  font-size: 10px;
  font-weight: 800;
  border: 1px solid rgba(245, 158, 11, 0.5);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 78%, 0 100%);
  box-shadow: 0 6px 16px rgba(217, 119, 6, 0.28);
  vertical-align: middle;
}

.bookmark-ribbon::before {
  content: "B";
  line-height: 1;
}