@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap");
[data-theme="light"] .text-themed {
  color: #343a40; }
[data-theme="dark"] .text-themed {
  color: rgba(255, 255, 255, 0.9); }

[data-theme="light"] .bg-themed {
  background-color: #f8f9fa; }
[data-theme="dark"] .bg-themed {
  background-color: #343a40; }

[data-theme="dark"] {
  /* Comment */
  /* Error */
  /* Escape */
  /* Generic */
  /* Keyword */
  /* Literal */
  /* Name */
  /* Operator */
  /* Other */
  /* Punctuation */
  /* Comment.Hashbang */
  /* Comment.Multiline */
  /* Comment.Preproc */
  /* Comment.PreprocFile */
  /* Comment.Single */
  /* Comment.Special */
  /* Generic.Deleted */
  /* Generic.Emph */
  /* Generic.Error */
  /* Generic.Heading */
  /* Generic.Inserted */
  /* Generic.Output */
  /* Generic.Prompt */
  /* Generic.Strong */
  /* Generic.Subheading */
  /* Generic.Traceback */
  /* Keyword.Constant */
  /* Keyword.Declaration */
  /* Keyword.Namespace */
  /* Keyword.Pseudo */
  /* Keyword.Reserved */
  /* Keyword.Type */
  /* Literal.Date */
  /* Literal.Number */
  /* Literal.String */
  /* Name.Attribute */
  /* Name.Builtin */
  /* Name.Class */
  /* Name.Constant */
  /* Name.Decorator */
  /* Name.Entity */
  /* Name.Exception */
  /* Name.Function */
  /* Name.Label */
  /* Name.Namespace */
  /* Name.Other */
  /* Name.Property */
  /* Name.Tag */
  /* Name.Variable */
  /* Operator.Word */
  /* Text.Whitespace */
  /* Literal.Number.Bin */
  /* Literal.Number.Float */
  /* Literal.Number.Hex */
  /* Literal.Number.Integer */
  /* Literal.Number.Oct */
  /* Literal.String.Affix */
  /* Literal.String.Backtick */
  /* Literal.String.Char */
  /* Literal.String.Delimiter */
  /* Literal.String.Doc */
  /* Literal.String.Double */
  /* Literal.String.Escape */
  /* Literal.String.Heredoc */
  /* Literal.String.Interpol */
  /* Literal.String.Other */
  /* Literal.String.Regex */
  /* Literal.String.Single */
  /* Literal.String.Symbol */
  /* Name.Builtin.Pseudo */
  /* Name.Function.Magic */
  /* Name.Variable.Class */
  /* Name.Variable.Global */
  /* Name.Variable.Instance */
  /* Name.Variable.Magic */
  /* Literal.Number.Integer.Long */ }
  [data-theme="dark"] .highlight .hll, [data-theme="dark"] pre .hll,
  [data-theme="dark"] code.highlighter-rouge .hll {
    background-color: #404040; }
  [data-theme="dark"] .highlight, [data-theme="dark"] pre,
  [data-theme="dark"] code.highlighter-rouge {
    background: #202020;
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .c, [data-theme="dark"] pre .c,
  [data-theme="dark"] code.highlighter-rouge .c {
    color: #999999;
    font-style: italic; }
  [data-theme="dark"] .highlight .err, [data-theme="dark"] pre .err,
  [data-theme="dark"] code.highlighter-rouge .err {
    color: #a61717;
    background-color: #e3d2d2; }
  [data-theme="dark"] .highlight .esc, [data-theme="dark"] pre .esc,
  [data-theme="dark"] code.highlighter-rouge .esc {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .g, [data-theme="dark"] pre .g,
  [data-theme="dark"] code.highlighter-rouge .g {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .k, [data-theme="dark"] pre .k,
  [data-theme="dark"] code.highlighter-rouge .k {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .l, [data-theme="dark"] pre .l,
  [data-theme="dark"] code.highlighter-rouge .l {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .n, [data-theme="dark"] pre .n,
  [data-theme="dark"] code.highlighter-rouge .n {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .o, [data-theme="dark"] pre .o,
  [data-theme="dark"] code.highlighter-rouge .o {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .x, [data-theme="dark"] pre .x,
  [data-theme="dark"] code.highlighter-rouge .x {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .p, [data-theme="dark"] pre .p,
  [data-theme="dark"] code.highlighter-rouge .p {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .ch, [data-theme="dark"] pre .ch,
  [data-theme="dark"] code.highlighter-rouge .ch {
    color: #999999;
    font-style: italic; }
  [data-theme="dark"] .highlight .cm, [data-theme="dark"] pre .cm,
  [data-theme="dark"] code.highlighter-rouge .cm {
    color: #999999;
    font-style: italic; }
  [data-theme="dark"] .highlight .cp, [data-theme="dark"] pre .cp,
  [data-theme="dark"] code.highlighter-rouge .cp {
    color: #cd2828;
    font-weight: bold; }
  [data-theme="dark"] .highlight .cpf, [data-theme="dark"] pre .cpf,
  [data-theme="dark"] code.highlighter-rouge .cpf {
    color: #999999;
    font-style: italic; }
  [data-theme="dark"] .highlight .c1, [data-theme="dark"] pre .c1,
  [data-theme="dark"] code.highlighter-rouge .c1 {
    color: #999999;
    font-style: italic; }
  [data-theme="dark"] .highlight .cs, [data-theme="dark"] pre .cs,
  [data-theme="dark"] code.highlighter-rouge .cs {
    color: #e50808;
    font-weight: bold;
    background-color: #520000; }
  [data-theme="dark"] .highlight .gd, [data-theme="dark"] pre .gd,
  [data-theme="dark"] code.highlighter-rouge .gd {
    color: #d22323; }
  [data-theme="dark"] .highlight .ge, [data-theme="dark"] pre .ge,
  [data-theme="dark"] code.highlighter-rouge .ge {
    color: #d0d0d0;
    font-style: italic; }
  [data-theme="dark"] .highlight .gr, [data-theme="dark"] pre .gr,
  [data-theme="dark"] code.highlighter-rouge .gr {
    color: #d22323; }
  [data-theme="dark"] .highlight .gh, [data-theme="dark"] pre .gh,
  [data-theme="dark"] code.highlighter-rouge .gh {
    color: #ffffff;
    font-weight: bold; }
  [data-theme="dark"] .highlight .gi, [data-theme="dark"] pre .gi,
  [data-theme="dark"] code.highlighter-rouge .gi {
    color: #589819; }
  [data-theme="dark"] .highlight .go, [data-theme="dark"] pre .go,
  [data-theme="dark"] code.highlighter-rouge .go {
    color: #cccccc; }
  [data-theme="dark"] .highlight .gp, [data-theme="dark"] pre .gp,
  [data-theme="dark"] code.highlighter-rouge .gp {
    color: #aaaaaa; }
  [data-theme="dark"] .highlight .gs, [data-theme="dark"] pre .gs,
  [data-theme="dark"] code.highlighter-rouge .gs {
    color: #d0d0d0;
    font-weight: bold; }
  [data-theme="dark"] .highlight .gu, [data-theme="dark"] pre .gu,
  [data-theme="dark"] code.highlighter-rouge .gu {
    color: #ffffff;
    text-decoration: underline; }
  [data-theme="dark"] .highlight .gt, [data-theme="dark"] pre .gt,
  [data-theme="dark"] code.highlighter-rouge .gt {
    color: #d22323; }
  [data-theme="dark"] .highlight .kc, [data-theme="dark"] pre .kc,
  [data-theme="dark"] code.highlighter-rouge .kc {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .kd, [data-theme="dark"] pre .kd,
  [data-theme="dark"] code.highlighter-rouge .kd {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .kn, [data-theme="dark"] pre .kn,
  [data-theme="dark"] code.highlighter-rouge .kn {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .kp, [data-theme="dark"] pre .kp,
  [data-theme="dark"] code.highlighter-rouge .kp {
    color: #6ab825; }
  [data-theme="dark"] .highlight .kr, [data-theme="dark"] pre .kr,
  [data-theme="dark"] code.highlighter-rouge .kr {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .kt, [data-theme="dark"] pre .kt,
  [data-theme="dark"] code.highlighter-rouge .kt {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .ld, [data-theme="dark"] pre .ld,
  [data-theme="dark"] code.highlighter-rouge .ld {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .m, [data-theme="dark"] pre .m,
  [data-theme="dark"] code.highlighter-rouge .m {
    color: #3677a9; }
  [data-theme="dark"] .highlight .s, [data-theme="dark"] pre .s,
  [data-theme="dark"] code.highlighter-rouge .s {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .na, [data-theme="dark"] pre .na,
  [data-theme="dark"] code.highlighter-rouge .na {
    color: #bbbbbb; }
  [data-theme="dark"] .highlight .nb, [data-theme="dark"] pre .nb,
  [data-theme="dark"] code.highlighter-rouge .nb {
    color: #24909d; }
  [data-theme="dark"] .highlight .nc, [data-theme="dark"] pre .nc,
  [data-theme="dark"] code.highlighter-rouge .nc {
    color: #447fcf;
    text-decoration: underline; }
  [data-theme="dark"] .highlight .no, [data-theme="dark"] pre .no,
  [data-theme="dark"] code.highlighter-rouge .no {
    color: #40ffff; }
  [data-theme="dark"] .highlight .nd, [data-theme="dark"] pre .nd,
  [data-theme="dark"] code.highlighter-rouge .nd {
    color: #ffa500; }
  [data-theme="dark"] .highlight .ni, [data-theme="dark"] pre .ni,
  [data-theme="dark"] code.highlighter-rouge .ni {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .ne, [data-theme="dark"] pre .ne,
  [data-theme="dark"] code.highlighter-rouge .ne {
    color: #bbbbbb; }
  [data-theme="dark"] .highlight .nf, [data-theme="dark"] pre .nf,
  [data-theme="dark"] code.highlighter-rouge .nf {
    color: #447fcf; }
  [data-theme="dark"] .highlight .nl, [data-theme="dark"] pre .nl,
  [data-theme="dark"] code.highlighter-rouge .nl {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .nn, [data-theme="dark"] pre .nn,
  [data-theme="dark"] code.highlighter-rouge .nn {
    color: #447fcf;
    text-decoration: underline; }
  [data-theme="dark"] .highlight .nx, [data-theme="dark"] pre .nx,
  [data-theme="dark"] code.highlighter-rouge .nx {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .py, [data-theme="dark"] pre .py,
  [data-theme="dark"] code.highlighter-rouge .py {
    color: #d0d0d0; }
  [data-theme="dark"] .highlight .nt, [data-theme="dark"] pre .nt,
  [data-theme="dark"] code.highlighter-rouge .nt {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .nv, [data-theme="dark"] pre .nv,
  [data-theme="dark"] code.highlighter-rouge .nv {
    color: #40ffff; }
  [data-theme="dark"] .highlight .ow, [data-theme="dark"] pre .ow,
  [data-theme="dark"] code.highlighter-rouge .ow {
    color: #6ab825;
    font-weight: bold; }
  [data-theme="dark"] .highlight .w, [data-theme="dark"] pre .w,
  [data-theme="dark"] code.highlighter-rouge .w {
    color: #666666; }
  [data-theme="dark"] .highlight .mb, [data-theme="dark"] pre .mb,
  [data-theme="dark"] code.highlighter-rouge .mb {
    color: #3677a9; }
  [data-theme="dark"] .highlight .mf, [data-theme="dark"] pre .mf,
  [data-theme="dark"] code.highlighter-rouge .mf {
    color: #3677a9; }
  [data-theme="dark"] .highlight .mh, [data-theme="dark"] pre .mh,
  [data-theme="dark"] code.highlighter-rouge .mh {
    color: #3677a9; }
  [data-theme="dark"] .highlight .mi, [data-theme="dark"] pre .mi,
  [data-theme="dark"] code.highlighter-rouge .mi {
    color: #3677a9; }
  [data-theme="dark"] .highlight .mo, [data-theme="dark"] pre .mo,
  [data-theme="dark"] code.highlighter-rouge .mo {
    color: #3677a9; }
  [data-theme="dark"] .highlight .sa, [data-theme="dark"] pre .sa,
  [data-theme="dark"] code.highlighter-rouge .sa {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .sb, [data-theme="dark"] pre .sb,
  [data-theme="dark"] code.highlighter-rouge .sb {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .sc, [data-theme="dark"] pre .sc,
  [data-theme="dark"] code.highlighter-rouge .sc {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .dl, [data-theme="dark"] pre .dl,
  [data-theme="dark"] code.highlighter-rouge .dl {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .sd, [data-theme="dark"] pre .sd,
  [data-theme="dark"] code.highlighter-rouge .sd {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .s2, [data-theme="dark"] pre .s2,
  [data-theme="dark"] code.highlighter-rouge .s2 {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .se, [data-theme="dark"] pre .se,
  [data-theme="dark"] code.highlighter-rouge .se {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .sh, [data-theme="dark"] pre .sh,
  [data-theme="dark"] code.highlighter-rouge .sh {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .si, [data-theme="dark"] pre .si,
  [data-theme="dark"] code.highlighter-rouge .si {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .sx, [data-theme="dark"] pre .sx,
  [data-theme="dark"] code.highlighter-rouge .sx {
    color: #ffa500; }
  [data-theme="dark"] .highlight .sr, [data-theme="dark"] pre .sr,
  [data-theme="dark"] code.highlighter-rouge .sr {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .s1, [data-theme="dark"] pre .s1,
  [data-theme="dark"] code.highlighter-rouge .s1 {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .ss, [data-theme="dark"] pre .ss,
  [data-theme="dark"] code.highlighter-rouge .ss {
    color: #ed9d13; }
  [data-theme="dark"] .highlight .bp, [data-theme="dark"] pre .bp,
  [data-theme="dark"] code.highlighter-rouge .bp {
    color: #24909d; }
  [data-theme="dark"] .highlight .fm, [data-theme="dark"] pre .fm,
  [data-theme="dark"] code.highlighter-rouge .fm {
    color: #447fcf; }
  [data-theme="dark"] .highlight .vc, [data-theme="dark"] pre .vc,
  [data-theme="dark"] code.highlighter-rouge .vc {
    color: #40ffff; }
  [data-theme="dark"] .highlight .vg, [data-theme="dark"] pre .vg,
  [data-theme="dark"] code.highlighter-rouge .vg {
    color: #40ffff; }
  [data-theme="dark"] .highlight .vi, [data-theme="dark"] pre .vi,
  [data-theme="dark"] code.highlighter-rouge .vi {
    color: #40ffff; }
  [data-theme="dark"] .highlight .vm, [data-theme="dark"] pre .vm,
  [data-theme="dark"] code.highlighter-rouge .vm {
    color: #40ffff; }
  [data-theme="dark"] .highlight .il, [data-theme="dark"] pre .il,
  [data-theme="dark"] code.highlighter-rouge .il {
    color: #3677a9; }
  [data-theme="dark"] pre,
  [data-theme="dark"] code.highlighter-rouge {
    border: none; }
  [data-theme="dark"] .gist {
    filter: invert(90%) hue-rotate(180deg); }
  [data-theme="dark"] table:not(.highlight) td {
    border-color: #242526; }
  [data-theme="dark"] table:not(.highlight) tr:nth-child(even) {
    background-color: #343a40; }

:root {
  --bg: #000;
  --surface: #151518;
  --line: rgba(255, 255, 255, 0.14);
  --text: rgba(255, 255, 255, 0.92);
  --text-dim: rgba(255, 255, 255, 0.62);
  --accent: var(--section-accent, #7c4f9b);
  --accent-text: color-mix(in srgb, var(--accent) 55%, white);
  --page-max: 1280px;
  --gutter: clamp(1rem, 4vw, 3rem);
  --band-gap: clamp(3.5rem, 8vw, 7rem); }

html {
  scrollbar-gutter: stable; }

body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  overflow-x: clip;
  background: var(--bg);
  color: var(--text);
  font-family: "Poppins", sans-serif;
  line-height: 1.6; }

a {
  color: var(--accent-text); }
  a:hover {
    color: #fff; }

body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100vw;
  height: 100vh;
  background: var(--bg) url("/docs/assets/images/site/background.png") center/cover no-repeat; }

.circuit-band {
  position: relative;
  isolation: isolate;
  background: #000; }
  .circuit-band::before, .circuit-band::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .circuit-band::before {
    z-index: -2;
    background: url("/docs/assets/images/site/background.png") right 38%/1440px auto no-repeat;
    filter: brightness(6); }
  .circuit-band::after {
    z-index: -1;
    background: var(--accent);
    mix-blend-mode: multiply; }

.page-header {
  margin-bottom: clamp(2rem, 4vw, 3rem);
  border-bottom: 1px solid var(--line); }

.page-header-inner {
  width: calc(min(100% - 2 * var(--gutter), var(--page-max)));
  margin: 0 auto; }

.page {
  flex: 1 0 auto;
  width: calc(min(100% - 2 * var(--gutter), var(--page-max)));
  margin: 0 auto;
  padding-bottom: var(--band-gap); }

.bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw); }

.band {
  margin-top: var(--band-gap); }

.page-title {
  margin: 0;
  padding: clamp(3rem, 8vw, 6.5rem) 0 clamp(2rem, 5vw, 4rem);
  font-size: clamp(2.75rem, 7vw, 5.5rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em; }

.section-heading {
  margin: 0 0 clamp(1.25rem, 2.5vw, 2rem);
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.01em; }
  .section-heading a {
    color: inherit;
    text-decoration: none; }

.eyebrow {
  display: block;
  color: var(--text-dim);
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase; }

.more-link {
  display: inline-block;
  margin-top: clamp(1.5rem, 3vw, 2.5rem);
  padding-bottom: 0.15rem;
  border-bottom: 2px solid var(--accent);
  color: var(--text);
  font-size: 1.25rem;
  font-weight: 600;
  text-decoration: none !important; }
  .more-link::after {
    content: "\2192";
    display: inline-block;
    margin-left: 0.5rem;
    transition: transform 200ms ease; }
  .more-link:hover::after {
    transform: translateX(0.3rem); }

.copy-placeholder {
  margin: 2rem 0;
  padding: 1.25rem 1.5rem;
  border: 3px dashed #ffcc00;
  background: rgba(255, 204, 0, 0.12);
  color: #ffcc00;
  font-family: monospace;
  font-size: 1.1rem;
  font-weight: 700; }

.text-primary {
  color: var(--accent-text) !important; }

.border-primary {
  border-color: var(--accent) !important; }

.bg-primary {
  background-color: var(--accent) !important; }

.btn,
.badge,
.card,
.form-control,
.input-group-text,
.list-group,
.list-group-item,
.progress {
  border-radius: 0 !important; }

.btn-primary,
.btn-outline-primary:hover,
.btn-outline-primary.active {
  border-color: var(--accent) !important;
  background-color: var(--accent) !important;
  color: #fff !important; }

.btn-outline-primary {
  border-color: var(--line);
  color: var(--text); }

.btn:focus,
.form-control:focus {
  box-shadow: none !important; }

.form-control {
  border-color: var(--line);
  background-color: var(--surface) !important;
  color: var(--text) !important; }
  .form-control:focus {
    border-color: var(--accent); }
  .form-control::placeholder {
    color: var(--text-dim) !important; }

.badge {
  font-weight: 500; }

.list-group-item {
  border-color: var(--line);
  background-color: var(--surface) !important;
  color: var(--text) !important; }
  .list-group-item.list-group-item-action:hover {
    background-color: var(--accent) !important; }

.bg-light,
.bg-light *,
.badge-light,
.badge-light * {
  color: #343a40 !important; }

.bg-dark,
.bg-dark *,
.badge-dark,
.badge-dark * {
  color: rgba(255, 255, 255, 0.9) !important; }

@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important; } }
.site-nav {
  position: sticky;
  top: 0;
  z-index: 1030;
  padding: 0;
  border-bottom: 1px solid var(--line);
  background: var(--bg); }

.site-nav-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: calc(min(100% - 2 * var(--gutter), var(--page-max)));
  min-height: 68px;
  margin: 0 auto; }

.site-logo {
  display: block;
  flex: 0 0 auto;
  width: 300px;
  height: 52px;
  margin-left: -48px;
  background: url("/docs/assets/images/site/header/title2.png") center/220px auto no-repeat; }

.site-nav-section {
  padding-left: 1rem;
  border-left: 2px solid var(--accent);
  color: var(--text);
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none !important; }

.site-nav .navbar-toggler {
  margin-left: auto;
  color: var(--text);
  font-size: 1.4rem; }

.site-nav .nav-link {
  position: relative;
  padding: 0.5rem 0 !important;
  color: var(--text-dim);
  font-size: 0.9rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  text-transform: uppercase; }
  .site-nav .nav-link:hover, .site-nav .nav-link.active {
    color: #fff; }
  .site-nav .nav-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0.2rem;
    width: 0;
    height: 2px;
    background: var(--accent);
    transition: width 200ms ease; }
  .site-nav .nav-link:hover::after, .site-nav .nav-link.active::after {
    width: 100%; }

@media (min-width: 992px) {
  .site-nav .navbar-nav {
    gap: 2rem; } }
@media (max-width: 980px) {
  .site-logo {
    width: 228px;
    height: 52px;
    margin-top: 4px;
    margin-left: -8px;
    margin-right: 16px;
    background-size: 225px auto; }

  .site-nav .navbar-collapse {
    flex-basis: 100%;
    padding: 0.5rem 0 1rem; }

  .site-nav .nav-link {
    display: inline-block;
    font-size: 1.1rem; } }
.site-footer {
  border-top: 1px solid var(--line); }
  .site-footer.circuit-band::before {
    background-position: center 72%; }

.site-footer-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem 3rem;
  width: calc(min(100% - 2 * var(--gutter), var(--page-max)));
  margin: 0 auto;
  padding: clamp(3rem, 7vw, 5.5rem) 0; }

.site-footer-family {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 2rem; }
  .site-footer-family a {
    color: var(--text-dim);
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none; }
    .site-footer-family a:hover {
      color: #fff; }
    .site-footer-family a.active {
      color: #fff;
      box-shadow: 0 2px 0 var(--accent); }

.site-footer-social {
  display: flex;
  gap: 1.25rem;
  font-size: 1.25rem; }
  .site-footer-social a {
    color: var(--text-dim); }
    .site-footer-social a:hover {
      color: var(--service-color, #fff); }

.site-footer-credit {
  flex-basis: 100%;
  color: var(--text-dim);
  font-size: 0.85rem; }

.hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: clamp(420px, 78vh, 860px);
  margin-bottom: 3rem; }

.hero-frame {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden; }

.hero-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; }

.hero-slides .hero-image {
  transform: translateX(100%); }
  .hero-slides .hero-image.is-showing {
    transform: none;
    transition: transform 900ms ease; }
  .hero-slides .hero-image.is-leaving {
    transform: translateX(-100%);
    transition: transform 900ms ease; }

.hero-intro {
  position: relative;
  display: flex;
  align-items: center;
  gap: clamp(1rem, 2.5vw, 2rem);
  max-width: calc(min(760px, 100% - var(--gutter)));
  margin-left: calc(max(var(--gutter), (100vw - var(--page-max)) / 2));
  margin-bottom: -3rem;
  padding: clamp(1.25rem, 3vw, 2.5rem);
  background: var(--bg);
  font-size: clamp(1.15rem, 1.9vw, 1.7rem);
  line-height: 1.3; }
  .hero-intro p {
    margin: 0; }
  .hero-intro b {
    display: block;
    margin-bottom: 0.4em;
    font-size: 1.6em;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -0.02em; }
  .hero-intro br + br {
    display: none; }
  .hero-intro .copy-placeholder {
    margin: 0;
    font-size: 1.1rem; }

.hero-intro-portrait {
  flex: 0 0 clamp(96px, 12vw, 168px); }
  .hero-intro-portrait .carousel-indicators,
  .hero-intro-portrait .carousel-control-prev,
  .hero-intro-portrait .carousel-control-next {
    display: none; }

@media (max-width: 575.98px) {
  .hero {
    height: clamp(420px, 70vh, 640px); }

  .hero-intro {
    max-width: 100%;
    margin-left: 0; } }
.feature {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  align-items: center;
  gap: clamp(1.5rem, 4vw, 4rem);
  margin-top: var(--band-gap);
  color: var(--text);
  text-decoration: none !important; }
  .feature:hover {
    color: var(--text); }
    .feature:hover .feature-image {
      transform: scale(1.03); }
    .feature:hover .feature-title {
      color: var(--accent-text); }
  .feature:nth-of-type(even) {
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
    .feature:nth-of-type(even) .feature-media {
      order: 2; }

.feature-media {
  overflow: hidden;
  aspect-ratio: 16 / 10;
  background: var(--surface); }

.feature-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms ease; }

.feature-title {
  margin: 0.5rem 0;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.02em;
  transition: color 200ms ease; }

.feature-heading {
  margin: 0 0 0.75rem;
  color: var(--text-dim);
  font-size: 1.15rem; }

.feature-text {
  margin: 0;
  font-size: clamp(1.05rem, 1.4vw, 1.3rem); }

.feature-meta {
  margin: 1.25rem 0 0;
  color: var(--text-dim);
  font-size: 0.9rem; }

@media (max-width: 767.98px) {
  .feature {
    gap: 1rem; }
    .feature, .feature:nth-of-type(even) {
      grid-template-columns: minmax(0, 1fr); }
    .feature:nth-of-type(even) .feature-media {
      order: 0; } }
.feature-others {
  margin-top: var(--band-gap); }

.media-pair {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  gap: 1.5rem; }
  .media-pair > iframe {
    width: 100%;
    height: 100%;
    min-height: 320px; }
  @media (max-width: 991.98px) {
    .media-pair {
      grid-template-columns: minmax(0, 1fr); } }

.tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 3rem 1.5rem; }

.tile-grid-row {
  grid-template-columns: repeat(4, minmax(0, 1fr)); }
  @media (max-width: 991.98px) {
    .tile-grid-row {
      grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.tile {
  display: block;
  color: var(--text);
  text-decoration: none !important; }
  .tile:hover {
    color: var(--text); }
    .tile:hover .tile-image {
      transform: scale(1.04); }
    .tile:hover .tile-title {
      color: var(--accent-text); }

.tile-media {
  overflow: hidden;
  aspect-ratio: 16 / 10;
  margin-bottom: 1rem;
  background: var(--surface); }

.tile-grid-square .tile-media {
  aspect-ratio: 1 / 1; }

.tile-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 400ms ease; }

.tile-title,
.markdown-body .tile-title {
  margin: 0.3rem 0 0.4rem;
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1.2;
  transition: color 200ms ease; }

.tile-text {
  margin: 0;
  color: var(--text-dim);
  font-size: 0.95rem; }

.tile-post {
  --tile-color: var(--accent); }
  .tile-post .tile-media {
    border-top: 4px solid var(--tile-color); }
  .tile-post:hover .tile-title {
    color: color-mix(in srgb, var(--tile-color) 60%, white); }

.tile-color-primary {
  --tile-color: #7c4f9b; }

.tile-color-secondary {
  --tile-color: #6c757d; }

.tile-color-success {
  --tile-color: #1ebd83; }

.tile-color-info {
  --tile-color: #17a2b8; }

.tile-color-warning {
  --tile-color: #ed9143; }

.tile-color-danger {
  --tile-color: #ac2445; }

.tile-project {
  margin-right: 0.75rem;
  color: color-mix(in srgb, var(--tile-color) 60%, white);
  font-weight: 600; }

@media (min-width: 640px) {
  .tile-cell-lead {
    grid-column: span 2; }
    .tile-cell-lead .tile-media {
      aspect-ratio: 16 / 9; }
    .tile-cell-lead .tile-title {
      font-size: clamp(1.6rem, 2.6vw, 2.2rem);
      line-height: 1.1; }
    .tile-cell-lead .tile-text {
      font-size: 1.1rem; } }
.filter-bar {
  margin-bottom: 2.5rem; }
  .filter-bar .input-group {
    gap: 0.5rem; }
  .filter-bar .input-group > * {
    margin: 0 !important; }
  .filter-bar .search-box {
    height: 3rem;
    padding: 0 1rem;
    font-size: 1.05rem; }
  .filter-bar .input-group .btn {
    height: 3rem;
    padding: 0 1.25rem; }
  @media (max-width: 575.98px) {
    .filter-bar .input-group-text {
      display: none; } }

.filter-panel {
  margin-top: 1rem;
  padding: 1.25rem;
  border: 1px solid var(--line);
  background: var(--surface); }

.filter-group + .filter-group {
  margin-top: 1.25rem; }

.filter-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem; }
  .filter-options label.btn {
    margin: 0;
    border: 1px solid var(--line) !important;
    background: transparent !important;
    color: var(--text) !important; }
    .filter-options label.btn:hover {
      border-color: var(--accent) !important; }
    .filter-options label.btn.active {
      border-color: var(--accent) !important;
      background: var(--accent) !important;
      color: #fff !important; }
    .filter-options label.btn input {
      display: none; }

.filter-quick {
  margin-top: 1.25rem; }

.filter-summary {
  margin: 1rem 0 0;
  color: var(--text-dim);
  font-size: 0.875rem; }

.show-row {
  display: grid;
  grid-template-columns: 64px 11rem 1fr auto;
  align-items: center;
  gap: 1.5rem;
  padding: 0.75rem 0.75rem 0.75rem 0;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  text-decoration: none !important; }
  .show-row:first-of-type {
    border-top: 1px solid var(--line); }
  .show-row:hover {
    background: var(--surface);
    color: var(--text); }

.show-row-image {
  width: 64px;
  height: 64px;
  object-fit: cover; }

.show-row-date,
.show-row-location {
  color: var(--text-dim);
  font-size: 0.9rem; }

.show-row-title {
  font-size: 1.1rem;
  font-weight: 600; }

.show-row-description {
  display: block;
  color: var(--text-dim);
  font-size: 0.9rem;
  font-weight: 400; }

.show-row-upcoming {
  grid-template-columns: 128px 11rem 1fr auto;
  padding: 1.25rem 1.25rem 1.25rem 0; }
  .show-row-upcoming .show-row-image {
    width: 128px;
    height: 128px; }
  .show-row-upcoming .show-row-title {
    font-size: clamp(1.25rem, 2.2vw, 1.9rem);
    line-height: 1.15; }
  .show-row-upcoming .show-row-date {
    color: var(--accent-text);
    font-size: 1rem;
    font-weight: 600; }

@media (max-width: 767.98px) {
  .show-row,
  .show-row-upcoming {
    grid-template-columns: 64px 1fr;
    column-gap: 1rem;
    row-gap: 0; }

  .show-row-image,
  .show-row-upcoming .show-row-image {
    grid-row: span 3;
    width: 64px;
    height: 64px; }

  .show-row:not(.show-row-upcoming) .show-row-description {
    display: none; } }
.prose {
  max-width: 1040px;
  margin: clamp(2rem, 5vw, 4rem) auto 0;
  font-size: 1.05rem; }

.post-header {
  margin-bottom: clamp(2rem, 4vw, 3rem);
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--line); }

.markdown-body .post-title {
  margin: 0 0 1rem;
  font-size: clamp(2.25rem, 5.5vw, 4rem); }

.post-metadata {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin: 0;
  color: var(--text-dim);
  font-size: 0.9rem; }

.markdown-body .post-tag {
  padding: 0.1rem 0.6rem;
  border: 1px solid var(--line);
  color: var(--text-dim);
  font-size: 0.8rem;
  text-decoration: none; }
  .markdown-body .post-tag:hover {
    border-color: var(--accent);
    background: var(--accent);
    color: #fff; }

.markdown-body h1 {
  margin: 0 0 0.5rem;
  font-size: clamp(2.5rem, 6vw, 4.5rem);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.02em; }
.markdown-body h2 {
  margin: clamp(3rem, 6vw, 4.5rem) 0 1.25rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--line);
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: -0.01em; }
.markdown-body h3 {
  margin: 2.5rem 0 0.75rem;
  font-size: 1.5rem;
  font-weight: 600; }
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
  margin: 2rem 0 0.5rem;
  font-size: 1.15rem;
  font-weight: 600; }
.markdown-body h2,
.markdown-body h3,
.markdown-body h4 {
  scroll-margin-top: 9rem; }
.markdown-body a {
  text-decoration: underline;
  text-decoration-color: var(--accent);
  text-decoration-thickness: 2px;
  text-underline-offset: 0.2em; }
.markdown-body hr {
  margin: 2.5rem 0;
  border: 0;
  border-top: 1px solid var(--line); }
.markdown-body hr + h2,
.markdown-body .post-header + h2,
.markdown-body .toc-nav + h2 {
  margin-top: 0;
  padding-top: 0;
  border-top: 0; }
.markdown-body img:not(.emoji) {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 1rem auto; }
.markdown-body iframe,
.markdown-body object {
  display: block;
  max-width: 100%;
  border: 0; }
.markdown-body blockquote {
  margin: 2rem 0;
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 3px solid var(--accent);
  color: var(--text-dim);
  font-size: 1.15rem; }
.markdown-body pre {
  display: block;
  max-width: 100%;
  margin-bottom: 1.6em;
  padding: 1em 1.5em;
  overflow: auto;
  font-family: monospace;
  font-size: 14px;
  line-height: 20px; }
.markdown-body code.highlighter-rouge {
  padding: 0.2em 0.5em; }
.markdown-body ul.task-list {
  padding-left: 24px;
  list-style: none; }
.markdown-body input.task-list-item-checkbox {
  margin-right: 10px;
  vertical-align: middle; }
.markdown-body table:not(.highlight) {
  display: block;
  margin: 1rem 0;
  overflow-x: auto; }
  .markdown-body table:not(.highlight) td,
  .markdown-body table:not(.highlight) th {
    padding: 8px 16px;
    border: 1px solid var(--line); }
  .markdown-body table:not(.highlight) th {
    background-color: var(--accent);
    color: #fff;
    font-weight: 500;
    text-align: left; }
.markdown-body .row {
  row-gap: 1.5rem;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem; }
  .markdown-body .row > .col {
    flex: 1 1 280px;
    min-width: 0; }
.markdown-body .figure-caption {
  margin-top: -0.25rem;
  color: var(--text-dim);
  font-size: 0.9rem;
  text-align: center; }
.markdown-body form {
  max-width: 720px; }
  .markdown-body form label {
    margin: 1rem 0 0.25rem;
    color: var(--text-dim);
    font-size: 0.9rem; }
  .markdown-body form input,
  .markdown-body form textarea {
    max-width: 100%;
    min-width: calc(min(100%, 320px));
    padding: 0.6rem 0.9rem;
    border: 1px solid var(--line);
    border-radius: 0;
    background: var(--surface);
    color: var(--text); }
    .markdown-body form input:focus,
    .markdown-body form textarea:focus {
      outline: none;
      border-color: var(--accent); }
  .markdown-body form button[type="submit"] {
    margin-top: 1rem;
    padding: 0.7rem 2rem;
    border: none;
    background: var(--accent);
    color: #fff;
    font-weight: 600; }
    .markdown-body form button[type="submit"]:hover {
      filter: brightness(1.15); }

.project-header {
  margin-bottom: 1.5rem; }
  .project-header p {
    margin: 0.5rem 0 0;
    color: var(--text-dim);
    font-size: 1.15rem; }
  .project-header img:not(.emoji) {
    float: none;
    width: auto;
    max-width: min(100%, 520px);
    max-height: 220px;
    margin: 0 0 1rem; }
  .project-header p > a:only-child {
    display: inline-block;
    margin-top: 0.75rem;
    padding: 0.7rem 1.5rem;
    background: var(--accent);
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none; }
    .project-header p > a:only-child:hover {
      filter: brightness(1.15); }

.post-header ~ .project-embed .project-header h1 {
  display: none; }

.toc-nav {
  position: sticky;
  top: 69px;
  z-index: 1020;
  display: flex;
  gap: 2rem;
  margin: 0 0 2.5rem;
  padding: 0.9rem 0;
  overflow-x: auto;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  background: var(--bg);
  white-space: nowrap; }
  .toc-nav a {
    color: var(--text-dim);
    font-size: 0.85rem;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    text-decoration: none; }
    .toc-nav a:hover {
      color: #fff; }

.project-intro {
  display: grid;
  grid-template-columns: minmax(0, 3fr) minmax(0, 2fr);
  align-items: start;
  gap: clamp(1.5rem, 4vw, 3rem);
  margin: 2rem 0; }
  @media (max-width: 767.98px) {
    .project-intro {
      grid-template-columns: minmax(0, 1fr); } }

.markdown-body .project-intro-media img {
  width: 100%;
  margin: 0; }

.project-intro-text {
  font-size: 1.1rem; }
  .project-intro-text > :last-child {
    margin-bottom: 0; }
  .project-intro-text img:not(.emoji) {
    max-width: min(100%, 280px);
    margin-left: 0; }

.link-buttons {
  margin: 1.5rem 0; }
  .link-buttons p {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin: 0; }
  .link-buttons a {
    padding: 0.65rem 1.4rem;
    border: 1px solid var(--line);
    color: var(--text);
    font-weight: 600;
    text-decoration: none; }
    .link-buttons a:hover {
      border-color: var(--accent);
      background: var(--accent);
      color: #fff; }

.video {
  position: relative;
  aspect-ratio: 16 / 9;
  margin: 1.5rem 0;
  background: #000; }
  .video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0; }

.video-poster {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: none;
  cursor: pointer; }
  .video-poster img, .markdown-body .video-poster img {
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    object-fit: cover;
    transition: transform 400ms ease; }
  .video-poster:hover img {
    transform: scale(1.03); }

.video-play {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 88px;
  height: 60px;
  transform: translate(-50%, -50%);
  background: var(--accent); }
  .video-play::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-40%, -50%);
    border-style: solid;
    border-width: 12px 0 12px 20px;
    border-color: transparent transparent transparent #fff; }

.media-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem;
  margin: 1.5rem 0; }
  .media-grid .video {
    margin: 0; }
  @media (max-width: 767.98px) {
    .media-grid {
      grid-template-columns: minmax(0, 1fr); } }

.steam-widget {
  width: 100%;
  height: 190px;
  margin: 1.5rem 0; }

.gallery {
  position: relative;
  margin: 1.5rem 0; }

.gallery-track {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: var(--line) transparent; }

.gallery-item {
  flex: 0 0 auto;
  scroll-snap-align: start;
  cursor: zoom-in; }
  .gallery-item img, .markdown-body .gallery-item img {
    display: block;
    width: auto;
    max-width: none;
    height: clamp(220px, 48vh, 520px);
    margin: 0; }

.gallery-button,
.lightbox-button {
  position: absolute;
  top: 50%;
  width: 48px;
  height: 64px;
  padding: 0;
  transform: translateY(-50%);
  border: 0;
  background: rgba(0, 0, 0, 0.75);
  cursor: pointer; }
  .gallery-button:hover,
  .lightbox-button:hover {
    background: var(--accent); }
  .gallery-button:disabled,
  .lightbox-button:disabled {
    display: none; }
  .gallery-button::after,
  .lightbox-button::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 14px;
    height: 14px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff; }

.gallery-prev {
  left: 0; }
  .gallery-prev::after {
    transform: translate(-30%, -50%) rotate(-135deg); }

.gallery-next {
  right: 0; }
  .gallery-next::after {
    transform: translate(-70%, -50%) rotate(45deg); }

.lightbox {
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.94); }
  .lightbox::backdrop {
    background: #000; }
  .lightbox[open] {
    display: flex;
    align-items: center;
    justify-content: center; }

.lightbox-image {
  max-width: calc(100vw - 8rem);
  max-height: calc(100vh - 6rem);
  object-fit: contain; }
  @media (max-width: 767.98px) {
    .lightbox-image {
      max-width: 100vw; } }

.lightbox-close {
  top: 0;
  right: 0;
  height: 48px;
  transform: none; }
  .lightbox-close::before, .lightbox-close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 22px;
    height: 3px;
    border: 0;
    background: #fff; }
  .lightbox-close::before {
    transform: translate(-50%, -50%) rotate(45deg); }
  .lightbox-close::after {
    transform: translate(-50%, -50%) rotate(-45deg); }

.lightbox-count {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  color: var(--text-dim);
  font-size: 0.9rem;
  letter-spacing: 0.1em; }

.release {
  max-width: 1040px;
  margin: clamp(2rem, 5vw, 4rem) auto 0; }

.release-header {
  margin-bottom: 1.5rem;
  text-align: center; }

.release-title {
  margin: 0.5rem 0 0;
  font-size: clamp(2.5rem, 7vw, 5rem);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.02em; }

.release-centerpiece .video {
  margin: 0; }

.markdown-body .release-body {
  margin: 2rem 0; }
  .markdown-body .release-body .section-heading {
    margin-top: 0;
    padding-top: 0;
    border-top: 0; }

.soundcloud-embed {
  display: block;
  width: calc(min(100%, 640px));
  height: auto;
  aspect-ratio: 1 / 1;
  margin: 0 auto;
  border: 0; }

.release-notes {
  max-width: 640px;
  margin: var(--band-gap) auto 0;
  padding-top: 2rem;
  border-top: 1px solid var(--line);
  font-size: 1.1rem;
  line-height: 1.7;
  overflow-wrap: anywhere; }
  .release-notes p {
    white-space: pre-line; }
  .release-notes > :last-child {
    margin-bottom: 0; }

.release-art {
  display: block;
  width: min(100%, 640px);
  margin: 0 auto; }

.release-links p {
  justify-content: center; }

.release-lyrics {
  margin-top: var(--band-gap);
  padding-top: 2rem;
  border-top: 1px solid var(--line); }
  .release-lyrics .section-heading {
    text-align: center; }

.lyrics {
  max-width: 34rem;
  margin: 0 auto;
  font-size: 1.2rem;
  line-height: 1.9;
  text-align: center; }
  .lyrics p {
    margin: 0 0 1.9em;
    white-space: pre-line; }
  .lyrics h2,
  .lyrics h3 {
    margin: 3.5rem 0 1.25rem;
    color: var(--accent-text);
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase; }
  .lyrics > :first-child {
    margin-top: 0; }

.about-intro {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  align-items: start;
  gap: clamp(1.5rem, 5vw, 4rem); }
  @media (max-width: 767.98px) {
    .about-intro {
      grid-template-columns: minmax(0, 1fr); } }

@media (min-width: 768px) {
  .about-portrait {
    position: sticky;
    top: calc(69px + 2rem); } }

.portrait {
  position: relative;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--surface); }
  .portrait img, .markdown-body .portrait img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    margin: 0;
    object-fit: cover;
    opacity: 0;
    transition: opacity 900ms ease; }
  .portrait img.is-showing {
    opacity: 1; }

.about-text {
  font-size: 1.1rem; }
  .about-text .about-lead {
    margin: 1.5rem 0;
    font-size: clamp(1.5rem, 2.6vw, 2.1rem);
    line-height: 1.2; }
  .about-text h3 {
    margin: 2.5rem 0 0.75rem;
    color: var(--text-dim);
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.14em;
    text-transform: uppercase; }
  .about-text .link-buttons {
    margin-top: 0; }

.skill-groups {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 2.5rem 2rem; }

.markdown-body .skill-group .eyebrow {
  margin: 0 0 1rem;
  font-size: 0.8rem;
  font-weight: 500;
  padding-bottom: 0.6rem;
  border-bottom: 1px solid var(--line); }

.skill-list {
  margin: 0;
  padding: 0;
  list-style: none; }
  .skill-list li {
    margin-bottom: 0.9rem; }

.skill-name {
  display: block;
  margin-bottom: 0.35rem;
  font-size: 0.95rem;
  line-height: 1.3; }

.skill-bar {
  position: relative;
  display: block;
  height: 3px;
  background: var(--line); }
  .skill-bar::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: var(--level, 0%);
    height: 100%;
    background: var(--accent); }

.timeline {
  margin: 0;
  padding: 0;
  list-style: none; }

.timeline-entry {
  display: grid;
  grid-template-columns: 11rem minmax(0, 1fr);
  gap: 0.5rem 2rem;
  padding: 1.75rem 0;
  border-top: 1px solid var(--line); }
  .timeline-entry:first-child {
    padding-top: 0;
    border-top: 0; }
  @media (max-width: 767.98px) {
    .timeline-entry {
      grid-template-columns: minmax(0, 1fr); } }

.timeline-dates {
  padding-top: 0.35rem;
  color: var(--text-dim);
  font-size: 0.9rem;
  letter-spacing: 0.06em; }

.markdown-body .timeline-role {
  margin: 0 0 0.4rem;
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 1.25; }

.timeline-project {
  margin: 0;
  color: var(--accent-text);
  font-weight: 600; }

.timeline-meta {
  margin: 0;
  color: var(--text-dim);
  font-size: 0.95rem; }

.timeline-points {
  margin: 0.75rem 0 0;
  padding-left: 1.1rem;
  list-style: disc; }
  .timeline-points li {
    margin-bottom: 0.3rem; }

.highlight .w, [data-theme="dark"] pre .w,
[data-theme="dark"] code.highlighter-rouge .w {
  color: #bbbbbb; }

/* Text.Whitespace */
.highlight .k, [data-theme="dark"] pre .k,
[data-theme="dark"] code.highlighter-rouge .k {
  color: #0000aa; }

/* Keyword */
.highlight .m, [data-theme="dark"] pre .m,
[data-theme="dark"] code.highlighter-rouge .m {
  color: #009999; }

/* Literal.Number */
.highlight .s, [data-theme="dark"] pre .s,
[data-theme="dark"] code.highlighter-rouge .s {
  color: #aa5500; }

/* Literal.String */
.highlight .c, [data-theme="dark"] pre .c,
[data-theme="dark"] code.highlighter-rouge .c {
  color: #aaaaaa;
  font-style: italic; }

/* Comment */
.highlight .cp, [data-theme="dark"] pre .cp,
[data-theme="dark"] code.highlighter-rouge .cp {
  color: #4c8317; }

/* Comment.Preproc */
.highlight .gd, [data-theme="dark"] pre .gd,
[data-theme="dark"] code.highlighter-rouge .gd {
  color: #aa0000; }

/* Generic.Deleted */
.highlight .gr, [data-theme="dark"] pre .gr,
[data-theme="dark"] code.highlighter-rouge .gr {
  color: #aa0000; }

/* Generic.Error */
.highlight .gi, [data-theme="dark"] pre .gi,
[data-theme="dark"] code.highlighter-rouge .gi {
  color: #00aa00; }

/* Generic.Inserted */
.highlight .go, [data-theme="dark"] pre .go,
[data-theme="dark"] code.highlighter-rouge .go {
  color: #888888; }

/* Generic.Output */
.highlight .gp, [data-theme="dark"] pre .gp,
[data-theme="dark"] code.highlighter-rouge .gp {
  color: #555555; }

/* Generic.Prompt */
.highlight .gt, [data-theme="dark"] pre .gt,
[data-theme="dark"] code.highlighter-rouge .gt {
  color: #aa0000; }

/* Generic.Traceback */
.highlight .kc, [data-theme="dark"] pre .kc,
[data-theme="dark"] code.highlighter-rouge .kc {
  color: #0000aa; }

/* Keyword.Constant */
.highlight .kd, [data-theme="dark"] pre .kd,
[data-theme="dark"] code.highlighter-rouge .kd {
  color: #0000aa; }

/* Keyword.Declaration */
.highlight .kn, [data-theme="dark"] pre .kn,
[data-theme="dark"] code.highlighter-rouge .kn {
  color: #0000aa; }

/* Keyword.Namespace */
.highlight .kp, [data-theme="dark"] pre .kp,
[data-theme="dark"] code.highlighter-rouge .kp {
  color: #0000aa; }

/* Keyword.Pseudo */
.highlight .kr, [data-theme="dark"] pre .kr,
[data-theme="dark"] code.highlighter-rouge .kr {
  color: #0000aa; }

/* Keyword.Reserved */
.highlight .kt, [data-theme="dark"] pre .kt,
[data-theme="dark"] code.highlighter-rouge .kt {
  color: #00aaaa; }

/* Keyword.Type */
.highlight .na, [data-theme="dark"] pre .na,
[data-theme="dark"] code.highlighter-rouge .na {
  color: #1e90ff; }

/* Name.Attribute */
.highlight .nb, [data-theme="dark"] pre .nb,
[data-theme="dark"] code.highlighter-rouge .nb {
  color: #00aaaa; }

/* Name.Builtin */
.highlight .nc, [data-theme="dark"] pre .nc,
[data-theme="dark"] code.highlighter-rouge .nc {
  color: #00aa00; }

/* Name.Class */
.highlight .no, [data-theme="dark"] pre .no,
[data-theme="dark"] code.highlighter-rouge .no {
  color: #aa0000; }

/* Name.Constant */
.highlight .nd, [data-theme="dark"] pre .nd,
[data-theme="dark"] code.highlighter-rouge .nd {
  color: #888888; }

/* Name.Decorator */
.highlight .nf, [data-theme="dark"] pre .nf,
[data-theme="dark"] code.highlighter-rouge .nf {
  color: #00aa00; }

/* Name.Function */
.highlight .nn, [data-theme="dark"] pre .nn,
[data-theme="dark"] code.highlighter-rouge .nn {
  color: #00aaaa; }

/* Name.Namespace */
.highlight .nv, [data-theme="dark"] pre .nv,
[data-theme="dark"] code.highlighter-rouge .nv {
  color: #aa0000; }

/* Name.Variable */
.highlight .ow, [data-theme="dark"] pre .ow,
[data-theme="dark"] code.highlighter-rouge .ow {
  color: #0000aa; }

/* Operator.Word */
.highlight .mb, [data-theme="dark"] pre .mb,
[data-theme="dark"] code.highlighter-rouge .mb {
  color: #009999; }

/* Literal.Number.Bin */
.highlight .mf, [data-theme="dark"] pre .mf,
[data-theme="dark"] code.highlighter-rouge .mf {
  color: #009999; }

/* Literal.Number.Float */
.highlight .mh, [data-theme="dark"] pre .mh,
[data-theme="dark"] code.highlighter-rouge .mh {
  color: #009999; }

/* Literal.Number.Hex */
.highlight .mi, [data-theme="dark"] pre .mi,
[data-theme="dark"] code.highlighter-rouge .mi {
  color: #009999; }

/* Literal.Number.Integer */
.highlight .mo, [data-theme="dark"] pre .mo,
[data-theme="dark"] code.highlighter-rouge .mo {
  color: #009999; }

/* Literal.Number.Oct */
.highlight .sa, [data-theme="dark"] pre .sa,
[data-theme="dark"] code.highlighter-rouge .sa {
  color: #aa5500; }

/* Literal.String.Affix */
.highlight .sb, [data-theme="dark"] pre .sb,
[data-theme="dark"] code.highlighter-rouge .sb {
  color: #aa5500; }

/* Literal.String.Backtick */
.highlight .sc, [data-theme="dark"] pre .sc,
[data-theme="dark"] code.highlighter-rouge .sc {
  color: #aa5500; }

/* Literal.String.Char */
.highlight .dl, [data-theme="dark"] pre .dl,
[data-theme="dark"] code.highlighter-rouge .dl {
  color: #aa5500; }

/* Literal.String.Delimiter */
.highlight .sd, [data-theme="dark"] pre .sd,
[data-theme="dark"] code.highlighter-rouge .sd {
  color: #aa5500; }

/* Literal.String.Doc */
.highlight .s2, [data-theme="dark"] pre .s2,
[data-theme="dark"] code.highlighter-rouge .s2 {
  color: #aa5500; }

/* Literal.String.Double */
.highlight .se, [data-theme="dark"] pre .se,
[data-theme="dark"] code.highlighter-rouge .se {
  color: #aa5500; }

/* Literal.String.Escape */
.highlight .sh, [data-theme="dark"] pre .sh,
[data-theme="dark"] code.highlighter-rouge .sh {
  color: #aa5500; }

/* Literal.String.Heredoc */
.highlight .si, [data-theme="dark"] pre .si,
[data-theme="dark"] code.highlighter-rouge .si {
  color: #aa5500; }

/* Literal.String.Interpol */
.highlight .sx, [data-theme="dark"] pre .sx,
[data-theme="dark"] code.highlighter-rouge .sx {
  color: #aa5500; }

/* Literal.String.Other */
.highlight .sr, [data-theme="dark"] pre .sr,
[data-theme="dark"] code.highlighter-rouge .sr {
  color: #009999; }

/* Literal.String.Regex */
.highlight .s1, [data-theme="dark"] pre .s1,
[data-theme="dark"] code.highlighter-rouge .s1 {
  color: #aa5500; }

/* Literal.String.Single */
.highlight .ss, [data-theme="dark"] pre .ss,
[data-theme="dark"] code.highlighter-rouge .ss {
  color: #0000aa; }

/* Literal.String.Symbol */
.highlight .bp, [data-theme="dark"] pre .bp,
[data-theme="dark"] code.highlighter-rouge .bp {
  color: #00aaaa; }

/* Name.Builtin.Pseudo */
.highlight .fm, [data-theme="dark"] pre .fm,
[data-theme="dark"] code.highlighter-rouge .fm {
  color: #00aa00; }

/* Name.Function.Magic */
.highlight .vc, [data-theme="dark"] pre .vc,
[data-theme="dark"] code.highlighter-rouge .vc {
  color: #aa0000; }

/* Name.Variable.Class */
.highlight .vg, [data-theme="dark"] pre .vg,
[data-theme="dark"] code.highlighter-rouge .vg {
  color: #aa0000; }

/* Name.Variable.Global */
.highlight .vi, [data-theme="dark"] pre .vi,
[data-theme="dark"] code.highlighter-rouge .vi {
  color: #aa0000; }

/* Name.Variable.Instance */
.highlight .vm, [data-theme="dark"] pre .vm,
[data-theme="dark"] code.highlighter-rouge .vm {
  color: #aa0000; }

/* Name.Variable.Magic */
.highlight .il, [data-theme="dark"] pre .il,
[data-theme="dark"] code.highlighter-rouge .il {
  color: #009999; }

/* Literal.Number.Integer.Long */
.highlight .ge, [data-theme="dark"] pre .ge,
[data-theme="dark"] code.highlighter-rouge .ge {
  font-style: italic; }

/* Generic.Emph */
.highlight .gs, [data-theme="dark"] pre .gs,
[data-theme="dark"] code.highlighter-rouge .gs {
  font-weight: bold; }

/* Generic.Strong */
.highlight .c1, [data-theme="dark"] pre .c1,
[data-theme="dark"] code.highlighter-rouge .c1 {
  color: #aaaaaa;
  font-style: italic; }

/* Comment.Single */
.highlight .cs, [data-theme="dark"] pre .cs,
[data-theme="dark"] code.highlighter-rouge .cs {
  color: #0000aa;
  font-style: italic; }

/* Comment.Special */
.highlight .ch, [data-theme="dark"] pre .ch,
[data-theme="dark"] code.highlighter-rouge .ch {
  color: #aaaaaa;
  font-style: italic; }

/* Comment.Hashbang */
.highlight .cm, [data-theme="dark"] pre .cm,
[data-theme="dark"] code.highlighter-rouge .cm {
  color: #aaaaaa;
  font-style: italic; }

/* Comment.Multiline */
.highlight .gh, [data-theme="dark"] pre .gh,
[data-theme="dark"] code.highlighter-rouge .gh {
  color: #000080;
  font-weight: bold; }

/* Generic.Heading */
.highlight .gu, [data-theme="dark"] pre .gu,
[data-theme="dark"] code.highlighter-rouge .gu {
  color: #800080;
  font-weight: bold; }

/* Generic.Subheading */
.highlight .ni, [data-theme="dark"] pre .ni,
[data-theme="dark"] code.highlighter-rouge .ni {
  color: #880000;
  font-weight: bold; }

/* Name.Entity */
.highlight .nt, [data-theme="dark"] pre .nt,
[data-theme="dark"] code.highlighter-rouge .nt {
  color: #1e90ff;
  font-weight: bold; }

/* Name.Tag */
.highlight .err, [data-theme="dark"] pre .err,
[data-theme="dark"] code.highlighter-rouge .err {
  color: #FF0000; }

/* Error */
.highlight .cpf, [data-theme="dark"] pre .cpf,
[data-theme="dark"] code.highlighter-rouge .cpf {
  color: #aaaaaa;
  font-style: italic; }

/* Comment.PreprocFile */
.hub {
  margin: 0;
  background: #000; }

.hub-home {
  position: absolute;
  top: 1rem;
  left: var(--gutter);
  z-index: 1; }

.hub-panels {
  display: flex;
  height: 100vh;
  height: 100svh; }

.hub-panel {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-decoration: none;
  transition: flex-grow 300ms ease; }
  .hub-panel:hover, .hub-panel:focus-visible {
    flex-grow: 1.6;
    color: #fff;
    text-decoration: none; }
    .hub-panel:hover .hub-panel-image, .hub-panel:focus-visible .hub-panel-image {
      filter: brightness(0.8); }

.hub-panel-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.4);
  transition: filter 300ms ease; }

.hub-panel-title {
  position: relative;
  font-size: clamp(1.5rem, 3vw, 3.25rem);
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.7); }

@media (max-width: 767.98px) {
  .hub-panels {
    flex-direction: column; } }
@media (prefers-reduced-motion: reduce) {
  .hub-panel,
  .hub-panel-image {
    transition: none; } }
@font-face {
  font-family: "Kouncil Serif";
  src: url("/docs/kouncil/manual/fonts/LiberationSerif-Bold.ttf");
  font-weight: 700;
  font-display: swap; }
@font-face {
  font-family: "Kouncil Serif";
  src: url("/docs/kouncil/manual/fonts/LiberationSerif-Regular.ttf");
  font-weight: 400;
  font-display: swap; }
@font-face {
  font-family: "Kouncil Sans";
  src: url("/docs/kouncil/manual/fonts/LiberationSans-Regular.ttf");
  font-weight: 400;
  font-display: swap; }
@font-face {
  font-family: "Kouncil Sans";
  src: url("/docs/kouncil/manual/fonts/LiberationSans-Bold.ttf");
  font-weight: 700;
  font-display: swap; }
@font-face {
  font-family: "Kouncil Mono";
  src: url("/docs/kouncil/manual/fonts/LiberationMono-Regular.ttf");
  font-weight: 400;
  font-display: swap; }
@font-face {
  font-family: "Kouncil Mono";
  src: url("/docs/kouncil/manual/fonts/LiberationMono-Bold.ttf");
  font-weight: 700;
  font-display: swap; }
@font-face {
  font-family: "Kouncil Taylor";
  src: url("/docs/kouncil/manual/fonts/Patrick_Hand/PatrickHand-Regular.ttf");
  font-display: swap; }
@font-face {
  font-family: "Kouncil Vexie";
  src: url("/docs/assets/fonts/Coming_Soon/ComingSoon-Regular.ttf");
  font-display: swap; }
@font-face {
  font-family: "Kouncil Kate";
  src: url("/docs/kouncil/manual/fonts/Architects_Daughter/ArchitectsDaughter-Regular.ttf");
  font-display: swap; }
@font-face {
  font-family: "Kouncil K0ndukt0r";
  src: url("/docs/kouncil/manual/fonts/Share_Tech/ShareTech-Regular.ttf");
  font-display: swap; }
.kp {
  --kp-bg: #0e0e0e;
  --kp-panel: #1c1c1e;
  --kp-line: #424242;
  --kp-text: #f2f2f2;
  --kp-muted: #b3a6cc;
  --kp-gold: #f1ca87;
  --kp-listener: #e39c62;
  --kp-casual: #f1ca87;
  --kp-engineer: #5fc27a;
  --kp-robot: #a988df;
  --kp-speech: "Kouncil Vexie", "Comic Sans MS", cursive;
  --kp-serif: "Kouncil Serif", Georgia, serif;
  --kp-sans: "Kouncil Sans", Arial, sans-serif;
  --kp-mono: "Kouncil Mono", Consolas, monospace;
  --kp-ease: cubic-bezier(.2, .7, .2, 1);
  --band-gap: clamp(2.5rem, 5vw, 4.5rem);
  color: var(--kp-text);
  font-family: var(--kp-sans); }
  .kp h1, .kp h2, .kp h3 {
    font-family: var(--kp-serif);
    color: #fff;
    font-weight: 700;
    letter-spacing: 0; }
  .kp h2 {
    font-size: clamp(1.5rem, 2.2vw, 1.9rem);
    line-height: 1.15;
    margin: 0 0 1rem; }
  .kp img {
    max-width: 100%;
    height: auto; }

.kp-listener {
  --kp-speech: "Kouncil Taylor", cursive;
  --who: var(--kp-listener); }

.kp-casual {
  --kp-speech: "Kouncil Vexie", cursive;
  --who: var(--kp-casual); }

.kp-engineer {
  --kp-speech: "Kouncil Kate", cursive;
  --who: var(--kp-engineer); }

.kp-robot {
  --kp-speech: "Kouncil K0ndukt0r", monospace;
  --who: var(--kp-robot); }

.kp-bleed {
  width: 100vw;
  margin-left: calc(50% - 50vw); }

.kp-bleed .kp-col {
  width: calc(min(100% - 2 * var(--gutter), var(--page-max)));
  margin-left: auto;
  margin-right: auto; }

.kp-kicker {
  margin: 0 0 0.6rem;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--kp-muted); }

.kp-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.25rem;
  margin-top: 2rem; }

.kp-button {
  display: inline-block;
  padding: 0.85rem 1.6rem;
  background: var(--kp-gold);
  color: #141414;
  font-weight: 600;
  text-decoration: none;
  transition: background 120ms var(--kp-ease); }
  .kp-button:hover {
    color: #141414;
    text-decoration: none;
    background: #f7dcab; }
  .kp-button.kp-ghost {
    background: transparent;
    color: var(--kp-text);
    box-shadow: inset 0 0 0 1px var(--kp-line); }
    .kp-button.kp-ghost:hover {
      color: #fff;
      box-shadow: inset 0 0 0 1px var(--kp-gold); }

body:has(.kp)::before {
  display: none; }

.kp-stage {
  position: fixed;
  inset: 0;
  z-index: -1;
  background: var(--kp-bg);
  pointer-events: none; }

.kp-stage-clip {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 900ms var(--kp-ease); }
  .kp-stage-clip.is-on {
    opacity: 1; }

.kp-stage-dim {
  position: absolute;
  inset: 0;
  background: var(--kp-bg);
  opacity: var(--dim, 0.6);
  transition: opacity 700ms var(--kp-ease); }

.kp-hero {
  --kp-above: 13.5rem;
  position: relative;
  padding: 1.5rem 0 0; }

.kp-hero-top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem 2rem; }
  .kp-hero-top .kp-actions {
    margin: 0; }

.kp-masthead {
  display: flex;
  align-items: center;
  gap: clamp(0.9rem, 2vw, 1.5rem); }

.kp-logo {
  flex: none;
  width: clamp(110px, 10vw, 150px);
  aspect-ratio: 900 / 475;
  background: var(--kp-gold);
  -webkit-mask: var(--logo) center/contain no-repeat;
  mask: var(--logo) center/contain no-repeat; }

.kp-title {
  margin: 0;
  padding: 0.1em 0 0.1em clamp(0.9rem, 2vw, 1.5rem);
  border-left: 2px solid var(--kp-gold);
  font-size: clamp(1.35rem, 2.1vw, 1.85rem);
  line-height: 1.15; }
  .kp-title span {
    display: block;
    color: var(--kp-gold); }

.kp-hero-meta {
  color: var(--kp-muted);
  font-size: 0.9rem; }

.kp-hero-stage {
  position: relative;
  width: min(1240px, 92vw, calc((100svh - var(--kp-above)) * 1880 / 1050));
  margin: 1.25rem auto 0;
  perspective: 1600px; }

.kp-hero-shot {
  display: block;
  width: 100%;
  border: 1px solid var(--kp-line);
  transform-origin: 50% 0;
  transform: rotateX(calc(var(--p, 0) * 22deg)) scale(calc(1 - var(--p, 0) * 0.06)); }

.kp-hero-peek {
  position: absolute;
  z-index: 3;
  width: clamp(80px, 9vw, 140px);
  bottom: -2%;
  transform: translateY(calc(var(--p, 0) * 50%)); }

.kp-peek-1 {
  left: -9%; }

.kp-peek-2 {
  right: -9%; }

[data-cycle] {
  display: grid; }

[data-cycle] > * {
  grid-area: 1 / 1;
  transition: opacity 600ms var(--kp-ease), transform 600ms var(--kp-ease); }

[data-cycle]:not(.is-cycling) > :not(:first-child),
[data-cycle].is-cycling > :not(.is-on) {
  opacity: 0;
  transform: translateX(16px);
  pointer-events: none; }

.kp-hero-row {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
  margin-top: var(--band-gap); }

.kp-lede {
  max-width: 36rem;
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.55;
  color: #d8d8d8; }

.kp-welcome-one {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  margin: 0; }
  .kp-welcome-one img {
    flex: none;
    width: clamp(140px, 15vw, 210px);
    aspect-ratio: 420 / 740;
    object-fit: contain;
    object-position: bottom; }
  .kp-welcome-one .kp-says-bubble {
    flex: 1;
    font-size: 1.3rem; }

.kp-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: var(--band-gap) 0;
  border-top: 1px solid var(--kp-line);
  border-bottom: 1px solid var(--kp-line); }

.kp-stat {
  padding: 1.25rem; }
  .kp-stat + .kp-stat {
    border-left: 1px solid var(--kp-line); }
  .kp-stat b {
    display: block;
    font-family: var(--kp-mono);
    font-size: clamp(1.7rem, 2.6vw, 2.2rem);
    line-height: 1;
    color: #fff;
    font-variant-numeric: tabular-nums; }
  .kp-stat span {
    display: block;
    margin-top: 0.6rem;
    color: var(--kp-muted);
    font-size: 0.95rem;
    line-height: 1.4; }

.kp[data-voice="listener"] .kp-voiced:not([data-voice="listener"]),
.kp[data-voice="casual"] .kp-voiced:not([data-voice="casual"]),
.kp[data-voice="engineer"] .kp-voiced:not([data-voice="engineer"]),
.kp[data-voice="robot"] .kp-voiced:not([data-voice="robot"]) {
  display: none; }

@keyframes kp-pop {
  from {
    opacity: 0;
    transform: translateY(8px) scale(0.98); } }
.kp-cast {
  position: relative;
  padding: var(--band-gap) 0;
  margin-bottom: var(--band-gap); }

.kp-cast-inner {
  text-align: center; }

.kp-cast-lede {
  max-width: 40rem;
  margin: 0 auto;
  color: #d0c8e0; }

.kp-cast-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(1rem, 3vw, 2.5rem);
  margin-top: 3rem; }

.kp-member {
  display: block;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: center;
  cursor: pointer; }

.kp-member-cap {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  padding-top: 1rem;
  border-top: 2px solid var(--who); }
  .kp-member-cap b {
    font-family: var(--kp-serif);
    font-size: 1.15rem;
    color: #fff; }
  .kp-member-cap span {
    color: var(--who);
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.04em; }
  .kp-member-cap q {
    margin-top: 0.6rem;
    font-family: var(--kp-speech);
    font-size: 1.25rem;
    color: var(--kp-text);
    quotes: none; }

.kp-member-art {
  position: relative;
  display: block;
  aspect-ratio: 420 / 740; }
  .kp-member-art img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: bottom;
    transition: opacity 250ms var(--kp-ease); }

.kp-member-happy {
  opacity: 0; }

.kp-member:hover .kp-member-calm, .kp-member[aria-pressed="true"] .kp-member-calm {
  opacity: 0; }
.kp-member:hover .kp-member-happy, .kp-member[aria-pressed="true"] .kp-member-happy {
  opacity: 1; }

.kp-member {
  transition: opacity 250ms var(--kp-ease); }

.kp-cast-row:has([aria-pressed="true"]) .kp-member[aria-pressed="false"]:not(:hover) {
  opacity: 0.55; }

.kp-member[aria-pressed="true"] .kp-member-cap {
  border-top-width: 4px;
  padding-top: calc(1rem - 2px); }

.kp-member:focus-visible {
  outline: 2px solid var(--who);
  outline-offset: 4px; }

.kp-cast-scene {
  display: block;
  width: min(1100px, 92vw);
  margin: 4rem auto 0;
  border: 1px solid var(--kp-line); }

.kp-voices {
  position: fixed;
  left: 50%;
  bottom: 1rem;
  z-index: 1020;
  display: none;
  align-items: center;
  gap: 0.5rem 1rem;
  padding: 0.45rem 0.5rem 0.45rem 0.9rem;
  background: var(--kp-bg);
  box-shadow: inset 0 0 0 1px var(--kp-line);
  transform: translate(-50%, calc(100% + 1.5rem));
  transition: transform 350ms var(--kp-ease); }
  .kp-voices.is-shown {
    transform: translate(-50%, 0); }

.kp-js .kp-voices {
  display: flex; }

.kp-voices-label {
  color: var(--kp-muted);
  font-size: 0.85rem;
  white-space: nowrap; }

.kp-voices-options {
  display: flex;
  gap: 0.25rem; }

.kp-voices button {
  --who: var(--kp-gold);
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.25rem 0.75rem 0.25rem 0.25rem;
  border: 0;
  background: transparent;
  color: var(--kp-muted);
  font: inherit;
  font-size: 0.85rem;
  white-space: nowrap;
  cursor: pointer;
  transition: background 200ms var(--kp-ease), color 200ms var(--kp-ease); }
  .kp-voices button img {
    width: 1.9rem;
    height: 1.9rem;
    object-fit: cover;
    object-position: top;
    background: var(--kp-panel);
    filter: grayscale(1) brightness(0.8);
    transition: filter 200ms var(--kp-ease); }
  .kp-voices button:hover {
    color: #fff; }
    .kp-voices button:hover img {
      filter: none; }
  .kp-voices button[aria-pressed="true"] {
    color: #141414;
    background: var(--who); }
    .kp-voices button[aria-pressed="true"] img {
      filter: none; }
  .kp-voices button[data-voice="listener"] {
    --who: var(--kp-listener); }
  .kp-voices button[data-voice="casual"] {
    --who: var(--kp-casual); }
  .kp-voices button[data-voice="engineer"] {
    --who: var(--kp-engineer); }
  .kp-voices button[data-voice="robot"] {
    --who: var(--kp-robot); }

.kp-says {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin: 1.25rem 0 0;
  animation: kp-pop 420ms var(--kp-ease) both; }

.kp-says-face {
  flex: none;
  width: 3.75rem;
  height: 3.75rem;
  object-fit: cover;
  object-position: top;
  background: var(--kp-panel);
  box-shadow: inset 0 0 0 1px var(--who); }

.kp-says-bubble {
  position: relative;
  flex: 1;
  margin: 0.4rem 0 0;
  padding: 1.1rem 1.25rem 1rem;
  border: 1px solid var(--who);
  border-radius: 18px;
  background: var(--kp-panel);
  font-family: var(--kp-speech);
  font-size: 1.15rem;
  line-height: 1.45; }
  .kp-says-bubble::before {
    content: "";
    position: absolute;
    left: -8px;
    top: 1.3rem;
    width: 14px;
    height: 14px;
    background: var(--kp-panel);
    border-left: 1px solid var(--who);
    border-bottom: 1px solid var(--who);
    transform: rotate(45deg); }

.kp-says-name {
  position: absolute;
  left: 1.1rem;
  bottom: 100%;
  margin-bottom: 0.2rem;
  font-family: var(--kp-sans);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--who); }

.kp-feature {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
  min-height: min(80vh, 760px);
  margin-bottom: var(--band-gap);
  --side: 1; }
  .kp-feature.kp-flip {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    --side: -1; }
    .kp-feature.kp-flip .kp-feature-copy {
      order: 2; }

.kp-feature-media {
  margin: 0;
  opacity: calc(var(--p, 1) * 5);
  transform: translateX(calc(max(0, 0.3 - var(--p, 0.5)) * var(--side) * 220px)) translateY(calc((0.5 - var(--p, 0.5)) * 60px)); }
  .kp-feature-media img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: min(80vh, 720px);
    margin: 0 auto;
    border: 1px solid var(--kp-line); }

.kp-section-head {
  max-width: 46rem;
  margin-bottom: 2.5rem; }
  .kp-section-head p:not(.kp-kicker) {
    color: #d0c8e0; }

.kp-charts {
  margin-bottom: var(--band-gap); }

.kp-chart-wall {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  align-items: start;
  padding: 2rem 0; }

.kp-chart-col {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  transform: translateY(calc((var(--p, 0.5) - 0.5) * var(--drift, 0px) * 2)); }

.kp-chart {
  position: relative;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--kp-line); }
  .kp-chart img {
    display: block;
    width: 100%; }
  .kp-chart figcaption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0.5rem 0.75rem;
    background: var(--kp-bg);
    border-top: 1px solid var(--kp-line);
    font-size: 0.85rem;
    font-weight: 700;
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 250ms var(--kp-ease), transform 250ms var(--kp-ease); }
  .kp-chart:hover figcaption {
    opacity: 1;
    transform: none; }

.kp-skins {
  display: grid;
  grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
  margin-bottom: var(--band-gap); }
  .kp-skins .kp-skins-copy > p:not(.kp-kicker) {
    color: #d0c8e0; }

.kp-skin-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px;
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none; }
  .kp-skin-list button {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
    padding: 0.4rem 0.7rem;
    border: 0;
    background: var(--s-bg);
    color: var(--s-fg);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    font: inherit;
    font-size: 0.9rem;
    text-align: left;
    cursor: pointer; }
    .kp-skin-list button::before {
      content: "";
      flex: none;
      width: 0.55em;
      height: 0.55em;
      background: var(--s-ac);
      opacity: 0.35; }
    .kp-skin-list button[aria-pressed="true"] {
      font-weight: 700; }
      .kp-skin-list button[aria-pressed="true"]::before {
        opacity: 1; }

.kp-skin-stack {
  position: relative;
  aspect-ratio: 16 / 11;
  perspective: 1800px; }

.kp-skin {
  --spread: calc(0.2 + var(--p, 1) * 0.8);
  --lift: 0px;
  position: absolute;
  left: 0;
  top: 30%;
  width: 68%;
  border: 1px solid var(--kp-line);
  z-index: calc(40 - var(--i));
  filter: brightness(0.6);
  transform-origin: left center;
  transform: translate3d(calc(var(--i) * var(--spread) * 2.3%), calc(var(--i) * var(--spread) * -3.4%), calc(var(--i) * var(--spread) * -30px + var(--lift))) rotateY(-24deg) rotateX(4deg);
  transition: filter 250ms var(--kp-ease), transform 350ms var(--kp-ease); }
  .kp-skin.is-front {
    z-index: 50;
    filter: none;
    --lift: 70px; }

.kp-hood {
  margin-bottom: var(--band-gap); }

.kp-hood-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 0;
  border-top: 1px solid var(--kp-line); }
  .kp-hood-list > div {
    padding: 1.5rem 1.5rem 1.5rem 0;
    border-bottom: 1px solid var(--kp-line); }
  .kp-hood-list dt {
    color: #fff;
    font-weight: 600;
    margin-bottom: 0.4rem; }
  .kp-hood-list dt::before {
    content: "\2192\00a0";
    color: var(--kp-gold); }
  .kp-hood-list dd {
    margin: 0;
    color: #cfc6de;
    line-height: 1.55; }
  .kp-hood-list code {
    font-family: var(--kp-mono);
    color: var(--kp-text);
    background: none;
    padding: 0; }

.kp-specs {
  margin-bottom: var(--band-gap); }

.kp-spec-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2.5rem 3rem; }

.kp-spec-group h3 {
  margin: 0 0 0.6rem;
  font-family: var(--kp-sans);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--kp-muted); }
.kp-spec-group dl {
  margin: 0;
  border-top: 1px solid var(--kp-line); }
.kp-spec-group dl > div {
  display: grid;
  grid-template-columns: 9.5rem minmax(0, 1fr);
  gap: 1rem;
  padding: 0.65rem 0;
  border-bottom: 1px solid var(--kp-line); }
.kp-spec-group dt {
  color: #fff;
  font-weight: 600; }
.kp-spec-group dd {
  margin: 0;
  color: #cfc6de;
  line-height: 1.5; }

.kp-req table {
  width: 100%;
  border-collapse: collapse;
  background: none;
  font-size: 1rem; }
.kp-req tr {
  background: none !important;
  border-bottom: 1px solid var(--kp-line); }
.kp-req thead tr {
  border-top: 1px solid var(--kp-line); }
.kp-req th, .kp-req td {
  border: 0 !important;
  padding: 0.65rem 1rem 0.65rem 0;
  text-align: left;
  vertical-align: top;
  line-height: 1.5; }
.kp-req thead th {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--kp-muted);
  padding-top: 0.5rem;
  padding-bottom: 0.5rem; }
.kp-req tbody th {
  width: 7rem;
  color: #fff;
  font-weight: 600; }
.kp-req td {
  color: #cfc6de; }

.kp-pricing {
  margin-bottom: var(--band-gap); }

.kp-plans {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--kp-line);
  border-bottom: 1px solid var(--kp-line); }

.kp-plan {
  display: flex;
  flex-direction: column;
  padding: 2rem 2.5rem 2.25rem 0; }
  .kp-plan + .kp-plan {
    padding-left: 2.5rem;
    border-left: 1px solid var(--kp-line); }
  .kp-plan h3 {
    margin: 0;
    font-size: 1.3rem; }
  .kp-plan .kp-button {
    align-self: flex-start; }

.kp-plan-full {
  box-shadow: inset 0 3px 0 var(--kp-gold); }

.kp-plan-price {
  margin: 0.5rem 0 0; }
  .kp-plan-price b {
    font-family: var(--kp-mono);
    font-size: clamp(1.8rem, 2.8vw, 2.3rem);
    line-height: 1;
    color: #fff;
    font-variant-numeric: tabular-nums; }
  .kp-plan-price s {
    margin-right: 0.4rem;
    font-size: 1.3rem;
    color: var(--kp-muted); }
  .kp-plan-price span {
    margin-left: 0.4rem;
    color: var(--kp-muted);
    font-size: 0.9rem; }

.kp-plan-for {
  margin: 0.6rem 0 1.25rem;
  color: #cfc6de; }

.kp-plan-notes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 2rem;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
  color: var(--kp-muted);
  font-size: 0.9rem; }

.kp-compare {
  --kp-mark-col: 7.5rem;
  margin: 2.5rem 0 0; }

.kp-compare-head,
.kp-compare-group summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--kp-mark-col) var(--kp-mark-col);
  align-items: baseline; }

.kp-compare-head {
  padding: 0.6rem 0;
  border-bottom: 1px solid var(--kp-line);
  font-family: var(--kp-serif);
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff; }
  .kp-compare-head span + span {
    text-align: center; }
  .kp-compare-head span:first-child {
    font-family: var(--kp-sans);
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--kp-muted); }

.kp-compare-group {
  border-bottom: 1px solid var(--kp-line); }
  .kp-compare-group summary {
    padding: 0.8rem 0;
    cursor: pointer;
    list-style: none; }
    .kp-compare-group summary::-webkit-details-marker {
      display: none; }
    .kp-compare-group summary span:first-child {
      display: flex;
      align-items: center;
      gap: 0.6rem;
      font-family: var(--kp-serif);
      font-size: 1.05rem;
      font-weight: 700;
      color: #fff; }
      .kp-compare-group summary span:first-child::before {
        content: "";
        flex: none;
        border-left: 0.4rem solid var(--kp-muted);
        border-top: 0.28rem solid transparent;
        border-bottom: 0.28rem solid transparent;
        transition: transform 150ms var(--kp-ease); }
    .kp-compare-group summary span + span {
      text-align: center;
      font-family: var(--kp-mono);
      font-size: 0.85rem;
      color: var(--kp-muted); }
    .kp-compare-group summary:hover span:first-child {
      color: var(--kp-gold); }
  .kp-compare-group[open] summary span:first-child::before {
    transform: rotate(90deg); }
  .kp-compare-group table {
    width: 100%;
    margin: 0 0 0.75rem;
    border-collapse: collapse;
    font-size: 0.95rem;
    background: none; }
  .kp-compare-group tr {
    background: none !important;
    border-top: 1px solid rgba(255, 255, 255, 0.06); }
  .kp-compare-group th {
    padding: 0.5rem 1rem 0.5rem 1rem;
    font-weight: 400;
    color: var(--kp-text);
    text-align: left;
    border: 0 !important; }
  .kp-compare-group td {
    width: var(--kp-mark-col);
    padding: 0.5rem;
    text-align: center;
    vertical-align: middle;
    border: 0 !important; }

.kp-yes {
  display: inline-block;
  width: 0.4rem;
  height: 0.8rem;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: translateY(-0.1rem) rotate(45deg); }

.kp-no {
  display: inline-block;
  width: 0.6rem;
  height: 1px;
  background: #6a6a70;
  vertical-align: middle; }

.kp-part {
  color: var(--kp-muted);
  font-size: 0.85rem;
  white-space: nowrap; }

.kp-get {
  position: relative;
  padding: calc(var(--band-gap) * 1.5) 0; }

.kp-get-inner {
  width: calc(min(100% - 2 * var(--gutter), 46rem));
  margin: 0 auto;
  text-align: center; }
  .kp-get-inner h2 {
    font-size: clamp(1.7rem, 2.6vw, 2.2rem); }
  .kp-get-inner p {
    color: #d0c8e0;
    font-size: 1.05rem; }
  .kp-get-inner .kp-actions {
    justify-content: center; }
  .kp-get-inner .kp-get-cycle {
    margin-top: 3.5rem;
    text-align: left; }
  .kp-get-inner .kp-says {
    margin-top: 0; }

.kp-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem 3rem;
  padding: var(--band-gap) 0;
  margin-bottom: calc(-1 * var(--band-gap));
  border-top: 1px solid var(--kp-line); }
  .kp-links h3 {
    margin: 0 0 0.6rem;
    font-family: var(--kp-sans);
    font-size: 0.8rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--kp-muted); }
  .kp-links ul {
    margin: 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--kp-line); }
  .kp-links li {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.15rem 1rem;
    padding: 0.65rem 0;
    border-bottom: 1px solid var(--kp-line); }
  .kp-links a {
    color: #fff;
    font-weight: 600;
    text-decoration: none; }
  .kp-links a:hover {
    color: var(--kp-gold); }
  .kp-links li span {
    color: var(--kp-muted);
    font-size: 0.85rem; }

.kp-js .kp-reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 450ms var(--kp-ease), transform 450ms var(--kp-ease); }
  .kp-js .kp-reveal.is-in {
    opacity: 1;
    transform: none; }

@media (max-width: 900px) {
  .kp-hero-row {
    grid-template-columns: minmax(0, 1fr); }

  .kp-hero {
    --kp-above: 16rem; }

  .kp-feature, .kp-feature.kp-flip {
    grid-template-columns: minmax(0, 1fr);
    min-height: 0; }

  .kp-feature.kp-flip .kp-feature-copy {
    order: 0; }

  .kp-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .kp-stat:nth-child(3) {
    border-left: 0; }

  .kp-stat:nth-child(n + 3) {
    border-top: 1px solid var(--kp-line); }

  .kp-cast-row {
    grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .kp-hood-list {
    grid-template-columns: minmax(0, 1fr); }

  .kp-spec-groups {
    grid-template-columns: minmax(0, 1fr); }

  .kp-skins {
    grid-template-columns: minmax(0, 1fr); }

  .kp-links {
    grid-template-columns: minmax(0, 1fr); }

  .kp-hero-peek {
    display: none; } }
@media (max-width: 760px) {
  .kp-plans {
    grid-template-columns: minmax(0, 1fr); }

  .kp-plan {
    padding-right: 0; }

  .kp-plan + .kp-plan {
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid var(--kp-line); }

  .kp-plan-full {
    padding-top: 2.25rem; } }
@media (max-width: 560px) {
  .kp-masthead {
    gap: 0.9rem; }

  .kp-logo {
    width: 96px; }

  .kp-title {
    font-size: 1.5rem;
    padding-left: 0.9rem; }

  .kp-spec-group dl > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.15rem; }

  .kp-says-bubble {
    font-size: 1.15rem; }

  .kp-chart-wall {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.5rem; }

  .kp-chart-col {
    gap: 0.5rem; }

  .kp-compare {
    --kp-mark-col: 4.6rem;
    font-size: 0.9rem; }

  .kp-compare-group summary span + span {
    white-space: nowrap;
    font-size: 0.8rem; }

  .kp-compare-group th {
    padding-left: 0; }

  .kp-voices {
    left: 0;
    right: 0;
    bottom: 0;
    justify-content: center;
    padding: 0.4rem;
    transform: translateY(100%); }

  .kp-voices.is-shown {
    transform: none; }

  .kp-voices-label, .kp-voices button span {
    display: none; }

  .kp-voices button {
    padding: 0.25rem; }

  .kp {
    padding-bottom: 3.5rem; } }
@media (prefers-reduced-motion: reduce) {
  .kp-says {
    animation: none; }

  [data-cycle] > * {
    transition: none; }

  .kp-js .kp-reveal {
    opacity: 1;
    transform: none;
    transition: none; }

  .kp-stage-clip, .kp-stage-dim, .kp-voices {
    transition: none; } }
.kp-human {
  position: relative;
  padding: var(--band-gap) 0;
  margin-bottom: var(--band-gap); }

.kp-human-inner {
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(2rem, 6vw, 6rem);
  align-items: center; }

.kp-human-photo {
  position: relative;
  margin: 0; }
  .kp-human-photo img {
    position: relative;
    display: block;
    width: 100%;
    border: 1px solid var(--kp-line); }

.kp-human-note {
  position: absolute;
  top: -1.6rem;
  right: -1.5rem;
  font-family: var(--kp-speech);
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  color: var(--kp-gold);
  transform: rotate(6deg);
  white-space: nowrap; }
  .kp-human-note svg {
    position: absolute;
    top: 100%;
    right: 1.5rem;
    width: 5.5rem;
    height: auto; }

.kp-human-copy h2 {
  font-size: clamp(1.7rem, 2.6vw, 2.2rem);
  line-height: 1.15; }

.kp-strike {
  position: relative;
  color: var(--kp-muted);
  white-space: nowrap; }
  .kp-strike svg {
    position: absolute;
    left: -4%;
    top: 30%;
    width: 108%;
    height: 50%;
    overflow: visible; }

.kp-strike path,
.kp-human-note path {
  fill: none;
  stroke: var(--kp-gold);
  stroke-width: 3px;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 1;
  stroke-dashoffset: 0; }

.kp-js .kp-human-inner .kp-strike path, .kp-js .kp-human-inner .kp-human-note path {
  stroke-dashoffset: 1;
  transition: stroke-dashoffset 700ms var(--kp-ease); }
.kp-js .kp-human-inner .kp-strike path {
  transition-delay: 400ms; }
.kp-js .kp-human-inner .kp-human-note path {
  transition-delay: 1100ms; }
.kp-js .kp-human-inner.is-in .kp-strike path, .kp-js .kp-human-inner.is-in .kp-human-note path {
  stroke-dashoffset: 0; }

.kp-human-lede {
  max-width: 38rem;
  color: #d8d8d8;
  font-size: 1.05rem; }

.kp-human-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2rem;
  margin: 2rem 0 0;
  border-top: 1px solid var(--kp-line); }
  .kp-human-list > div {
    padding: 1rem 0;
    border-bottom: 1px solid var(--kp-line); }
  .kp-human-list dt {
    color: #fff;
    font-weight: 600;
    margin-bottom: 0.25rem; }
  .kp-human-list dd {
    margin: 0;
    color: #cfc6de;
    line-height: 1.5;
    font-size: 0.95rem; }

.kp-human-sign {
  margin: 2.25rem 0 0;
  font-family: var(--kp-speech);
  font-size: clamp(2.2rem, 4vw, 3.2rem);
  line-height: 1.5;
  color: var(--kp-gold); }
  .kp-human-sign span {
    display: block;
    margin-bottom: clamp(1.4rem, 2.6vw, 2.2rem);
    line-height: 1.4;
    font-family: var(--kp-sans);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--kp-muted); }

.kp-human .kp-says {
  max-width: 34rem;
  margin-top: 2rem; }

@media (max-width: 900px) {
  .kp-human-inner {
    grid-template-columns: minmax(0, 1fr); }

  .kp-human-photo {
    max-width: 26rem;
    margin: 1.5rem auto 0; }

  .kp-human-note {
    right: 0.75rem;
    font-size: 1.4rem; } }
@media (max-width: 560px) {
  .kp-human-list {
    grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) {
  .kp-js .kp-human-inner .kp-strike path,
  .kp-js .kp-human-inner .kp-human-note path {
    stroke-dashoffset: 0;
    transition: none; } }
.kp-apply {
  max-width: 44rem;
  margin: 0 auto;
  padding: clamp(2rem, 5vw, 3.5rem) 0 var(--band-gap); }
  .kp-apply h1 {
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    margin: 0.4rem 0 0.8rem; }
  .kp-apply .kp-says {
    margin: 1.5rem 0 0.5rem; }

.kp-apply-back {
  color: var(--kp-muted);
  font-size: 0.9rem; }

.kp-apply-lede {
  color: #cfcfcf;
  font-size: 1.05rem;
  line-height: 1.55;
  margin: 0; }

.kp-form {
  margin-top: 1.5rem; }
  .kp-form fieldset {
    border: 0;
    border-top: 1px solid var(--kp-line);
    margin: 0;
    padding: 1.4rem 0 0.6rem; }
  .kp-form legend {
    font-family: var(--kp-serif);
    font-weight: 700;
    font-size: 1.2rem;
    color: #fff;
    padding: 0 0 0.6rem;
    float: left;
    width: 100%; }
  .kp-form legend + * {
    clear: both; }
  .kp-form label {
    display: block;
    margin: 0 0 1rem;
    color: var(--kp-text);
    font-size: 0.95rem; }
  .kp-form label > span {
    display: block;
    color: var(--kp-muted);
    font-size: 0.85rem; }
  .kp-form input[type="text"], .kp-form input[type="email"], .kp-form input[type="url"], .kp-form textarea {
    display: block;
    width: 100%;
    margin-top: 0.35rem;
    padding: 0.55rem 0.7rem;
    background: var(--kp-panel);
    border: 1px solid var(--kp-line);
    border-radius: 0;
    color: #fff;
    font: 1rem var(--kp-sans); }
    .kp-form input[type="text"]::placeholder, .kp-form input[type="email"]::placeholder, .kp-form input[type="url"]::placeholder, .kp-form textarea::placeholder {
      color: #6f6f78; }
    .kp-form input[type="text"]:focus, .kp-form input[type="email"]:focus, .kp-form input[type="url"]:focus, .kp-form textarea:focus {
      outline: none;
      border-color: var(--kp-gold); }
  .kp-form textarea {
    resize: vertical; }
  .kp-form input[type="radio"], .kp-form input[type="checkbox"] {
    accent-color: var(--kp-gold);
    margin: 0 0.5rem 0 0; }
  .kp-form button {
    margin-top: 1rem;
    border: 0;
    cursor: pointer; }
  .kp-form button:disabled {
    opacity: 0.6;
    cursor: default; }

.kp-form-q {
  margin: 0 0 0.4rem;
  font-size: 0.95rem; }

.kp-form-note {
  margin: 0 0 1rem;
  color: var(--kp-muted);
  font-size: 0.9rem;
  line-height: 1.5; }

.kp-form-choices {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr));
  gap: 0.15rem 1.5rem;
  margin: 0 0 1.1rem; }
  .kp-form-choices label {
    margin: 0;
    padding: 0.3rem 0; }

.kp-form-check {
  padding: 0.2rem 0; }

.kp-form-trap {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  opacity: 0; }

.kp-form-status {
  margin-top: 1rem;
  color: #fff;
  font-size: 1.05rem; }

.cls-1 {
  fill: #ffc541; }

.cls-2 {
  fill: #4e4066; }

.cls-3 {
  fill: #6f5b92; }

.cls-4 {
  fill: #f78d5e; }

.cls-5 {
  fill: #fa976c; }

.cls-6 {
  fill: #b65c32;
  opacity: 0.6; }

.cls-7 {
  fill: #b65c32;
  opacity: 0.4; }

.cls-8 {
  fill: #b65c32; }

.cls-9 {
  fill: #f4b73b; }

.cls-10 {
  opacity: 0.6; }

.cls-11 {
  fill: #f9c358; }

.cls-12 {
  fill: #9b462c; }

.cls-13 {
  fill: #aa512e; }

.cls-14 {
  fill: #7d6aa5; }

/* animations */
.wheel {
  animation: wheel-rotate 6s ease infinite;
  transform-origin: center;
  transform-box: fill-box; }

@keyframes wheel-rotate {
  50% {
    transform: rotate(360deg);
    animation-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); }
  100% {
    transform: rotate(960deg); } }
.clock-hand-1 {
  animation: clock-rotate 3s linear infinite;
  transform-origin: bottom;
  transform-box: fill-box; }

.clock-hand-2 {
  animation: clock-rotate 6s linear infinite;
  transform-origin: bottom;
  transform-box: fill-box; }

@keyframes clock-rotate {
  100% {
    transform: rotate(360deg); } }
#box-top {
  animation: box-top-anim 2s linear infinite;
  transform-origin: right top;
  transform-box: fill-box; }

@keyframes box-top-anim {
  50% {
    transform: rotate(-5deg); } }
#umbrella {
  animation: umbrella-anim 6s linear infinite;
  transform-origin: center;
  transform-box: fill-box; }

@keyframes umbrella-anim {
  25% {
    transform: translateY(10px) rotate(5deg); }
  75% {
    transform: rotate(-5deg); } }
#cup {
  animation: cup-rotate 3s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
  transform-origin: top left;
  transform-box: fill-box; }

@keyframes cup-rotate {
  50% {
    transform: rotate(-5deg); } }
#pillow {
  animation: pillow-anim 3s linear infinite;
  transform-origin: center;
  transform-box: fill-box; }

@keyframes pillow-anim {
  25% {
    transform: rotate(10deg) translateY(5px); }
  75% {
    transform: rotate(-10deg); } }
#stripe {
  animation: stripe-anim 3s linear infinite;
  transform-origin: center;
  transform-box: fill-box; }

@keyframes stripe-anim {
  25% {
    transform: translate(10px, 0) rotate(-10deg); }
  75% {
    transform: translateX(10px); } }
#bike {
  animation: bike-anim 6s ease infinite; }

@keyframes bike-anim {
  0% {
    transform: translateX(-1300px); }
  50% {
    transform: translateX(0);
    animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715); }
  100% {
    transform: translateX(1300px); } }
#rucksack {
  animation: ruck-anim 3s linear infinite;
  transform-origin: top;
  transform-box: fill-box; }

@keyframes ruck-anim {
  50% {
    transform: rotate(5deg); } }
.circle {
  animation: circle-anim ease infinite;
  transform-origin: center;
  transform-box: fill-box;
  perspective: 0px; }

.circle.c1 {
  animation-duration: 2s; }

.circle.c2 {
  animation-duration: 3s; }

.circle.c3 {
  animation-duration: 1s; }

.circle.c4 {
  animation-duration: 1s; }

.circle.c5 {
  animation-duration: 2s; }

.circle.c6 {
  animation-duration: 3s; }

@keyframes circle-anim {
  50% {
    transform: scale(0.2) rotateX(360deg) rotateY(360deg); } }
.four,
#ou {
  animation: four-anim cubic-bezier(0.39, 0.575, 0.565, 1) infinite; }

.four.a {
  transform-origin: bottom left;
  animation-duration: 3s;
  transform-box: fill-box; }

.four.b {
  transform-origin: bottom right;
  animation-duration: 3s;
  transform-box: fill-box; }

#ou {
  animation-duration: 6s;
  transform-origin: center;
  transform-box: fill-box; }

@keyframes four-anim {
  50% {
    transform: scale(0.98); } }