:root {
    --kws-public-font-sans: "Pretendard Variable", Pretendard, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;

    --kws-public-color-action: #2563eb;
    --kws-public-color-action-hover: #1d4ed8;
    --kws-public-color-action-soft: #eff6ff;
    --kws-public-color-focus: #60a5fa;
    --kws-public-color-text-strong: #0f172a;
    --kws-public-color-text: #475569;
    --kws-public-color-text-muted: #64748b;
    --kws-public-color-line: #e2e8f0;
    --kws-public-color-canvas: #ffffff;
    --kws-public-color-surface: #f8fafc;

    --kws-public-container-wide: 1280px;
    --kws-public-container-content: 960px;
    --kws-public-container-reading: 760px;
    --kws-public-container-form: 520px;
    --kws-public-container-form-wide: 860px;
    --kws-public-page-gutter: 32px;
    --kws-public-grid-gap: 24px;

    --kws-public-space-1: 4px;
    --kws-public-space-2: 8px;
    --kws-public-space-3: 12px;
    --kws-public-space-4: 16px;
    --kws-public-space-5: 20px;
    --kws-public-space-6: 24px;
    --kws-public-space-8: 32px;
    --kws-public-space-10: 40px;
    --kws-public-space-12: 48px;
    --kws-public-space-16: 64px;
    --kws-public-space-20: 80px;
    --kws-public-space-30: 120px;

    --kws-public-type-display-size: clamp(42px, 4.4vw, 64px);
    --kws-public-type-display-line: 1.1;
    --kws-public-type-display-weight: 800;
    --kws-public-type-page-title-size: clamp(36px, 4vw, 48px);
    --kws-public-type-page-title-line: 1.16;
    --kws-public-type-page-title-weight: 800;
    --kws-public-type-section-title-size: clamp(30px, 3.2vw, 44px);
    --kws-public-type-section-title-line: 1.18;
    --kws-public-type-section-title-weight: 800;
    --kws-public-type-form-title-size: clamp(25px, 2.2vw, 28px);
    --kws-public-type-form-title-line: 1.35;
    --kws-public-type-form-title-weight: 800;
    --kws-public-type-body-lg-size: 18px;
    --kws-public-type-body-size: 16px;
    --kws-public-type-small-size: 14px;
    --kws-public-type-caption-size: 12px;
    --kws-public-type-body-line: 1.7;
    --kws-public-type-control-weight: 700;

    --kws-public-control-sm: 44px;
    --kws-public-control-md: 48px;
    --kws-public-control-lg: 54px;
    --kws-public-radius-sm: 8px;
    --kws-public-radius-control: 12px;
    --kws-public-radius-card: 20px;
    --kws-public-radius-feature: 24px;
    --kws-public-shadow-card: 0 20px 60px rgb(15 23 42 / 7%);
    --kws-public-header-compact: 72px;
}

@media (max-width: 1180px) {
    :root {
        --kws-public-page-gutter: 24px;
        --kws-public-grid-gap: 20px;
    }
}

@media (max-width: 767px) {
    :root {
        --kws-public-page-gutter: 20px;
        --kws-public-grid-gap: 16px;
    }
}

.kws-public-surface {
    min-width: 0;
    color: var(--kws-public-color-text-strong);
    font-family: var(--kws-public-font-sans);
    font-size: var(--kws-public-type-body-size);
    -webkit-font-smoothing: antialiased;
}

html:has(> body.kws-public-surface) {
    min-width: 0;
}

.kws-public-surface :where(a, button, input, select, textarea):focus-visible {
    outline-color: var(--kws-public-color-focus);
}

.kws-container-wide,
.kws-container-content,
.kws-container-reading,
.kws-container-form {
    width: 100%;
    margin-inline: auto;
    padding-inline: var(--kws-public-page-gutter);
}

.kws-container-wide { max-width: var(--kws-public-container-wide); }
.kws-container-content { max-width: var(--kws-public-container-content); }
.kws-container-reading { max-width: var(--kws-public-container-reading); }
.kws-container-form { max-width: var(--kws-public-container-form); }

.kws-type-display {
    font-size: var(--kws-public-type-display-size);
    font-weight: var(--kws-public-type-display-weight);
    letter-spacing: -0.055em;
    line-height: var(--kws-public-type-display-line);
}

.kws-type-page-title {
    font-size: var(--kws-public-type-page-title-size);
    font-weight: var(--kws-public-type-page-title-weight);
    letter-spacing: -0.045em;
    line-height: var(--kws-public-type-page-title-line);
}

.kws-type-section-title {
    font-size: var(--kws-public-type-section-title-size);
    font-weight: var(--kws-public-type-section-title-weight);
    letter-spacing: -0.045em;
    line-height: var(--kws-public-type-section-title-line);
}