/* Extracted page styles for dota1. */

/* community.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* community.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* community.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* community.html */
.column {
      max-width: 680px;
      margin: 0 auto;
      padding: 96px 24px 64px;
      color: var(--color-text);
      font-size: 19px;
      line-height: 1.75;
    }

    .column > * {
      max-width: 100%;
    }

    .column section {
      height: auto;
      margin: 0;
      padding: 0;
    }

    .column h1,
    .column h2,
    .column h3 {
      color: var(--color-text);
      font-weight: 800;
      letter-spacing: -0.015em;
    }

    .column h1 {
      margin: 0 0 24px;
      font-size: 44px;
      line-height: 1.2;
    }

    .column h2 {
      margin: 0 0 24px;
      font-size: 28px;
      line-height: 1.3;
    }

    .column p,
    .column li {
      margin: 0 0 24px;
    }

    .column .kicker {
      margin: 0 0 16px;
      color: var(--color-primary);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }

    .column .lede {
      margin-bottom: 24px;
      color: var(--color-muted);
      font-size: 22px;
      line-height: 1.6;
    }

    .column .textlink {
      color: var(--color-primary);
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 4px;
    }

    .column .textlink:hover {
      color: var(--color-accent);
    }

    .column hr {
      margin: 72px 0;
      border: 0;
      border-top: 1px solid var(--color-border);
    }

    .column ol,
    .column ul {
      padding-left: 1.2em;
    }

    .column li {
      padding-left: 0.2em;
    }

    .column li::marker {
      color: var(--color-primary);
      font-weight: 700;
    }

    .column strong {
      color: var(--color-text);
      font-weight: 800;
    }

    .column form {
      margin-top: 28px;
    }

    .column form label {
      display: block;
      margin-bottom: 8px;
      font-size: 15px;
      font-weight: 700;
    }

    .column form input {
      display: block;
      width: 100%;
      margin: 0 0 20px;
      padding: 14px 18px;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: var(--color-surface);
      color: var(--color-text);
      font: inherit;
    }

    .column form input:focus {
      outline: 2px solid var(--color-primary);
      outline-offset: 2px;
    }

    .column .btn {
      display: inline-flex;
      align-items: center;
      min-height: 56px;
      padding: 14px 26px;
      border: 0;
      border-radius: 24px;
      background: var(--color-accent);
      color: var(--color-on-accent);
      font: inherit;
      font-size: 16px;
      font-weight: 800;
      cursor: pointer;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
      transition: transform 0.25s ease;
    }

    .column .btn:hover {
      transform: translateY(-8px);
    }

    .column .privacy-note {
      margin-top: 20px;
      color: var(--color-muted);
      font-size: 15px;
    }

    @media (max-width: 720px) {
      .column {
        padding: 56px 20px 48px;
        font-size: 17px;
      }

      .column h1 {
        font-size: 34px;
      }

      .column h2 {
        font-size: 24px;
      }

      .column .lede {
        font-size: 19px;
      }

      .column hr {
        margin: 48px 0;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .column .btn {
        transition: none;
      }

      .column .btn:hover {
        transform: none;
      }
    }

/* community.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* game-library.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* game-library.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* game-library.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* game-library.html */
.column {
      max-width: 680px;
      margin: 0 auto;
      padding: 96px 24px 64px;
      color: var(--color-text);
      font-size: 19px;
      line-height: 1.75;
    }

    .column > * {
      max-width: 100%;
    }

    .column section {
      height: auto;
      margin: 0;
      padding: 0;
    }

    .column h1,
    .column h2,
    .column h3 {
      color: var(--color-text);
      font-weight: 800;
      letter-spacing: -0.015em;
    }

    .column h1 {
      margin: 0 0 24px;
      font-size: 44px;
      line-height: 1.2;
    }

    .column h2 {
      margin: 0 0 24px;
      font-size: 28px;
      line-height: 1.3;
    }

    .column h3 {
      margin: 0 0 8px;
      font-size: 20px;
      line-height: 1.4;
    }

    .column p,
    .column li {
      margin: 0 0 24px;
    }

    .column .kicker {
      margin: 0 0 16px;
      color: var(--color-primary);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }

    .column .lede {
      margin-bottom: 18px;
      color: var(--color-muted);
      font-size: 22px;
      line-height: 1.6;
    }

    .column .textlink {
      color: var(--color-primary);
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 4px;
    }

    .column .textlink:hover {
      color: var(--color-accent);
    }

    .column hr {
      margin: 72px 0;
      border: 0;
      border-top: 1px solid var(--color-border);
    }

    .column .plainlist {
      padding-left: 1.2em;
    }

    .column .plainlist li {
      margin-bottom: 24px;
      padding-left: 4px;
    }

    .column .catalog-list {
      padding: 0;
      list-style: none;
    }

    .column .catalog-list li {
      margin: 0;
      padding: 20px 0;
      border-bottom: 1px solid var(--color-border);
    }

    .column .catalog-list li:first-child {
      padding-top: 0;
    }

    .column .catalog-list li:last-child {
      padding-bottom: 0;
      border-bottom: 0;
    }

    .column .catalog-list p {
      margin: 0;
    }

    .column .catalog-list strong {
      color: var(--color-text);
    }

    .column .status {
      display: block;
      margin-top: 6px;
      color: var(--color-muted);
      font-size: 15px;
    }

    .column .pathway-list {
      padding: 0;
      list-style: none;
    }

    .column .pathway-list li {
      margin: 0;
      padding: 18px 0;
      border-bottom: 1px solid var(--color-border);
    }

    .column .pathway-list li:first-child {
      padding-top: 0;
    }

    .column .pathway-list li:last-child {
      padding-bottom: 0;
      border-bottom: 0;
    }

    .column .pathway-list strong {
      display: block;
      margin-bottom: 4px;
    }

    .column .pathway-list span {
      color: var(--color-muted);
    }

    .column .step-list {
      padding-left: 1.2em;
    }

    .column .step-list li {
      padding-left: 4px;
    }

    .column .inquiry-intro {
      color: var(--color-muted);
    }

    .column form label {
      display: block;
      margin: 0 0 7px;
      color: var(--color-text);
      font-size: 15px;
      font-weight: 700;
    }

    .column form input,
    .column form select,
    .column form textarea {
      display: block;
      width: 100%;
      margin: 0 0 18px;
      padding: 13px 16px;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: var(--color-surface);
      color: var(--color-text);
      font: inherit;
      font-size: 16px;
    }

    .column form textarea {
      min-height: 150px;
      resize: vertical;
    }

    .column form input:focus,
    .column form select:focus,
    .column form textarea:focus {
      outline: 2px solid var(--color-primary);
      outline-offset: 2px;
    }

    .column .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 54px;
      padding: 13px 26px;
      border: 0;
      border-radius: 24px;
      background: var(--color-accent);
      color: var(--color-on-accent);
      font: inherit;
      font-size: 16px;
      font-weight: 800;
      cursor: pointer;
      transition: transform 0.25s ease;
    }

    .column .btn:hover {
      transform: translateY(-8px);
    }

    .column .form-note {
      margin: 18px 0 0;
      color: var(--color-muted);
      font-size: 15px;
    }

    @media (max-width: 720px) {
      .column {
        padding: 56px 20px 48px;
        font-size: 17px;
      }

      .column h1 {
        font-size: 34px;
      }

      .column h2 {
        font-size: 24px;
      }

      .column .lede {
        font-size: 19px;
      }

      .column hr {
        margin: 48px 0;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .column .btn {
        transition: none;
      }
    }

/* game-library.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* index.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* index.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* index.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* index.html */
.column {
      width: 100%;
      max-width: 680px;
      margin: 0 auto;
      padding: 96px 24px 64px;
      color: var(--color-text);
      font-size: 19px;
      line-height: 1.75;
    }

    .column > * {
      max-width: 100%;
    }

    .column section {
      height: auto;
      margin: 0;
      padding: 0;
    }

    .column h1,
    .column h2,
    .column h3 {
      color: var(--color-text);
      font-weight: 800;
      letter-spacing: -0.015em;
    }

    .column h1 {
      margin: 0 0 24px;
      font-size: 44px;
      line-height: 1.2;
    }

    .column h2 {
      margin: 0 0 24px;
      font-size: 28px;
      line-height: 1.3;
    }

    .column p,
    .column li,
    .column blockquote {
      margin: 0 0 28px;
    }

    .column .kicker {
      margin: 0 0 16px;
      color: var(--color-primary);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }

    .column .lede {
      margin-bottom: 24px;
      color: var(--color-muted);
      font-size: 22px;
      line-height: 1.6;
    }

    .column .textlink {
      display: inline-block;
      color: var(--color-primary);
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 4px;
      transition: color 0.25s ease;
    }

    .column .textlink:hover {
      color: var(--color-accent);
    }

    .column hr {
      margin: 72px 0;
      border: 0;
      border-top: 1px solid var(--color-border);
    }

    .column .plainlist {
      padding-left: 1.2em;
    }

    .column .plainlist li {
      padding-left: 0.2em;
      margin-bottom: 24px;
    }

    .column .plainlist li::marker {
      color: var(--color-primary);
      font-weight: 800;
    }

    .column figure {
      margin: 0 0 32px;
    }

    .column figure img {
      display: block;
      width: 100%;
      height: auto;
      border-radius: 24px;
    }

    .column figcaption {
      margin-top: 12px;
      color: var(--color-muted);
      font-size: 15px;
    }

    .column blockquote {
      padding-left: 24px;
      border-left: 2px solid var(--color-primary);
    }

    .column blockquote cite {
      display: block;
      margin-top: 8px;
      color: var(--color-muted);
      font-size: 15px;
      font-style: normal;
    }

    .column form {
      margin-top: 28px;
    }

    .column form label {
      display: block;
      margin-bottom: 8px;
      font-size: 15px;
      font-weight: 700;
    }

    .column form input,
    .column form select,
    .column form textarea {
      display: block;
      width: 100%;
      margin: 0 0 16px;
      padding: 14px 18px;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: var(--color-surface);
      color: var(--color-text);
      font: inherit;
    }

    .column form textarea {
      min-height: 150px;
      resize: vertical;
    }

    .column form input:focus,
    .column form select:focus,
    .column form textarea:focus {
      outline: 2px solid var(--color-primary);
      outline-offset: 1px;
    }

    .column .submit-button {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-top: 4px;
      padding: 16px 32px;
      border: 0;
      border-radius: 24px;
      background: var(--color-accent);
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
      color: var(--color-on-accent);
      cursor: pointer;
      font: inherit;
      font-size: 17px;
      font-weight: 800;
      transition: transform 0.3s ease;
    }

    .column .submit-button:hover {
      transform: translateY(-8px);
    }

    .column .contact-details {
      margin: 24px 0 0;
      color: var(--color-muted);
      font-size: 16px;
    }

    @media (max-width: 720px) {
      .column {
        padding: 56px 20px 48px;
        font-size: 17px;
      }

      .column h1 {
        font-size: 34px;
      }

      .column h2 {
        font-size: 24px;
      }

      .column .lede {
        font-size: 19px;
      }

      .column hr {
        margin: 48px 0;
      }
    }

/* index.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* multiplayer-tech.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* multiplayer-tech.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* multiplayer-tech.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* multiplayer-tech.html */
.column {
      box-sizing: border-box;
      width: 100%;
      max-width: 680px;
      margin: 0 auto;
      padding: 96px 24px 64px;
      color: var(--color-text);
      font-size: 19px;
      font-weight: 400;
      line-height: 1.75;
    }

    .column > * {
      max-width: 100%;
    }

    .column section,
    .column .masthead {
      height: auto;
    }

    .column h1,
    .column h2,
    .column h3 {
      color: var(--color-text);
      font-weight: 800;
      letter-spacing: -0.015em;
    }

    .column h1 {
      margin: 0 0 24px;
      font-size: 44px;
      line-height: 1.2;
    }

    .column h2 {
      margin: 0 0 24px;
      font-size: 28px;
      line-height: 1.3;
    }

    .column p,
    .column li {
      margin: 0 0 28px;
    }

    .column .kicker {
      margin: 0 0 16px;
      color: var(--color-primary);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }

    .column .lede {
      margin-bottom: 20px;
      color: var(--color-muted);
      font-size: 22px;
      line-height: 1.6;
    }

    .column .textlink {
      display: inline-block;
      color: var(--color-primary);
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 4px;
      transition: color 0.25s ease;
    }

    .column .textlink:hover {
      color: var(--color-accent);
    }

    .column hr {
      margin: 72px 0;
      border: 0;
      border-top: 1px solid var(--color-border);
    }

    .column .plainlist {
      padding-left: 1.2em;
    }

    .column .plainlist li {
      margin-bottom: 24px;
      padding-left: 0.15em;
    }

    .column .plainlist strong {
      color: var(--color-text);
      font-weight: 800;
    }

    .column .region-list {
      padding: 0;
      list-style: none;
    }

    .column .region-list li {
      margin-bottom: 24px;
      padding-bottom: 20px;
      border-bottom: 1px solid var(--color-border);
    }

    .column .region-list li:last-child {
      border-bottom: 0;
      padding-bottom: 0;
    }

    .column .region-list strong {
      display: block;
      margin-bottom: 4px;
      font-weight: 800;
    }

    .column .region-list span {
      display: block;
      color: var(--color-muted);
      font-size: 16px;
      line-height: 1.65;
    }

    .column .section-note {
      color: var(--color-muted);
    }

    .column form label {
      display: block;
      margin-bottom: 8px;
      font-size: 15px;
      font-weight: 700;
    }

    .column form input,
    .column form textarea {
      display: block;
      width: 100%;
      margin: 0 0 18px;
      padding: 14px 18px;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: var(--color-surface);
      color: var(--color-text);
      font: inherit;
      line-height: 1.5;
    }

    .column form textarea {
      min-height: 150px;
      resize: vertical;
    }

    .column form input:focus,
    .column form textarea:focus {
      outline: 2px solid var(--color-primary);
      outline-offset: 2px;
    }

    .column .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 54px;
      padding: 14px 28px;
      border: 0;
      border-radius: 24px;
      background: var(--color-accent);
      color: var(--color-on-accent);
      font: inherit;
      font-size: 16px;
      font-weight: 800;
      cursor: pointer;
      text-decoration: none;
      transition: transform 0.25s ease;
    }

    .column .btn:hover {
      transform: translateY(-8px);
    }

    .column .contact-line {
      margin-top: 24px;
      color: var(--color-muted);
      font-size: 16px;
    }

    .column .contact-line a {
      color: var(--color-primary);
      font-weight: 700;
      text-underline-offset: 3px;
    }

    @media (max-width: 720px) {
      .column {
        padding: 56px 20px 48px;
        font-size: 17px;
      }

      .column h1 {
        font-size: 34px;
      }

      .column h2 {
        font-size: 24px;
      }

      .column .lede {
        font-size: 19px;
      }

      .column hr {
        margin: 48px 0;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .column .btn,
      .column .textlink {
        transition: none;
      }

      .column .btn:hover {
        transform: none;
      }
    }

/* multiplayer-tech.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* player-support.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* player-support.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* player-support.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* player-support.html */
.column {
      width: 100%;
      max-width: 680px;
      margin: 0 auto;
      padding: 96px 24px 64px;
      color: var(--color-text);
      font-size: 19px;
      line-height: 1.75;
    }

    .column > * {
      max-width: 100%;
    }

    .column section,
    .column .masthead {
      height: auto;
      margin: 0;
      padding: 0;
    }

    .column h1,
    .column h2,
    .column h3 {
      color: var(--color-text);
      font-weight: 800;
      letter-spacing: -0.015em;
    }

    .column h1 {
      margin: 0 0 24px;
      font-size: 44px;
      line-height: 1.2;
    }

    .column h2 {
      margin: 0 0 24px;
      font-size: 28px;
      line-height: 1.3;
    }

    .column p,
    .column li {
      margin: 0 0 28px;
    }

    .kicker {
      margin: 0 0 16px !important;
      color: var(--color-primary);
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.18em;
      text-transform: uppercase;
    }

    .lede {
      color: var(--color-muted);
      font-size: 22px;
      line-height: 1.6;
    }

    .textlink {
      display: inline-block;
      color: var(--color-primary);
      font-weight: 700;
      text-decoration: underline;
      text-underline-offset: 4px;
      transition: color 0.2s ease;
    }

    .textlink:hover {
      color: var(--color-accent);
    }

    .column hr {
      margin: 72px 0;
      border: 0;
      border-top: 1px solid var(--color-border);
    }

    .plainlist {
      padding-left: 1.2em;
    }

    .plainlist li {
      padding-left: 0.25em;
      margin-bottom: 24px;
    }

    .plainlist li::marker {
      color: var(--color-primary);
      font-weight: 800;
    }

    .plainlist strong {
      font-weight: 800;
    }

    .contact-list {
      margin: 0;
    }

    .contact-list dt {
      margin: 22px 0 4px;
      font-weight: 800;
    }

    .contact-list dt:first-child {
      margin-top: 0;
    }

    .contact-list dd {
      margin: 0;
      color: var(--color-muted);
      overflow-wrap: anywhere;
    }

    .contact-list a {
      color: var(--color-primary);
      font-weight: 700;
      text-underline-offset: 4px;
    }

    .form-intro {
      color: var(--color-muted);
    }

    .support-form label {
      display: block;
      margin: 0 0 8px;
      font-size: 15px;
      font-weight: 700;
    }

    .support-form input,
    .support-form select,
    .support-form textarea {
      display: block;
      width: 100%;
      margin: 0 0 18px;
      padding: 14px 18px;
      border: 1px solid var(--color-border);
      border-radius: 24px;
      background: var(--color-surface);
      color: var(--color-text);
      font: inherit;
      line-height: 1.5;
    }

    .support-form textarea {
      min-height: 160px;
      resize: vertical;
    }

    .support-form input:focus,
    .support-form select:focus,
    .support-form textarea:focus {
      outline: 2px solid var(--color-primary);
      outline-offset: 2px;
    }

    .submit-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 54px;
      padding: 14px 28px;
      border: 0;
      border-radius: 24px;
      background: var(--color-accent);
      color: var(--color-on-accent);
      cursor: pointer;
      font: inherit;
      font-size: 17px;
      font-weight: 800;
      transition: transform 0.25s ease;
    }

    .submit-button:hover {
      transform: translateY(-8px);
    }

    .form-note {
      margin: 20px 0 0 !important;
      color: var(--color-muted);
      font-size: 15px;
    }

    @media (max-width: 720px) {
      .column {
        padding: 56px 20px 48px;
        font-size: 17px;
      }

      .column h1 {
        font-size: 34px;
      }

      .column h2 {
        font-size: 24px;
      }

      .lede {
        font-size: 19px;
      }

      .column hr {
        margin: 48px 0;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      .textlink,
      .submit-button {
        transition: none;
      }

      .submit-button:hover {
        transform: none;
      }
    }

/* player-support.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* privacy-policy.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* privacy-policy.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* privacy-policy.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* privacy-policy.html */
.privacy-page {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            color: var(--color-text);
            font-size: 19px;
            line-height: 1.75;
        }

        .privacy-page > * {
            max-width: 100%;
        }

        .privacy-page section,
        .privacy-page .masthead {
            height: auto;
            margin: 0;
            padding: 0;
        }

        .privacy-page .kicker {
            margin: 0 0 16px;
            color: var(--color-primary);
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
        }

        .privacy-page h1,
        .privacy-page h2 {
            color: var(--color-text);
            font-weight: 800;
            letter-spacing: -0.015em;
        }

        .privacy-page h1 {
            margin: 0 0 24px;
            font-size: 44px;
            line-height: 1.2;
        }

        .privacy-page h2 {
            margin: 0 0 24px;
            font-size: 28px;
            line-height: 1.3;
        }

        .privacy-page p,
        .privacy-page li {
            margin: 0 0 24px;
        }

        .privacy-page .lede {
            margin-bottom: 22px;
            color: var(--color-muted);
            font-size: 22px;
            line-height: 1.6;
        }

        .privacy-page .textlink {
            display: inline-block;
            color: var(--color-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.2s ease;
        }

        .privacy-page .textlink:hover {
            color: var(--color-accent);
        }

        .privacy-page hr {
            margin: 72px 0;
            border: 0;
            border-top: 1px solid var(--color-border);
        }

        .privacy-page ol,
        .privacy-page ul {
            padding-left: 1.25em;
        }

        .privacy-page li {
            padding-left: 0.2em;
        }

        .privacy-page li:last-child,
        .privacy-page section > :last-child {
            margin-bottom: 0;
        }

        .privacy-page strong {
            color: var(--color-text);
            font-weight: 700;
        }

        .privacy-page address {
            margin: 0 0 24px;
            color: var(--color-muted);
            font-style: normal;
        }

        @media (max-width: 720px) {
            .privacy-page {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            .privacy-page h1 {
                font-size: 34px;
            }

            .privacy-page h2 {
                font-size: 24px;
            }

            .privacy-page .lede {
                font-size: 19px;
            }

            .privacy-page hr {
                margin: 48px 0;
            }
        }

/* privacy-policy.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* studio.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* studio.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* studio.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* studio.html */
.column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            color: var(--color-text);
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        .column section {
            height: auto;
            margin: 0;
            padding: 0;
        }

        .column hr {
            margin: 72px 0;
            border: 0;
            border-top: 1px solid var(--color-border);
        }

        .column h1,
        .column h2 {
            color: var(--color-text);
            font-weight: 800;
            letter-spacing: -0.015em;
        }

        .column h1 {
            margin: 0 0 24px;
            font-size: 44px;
            line-height: 1.2;
        }

        .column h2 {
            margin: 0 0 24px;
            font-size: 28px;
            line-height: 1.3;
        }

        .column p,
        .column li {
            margin: 0 0 28px;
        }

        .column .kicker {
            margin: 0 0 16px;
            color: var(--color-primary);
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
        }

        .column .lede {
            color: var(--color-muted);
            font-size: 22px;
            line-height: 1.6;
        }

        .column .textlink {
            display: inline-block;
            color: var(--color-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease, transform 0.25s ease;
        }

        .column .textlink:hover {
            color: var(--color-accent);
            transform: translateY(-8px);
        }

        .column .plainlist {
            padding-left: 1.2em;
        }

        .column .plainlist li {
            margin-bottom: 24px;
            padding-left: 0.15em;
        }

        .column figure {
            margin: 0 0 32px;
        }

        .column img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        .column figcaption {
            margin-top: 12px;
            color: var(--color-muted);
            font-size: 15px;
        }

        .column form label {
            display: block;
            margin-bottom: 8px;
            font-size: 15px;
            font-weight: 700;
        }

        .column form input,
        .column form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            border: 1px solid var(--color-border);
            border-radius: 24px;
            background: var(--color-surface);
            color: var(--color-text);
            font: inherit;
        }

        .column form input:focus,
        .column form textarea:focus {
            outline: 2px solid var(--color-primary);
            outline-offset: 1px;
        }

        .column form textarea {
            min-height: 150px;
            resize: vertical;
        }

        .column .submit-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 16px 28px;
            border: 0;
            border-radius: 24px;
            background: var(--color-accent);
            color: var(--color-on-accent);
            font: inherit;
            font-size: 16px;
            font-weight: 800;
            cursor: pointer;
            transition: transform 0.3s ease;
        }

        .column .submit-button:hover {
            transform: translateY(-8px);
        }

        .column .contact-line {
            margin-top: 24px;
            color: var(--color-muted);
            font-size: 16px;
        }

        .column .contact-line a {
            color: var(--color-primary);
            font-weight: 700;
            text-underline-offset: 3px;
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            .column h1 {
                font-size: 34px;
            }

            .column h2 {
                font-size: 24px;
            }

            .column .lede {
                font-size: 19px;
            }

            .column hr {
                margin: 48px 0;
            }
        }

/* studio.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }

/* terms-and-conditions.html */
:root {
            --site-bg: #FFF7FF;
            --site-surface: #FBEAFB;
            --site-text: #141014;
            --site-muted: #423642;
            --site-border: #EBD6EB;
            --site-primary: #9F65A1;
            --site-on-primary: #000000;
            --site-secondary: #719D7A;
            --site-on-secondary: #000000;
            --site-accent: #8CA14C;
            --site-on-accent: #000000;
            --site-success: #22C55E;
            --site-warning: #F59E0B;
            --site-error: #EF4444;
            --site-info: #3B82F6;
            --color-bg: var(--site-bg);
            --color-surface: var(--site-surface);
            --color-text: var(--site-text);
            --color-muted: var(--site-muted);
            --color-border: var(--site-border);
            --color-primary: var(--site-primary);
            --color-on-primary: var(--site-on-primary);
            --color-secondary: var(--site-secondary);
            --color-on-secondary: var(--site-on-secondary);
            --color-accent: var(--site-accent);
            --color-on-accent: var(--site-on-accent);
            --color-success: var(--site-success);
            --color-warning: var(--site-warning);
            --color-error: var(--site-error);
            --color-info: var(--site-info);
        }

        @media (prefers-color-scheme: dark) {
            :root {
                --site-bg: #170617;
                --site-surface: #251026;
                --site-text: #E8E3E8;
                --site-muted: #BCABBC;
                --site-border: #372837;
                --site-primary: #C897C9;
                --site-on-primary: #000000;
                --site-secondary: #ABDFB5;
                --site-on-secondary: #000000;
                --site-accent: #C6DD84;
                --site-on-accent: #000000;
            }
        }

/* terms-and-conditions.html */
@theme {
  --color-primary: var(--site-primary);
  --color-on-primary: var(--site-on-primary);
  --color-secondary: var(--site-secondary);
  --color-on-secondary: var(--site-on-secondary);
  --color-accent: var(--site-accent);
  --color-on-accent: var(--site-on-accent);
  --color-bg: var(--site-bg);
  --color-surface: var(--site-surface);
  --color-text: var(--site-text);
  --color-muted: var(--site-muted);
  --color-border: var(--site-border);
  --color-success: var(--site-success);
  --color-warning: var(--site-warning);
  --color-error: var(--site-error);
  --color-info: var(--site-info);
}

/* terms-and-conditions.html */
*,
        *::before,
        *::after {
            box-sizing: border-box;
        }

        body {
            margin: 0;
            background: var(--site-bg);
            color: var(--site-text);
            font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
            font-weight: 400;
            line-height: 1.75;
            -webkit-font-smoothing: antialiased;
        }

        .column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        section {
            margin: 0;
            padding: 0;
            height: auto;
        }

        hr {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 72px 0;
        }

        h1,
        h2,
        h3 {
            font-weight: 800;
            letter-spacing: -0.015em;
            color: var(--site-text);
        }

        h1 {
            font-size: 44px;
            line-height: 1.2;
            margin: 0 0 24px;
        }

        h2 {
            font-size: 28px;
            line-height: 1.3;
            margin: 0 0 24px;
        }

        h3 {
            font-size: 20px;
            line-height: 1.4;
            margin: 0 0 12px;
        }

        p,
        li,
        blockquote {
            margin: 0 0 28px;
        }

        .kicker {
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
            color: var(--site-primary);
            margin: 0 0 16px;
        }

        .lede {
            font-size: 22px;
            line-height: 1.6;
            color: var(--site-muted);
        }

        .textlink {
            display: inline-block;
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .textlink:hover {
            color: var(--site-accent);
        }

        .plainlist {
            padding-left: 1.2em;
        }

        .plainlist li {
            margin-bottom: 24px;
        }

        figure {
            margin: 0 0 32px;
        }

        img {
            display: block;
            width: 100%;
            height: auto;
            border-radius: 24px;
        }

        figcaption {
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 12px;
        }

        blockquote {
            margin: 0 0 40px;
            padding-left: 24px;
            border-left: 2px solid var(--site-primary);
        }

        blockquote cite {
            display: block;
            font-style: normal;
            font-size: 15px;
            color: var(--site-muted);
            margin-top: 8px;
        }

        form label {
            display: block;
            font-size: 15px;
            font-weight: 700;
            margin-bottom: 8px;
        }

        form input,
        form select,
        form textarea {
            display: block;
            width: 100%;
            margin-bottom: 16px;
            padding: 14px 18px;
            font: inherit;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
        }

        form input:focus,
        form select:focus,
        form textarea:focus {
            outline: 2px solid var(--site-primary);
            outline-offset: 1px;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 16px 32px;
            font-family: inherit;
            font-size: 17px;
            font-weight: 800;
            color: var(--site-on-accent);
            background: var(--site-accent);
            border: 0;
            border-radius: 24px;
            cursor: pointer;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .btn:hover {
            transform: translateY(-8px);
        }

        .btn i {
            font-size: 20px;
        }

        .site-header {
            background: var(--site-bg);
            border-bottom: 1px solid var(--site-border);
        }

        .header-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 20px 24px 16px;
        }

        .brand-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
        }

        .brand {
            display: inline-flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: var(--site-text);
        }

        .brand-mark {
            flex: 0 0 42px;
            width: 42px;
            height: 42px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 21px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 20%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
        }

        .brand-name {
            display: block;
            font-size: 18px;
            font-weight: 800;
            line-height: 1.25;
            letter-spacing: -0.01em;
        }

        .brand-tag {
            display: block;
            font-size: 12px;
            line-height: 1.45;
            color: var(--site-muted);
        }

        .nav-toggle {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 44px;
            height: 44px;
            font-size: 22px;
            color: var(--site-text);
            background: var(--site-surface);
            border: 1px solid var(--site-border);
            border-radius: 24px;
            cursor: pointer;
        }

        .nav-toggle:hover {
            color: var(--site-primary);
        }

        .nav-menu {
            display: none;
            flex-direction: column;
            margin-top: 16px;
            padding-top: 12px;
            border-top: 1px solid var(--site-border);
        }

        .nav-menu.is-open {
            display: flex;
        }

        .nav-link {
            display: block;
            padding: 10px 2px;
            font-size: 16px;
            font-weight: 500;
            color: var(--site-text);
            text-decoration: none;
            border-bottom: 1px solid var(--site-border);
        }

        .nav-link:hover {
            color: var(--site-primary);
        }

        .nav-menu .nav-link:last-child {
            border-bottom: 0;
        }

        @media (min-width: 768px) {
            .nav-toggle {
                display: none;
            }

            .nav-menu,
            .nav-menu.is-open {
                display: flex;
                flex-direction: row;
                flex-wrap: wrap;
                gap: 20px;
                margin-top: 14px;
                padding-top: 12px;
            }

            .nav-link {
                padding: 0;
                border-bottom: 0;
                font-size: 15px;
            }
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            h1 {
                font-size: 34px;
            }

            h2 {
                font-size: 24px;
            }

            .lede {
                font-size: 19px;
            }

            hr {
                margin: 48px 0;
            }
        }

/* terms-and-conditions.html */
.column {
            max-width: 680px;
            margin: 0 auto;
            padding: 96px 24px 64px;
            color: var(--color-text);
            font-size: 19px;
            line-height: 1.75;
        }

        .column > * {
            max-width: 100%;
        }

        .column section {
            height: auto;
            margin: 0;
            padding: 0;
        }

        .column hr {
            margin: 72px 0;
            border: 0;
            border-top: 1px solid var(--color-border);
        }

        .column h1,
        .column h2,
        .column h3 {
            color: var(--color-text);
            font-weight: 800;
            letter-spacing: -0.015em;
        }

        .column h1 {
            margin: 0 0 24px;
            font-size: 44px;
            line-height: 1.2;
        }

        .column h2 {
            margin: 0 0 24px;
            font-size: 28px;
            line-height: 1.3;
        }

        .column h3 {
            margin: 32px 0 10px;
            font-size: 20px;
            line-height: 1.4;
        }

        .column p {
            margin: 0 0 24px;
        }

        .column .kicker {
            margin: 0 0 16px;
            color: var(--color-primary);
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.18em;
            text-transform: uppercase;
        }

        .column .lede {
            color: var(--color-muted);
            font-size: 22px;
            line-height: 1.6;
        }

        .column .textlink {
            display: inline-block;
            color: var(--color-primary);
            font-weight: 700;
            text-decoration: underline;
            text-underline-offset: 4px;
            transition: color 0.25s ease;
        }

        .column .textlink:hover {
            color: var(--color-accent);
        }

        .column .contact-details {
            padding-top: 4px;
            color: var(--color-muted);
            font-size: 17px;
        }

        .column address {
            font-style: normal;
        }

        @media (max-width: 720px) {
            .column {
                padding: 56px 20px 48px;
                font-size: 17px;
            }

            .column h1 {
                font-size: 34px;
            }

            .column h2 {
                font-size: 24px;
            }

            .column .lede {
                font-size: 19px;
            }

            .column hr {
                margin: 48px 0;
            }
        }

/* terms-and-conditions.html */
.site-footer {
            border-top: 1px solid var(--site-border);
            background: var(--site-bg);
        }

        .footer-inner {
            max-width: 680px;
            margin: 0 auto;
            padding: 56px 24px 40px;
            font-size: 15px;
            line-height: 1.75;
            color: var(--site-text);
        }

        .footer-brand {
            margin: 0 0 8px;
            font-size: 17px;
            font-weight: 800;
        }

        .footer-note {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-heading {
            margin: 0 0 12px;
            font-size: 13px;
            font-weight: 700;
            letter-spacing: 0.14em;
            text-transform: uppercase;
            color: var(--site-primary);
        }

        .footer-list {
            list-style: none;
            margin: 0 0 28px;
            padding: 0;
        }

        .footer-list li {
            margin: 0 0 10px;
        }

        .footer-list a {
            color: var(--site-text);
            font-weight: 500;
            text-decoration: none;
        }

        .footer-list a:hover {
            color: var(--site-primary);
            text-decoration: underline;
        }

        .footer-contact {
            margin: 0 0 28px;
            color: var(--site-muted);
        }

        .footer-contact a,
        .footer-copy a {
            color: var(--site-primary);
            font-weight: 700;
            text-decoration: none;
        }

        .footer-contact a:hover,
        .footer-copy a:hover {
            text-decoration: underline;
        }

        .footer-social {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin: 0 0 28px;
        }

        .footer-social a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            font-size: 20px;
            color: var(--site-primary);
            background: color-mix(in oklch, var(--site-primary) 18%, transparent);
            border-radius: 60% 40% 30% 70% / 50% 60% 40% 50%;
            text-decoration: none;
            transition: transform 0.3s ease;
        }

        .footer-social a:hover {
            transform: translateY(-8px);
        }

        .footer-rule {
            border: 0;
            border-top: 1px solid var(--site-border);
            margin: 0 0 20px;
        }

        .footer-copy {
            margin: 0;
            font-size: 14px;
            color: var(--site-muted);
        }

        @media (max-width: 720px) {
            .footer-inner {
                padding: 44px 20px 32px;
            }
        }