@font-face {
    font-family: "DM Sans";
    font-style: normal;
    font-weight: 300 700;
    font-display: swap;
    src: url("/static/fonts/dm-sans-latin.woff2") format("woff2");
}
h1, h2, h3 {
    font-family: "DM Sans", system-ui, sans-serif;
    font-weight: 700;
}
@layer kelp.theme {
    :root {
        --color-pink-hue: 13;
        --color-pink-chroma: 1;
    }
    :where(:root),
    .light {
        --color-primary-fill-muted: var(--color-pink-95);
        --color-primary-fill-accent: var(--color-pink-90);
        --color-primary-fill-vivid: var(--color-pink-50);
        --color-primary-border-muted: var(--color-pink-90);
        --color-primary-border-accent: var(--color-pink-80);
        --color-primary-border-vivid: var(--color-pink-60);
        --color-primary-on-muted: var(--color-pink-30);
        --color-primary-on-accent: var(--color-pink-20);
        --color-primary-on-vivid: white;
        --color-primary-outline: var(--color-pink-50);
    }
    .dark {
        --color-primary-fill-muted: var(--color-pink-15);
        --color-primary-fill-accent: var(--color-pink-20);
        --color-primary-fill-vivid: var(--color-pink-50);
        --color-primary-border-muted: var(--color-pink-20);
        --color-primary-border-accent: var(--color-pink-30);
        --color-primary-border-vivid: var(--color-pink-40);
        --color-primary-on-muted: var(--color-pink-75);
        --color-primary-on-accent: var(--color-pink-80);
        --color-primary-on-vivid: white;
        --color-primary-outline: var(--color-pink-50);
    }
}
.navbar.primary .logo {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}
.navbar.primary .logo img { flex-shrink: 0; }
.navbar.primary .pq-nav-text {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-family: "DM Sans", system-ui, sans-serif;
    border-left: 1px solid rgba(236, 30, 82, 0.15);
    padding-left: 0.5rem;
}
.navbar.primary .pq-nav-brand { display: flex; flex-direction: column; }
.navbar.primary .pq-nav-text .pq-text-sub {
    font-weight: 300;
    font-size: 0.55rem;
    letter-spacing: 0.18em;
    color: #ec1e52;
    opacity: 0.55;
    line-height: 1.2;
}
.navbar.primary .pq-nav-text .pq-text-main {
    font-weight: 700;
    font-size: 1rem;
    letter-spacing: 0.02em;
    color: #ec1e52;
    line-height: 1.1;
}
.navbar.primary .pq-nav-app {
    font-weight: 700;
    font-size: 1.4rem;
    color: var(--color-primary-on-vivid);
    line-height: 1;
}
.navbar.primary {
    background:
        radial-gradient(ellipse 60% 100% at 0% 50%, rgba(236, 30, 82, 0.25), transparent),
        #0e0e11;
    color: var(--color-primary-on-vivid);
    padding-inline: var(--size-m);
}
.navbar.primary a,
.navbar.primary summary,
.navbar.primary button.plain {
    color: var(--color-primary-on-vivid);
    --color-hover: var(--color-primary-on-vivid);
    --decoration-hover: none;
    --background-color-hover: transparent;
}
.navbar.primary details > ul {
    color: initial;
}
.navbar.primary details > ul a {
    color: var(--color-primary-on-accent);
}
.pq-main {
    max-width: 60rem;
    margin: 0 auto;
    padding: 1.5rem;
}
.pq-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--color-border-muted);
    margin-bottom: 1rem;
}
.pq-tab {
    display: inline-block;
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-text-muted);
    text-decoration: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
}
.pq-tab:hover {
    color: var(--color-text-normal);
}
.pq-tab.active {
    color: var(--color-text-normal);
    border-bottom-color: var(--color-text-normal);
}
table th {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-muted);
    white-space: nowrap;
}
table td {
    font-size: 0.8125rem;
}
.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.form-row :is(input, select, textarea) {
    margin-block-end: 0;
}