:root {
    color-scheme: light;
    font-family: "Noto Sans KR", "Segoe UI", system-ui, sans-serif;
    color: #202124;
    background: #f7f8fa;
}

body {
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

.customer-shell {
    min-height: 100vh;
    background: #f7f8fa;
}

.customer-shell__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 56px;
    padding: 0 20px;
    border-bottom: 1px solid #e2e5ea;
    background: #ffffff;
}

.customer-shell__brand {
    font-size: 18px;
    font-weight: 700;
}

.customer-shell__nav {
    display: flex;
    gap: 16px;
    font-size: 14px;
    color: #4d5562;
}

.customer-shell__main {
    max-width: 1120px;
    margin: 0 auto;
    padding: 32px 20px;
}

.customer-home,
.customer-auth,
.customer-not-found,
.customer-public-page {
    display: grid;
    gap: 24px;
}

.customer-home h1,
.customer-auth h1,
.customer-not-found h1,
.customer-public-page h1 {
    margin: 0;
    font-size: 32px;
    line-height: 1.2;
}

.customer-home p,
.customer-auth p,
.customer-public-page p {
    margin: 0;
    color: #68707d;
    font-size: 15px;
}

.customer-page-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.customer-page-heading__eyebrow {
    display: block;
    margin-bottom: 6px;
    color: #6a5f4d;
    font-size: 13px;
    font-weight: 700;
}

.customer-segmented {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 4px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-segmented__button,
.customer-state button {
    min-height: 36px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #4d5562;
    font: inherit;
    font-size: 14px;
    cursor: pointer;
}

.customer-segmented__button--active,
.customer-state button {
    background: #1f6f5c;
    color: #ffffff;
}

.customer-segmented__button:disabled {
    cursor: wait;
    opacity: .6;
}

.customer-state {
    display: grid;
    gap: 8px;
    padding: 20px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
    color: #4d5562;
}

.customer-state--error {
    border-color: #f0c8c8;
    background: #fff7f7;
}

.customer-state strong {
    color: #202124;
}

.customer-state button {
    width: max-content;
}

.customer-auth-summary {
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-auth-summary dl {
    display: grid;
    margin: 0;
}

.customer-auth-summary dl > div {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr);
    gap: 16px;
    padding: 14px 16px;
    border-top: 1px solid #edf0f4;
}

.customer-auth-summary dl > div:first-child {
    border-top: 0;
}

.customer-auth-summary dt {
    color: #68707d;
    font-weight: 700;
}

.customer-auth-summary dd {
    min-width: 0;
    margin: 0;
    color: #202124;
    overflow-wrap: anywhere;
}

.customer-kpi-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.customer-kpi-strip > div {
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 16px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-kpi-strip span {
    color: #68707d;
    font-size: 13px;
}

.customer-kpi-strip strong {
    overflow: hidden;
    color: #202124;
    font-size: 20px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-product-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.customer-product-card {
    overflow: hidden;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-product-card__link {
    display: block;
    height: 100%;
}

.customer-product-card__image {
    display: block;
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    background: #eef1f4;
}

.customer-product-card__image--empty {
    background: linear-gradient(135deg, #eef1f4, #dfe6e2);
}

.customer-product-card__body {
    display: grid;
    gap: 7px;
    padding: 12px;
}

.customer-product-card__meta {
    overflow: hidden;
    color: #6a5f4d;
    font-size: 12px;
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-product-card h3,
.customer-category-card h2,
.customer-tag-chip h2 {
    margin: 0;
    color: #202124;
    font-size: 16px;
    line-height: 1.35;
}

.customer-product-card__seller,
.customer-product-card__decision,
.customer-product-card__benefits {
    min-width: 0;
}

.customer-product-card__seller {
    overflow: hidden;
    color: #667085;
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-product-card__decision {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    color: #4d5562;
    font-size: 13px;
}

.customer-product-card__decision strong,
.customer-product-card__decision span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-product-card__decision strong {
    color: #1f6f5c;
    font-weight: 700;
}

.customer-product-card__benefits {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.customer-product-card__benefits span {
    max-width: 100%;
    overflow: hidden;
    padding: 3px 7px;
    border: 1px solid #dce1e8;
    border-radius: 999px;
    color: #4d5562;
    font-size: 12px;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.customer-store {
    gap: 26px;
}

.customer-store-hero {
    position: relative;
    overflow: hidden;
    min-height: 260px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-store-hero__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .22;
}

.customer-store-hero__content {
    position: relative;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr) auto;
    gap: 18px;
    align-items: end;
    min-height: 260px;
    padding: 24px;
    background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.96));
}

.customer-store-hero__content h1 {
    margin: 0;
    font-size: 34px;
    line-height: 1.18;
}

.customer-store-hero__content p {
    max-width: 680px;
    margin-top: 8px;
}

.customer-store-hero__profile {
    display: grid;
    width: 96px;
    aspect-ratio: 1;
    overflow: hidden;
    place-items: center;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
    color: #1f6f5c;
    font-size: 34px;
    font-weight: 800;
}

.customer-store-hero__profile img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.customer-store-section,
.customer-store-panel {
    display: grid;
    gap: 16px;
    min-width: 0;
}

.customer-store-section h2,
.customer-store-panel h2 {
    margin: 0;
    font-size: 22px;
}

.customer-store-section--two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
}

.customer-store-panel {
    padding: 18px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-store-panel > p {
    margin: 0;
}

.customer-store-panel .customer-page-heading > span {
    color: #68707d;
    font-size: 13px;
    font-weight: 700;
}

.customer-store-list {
    display: grid;
    gap: 10px;
}

.customer-store-list article {
    display: grid;
    gap: 8px;
    padding: 12px;
    border: 1px solid #eef1f4;
    border-radius: 8px;
    background: #fbfcfd;
}

.customer-store-list strong {
    overflow-wrap: anywhere;
}

.customer-store-list p,
.customer-store-list span {
    margin: 0;
    color: #68707d;
    font-size: 14px;
    overflow-wrap: anywhere;
}

.customer-store-list__answer {
    display: grid;
    gap: 5px;
    padding-top: 8px;
    border-top: 1px solid #e2e5ea;
}

.customer-store-list__answer span {
    color: #1f6f5c;
    font-weight: 700;
}

.customer-store-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    color: #4d5562;
    font-size: 14px;
    font-weight: 700;
}

.customer-store-pagination button {
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    background: #ffffff;
    color: #4d5562;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.customer-store-pagination button:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.customer-storage {
    display: grid;
    gap: 24px;
}

.customer-storage__header {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    align-items: flex-start;
}

.customer-storage__header h1 {
    margin: 4px 0 0;
    font-size: 32px;
    line-height: 1.2;
}

.customer-storage__header p {
    margin: 8px 0 0;
    color: #68707d;
}

.customer-storage-alert,
.customer-storage-section-error {
    margin: 0;
    padding: 12px 14px;
    border-radius: 8px;
    background: #fff7ed;
    color: #9a3412;
    font-size: 14px;
}

.customer-storage-alert--success {
    background: #ecfdf5;
    color: #047857;
}

.customer-storage-panel {
    display: grid;
    gap: 16px;
    padding: 16px;
    border: 1px solid #e4e8ee;
    border-radius: 8px;
    background: #ffffff;
}

.customer-storage-empty {
    margin: 0;
    color: #68707d;
}

.customer-storage-list {
    display: grid;
    gap: 12px;
}

.customer-storage-list article {
    display: grid;
    gap: 10px;
    padding: 14px 0 0;
    border-top: 1px solid #eef1f4;
}

.customer-storage-list article:first-child {
    padding-top: 0;
    border-top: 0;
}

.customer-storage-list article > div:first-child {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.customer-storage-list strong {
    color: #15181f;
    font-size: 15px;
}

.customer-storage-list span,
.customer-storage-list p,
.customer-storage-list dt,
.customer-storage-list dd {
    margin: 0;
    color: #68707d;
    font-size: 14px;
}

.customer-storage-list dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin: 0;
}

.customer-storage-list dt {
    color: #8a93a2;
}

.customer-storage-list dd {
    color: #3f4652;
    font-weight: 700;
}

.customer-storage-inline-link {
    color: #2563eb;
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
    margin-top: 12px;
    text-decoration: none;
}

.customer-terms-item--selected {
    border-left: 3px solid #2563eb;
    padding-left: 12px;
}

.customer-terms-detail {
    align-content: start;
}

.customer-terms-detail__content {
    color: #3f4652;
    font-size: 14px;
    line-height: 1.8;
    max-height: 620px;
    overflow: auto;
    padding-right: 4px;
    white-space: pre-wrap;
}

.customer-notice-search {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.customer-notice-search input {
    min-height: 38px;
    min-width: min(280px, 100%);
    border: 1px solid #dce1e8;
    border-radius: 6px;
    padding: 0 12px;
}

.customer-notice-search button,
.customer-notice-search a {
    align-items: center;
    background: #ffffff;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    color: #4d5562;
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
    justify-content: center;
    min-height: 38px;
    padding: 0 12px;
}

.customer-notice-item--selected {
    border-left: 3px solid #2563eb;
    padding-left: 12px;
}

.customer-notice-detail {
    align-content: start;
}

.customer-notice-detail__content {
    color: #3f4652;
    font-size: 14px;
    line-height: 1.8;
    max-height: 620px;
    overflow: auto;
    padding-right: 4px;
    white-space: pre-wrap;
}

.customer-notification-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
}

.customer-notification-toolbar {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: space-between;
    margin: 16px 0;
}

.customer-notification-toolbar__button {
    background: #111827;
    border: 0;
    border-radius: 6px;
    color: #ffffff;
    cursor: pointer;
    font-weight: 700;
    min-height: 36px;
    padding: 0 14px;
}

.customer-notification-toolbar__button:disabled {
    cursor: wait;
    opacity: .55;
}

.customer-notification-filters__item {
    align-items: center;
    border: 1px solid #dce1e8;
    border-radius: 999px;
    color: #3f4652;
    display: inline-flex;
    min-height: 36px;
    padding: 0 14px;
    text-decoration: none;
}

.customer-notification-filters__item--active {
    background: #111827;
    border-color: #111827;
    color: #ffffff;
}

.customer-notification-list {
    display: grid;
    gap: 12px;
}

.customer-notification-item {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 16px;
}

.customer-notification-item--unread {
    background: #eff6ff;
    border-color: #2563eb;
}

.customer-notification-item__head {
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.customer-notification-item__head > div {
    display: grid;
    gap: 4px;
}

.customer-notification-item__head span {
    color: #6b7280;
    font-size: 13px;
}

.customer-notification-item dl {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    margin: 12px 0 0;
}

.customer-notification-item__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.customer-notification-item__actions button {
    min-height: 34px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: #111827;
    color: #ffffff;
    cursor: pointer;
    font-weight: 700;
}

.customer-notification-item__actions button:disabled {
    cursor: wait;
    opacity: .55;
}

.customer-storage-products {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.customer-storage-product,
.customer-storage-product a {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    color: inherit;
    text-decoration: none;
}

.customer-storage-product a {
    grid-column: 1 / -1;
}

.customer-storage-product img,
.customer-storage-product .customer-product-card__image {
    width: 96px;
    height: 54px;
    border-radius: 6px;
    object-fit: cover;
}

.customer-storage-product__body {
    min-width: 0;
}

.customer-storage-product span {
    display: block;
    color: #68707d;
    font-size: 13px;
}

.customer-storage-product strong {
    display: block;
    margin-top: 2px;
    color: #15181f;
    font-size: 14px;
}

.customer-storage-product p {
    margin: 4px 0 0;
    color: #68707d;
    font-size: 13px;
}

.customer-storage-product__decision {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 8px;
    margin-top: 4px;
    align-items: center;
}

.customer-storage-product__decision strong {
    display: inline;
    margin-top: 0;
    color: #15181f;
    font-size: 13px;
}

.customer-storage-product__decision span {
    display: inline;
    color: #68707d;
    font-size: 12px;
}

.customer-storage-product .customer-storage-product__benefit {
    color: #2563eb;
    font-weight: 700;
}

.customer-product-detail {
    display: grid;
    gap: 24px;
}

.customer-product-detail__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.customer-product-detail__heading h1,
.customer-product-detail__description h2 {
    margin: 0;
}

.customer-product-detail__heading h1 {
    font-size: 32px;
    line-height: 1.2;
}

.customer-product-detail__heading p,
.customer-product-detail__description p {
    margin: 8px 0 0;
    color: #68707d;
}

.customer-link-button,
.customer-state__actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    background: #ffffff;
    color: #4d5562;
    font-size: 14px;
    font-weight: 700;
}

.customer-state__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.customer-link-button--inline {
    margin-top: 16px;
    width: fit-content;
}

.customer-detail-list {
    display: grid;
}

.customer-detail-list > div {
    border-bottom: 1px solid #e2e8f0;
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(96px, 0.34fr) minmax(0, 1fr);
    padding: 13px 0;
}

.customer-detail-list > div:last-child {
    border-bottom: 0;
}

.customer-command-message {
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #cfe8da;
    border-radius: 6px;
    background: #f1fbf7;
    color: #1f6f5c;
    font-size: 14px;
    font-weight: 700;
}

.customer-command-message--error {
    border-color: #f0c8c8;
    background: #fff7f7;
    color: #9f2f2f;
}

.customer-subscription-manage__actions {
    gap: 14px;
}

.customer-subscription-manage__command-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.45fr);
    gap: 14px;
}

.customer-subscription-manage__command {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid #e4e8ee;
    border-radius: 8px;
    background: #fbfcfd;
}

.customer-subscription-manage__command label {
    color: #4d5562;
    font-size: 13px;
    font-weight: 700;
}

.customer-subscription-manage__command textarea,
.customer-subscription-manage__command select,
.customer-subscription-manage__command input {
    min-height: 88px;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    padding: 10px 12px;
    color: #252b33;
    font: inherit;
}

.customer-subscription-manage__command textarea {
    resize: vertical;
}

.customer-subscription-manage__command select,
.customer-subscription-manage__command input {
    min-height: 42px;
    background: #ffffff;
}

.customer-subscription-manage__command p {
    margin: 0;
    color: #68707d;
    font-size: 13px;
    line-height: 1.5;
}

.customer-subscription-manage__command button {
    width: fit-content;
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid #1f6f5c;
    border-radius: 6px;
    background: #1f6f5c;
    color: #ffffff;
    font-weight: 700;
}

.customer-subscription-manage__command--resume button {
    border-color: #d7a64a;
    background: #fff8e8;
    color: #7a5416;
}

.customer-subscription-manage__command--cancel button {
    border-color: #b94a48;
    background: #fff5f5;
    color: #8f2b2b;
}

.customer-subscription-manage__command--order-cancel {
    margin-top: 14px;
}

.customer-subscription-manage__command--order-cancel button {
    border-color: #b94a48;
    background: #fff5f5;
    color: #8f2b2b;
}

.customer-subscription-manage__inline-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.customer-subscription-manage__command .customer-subscription-manage__secondary-button {
    border-color: #cfd6df;
    background: #ffffff;
    color: #4d5562;
}

.customer-subscription-manage__command--delivery {
    margin-top: 14px;
}

.customer-subscription-manage__command--delivery button {
    border-color: #446b9e;
    background: #edf4ff;
    color: #234c83;
}

.customer-subscription-manage__command button:disabled {
    border-color: #cfd6df;
    background: #eef1f4;
    color: #68707d;
    cursor: not-allowed;
}

.customer-detail-list dt {
    color: #68707d;
    font-size: 13px;
    font-weight: 700;
    margin: 0;
}

.customer-detail-list dd {
    color: #15181f;
    font-size: 14px;
    margin: 0;
    overflow-wrap: anywhere;
}

.customer-history-list {
    display: grid;
    gap: 10px;
}

.customer-history-list article {
    align-items: center;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    display: grid;
    gap: 12px;
    grid-template-columns: 0.45fr minmax(0, 1fr) 0.75fr 0.75fr 0.75fr;
    padding: 14px;
}

.customer-history-list strong {
    color: #15181f;
}

.customer-history-list span {
    color: #4d5562;
    font-size: 14px;
    overflow-wrap: anywhere;
}

.customer-usage-card {
    display: grid;
    gap: 18px;
}

.customer-usage-progress {
    display: grid;
    gap: 8px;
}

.customer-usage-progress > div:first-child {
    align-items: baseline;
    display: flex;
    gap: 6px;
}

.customer-usage-progress strong {
    color: #15181f;
    font-size: 24px;
}

.customer-usage-progress span,
.customer-usage-progress small {
    color: #68707d;
}

.customer-usage-progress__track {
    background: #eef1f4;
    border-radius: 999px;
    height: 10px;
    overflow: hidden;
}

.customer-usage-progress__track span {
    background: #1f6f5c;
    display: block;
    height: 100%;
}

.customer-usage-code {
    display: grid;
    gap: 16px;
}

.customer-usage-code button {
    background: #15181f;
    border: 0;
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    font-weight: 700;
    padding: 12px 18px;
}

.customer-usage-code button:disabled {
    background: #d4dae2;
    color: #6b7280;
    cursor: not-allowed;
}

.customer-usage-code__result {
    align-items: center;
    background: #f7f9fb;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    display: grid;
    gap: 10px;
    justify-items: center;
    padding: 18px;
    text-align: center;
}

.customer-usage-code__result img {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    height: 160px;
    width: 160px;
}

.customer-usage-code__result strong {
    color: #15181f;
    font-family: Consolas, "Courier New", monospace;
    font-size: 32px;
    letter-spacing: 0;
}

.customer-usage-code__result span,
.customer-usage-code__result small {
    color: #68707d;
}

.customer-usage-history {
    display: grid;
    gap: 10px;
}

.customer-usage-history h3 {
    color: #15181f;
    font-size: 16px;
    margin: 0;
}

.customer-product-detail__layout {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
    gap: 18px;
    align-items: start;
}

.customer-product-detail__media,
.customer-product-detail__summary,
.customer-product-detail__description,
.customer-product-detail__recommendations,
.customer-product-detail__subscription,
.customer-product-detail__coupons,
.customer-product-detail__qna {
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-product-detail__media {
    overflow: hidden;
}

.customer-product-detail__media img,
.customer-product-detail__media-empty {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    background: #eef1f4;
}

.customer-product-detail__media-empty {
    background: linear-gradient(135deg, #eef1f4, #dfe6e2);
}

.customer-product-detail__summary,
.customer-product-detail__description,
.customer-product-detail__recommendations,
.customer-product-detail__subscription,
.customer-product-detail__coupons,
.customer-product-detail__qna {
    display: grid;
    gap: 18px;
    padding: 18px;
}

.customer-product-detail__price {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
}

.customer-product-detail__price span {
    color: #68707d;
    font-size: 14px;
    text-decoration: line-through;
}

.customer-product-detail__price strong {
    color: #1f6f5c;
    font-size: 26px;
}

.customer-definition-list {
    display: grid;
    gap: 12px;
    margin: 0;
}

.customer-definition-list div {
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
}

.customer-definition-list dt {
    color: #68707d;
    font-size: 13px;
}

.customer-definition-list dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.customer-product-detail__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.customer-product-detail__tags span {
    padding: 6px 10px;
    border: 1px solid #dce1e8;
    border-radius: 999px;
    background: #ffffff;
    color: #4d5562;
    font-size: 13px;
}

.customer-product-detail__section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.customer-product-detail__section-heading h2,
.customer-product-detail__section-heading h3 {
    margin: 0;
}

.customer-product-detail__section-heading h3 {
    font-size: 18px;
}

.customer-product-detail__section-heading > span {
    color: #68707d;
    font-size: 13px;
    font-weight: 700;
}

.customer-product-detail__empty {
    margin: 0;
    color: #68707d;
}

.customer-product-detail__recommendation-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.customer-product-detail-recommendation {
    min-width: 0;
}

.customer-subscription-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.customer-subscription-summary div {
    display: grid;
    gap: 6px;
    min-width: 0;
    padding: 12px;
    border: 1px solid #eef1f4;
    border-radius: 8px;
    background: #fbfcfd;
}

.customer-subscription-summary span,
.customer-subscription-summary__footer span {
    color: #68707d;
    font-size: 13px;
}

.customer-subscription-summary strong {
    min-width: 0;
    color: #202124;
    overflow-wrap: anywhere;
}

.customer-subscription-summary__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 4px;
}

.customer-subscription-summary__footer button {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 14px;
    border: 1px solid #cfd6df;
    border-radius: 6px;
    background: #eef1f4;
    color: #68707d;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: not-allowed;
}

.customer-subscription-summary__action {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 0 14px;
    border: 0;
    border-radius: 6px;
    background: #1f6f5c;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
}

.customer-subscription-start {
    display: grid;
    gap: 24px;
}

.customer-subscription-start__heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.customer-subscription-start__heading h1 {
    margin: 0;
    font-size: 32px;
    line-height: 1.2;
}

.customer-subscription-start__heading p {
    margin: 8px 0 0;
    color: #68707d;
}

.customer-subscription-start__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, .42fr);
    gap: 18px;
    align-items: start;
}

.customer-subscription-start__panel,
.customer-subscription-start__summary {
    display: grid;
    gap: 18px;
    min-width: 0;
    padding: 18px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-subscription-start__summary {
    position: sticky;
    top: 18px;
}

.customer-subscription-start__summary > div:first-child {
    display: grid;
    gap: 6px;
    padding-bottom: 16px;
    border-bottom: 1px solid #eef1f4;
}

.customer-subscription-start__summary > div:first-child span {
    color: #68707d;
    font-size: 13px;
}

.customer-subscription-start__summary > div:first-child strong {
    color: #1f6f5c;
    font-size: 28px;
}

.customer-subscription-start__summary > div:first-child small {
    color: #68707d;
    font-size: 13px;
}

.customer-subscription-start__summary p {
    margin: 0;
    color: #68707d;
    font-size: 14px;
    line-height: 1.6;
}

.customer-subscription-start__summary button {
    min-height: 40px;
    border: 1px solid #cfd6df;
    border-radius: 6px;
    background: #eef1f4;
    color: #68707d;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: not-allowed;
}

.customer-subscription-start__summary button:not(:disabled) {
    cursor: pointer;
}

.customer-subscription-start__summary .customer-subscription-start__primary {
    border-color: #1f6f5c;
    background: #1f6f5c;
    color: #ffffff;
}

.customer-subscription-start__summary .customer-subscription-start__secondary {
    border-color: #d7a64a;
    background: #fff8e8;
    color: #7a5416;
}

.customer-subscription-start__summary .customer-subscription-start__primary:disabled,
.customer-subscription-start__summary .customer-subscription-start__secondary:disabled {
    border-color: #cfd6df;
    background: #eef1f4;
    color: #68707d;
}

/* 정기결제 결제하기 — 프로토타입 checkout 결제하기(코랄 브랜드 primary, block, lg) */
.customer-subscription-start__summary .customer-subscription-start__pay {
    min-height: 48px;
    border-color: var(--color-brand, #ff5a36);
    background: var(--color-brand, #ff5a36);
    color: var(--color-text-on-brand, #ffffff);
    font-size: 16px;
    font-weight: 700;
    border-radius: 12px;
}

.customer-subscription-start__summary .customer-subscription-start__pay:not(:disabled):hover {
    filter: brightness(0.96);
}

.customer-subscription-start__summary .customer-subscription-start__pay:disabled {
    border-color: #cfd6df;
    background: #eef1f4;
    color: #68707d;
}

.customer-subscription-start__pay-trust {
    display: flex;
    gap: 14px;
    justify-content: center;
    flex-wrap: wrap;
    margin: 10px 0 2px;
    font-size: 12px;
    color: var(--color-text-muted, #68707d);
}

.customer-subscription-start__pay-trust i {
    margin-right: 4px;
    color: var(--color-brand-text, #e1502f);
}

.customer-subscription-start__pay-error {
    margin: 8px 0 4px;
    padding: 8px 12px;
    border-radius: 8px;
    background: #fff0ed;
    color: #c0392b;
    font-size: 13px;
    line-height: 1.5;
}

/* 0원(첫 회차 무료) 안내 */
.customer-subscription-start__pay-note {
    margin: 0 0 10px;
    padding: 9px 12px;
    border-radius: 8px;
    background: var(--gudoc-cover-warm, #f3efe9);
    color: var(--color-text, #4a4640);
    font-size: 12.5px;
    line-height: 1.5;
}

.customer-subscription-start__pay-note i {
    color: var(--color-brand-text, #e1502f);
    margin-right: 4px;
}

/* 결제 수단 선택 (등록 카드 + 새 카드) */
.customer-subscription-start__paymethods {
    display: grid;
    gap: 8px;
    margin-bottom: 12px;
}

.customer-subscription-start__paymethods-label {
    font-size: 13px;
    font-weight: 700;
    color: var(--color-text-strong, #2a2722);
    margin-bottom: 2px;
}

.ss-paycard {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border: 1px solid var(--color-border, #e7e1d8);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color .12s, background .12s;
}

.ss-paycard:hover {
    border-color: var(--color-brand, #ff5a36);
}

.ss-paycard--on {
    border-color: var(--color-brand, #ff5a36);
    background: var(--color-brand-subtle, #fff2ee);
}

.ss-paycard input[type="radio"] {
    accent-color: var(--color-brand, #ff5a36);
    margin: 0;
}

.ss-paycard__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 24px;
    padding: 0 6px;
    border-radius: 6px;
    background: var(--gudoc-cover-warm, #f3efe9);
    color: var(--color-text-strong, #2a2722);
    font-size: 12px;
    font-weight: 700;
}

.ss-paycard__name {
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-strong, #2a2722);
}

.ss-paycard__digits {
    font-size: 13px;
    color: var(--color-text-muted, #68707d);
}

.ss-paycard__primary {
    margin-left: auto;
    padding: 2px 8px;
    border-radius: 999px;
    background: var(--color-brand-subtle, #fff2ee);
    color: var(--color-brand-text, #e1502f);
    font-size: 11px;
    font-weight: 700;
}

/* 저장 카드 결제 성공(인라인) */
.customer-subscription-start__paid {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center;
    padding: 8px 0;
}

.customer-subscription-start__paid-badge {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e8f6ee;
    color: #1f9d57;
    font-size: 22px;
    margin-bottom: 4px;
}

.customer-subscription-start__paid strong {
    font-size: 16px;
    color: var(--color-text-strong, #2a2722);
}

.customer-subscription-start__paid span {
    font-size: 13px;
    color: var(--color-text-muted, #68707d);
}

.customer-subscription-start__paid .customer-subscription-start__primary {
    margin-top: 10px;
    width: 100%;
    text-align: center;
    text-decoration: none;
    padding: 11px 14px;
    border-radius: 12px;
}

.customer-subscription-start__control {
    display: grid;
    gap: 10px;
}

.customer-subscription-start__coupon,
.customer-subscription-start__usage,
.customer-subscription-start__terms,
.customer-subscription-start__seller-legal {
    display: grid;
    gap: 14px;
    padding: 16px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}
/* 결제 단계 판매 당사자 블록(전상법 §20②) — 내부 SellerLegalIdentity 의 dc-block 여백을 패널 안에서 상쇄 */
.customer-subscription-start__seller-legal .dc-block { margin-bottom: 0; }

.customer-subscription-start__summary-title {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-text-strong, #2a2722);
    margin-bottom: 4px;
}

.customer-subscription-start__coupon p,
.customer-subscription-start__coupon-message {
    margin: 0;
    color: #68707d;
    font-size: 13px;
    line-height: 1.5;
}

.customer-subscription-start__coupon-message {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.customer-subscription-start__coupon-message a {
    color: #1f6f5c;
    font-weight: 700;
    text-decoration: none;
}

.customer-coupon-apply-list {
    display: grid;
    gap: 10px;
}

.customer-coupon-apply-list__item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 12px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #fbfcfd;
    color: #252b33;
}

.customer-coupon-apply-list__item:has(input:checked) {
    border-color: #1f6f5c;
    background: #f1fbf7;
}

.customer-coupon-apply-list__item input {
    margin-top: 4px;
}

.customer-coupon-apply-list__item span {
    display: grid;
    gap: 4px;
    min-width: 0;
}

.customer-coupon-apply-list__item strong,
.customer-coupon-apply-list__item small {
    min-width: 0;
    overflow-wrap: anywhere;
}

.customer-coupon-apply-list__item small {
    color: #68707d;
    font-size: 13px;
}

.customer-subscription-start__control > label {
    color: #4d5562;
    font-size: 13px;
    font-weight: 700;
}

.customer-subscription-start__control > p {
    margin: 0;
    color: #68707d;
    font-size: 13px;
}

.customer-subscription-start__form {
    display: grid;
    gap: 16px;
    padding: 16px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #fbfcfd;
}

.customer-subscription-start__held-boundary {
    display: grid;
    gap: 10px;
    padding: 16px;
    border: 1px solid #e2d4ad;
    border-radius: 8px;
    background: #fffaf0;
}

.customer-subscription-start__held-boundary p {
    margin: 0;
    color: #75623b;
    font-size: 13px;
    line-height: 1.6;
}

.customer-payment-result {
    display: grid;
    gap: 20px;
}

.customer-payment-result__panel {
    max-width: 760px;
}

.customer-payment-result__notice {
    display: grid;
    gap: 6px;
    padding: 12px 14px;
    border: 1px solid #f3d7aa;
    border-radius: 8px;
    background: #fff8eb;
    color: #8a5a14;
    font-size: 14px;
}

.customer-payment-result__notice strong {
    color: #5c3a08;
}

.customer-subscription-start__form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.customer-subscription-start__form-grid--shipping {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.customer-subscription-start__form-grid label,
.customer-subscription-start__form > label {
    display: grid;
    gap: 6px;
    min-width: 0;
    color: #4d5562;
    font-size: 13px;
    font-weight: 700;
}

.customer-subscription-start__form-grid input,
.customer-subscription-start__form > label input {
    width: 100%;
    min-width: 0;
    min-height: 38px;
    padding: 0 10px;
    border: 1px solid #cfd6df;
    border-radius: 6px;
    background: #ffffff;
    color: #1b1f24;
    font: inherit;
    font-size: 14px;
}

.customer-subscription-start__form-grid input:disabled,
.customer-subscription-start__form > label input:disabled {
    background: #eef1f4;
    color: #68707d;
}

.customer-subscription-start__field-wide {
    grid-column: span 2;
}

.customer-option-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 10px;
}

.customer-option-chip {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    min-width: 0;
    padding: 12px;
    border: 1px solid #eef1f4;
    border-radius: 8px;
    background: #fbfcfd;
    color: #202124;
}

.customer-option-chip input {
    width: 16px;
    height: 16px;
}

.customer-option-chip span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.customer-option-chip strong {
    overflow-wrap: anywhere;
}

.customer-option-chip small {
    color: #68707d;
}

.customer-quantity-control {
    display: grid;
    grid-template-columns: 40px 88px 40px;
    gap: 8px;
    align-items: center;
}

.customer-quantity-control button,
.customer-quantity-control input {
    min-height: 38px;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    background: #ffffff;
    color: #202124;
    font: inherit;
    text-align: center;
}

.customer-quantity-control button {
    font-weight: 800;
    cursor: pointer;
}

.customer-quantity-control button:disabled {
    cursor: not-allowed;
    opacity: .45;
}

.customer-coupon-list {
    display: grid;
    gap: 10px;
}

.customer-coupon-list__item {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #eef1f4;
    border-radius: 8px;
    background: #fbfcfd;
}

.customer-coupon-list__main,
.customer-coupon-list__details,
.customer-coupon-list__guard {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.customer-coupon-list__main strong {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.customer-coupon-list__main span,
.customer-coupon-list__details,
.customer-coupon-list__guard {
    color: #68707d;
    font-size: 13px;
}

.customer-coupon-list__state {
    flex: 0 0 auto;
    border: 1px solid #dce1e8;
    border-radius: 999px;
    padding: 4px 8px;
    background: #ffffff;
    color: #4d5562;
    font-weight: 700;
}

.customer-coupon-list__item p {
    margin: 0;
    color: #1f6f5c;
    font-size: 18px;
    font-weight: 800;
}

.customer-coupon-list__details {
    flex-wrap: wrap;
    justify-content: flex-start;
}

.customer-coupon-list__action,
.customer-coupon-command button {
    min-height: 34px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: #1f6f5c;
    color: #ffffff;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.customer-coupon-list__action:disabled,
.customer-coupon-command button:disabled {
    cursor: wait;
    opacity: .55;
}

.customer-coupon-list__guard {
    align-items: center;
    padding-top: 4px;
}

.customer-coupon-list__guard a {
    flex: 0 0 auto;
    color: #1f6f5c;
    font-weight: 800;
}

.customer-coupon-command {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid #eef1f4;
}

.customer-coupon-command label {
    display: grid;
    gap: 6px;
    color: #4d5562;
    font-size: 13px;
    font-weight: 700;
}

.customer-coupon-command input {
    width: 100%;
    min-height: 38px;
    box-sizing: border-box;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    padding: 0 10px;
    background: #ffffff;
    color: #202124;
    font: inherit;
    font-size: 14px;
}

.customer-qna-list {
    display: grid;
    gap: 10px;
}

.customer-qna-list__item {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid #eef1f4;
    border-radius: 8px;
    background: #fbfcfd;
}

.customer-qna-list__item > div:first-child {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.customer-qna-list__item strong {
    min-width: 0;
    overflow-wrap: anywhere;
}

.customer-qna-list__item span,
.customer-qna-list__status {
    color: #68707d;
    font-size: 13px;
}

.customer-qna-list__item p,
.customer-qna-list__answer p {
    margin: 0;
    overflow-wrap: anywhere;
}

.customer-qna-list__answer {
    display: grid;
    gap: 6px;
    padding-top: 10px;
    border-top: 1px solid #e2e5ea;
}

.customer-qna-list__answer span {
    color: #1f6f5c;
    font-weight: 700;
}

.customer-qna-form {
    display: grid;
    gap: 12px;
    padding-top: 16px;
    border-top: 1px solid #eef1f4;
}

.customer-qna-form__grid {
    display: grid;
    grid-template-columns: minmax(160px, .35fr) minmax(0, 1fr);
    gap: 12px;
}

.customer-qna-form label {
    display: grid;
    gap: 6px;
    color: #4d5562;
    font-size: 13px;
    font-weight: 700;
}

.customer-qna-form input,
.customer-qna-form select,
.customer-qna-form textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #dce1e8;
    border-radius: 6px;
    background: #ffffff;
    color: #202124;
    font: inherit;
    font-size: 14px;
}

.customer-qna-form input,
.customer-qna-form select {
    min-height: 38px;
    padding: 0 10px;
}

.customer-qna-form textarea {
    min-height: 96px;
    padding: 10px;
    resize: vertical;
}

.customer-qna-form__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.customer-qna-form__check {
    display: flex !important;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 8px !important;
}

.customer-qna-form__check input {
    width: 16px;
    min-height: 16px;
}

.customer-qna-form button {
    min-height: 38px;
    padding: 0 14px;
    border: 0;
    border-radius: 6px;
    background: #1f6f5c;
    color: #ffffff;
    font: inherit;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}

.customer-qna-form button:disabled {
    cursor: wait;
    opacity: .55;
}

.customer-qna-form__message {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border: 1px solid #f0c8c8;
    border-radius: 6px;
    background: #fff7f7;
    color: #7c2d2d;
    font-size: 14px;
}

.customer-qna-form__message--success {
    border-color: #b7decf;
    background: #f3fbf7;
    color: #1f6f5c;
}

.customer-qna-form__message a {
    color: inherit;
    font-weight: 700;
    text-decoration: underline;
}

.customer-category-grid,
.customer-tag-cloud {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.customer-category-card,
.customer-tag-chip {
    display: grid;
    gap: 12px;
    min-width: 0;
    padding: 18px;
    border: 1px solid #dce1e8;
    border-radius: 8px;
    background: #ffffff;
}

.customer-category-card--link {
    color: inherit;
    text-decoration: none;
}

.customer-category-card--link:hover {
    border-color: #1f6f5c;
}

.customer-category-card__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.customer-category-card__header span,
.customer-tag-chip span {
    color: #68707d;
    font-size: 13px;
}

.customer-category-card__children {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.customer-category-card__children li,
.customer-tag-chip div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.customer-category-card__children li {
    padding-top: 6px;
    border-top: 1px solid #eef1f4;
    color: #4d5562;
    font-size: 14px;
}

.customer-category-card__children strong {
    color: #1f6f5c;
}

@media (max-width: 860px) {
    .customer-page-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .customer-kpi-strip,
    .customer-product-grid,
    .customer-product-detail__layout,
    .customer-subscription-start__layout,
    .customer-subscription-summary,
    .customer-qna-form__grid,
    .customer-category-grid,
    .customer-tag-cloud,
    .customer-store-section--two {
        grid-template-columns: 1fr;
    }

    .customer-product-detail__heading {
        align-items: stretch;
        flex-direction: column;
    }

    .customer-subscription-start__heading {
        align-items: stretch;
        flex-direction: column;
    }

    .customer-subscription-start__summary {
        position: static;
    }

    .customer-storage__header,
    .customer-storage-list article > div:first-child {
        display: grid;
    }

    .customer-storage-list dl {
        grid-template-columns: 1fr;
    }

    .customer-subscription-start__form-grid,
    .customer-subscription-start__form-grid--shipping {
        grid-template-columns: 1fr;
    }

    .customer-subscription-start__field-wide {
        grid-column: auto;
    }

    .customer-history-list article {
        grid-template-columns: 1fr;
    }

    .customer-store-hero__content {
        grid-template-columns: 1fr;
        align-items: start;
    }
}

@media (max-width: 640px) {
    .customer-shell__header {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
        padding: 14px 16px;
    }

    .customer-shell__nav {
        flex-wrap: wrap;
        gap: 10px 14px;
    }

    .customer-shell__main {
        padding: 24px 16px;
    }

    .customer-definition-list div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .customer-detail-list > div {
        grid-template-columns: 1fr;
        gap: 4px;
    }

    .customer-product-detail__price {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }

    .customer-coupon-list__main,
    .customer-coupon-list__guard,
    .customer-coupon-command,
    .customer-subscription-summary__footer {
        align-items: stretch;
        flex-direction: column;
        grid-template-columns: 1fr;
    }

    .customer-coupon-list__state,
    .customer-coupon-list__guard a,
    .customer-coupon-list__action,
    .customer-coupon-command button,
    .customer-subscription-summary__action,
    .customer-subscription-summary__footer button {
        width: fit-content;
    }
}
