/* /Components/Common/AuditDetailModal.razor.rz.scp.css */
/* AuditDetailModal.razor.css — CSS variable 기반
   이 모달은 라이트/다크 무관하게 항상 흰 배경을 유지합니다.
   다크 오버레이 위에 명함처럼 떠있는 카드 컨셉. */

/* ════════════════════════════════
   Overlay
════════════════════════════════ */
.ah-overlay[b-v4j0jc0n0p] {
    position: fixed; inset: 0;
    background: rgba(15,23,42,0.6);
    backdrop-filter: blur(4px);
    z-index: 99999;
    display: flex; align-items: center; justify-content: center;
}

/* ════════════════════════════════
   Modal card — 항상 흰 배경 (의도적)
════════════════════════════════ */
.ah-a4[b-v4j0jc0n0p] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    width: min(760px, 92vw); min-height: 90vh; max-height: 96vh;
    overflow-y: auto;
    box-shadow: 0 8px 32px rgba(0,0,0,0.08);
    display: flex; flex-direction: column;
}
.ah-a4[b-v4j0jc0n0p]::-webkit-scrollbar       { width: 4px; }
.ah-a4[b-v4j0jc0n0p]::-webkit-scrollbar-track  { background: transparent; }
.ah-a4[b-v4j0jc0n0p]::-webkit-scrollbar-thumb  { background: #e2e8f0; border-radius: 2px; }

/* ════════════════════════════════
   Header
════════════════════════════════ */
.ah-a4-header[b-v4j0jc0n0p] {
    padding: 1.75rem 2rem 1.25rem;
    background: transparent;
    border-bottom: 1px solid #f1f5f9;
}
.ah-a4-header-top[b-v4j0jc0n0p] {
    display: flex; justify-content: space-between;
    align-items: flex-start; margin-bottom: 1.1rem; gap: 1rem;
}

/* 팔레트: 검정(#0f172a), 블루 계열(#1e40af 기본, #1e3a8a 짙은, #64748b 슬레이트),
   경고만 빨강(#dc2626). 초록/오렌지/그라데이션 사용 금지. */
.ah-a4-logo[b-v4j0jc0n0p]     { font-size: 1.4rem; font-weight: 900; color: #0f172a; letter-spacing: -0.8px; line-height: 1; }
.ah-a4-logo-sub[b-v4j0jc0n0p] { font-size: 0.56rem; font-weight: 700; color: #64748b; letter-spacing: 2.5px; margin-top: 3px; }

.ah-a4-live-clock[b-v4j0jc0n0p] { flex: 1; text-align: right; margin-right: 0.5rem; }
.ah-clock-label[b-v4j0jc0n0p]   { font-size: 0.54rem; font-weight: 700; letter-spacing: 1.2px; color: #64748b; text-transform: uppercase; margin-bottom: 1px; }
.ah-clock-value[b-v4j0jc0n0p]   { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.88rem; font-weight: 700; color: #0f172a; letter-spacing: 0.5px; }
.ah-clock-tz[b-v4j0jc0n0p]      { font-size: 0.58rem; color: #64748b; margin-top: 1px; }

.ah-a4-close[b-v4j0jc0n0p] {
    background: transparent; border: none; color: #64748b;
    cursor: pointer; border-radius: 4px; padding: 0.2rem 0.4rem;
    font-size: 0.85rem; transition: all 0.15s; flex-shrink: 0;
}
.ah-a4-close:hover[b-v4j0jc0n0p] { color: #0f172a; background: #f1f5f9; }

.ah-a4-notice-text[b-v4j0jc0n0p] {
    font-size: 0.7rem; color: #0f172a; line-height: 1.7; margin-bottom: 0.75rem;
}
.ah-a4-glossary-text[b-v4j0jc0n0p] {
    font-size: 0.65rem; color: #64748b; line-height: 1.65;
    padding: 0.6rem 0.75rem; background: #f8fafc; border-left: 2px solid #1e40af;
    border-radius: 3px; margin-bottom: 1rem;
}
.ah-a4-glossary-text strong[b-v4j0jc0n0p] { color: #0f172a; font-weight: 700; }
.ah-a4-glossary-text em[b-v4j0jc0n0p] { font-style: italic; color: #334155; }

/* ════════════════════════════════
   Dividers
════════════════════════════════ */
.ah-a4-divider[b-v4j0jc0n0p]         { height: 1px; background: #f1f5f9; }
.ah-a4-section-divider[b-v4j0jc0n0p] { height: 1px; background: #f1f5f9; margin: 0 2rem; }

/* ════════════════════════════════
   Body
════════════════════════════════ */
.ah-a4-body[b-v4j0jc0n0p]    { flex: 1; }
.ah-a4-section[b-v4j0jc0n0p] { padding: 1rem 2rem; }

.ah-a4-row[b-v4j0jc0n0p]    { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.ah-a4-row-mb[b-v4j0jc0n0p] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.2rem; }

.ah-a4-cell[b-v4j0jc0n0p]      { display: flex; flex-direction: column; gap: 0.2rem; }
.ah-a4-cell.full[b-v4j0jc0n0p] { grid-column: 1 / -1; }

.ah-a4-event-name[b-v4j0jc0n0p] {
    font-size: 1rem; font-weight: 800; color: #0f172a;
    letter-spacing: -0.2px; line-height: 1.3;
}

/* ════════════════════════════════
   Cell labels & values
════════════════════════════════ */
.ah-a4-cell-label[b-v4j0jc0n0p] {
    font-size: 0.6rem; font-weight: 700; color: #64748b;
    text-transform: uppercase; letter-spacing: 0.8px;
}
.ah-a4-cell-value[b-v4j0jc0n0p] { font-size: 0.82rem; color: #0f172a; line-height: 1.5; }
.ah-a4-cell-value.strong[b-v4j0jc0n0p] { font-weight: 700; color: #0f172a; }
.ah-a4-cell-value.mono[b-v4j0jc0n0p]   { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: #1e40af; }
.ah-a4-cell-value.mono.logid[b-v4j0jc0n0p] { font-size: 0.7rem; color: #1e40af; word-break: break-all; }
.ah-a4-cell-value.ua[b-v4j0jc0n0p] { font-size: 0.7rem; color: #64748b; word-break: break-all; line-height: 1.6; }
.ah-a4-cell-sub[b-v4j0jc0n0p]  { font-size: 0.64rem; font-weight: 400; color: #64748b; margin-left: 0.4rem; }

/* ════════════════════════════════
   Footer
════════════════════════════════ */
.ah-a4-footer[b-v4j0jc0n0p] {
    padding: 1rem 2rem; background: transparent;
    display: flex; justify-content: space-between;
    align-items: center; min-height: 56px;
}
.ah-a4-footer-left[b-v4j0jc0n0p]    { flex: 1; min-width: 0; }
.ah-a4-footer-actions[b-v4j0jc0n0p] { flex-shrink: 0; }

.ah-a4-copied-notice[b-v4j0jc0n0p] {
    font-size: 0.65rem; color: #1e40af; font-weight: 600;
    display: flex; align-items: center;
}
.ah-elapsed[b-v4j0jc0n0p] { color: #64748b; font-weight: 400; margin-left: 0.35rem; }

.ah-a4-footer-actions[b-v4j0jc0n0p] { display: flex; gap: 0.5rem; flex-shrink: 0; }

.ah-a4-btn-copy[b-v4j0jc0n0p] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    background: #0f172a; border: none; color: #f8fafc;
    font-size: 0.72rem; font-weight: 700;
    padding: 0.5rem 1.1rem; border-radius: 5px;
    cursor: pointer; letter-spacing: 0.5px; transition: all 0.15s;
}
.ah-a4-btn-copy:hover[b-v4j0jc0n0p]   { background: #1e293b; }
.ah-a4-btn-copy.copied[b-v4j0jc0n0p]  { background: #1e40af; }

/* ════════════════════════════════
   Tier Badge (IRON / DEF / STD / SEALED)
════════════════════════════════ */
.ah-tier-badge[b-v4j0jc0n0p] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.72rem; font-weight: 800; letter-spacing: 1.2px;
    padding: 0.3rem 0.7rem; border-radius: 4px;
    text-transform: uppercase;
    display: inline-block;
}
/* Tier 배지 — 파란색 계열 단일 팔레트로 통일 (강도만 차이).
   IRON=짙은 남색, DEF=기본 블루, STD=옅은 블루, SEALED=slate, NONE=회색.
   이전 orange/green 혼재 → 모달 묵직함 회복. */
.ah-tier-iron[b-v4j0jc0n0p]   { background: #1e3a8a; color: #fff; }
.ah-tier-def[b-v4j0jc0n0p]    { background: #1e40af; color: #fff; }
.ah-tier-std[b-v4j0jc0n0p]    { background: #2563eb; color: #fff; }
.ah-tier-sealed[b-v4j0jc0n0p] { background: #475569; color: #fff; }
.ah-tier-none[b-v4j0jc0n0p]   { background: #e2e8f0; color: #64748b; }

/* Signature text — 길어서 줄바꿈 허용. 오렌지 → 블루 통일. */
.ah-a4-cell-value.mono.sig[b-v4j0jc0n0p] {
    word-break: break-all; font-size: 0.72rem; color: #1e40af;
    line-height: 1.5;
}

/* Actor/Org name 아래의 작은 ID */
.ah-a4-cell-sub-id[b-v4j0jc0n0p] {
    font-size: 0.65rem !important; color: #64748b !important;
    margin-top: 0.15rem;
}

/* Clickable Actor link */
.ah-a4-cell-link[b-v4j0jc0n0p] {
    display: flex; flex-direction: column; gap: 0.2rem;
    text-decoration: none; cursor: pointer;
    padding: 0.35rem 0.5rem; margin: -0.35rem -0.5rem;
    border-radius: 4px; transition: background 0.12s;
}
.ah-a4-cell-link:hover[b-v4j0jc0n0p] { background: #f1f5f9; }
.ah-a4-cell-link:hover .ah-a4-cell-value.strong[b-v4j0jc0n0p] { color: #1e40af; }

/* Print timestamp */
.ah-a4-print-stamp[b-v4j0jc0n0p] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.62rem; color: #94a3b8;
    margin-bottom: 0.2rem;
}

/* Print CSS 는 global app.css 의 @media print 블록에 있음 (body.ah-print-active 토글). */
/* /Components/Common/Avatar.razor.rz.scp.css */
.ah-avatar[b-40gevxy76l] {
    position: relative;
    border-radius: 50%;
    background: var(--ah-bg-surface, #e2e8f0);
    color: var(--ah-text-sub, #475569);
    overflow: hidden;
    flex-shrink: 0;
    user-select: none;
}

/* 바닥에 깔리는 이니셜 — 사진 없거나 깨지면 이게 보임 */
.ah-avatar-initial[b-40gevxy76l] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    line-height: 1;
    text-transform: uppercase;
}

/* 사진 — 로드되면 이니셜을 덮음. 깨지면 onerror 로 숨겨져 이니셜이 드러남 */
.ah-avatar img[b-40gevxy76l] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* /Components/Common/MetricCard.razor.rz.scp.css */
/* 경로: Components/Common/MetricCard.razor.css */

.metric-card[b-x2talyyddk] {
    background: #ffffff;
    border: 1px solid #f1f5f9;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    height: 100%;
}

.metric-card:hover[b-x2talyyddk] {
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.label[b-x2talyyddk] {
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    color: #64748b;
    font-weight: 500;
}
/* /Components/Common/NotificationMenu.razor.rz.scp.css */
/* 종 아이콘 */
.aws-bell-icon[b-ritpm7dyqb] {
    font-size: 1.15rem !important;
    color: #545b64 !important;
    -webkit-text-stroke: 0.4px;
    cursor: pointer;
    vertical-align: middle;
}

/* 알림 배지 */
.notification-badge[b-ritpm7dyqb] {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #d13212;
    color: white;
    border-radius: 10px;
    padding: 0 4px;
    font-size: 0.65rem;
    font-weight: 800;
    min-width: 16px;
    height: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid white;
    z-index: 10;
}

/* 패널 */
.notification-panel[b-ritpm7dyqb] {
    position: absolute;
    right: 0;
    top: calc(100% + 12px);
    width: 380px;
    max-width: calc(100vw - 40px);
    background: white;
    border: 1px solid #eaeded;
    border-radius: 2px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

/* [2026-08-08 responsive] 종 아이콘 앵커(right:0) 기준이면 폰에서는 패널이 왼쪽
   화면 밖으로 나가 글씨가 잘린다 — 폰에선 앵커를 버리고 뷰포트에 직접 고정. */
@media (max-width: 640px) {
    .notification-panel[b-ritpm7dyqb] {
        position: fixed;
        left: 10px;
        right: 10px;
        top: 66px;   /* 60px 상단바 바로 아래 */
        width: auto;
        max-width: none;
    }
}

/* 헤더 */
.notification-panel-header[b-ritpm7dyqb] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #ffffff;
    border-bottom: 1px solid #eaeded;
}

.notification-panel-header span[b-ritpm7dyqb] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #16191f;
}

.panel-link-small[b-ritpm7dyqb] {
    font-size: 0.8rem;
    color: #0073bb;
    text-decoration: none;
    font-weight: 500;
}

.panel-link-small:hover[b-ritpm7dyqb] { text-decoration: underline; }

/* 🚀 탭 컨테이너: 중앙 정렬 */
.aws-tabs-container[b-ritpm7dyqb] {
    display: flex;
    justify-content: center; /* 🚀 탭 중앙 정렬 */
    gap: 15px; /* 탭 사이 간격 */
    background: #fafafa;
    border-bottom: 1px solid #eaeded;
    padding: 0 8px;
}

.aws-tab[b-ritpm7dyqb] {
    background: transparent;
    border: none;
    padding: 10px 10px;
    font-size: 0.82rem;
    font-weight: 700;
    color: #545b64;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    transition: all 0.1s;
}

.aws-tab.active[b-ritpm7dyqb] {
    color: #0073bb;
    border-bottom: 3px solid #0073bb;
}

.aws-tab:hover:not(.active)[b-ritpm7dyqb] { color: #16191f; }

/* 리스트 영역 */
.notification-panel-body[b-ritpm7dyqb] {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 420px;
    background: white;
}

/* 아이템 */
.notification-item[b-ritpm7dyqb] {
    padding: 16px;
    border-bottom: 1px solid #eaeded;
    cursor: pointer;
    display: flex;
    width: 100%;
}

.notification-item.unread[b-ritpm7dyqb] {
    background: #f1faff; /* 배경색으로만 안읽음 표시 */
}

.notification-item:hover[b-ritpm7dyqb] { background: #f8f9f9; }

/* 텍스트 영역 */
.notification-title[b-ritpm7dyqb] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #16191f;
    line-height: 1.3;
    word-break: break-word;
}

/* 🚀 메시지와 시간이 한 줄에 나오도록 처리 */
.notification-message[b-ritpm7dyqb] {
    font-size: 0.85rem;
    color: #545b64;
    margin-top: 4px;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    word-break: break-word;
}

/* 🚀 시간 텍스트 (이제 인라인 요소) */
.notification-time[b-ritpm7dyqb] {
    color: #879196;
    font-weight: 400;
}

/* Empty State */
.aws-empty-state[b-ritpm7dyqb] {
    padding: 40px 20px;
    text-align: center;
    color: #545b64;
}

.empty-title[b-ritpm7dyqb] {
    font-weight: 700;
    font-size: 0.9rem;
    margin-bottom: 6px;
}

.empty-desc[b-ritpm7dyqb] {
    font-size: 0.82rem;
    line-height: 1.5;
}

/* 배경 */
.panel-backdrop[b-ritpm7dyqb] {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 998;
    background: transparent;
}
/* /Components/Common/TablePager.razor.rz.scp.css */
/* ── 표 하단 페이지네이션 (RolesPermissions 원본 스타일을 공통화) ── */
.pagination-bar[b-4i5852064h] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.75rem 1.5rem; border-top: 1px solid var(--ah-border-soft);
}

.pagination-info[b-4i5852064h] { font-size: 0.72rem; color: var(--ah-text-muted); font-weight: 600; }

.pagination-btns[b-4i5852064h] { display: flex; align-items: center; gap: 0.25rem; }

.pg-btn[b-4i5852064h] {
    padding: 0.3rem 0.6rem; font-size: 0.72rem; font-weight: 600;
    border: 1px solid var(--ah-border); background: var(--ah-bg);
    color: var(--ah-text-sub); border-radius: var(--ah-radius-sm);
    cursor: pointer; transition: all 0.12s;
}

.pg-btn:hover:not(:disabled)[b-4i5852064h] { background: var(--ah-bg-subtle); }
.pg-btn:disabled[b-4i5852064h] { color: var(--ah-text-muted); cursor: default; }
.pg-btn.active[b-4i5852064h] {
    font-weight: 700; border-color: var(--ah-accent);
    background: var(--ah-accent); color: var(--ah-accent-text);
}

.pg-gap[b-4i5852064h] { font-size: 0.72rem; color: var(--ah-text-muted); padding: 0 0.15rem; }
/* /Components/Common/TamperBanner.razor.rz.scp.css */
/* [v25 Tamper-Detect] 시스템 전역 배너 스타일.
   MainLayout 최상단 고정. 다른 모든 컴포넌트 위에. */

.tamper-banner[b-8w2jju4x64] {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100000; /* 모달/Popover 위 */
    background: linear-gradient(90deg, #991b1b 0%, #dc2626 50%, #991b1b 100%);
    color: #fff;
    box-shadow: 0 2px 8px rgba(220, 38, 38, 0.4);
    animation: tamperPulse-b-8w2jju4x64 1.5s ease-in-out infinite;
}

@keyframes tamperPulse-b-8w2jju4x64 {
    0%, 100% { box-shadow: 0 2px 8px rgba(220, 38, 38, 0.4); }
    50% { box-shadow: 0 4px 20px rgba(220, 38, 38, 0.8); }
}

.tamper-banner-content[b-8w2jju4x64] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    max-width: 100%;
}

.tamper-banner-icon[b-8w2jju4x64] {
    font-size: 1.4rem;
    color: #fef2f2;
    animation: tamperBlink-b-8w2jju4x64 1s ease-in-out infinite;
}

@keyframes tamperBlink-b-8w2jju4x64 {
    0%, 50%, 100% { opacity: 1; }
    25%, 75% { opacity: 0.6; }
}

.tamper-banner-text[b-8w2jju4x64] {
    flex: 1;
    font-size: 0.85rem;
    line-height: 1.4;
}

.tamper-banner-text strong[b-8w2jju4x64] {
    font-weight: 700;
    letter-spacing: 0.3px;
}

.tamper-banner-details[b-8w2jju4x64] {
    display: block;
    font-size: 0.75rem;
    margin-top: 2px;
    opacity: 0.95;
}

.tamper-banner-dismiss[b-8w2jju4x64] {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    width: 28px; height: 28px;
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}
.tamper-banner-dismiss:hover[b-8w2jju4x64] {
    background: rgba(255, 255, 255, 0.25);
}

.tamper-banner-detail[b-8w2jju4x64] {
    background: #fff;
    color: #991b1b;
    border: 1px solid #fff;
    padding: 4px 12px;
    border-radius: 4px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.15s;
}
.tamper-banner-detail:hover[b-8w2jju4x64] {
    background: #fef2f2;
}
/* /Components/Common/TamperDetailsModal.razor.rz.scp.css */
/* CreateOrg / UserProfileModal 과 동일한 scoped CSS 패턴. */

.bod-modal-overlay[b-qt78yrksrq] {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(0, 0, 0, 0.55);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 99999; /* TamperBanner(100000) 바로 아래 */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.bod-modal-container[b-qt78yrksrq] {
    background-color: #ffffff;
    width: 100%;
    max-width: 680px;
    max-height: 92vh;
    border-radius: 12px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.15),
                0 10px 10px -5px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
}

.bod-modal-header[b-qt78yrksrq] {
    padding: 1.1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
    background: #ffffff;
}

.btn-close-custom[b-qt78yrksrq] {
    background: transparent;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.15s;
    display: flex;
    align-items: center;
}
.btn-close-custom:hover[b-qt78yrksrq] {
    background-color: #f1f5f9;
    color: #0f172a;
}

.bod-modal-body[b-qt78yrksrq] {
    padding: 1.25rem 1.5rem;
    overflow-y: auto;
    flex: 1;
}

.bod-modal-footer[b-qt78yrksrq] {
    padding: 1rem 1.5rem;
    background-color: #f8fafc;
    border-top: 1px solid #f1f5f9;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-shrink: 0;
}
.bod-modal-footer .btn[b-qt78yrksrq] {
    height: 38px;
    padding: 0 1.25rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
}

/* Tamper list table rows */
.tamper-list[b-qt78yrksrq] {
    max-height: 280px;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}
.tamper-row:hover[b-qt78yrksrq] {
    background-color: #f8fafc;
}
.tamper-row-active[b-qt78yrksrq] {
    background-color: #f1f5f9;
    font-weight: 600;
}
.tamper-list .table thead[b-qt78yrksrq] {
    position: sticky;
    top: 0;
    background: #f8fafc;
    z-index: 1;
}
.tamper-list .table td[b-qt78yrksrq] {
    vertical-align: middle;
    padding: 8px 10px;
}
/* /Components/Common/UserProfileModal.razor.rz.scp.css */
/* =================================================================
   UserProfileModal.razor.css
   .bod-modal-* 스타일의 정본. Blazor scoped CSS 는 컴포넌트 경계를 넘지 못하므로,
   같은 모양을 쓰는 컴포넌트는 각자 복제해서 쓴다(TamperDetailsModal 등).
   [2026-07-27] 원래 출처는 CreateOrg.razor.css 였으나 그 페이지(/org/create)는 삭제됨.
   ================================================================= */

/* 오버레이 (배경) */
.bod-modal-overlay[b-9a7qlifkbp] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 99998; /* TamperBanner (100000) 보다 낮게 */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

/* 모달 컨테이너 (흰색 박스) */
.bod-modal-container[b-9a7qlifkbp] {
    background-color: #ffffff;
    width: 100%;
    max-width: 560px;
    max-height: 92vh;
    border-radius: 12px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.15),
                0 10px 10px -5px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
}

/* 모달 헤더 */
.bod-modal-header[b-9a7qlifkbp] {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0;
}

/* 닫기 버튼 */
.btn-close-custom[b-9a7qlifkbp] {
    background: transparent;
    border: none;
    color: #94a3b8;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.15s;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
}
.btn-close-custom:hover[b-9a7qlifkbp] {
    background-color: #f1f5f9;
    color: #0f172a;
}

/* 모달 본문 — 스크롤 가능 */
.bod-modal-body[b-9a7qlifkbp] {
    padding: 1.5rem;
    overflow-y: auto;
    flex: 1;
}

/* 모달 푸터 — [2026-06-12] 주변 여백 늘리고, 버튼 높이를 MemberDetail Refresh 버튼과 동일하게 맞춤 */
.bod-modal-footer[b-9a7qlifkbp] {
    padding: 1.4rem 1.75rem;
    background-color: #f8fafc;
    border-top: 1px solid #f1f5f9;
    display: flex;
    justify-content: flex-end;
    gap: 0.85rem;
    flex-shrink: 0;
}
/* Refresh 버튼: padding 0.6rem 1.25rem / font 0.75rem / weight 700 / radius 6px 와 동일 */
.bod-modal-footer .btn[b-9a7qlifkbp] {
    height: auto;
    line-height: 1.2;
    padding: 0.6rem 1.4rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 700;
}

/* 본문 내부 입력 스타일 통일 (CreateOrg 의 .auth-input 룰을 여기에도) */
.auth-input[b-9a7qlifkbp] {
    font-size: 0.9rem;
    border-radius: 8px;
    border: 1px solid #d1d5db;
}
.auth-input:focus[b-9a7qlifkbp] {
    border-color: var(--ah-link, #6366f1);
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.15);
    outline: none;
}

.form-label[b-9a7qlifkbp] {
    color: #475569;
    font-size: 0.82rem;
    font-weight: 600;
}

/* .profile-file-input 은 InputFile (자식 컴포넌트) 의 input 에 적용해야 하는데
   Blazor scoped CSS 가 자식 컴포넌트 render 에 b-attribute 안 붙여서 매칭 실패.
   → wwwroot/css/app.css 에 global 로 정의함. */
/* /Components/Layout/AuthLayout.razor.rz.scp.css */

.auth-wrapper[b-whn91e4vcl] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #ffffff;
}

.auth-top-bar[b-whn91e4vcl] {
    height: 0px;
    display: flex;
    align-items: center;
    /* 경계선 없음: 로그인 페이지는 더 깔끔하게 */
}

.auth-main-content[b-whn91e4vcl] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-bottom: 70px; /* 시각적 중앙 정렬 보정 */
}

.avatar-circle[b-whn91e4vcl] {
    width: 32px;
    height: 32px;
    background: #e2e8f0;
    color: #64748b;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}
/* /Components/Layout/BetaModal.razor.rz.scp.css */
/* =========================================
   Beta Modal — Private Beta Popup
========================================= */

.beta-overlay[b-2rbmw34149] {
    position:   fixed;
    inset:      0;
    z-index:    10000;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display:    flex;
    align-items:     center;
    justify-content: center;
    padding:    1.5rem;
    animation:  betaFadeIn-b-2rbmw34149 0.2s ease;
}

@keyframes betaFadeIn-b-2rbmw34149 {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.beta-modal[b-2rbmw34149] {
    position:      relative;
    background:    #ffffff;
    border-radius: 16px;
    padding:       3rem 2.5rem 2.5rem;
    max-width:     520px;
    width:         100%;
    box-shadow:    0 25px 50px rgba(0, 0, 0, 0.25);
    animation:     betaSlideUp-b-2rbmw34149 0.25s ease;
}

@keyframes betaSlideUp-b-2rbmw34149 {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Close ── */
.beta-close[b-2rbmw34149] {
    position:   absolute;
    top:        1rem;
    right:      1rem;
    background: none;
    border:     none;
    font-size:  1.1rem;
    color:      #94a3b8;
    cursor:     pointer;
    padding:    0.4rem;
    line-height: 1;
    transition: color 0.15s;
}
.beta-close:hover[b-2rbmw34149] { color: #1e293b; }

/* ── Title ── */
.beta-title[b-2rbmw34149] {
    font-size:      1.5rem;
    font-weight:    800;
    color:          #111827;
    letter-spacing: -0.03em;
    margin:         0 0 1.5rem;
    line-height:    1.35;
}

.beta-title-jp[b-2rbmw34149] {
    display:     block;
    font-size:   0.95rem;
    font-weight: 500;
    color:       #6b7280;
    margin-top:  0.4rem;
    font-family: 'Noto Sans JP', 'Noto Sans KR', sans-serif;
}

/* ── Body ── */
.beta-body[b-2rbmw34149] {
    font-size:   0.92rem;
    line-height: 1.75;
    color:       #374151;
    margin:      0 0 2rem;
}

.beta-body p[b-2rbmw34149] {
    margin: 0 0 1rem;
}
.beta-body p:last-child[b-2rbmw34149] {
    margin-bottom: 0;
}

.beta-body-jp[b-2rbmw34149] {
    font-family: 'Noto Sans JP', 'Noto Sans KR', sans-serif;
    color:       #6b7280;
    font-size:   0.85rem;
}

/* ── Actions ── */
.beta-actions[b-2rbmw34149] {
    display:        flex;
    gap:            0.75rem;
    flex-wrap:      wrap;
}

.beta-btn[b-2rbmw34149] {
    padding:         0.8rem 1.6rem;
    border-radius:   8px;
    font-size:       0.9rem;
    font-weight:     600;
    text-decoration: none;
    display:         inline-flex;
    align-items:     center;
    gap:             0.4rem;
    transition:      all 0.2s ease;
    cursor:          pointer;
    border:          none;
    text-align:      center;
    justify-content: center;
    flex:            1;
    min-width:       180px;
}

.beta-btn-jp[b-2rbmw34149] {
    font-family: 'Noto Sans JP', 'Noto Sans KR', sans-serif;
    font-weight: 400;
    font-size:   0.8rem;
    opacity:     0.8;
}

.beta-btn-primary[b-2rbmw34149] {
    background: #111827;
    color:      #ffffff;
}
.beta-btn-primary:hover[b-2rbmw34149] {
    background: #1f2937;
    transform:  translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    color:      #ffffff;
}

.beta-btn-secondary[b-2rbmw34149] {
    background:   #ffffff;
    color:        #111827;
    border:       1px solid #d1d5db;
}
.beta-btn-secondary:hover[b-2rbmw34149] {
    background:   #f9fafb;
    border-color: #9ca3af;
    transform:    translateY(-1px);
}

.beta-btn-disabled[b-2rbmw34149] {
    background:     #f3f4f6;
    color:          #9ca3af;
    cursor:         not-allowed;
    position:       relative;
    flex-direction: column;
    gap:            0.2rem;
}

.beta-coming-soon[b-2rbmw34149] {
    font-size:      0.65rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color:          #d97706;
}

/* =========================================
   Responsive
========================================= */
@media (max-width: 480px) {
    .beta-modal[b-2rbmw34149] {
        padding: 2.5rem 1.5rem 2rem;
    }

    .beta-title[b-2rbmw34149] {
        font-size: 1.25rem;
    }

    .beta-actions[b-2rbmw34149] {
        flex-direction: column;
    }

    .beta-btn[b-2rbmw34149] {
        min-width: unset;
        width:     100%;
    }
}
/* /Components/Layout/CookieBanner.razor.rz.scp.css */
/* 경량 쿠키 배너 — 하단 고정 바 */
.ckb[b-rlo728tryd] {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 4000;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    flex-wrap: wrap;
    padding: 0.85rem 1.25rem;
    padding-bottom: calc(0.85rem + env(safe-area-inset-bottom));
    background: #0f172a;
    color: #e2e8f0;
    font-size: 0.85rem;
    line-height: 1.55;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.25);
}

.ckb-text[b-rlo728tryd] { max-width: 640px; }
.ckb-text a[b-rlo728tryd] { color: #93c5fd; text-decoration: underline; }
/* locale-*-only 표시/숨김은 index.html 전역 규칙이 처리 — 여기서 덮지 않는다(특이도 싸움 방지).
   보이는 span 이 display:block 이어도 배너 레이아웃상 무해하다. */

.ckb-actions[b-rlo728tryd] { display: flex; gap: 0.5rem; flex-shrink: 0; }

.ckb-btn[b-rlo728tryd] {
    padding: 0.5rem 1.1rem;
    border-radius: 8px;
    border: 1px solid #475569;
    background: transparent;
    color: #e2e8f0;
    font-size: 0.85rem;
    cursor: pointer;
    white-space: nowrap;
}
.ckb-btn:hover[b-rlo728tryd] { border-color: #94a3b8; }
.ckb-primary[b-rlo728tryd] { background: #2563eb; border-color: #2563eb; color: #fff; font-weight: 600; }
.ckb-primary:hover[b-rlo728tryd] { background: #1d4ed8; }

@media (max-width: 640px) {
    .ckb[b-rlo728tryd] { flex-direction: column; align-items: stretch; gap: 0.7rem; text-align: left; }
    .ckb-actions[b-rlo728tryd] { justify-content: stretch; }
    .ckb-btn[b-rlo728tryd] { flex: 1; }
}
/* /Components/Layout/LandingFooter.razor.rz.scp.css */
/* =========================================
   LandingFooter — light grey, full width
========================================= */

.lf-root[b-8qw8qve0di] {
    background:  #f9fafb;
    border-top:  1px solid #e5e7eb;
    width:       100%;
    box-sizing:  border-box;
    padding:     5rem 2rem 3rem;
}

.lf-inner[b-8qw8qve0di] {
    max-width: 1200px;
    margin:    0 auto;
}

/* ── Top grid ── */
.lf-top[b-8qw8qve0di] {
    display:               grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
    gap:                   3rem;
    margin-bottom:         4rem;
}

/* ── Brand ── */
.lf-brand-col[b-8qw8qve0di] { padding-right: 2rem; }

.lf-brand-name[b-8qw8qve0di] {
    font-size:      1.5rem;
    font-weight:    800;
    color:          #111827;
    letter-spacing: -0.5px;
    margin-bottom:  1rem;
}

.lf-brand-desc[b-8qw8qve0di] {
    font-size:   0.85rem;
    color:       #6b7280;
    line-height: 1.75;
    max-width:   260px;
    margin:      0 0 1.75rem;
}

.lf-socials[b-8qw8qve0di] {
    display: flex;
    gap:     0.6rem;
}

.lf-social-btn[b-8qw8qve0di] {
    width:           36px;
    height:          36px;
    border-radius:   8px;
    border:          1px solid #e5e7eb;
    background:      #ffffff;
    display:         flex;
    align-items:     center;
    justify-content: center;
    color:           #6b7280;
    font-size:       0.88rem;
    text-decoration: none;
    transition:      all 0.15s;
}
.lf-social-btn:hover[b-8qw8qve0di] {
    border-color: var(--ah-link);
    color:        #6366f1;
    background:   #eef2ff;
}

/* ── Columns ── */
.lf-col-title[b-8qw8qve0di] {
    font-size:      0.9rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color:          #9ca3af;
    margin-bottom:  1.75rem;
}

.lf-col-links[b-8qw8qve0di] {
    display:        flex;
    flex-direction: column;
    gap:            1.6rem;
}

.lf-link[b-8qw8qve0di] {
    font-size:       1rem;
    color:           #374151;
    text-decoration: none;
    transition:      color 0.15s;
    display:         flex;
    align-items:     center;
    gap:             0.5rem;
}
.lf-link:hover[b-8qw8qve0di] { color: var(--ah-link); }

.lf-badge[b-8qw8qve0di] {
    font-size:     0.6rem;
    font-weight:   700;
    background:    var(--ah-accent);
    color:         #fff;
    padding:       0.1rem 0.45rem;
    border-radius: 3px;
}

/* ── Bottom ── */
.lf-bottom[b-8qw8qve0di] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding-top:     2rem;
    border-top:      1px solid #e5e7eb;
    flex-wrap:       wrap;
    gap:             1rem;
}

.lf-copy[b-8qw8qve0di] {
    font-size: 0.78rem;
    color:     #9ca3af;
}

.lf-bottom-links[b-8qw8qve0di] {
    display: flex;
    gap:     1.75rem;
}

.lf-bottom-link[b-8qw8qve0di] {
    font-size:       0.78rem;
    color:           #9ca3af;
    text-decoration: none;
    transition:      color 0.15s;
}
.lf-bottom-link:hover[b-8qw8qve0di] { color: #374151; }

/* Business info (PortOne / KR 전자상거래법 표시) */
.lf-business[b-8qw8qve0di] {
    margin-top:    1.25rem;
    padding-top:   1rem;
    border-top:    1px solid #e5e7eb;
}
.lf-business-line[b-8qw8qve0di] {
    display:      block;
    font-size:    0.72rem;
    color:        #6b7280;
    line-height:  1.5;
}
.lf-business-line strong[b-8qw8qve0di] { color: #374151; font-weight: 600; }

/* BusinessAddressRow(자식 컴포넌트, 서버 게이트 주소) 를 business-line 톤으로 — 법적 페이지의
   contact-card 마크업(.lp-contact-row)을 그대로 재사용하므로 footer 에선 모양만 맞춘다. */
.lf-business[b-8qw8qve0di]  .lp-contact-row {
    display:     block;
    font-size:   0.72rem;
    color:       #6b7280;
    line-height: 1.5;
}
.lf-business[b-8qw8qve0di]  .lp-contact-label {
    color:        #374151;
    font-weight:  600;
    margin-right: 0.35rem;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .lf-top[b-8qw8qve0di] { grid-template-columns: 2fr 1fr 1fr 1fr; }
}

@media (max-width: 768px) {
    .lf-top[b-8qw8qve0di] {
        grid-template-columns: 1fr 1fr;
        gap:                   2rem;
    }
    .lf-brand-col[b-8qw8qve0di] { grid-column: 1 / -1; padding-right: 0; }
}

@media (max-width: 480px) {
    .lf-root[b-8qw8qve0di] { padding: 3.5rem 1.25rem 2rem; }
    .lf-top[b-8qw8qve0di]  { grid-template-columns: 1fr 1fr; }
}
/* /Components/Layout/LandingLayout.razor.rz.scp.css */
/* =========================================
   1. 기본 레이아웃 및 헤더
========================================= */
.landing-wrapper[b-w0yscmwb0p] {
    display:        flex;
    flex-direction: column;
    min-height:     100vh;
    background-color: #ffffff;
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

.landing-header[b-w0yscmwb0p] {
    height:           57px;
    width:            100%;
    background-color: #ffffff;
    position:         sticky;
    top:              0;
    z-index:          9999;
    border-bottom:    1px solid #E4E4E7;
    font-family:      'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
    padding:          0;
    display:          block;
}

.landing-header-inner[b-w0yscmwb0p] {
    max-width:       1280px;
    height:          100%;
    margin:          0 auto;
    padding:         0 64px;
    display:         flex;
    align-items:     center;
    justify-content: space-between;
}

/* 브랜드명 */
.landing-header .brand-text[b-w0yscmwb0p] {
    color: #18181B !important;
    font-size: 22px !important;
    font-weight: 800 !important;
    letter-spacing: -0.55px !important;
}

.landing-content[b-w0yscmwb0p] {
    flex:             1;
    display:          flex;
    flex-direction:   column;
    align-items:      center;
    width:            100%;
    background-color: #ffffff;
    padding-top:      0;
    padding-bottom:   0;
}
/* =========================================
   2. 상단 GNB 메뉴
========================================= */
.landing-nav[b-w0yscmwb0p]  .dropdown {
    position: static;
}

.landing-nav[b-w0yscmwb0p]  .nav-link {
    color:            #52525B;
    font-weight:      500;
    font-size:        13px;
    line-height:      20px;
    padding:          4px 12px;
    border-radius:    6px;
    background-color: transparent;
    border:           none;
    text-decoration:  none;
    cursor:           pointer;
    transition:       color 0.15s;
    font-family:      'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
}

.landing-nav[b-w0yscmwb0p]  .nav-link:hover,
.landing-nav[b-w0yscmwb0p]  .dropdown:hover .nav-link {
    background-color: transparent;
    color:            #18181B;
}

/* =========================================
   3. 메가 메뉴 패널
========================================= */
[b-w0yscmwb0p] .mega-menu-panel {
    display:          none;
    position:         absolute;
    top:              57px;
    left:             0;
    width:            100%;
    background-color: #ffffff !important;
    border:           none !important;
    border-radius:    0 0 16px 16px !important;
    box-shadow:       0 24px 40px -12px rgba(0, 0, 0, 0.18) !important;
    padding:          60px 40px 70px 40px;
    z-index:          9999;
}

[b-w0yscmwb0p] .mega-menu-panel.show {
    display: block;
}

[b-w0yscmwb0p] .menu-heading {
    font-size:      0.75rem;
    color:          #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight:    600;
    margin-bottom:  16px;
    margin-top:     8px;
}

/* Product 메뉴 badge CSS = LandingLayoutProduct.razor.css 의 자체 scoped CSS 로 이동 (same-component attribute scope, ::deep 불필요) */

/* =========================================
   4. Solutions 메뉴 아이템
========================================= */
[b-w0yscmwb0p] .industry-link-item {
    display:         block;
    color:           #111111;
    font-weight:     500;
    font-size:       1.05rem;
    text-decoration: none;
    padding:         8px 12px;
    margin-left:     -12px;
    border-radius:   6px;
    transition:      all 0.2s;
    margin-bottom:   8px;
}

[b-w0yscmwb0p] .industry-link-item:hover,
[b-w0yscmwb0p] .industry-link-item.active-hover {
    background-color: #f4f4f5;
    color:            #000000;
    font-weight:      600;
}

[b-w0yscmwb0p] .solution-highlight-card {
    padding-left: 50px;
    height:       100%;
    min-height:   450px;
    display:      flex;
    flex-direction: column;
    animation:    fadeIn-b-w0yscmwb0p 0.2s ease-in-out;
}

@keyframes fadeIn-b-w0yscmwb0p {
    from { opacity: 0; transform: translateY(3px); }
    to   { opacity: 1; transform: translateY(0); }
}

[b-w0yscmwb0p] .solution-highlight-img {
    width:         100%;
    max-width:     380px;
    aspect-ratio:  4 / 3;
    object-fit:    cover;
    border-radius: 10px;
    margin-bottom: 24px;
    box-shadow:    0 10px 15px -3px rgba(0, 0, 0, 0.1);
    filter:        grayscale(100%);
}

[b-w0yscmwb0p] .solution-highlight-title {
    font-size:      1.25rem;
    font-weight:    700;
    color:          #111827;
    margin-bottom:  12px;
    letter-spacing: -0.02em;
}

[b-w0yscmwb0p] .solution-highlight-desc {
    font-size:   0.95rem;
    color:       #4b5563;
    line-height: 1.6;
    margin-bottom: 20px;
    max-width:   380px;
    min-height:  120px;
}

[b-w0yscmwb0p] .solution-learn-more {
    font-size:       0.95rem;
    font-weight:     600;
    color:           #111111;
    text-decoration: none;
    display:         inline-flex;
    align-items:     center;
    transition:      color 0.2s;
}

[b-w0yscmwb0p] .solution-learn-more:hover {
    color:           #4b5563;
    text-decoration: underline;
    text-underline-offset: 4px;
}

[b-w0yscmwb0p] .hlt-tech,
[b-w0yscmwb0p] .hlt-finance,
[b-w0yscmwb0p] .hlt-biz {
    color:            #4f46e5;
    font-weight:      700;
    background-color: #eef2ff;
    padding:          0 4px;
    border-radius:    4px;
}

/* =========================================
   5. Product 메뉴 링크
========================================= */
[b-w0yscmwb0p] .product-link-item {
    display:         block;
    text-decoration: none;
    margin-bottom:   24px;
    padding:         8px 12px;
    margin-left:     -12px;
    border-radius:   8px;
    transition:      background-color 0.2s, transform 0.2s;
}

[b-w0yscmwb0p] .product-link-item:hover {
    background-color: #f8f9fa;
    transform:        translateX(4px);
}

[b-w0yscmwb0p] .product-link-title {
    display:     block;
    font-size:   1.05rem;
    font-weight: 600;
    color:       #111111;
    margin-bottom: 4px;
    transition:  color 0.2s;
}

[b-w0yscmwb0p] .product-link-item:hover .product-link-title {
    color: #2563eb;
}

[b-w0yscmwb0p] .product-link-desc {
    display:      block;
    font-size:    0.85rem;
    color:        #6b7280;
    line-height:  1.5;
    letter-spacing: -0.01em;
}

[b-w0yscmwb0p] .partner-badge:hover {
    background-color: #f8f9fa !important;
    border-color:     #4f46e5 !important;
    transform:        translateY(-1px);
    box-shadow:       0 2px 4px rgba(0, 0, 0, 0.05);
}

/* =========================================
   6. 우측 버튼
========================================= */
.btn-kinde-primary[b-w0yscmwb0p] {
    display:          inline-flex;
    align-items:      center;
    justify-content:  center;
    background-color: #27272A;
    color:            rgba(255,255,255,0.92);
    border:           none;
    border-radius:    6px;
    padding:          7px 14px;     /* height는 padding으로 결정 — Inter 메트릭과 자연스러운 정렬 */
    font-family:      'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight:      500;
    font-size:        13px;
    line-height:      1.4;
    text-decoration:  none;
    cursor:           pointer;
    transition:       background-color 0.15s;
    box-shadow:       inset 0 0.75px 0 0 rgba(255,255,255,0.2),
                      0 1px 2px 0 rgba(0,0,0,0.4),
                      0 0 0 1px #18181B;
}

.btn-kinde-primary:hover[b-w0yscmwb0p] {
    background-color: #3F3F46;
    color:            rgba(255,255,255,0.92);
}

.btn-kinde-secondary[b-w0yscmwb0p] {
    display:         inline-flex;
    align-items:     center;
    height:          28px;
    color:           #52525B;
    font-family:     'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight:     500;
    font-size:       13px;
    line-height:     20px;
    text-decoration: none;
    margin-right:    16px;
    padding:         0 8px;
    transition:      color 0.15s;
}

.btn-kinde-secondary:hover[b-w0yscmwb0p] {
    color: #18181B;
}

/* =========================================
   7. 헤더 유틸리티
========================================= */
.aws-divider[b-w0yscmwb0p] {
    width:            1px;
    height:           14px;
    background-color: rgba(255, 255, 255, 0.2);
    margin:           0 8px;
    display:          inline-block;
}

.badge-light-gray[b-w0yscmwb0p] {
    background-color: rgba(255, 255, 255, 0.08);
    color:            #d1d5db;
    border:           1px solid rgba(255, 255, 255, 0.15);
}

/* 알림 아이콘 */
[b-w0yscmwb0p] .aws-bell-icon {
    font-size:  1.2rem;
    color:      #94a3b8;
    transition: color 0.2s;
}

[b-w0yscmwb0p] .btn-link:hover .aws-bell-icon {
    color: #cbd5e1;
}

[b-w0yscmwb0p] .notification-badge {
    position:     absolute;
    top:          -2px;
    right:        -2px;
    background:   #d13212;
    color:        white;
    border-radius: 10px;
    padding:      0 4px;
    font-size:    0.65rem;
    font-weight:  800;
    min-width:    16px;
    height:       16px;
    display:      flex;
    align-items:  center;
    justify-content: center;
    border:       2px solid #000000;
    z-index:      10;
}

/* =========================================
   8. 프로필 메뉴 팝업
========================================= */
[b-w0yscmwb0p] .profile-backdrop {
    position:   fixed;
    top:        0;
    left:       0;
    width:      100vw;
    height:     100vh;
    z-index:    999;
    background: transparent;
    cursor:     default;
}

[b-w0yscmwb0p] .dropdown-menu-container {
    display:       none;
    position:      absolute;
    right:         0;
    top:           100%;
    width:         260px;
    background:    white;
    border-radius: 12px;
    box-shadow:    0 10px 25px rgba(0, 0, 0, 0.15);
    padding:       12px;
    z-index:       1000;
    margin-top:    10px;
    overflow:      hidden;
}

[b-w0yscmwb0p] .dropdown-menu-container.show {
    display: block;
}

[b-w0yscmwb0p] .menu-slider {
    display:    flex;
    width:      200%;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-w0yscmwb0p] .menu-slider.slide-active {
    transform: translateX(-50%);
}

[b-w0yscmwb0p] .menu-page {
    width:          50%;
    flex-shrink:    0;
    display:        flex;
    flex-direction: column;
    min-height:     280px;
}

[b-w0yscmwb0p] .dropdown-item-custom {
    display:         flex;
    align-items:     center;
    justify-content: flex-start;
    padding:         0.7rem 1rem;
    font-size:       1rem;
    font-weight:     500;
    color:           #475569;
    cursor:          pointer;
    border:          none;
    background:      none;
    width:           100%;
    text-align:      left;
    border-radius:   8px;
    margin-bottom:   4px;
}

[b-w0yscmwb0p] .dropdown-item-custom:hover {
    background-color: #f1f5f9;
    color:            #0f172a;
}

[b-w0yscmwb0p] .dropdown-item-custom.selected-lang {
    font-weight: 700 !important;
    color:       #0f172a !important;
}

[b-w0yscmwb0p] .dropdown-item-custom.sign-out-btn { color: #0f172a; }
[b-w0yscmwb0p] .dropdown-item-custom.sign-out-btn:hover { background-color: #f1f5f9; }

[b-w0yscmwb0p] .dropdown-header-custom {
    font-size:      0.8rem;
    font-weight:    700;
    color:          #94a3b8;
    text-transform: uppercase;
    padding:        8px 12px;
    letter-spacing: 0.05em;
    margin-top:     8px;
}

[b-w0yscmwb0p] .back-btn-container {
    margin-top:   auto;
    padding-top:  12px;
    padding-left: 12px;
}

[b-w0yscmwb0p] .back-btn {
    color:       #94a3b8;
    font-size:   0.8rem;
    font-weight: 500;
    cursor:      pointer;
    display:     flex;
    align-items: center;
    border:      none;
    background:  none;
}
[b-w0yscmwb0p] .back-btn:hover { color: #64748b; }

[b-w0yscmwb0p] .avatar-circle {
    width:           36px;
    height:          36px;
    background:      #0f172a;
    color:           white;
    border-radius:   50%;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-weight:     bold;
    font-size:       1rem;
    overflow:        hidden;
}

[b-w0yscmwb0p] .avatar-img {
    width:      100%;
    height:     100%;
    object-fit: cover;
}

/* =========================================
   9. Mobile Hamburger & Drawer
========================================= */
.mobile-hamburger[b-w0yscmwb0p] {
    background:  none;
    border:      none;
    color:       #18181B;
    font-size:   1.6rem;
    padding:     6px;
    cursor:      pointer;
    line-height: 1;
    display:     flex;
    align-items: center;
}

.mobile-drawer-backdrop[b-w0yscmwb0p] {
    position:   fixed;
    inset:      0;
    background: rgba(0, 0, 0, 0.5);
    z-index:    10000;
    backdrop-filter: blur(2px);
}

.mobile-drawer[b-w0yscmwb0p] {
    position:        fixed;
    top:             0;
    right:           0;
    width:           320px;
    max-width:       85vw;
    /* [2026-07-03] 100vh 는 iPad/iPhone Safari 에서 하단 브라우저 바/홈 인디케이터를 안 빼
       맨 밑 "Start for free" 가 잘렸다 → 동적 뷰포트 높이(dvh)로 실제 보이는 영역에 맞춘다. */
    height:          100vh;
    height:          100dvh;
    background:      #111113;
    z-index:         10001;
    transform:       translateX(100%);
    transition:      transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    display:         flex;
    flex-direction:  column;
    overflow-y:      auto;
    -webkit-overflow-scrolling: touch;
}
.mobile-drawer.open[b-w0yscmwb0p] {
    transform: translateX(0);
}

.drawer-header[b-w0yscmwb0p] {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         1.25rem 1.5rem;
    border-bottom:   1px solid rgba(255,255,255,0.08);
    flex-shrink:     0;
}

.drawer-brand[b-w0yscmwb0p] {
    font-size:      1.4rem;
    font-weight:    800;
    color:          #ffffff;
    letter-spacing: -0.5px;
}

.drawer-close[b-w0yscmwb0p] {
    background: none;
    border:     none;
    color:      rgba(255,255,255,0.5);
    font-size:  1.2rem;
    cursor:     pointer;
    padding:    4px;
    transition: color 0.15s;
}
.drawer-close:hover[b-w0yscmwb0p] { color: #ffffff; }

.drawer-nav[b-w0yscmwb0p] {
    flex:       1;
    padding:    0.75rem 0;
    overflow-y: auto;
}

.drawer-nav-item[b-w0yscmwb0p] {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    width:           100%;
    padding:         0.9rem 1.5rem;
    font-size:       1rem;
    font-weight:     500;
    color:           rgba(255,255,255,0.8);
    text-decoration: none;
    background:      none;
    border:          none;
    cursor:          pointer;
    text-align:      left;
    transition:      background 0.15s, color 0.15s;
}
.drawer-nav-item:hover[b-w0yscmwb0p] {
    background: rgba(255,255,255,0.05);
    color:      #ffffff;
}

.drawer-accordion i[b-w0yscmwb0p] {
    font-size:  0.7rem;
    transition: transform 0.25s ease;
    color:      rgba(255,255,255,0.35);
}
.drawer-accordion i.rotated[b-w0yscmwb0p] {
    transform: rotate(180deg);
}

.drawer-sub-items[b-w0yscmwb0p] {
    padding: 0 1.5rem 0.5rem 2rem;
}

.drawer-sub-heading[b-w0yscmwb0p] {
    font-size:      0.68rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color:          rgba(255,255,255,0.3);
    padding:        0.75rem 0 0.35rem;
}
.drawer-sub-items .drawer-sub-heading:first-child[b-w0yscmwb0p] {
    padding-top: 0.25rem;
}

.drawer-sub-items a[b-w0yscmwb0p] {
    display:         block;
    padding:         0.5rem 0.75rem;
    font-size:       0.88rem;
    color:           rgba(255,255,255,0.6);
    text-decoration: none;
    border-radius:   6px;
    transition:      background 0.15s, color 0.15s;
}
.drawer-sub-items a:hover[b-w0yscmwb0p] {
    background: rgba(255,255,255,0.06);
    color:      #ffffff;
}

.drawer-auth[b-w0yscmwb0p] {
    /* 하단 세이프에어리어(홈 인디케이터)만큼 더 띄워 버튼이 화면 맨 밑에 붙지 않게 한다. */
    padding:      1.25rem 1.5rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
    border-top:   1px solid rgba(255,255,255,0.08);
    display:      flex;
    flex-direction: column;
    gap:          0.6rem;
    flex-shrink:  0;
}

.drawer-btn-primary[b-w0yscmwb0p] {
    display:         block;
    text-align:      center;
    padding:         0.8rem;
    background:      #ffffff;
    color:           #000000;
    border-radius:   8px;
    font-weight:     600;
    font-size:       0.95rem;
    text-decoration: none;
    transition:      background 0.15s;
}
.drawer-btn-primary:hover[b-w0yscmwb0p] {
    background: #e2e8f0;
    color:      #000000;
}

.drawer-btn-secondary[b-w0yscmwb0p] {
    display:         block;
    text-align:      center;
    padding:         0.8rem;
    background:      transparent;
    color:           rgba(255,255,255,0.7);
    border:          1px solid rgba(255,255,255,0.2);
    border-radius:   8px;
    font-weight:     500;
    font-size:       0.95rem;
    text-decoration: none;
    transition:      border-color 0.15s, color 0.15s;
}
.drawer-btn-secondary:hover[b-w0yscmwb0p] {
    border-color: rgba(255,255,255,0.5);
    color:        #ffffff;
}

/* ── Header responsive ── */
/* ====================================================================
   Nav visibility — 1200px 기준 desktop nav vs hamburger 분기
==================================================================== */

/* Desktop ≥ 1200px: full nav + 로그인 버튼, 햄버거 숨김 */
@media (min-width: 1200px) {
    .landing-nav[b-w0yscmwb0p]            { display: flex !important; }
    .btn-kinde-secondary[b-w0yscmwb0p],
    .btn-kinde-primary[b-w0yscmwb0p]      { display: inline-block !important; }
    .lang-pill[b-w0yscmwb0p]              { display: inline-flex !important; }
    .profile-menu-desktop[b-w0yscmwb0p]   { display: block !important; }
    .mobile-hamburger[b-w0yscmwb0p]       { display: none !important; }
}

/* Below 1200px (iPad Pro 이하 모든 사이즈): 햄버거 메뉴 */
@media (max-width: 1199.98px) {
    .landing-header[b-w0yscmwb0p]        { padding: 0; }
    .landing-header-inner[b-w0yscmwb0p]  { padding: 0 16px; }
    .landing-nav[b-w0yscmwb0p]           { display: none !important; }
    .btn-kinde-secondary[b-w0yscmwb0p],
    .btn-kinde-primary[b-w0yscmwb0p]     { display: none !important; }
    /* 헤더 알약은 여기서 사라지고 드로어의 .drawer-lang 이 이어받는다.
       빼먹으면 햄버거 옆에 EN 알약만 덩그러니 남고 드로어와 중복된다(실측). */
    .lang-pill[b-w0yscmwb0p]             { display: none !important; }
    .profile-menu-desktop[b-w0yscmwb0p]  { display: none !important; }
    .mobile-hamburger[b-w0yscmwb0p]      { display: flex !important; }
}

@media (max-width: 480px) {
    .mobile-drawer[b-w0yscmwb0p] {
        width: 100vw;
        max-width: 100vw;
    }
}

/* =========================================
   10. 스켈레톤 로딩
========================================= */
.skeleton-box[b-w0yscmwb0p] {
    background:      linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
    background-size: 200% 100%;
    animation:       loading-skeleton-b-w0yscmwb0p 1.5s infinite;
    border-radius:   4px;
}

@keyframes loading-skeleton-b-w0yscmwb0p {
    0%   { background-position:  200% 0; }
    100% { background-position: -200% 0; }
}

/* =========================================
   언어 전환 — 랜딩 헤더 / 드로어
   로그아웃 방문자 전용. 로그인 상태의 전환은 ProfileMenu 안에 이미 있다.
========================================= */

.lang-pill[b-w0yscmwb0p] {
    display:      inline-flex;
    align-items:  center;
    gap:          5px;
    height:       28px;
    margin-left:  14px;
    padding:      0 10px;
    background:   transparent;
    color:        #52525B;
    border:       1px solid #E4E4E7;
    border-radius: 999px;
    font-family:  'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight:  500;
    font-size:    12px;
    line-height:  1;
    letter-spacing: 0.02em;
    cursor:       pointer;
    transition:   color 0.15s, border-color 0.15s;
}
.lang-pill:hover[b-w0yscmwb0p] {
    color:        #18181B;
    border-color: #A1A1AA;
}
.lang-pill i[b-w0yscmwb0p] {
    font-size: 13px;
}

/* 드로어는 어두운 배경이라 헤더와 반대 팔레트를 쓴다. */
.drawer-lang[b-w0yscmwb0p] {
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             6px;
    width:           100%;
    margin-top:      0.6rem;
    padding:         0.7rem;
    background:      transparent;
    color:           rgba(255,255,255,0.7);
    border:          1px solid rgba(255,255,255,0.2);
    border-radius:   8px;
    font-weight:     500;
    font-size:       0.9rem;
    cursor:          pointer;
    transition:      border-color 0.15s, color 0.15s;
}
.drawer-lang:hover[b-w0yscmwb0p] {
    border-color: rgba(255,255,255,0.5);
    color:        #ffffff;
}
/* /Components/Layout/LanguageModal.razor.rz.scp.css */
/* =========================================
   Language Modal — 랜딩 언어 선택 팝업
   골격(overlay/애니메이션/닫기)은 BetaModal.razor.css 를 따른다.
========================================= */

.lang-overlay[b-l6javrq5dk] {
    position:   fixed;
    inset:      0;
    z-index:    10000;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    display:    flex;
    align-items:     center;
    justify-content: center;
    padding:    1.5rem;
    animation:  langFadeIn-b-l6javrq5dk 0.2s ease;
}

@keyframes langFadeIn-b-l6javrq5dk {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.lang-modal[b-l6javrq5dk] {
    position:      relative;
    background:    #ffffff;
    border-radius: 16px;
    padding:       2.25rem 1.75rem 1.5rem;
    max-width:     380px;
    width:         100%;
    box-shadow:    0 25px 50px rgba(0, 0, 0, 0.25);
    animation:     langSlideUp-b-l6javrq5dk 0.25s ease;
}

@keyframes langSlideUp-b-l6javrq5dk {
    from { opacity: 0; transform: translateY(16px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Close ── */
.lang-close[b-l6javrq5dk] {
    position:    absolute;
    top:         1rem;
    right:       1rem;
    background:  none;
    border:      none;
    font-size:   1.1rem;
    color:       #94a3b8;
    cursor:      pointer;
    padding:     0.4rem;
    line-height: 1;
    transition:  color 0.15s;
}
.lang-close:hover[b-l6javrq5dk] { color: #1e293b; }

/* ── Title ── */
.lang-title[b-l6javrq5dk] {
    font-size:      1.15rem;
    font-weight:    800;
    color:          #111827;
    letter-spacing: -0.02em;
    margin:         0 0 1.15rem;
    line-height:    1.35;
}

/* ── List ── */
.lang-list[b-l6javrq5dk] {
    display:        flex;
    flex-direction: column;
    gap:            2px;
}

.lang-item[b-l6javrq5dk] {
    display:     flex;
    align-items: baseline;
    gap:         0.5rem;
    width:       100%;
    text-align:  left;
    background:  none;
    border:      none;
    border-radius: 8px;
    padding:     0.62rem 0.7rem;
    cursor:      pointer;
    transition:  background 0.15s;
    /* CJK 이름이 시스템 기본 폰트로 떨어지면 자간이 무너진다 — 다른 팝업과 같은 스택으로 맞춘다. */
    font-family: 'Noto Sans JP', 'Noto Sans KR', sans-serif;
}
.lang-item:hover[b-l6javrq5dk] { background: #f3f4f6; }

.lang-item.is-current[b-l6javrq5dk] { background: #f9fafb; }

.lang-item-native[b-l6javrq5dk] {
    font-size:   0.95rem;
    font-weight: 600;
    color:       #111827;
}

.lang-item-english[b-l6javrq5dk] {
    font-size: 0.78rem;
    color:     #9ca3af;
}

.lang-item-check[b-l6javrq5dk] {
    margin-left: auto;
    font-size:   0.95rem;
    color:       #111827;
}

@media (max-width: 480px) {
    .lang-modal[b-l6javrq5dk] {
        padding: 2rem 1.25rem 1.25rem;
    }
}
/* /Components/Layout/ProfileMenu.razor.rz.scp.css */
/* ProfileMenu — CSS variable 기반 (dark mode 지원) */

.dropdown-menu-container[b-5edsrztbl8] {
    display:       none;
    position:      absolute;
    right:         0;
    top:           100%;
    width:         260px;
    background: var(--ah-bg, #ffffff);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-lg);
    border:        1px solid var(--ah-border-soft);
    padding:       12px;
    z-index:       1000;
    margin-top:    10px;
    overflow:      hidden;
}

.dropdown-menu-container.show[b-5edsrztbl8] { display: block; }

.menu-slider[b-5edsrztbl8] {
    display:    flex;
    width:      200%;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.menu-slider.slide-active[b-5edsrztbl8] { transform: translateX(-50%); }

.menu-page[b-5edsrztbl8] {
    width:          50%;
    flex-shrink:    0;
    display:        flex;
    flex-direction: column;
    min-height:     280px;
}

/* ── Menu items ── */
.dropdown-item-custom[b-5edsrztbl8] {
    display:         flex;
    align-items:     center;
    justify-content: flex-start;
    padding:         0.7rem 1rem;
    font-size:       0.88rem;
    font-weight:     500;
    color:           var(--ah-text-sub);
    cursor:          pointer;
    border:          none;
    background:      none;
    width:           100%;
    text-align:      left;
    border-radius:   8px;
    margin-bottom:   2px;
    transition:      background 0.12s, color 0.12s;
}

.dropdown-item-custom:hover[b-5edsrztbl8] {
    background: var(--ah-bg-surface);
    color:      var(--ah-text);
}

.dropdown-item-custom.selected-lang[b-5edsrztbl8] {
    font-weight: 700;
    color:       var(--ah-text);
    background:  var(--ah-bg-subtle);
}

.dropdown-item-custom.sign-out-btn[b-5edsrztbl8]        { color: var(--ah-text); }
.dropdown-item-custom.sign-out-btn:hover[b-5edsrztbl8]  { background: var(--ah-bg-surface); }

/* ── Header ── */
.dropdown-header-custom[b-5edsrztbl8] {
    font-size:      0.72rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    padding:        8px 12px 4px;
    letter-spacing: 0.05em;
    margin-top:     4px;
}

/* ── Role pill (이름 옆 역할 뱃지) ── */
.role-pill[b-5edsrztbl8] {
    flex-shrink:    0;
    font-size:      0.62rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding:        2px 7px;
    border-radius:  999px;
    line-height:    1.4;
    white-space:    nowrap;
    border:         1px solid transparent;
}

/* Owner = accent 강조 */
.role-pill-owner[b-5edsrztbl8] {
    background: var(--ah-accent-subtle, #eef2ff);
    color:      var(--ah-accent, #4f46e5);
    border-color: var(--ah-accent-border, #c7d2fe);
}

/* Admin = 보조 강조 */
.role-pill-admin[b-5edsrztbl8] {
    background: #fef3c7;
    color:      #b45309;
    border-color: #fde68a;
}

/* Member / 그 외 = 중립 */
.role-pill-member[b-5edsrztbl8] {
    background: var(--ah-bg-subtle, #f1f5f9);
    color:      var(--ah-text-muted, #64748b);
    border-color: var(--ah-border-soft, #e2e8f0);
}

/* ── Back button ── */
.back-btn-container[b-5edsrztbl8] { margin-top: auto; padding-top: 12px; padding-left: 12px; }

.back-btn[b-5edsrztbl8] {
    color:       var(--ah-text-muted);
    font-size:   0.8rem;
    font-weight: 500;
    cursor:      pointer;
    display:     flex;
    align-items: center;
    border:      none;
    background:  none;
    transition:  color 0.12s;
}
.back-btn:hover[b-5edsrztbl8] { color: var(--ah-text-sub); }

/* ── Avatar ── */
.avatar-circle[b-5edsrztbl8] {
    width:           32px;
    height:          32px;
    background:      var(--ah-accent);
    color:           var(--ah-accent-text);
    border-radius:   50%;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-weight:     bold;
    font-size:       0.9rem;
    overflow:        hidden;
    flex-shrink:     0;
}

.avatar-img[b-5edsrztbl8] { width: 100%; height: 100%; object-fit: cover; }

/* ── Backdrop ── */
.profile-backdrop[b-5edsrztbl8] {
    position:   fixed;
    top:        0;
    left:       0;
    width:      100vw;
    height:     100vh;
    z-index:    999;
    background: transparent;
    cursor:     default;
}

/* ── Dark mode toggle row ── */
.theme-toggle-row[b-5edsrztbl8] {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         0.7rem 1rem;
    border-radius:   8px;
    margin-bottom:   2px;
    cursor:          pointer;
    transition:      background 0.12s;
}
.theme-toggle-row:hover[b-5edsrztbl8] { background: var(--ah-bg-surface); }

.theme-toggle-label[b-5edsrztbl8] {
    display:     flex;
    align-items: center;
    font-size:   0.88rem;
    font-weight: 500;
    color:       var(--ah-text-sub);
    gap:         0.5rem;
    user-select: none;
}

.theme-switch[b-5edsrztbl8] {
    width:         36px;
    height:        20px;
    border-radius: 10px;
    background:    #cbd5e1;
    position:      relative;
    transition:    background 0.2s;
    flex-shrink:   0;
}

.theme-switch.dark[b-5edsrztbl8] { background: #eac4ff; }

.theme-knob[b-5edsrztbl8] {
    position:      absolute;
    top:           2px;
    left:          2px;
    width:         16px;
    height:        16px;
    border-radius: 50%;
    background:    #ffffff;
    box-shadow:    0 1px 3px rgba(0, 0, 0, 0.2);
    transition:    transform 0.2s;
}

.theme-switch.dark .theme-knob[b-5edsrztbl8] { transform: translateX(16px); }
/* /Components/Shared/ActionLibraryDrawer.razor.rz.scp.css */
/* [2026-07-17] 공유 Action Library 드로어 — 원본 CreateForm cf-drawer 스타일 그대로 (값 동일).
   z-index 만 모달 위로 올림(RolesDetail 모달 위에 뜨도록). */

/* ── Right slide-over drawer (di-drawer 패턴) ── */
.ald-overlay[b-4v2j46rgpb] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    z-index: 1300;
    display: flex;
    justify-content: flex-end;
}
.ald-drawer[b-4v2j46rgpb] {
    width: 600px;               /* [2026-07-17] 넓힘 — 탭·리스트가 가로 스크롤 없이 들어가게 */
    max-width: 94vw;
    height: 100%;
    background: #fff;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.18);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.ald-head[b-4v2j46rgpb] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.25rem 1.5rem 1rem;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}
.ald-title[b-4v2j46rgpb] { font-size: 1.05rem; font-weight: 800; color: #0f172a; letter-spacing: -0.3px; }
.ald-sub[b-4v2j46rgpb] { font-size: 0.8rem; color: #94a3b8; margin-top: 0.15rem; }
.ald-x[b-4v2j46rgpb] {
    background: none; border: none; font-size: 1.5rem; line-height: 1; color: #94a3b8; cursor: pointer;
}
.ald-x:hover[b-4v2j46rgpb] { color: #0f172a; }

.ald-tabs[b-4v2j46rgpb] {
    display: flex; gap: 0.6rem; padding: 0.6rem 1.5rem 0;
    border-bottom: 1px solid #f1f5f9; flex-shrink: 0;
    overflow-x: auto;   /* [2026-07-17] 5탭(+커넥터) → 좁으면 가로 스크롤 */
}
.ald-tab[b-4v2j46rgpb] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    background: none; border: none; border-bottom: 2px solid transparent;
    padding: 0.5rem 0.4rem 0.7rem; margin-bottom: -1px;
    font-size: 0.86rem; font-weight: 600; color: #94a3b8; cursor: pointer;
}
.ald-tab:hover[b-4v2j46rgpb] { color: #475569; }
.ald-tab.on[b-4v2j46rgpb] { color: #0f172a; border-bottom-color: #0f172a; }
.ald-tab-count[b-4v2j46rgpb] {
    font-size: 0.7rem; font-weight: 700; color: #64748b;
    background: #f1f5f9; padding: 0.05rem 0.45rem; border-radius: 99px;
}

.ald-search[b-4v2j46rgpb] { padding: 0.75rem 1.5rem 0; flex-shrink: 0; }
.ald-input[b-4v2j46rgpb] {
    width: 100%; box-sizing: border-box;
    border: 1px solid #e2e8f0; border-radius: 10px; color: #0f172a; background: #fff;
    font-size: 0.85rem; padding: 0.5rem 0.7rem;
}
.ald-input:focus[b-4v2j46rgpb] { outline: none; border-color: #0f172a; }

.ald-body[b-4v2j46rgpb] { padding: 0.75rem 1.5rem 1.5rem; flex: 1; overflow-y: auto; }
/* [2026-07-17] 스크롤바 subtle (보기싫음 → 얇게/흐리게) */
.ald-body[b-4v2j46rgpb]::-webkit-scrollbar, .ald-tabs[b-4v2j46rgpb]::-webkit-scrollbar { width: 6px; height: 6px; }
.ald-body[b-4v2j46rgpb]::-webkit-scrollbar-thumb, .ald-tabs[b-4v2j46rgpb]::-webkit-scrollbar-thumb { background: #e2e8f0; border-radius: 999px; }
.ald-body[b-4v2j46rgpb]::-webkit-scrollbar-track, .ald-tabs[b-4v2j46rgpb]::-webkit-scrollbar-track { background: transparent; }

/* Select all / Clear 행 */
.ald-selrow[b-4v2j46rgpb] { display: flex; gap: 0.5rem; margin: 0.2rem 0 0.6rem; }
.ald-linkbtn[b-4v2j46rgpb] { background: none; border: none; padding: 0.2rem 0.1rem; font-size: 0.8rem; font-weight: 700; color: #0f172a; cursor: pointer; }
.ald-linkbtn:hover[b-4v2j46rgpb] { text-decoration: underline; }
.ald-linkbtn + .ald-linkbtn[b-4v2j46rgpb] { color: #94a3b8; }

.ald-group[b-4v2j46rgpb] {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.05em; color: #cbd5e1; margin: 1.1rem 0 0.45rem;
}
.ald-list[b-4v2j46rgpb] { display: flex; flex-direction: column; gap: 0.4rem; }

.ald-row[b-4v2j46rgpb] {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    text-align: left; padding: 0.7rem 0.9rem;
    border: 1px solid #e2e8f0; border-radius: 10px; background: #fff; cursor: pointer;
    transition: all 0.12s ease;
}
.ald-row:hover[b-4v2j46rgpb] { border-color: #cbd5e1; }
.ald-row.on[b-4v2j46rgpb] { border-color: #0f172a; background: #f8fafc; box-shadow: inset 0 0 0 1px #0f172a; }
.ald-check[b-4v2j46rgpb] { flex: none; width: 1rem; color: #4f46e5; font-weight: 800; font-size: 0.85rem; }
.ald-main[b-4v2j46rgpb] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; flex: 1 1 auto; }
.ald-t[b-4v2j46rgpb] { font-weight: 600; font-size: 0.9rem; color: #0f172a; }
.ald-scope[b-4v2j46rgpb] { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.72rem; color: #94a3b8; }
.ald-risk[b-4v2j46rgpb] {
    flex-shrink: 0; font-size: 0.7rem; font-weight: 600; color: #64748b;
    background: #f1f5f9; padding: 0.12rem 0.55rem; border-radius: 99px;
}
.ald-badge[b-4v2j46rgpb] {
    flex-shrink: 0; font-size: 0.68rem; font-weight: 700; letter-spacing: 0.03em;
    color: #475569; background: #e2e8f0; padding: 0.14rem 0.5rem; border-radius: 99px;
}

.ald-res[b-4v2j46rgpb] { display: flex; align-items: stretch; gap: 0.4rem; margin-top: 0.4rem; }
.ald-res-head[b-4v2j46rgpb] {
    display: flex; align-items: center; gap: 0.55rem; flex: 1 1 auto; text-align: left;
    padding: 0.7rem 0.9rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff;
    cursor: pointer; transition: all 0.12s ease;
}
.ald-res-head:hover[b-4v2j46rgpb] { border-color: #cbd5e1; background: #f8fafc; }
.ald-res-chev[b-4v2j46rgpb] { flex: none; width: 0.9rem; color: #94a3b8; font-size: 0.8rem; }
.ald-res-name[b-4v2j46rgpb] { flex: 1 1 auto; font-weight: 700; font-size: 0.9rem; color: #0f172a; }
.ald-res-count[b-4v2j46rgpb] {
    flex: none; font-size: 0.72rem; font-weight: 600; color: #64748b;
    background: #f1f5f9; border-radius: 999px; padding: 0.1rem 0.5rem;
}
.ald-res-all[b-4v2j46rgpb] {
    flex: none; padding: 0 0.8rem; border: 1px solid #e2e8f0; border-radius: 10px; background: #fff;
    color: #4f46e5; font-weight: 700; font-size: 0.75rem; cursor: pointer; transition: all 0.12s ease;
}
.ald-res-all:hover[b-4v2j46rgpb] { border-color: #4f46e5; background: #eef2ff; }
.ald-res-body[b-4v2j46rgpb] { margin: 0.4rem 0 0.2rem 0.6rem; }
.ald-noctl[b-4v2j46rgpb] { padding: 0.45rem 0.6rem; font-size: 0.8rem; font-style: italic; }

.ald-muted[b-4v2j46rgpb] { color: #94a3b8; font-size: 0.85rem; padding: 0.6rem 0; }
.ald-note[b-4v2j46rgpb] {
    font-size: 0.84rem; color: #475569; background: #f8fafc; border: 1px solid #f1f5f9;
    border-radius: 10px; padding: 0.8rem 1rem; margin-top: 1rem; line-height: 1.45;
}

.ald-foot[b-4v2j46rgpb] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.9rem 1.2rem; border-top: 1px solid #e2e8f0; background: #fff;
}
.ald-count[b-4v2j46rgpb] { font-size: 0.8rem; font-weight: 600; color: #64748b; }
.ald-btn[b-4v2j46rgpb] {
    display: inline-flex; align-items: center; gap: 0.5rem;
    background: #0f172a; color: #fff; border: none; padding: 0.6rem 1.4rem;
    border-radius: 10px; font-size: 0.9rem; font-weight: 600; cursor: pointer;
}
.ald-btn:hover[b-4v2j46rgpb] { background: #1e293b; }
/* /Components/Shared/ApprovalDocument.razor.rz.scp.css */
/* [Form=Role 2026-06-27] A4 결재 문서 — ApprovalForms a4-page 추출(.ad-page 루트). */

/* A4 paper @96dpi ≈ 794 × 1123 */
.ad-page[b-vd29vlhd49] {
    position: relative; box-sizing: border-box;
    width: 794px; max-width: 100%; min-height: 1123px;
    background: #fff; box-shadow: 0 8px 30px rgba(0,0,0,0.18);
    padding: 64px 72px; margin: 0 auto;
    font-size: 14px; color: #111827; line-height: 1.7;
}

/* [멀티페이지] 페이지 간 간격 + 페이지 번호 + 페이지 도구 + 추가 버튼 */
.ad-page + .ad-page[b-vd29vlhd49] { margin-top: 24px; }
.doc-pageno[b-vd29vlhd49] { position: absolute; top: 64px; right: 72px; font-size: 11px; color: #9ca3af; font-weight: 600; }
.a4-page-tools[b-vd29vlhd49] { display: flex; justify-content: flex-end; margin: -6px 0 6px; }
.a4-page-x[b-vd29vlhd49] { background: none; border: none; color: #dc2626; font-size: 12px; cursor: pointer; padding: 2px 6px; }
.a4-page-x:hover[b-vd29vlhd49] { text-decoration: underline; }
.ad-addpage[b-vd29vlhd49] { width: 794px; max-width: 100%; margin: 16px auto 0; text-align: center; }
.a4-addpage-btn[b-vd29vlhd49] { background: #fff; border: 1px dashed #cbd5e1; color: #475569; border-radius: 9px; padding: 0.6rem 1.4rem; font-size: 0.85rem; font-weight: 600; cursor: pointer; }
.a4-addpage-btn:hover[b-vd29vlhd49] { border-color: #0f172a; background: #f8fafc; }

.doc-letterhead[b-vd29vlhd49] { display: flex; align-items: center; justify-content: center; gap: 12px; }
.doc-logo[b-vd29vlhd49] { width: 34px; height: 34px; border-radius: 7px; background: #111827; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 16px; }
.doc-logo-img[b-vd29vlhd49] { height: 34px; max-width: 160px; object-fit: contain; }
.doc-company[b-vd29vlhd49] { font-size: 20px; font-weight: 800; letter-spacing: 1.5px; color: #111827; }
.doc-rule[b-vd29vlhd49] { border-bottom: 2px solid #111827; margin: 12px 0 22px; }

.doc-ph[b-vd29vlhd49] { color: #9ca3af; font-style: italic; }

.kr-head[b-vd29vlhd49] { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 22px; }
.kr-meta-list[b-vd29vlhd49] { display: flex; flex-direction: column; gap: 5px; }
.kr-meta[b-vd29vlhd49] { font-size: 12.5px; color: #1f2937; }
.kr-meta .lbl[b-vd29vlhd49] { display: inline-block; width: 66px; color: #6b7280; font-weight: 600; }

.en-head[b-vd29vlhd49] { display: flex; flex-direction: column; gap: 5px; margin-bottom: 22px; font-size: 12.5px; color: #1f2937; }
.en-meta .lbl[b-vd29vlhd49] { display: inline-block; width: 118px; color: #6b7280; font-weight: 600; }

/* 결재란(도장 그리드) */
.seal-block[b-vd29vlhd49] { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.seal-grid[b-vd29vlhd49] { border-collapse: collapse; flex-shrink: 0; }
.seal-grid td[b-vd29vlhd49] { border: 1px solid #111827; text-align: center; }
.seal-label[b-vd29vlhd49] { width: 24px; font-size: 12px; font-weight: 700; letter-spacing: 2px; writing-mode: vertical-rl; padding: 6px 2px; background: #f3f4f6; }
.seal-role[b-vd29vlhd49] { min-width: 62px; height: 22px; font-size: 11px; font-weight: 600; background: #f3f4f6; padding: 2px 6px; }
/* 도장칸 — 안쪽에 gap(padding)을 둬서 도장이 칸 테두리에 딱 붙지 않게(Sonny). box-sizing 으로 전체 크기 유지. */
.seal-box[b-vd29vlhd49] { width: 62px; height: 58px; vertical-align: middle; padding: 5px; box-sizing: border-box; }
/* 도장(SVG/서명 span/이미지) 무엇이든 칸 중앙 + 칸 안에 맞게 축소. */
.seal-box > svg[b-vd29vlhd49], .seal-box > span[b-vd29vlhd49], .seal-box > img[b-vd29vlhd49] { display: block; margin: 0 auto; max-width: 100%; max-height: 44px; width: auto; height: auto; }
.seal-mark[b-vd29vlhd49] { font-size: 11px; font-weight: 600; color: #9ca3af; }
.kr-stamp[b-vd29vlhd49] { display: block; width: 44px; height: 44px; margin: 0 auto; color: #c0392b; }

.a4-content[b-vd29vlhd49] { margin-top: 6px; }
.a4-title[b-vd29vlhd49] { text-align: center; font-size: 22px; font-weight: 800; letter-spacing: -0.5px; margin: 8px 0 28px; color: #111827; }
.a4-body[b-vd29vlhd49] { white-space: pre-wrap; min-height: 200px; color: #1f2937; }
.a4-title-input[b-vd29vlhd49] { width: 100%; text-align: center; font-size: 22px; font-weight: 800; letter-spacing: -0.5px; border: none; border-bottom: 1px dashed #d1d5db; padding: 4px 0; margin: 8px 0 24px; color: #111827; background: transparent; }
.a4-title-input:focus[b-vd29vlhd49] { outline: none; border-bottom-color: #9ca3af; }
.a4-body-input[b-vd29vlhd49] { width: 100%; min-height: 360px; resize: vertical; border: 1px dashed #e5e7eb; border-radius: 4px; padding: 10px 12px; font-size: 14px; line-height: 1.7; color: #1f2937; background: transparent; font-family: inherit; box-sizing: border-box; }
.a4-body-input:focus[b-vd29vlhd49] { outline: none; border-color: #9ca3af; }
.a4-paste-hint[b-vd29vlhd49] { margin-top: 4px; font-size: 11px; color: #9ca3af; }
@media print { .a4-paste-hint[b-vd29vlhd49] { display: none; } }

.doc-attach[b-vd29vlhd49] { margin-top: 26px; font-size: 13px; color: #1f2937; display: flex; align-items: flex-start; gap: 12px; }
.doc-attach .lbl[b-vd29vlhd49] { font-weight: 700; flex-shrink: 0; line-height: 2.1; }

/* 문서번호(발번) */
.doc-num[b-vd29vlhd49] { font-variant-numeric: tabular-nums; letter-spacing: 0.3px; color: #1f2937; font-weight: 400; }

/* 붙임(첨부) — 알림 첨부 칩 디자인 미러(파편화 방지). 색은 A4 white-paper 고정(인쇄 안전). */
.att-body[b-vd29vlhd49] { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.att-add[b-vd29vlhd49] {
    display: inline-flex; align-items: center; gap: 6px; width: fit-content;
    font-size: 12.5px; font-weight: 600; color: #374151;
    background: #fff; border: 1px dashed #cbd5e1; border-radius: 8px;
    padding: 7px 13px; cursor: pointer; transition: all 0.15s;
}
.att-add:hover[b-vd29vlhd49] { background: #f8fafc; border-color: #94a3b8; }
.att-add.disabled[b-vd29vlhd49] { opacity: 0.6; cursor: default; }
.att-list[b-vd29vlhd49] { display: flex; flex-wrap: wrap; gap: 6px; }
.att-chip[b-vd29vlhd49] {
    display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
    font-size: 12px; color: #1f2937; text-decoration: none;
    background: #f8fafc; border: 1px solid #e5e7eb; border-radius: 6px; padding: 5px 9px;
}
.att-chip-link:hover[b-vd29vlhd49] { background: #eef3f8; border-color: #cbd5e1; }
.att-name[b-vd29vlhd49] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }
.att-size[b-vd29vlhd49] { color: #9ca3af; font-size: 11px; flex-shrink: 0; }
.att-x[b-vd29vlhd49] {
    border: none; background: none; color: #9ca3af; font-size: 15px; line-height: 1;
    cursor: pointer; padding: 0 0 0 2px;
}
.att-x:hover[b-vd29vlhd49] { color: #b91c1c; }

.signoff[b-vd29vlhd49] { position: relative; margin-top: 48px; border-top: 1px solid #d1d5db; padding-top: 22px; }
.signoff-title[b-vd29vlhd49] { font-size: 12px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; color: #374151; margin-bottom: 20px; }
.signoff-row[b-vd29vlhd49] { display: flex; align-items: flex-end; gap: 28px; margin-bottom: 30px; }
.signoff-role[b-vd29vlhd49] { width: 92px; font-size: 12px; font-weight: 600; color: #6b7280; padding-bottom: 4px; }
.signoff-line[b-vd29vlhd49] { flex: 1; border-bottom: 1px solid #111827; height: 30px; position: relative; }
.signoff-line.date[b-vd29vlhd49] { max-width: 150px; }
.signoff-line .lbl[b-vd29vlhd49] { position: absolute; bottom: -15px; left: 0; font-size: 10px; color: #9ca3af; }
.signoff-name[b-vd29vlhd49] { position: absolute; bottom: 4px; left: 6px; font-size: 14px; font-weight: 700; color: #c0392b; }

.doc-sender[b-vd29vlhd49] { display: flex; align-items: center; justify-content: center; gap: 0; font-size: 16px; font-weight: 800; letter-spacing: 1.5px; color: #111827; margin-top: 48px; }
.doc-sender-name[b-vd29vlhd49] { position: relative; z-index: 0; }
/* 직인 = 회사명 오른쪽에 살짝 겹쳐 찍힘. 기울기 제거(Sonny: 왜 기울어져 있냐) → 똑바로. */
.doc-seal-stamp[b-vd29vlhd49] { display: inline-flex; line-height: 0; margin-left: -10px; position: relative; z-index: 1; opacity: 0.92; }
.doc-seal-img[b-vd29vlhd49] { height: 60px; width: 60px; object-fit: contain; }
.doc-seal-mark[b-vd29vlhd49] { font-size: 11px; font-weight: 600; color: #9ca3af; }

/* ── 인쇄(실제 A4) ── */
@media print {
    .ad-page[b-vd29vlhd49] { box-shadow: none; margin: 0; width: 100%; min-height: auto; padding: 24mm 18mm; }
    .ad-page + .ad-page[b-vd29vlhd49] { margin-top: 0; page-break-before: always; }   /* 페이지마다 새 인쇄면 */
    .ad-noprint[b-vd29vlhd49] { display: none !important; }      /* 업로드/삭제/다운로드 버튼은 인쇄 제외(파일명 칩은 남음) */
}
/* /Components/Shared/DeviceStepUpModal.razor.rz.scp.css */
/* [2026-08-08 · device-enrollment step-up · P3] 두 경로(기기승인/본인인증)를 카드형 옵션으로. */

.stepup-opt[b-udwipce93s] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    width: 100%;
    text-align: left;
    background: var(--ah-bg, #fff);
    border: 1px solid var(--ah-border, #e2e8f0);
    border-radius: 10px;
    padding: 0.85rem 0.95rem;
    margin-bottom: 0.6rem;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.stepup-opt:hover:not(.disabled):not(.busy)[b-udwipce93s] {
    border-color: var(--ah-text, #0f172a);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.06);
}

.stepup-opt.disabled[b-udwipce93s] {
    opacity: 0.55;
    cursor: not-allowed;
    background: var(--ah-bg-subtle, #f8fafc);
}

.stepup-opt.busy[b-udwipce93s] { cursor: progress; }

.stepup-opt-icon[b-udwipce93s] {
    font-size: 1.35rem;
    line-height: 1.4;
    flex-shrink: 0;
}

.stepup-opt-body[b-udwipce93s] { flex: 1; }

.stepup-opt-title[b-udwipce93s] {
    font-size: 0.86rem;
    font-weight: 700;
    color: var(--ah-text, #0f172a);
    display: flex;
    align-items: center;
}

.stepup-opt-desc[b-udwipce93s] {
    font-size: 0.75rem;
    color: var(--ah-text-muted, #64748b);
    margin-top: 0.2rem;
    line-height: 1.45;
}

.stepup-soon[b-udwipce93s] {
    margin-left: 0.5rem;
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #92400e;
    background: #fef3c7;
    border-radius: 999px;
    padding: 0.1rem 0.45rem;
}

.stepup-error[b-udwipce93s] {
    font-size: 0.78rem;
    color: var(--ah-danger, #dc2626);
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.55rem 0.7rem;
    margin-top: 0.3rem;
}
/* /Components/Shared/EntitledButton.razor.rz.scp.css */
/* [2026-07-10] EntitledButton NO-state = "권한 요청" 잠금 버튼. 주 CTA 스타일과 구분되게 중립 pill. */
.eb-request[b-u7f0j8pcpx] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.5rem 0.9rem;
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748b;
    background: #f1f5f9;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    cursor: pointer;
    white-space: nowrap;
}
.eb-request:hover[b-u7f0j8pcpx] { background: #e2e8f0; color: #475569; }
.eb-request i[b-u7f0j8pcpx] { font-size: 0.78rem; }

/* [2026-07-10] YES-state 버튼은 소비자 페이지의 *스코프드* .invite-btn 을 못 받음(Blazor scoped-css 경계
   — 버튼이 이제 이 컴포넌트 안에서 렌더). 주 CTA(검정 채움) 모양을 여기서 보장.
   값은 WorkList.razor.css/.Members.razor.css 의 .invite-btn 과 동일. Forms & Policies 'Create Form & Policy' 등. */
.invite-btn[b-u7f0j8pcpx] {
    background:    var(--ah-text);
    color:         var(--ah-bg);
    border:        none;
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.6rem 1.5rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    opacity 0.15s;
}
.invite-btn:hover[b-u7f0j8pcpx]    { opacity: 0.85; }
.invite-btn:disabled[b-u7f0j8pcpx] { opacity: 0.5; cursor: not-allowed; }
/* /Features/Applications/AdminApprovalManagement.razor.rz.scp.css */
/* [2026-08-08 Admin Board 승인 라인] 보드 카드 + 인라인 결재선 편집기 */

.aa-board-head[b-zoy7n33ll0] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.aa-board-title-wrap[b-zoy7n33ll0] { min-width: 0; }

.aa-key-chip[b-zoy7n33ll0] {
    font-family: 'JetBrains Mono', monospace;
    font-size: 0.65rem;
    font-weight: 500;
    color: var(--ah-text-muted);
    background: var(--ah-bg-surface);
    border: 1px solid var(--ah-border-soft);
    border-radius: 4px;
    padding: 0.1rem 0.4rem;
}

.aa-status[b-zoy7n33ll0] {
    font-size: 0.75rem;
    color: var(--ah-text-muted);
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-top: 0.25rem;
}

.aa-status-on[b-zoy7n33ll0] { color: var(--ah-success, #16a34a); }

.aa-editor[b-zoy7n33ll0] {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--ah-border-soft);
}

.aa-cols[b-zoy7n33ll0] { display: flex; flex-direction: column; gap: 0.5rem; }

.aa-col[b-zoy7n33ll0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.aa-col-drafter[b-zoy7n33ll0] { opacity: 0.85; }

.aa-col-seq[b-zoy7n33ll0] {
    flex: 0 0 1.4rem;
    height: 1.4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    background: var(--ah-bg-surface);
    border-radius: 50%;
}

.aa-col-label[b-zoy7n33ll0] { flex: 0 0 30%; }
.aa-col-role[b-zoy7n33ll0]  { flex: 1 1 auto; font-size: 0.8rem; color: var(--ah-text-sub); }
.aa-col-del[b-zoy7n33ll0]   { flex-shrink: 0; padding: 0.35rem 0.5rem; }

.aa-editor-actions[b-zoy7n33ll0] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-top: 1rem;
    flex-wrap: wrap;
}

.aa-editor-actions-right[b-zoy7n33ll0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.aa-save-error[b-zoy7n33ll0] { font-size: 0.75rem; color: var(--ah-danger, #dc2626); }

.aa-hint[b-zoy7n33ll0] {
    font-size: 0.72rem;
    color: var(--ah-text-muted);
    margin: 0.75rem 0 0;
    line-height: 1.5;
}

@media (max-width: 640px) {
    .aa-board-head[b-zoy7n33ll0] { flex-direction: column; }
    .aa-col[b-zoy7n33ll0] { flex-wrap: wrap; }
    .aa-col-label[b-zoy7n33ll0] { flex-basis: calc(100% - 2rem); }
}
/* /Features/Applications/AppGroupAdminConsole.razor.rz.scp.css */
/* AppGroupAdminConsole.razor.css — 작업실 셸.
   대시보드의 나머지는 조회·설정이라 밝은 편이 읽기 좋지만, 여기는 오래 붙어 앉아 만드는
   자리다. 셸을 어둡게 해서 "다른 방"이라는 걸 눈으로 구분한다. 그래서 이 화면만 자체
   팔레트를 쓰고 --ah-* 변수를 타지 않는다. */

.ac-shell[b-qw6eogkvfd] {
    --c-bg:      #191817;
    --c-panel:   #1f1e1d;
    --c-raised:  #262524;
    --c-line:    #333130;
    --c-text:    #ededec;
    --c-sub:     #b4b2af;
    --c-muted:   #82807d;
    --c-accent:  #c96442;
    --c-ok:      #4d9d74;
    --c-bad:     #c3574f;

    /* 대화·입력창이 공유하는 읽기 기둥 폭. 한 곳에서 바꾸면 둘이 같이 움직인다. */
    --ac-column: 48rem;

    display: grid; grid-template-columns: 264px 1fr;
    height: calc(100vh - 150px); min-height: 34rem;
    background: var(--c-bg); color: var(--c-text);
    border: 1px solid var(--c-line); border-radius: 10px; overflow: hidden;
    font-size: 0.82rem;
}

/* ══ 왼쪽 레일 ══ */
.ac-rail[b-qw6eogkvfd] {
    display: flex; flex-direction: column; min-height: 0;
    background: var(--c-panel); border-right: 1px solid var(--c-line);
}

.ac-modes[b-qw6eogkvfd] { display: flex; gap: 0.15rem; padding: 0.7rem 0.6rem 0.5rem; }
.ac-mode[b-qw6eogkvfd] {
    flex: 1; font-family: inherit; font-size: 0.7rem; font-weight: 600;
    color: var(--c-muted); background: none; border: none; cursor: pointer;
    padding: 0.35rem 0.3rem; border-radius: 5px; transition: color .15s, background .15s;
    white-space: nowrap;
}
.ac-mode:hover[b-qw6eogkvfd] { color: var(--c-text); }
.ac-mode.on[b-qw6eogkvfd] { color: var(--c-text); background: var(--c-raised); }

.ac-rail-body[b-qw6eogkvfd] { flex: 1; overflow-y: auto; padding: 0.4rem 0.5rem 0.8rem; min-height: 0; }

.ac-rail-label[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.35rem;
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    color: var(--c-muted); padding: 0.5rem 0.35rem 0.4rem;
}
.ac-rail-count[b-qw6eogkvfd] {
    font-size: 0.58rem; color: var(--c-muted); border: 1px solid var(--c-line);
    border-radius: 999px; padding: 0 0.3rem;
}
.ac-rail-empty[b-qw6eogkvfd] { font-size: 0.72rem; color: var(--c-muted); padding: 0.1rem 0.35rem 0.5rem; }
.ac-rail-sep[b-qw6eogkvfd] { height: 1px; background: var(--c-line); margin: 0.7rem 0.35rem 0.2rem; }
.ac-rail-built[b-qw6eogkvfd] {
    font-size: 0.74rem; color: var(--c-ok); padding: 0.3rem 0.35rem;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

.ac-thread[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.45rem; width: 100%; text-align: left;
    background: none; border: none; cursor: pointer; font-family: inherit;
    font-size: 0.76rem; color: var(--c-sub);
    padding: 0.38rem 0.35rem; border-radius: 5px; transition: background .15s, color .15s;
}
.ac-thread:hover[b-qw6eogkvfd] { background: var(--c-raised); color: var(--c-text); }
.ac-thread.on[b-qw6eogkvfd] { background: var(--c-raised); color: var(--c-text); }
.ac-thread-dot[b-qw6eogkvfd] {
    width: 5px; height: 5px; border-radius: 50%; background: var(--c-muted); flex: 0 0 auto;
}
.ac-thread-dot.done[b-qw6eogkvfd] { background: var(--c-ok); }
.ac-thread-text[b-qw6eogkvfd] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* [2026-07-31] Memory — AI 가 적어둔 메모를 사람이 읽는 자리. Recent 항목과 같은 무게로
   보이되, 펼친 본문은 코드처럼 줄바꿈을 살려 보여준다(메모는 대개 여러 줄이다). */
.ac-mem[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.45rem; width: 100%; text-align: left;
    background: none; border: none; cursor: pointer; font-family: inherit;
    font-size: 0.74rem; color: var(--c-sub);
    padding: 0.34rem 0.35rem; border-radius: 5px; transition: background .15s, color .15s;
}
.ac-mem:hover[b-qw6eogkvfd] { background: var(--c-raised); color: var(--c-text); }
.ac-mem.on[b-qw6eogkvfd] { background: var(--c-raised); color: var(--c-text); }
.ac-mem-key[b-qw6eogkvfd] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ac-mem-body[b-qw6eogkvfd] {
    margin: 0.15rem 0.35rem 0.5rem;
    border-left: 2px solid var(--c-line); padding-left: 0.5rem;
}
.ac-mem-text[b-qw6eogkvfd] {
    margin: 0 0 0.35rem; font-size: 0.68rem; line-height: 1.6;
    color: var(--c-muted); white-space: pre-wrap; word-break: break-word;
    max-height: 14rem; overflow-y: auto;
}
.ac-mem-dl[b-qw6eogkvfd] {
    display: inline-flex; align-items: center;
    font-size: 0.66rem; color: var(--c-muted); text-decoration: none;
}
.ac-mem-dl:hover[b-qw6eogkvfd] { color: var(--c-text); text-decoration: underline; }

.ac-new[b-qw6eogkvfd] {
    margin: 0 0.6rem 0.7rem; font-family: inherit; font-size: 0.74rem; font-weight: 600;
    color: var(--c-sub); background: var(--c-raised); border: 1px solid var(--c-line);
    border-radius: 6px; padding: 0.4rem; cursor: pointer; transition: color .15s, border-color .15s;
}
.ac-new:hover[b-qw6eogkvfd] { color: var(--c-text); border-color: var(--c-muted); }

/* ══ 오른쪽 ══ */
.ac-main[b-qw6eogkvfd] { display: flex; flex-direction: column; min-width: 0; min-height: 0; }

.ac-ctxbar[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap;
    padding: 0.55rem 0.9rem; border-bottom: 1px solid var(--c-line);
    background: var(--c-panel); flex-shrink: 0;
}
.ac-ctx-key[b-qw6eogkvfd] {
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    color: var(--c-muted);
}
.ac-ctx-val[b-qw6eogkvfd] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-size: 0.73rem; font-weight: 500; color: var(--c-sub);
    max-width: 24rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ac-ctx-val.ok .ac-ctx-dot[b-qw6eogkvfd] { background: var(--c-ok); }
.ac-ctx-val.bad[b-qw6eogkvfd] { color: var(--c-bad); }
.ac-ctx-val.bad .ac-ctx-dot[b-qw6eogkvfd] { background: var(--c-bad); }
.ac-ctx-val.none[b-qw6eogkvfd] { color: var(--c-muted); font-style: italic; }
.ac-ctx-dot[b-qw6eogkvfd] { width: 5px; height: 5px; border-radius: 50%; background: var(--c-muted); }
.ac-ctx-mono[b-qw6eogkvfd] {
    margin-left: 0.4rem; font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.68rem; color: var(--c-muted);
}
.ac-ctx-div[b-qw6eogkvfd] { width: 1px; height: 12px; background: var(--c-line); margin: 0 0.5rem; }

/* ── 대화 ── */
.ac-log[b-qw6eogkvfd] {
    flex: 1; overflow-y: auto; min-height: 0;
    display: flex; flex-direction: column; gap: 1rem;
    /* [2026-07-31] 아래 버퍼가 이 화면의 체감을 좌우한다.
       고정 몇 rem 으로는 마지막 줄이 늘 입력창에 붙어 있고, 새 줄은 바닥에서 솟아오른다.
       화면 높이에 비례한 여백을 미리 깔아두면 방금 보낸 말이 읽기 좋은 높이에 서고,
       답은 이미 비어 있는 자리에 얹힌다 — 튀어 오르는 느낌이 사라진다.
       위: 첫 줄이 헤더에 딱 붙어 시작하면 대화가 잘려 들어온 것처럼 보였다. */
    padding: 2.2rem 1.4rem 12vh;   /* 28vh 는 과했다(Sonny) — 빈 화면처럼 보인다 */
}

.ac-intro[b-qw6eogkvfd] { text-align: center; padding: 3rem 1rem 1rem; max-width: 32rem; margin: 0 auto; }
.ac-intro-title[b-qw6eogkvfd] { font-size: 1rem; font-weight: 700; color: var(--c-text); margin-bottom: 0.55rem; }
.ac-intro-body[b-qw6eogkvfd] { font-size: 0.78rem; color: var(--c-muted); line-height: 1.75; margin: 0 0 1.3rem; }
.ac-suggest[b-qw6eogkvfd] { display: flex; flex-wrap: wrap; gap: 0.4rem; justify-content: center; }
.ac-chip[b-qw6eogkvfd] {
    font-size: 0.74rem; font-family: inherit; color: var(--c-sub);
    background: var(--c-raised); border: 1px solid var(--c-line);
    border-radius: 999px; padding: 0.32rem 0.8rem; cursor: pointer; transition: all .15s;
}
.ac-chip:hover[b-qw6eogkvfd] { border-color: var(--c-accent); color: var(--c-text); }

/* [2026-07-31] 대화를 가운데 기둥으로 묶는다 — 창을 넓히면 한 줄이 화면 끝까지 뻗어서
   다음 줄 첫 글자를 눈이 되찾기 힘들다. 읽기 폭을 고정하고 남는 공간은 좌우 여백으로 둔다.
   대화와 입력창이 **같은 폭**이라야 기둥이 하나로 읽힌다(아래 composer 규칙과 짝). */
.ac-turn[b-qw6eogkvfd] {
    display: flex;
    width: 100%; max-width: var(--ac-column); margin-inline: auto;
}
.ac-turn.user[b-qw6eogkvfd] { justify-content: flex-end; }
.ac-turn.bot[b-qw6eogkvfd] { justify-content: flex-start; }
.ac-bubble[b-qw6eogkvfd] {
    max-width: 40rem; font-size: 0.8rem; line-height: 1.7;
    padding: 0.55rem 0.85rem; border-radius: 10px;
    background: var(--c-accent); color: #fff;
}
/* [2026-07-31] AI 답변에서 박스를 걷어낸다 — 박스는 사용자 발화에만 남긴다.
   답변은 대개 길어서 말풍선에 가두면 읽는 폭이 좁아지고, 화면이 박스 안의 박스로 겹친다.
   누가 말했는지는 "오른쪽 주황 박스 = 나"만으로 충분히 갈린다. */
.ac-bubble.bot[b-qw6eogkvfd] {
    background: none; color: var(--c-text);
    padding-left: 0; padding-right: 0;
    max-width: 100%;   /* 기둥(.ac-turn)이 이미 폭을 잡는다 */
}

/* ── 토큰 미터링 [2026-07-31] ──
   답변 아래 작은 회색 한 줄("~1.2k in · 340 out"). 이 숫자가 곧 청구 근거라 숨기지 않되,
   대화를 읽는 데 방해가 안 되게 muted 로 가라앉힌다. */
.ac-bot-stack[b-qw6eogkvfd] { display: flex; flex-direction: column; min-width: 0; max-width: 100%; }
.ac-tokens[b-qw6eogkvfd] { font-size: 0.64rem; color: var(--c-muted); margin-top: 0.3rem; }
.ac-tokens-total[b-qw6eogkvfd] { font-size: 0.66rem; color: var(--c-muted); }

.ac-bubble.thinking[b-qw6eogkvfd] { display: inline-flex; align-items: center; gap: 0.28rem; }
.ac-dot[b-qw6eogkvfd] {
    width: 4px; height: 4px; border-radius: 50%; background: var(--c-muted);
    animation: ac-blink-b-qw6eogkvfd 1.2s infinite ease-in-out;
}
.ac-dot:nth-child(2)[b-qw6eogkvfd] { animation-delay: .15s; }
.ac-dot:nth-child(3)[b-qw6eogkvfd] { animation-delay: .3s; }
.ac-thinking-text[b-qw6eogkvfd] { margin-left: 0.3rem; font-size: 0.74rem; color: var(--c-muted); }

/* [2026-07-31] 📡 실시간으로 자라는 답변 텍스트. 완성본(.ac-bubble.bot)과 같은 자리에서
   같은 톤으로 흐르되, 줄바꿈을 살린다 — 완성되면 폴링이 정본 렌더로 갈아끼운다. */
.ac-stream-text[b-qw6eogkvfd] {
    white-space: pre-wrap; word-break: break-word;
    font-size: 0.8rem; line-height: 1.7; color: var(--c-text);
}
.ac-bubble.thinking:has(.ac-stream-text)[b-qw6eogkvfd] { display: block; }

@keyframes ac-blink-b-qw6eogkvfd {
    0%, 80%, 100% { opacity: 0.25; }
    40% { opacity: 1; }
}

/* ── 초안 카드 ── */
.ac-draft[b-qw6eogkvfd] {
    width: 100%; max-width: 44rem;
    background: var(--c-panel); border: 1px solid var(--c-line);
    border-radius: 10px; padding: 0.95rem 1.05rem;
}
.ac-draft-head[b-qw6eogkvfd] { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.ac-draft-title[b-qw6eogkvfd] { font-size: 0.9rem; font-weight: 700; color: var(--c-text); }
.ac-draft-key[b-qw6eogkvfd] {
    font-size: 0.66rem; color: var(--c-muted);
    font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace; margin-top: 0.15rem;
}
.ac-draft-done[b-qw6eogkvfd] { font-size: 0.7rem; font-weight: 700; color: var(--c-ok); flex-shrink: 0; }
.ac-draft-why[b-qw6eogkvfd] { font-size: 0.75rem; color: var(--c-muted); line-height: 1.65; margin: 0.55rem 0 0; }

.ac-read[b-qw6eogkvfd] {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.28rem;
    margin-top: 0.7rem; padding-top: 0.7rem; border-top: 1px solid var(--c-line);
}
.ac-read-label[b-qw6eogkvfd] {
    font-size: 0.58rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase;
    color: var(--c-muted); margin-right: 0.15rem;
}
.ac-read-file[b-qw6eogkvfd] {
    font-size: 0.65rem; font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace; color: var(--c-sub);
    background: var(--c-raised); border: 1px solid var(--c-line);
    border-radius: 4px; padding: 0.08rem 0.35rem;
}
.ac-read-more[b-qw6eogkvfd] { font-size: 0.65rem; color: var(--c-muted); }
.ac-read-none[b-qw6eogkvfd] {
    margin-top: 0.7rem; padding: 0.5rem 0.7rem; font-size: 0.72rem; line-height: 1.6;
    color: #d9a441; background: rgba(217,164,65,0.08);
    border: 1px solid rgba(217,164,65,0.28); border-radius: 6px;
}

.ac-cols[b-qw6eogkvfd] { display: grid; grid-template-columns: 1.6fr 1fr; gap: 1.1rem; margin-top: 0.9rem; }
.ac-col-label[b-qw6eogkvfd] {
    font-size: 0.58rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    color: var(--c-muted); margin-bottom: 0.4rem;
}
.ac-fields[b-qw6eogkvfd] { display: flex; flex-direction: column; gap: 0.22rem; }
.ac-field[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.45rem;
    font-size: 0.75rem; color: var(--c-sub);
    padding: 0.26rem 0.45rem; border-radius: 4px; background: var(--c-bg);
}
.ac-field.listed[b-qw6eogkvfd] { background: var(--c-raised); }
.ac-field-label[b-qw6eogkvfd] { color: var(--c-text); }
.ac-field-type[b-qw6eogkvfd] {
    font-size: 0.64rem; color: var(--c-muted); font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace;
}
.ac-field-badge[b-qw6eogkvfd] {
    margin-left: auto; font-size: 0.56rem; font-weight: 700; letter-spacing: 0.06em;
    color: var(--c-accent); text-transform: uppercase;
}

.ac-actions[b-qw6eogkvfd] { display: flex; flex-direction: column; gap: 0.28rem; }
.ac-action[b-qw6eogkvfd] {
    display: flex; align-items: center; justify-content: space-between; gap: 0.4rem;
    font-size: 0.75rem; font-weight: 600; padding: 0.3rem 0.55rem;
    border-radius: 5px; border: 1px solid var(--c-line); color: var(--c-sub);
}
.ac-action.approve[b-qw6eogkvfd] { color: var(--c-ok); border-color: rgba(77,157,116,0.4); }
.ac-action.reject[b-qw6eogkvfd]  { color: var(--c-bad); border-color: rgba(195,87,79,0.4); }
.ac-action.flag[b-qw6eogkvfd]    { color: #d9a441; border-color: rgba(217,164,65,0.4); }
.ac-seal[b-qw6eogkvfd] { font-size: 0.7rem; }

/* ── composer ── */
.ac-composer[b-qw6eogkvfd] {
    flex-shrink: 0; border-top: 1px solid var(--c-line);
    background: var(--c-panel); padding: 0.6rem 0.9rem 0.7rem;
}
/* 배경과 윗선은 화면 끝까지 가되, 내용은 대화와 같은 기둥에 선다.
   이게 없으면 대화만 가운데고 입력창은 끝까지 뻗어 두 폭이 어긋나 보인다. */
.ac-composer > .ac-composer-top[b-qw6eogkvfd],
.ac-composer > .ac-input-row[b-qw6eogkvfd],
.ac-composer > .ac-composer-foot[b-qw6eogkvfd] {
    max-width: var(--ac-column); margin-inline: auto;
}
/* 첨부 칩은 inline-flex 라 auto 여백이 안 먹는다 — 블록으로 바꿔야 기둥에 선다. */
.ac-composer > .ac-attach-chip[b-qw6eogkvfd] {
    display: flex; width: fit-content;
    max-width: var(--ac-column); margin-inline: auto;
}

.ac-composer-top[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.6rem;
    font-size: 0.7rem; color: var(--c-muted); margin-bottom: 0.5rem;
}
.ac-branch[b-qw6eogkvfd] {
    display: inline-flex; align-items: center; font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.68rem; color: var(--c-sub);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 22rem;
}
.ac-delta[b-qw6eogkvfd] { margin-left: auto; font-size: 0.68rem; color: var(--c-ok); }
.ac-delta.muted[b-qw6eogkvfd] { color: var(--c-muted); }
.ac-create[b-qw6eogkvfd] {
    font-family: inherit; font-size: 0.7rem; font-weight: 700; color: #fff;
    background: var(--c-accent); border: none; border-radius: 5px;
    padding: 0.28rem 0.7rem; cursor: pointer; transition: filter .15s;
}
.ac-create:hover[b-qw6eogkvfd] { filter: brightness(1.1); }
.ac-create:disabled[b-qw6eogkvfd] { opacity: .5; cursor: default; }

.ac-input-row[b-qw6eogkvfd] {
    display: flex; align-items: flex-end; gap: 0.5rem;
    background: var(--c-raised); border: 1px solid var(--c-line);
    border-radius: 8px; padding: 0.45rem 0.55rem;
}
.ac-input[b-qw6eogkvfd] {
    flex: 1; resize: none; border: none; outline: none; background: transparent;
    font-family: inherit; font-size: 0.8rem; line-height: 1.6; color: var(--c-text);
    /* [2026-07-31] 한 줄 높이(1.9rem)는 너무 낮았다 — 몇 문장짜리 요청이 기본형이라
       처음부터 서너 줄 자리를 준다(Sonny). */
    padding: 0.2rem 0.15rem; min-height: 4.6rem; max-height: 14rem;
}
.ac-input[b-qw6eogkvfd]::placeholder { color: var(--c-muted); }
.ac-send[b-qw6eogkvfd] {
    flex-shrink: 0; font-family: inherit; font-size: 0.85rem; color: var(--c-sub);
    background: none; border: 1px solid var(--c-line); border-radius: 5px;
    width: 1.9rem; height: 1.9rem; cursor: pointer; transition: all .15s;
}
.ac-send:hover[b-qw6eogkvfd] { color: var(--c-text); border-color: var(--c-muted); }
.ac-send:disabled[b-qw6eogkvfd] { opacity: .35; cursor: default; }
/* ⏹ 작업 중엔 보내기 자리가 멈추기가 된다 — 위치가 같아야 손이 헤매지 않는다. */
.ac-stop[b-qw6eogkvfd] { color: #e05d5d; border-color: #e05d5d55; font-size: 0.7rem; }
.ac-stop:hover[b-qw6eogkvfd] { color: #ff7b7b; border-color: #e05d5d; }

.ac-composer-foot[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.5rem; margin-top: 0.45rem;
    font-size: 0.66rem; color: var(--c-muted);
}
.ac-mode-chip[b-qw6eogkvfd] {
    background: var(--c-raised); border: 1px solid var(--c-line);
    border-radius: 4px; padding: 0.08rem 0.4rem; color: var(--c-sub);
}
.ac-foot-spacer[b-qw6eogkvfd] { flex: 1; }
.ac-model[b-qw6eogkvfd] { font-size: 0.66rem; }
.ac-spin[b-qw6eogkvfd] {
    width: 9px; height: 9px; border-radius: 50%;
    border: 1.5px solid var(--c-line); border-top-color: var(--c-accent);
    animation: ac-spin-b-qw6eogkvfd 0.7s linear infinite;
}

@keyframes ac-spin-b-qw6eogkvfd { to { transform: rotate(360deg); } }

.ac-soon[b-qw6eogkvfd] { text-align: center; padding: 4rem 1.5rem; max-width: 30rem; margin: 0 auto; }
.ac-soon-title[b-qw6eogkvfd] { font-size: 0.95rem; font-weight: 700; color: var(--c-text); margin-bottom: 0.5rem; }
.ac-soon-body[b-qw6eogkvfd] { font-size: 0.78rem; color: var(--c-muted); line-height: 1.75; margin: 0; }

.ac-error[b-qw6eogkvfd] {
    padding: 0.5rem 0.9rem; font-size: 0.74rem; color: var(--c-bad);
    border-top: 1px solid var(--c-line); background: var(--c-panel); word-break: break-word;
}

/* ── 404 (허용 org 밖) ── */
.ac-notfound[b-qw6eogkvfd] { text-align: center; padding: 5rem 2rem; }
.ac-notfound-code[b-qw6eogkvfd] {
    font-size: 2.4rem; font-weight: 800; color: var(--ah-text-muted);
    font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace; margin-bottom: 0.4rem;
}
.ac-notfound-text[b-qw6eogkvfd] { font-size: 0.85rem; color: var(--ah-text-muted); margin-bottom: 1.4rem; }

@media (max-width: 900px) {
    .ac-shell[b-qw6eogkvfd] { grid-template-columns: 1fr; height: auto; }
    .ac-rail[b-qw6eogkvfd] { border-right: none; border-bottom: 1px solid var(--c-line); }
    .ac-cols[b-qw6eogkvfd] { grid-template-columns: 1fr; }
}

/* ══ 크게 보기: 오른쪽 결과 화면 ══ */
.ac-shell.with-preview[b-qw6eogkvfd] { grid-template-columns: 264px minmax(0, 1fr) minmax(0, 1fr); }

.ac-expand[b-qw6eogkvfd] {
    display: inline-flex; align-items: center; gap: 0.3rem;
    font-family: inherit; font-size: 0.7rem; font-weight: 600; color: var(--c-sub);
    background: var(--c-raised); border: 1px solid var(--c-line); border-radius: 5px;
    padding: 0.22rem 0.55rem; cursor: pointer; transition: all .15s; flex-shrink: 0;
    text-decoration: none;
}
/* 첫 번째만 오른쪽으로 민다 — 둘 다 auto 면 사이가 벌어진다 */
.ac-ctxbar > .ac-expand:first-of-type[b-qw6eogkvfd] { margin-left: auto; }
.ac-expand:hover[b-qw6eogkvfd] { color: var(--c-text); border-color: var(--c-muted); }

.ac-preview[b-qw6eogkvfd] {
    display: flex; flex-direction: column; min-width: 0; min-height: 0;
    border-left: 1px solid var(--c-line); background: var(--c-panel);
}

.ac-pv-bar[b-qw6eogkvfd] {
    display: flex; align-items: center; gap: 0.35rem; flex-shrink: 0;
    padding: 0.5rem 0.8rem; border-bottom: 1px solid var(--c-line); background: var(--c-bg);
}
.ac-pv-chrome[b-qw6eogkvfd] { width: 8px; height: 8px; border-radius: 50%; background: var(--c-line); }
.ac-pv-url[b-qw6eogkvfd] {
    margin-left: 0.6rem; font-size: 0.66rem; color: var(--c-muted);
    font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace;
}

.ac-pv-empty[b-qw6eogkvfd] {
    flex: 1; display: flex; align-items: center; justify-content: center;
    text-align: center; padding: 3rem 2rem; font-size: 0.76rem;
    color: var(--c-muted); line-height: 1.7;
}

/* 프리뷰 안쪽은 Admin Management(라이트)를 흉내 낸다 — 결과가 어떻게 보일지가 요점이라
   작업실 색이 아니라 실제 화면 색이어야 한다. */
.ac-pv-body[b-qw6eogkvfd] {
    flex: 1; overflow-y: auto; min-height: 0; display: grid;
    grid-template-columns: 130px 1fr; background: #f8fafc; color: #0f172a;
}
.ac-pv-side[b-qw6eogkvfd] { border-right: 1px solid #e2e8f0; padding: 0.7rem 0.5rem; background: #fff; }
.ac-pv-side-label[b-qw6eogkvfd] {
    font-size: 0.55rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    color: #94a3b8; padding: 0 0.35rem 0.4rem;
}
.ac-pv-menu[b-qw6eogkvfd] {
    font-size: 0.7rem; color: #475569; padding: 0.3rem 0.35rem; border-radius: 4px;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ac-pv-menu.on[b-qw6eogkvfd] { background: #eef2ff; color: #4338ca; font-weight: 700; }

.ac-pv-content[b-qw6eogkvfd] { padding: 0.9rem 1rem 1.4rem; min-width: 0; }
.ac-pv-title[b-qw6eogkvfd] { font-size: 0.85rem; font-weight: 700; margin-bottom: 0.7rem; }

.ac-pv-table[b-qw6eogkvfd] { border: 1px solid #e2e8f0; border-radius: 6px; background: #fff; overflow: hidden; }
.ac-pv-thead[b-qw6eogkvfd] {
    display: flex; gap: 0.7rem; padding: 0.45rem 0.7rem;
    background: #f1f5f9; border-bottom: 1px solid #e2e8f0;
}
.ac-pv-th[b-qw6eogkvfd] {
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase;
    color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1;
}
.ac-pv-th.right[b-qw6eogkvfd] { text-align: right; flex: 0 0 auto; }
.ac-pv-rows[b-qw6eogkvfd] { min-height: 4.5rem; display: flex; align-items: center; justify-content: center; }
.ac-pv-norows[b-qw6eogkvfd] { font-size: 0.7rem; color: #94a3b8; }

.ac-pv-actions[b-qw6eogkvfd] { display: flex; gap: 0.35rem; margin-top: 0.7rem; flex-wrap: wrap; }
.ac-pv-btn[b-qw6eogkvfd] {
    font-size: 0.68rem; font-weight: 600; padding: 0.25rem 0.6rem;
    border-radius: 5px; border: 1px solid #e2e8f0; color: #475569; background: #fff;
}
.ac-pv-btn.approve[b-qw6eogkvfd] { color: #fff; background: #0f172a; border-color: #0f172a; }
.ac-pv-btn.reject[b-qw6eogkvfd]  { color: #b91c1c; background: #fff; border-color: #e2e8f0; }
.ac-pv-btn.flag[b-qw6eogkvfd]    { color: #92400e; background: #fff; border-color: #e2e8f0; }

.ac-pv-detail[b-qw6eogkvfd] {
    margin-top: 0.9rem; border: 1px solid #e2e8f0; border-radius: 6px;
    background: #fff; padding: 0.6rem 0.75rem;
}
.ac-pv-detail-label[b-qw6eogkvfd] {
    font-size: 0.55rem; font-weight: 700; letter-spacing: 0.09em; text-transform: uppercase;
    color: #94a3b8; margin-bottom: 0.45rem;
}
.ac-pv-pair[b-qw6eogkvfd] {
    display: flex; justify-content: space-between; gap: 0.8rem;
    font-size: 0.7rem; padding: 0.18rem 0;
}
.ac-pv-k[b-qw6eogkvfd] { color: #64748b; }
.ac-pv-v[b-qw6eogkvfd] { color: #94a3b8; font-family: "JetBrains Mono", 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.64rem; }

@media (max-width: 1280px) {
    .ac-shell.with-preview[b-qw6eogkvfd] { grid-template-columns: 264px 1fr; }
    .ac-preview[b-qw6eogkvfd] { display: none; }
}

/* 전체화면(새 탭) — 대시보드 헤더가 없으므로 뷰포트를 통째로 쓴다 */
.ac-shell.full[b-qw6eogkvfd] {
    height: 100vh; border: none; border-radius: 0;
}

.ac-board-list[b-qw6eogkvfd] { display: flex; flex-direction: column; gap: 0.35rem; margin-top: 1rem; align-items: center; }
.ac-board-item[b-qw6eogkvfd] {
    display: inline-block; font-size: 0.78rem; font-weight: 600;
    color: var(--c-ok); background: var(--c-raised); border: 1px solid var(--c-line);
    border-radius: 6px; padding: 0.35rem 0.9rem; text-decoration: none; transition: border-color .15s;
}
.ac-board-item:hover[b-qw6eogkvfd] { border-color: var(--c-ok); color: var(--c-ok); }

/* ── 이미지 첨부 ── */
.ac-attach[b-qw6eogkvfd] {
    flex-shrink: 0; width: 1.9rem; height: 1.9rem; display: inline-flex;
    align-items: center; justify-content: center; cursor: pointer;
    color: var(--c-muted); border: 1px solid var(--c-line); border-radius: 5px;
    transition: all .15s;
}
.ac-attach:hover[b-qw6eogkvfd] { color: var(--c-text); border-color: var(--c-muted); }
.ac-attach[b-qw6eogkvfd]  input[type="file"], .ac-attach input[type="file"][b-qw6eogkvfd] { display: none; }
.ac-attach-chip[b-qw6eogkvfd] {
    display: inline-flex; align-items: center; gap: 0.5rem;
    margin-bottom: 0.45rem; padding: 0.3rem 0.5rem;
    background: var(--c-raised); border: 1px solid var(--c-line); border-radius: 6px;
    max-width: 20rem;
}
.ac-attach-chip img[b-qw6eogkvfd] { width: 34px; height: 34px; object-fit: cover; border-radius: 4px; }
.ac-attach-name[b-qw6eogkvfd] {
    font-size: 0.7rem; color: var(--c-sub);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.ac-attach-x[b-qw6eogkvfd] {
    background: none; border: none; color: var(--c-muted); cursor: pointer;
    font-size: 0.75rem; padding: 0 0.2rem;
}
.ac-attach-x:hover[b-qw6eogkvfd] { color: var(--c-text); }
/* 사진과 말을 세로로 쌓되 오른쪽 끝에 맞춘다 — 사용자 발화는 오른쪽이 기준선이다. */
.ac-user-stack[b-qw6eogkvfd] {
    display: flex; flex-direction: column; align-items: flex-end;
    gap: 0.4rem; min-width: 0; max-width: 40rem;
}
.ac-img[b-qw6eogkvfd] {
    display: block; max-width: 280px; max-height: 220px;
    border-radius: 10px; object-fit: contain;
}
/* /Features/Applications/AppGroupBranding.razor.rz.scp.css */
/* AppGroupBranding.razor.css — CSS variable 기반 */

/* ── Login Mode picker ── */
.login-mode-row[b-d7m4c46404] { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 0.5rem; }
.login-mode-option[b-d7m4c46404] {
    display: flex; align-items: flex-start; gap: 0.75rem;
    padding: 0.85rem 1rem; border: 1px solid var(--ah-border); border-radius: 8px;
    background: var(--ah-bg); cursor: pointer; transition: border-color 0.15s, background 0.15s;
}
.login-mode-option:hover:not(.disabled)[b-d7m4c46404] { border-color: var(--ah-text-muted); }
.login-mode-option.selected[b-d7m4c46404] { border-color: var(--ah-link); background: var(--ah-bg-subtle); }
.login-mode-option.disabled[b-d7m4c46404] { opacity: 0.55; cursor: not-allowed; background: var(--ah-bg-subtle); }
.login-mode-option input[type="radio"][b-d7m4c46404] { margin-top: 0.2rem; flex-shrink: 0; accent-color: var(--ah-link); }
.login-mode-body[b-d7m4c46404] { flex: 1; min-width: 0; }
.login-mode-title[b-d7m4c46404] { font-size: 0.85rem; font-weight: 700; color: var(--ah-text); display: flex; align-items: center; gap: 0.4rem; }
.login-mode-desc[b-d7m4c46404] { font-size: 0.74rem; color: var(--ah-text-muted); margin-top: 0.25rem; line-height: 1.5; }
.login-mode-desc code[b-d7m4c46404] { background: var(--ah-bg-surface); padding: 0.05rem 0.3rem; border-radius: 3px; font-size: 0.72rem; }
.login-mode-default-chip[b-d7m4c46404] {
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.05em; color: #065f46;
    background: #d1fae5; border: 1px solid #6ee7b7; border-radius: 4px; padding: 0.1rem 0.4rem;
}
.login-mode-coming-chip[b-d7m4c46404] {
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.05em; color: #92400e;
    background: #fef3c7; border: 1px solid #fcd34d; border-radius: 4px; padding: 0.1rem 0.4rem;
}


/* ── App Icon preview ── */
.icon-preview[b-d7m4c46404] {
    width:           80px;
    height:          80px;
    border-radius:   18px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
    overflow:        hidden;
    border:          1px solid var(--ah-border);
}

/* ── Upload / Remove buttons ── */
.btn-upload[b-d7m4c46404] {
    display:       inline-flex;
    align-items:   center;
    font-size:     0.78rem;
    font-weight:   600;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    padding:       0.45rem 1rem;
    border-radius: var(--ah-radius);
    cursor:        pointer;
    transition:    all 0.15s;
}
.btn-upload:hover[b-d7m4c46404] { background: var(--ah-bg-subtle); }

.btn-remove-icon[b-d7m4c46404] {
    display:       inline-flex;
    align-items:   center;
    font-size:     0.72rem;
    font-weight:   600;
    color:         var(--ah-danger);
    background:    none;
    border:        1px solid var(--ah-danger-border);
    padding:       0.35rem 0.75rem;
    border-radius: var(--ah-radius);
    cursor:        pointer;
    transition:    all 0.15s;
}
.btn-remove-icon:hover[b-d7m4c46404]    { background: var(--ah-danger-bg); }
.btn-remove-icon:disabled[b-d7m4c46404] { opacity: 0.4; cursor: not-allowed; }

/* ── Color swatches ── */
.color-swatch[b-d7m4c46404] {
    width:         28px;
    height:        28px;
    border-radius: var(--ah-radius);
    cursor:        pointer;
    border:        2px solid transparent;
    transition:    all 0.15s;
    flex-shrink:   0;
    position:      relative;
}
.color-swatch:hover[b-d7m4c46404] { transform: scale(1.12); }
.color-swatch.selected[b-d7m4c46404] {
    border-color:  transparent;
    transform:     scale(1.15);
    box-shadow:    0 4px 12px rgba(0,0,0,0.35), 0 8px 20px rgba(0,0,0,0.15);
    z-index:       1;
}

/* ── Brand Color preview box ── */
.brand-preview-box[b-d7m4c46404] {
    margin-top:    1.25rem;
    padding:       1rem;
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 8px;
}
.brand-preview-label[b-d7m4c46404] {
    font-size:      0.7rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    margin-bottom:  0.75rem;
}
.brand-preview-icon[b-d7m4c46404] {
    width:           40px;
    height:          40px;
    border-radius:   10px;
    border:          1px solid var(--ah-border);
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
    overflow:        hidden;
}

/* ── Login page preview frame ── */
.login-preview-frame[b-d7m4c46404] {
    max-width:     320px;
    margin:        0 auto;
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    overflow:      hidden;
    box-shadow:    var(--ah-shadow-md);
}

/* 로그인 미리보기는 항상 흰 배경 (실제 로그인 페이지 시뮬레이션) */
.login-preview-header[b-d7m4c46404] {
    padding:         1.5rem 1.25rem 0;
    background:      #ffffff;
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    gap:             0.5rem;
}
.login-preview-icon[b-d7m4c46404] {
    width:           36px;
    height:          36px;
    border-radius:   8px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    overflow:        hidden;
}
.login-preview-app-name[b-d7m4c46404] {
    font-size:   0.85rem;
    font-weight: 700;
    color:       #0f172a;
    text-align:  center;
}
.login-preview-powered[b-d7m4c46404] {
    font-size:  0.7rem;
    color:      #64748b;
    text-align: center;
}

.login-preview-body[b-d7m4c46404]    { padding: 1rem 1.25rem 1.25rem; background: #ffffff; }
.login-preview-field[b-d7m4c46404]   { height: 32px; background: #f1f5f9; border-radius: 6px; margin-bottom: 0.5rem; }
.login-preview-cta[b-d7m4c46404]     { height: 34px; border-radius: 6px; margin-bottom: 0.75rem; }
.login-preview-divider[b-d7m4c46404] {
    display:       flex;
    align-items:   center;
    gap:           0.5rem;
    margin-bottom: 0.5rem;
}
.login-preview-line[b-d7m4c46404]   { flex: 1; height: 1px; background: #e2e8f0; }
.login-preview-or[b-d7m4c46404]     { font-size: 0.62rem; color: #94a3b8; }
.login-preview-social[b-d7m4c46404] {
    height:        32px;
    background:    #f8fafc;
    border:        1px solid #e2e8f0;
    border-radius: 6px;
}
/* /Features/Applications/AppGroupData.razor.rz.scp.css */
/* [2026-08-04] Data 탭 — 형제 페이지(AppGroupSettings)와 같은 card-panel 문법 위에 목록만 추가. */
.ds-add-btn[b-6o6q2mmekt] {
    display: inline-flex;
    align-items: center;
    padding: 0.4rem 0.85rem;
    border: 1px solid var(--ah-border, #e2e8f0);
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ah-text-sub, #334155);
    text-decoration: none;
    white-space: nowrap;
}

.ds-add-btn:hover[b-6o6q2mmekt] {
    background: rgba(148, 163, 184, 0.12);
}

.ds-msg[b-6o6q2mmekt] {
    margin-top: 0.9rem;
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    font-size: 0.8rem;
}

.ds-msg.ok[b-6o6q2mmekt] {
    background: rgba(34, 197, 94, 0.1);
    color: #15803d;
    border: 1px solid rgba(34, 197, 94, 0.3);
}

.ds-msg.err[b-6o6q2mmekt] {
    background: rgba(239, 68, 68, 0.08);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

.ds-empty[b-6o6q2mmekt] {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--ah-text-sub, #334155);
    font-size: 0.85rem;
}

.ds-table[b-6o6q2mmekt] {
    width: 100%;
    border-collapse: collapse;
    margin-top: 1rem;
    font-size: 0.83rem;
}

.ds-table th[b-6o6q2mmekt] {
    text-align: left;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ah-text-muted, #94a3b8);
    padding: 0.4rem 0.6rem;
    border-bottom: 1px solid var(--ah-border, #e2e8f0);
}

.ds-table td[b-6o6q2mmekt] {
    padding: 0.65rem 0.6rem;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18);
    vertical-align: top;
}

.ds-table tr.primary-row[b-6o6q2mmekt] {
    background: rgba(99, 102, 241, 0.045);
}

.ds-star[b-6o6q2mmekt] {
    color: #f59e0b;
}

.ds-star-btn[b-6o6q2mmekt] {
    border: none;
    background: transparent;
    color: var(--ah-text-muted, #94a3b8);
    cursor: pointer;
    padding: 0.1rem 0.25rem;
}

.ds-star-btn:hover[b-6o6q2mmekt] {
    color: #f59e0b;
}

.ds-badge[b-6o6q2mmekt] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-size: 0.68rem;
    font-weight: 700;
    border: 1px solid var(--ah-border, #e2e8f0);
    color: var(--ah-text-sub, #334155);
}

.ds-badge--managed[b-6o6q2mmekt] {
    border-color: rgba(99, 102, 241, 0.4);
    color: #4f46e5;
    background: rgba(99, 102, 241, 0.06);
}

.ds-dot[b-6o6q2mmekt] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #cbd5e1;
    margin-right: 2px;
}

.ds-dot.ok[b-6o6q2mmekt] { background: #22c55e; }
.ds-dot.err[b-6o6q2mmekt] { background: #ef4444; }

.ds-action[b-6o6q2mmekt] {
    border: 1px solid var(--ah-border, #e2e8f0);
    background: transparent;
    border-radius: 6px;
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ah-text-sub, #334155);
    cursor: pointer;
    margin-left: 0.35rem;
}

.ds-action:hover[b-6o6q2mmekt] { background: rgba(148, 163, 184, 0.12); }

.ds-action--danger[b-6o6q2mmekt] { color: #b91c1c; border-color: rgba(239, 68, 68, 0.3); }
.ds-action--danger:hover[b-6o6q2mmekt] { background: rgba(239, 68, 68, 0.07); }

.mono[b-6o6q2mmekt] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace; }
/* /Features/Applications/AppGroupDetail.razor.rz.scp.css */
/* AppGroupDetail — page-specific only.
   Common classes are in ah-components.css */

/* [2026-08-05] .page-title/.page-desc 는 세 파일에 똑같이 복붙돼 있던 두 번째 정본.
   <PageHeader> + ah-components.css §27 (.ah-page-*) 로 통합하며 제거. */
.group-level-chip[b-l9pajw8sim] {
    font-size: 0.62rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
    color: var(--ah-text-muted); background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: 4px; padding: 0.18rem 0.5rem; white-space: nowrap;
}

.group-icon[b-l9pajw8sim] {
    width: 52px; height: 52px; border-radius: 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.4rem; font-weight: 800; color: #ffffff; flex-shrink: 0;
}

/* ── Info box ── */
.info-box[b-l9pajw8sim] {
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 1.25rem 1.4rem; margin-bottom: 1.5rem;
}
.info-box-title[b-l9pajw8sim] { font-size: 0.75rem; font-weight: 700; color: var(--ah-text); margin-bottom: 0.5rem; }
.info-box-body[b-l9pajw8sim]  { font-size: 0.78rem; color: var(--ah-text-muted); line-height: 1.65; }

/* ── Stats ── */
.stats-row[b-l9pajw8sim] { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.stat-card[b-l9pajw8sim] {
    flex: 1; background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: 10px; padding: 1.1rem 1.25rem; box-shadow: var(--ah-shadow-sm);
}
.stat-label[b-l9pajw8sim] { font-size: 0.6rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.stat-value[b-l9pajw8sim] { font-size: 1.4rem; font-weight: 800; color: var(--ah-text); letter-spacing: -0.5px; margin-top: 0.15rem; }
.stat-sub[b-l9pajw8sim]   { font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.1rem; }

/* ── Section header ── */
.groups-header[b-l9pajw8sim] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.table-title[b-l9pajw8sim]   { font-size: 0.85rem; font-weight: 700; color: var(--ah-text); }

/* ── App cards ── */
.app-card[b-l9pajw8sim] {
    background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg); padding: 1.5rem;
    box-shadow: var(--ah-shadow-sm); cursor: pointer;
    height: 100%; display: flex; flex-direction: column;
    transition: box-shadow 0.15s, border-color 0.15s, transform 0.12s;
}
.app-card:hover[b-l9pajw8sim] { box-shadow: var(--ah-shadow-md); border-color: var(--ah-border); transform: translateY(-1px); }

.app-name[b-l9pajw8sim]       { font-weight: 700; color: var(--ah-text); font-size: 0.95rem; }
.client-app-key[b-l9pajw8sim] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.15rem; }

.client-footer[b-l9pajw8sim] {
    display: flex; justify-content: space-between; align-items: center;
    font-size: 0.75rem; color: var(--ah-text-muted);
    margin-top: auto; padding-top: 0.85rem; border-top: 1px solid var(--ah-bg-subtle);
}
.client-footer strong[b-l9pajw8sim] { color: var(--ah-text-sub); font-weight: 700; }
.client-arrow[b-l9pajw8sim] { color: var(--ah-text-muted); font-size: 0.75rem; transition: color 0.15s; }
.app-card:hover .client-arrow[b-l9pajw8sim] { color: var(--ah-text-sub); }

/* ── Type icons ── */
.client-type-icon[b-l9pajw8sim] {
    width: 40px; height: 40px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.15rem; flex-shrink: 0;
}
.type-web[b-l9pajw8sim]     { background: #eff6ff; }
.type-android[b-l9pajw8sim] { background: #ecfdf5; }
.type-ios[b-l9pajw8sim]     { background: #f5f3ff; }
.type-desktop[b-l9pajw8sim] { background: #f0f9ff; }
.type-m2m[b-l9pajw8sim]     { background: var(--ah-bg-subtle); border: 1px solid var(--ah-border); }
.type-api[b-l9pajw8sim]     { background: #f5f3ff; }
.type-micro[b-l9pajw8sim]   { background: #fff7ed; }
/* [Custom Admin] 로그인 표면이 아닌 유일한 client type — 다른 배지와 확실히 구별되게 slate. */
.type-admin[b-l9pajw8sim]   { background: #f1f5f9; border: 1px solid #cbd5e1; }

/* ── Environment badges ── */
.env-badge[b-l9pajw8sim]    { font-size: 0.58rem; font-weight: 800; padding: 0.12rem 0.4rem; border-radius: 3px; letter-spacing: 0.03em; }
.env-prod[b-l9pajw8sim]     { background: #f0fdf4; color: #166534; }
.env-staging[b-l9pajw8sim]  { background: #fff7ed; color: #9a3412; }
.env-testing[b-l9pajw8sim]  { background: #f0f9ff; color: #075985; }
.env-dev[b-l9pajw8sim]      { background: #f5f3ff; color: #5b21b6; }

/* ── Status ── */
.status-inline[b-l9pajw8sim]          { font-size: 0.68rem; font-weight: 600; color: var(--ah-text-muted); }
.status-inline.s-active[b-l9pajw8sim] { color: var(--ah-success); }

/* ── Add card ── */
.add-app-card[b-l9pajw8sim] {
    background: var(--ah-bg); border: 2px dashed var(--ah-border);
    border-radius: var(--ah-radius-lg); padding: 1.5rem;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    cursor: pointer; height: 100%; min-height: 170px;
    transition: border-color 0.15s, background-color 0.15s;
}
.add-app-card:hover[b-l9pajw8sim] { border-color: var(--ah-link); background-color: #fafafe; }
.add-app-icon[b-l9pajw8sim] {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--ah-bg-surface); color: var(--ah-text-sub);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem; transition: background-color 0.15s, color 0.15s;
}
.add-app-card:hover .add-app-icon[b-l9pajw8sim] { background-color: #eef2ff; color: var(--ah-link); }

/* ── Buttons ── */
.btn-create[b-l9pajw8sim] {
    font-size: 0.75rem; font-weight: 700; color: var(--ah-accent-text);
    background: var(--ah-accent); border: 1px solid var(--ah-accent);
    padding: 0.4rem 1.1rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: opacity 0.15s;
    display: inline-flex; align-items: center; gap: 0.3rem;
}
.btn-create:hover[b-l9pajw8sim] { opacity: 0.85; }

/* ── Error bar ── */
.error-bar[b-l9pajw8sim] {
    background: var(--ah-danger-bg); border: 1px solid var(--ah-danger-border);
    border-radius: var(--ah-radius-md); padding: 0.6rem 0.9rem;
    font-size: 0.78rem; color: var(--ah-danger); margin-bottom: 1rem;
}

/* ── Section Tabs ── */
.section-tabs[b-l9pajw8sim] {
    display: flex; gap: 0; border-bottom: 1px solid var(--ah-border);
    margin-bottom: 1.5rem;
}
.section-tab[b-l9pajw8sim] {
    background: none; border: none; border-bottom: 2px solid transparent;
    padding: 0.6rem 1.1rem; font-size: 0.8rem; font-weight: 600;
    color: var(--ah-text-muted); cursor: pointer;
    transition: color 0.15s, border-bottom-color 0.15s;
    display: inline-flex; align-items: center; gap: 0.4rem;
}
.section-tab:hover[b-l9pajw8sim]  { color: var(--ah-text-sub); }
.section-tab.active[b-l9pajw8sim] { color: var(--ah-text); border-bottom-color: var(--ah-text); }
.tab-count[b-l9pajw8sim] {
    font-size: 0.65rem; font-weight: 700; background: var(--ah-bg-subtle);
    color: var(--ah-text-muted); padding: 0.05rem 0.4rem; border-radius: 10px;
}
.section-tab.active .tab-count[b-l9pajw8sim] { background: var(--ah-bg-surface); color: var(--ah-text-sub); }

/* ── EndUser Access Tab ── */
.enduser-header[b-l9pajw8sim] {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 1rem;
}

.detail-table[b-l9pajw8sim] {
    width: 100%; border-collapse: collapse;
}
.detail-table th[b-l9pajw8sim] {
    font-size: 0.68rem; font-weight: 700; color: var(--ah-text-muted);
    text-transform: uppercase; letter-spacing: 0.03em;
    padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--ah-border);
    text-align: left;
}
.detail-table td[b-l9pajw8sim] {
    font-size: 0.8rem; color: var(--ah-text);
    padding: 0.7rem 0.75rem; border-bottom: 1px solid var(--ah-border-soft);
    vertical-align: middle;
}
.detail-table tbody tr:hover[b-l9pajw8sim] { background: var(--ah-bg-subtle); }

.enduser-email[b-l9pajw8sim] {
    font-weight: 600; color: var(--ah-text); font-size: 0.8rem;
}

.provider-badge[b-l9pajw8sim] {
    font-size: 0.65rem; font-weight: 700; padding: 0.1rem 0.4rem;
    border-radius: 3px; background: var(--ah-bg-subtle); color: var(--ah-text-sub);
    text-transform: capitalize;
}

.status-dot[b-l9pajw8sim] {
    display: inline-block; width: 6px; height: 6px; border-radius: 50%;
    margin-right: 0.3rem; vertical-align: middle;
}
.status-dot.s-active[b-l9pajw8sim]    { background: var(--ah-success); }
.status-dot.s-suspended[b-l9pajw8sim] { background: var(--ah-danger); }

/* ── Action buttons ── */
.btn-action-sm[b-l9pajw8sim] {
    font-size: 0.68rem; font-weight: 600; padding: 0.2rem 0.6rem;
    border-radius: var(--ah-radius); cursor: pointer; border: 1px solid;
    transition: opacity 0.15s;
}
.btn-action-sm:hover[b-l9pajw8sim] { opacity: 0.8; }
.btn-warn[b-l9pajw8sim] { background: transparent; border-color: var(--ah-danger-border); color: var(--ah-danger); }
.btn-ok[b-l9pajw8sim]   { background: transparent; border-color: var(--ah-success); color: var(--ah-success); }
.btn-icon-sm[b-l9pajw8sim] {
    display: inline-flex; align-items: center; justify-content: center;
    width: 26px; height: 26px; border-radius: var(--ah-radius);
    border: 1px solid transparent; background: transparent;
    cursor: pointer; font-size: 0.78rem; color: #94a3b8;
    transition: all 0.15s;
}
.btn-icon-danger:hover[b-l9pajw8sim] { color: var(--ah-danger); border-color: var(--ah-danger-border); background: #fef2f2; }

.btn-danger-outline[b-l9pajw8sim] {
    font-size: 0.75rem; font-weight: 700; color: var(--ah-danger);
    background: transparent; border: 1px solid var(--ah-danger-border);
    padding: 0.4rem 1.1rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: background-color 0.15s;
}
.btn-danger-outline:hover[b-l9pajw8sim] { background: var(--ah-danger-bg); }

/* ── Pagination ── */
.pagination-bar[b-l9pajw8sim] {
    display: flex; align-items: center; justify-content: center;
    gap: 1rem; margin-top: 1rem; padding: 0.5rem 0;
}
.btn-page[b-l9pajw8sim] {
    font-size: 0.72rem; font-weight: 600; padding: 0.3rem 0.8rem;
    border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    background: var(--ah-bg); color: var(--ah-text-sub); cursor: pointer;
    transition: background-color 0.15s;
}
.btn-page:hover:not(:disabled)[b-l9pajw8sim] { background: var(--ah-bg-subtle); }
.btn-page:disabled[b-l9pajw8sim] { opacity: 0.4; cursor: default; }
.page-info[b-l9pajw8sim] { font-size: 0.72rem; color: var(--ah-text-muted); }

/* ── Empty state ── */
.empty-state[b-l9pajw8sim] {
    text-align: center; padding: 3rem 1rem;
}
.empty-icon[b-l9pajw8sim] { font-size: 2rem; color: var(--ah-text-muted); margin-bottom: 0.5rem; }
.empty-text[b-l9pajw8sim] { font-size: 0.85rem; font-weight: 600; color: var(--ah-text-sub); }

/* [2026-07-31] 저장소 연결 배지 — App Group 카드의 DB 배지와 같은 무게로 읽혀야 한다.
   이름이 길어도 카드를 밀지 않도록 한 줄로 자른다. */
.repo-badge[b-l9pajw8sim] {
    display: flex; align-items: center; gap: 0.35rem;
    min-width: 0; margin-bottom: 0.6rem;
    font-size: 0.72rem; font-weight: 600;
    color: var(--ah-text-sub);
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border);
    border-radius: 5px; padding: 0.25rem 0.5rem;
}
.repo-name[b-l9pajw8sim] {
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
}
.repo-lock[b-l9pajw8sim] { flex-shrink: 0; color: var(--ah-text-muted); font-size: 0.68rem; }
/* /Features/Applications/AppGroupLoginMethods.razor.rz.scp.css */
/* AppGroupLoginMethods.razor.css
   Common classes (card-panel, btn-primary, back-link, toggle-switch 등)은
   ah-components.css에 있으며, 이 파일은 페이지 전용 클래스만 포함합니다. */

/* ── Header (title + Preview) ──
   [2026-08-05] .login-methods-head/.lm-head-actions 는 <PageHeader> 의
   .ah-page-header/.ah-page-header-actions 로 대체. */
.style-select[b-8krrmxfchw] { display: inline-flex; align-items: center; gap: 0.15rem; background: #f1f5f9; border: 1px solid var(--ah-border); border-radius: 9px; padding: 0.2rem; }
.style-select-label[b-8krrmxfchw] { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: var(--ah-text-muted); padding: 0 0.4rem 0 0.5rem; }
.style-opt[b-8krrmxfchw] { border: none; background: transparent; font-family: inherit; font-size: 0.76rem; font-weight: 600; color: var(--ah-text-sub); padding: 0.3rem 0.6rem; border-radius: 7px; cursor: pointer; transition: background 0.15s, color 0.15s; white-space: nowrap; }
.style-opt:hover[b-8krrmxfchw] { color: var(--ah-text); }
.style-opt.active[b-8krrmxfchw] { background: #fff; color: var(--ah-link); box-shadow: 0 1px 2px rgba(15,23,42,0.08); }

/* Preview 버튼 — 호스티드 로그인 새 탭 */
.preview-btn[b-8krrmxfchw] {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.45rem 0.85rem;
    border: 1px solid var(--ah-border);
    border-radius: 8px;
    background: #ffffff;
    color: var(--ah-text-sub);
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: border-color 0.15s, color 0.15s, background 0.15s, transform 0.1s;
}
.preview-btn:hover[b-8krrmxfchw] {
    border-color: var(--ah-link);
    color: var(--ah-link);
    background: #fafaff;
}
.preview-btn:active[b-8krrmxfchw] { transform: scale(0.98); }
.preview-btn i[b-8krrmxfchw] { font-size: 0.85rem; }

/* ── Live preview modal ── */
.lm-preview-backdrop[b-8krrmxfchw] {
    position: fixed;
    inset: 0;
    z-index: 1090;
    background: rgba(15, 23, 42, 0.5);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
}
.lm-preview-modal[b-8krrmxfchw] {
    width: 100%;
    max-width: 420px;
    max-height: 88vh;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 24px 60px -12px rgba(15, 23, 42, 0.4);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.lm-preview-head[b-8krrmxfchw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid var(--ah-border-soft);
}
.lm-preview-title[b-8krrmxfchw] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--ah-text);
}
.lm-live-dot[b-8krrmxfchw] {
    width: 8px; height: 8px; border-radius: 50%;
    background: #16a34a;
    box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.5);
    animation: lm-pulse-b-8krrmxfchw 1.6s infinite;
}
@keyframes lm-pulse-b-8krrmxfchw {
    0%   { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0.45); }
    70%  { box-shadow: 0 0 0 6px rgba(22, 163, 74, 0); }
    100% { box-shadow: 0 0 0 0 rgba(22, 163, 74, 0); }
}
.lm-preview-close[b-8krrmxfchw] {
    width: 30px; height: 30px;
    border: none; border-radius: 8px;
    background: var(--ah-bg-subtle);
    color: var(--ah-text-muted);
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    font-size: 0.8rem;
    transition: background 0.15s, color 0.15s;
}
.lm-preview-close:hover[b-8krrmxfchw] { background: var(--ah-border); color: var(--ah-text); }

/* stage = 로그인 페이지 배경 프레임 */
.lm-preview-stage[b-8krrmxfchw] {
    padding: 1.5rem 1.25rem;
    background: #f1f5f9;
    overflow-y: auto;
}

/* mock 로그인 카드 */
.mock-login[b-8krrmxfchw] {
    background: #ffffff;
    border: 1px solid #e7ebf0;
    border-radius: 14px;
    padding: 1.5rem 1.35rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    box-shadow: 0 4px 14px -8px rgba(15, 23, 42, 0.15);
}
.mock-logo[b-8krrmxfchw] {
    width: 44px; height: 44px;
    border-radius: 11px;
    background: #0f172a;
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 1.05rem;
    margin-bottom: 0.75rem;
}
.mock-title[b-8krrmxfchw] { font-size: 1rem; font-weight: 700; color: #0f172a; }
.mock-sub[b-8krrmxfchw] { font-size: 0.75rem; color: var(--ah-text-muted); margin-bottom: 1rem; }

.mock-btn[b-8krrmxfchw] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.6rem 0.85rem;
    border-radius: 9px;
    font-size: 0.82rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    border: 1px solid #e7ebf0;
    background: #fff;
    color: #1e293b;
    cursor: default;
}
.mock-btn-dark[b-8krrmxfchw] { background: #0f172a; color: #fff; border-color: #0f172a; }
.mock-btn-dark i[b-8krrmxfchw] { font-size: 0.9rem; }
.mock-social[b-8krrmxfchw] { justify-content: flex-start; }
/* brand style preview — full brand-color button */
.mock-brand[b-8krrmxfchw] { justify-content: center; gap: 8px; font-weight: 600; }
.mock-brand-img[b-8krrmxfchw] { width: 18px; height: 18px; object-fit: contain; display: block; }
.mock-brand i[b-8krrmxfchw] { font-size: 0.95rem; }
.mock-badge[b-8krrmxfchw] {
    width: 22px !important;
    height: 22px !important;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
/* provider별 로고 크기 — 각 마크가 뱃지 대비 최적 비율이 달라 개별 지정 */
.mock-badge-img[b-8krrmxfchw] { width: 14px; height: 14px; object-fit: contain; }
.mock-badge.provider-badge-line  .mock-badge-img[b-8krrmxfchw] { width: 100%; height: 100%; }  /* LINE = full-bleed 타일 */
.mock-badge.provider-badge-naver .mock-badge-img[b-8krrmxfchw] { width: 11px; height: 11px; }  /* Naver N = 작게(패딩) */
.mock-badge i[b-8krrmxfchw] { font-size: 0.85rem; }
.mock-badge.provider-badge-apple  i[b-8krrmxfchw],
.mock-badge.provider-badge-github i[b-8krrmxfchw] { color: #ffffff; }  /* 어두운 뱃지 위 아이콘 흰색 */
.mock-input[b-8krrmxfchw] {
    width: 100%;
    text-align: left;
    padding: 0.55rem 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    font-size: 0.8rem;
    color: var(--ah-text-muted);
    background: #f8fafc;
    margin-bottom: 0.5rem;
}
.mock-divider[b-8krrmxfchw] {
    display: flex; align-items: center;
    width: 100%;
    margin: 0.35rem 0 0.65rem;
    color: var(--ah-text-muted);
    font-size: 0.7rem;
}
.mock-divider[b-8krrmxfchw]::before, .mock-divider[b-8krrmxfchw]::after {
    content: ""; flex: 1; height: 1px; background: #e7ebf0;
}
.mock-divider span[b-8krrmxfchw] { padding: 0 0.6rem; }
.mock-empty[b-8krrmxfchw] {
    font-size: 0.78rem; color: var(--ah-text-muted);
    padding: 1rem 0;
}
.mock-powered[b-8krrmxfchw] {
    margin-top: 0.75rem;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
    display: inline-flex; align-items: center; gap: 0.3rem;
}
.mock-powered i[b-8krrmxfchw] { color: var(--ah-link); }

.lm-preview-note[b-8krrmxfchw] {
    padding: 0.7rem 1.1rem;
    border-top: 1px solid var(--ah-border-soft);
    font-size: 0.68rem;
    color: var(--ah-text-muted);
    text-align: center;
}
.lm-preview-live-link[b-8krrmxfchw] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    margin-left: 0.4rem;
    color: var(--ah-link);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.lm-preview-live-link:hover[b-8krrmxfchw] { text-decoration: underline; }

/* ── Cards ──
   [2026-08-11 Sonny] 이 페이지만 카드 안쪽 좌우 여백 +15px. 토글이 오른쪽 테두리에,
   설명 글이 왼쪽 테두리에 붙어 보였다. 공용 .card-panel(ah-components.css)은 다른 화면도
   같이 쓰므로 건드리지 않고, 스코프드 CSS 로 이 화면에서만 덮는다. */
.card-panel[b-8krrmxfchw] {
    padding-left:  calc(1.5rem + 15px);
    padding-right: calc(1.5rem + 15px);
}

/* ── Method rows ── */
.method-row[b-8krrmxfchw] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         0.85rem 0;
    border-bottom:   1px solid var(--ah-border-soft);
}

.method-info[b-8krrmxfchw] { flex: 1; }
.method-name[b-8krrmxfchw] { font-size: 0.82rem; font-weight: 700; color: var(--ah-text); }
.method-desc[b-8krrmxfchw] { font-size: 0.7rem; color: var(--ah-text-muted); margin-top: 0.1rem; }

/* ── Provider icon badge ── */
.provider-badge[b-8krrmxfchw] {
    width:           28px;
    height:          28px;
    border-radius:   var(--ah-radius);
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-shrink:     0;
    overflow:        hidden;
    background:      var(--ah-bg-subtle);
    border:          1px solid var(--ah-border);
}

/* Brand-specific badge backgrounds — Dashboard 내부용 작은 인디케이터.
   진짜 로그인 페이지의 공식 button image 는 PR 7b 에서 적용 (검수 PASS 위해 공식 PNG 그대로). */
.provider-badge-kakao[b-8krrmxfchw]  { background: #FEE500; border-color: #E6CF00; }
.provider-badge-naver[b-8krrmxfchw]  { background: #03C75A; border-color: #02A04A; }
.provider-badge-apple[b-8krrmxfchw]  { background: #000000; border-color: #000000; }
/* LINE — full-bleed green tile (svg fills the badge); green frame so no grey ring shows. */
.provider-badge-line[b-8krrmxfchw]   { background: #00C300; border-color: #00C300; }
/* GitHub — dark badge with the official bi-github glyph (replaces the old "GH" text). */
.provider-badge-github[b-8krrmxfchw] { background: #24292F; border-color: #24292F; }
.provider-badge-github i[b-8krrmxfchw] { color: #ffffff; font-size: 1rem; line-height: 1; }

.provider-letter[b-8krrmxfchw] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.02em;
}

/* Toggle off 시 — brand color 제거, grayscale + 흐리게.
   img logo (Google/LINE) 는 filter 로 desaturate, brand badge (Kakao/Naver) 는
   background 자체를 회색으로 override. */
.provider-badge-disabled[b-8krrmxfchw] {
    background:    var(--ah-bg-subtle) !important;
    border-color:  var(--ah-border) !important;
    filter:        grayscale(100%);
    opacity:       0.45;
}
.provider-badge-disabled .provider-letter[b-8krrmxfchw] {
    color: var(--ah-text-muted) !important;
}
.provider-badge-disabled i[b-8krrmxfchw] {
    color: var(--ah-text-muted) !important;
}

/* ── Federation ── */
.fed-enterprise-badge[b-8krrmxfchw] {
    font-size:     0.62rem;
    font-weight:   700;
    color:         #4f46e5;
    background:    var(--ah-info-bg);
    border:        1px solid var(--ah-info-border);
    padding:       0.1rem 0.4rem;
    border-radius: 3px;
    margin-left:   0.5rem;
}

.fed-provider-row[b-8krrmxfchw] {
    border-bottom: none;
    background:    var(--ah-bg-subtle);
    border-radius: 6px;
    padding:       0.6rem 0.85rem;
}

.fed-active-badge[b-8krrmxfchw] {
    font-size:     0.65rem;
    font-weight:   700;
    color:         var(--ah-success);
    background:    var(--ah-success-bg);
    border:        1px solid var(--ah-success-border);
    padding:       0.1rem 0.4rem;
    border-radius: 3px;
}

.fed-empty[b-8krrmxfchw] {
    margin-top: 0.75rem;
    font-size:  0.75rem;
    color:      var(--ah-text-muted);
}

/* Toggle — 글로벌 ah-components.css의 --ah-toggle-on 변수로 통일 */
/* /Features/Audit/Pages/AuditAnalytics.razor.rz.scp.css */
/* [2026-08-09] Integrity Audit(ai-*) 디자인 언어로 통일 — --ah-* 토큰 기반.
   카드 = 흰 배경 + 보더 + shadow-sm, 라벨 = uppercase 소형, CTA = 검정(ai-search-btn 문법).
   ai-* 클래스는 CSS isolation 으로 재사용 불가 → 같은 값을 ana-* 에 복제한다. */
.ana-page[b-qx4s353xyc] {
    width: 100%;
    margin: 0 auto;
    padding-bottom: 80px;
}

.ana-days[b-qx4s353xyc] {
    display: inline-flex;
    border: 1px solid var(--ah-border);
    border-radius: 6px;
    background: var(--ah-bg);
    overflow: hidden;
}

.ana-days-btn[b-qx4s353xyc] {
    border: none;
    background: transparent;
    height: 34px;
    padding: 0 0.8rem;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    color: var(--ah-text-sub);
    transition: all 0.15s;
}

.ana-days-btn:hover[b-qx4s353xyc] { background: var(--ah-bg-subtle); }

.ana-days-btn.active[b-qx4s353xyc] {
    background: var(--ah-text);
    color: var(--ah-bg);
    font-weight: 700;
}

/* [2026-08-05] 애드온 미보유 시 7/30/90 잠금 — 누르면 팝업이 뜨므로 클릭 자체는 살려둔다. */
.ana-days-btn.locked[b-qx4s353xyc] {
    opacity: 0.55;
}

.ana-days-btn.locked i[b-qx4s353xyc] {
    font-size: 0.62rem;
    margin-left: 0.25rem;
    vertical-align: 0.05em;
}

.ana-group-select[b-qx4s353xyc] {
    height: 36px;
    padding: 0 0.75rem;
    border: 1px solid var(--ah-border);
    border-radius: 6px;
    background: var(--ah-bg);
    color: var(--ah-text);
    font-size: 0.8rem;
    max-width: 260px;
    outline: none;
    transition: border-color 0.15s;
}

.ana-group-select:focus[b-qx4s353xyc] {
    border-color: var(--ah-focus-color);
    box-shadow: var(--ah-focus-ring);
}

.ana-banner[b-qx4s353xyc] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-radius: 8px;
    padding: 0.6rem 0.9rem;
    font-size: 0.85rem;
    margin-bottom: 1rem;
}

.ana-banner--warn[b-qx4s353xyc] {
    background: var(--ah-warning-bg);
    color: #92400e;
    border: 1px solid var(--ah-warning-border);
}

.ana-banner--error[b-qx4s353xyc] {
    background: rgba(239, 68, 68, 0.1);
    color: #b91c1c;
    border: 1px solid rgba(239, 68, 68, 0.3);
}

.ana-loading[b-qx4s353xyc] {
    padding: 3rem 0;
    text-align: center;
    color: var(--ah-text-muted);
}

.ana-cards[b-qx4s353xyc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

/* = ai-summary-card */
.ana-card[b-qx4s353xyc] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding: 1.65rem 1.5rem;
    box-shadow: var(--ah-shadow-sm);
}

/* = ai-summary-label (값 아래 uppercase 라벨) */
.ana-card-label[b-qx4s353xyc] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top: 0.35rem;
}

/* = ai-summary-value */
.ana-card-value[b-qx4s353xyc] {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--ah-text);
    letter-spacing: -1px;
    line-height: 1;
}

.ana-card-sub[b-qx4s353xyc] {
    font-size: 0.72rem;
    color: var(--ah-text-muted);
    margin-top: 0.35rem;
}

.ana-delta[b-qx4s353xyc] {
    font-size: 0.72rem;
    font-weight: 600;
    margin-top: 0.35rem;
}

.ana-delta.up[b-qx4s353xyc] { color: #16a34a; }
.ana-delta.down[b-qx4s353xyc] { color: #dc2626; }

.ana-grid-2[b-qx4s353xyc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

/* = ai-summary-card (차트 카드 변형: padding 16px 20px) */
.ana-panel[b-qx4s353xyc] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding: 16px 20px;
    box-shadow: var(--ah-shadow-sm);
    min-width: 0;
    margin-bottom: 1.25rem;
}

.ana-grid-2 > .ana-panel[b-qx4s353xyc] { margin-bottom: 0; }

.ana-panel-head[b-qx4s353xyc] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--ah-text);
    margin-bottom: 0.75rem;
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.ana-panel-note[b-qx4s353xyc] {
    font-size: 0.72rem;
    font-weight: 500;
    color: var(--ah-text-muted);
}

.ana-empty[b-qx4s353xyc] {
    padding: 1.5rem 0;
    text-align: center;
    font-size: 0.85rem;
    color: var(--ah-text-muted);
}

/* = ai-table 타이포/컬러 (패널 내부라 padding 만 컴팩트) */
.ana-table[b-qx4s353xyc] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85rem;
}

.ana-table th[b-qx4s353xyc] {
    text-align: left;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--ah-text-muted);
    padding: 0.5rem 0.6rem;
    border-bottom: 1px solid var(--ah-border);
    white-space: nowrap;
}

.ana-table td[b-qx4s353xyc] {
    padding: 0.55rem 0.6rem;
    border-bottom: 1px solid var(--ah-bg-subtle);
    color: var(--ah-text-sub);
    vertical-align: middle;
}

.ana-table tbody tr[b-qx4s353xyc] { transition: background 0.1s; }
.ana-table tbody tr:hover[b-qx4s353xyc] { background: var(--ah-bg-subtle); }
.ana-table tbody tr:last-child td[b-qx4s353xyc] { border-bottom: none; }

.ana-table .num[b-qx4s353xyc] { text-align: right; }

/* = ai-event-type */
.ana-table .mono[b-qx4s353xyc] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-weight: 700;
    color: var(--ah-text);
    font-size: 0.8rem;
}

.ana-muted[b-qx4s353xyc] { color: var(--ah-text-muted); font-size: 0.8rem; }

/* [2026-08-05] 애드온 미보유 = 3일 미리보기 배너 — 잠금 카드(ana-addon-gate)를 대체. */
.ana-banner--addon[b-qx4s353xyc] {
    background: var(--ah-bg);
    color: var(--ah-text-sub);
    border: 1px solid var(--ah-border);
    box-shadow: var(--ah-shadow-sm);
}

.ana-banner--addon > i[b-qx4s353xyc] {
    color: var(--ah-text-sub);
}

/* = ai-search-btn */
.ana-banner-cta[b-qx4s353xyc] {
    border: none;
    background: var(--ah-text);
    color: var(--ah-bg);
    font-weight: 700;
    font-size: 0.75rem;
    height: 32px;
    padding: 0 0.9rem;
    border-radius: 6px;
    cursor: pointer;
    margin-left: auto;
    white-space: nowrap;
    transition: opacity 0.15s;
}

.ana-banner-cta:hover[b-qx4s353xyc] { opacity: 0.85; }
/* /Features/Audit/Pages/AuditIntegrityDashboard.razor.rz.scp.css */
/* AuditIntegrityDashboard.razor.css — CSS variable 기반 (통합본) */

/* ════════════════════════════════
   Tabs (Members 페이지와 동일 스타일)
════════════════════════════════ */
.ai-tab-container[b-xp0uxdmnbz] {
    background:    var(--ah-bg-surface, #ffffff);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-sm, 0 1px 2px rgba(0,0,0,0.05));
    overflow:      hidden;
    margin-bottom: 16px;
}

.ai-tab-header[b-xp0uxdmnbz] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         0 1.25rem;
    border-bottom:   1px solid var(--ah-border, #e2e8f0);
}

.ai-tab[b-xp0uxdmnbz] {
    padding:       0.875rem 1.25rem; /* 15% 더 높게 (2026-04-17) */
    font-size:     0.8rem;
    font-weight:   600;
    color:         var(--ah-text-muted, #94a3b8);
    cursor:        pointer;
    border:        none;
    background:    transparent;
    border-bottom: 2px solid transparent;
    transition:    color 0.15s, border-color 0.15s;
}
.ai-tab:hover[b-xp0uxdmnbz]  { color: var(--ah-text-sub, #475569); }
.ai-tab.active[b-xp0uxdmnbz] {
    color:               var(--ah-text, #0f172a);
    font-weight:         700;
    border-bottom-color: var(--ah-text, #0f172a);
}

.ai-tab-body[b-xp0uxdmnbz] { padding: 1rem 1.25rem 1.25rem; }

/* ════════════════════════════════
   기존 유틸 클래스 (유지)
════════════════════════════════ */
.light-dashboard[b-xp0uxdmnbz] { width: 100%; margin: 0 auto; padding-bottom: 80px; }

.x-small[b-xp0uxdmnbz] { font-size: 0.75rem; letter-spacing: 0.02em; color: var(--ah-text-muted); font-weight: 500; }

.dot[b-xp0uxdmnbz]       { height: 10px; width: 10px; border-radius: 50%; display: inline-block; margin-right: 6px; }
.dot-green[b-xp0uxdmnbz] { background-color: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,0.2); }
.dot-red[b-xp0uxdmnbz]   { background-color: var(--ah-danger); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ah-danger) 20%, transparent); }
.anim-pulse[b-xp0uxdmnbz] { animation: pulse-op-b-xp0uxdmnbz 2s cubic-bezier(0.4,0,0.6,1) infinite; }
@keyframes pulse-op-b-xp0uxdmnbz { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }

/* ════════════════════════════════
   Header
════════════════════════════════ */
.ai-slug-mono[b-xp0uxdmnbz] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.7rem; color: var(--ah-text-muted); letter-spacing: -0.3px;
}

.ai-tier-badge[b-xp0uxdmnbz] {
    font-size: 0.7rem; font-weight: 600;
    padding: 0.25rem 0.6rem; border-radius: 4px;
    background: var(--ah-bg-surface); color: var(--ah-text-sub);
    border: 1px solid var(--ah-border);
}
.ai-tier-badge.threat[b-xp0uxdmnbz] {
    background: var(--ah-warning-bg); color: #92400e; border-color: var(--ah-warning-border);
}

.ai-refresh-btn[b-xp0uxdmnbz] {
    font-size: 0.8rem; font-weight: 600;
    color: var(--ah-text-sub); background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    padding: 0.4rem 1rem; border-radius: 6px;
    cursor: pointer; transition: all 0.15s;
    display: inline-flex; align-items: center;
}
.ai-refresh-btn:hover[b-xp0uxdmnbz] { background: var(--ah-bg-subtle); }
.ai-refresh-btn:disabled[b-xp0uxdmnbz] { opacity: 0.5; cursor: not-allowed; }

/* ════════════════════════════════
   Summary Cards
════════════════════════════════ */
.ai-summary-card[b-xp0uxdmnbz] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 1.65rem 1.5rem; box-shadow: var(--ah-shadow-sm);
}
.ai-summary-value[b-xp0uxdmnbz] {
    font-size: 1.75rem; font-weight: 800;
    color: var(--ah-text); letter-spacing: -1px; line-height: 1;
}
.ai-summary-value.muted[b-xp0uxdmnbz] { color: var(--ah-text-muted); }
.ai-summary-label[b-xp0uxdmnbz] {
    font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted);
    text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem;
}
.ai-score-value[b-xp0uxdmnbz] { font-size: 1.75rem; font-weight: 800; letter-spacing: -1px; line-height: 1; }
.ai-score-value.healthy[b-xp0uxdmnbz] { color: var(--ah-text); }
.ai-score-value.critical[b-xp0uxdmnbz] { color: var(--ah-text-sub); }
.ai-score-percent[b-xp0uxdmnbz] { font-size: 1rem; font-weight: 400; color: var(--ah-text-muted); margin-left: 1px; }

/* ════════════════════════════════
   Search bar
════════════════════════════════ */
.ai-search-bar[b-xp0uxdmnbz] { display: flex; gap: 0.5rem; align-items: center; }

.ai-date-input[b-xp0uxdmnbz], .ai-keyword-input[b-xp0uxdmnbz] {
    height: 36px; font-size: 0.8rem;
    border: 1px solid var(--ah-border); border-radius: 6px;
    padding: 0 0.75rem; color: var(--ah-text); background: var(--ah-bg);
    outline: none; transition: border-color 0.15s;
}
.ai-date-input[b-xp0uxdmnbz] { width: 145px; }
.ai-keyword-input[b-xp0uxdmnbz] { width: 220px; }
.ai-date-input:focus[b-xp0uxdmnbz], .ai-keyword-input:focus[b-xp0uxdmnbz] {
    border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring);
}
.ai-date-input.warn-border[b-xp0uxdmnbz] { border-color: var(--ah-warning); }

.ai-date-sep[b-xp0uxdmnbz] { font-size: 0.75rem; color: var(--ah-text-muted); padding: 0 0.15rem; }

.ai-search-btn[b-xp0uxdmnbz] {
    height: 36px; padding: 0 1rem;
    font-size: 0.75rem; font-weight: 700;
    background: var(--ah-text); color: var(--ah-bg);
    border: none; border-radius: 6px; cursor: pointer;
    display: inline-flex; align-items: center; gap: 0.4rem;
    transition: opacity 0.15s;
}
.ai-search-btn:hover[b-xp0uxdmnbz] { opacity: 0.85; }
.ai-search-btn:disabled[b-xp0uxdmnbz] { opacity: 0.5; cursor: not-allowed; }

.ai-search-hint[b-xp0uxdmnbz] { font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.35rem; }
.ai-search-hint.warn[b-xp0uxdmnbz] { color: var(--ah-warning); font-weight: 600; }

.ai-log-count[b-xp0uxdmnbz] { font-size: 0.7rem; color: var(--ah-text-muted); padding-top: 0.5rem; }
.ai-log-count strong[b-xp0uxdmnbz] { color: var(--ah-text-sub); }
.ai-max-warn[b-xp0uxdmnbz] { color: var(--ah-warning); font-weight: 700; }

/* ════════════════════════════════
   Table
════════════════════════════════ */
.ai-table-container[b-xp0uxdmnbz] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 12px; box-shadow: var(--ah-shadow-sm); overflow: hidden;
}

.ai-table[b-xp0uxdmnbz] { width: 100%; border-collapse: separate; border-spacing: 0; }

.ai-table th[b-xp0uxdmnbz] {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.03em; color: var(--ah-text-muted); background: var(--ah-bg);
    border-bottom: 1px solid var(--ah-border);
    padding: 0.75rem 1.25rem; text-align: left; white-space: nowrap;
}
.ai-th-sub[b-xp0uxdmnbz] { font-weight: 400; font-size: 0.6rem; color: var(--ah-text-muted); }

.ai-table td[b-xp0uxdmnbz] {
    padding: 0.85rem 1.25rem; border-bottom: 1px solid var(--ah-bg-subtle);
    font-size: 0.85rem; color: var(--ah-text-sub); vertical-align: middle; white-space: nowrap;
}
.ai-table tbody tr[b-xp0uxdmnbz] { transition: background 0.1s; }
.ai-table tbody tr:hover[b-xp0uxdmnbz] { background: var(--ah-bg-subtle); }
.ai-table tbody tr:last-child td[b-xp0uxdmnbz] { border-bottom: none; }

.ai-empty-cell[b-xp0uxdmnbz] {
    text-align: center; padding: 3rem 0;
    color: var(--ah-text-muted); font-size: 0.8rem;
}

/* ════════════════════════════════
   Row elements
════════════════════════════════ */
.ai-time-main[b-xp0uxdmnbz] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.8rem; font-weight: 600;
    color: var(--ah-text-sub); letter-spacing: -0.3px;
}
.ai-time-tz[b-xp0uxdmnbz] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.6rem; color: var(--ah-text-muted);
}

.ai-category-badge[b-xp0uxdmnbz] {
    font-size: 0.65rem; font-weight: 700;
    padding: 0.2rem 0.6rem; border-radius: 4px;
    background: var(--ah-bg-surface); color: var(--ah-text-sub);
    border: 1px solid var(--ah-border);
    text-transform: uppercase; letter-spacing: 0.03em;
}
/* VS Code terminal neon palette (dark mode) */
[data-theme="dark"] .ai-cat-user[b-xp0uxdmnbz]         { background: rgba(78,201,176,0.15); color: #4ec9b0; border-color: rgba(78,201,176,0.3); }
[data-theme="dark"] .ai-cat-organization[b-xp0uxdmnbz] { background: rgba(206,145,252,0.15); color: #ce91fc; border-color: rgba(206,145,252,0.3); }
[data-theme="dark"] .ai-cat-auth[b-xp0uxdmnbz]         { background: rgba(86,182,255,0.15); color: #56b6ff; border-color: rgba(86,182,255,0.3); }
[data-theme="dark"] .ai-cat-system[b-xp0uxdmnbz]       { background: rgba(255,214,102,0.15); color: #ffd666; border-color: rgba(255,214,102,0.3); }
[data-theme="dark"] .ai-cat-security[b-xp0uxdmnbz]     { background: rgba(255,107,129,0.15); color: #ff6b81; border-color: rgba(255,107,129,0.3); }
[data-theme="dark"] .ai-cat-app_group[b-xp0uxdmnbz]    { background: rgba(99,179,237,0.15); color: #63b3ed; border-color: rgba(99,179,237,0.3); }

.ai-event-type[b-xp0uxdmnbz] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-weight: 700; color: var(--ah-text); font-size: 0.8rem; text-transform: lowercase;
}

.ai-actor-text[b-xp0uxdmnbz] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.75rem; color: var(--ah-text-muted);
}

.ai-detail-btn[b-xp0uxdmnbz] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    color: var(--ah-text-sub); font-weight: 600; font-size: 0.7rem;
    padding: 0.3rem 0.75rem; border-radius: 6px;
    cursor: pointer; transition: all 0.15s;
}
.ai-detail-btn:hover[b-xp0uxdmnbz] {
    background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); color: var(--ah-text);
}
[data-theme="dark"] .ai-detail-btn[b-xp0uxdmnbz] {
    background: transparent; border-color: #eac4ff; color: #eac4ff;
}
[data-theme="dark"] .ai-detail-btn:hover[b-xp0uxdmnbz] {
    background: rgba(234,196,255,0.1); color: #ffffff;
}
.ai-detail-btn:disabled[b-xp0uxdmnbz] { opacity: 0.4; cursor: not-allowed; }

/* ════════════════════════════════
   Seal / Notarized badges
════════════════════════════════ */
.ai-seal-badge[b-xp0uxdmnbz] {
    font-size: 0.65rem; font-weight: 700;
    padding: 0.2rem 0.6rem; border-radius: 4px;
    text-transform: uppercase; letter-spacing: 0.03em;
    display: inline-block;
}
.ai-seal-sealed[b-xp0uxdmnbz]    { background: #eff6ff; color: #2563eb; border: 1px solid rgba(37,99,235,0.2); }
.ai-seal-notarized[b-xp0uxdmnbz] { background: #f0fdf4; color: #16a34a; border: 1px solid rgba(22,163,106,0.2); }
.ai-seal-mapped[b-xp0uxdmnbz]    { background: #ecfdf5; color: #059669; border: 1px solid rgba(5,150,105,0.2); }
.ai-seal-skipped[b-xp0uxdmnbz]   { background: #fefce8; color: #ca8a04; border: 1px solid rgba(202,138,4,0.2); }
.ai-seal-none[b-xp0uxdmnbz]      { background: var(--ah-bg-surface); color: var(--ah-text-muted); border: 1px solid var(--ah-border); }

[data-theme="dark"] .ai-seal-sealed[b-xp0uxdmnbz]    { background: rgba(37,99,235,0.15); color: #60a5fa; border-color: rgba(96,165,250,0.3); }
[data-theme="dark"] .ai-seal-notarized[b-xp0uxdmnbz] { background: rgba(22,163,106,0.15); color: #4ade80; border-color: rgba(74,222,128,0.3); }
[data-theme="dark"] .ai-seal-mapped[b-xp0uxdmnbz]    { background: rgba(5,150,105,0.15); color: #34d399; border-color: rgba(52,211,153,0.3); }
[data-theme="dark"] .ai-seal-skipped[b-xp0uxdmnbz]   { background: rgba(202,138,4,0.15); color: #fbbf24; border-color: rgba(251,191,36,0.3); }
/* /Features/Auth/Pages/InvitationLanding.razor.rz.scp.css */
/* ─────────────────────────────────────────────────────────────
   Invitation landing — redesigned 2026-07-06
   단일 중앙 카드. 정책은 인라인 아코디언(카드 리사이즈)이 아니라
   클릭 행 → 모달. 커스텀 체크박스 + 정제된 위계.
   ───────────────────────────────────────────────────────────── */

.invite-card[b-erjovc3et9] {
    --accent: var(--ah-link, #4f46e5);
    width: 100%;
    max-width: 440px;
    margin: 0 auto;
    padding: 2.5rem 2.25rem 1.75rem;
    background: #ffffff;
    border: 1px solid #e7ebf0;
    border-radius: 20px;
    box-shadow: 0 12px 32px -12px rgba(15, 23, 42, 0.12), 0 1px 2px rgba(15, 23, 42, 0.04);
}

.invite-body[b-erjovc3et9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* ── org 로고 ── */
.invite-org-logo[b-erjovc3et9] {
    width: 76px;
    height: 76px;
    background: #0f172a;   /* flat 단색 — 그라디언트/그림자 없음 */
    color: #ffffff;
    border-radius: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.7rem;
    font-weight: 700;
    letter-spacing: -0.03em;
    margin-bottom: 1.25rem;
}

.invite-org-logo-img[b-erjovc3et9] {
    width: 76px;
    height: 76px;
    object-fit: contain;
    border-radius: 18px;
    margin-bottom: 1.25rem;
    display: block;
    border: 1px solid #eef2f6;
}

/* 스켈레톤 */
.invite-org-logo.skeleton-box[b-erjovc3et9],
.invite-skeleton-line[b-erjovc3et9] {
    background: linear-gradient(90deg, #e2e8f0 25%, #f1f5f9 50%, #e2e8f0 75%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-erjovc3et9 1.2s infinite;
    border-radius: 8px;
}
.invite-skeleton-line[b-erjovc3et9] { display: block; }
@keyframes skeleton-shimmer-b-erjovc3et9 {
    0%   { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* ── 헤더 텍스트 ── */
.invite-eyebrow[b-erjovc3et9] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--accent);
    margin-bottom: 0.5rem;
}

.invite-card-title[b-erjovc3et9] {
    font-size: 1.8rem;
    font-weight: 750;
    color: #0f172a;
    letter-spacing: -0.025em;
    line-height: 1.15;
    margin: 0 0 0.5rem;
    word-break: break-word;
}

.invite-tagline[b-erjovc3et9] {
    font-size: 0.9rem;
    color: #64748b;
    line-height: 1.55;
    margin: 0 0 1.5rem;
    max-width: 340px;
}

/* ── 메타 (Sent to / Expires) ── */
.invite-meta[b-erjovc3et9] {
    width: 100%;
    background: #f8fafc;
    border: 1px solid #eef2f6;
    border-radius: 12px;
    padding: 0.35rem 1.1rem;
    margin-bottom: 1.5rem;
}

.invite-meta-row[b-erjovc3et9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.7rem 0;
    font-size: 0.82rem;
}

.invite-meta-divider[b-erjovc3et9] {
    height: 1px;
    background: #eef2f6;
}

.invite-meta-label[b-erjovc3et9] {
    color: #94a3b8;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex: 0 0 auto;
}
.invite-meta-label i[b-erjovc3et9] { font-size: 0.85rem; opacity: 0.85; }

.invite-meta-value[b-erjovc3et9] {
    color: #1e293b;
    font-weight: 600;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── 정책 패널 ── */
.invite-policies[b-erjovc3et9] {
    width: 100%;
    margin-bottom: 1.5rem;
    text-align: left;
}

.invite-policies-head[b-erjovc3et9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: #94a3b8;
    margin-bottom: 0.6rem;
}
.invite-policies-title[b-erjovc3et9] { display: inline-flex; align-items: center; gap: 0.4rem; }
.invite-policies-head i[b-erjovc3et9] { font-size: 0.85rem; }

/* 진행도 배지 — n/N read → All read */
.invite-policies-progress[b-erjovc3et9] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
    padding: 0.12rem 0.5rem;
    border-radius: 999px;
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.64rem;
    letter-spacing: 0.03em;
}
.invite-policies-progress.is-complete[b-erjovc3et9] {
    background: #ecfdf3;
    color: #15803d;
}

.invite-policy-list[b-erjovc3et9] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    margin-bottom: 0.9rem;
}

/* 정책 행 — 고정 높이, 펼침 없음. 클릭 → 모달(text) / 새탭(link). */
.invite-policy-row[b-erjovc3et9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    padding: 0.7rem 0.9rem;
    background: #ffffff;
    border: 1px solid #e7ebf0;
    border-radius: 10px;
    font-family: inherit;
    font-size: 0.86rem;
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    cursor: pointer;
    text-align: left;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
}
.invite-policy-row:hover[b-erjovc3et9] {
    border-color: var(--accent);
    background: #fafaff;
}
.invite-policy-row:active[b-erjovc3et9] { transform: scale(0.99); }

.invite-policy-name[b-erjovc3et9] { flex: 1 1 auto; }

.invite-policy-action[b-erjovc3et9] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 auto;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--accent);
}
.invite-policy-action i[b-erjovc3et9] { font-size: 0.72rem; }

/* 열람 완료 행 — 옅은 초록 + 체크. */
.invite-policy-row.is-viewed[b-erjovc3et9] {
    border-color: #bbf7d0;
    background: #f6fef9;
}
.invite-policy-done[b-erjovc3et9] { color: #15803d; }
.invite-policy-done i[b-erjovc3et9] { font-size: 0.8rem; }

/* ── 커스텀 동의 체크박스 ── */
.invite-agree[b-erjovc3et9] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    cursor: pointer;
    font-size: 0.83rem;
    line-height: 1.45;
    color: #475569;
    user-select: none;
}
.invite-agree input[b-erjovc3et9] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.invite-agree-box[b-erjovc3et9] {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    margin-top: 0.05rem;
    border: 1.5px solid #cbd5e1;
    border-radius: 6px;
    background: #ffffff;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, border-color 0.15s;
}
.invite-agree-box i[b-erjovc3et9] {
    font-size: 0.8rem;
    opacity: 0;
    transform: scale(0.6);
    transition: opacity 0.15s, transform 0.15s;
}
.invite-agree input:checked + .invite-agree-box[b-erjovc3et9] {
    background: var(--accent);
    border-color: var(--accent);
}
.invite-agree input:checked + .invite-agree-box i[b-erjovc3et9] {
    opacity: 1;
    transform: scale(1);
}
.invite-agree input:focus-visible + .invite-agree-box[b-erjovc3et9] {
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.22);
}
.invite-agree-text[b-erjovc3et9] { padding-top: 0.02rem; }

/* 전부 열람 전 = 잠금(강제 열람 게이트) */
.invite-agree.is-locked[b-erjovc3et9] { cursor: not-allowed; }
.invite-agree.is-locked .invite-agree-box[b-erjovc3et9] { background: #f1f5f9; border-color: #e2e8f0; }
.invite-agree-locktext[b-erjovc3et9] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #94a3b8;
    font-style: italic;
}
.invite-agree-locktext i[b-erjovc3et9] { font-size: 0.7rem; font-style: normal; }

/* ── Accept 버튼 ── */
.invite-accept-btn[b-erjovc3et9] {
    width: 100%;
    padding: 0.9rem 1.25rem;
    background: #0f172a;
    color: #ffffff;
    font-family: inherit;
    font-weight: 650;
    font-size: 0.95rem;
    border: none;
    border-radius: 11px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    transition: background 0.2s, transform 0.12s, box-shadow 0.2s;
    box-shadow: 0 8px 18px -10px rgba(15, 23, 42, 0.6);
}
.invite-accept-btn:hover:not(:disabled)[b-erjovc3et9] {
    background: #1e293b;
    transform: translateY(-1px);
    box-shadow: 0 12px 22px -10px rgba(15, 23, 42, 0.55);
}
.invite-accept-btn:active:not(:disabled)[b-erjovc3et9] { transform: translateY(0); }
.invite-accept-btn i[b-erjovc3et9] { font-size: 1rem; }
.invite-accept-btn:disabled[b-erjovc3et9] {
    background: #cbd5e1;
    color: #f8fafc;
    cursor: not-allowed;
    box-shadow: none;
}

.invite-hint[b-erjovc3et9] {
    font-size: 0.76rem;
    color: #94a3b8;
    margin: 0.65rem 0 0;
    text-align: center;
}

/* ── [Lifecycle A] 거절 보조 버튼 ── */
.invite-decline-btn[b-erjovc3et9] {
    width: 100%;
    margin-top: 0.65rem;
    padding: 0.72rem 1.25rem;
    background: transparent;
    color: #64748b;
    font-family: inherit;
    font-weight: 500;
    font-size: 0.85rem;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    transition: background 0.2s, color 0.2s;
}
.invite-decline-btn:hover:not(:disabled)[b-erjovc3et9] { background: #f8fafc; color: #0f172a; }
.invite-decline-btn:disabled[b-erjovc3et9] { cursor: not-allowed; opacity: 0.6; }

/* ── 하단 Axowl 배지 ── */
.invite-footer-badge[b-erjovc3et9] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f5f9;
    width: 100%;
    justify-content: center;
}
.invite-footer-badge i[b-erjovc3et9] { color: var(--accent); }
.invite-footer-badge strong[b-erjovc3et9] { color: #475569; font-weight: 650; }

/* ── 상태(로딩/성공/에러) 공통 ── */
.invite-state-center[b-erjovc3et9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1rem 0;
}

.invite-icon-wrap[b-erjovc3et9] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    margin-bottom: 1.5rem;
}
.invite-icon-neutral[b-erjovc3et9] { background: var(--ah-bg-subtle, #f1f5f9); color: #64748b; }
.invite-icon-danger[b-erjovc3et9]  { background: var(--ah-danger-bg, #fef2f2); color: var(--ah-danger, #dc2626); }

.invite-state-title[b-erjovc3et9] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.5rem;
    letter-spacing: -0.02em;
}

.invite-state-sub[b-erjovc3et9] {
    font-size: 0.9rem;
    color: #64748b;
    line-height: 1.6;
    margin-bottom: 1.25rem;
    max-width: 340px;
}

.invite-secondary-link[b-erjovc3et9] {
    font-size: 0.85rem;
    color: var(--accent);
    font-weight: 600;
    text-decoration: none;
    margin-top: 0.5rem;
}
.invite-secondary-link:hover[b-erjovc3et9] { text-decoration: underline; }

/* 상태화면 안의 버튼도 아이콘 간격 유지 */
.invite-state-center .invite-accept-btn[b-erjovc3et9] { margin-top: 0.5rem; }

/* ── 정책 리더 모달 ── */
.invite-policy-modal-backdrop[b-erjovc3et9] {
    position: fixed;
    inset: 0;
    z-index: 1080;
    background: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(2px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem;
    --animate-duration: 0.2s;
}

.invite-policy-modal[b-erjovc3et9] {
    width: 100%;
    max-width: 480px;
    max-height: 82vh;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 24px 60px -12px rgba(15, 23, 42, 0.35);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.invite-policy-modal-head[b-erjovc3et9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.35rem;
    border-bottom: 1px solid #eef2f6;
}
.invite-policy-modal-head h3[b-erjovc3et9] {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.invite-policy-modal-close[b-erjovc3et9] {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 8px;
    background: #f1f5f9;
    color: #64748b;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    transition: background 0.15s, color 0.15s;
}
.invite-policy-modal-close:hover[b-erjovc3et9] { background: #e2e8f0; color: #0f172a; }

.invite-policy-modal-body[b-erjovc3et9] {
    padding: 1.25rem 1.35rem;
    overflow-y: auto;
    white-space: pre-wrap;
    font-size: 0.87rem;
    line-height: 1.65;
    color: #334155;
}

.invite-policy-modal-foot[b-erjovc3et9] {
    padding: 1rem 1.35rem 1.25rem;
    border-top: 1px solid #eef2f6;
}
.invite-modal-done[b-erjovc3et9] { box-shadow: none; }

/* ── 모바일 ── */
@media (max-width: 480px) {
    .invite-card[b-erjovc3et9] {
        max-width: 100%;
        padding: 2rem 1.4rem 1.5rem;
        border: none;
        box-shadow: none;
        border-radius: 0;
    }
    .invite-org-logo[b-erjovc3et9],
    .invite-org-logo-img[b-erjovc3et9] { width: 68px; height: 68px; font-size: 1.5rem; }
    .invite-card-title[b-erjovc3et9] { font-size: 1.55rem; }
    .invite-policy-modal[b-erjovc3et9] { max-height: 88vh; }
}
/* /Features/Auth/Pages/Login.razor.rz.scp.css */
/* Login 컨테이너: 카드 형태 디자인 */
/* Login 컨테이너: 흔들림 방지 패치 적용 */
/* Login 컨테이너 */
.login-container[b-erhi5glaxw] {
    width: 100%;
    max-width: 400px;
    background: #ffffff;
    padding: 2.5rem;
    border-radius: 16px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
    border: 1px solid #f1f5f9;
    min-height: 640px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* transition 제거 */
}

.login-header[b-erhi5glaxw] {
    text-align: center;
    margin-bottom: 2rem;
}

.login-header h1[b-erhi5glaxw] {
    font-size: 1.75rem;
    color: #1e293b;
    margin-bottom: 0.5rem;
}

/* 폼 요소 스타일링 */
.form-label[b-erhi5glaxw] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #475569;
}

.form-control[b-erhi5glaxw] {
    padding: 0.75rem 1rem;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    background-color: #f8fafc;
}

.form-control:focus[b-erhi5glaxw] {
    border-color: var(--ah-link);
    box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.1);
}

/* 메인 로그인 버튼 */
.btn-login-action[b-erhi5glaxw] {
    width: 100%;
    padding: 0.85rem;
    background-color: #0f172a;
    color: white;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    margin-top: 1rem;
    transition: all 0.2s;
}

.btn-login-action:hover[b-erhi5glaxw] {
    background-color: #1e293b;
    transform: translateY(-1px);
}

/* 구분선 */
.divider[b-erhi5glaxw] {
    text-align: center;
    margin: 1.5rem 0;
    position: relative;
}

.divider[b-erhi5glaxw]::before {
    content: "";
    position: absolute;
    left: 0; top: 50%;
    width: 100%;
    height: 1px;
    background: #e2e8f0;
}

.divider span[b-erhi5glaxw] {
    background: #fff;
    padding: 0 10px;
    color: #94a3b8;
    font-size: 0.8rem;
    position: relative;
}

/* 👇 [업데이트] 소셜 버튼 공통 스타일 (Google + LINE) 
   두 버튼 모두 같은 스타일을 공유하도록 콤마(,)로 묶었습니다.
*/
.social-btn[b-erhi5glaxw] {
    /* 1. 버튼 뼈대 */
    position: relative;          /* 👈 [필수] 아이콘의 기준점이 됩니다 */
    width: 100%;                 /* 가로 꽉 채움 */
    height: 48px;                /* 높이 고정 (선택사항이지만 추천) */
    
    /* 2. 글자 정렬 (정가운데) */
    display: flex;
    justify-content: center;     /* 글자를 가로 중앙으로 */
    align-items: center;         /* 글자를 세로 중앙으로 */
    
    /* 3. 디자인 */
    background-color: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    color: #475569;
    font-weight: 500;
    margin-bottom: 0.6rem;
    cursor: pointer;
    transition: background-color 0.2s;
}
.social-btn-content[b-erhi5glaxw] {
    display: flex;
    align-items: center;
    justify-content: flex-start; /* 내부에서는 왼쪽 정렬 */
    width: 220px;               /* 👈 [조절] 이 숫자로 전체 뭉텅이의 위치를 잡으세요 */
    gap: 12px;                  /* 아이콘과 글자 사이 간격 */
}
.social-btn:hover[b-erhi5glaxw] {
    background-color: #f8fafc;
}
.social-btn .icon-mono[b-erhi5glaxw] {
    display: block !important;
}
.social-btn .icon-color[b-erhi5glaxw] {
    display: none !important;
}

/* [호버] 흑백은 숨기고, 컬러는 보임(!important) */
.social-btn:hover .icon-mono[b-erhi5glaxw] {
    display: none !important;
}
.social-btn:hover .icon-color[b-erhi5glaxw] {
    display: block !important;
}
.login-footer[b-erhi5glaxw] {
    text-align: center;
    margin-top: 2rem;
}

/* 👇 아이콘 교체 로직 (Google, LINE 공통) */

/* 기본: 컬러 아이콘 숨김 */
.icon-color[b-erhi5glaxw] {
    display: none !important;
}

/* 호버 시: 모노 아이콘 숨김, 컬러 아이콘 표시 */
.btn-social-google:hover .icon-mono[b-erhi5glaxw],
.btn-social-line:hover .icon-mono[b-erhi5glaxw] {
    display: none !important;
}

.btn-social-google:hover .icon-color[b-erhi5glaxw],
.btn-social-line:hover .icon-color[b-erhi5glaxw] {
    display: inline-flex !important;
}

/* 패스키 버튼 호버 효과 (Mono 숨기고 Color 보이기) */
.social-btn:hover .icon-mono[b-erhi5glaxw],
.btn-social-passkey:hover .icon-mono[b-erhi5glaxw] {
    display: none !important;
}

.social-btn:hover .icon-color[b-erhi5glaxw],
.btn-social-passkey:hover .icon-color[b-erhi5glaxw] {
    display: inline-flex !important;
}

/* 5. 되돌아가기 버튼 (404 버튼과 동일한 룩앤필) */
.btn-back-home[b-erhi5glaxw] {
    height: 3.5rem; /* 살짝 높게 */
    background-color: #ffffff;
    border: 1px solid #cbd5e1; /* Slate-300 */
    color: var(--text-main);
    font-weight: 600;
    font-size: 0.95rem;
    border-radius: var(--border-radius);
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-back-home:hover[b-erhi5glaxw] {
    background-color: #f8fafc; /* Slate-50 */
    border-color: #94a3b8; /* Slate-400 */
    color: var(--primary-color); /* 호버 시 브랜드 컬러 포인트 */
    transform: translateY(-1px); /* 살짝 떠오르는 효과 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.btn-back-home:active[b-erhi5glaxw] {
    transform: translateY(0);
}
.social-btn .bi-fingerprint[b-erhi5glaxw] { color: #5F6368; }
.social-btn:hover .bi-fingerprint[b-erhi5glaxw] { color: var(--ah-link); }
@media (max-width: 576px) {
    .login-container[b-erhi5glaxw] {
        box-shadow: none !important;
        border: none !important;
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 0 !important;
        background-color: transparent !important;
        padding: 1rem 1.2rem !important;
    }
    
    .form-control[b-erhi5glaxw] {
        font-size: 16px !important;
    }
}
/* /Features/Auth/Pages/MyDevices.razor.rz.scp.css */
/* MyDevices.razor.css — CSS variable 기반 */
.light-dashboard[b-spl2kum9ij] { width: 100%; margin: 0 auto; padding-bottom: 80px; }

.x-small[b-spl2kum9ij] { font-size: 0.75rem; letter-spacing: 0.02em; color: var(--ah-text-muted); font-weight: 500; }

.metric-card[b-spl2kum9ij] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    padding:       24px;
    box-shadow:    var(--ah-shadow-sm);
    height:        100%;
}

.summary-value[b-spl2kum9ij] { font-size: 1.75rem; font-weight: 800; color: var(--ah-text); letter-spacing: -1px; line-height: 1; }
.summary-label[b-spl2kum9ij] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem; }

.org-header[b-spl2kum9ij] {
    display:          flex;
    align-items:      center;
    justify-content:  space-between;
    padding:          1rem 1.5rem;
    border-bottom:    1px solid var(--ah-border);
    background:       var(--ah-bg-subtle);
    border-radius:    12px 12px 0 0;
}

.org-avatar[b-spl2kum9ij] {
    width:           34px;
    height:          34px;
    border-radius:   8px;
    background:      var(--ah-text);
    color:           var(--ah-bg);
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       0.9rem;
    font-weight:     800;
    flex-shrink:     0;
}

.org-name[b-spl2kum9ij]  { font-weight: 700; color: var(--ah-text); font-size: 0.875rem; }
.seal-id[b-spl2kum9ij]   { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; color: var(--ah-text-muted); }

.membership-badge[b-spl2kum9ij] { font-size: 0.65rem; font-weight: 700; padding: 0.2rem 0.6rem; border-radius: 4px; letter-spacing: 0.02em; }
.role-owner[b-spl2kum9ij]   { background: var(--ah-text);  color: var(--ah-bg); }
.role-admin[b-spl2kum9ij]   { background: var(--ah-accent); color: #fff; }
.role-manager[b-spl2kum9ij] { background: #e0e7ff; color: #4338ca; border: 1px solid #c7d2fe; }
.role-member[b-spl2kum9ij]  { background: var(--ah-bg-surface); color: var(--ah-text-sub); border: 1px solid var(--ah-border); }

.audit-table[b-spl2kum9ij] { width: 100%; border-collapse: separate; border-spacing: 0; margin-bottom: 0; }

.audit-table th[b-spl2kum9ij] {
    font-size:        0.75rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.05em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.85rem 1.5rem;
    text-align:       left;
    white-space:      nowrap;
    vertical-align:   middle;
}

.audit-table td[b-spl2kum9ij] {
    padding:        0.9rem 1.5rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.875rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
    white-space:    nowrap;
}

.audit-table tbody tr:hover[b-spl2kum9ij]        { background-color: var(--ah-bg-subtle); }
.audit-table tbody tr:last-child td[b-spl2kum9ij] { border-bottom: none; }
.current-device-row[b-spl2kum9ij]                { background: var(--ah-success-bg); }
.current-device-row:hover[b-spl2kum9ij]          { background: var(--ah-success-bg) !important; opacity: 0.85; }

.device-name-text[b-spl2kum9ij] { font-weight: 700; color: var(--ah-text); font-size: 0.8rem; display: flex; align-items: center; gap: 0.4rem; }
.current-badge[b-spl2kum9ij]    { font-size: 0.55rem; font-weight: 800; padding: 0.15rem 0.45rem; border-radius: 3px; background: #10b981; color: #fff; }

.hw-badge[b-spl2kum9ij], .hw-pending-badge[b-spl2kum9ij], .ownership-badge[b-spl2kum9ij] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}

.sw-badge[b-spl2kum9ij] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.55rem;
    border-radius: 4px;
    background:    var(--ah-bg-subtle);
    color:         var(--ah-text-muted);
    border:        1px solid var(--ah-border);
}

.status-badge[b-spl2kum9ij]    { font-size: 0.65rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; }
.status-active[b-spl2kum9ij]   { background: var(--ah-success-bg); color: var(--ah-success); border: 1px solid var(--ah-success-border); }
.status-pending[b-spl2kum9ij]  { background: var(--ah-warning-bg); color: var(--ah-warning); border: 1px solid var(--ah-warning-border); }
.status-preset[b-spl2kum9ij]   { background: #f5f3ff; color: #7c3aed; border: 1px solid #ddd6fe; }
.status-blocked[b-spl2kum9ij]  { background: var(--ah-danger-bg);  color: var(--ah-danger);  border: 1px solid var(--ah-danger-border); }
.status-revoked[b-spl2kum9ij]  { background: var(--ah-bg-surface); color: var(--ah-text-muted); border: 1px solid var(--ah-border); }

.device-time[b-spl2kum9ij] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.78rem; font-weight: 600; color: var(--ah-text); }
.geo-ip[b-spl2kum9ij]      { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.7rem; color: var(--ah-text-sub); }
.geo-label[b-spl2kum9ij]   { font-size: 0.65rem; color: var(--ah-text-muted); }

.page-count[b-spl2kum9ij] { font-size: 0.7rem; color: var(--ah-text-muted); padding: 0.75rem 1.5rem; text-align: right; border-top: 1px solid var(--ah-bg-subtle); }
.page-count strong[b-spl2kum9ij] { color: var(--ah-text-sub); }

.btn-detail-outline[b-spl2kum9ij] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    color:         var(--ah-text-sub);
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.45rem 0.9rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    all 0.15s;
    height:        auto;
}
.btn-detail-outline:hover[b-spl2kum9ij]    { background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); color: var(--ah-text); }
.btn-detail-outline:disabled[b-spl2kum9ij] { opacity: 0.5; cursor: not-allowed; }

.action-icon-btn[b-spl2kum9ij] {
    background:      none;
    border:          1px solid var(--ah-border);
    width:           28px;
    height:          28px;
    border-radius:   6px;
    font-size:       0.8rem;
    color:           var(--ah-text-muted);
    cursor:          pointer;
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    transition:      all 0.12s;
    padding:         0;
}
.action-icon-btn:hover[b-spl2kum9ij]        { background: var(--ah-bg-surface); border-color: var(--ah-text-muted); color: var(--ah-text); }
.action-icon-btn.danger[b-spl2kum9ij]       { color: var(--ah-danger); border-color: var(--ah-danger-border); }
.action-icon-btn.danger:hover[b-spl2kum9ij] { background: var(--ah-danger-bg); }

.kebab-wrapper[b-spl2kum9ij] { position: relative; display: inline-block; }
.kebab-btn[b-spl2kum9ij] {
    background: none; border: 1px solid transparent;
    font-size: 1.2rem; letter-spacing: 2px;
    color: var(--ah-text-muted); cursor: pointer;
    padding: 0.2rem 0.5rem; border-radius: 6px; transition: all 0.15s; line-height: 1;
}
.kebab-btn:hover[b-spl2kum9ij] { background: var(--ah-bg-surface); color: var(--ah-text-sub); border-color: var(--ah-border); }

.kebab-menu[b-spl2kum9ij] {
    position: absolute; right: 0; top: 100%; margin-top: 4px;
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 8px; box-shadow: var(--ah-shadow-md);
    min-width: 150px; z-index: 50; padding: 4px;
}
.kebab-item[b-spl2kum9ij] { display: block; width: 100%; text-align: left; padding: 0.5rem 0.75rem; font-size: 0.8rem; font-weight: 600; color: var(--ah-text); background: none; border: none; border-radius: 6px; cursor: pointer; transition: background 0.1s; }
.kebab-item:hover[b-spl2kum9ij]        { background: var(--ah-bg-subtle); }
.kebab-item.danger[b-spl2kum9ij]       { color: var(--ah-danger); }
.kebab-item.danger:hover[b-spl2kum9ij] { background: var(--ah-danger-bg); }

.modal-backdrop[b-spl2kum9ij] {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.45); z-index: 1000;
    display: flex; align-items: center; justify-content: center;
}
.modal-panel[b-spl2kum9ij] {
    background: var(--ah-bg); border-radius: 12px;
    box-shadow: var(--ah-shadow-lg); padding: 2rem;
    width: 100%; max-width: 440px;
}
.modal-title[b-spl2kum9ij] { font-size: 1.05rem; font-weight: 700; color: var(--ah-text); margin-bottom: 0.25rem; }
.modal-desc[b-spl2kum9ij]  { font-size: 0.82rem; color: var(--ah-text-sub); margin-bottom: 1.5rem; line-height: 1.5; }
.modal-actions[b-spl2kum9ij] { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1.5rem; }

.modal-field[b-spl2kum9ij] { margin-bottom: 1rem; }
.modal-label[b-spl2kum9ij] { font-size: 0.78rem; font-weight: 600; color: var(--ah-text-sub); display: block; margin-bottom: 0.3rem; }

.modal-input[b-spl2kum9ij], .modal-select[b-spl2kum9ij] {
    width: 100%; padding: 0.6rem 0.75rem; height: 38px;
    font-size: 0.82rem; border: 1px solid var(--ah-border);
    border-radius: 6px; outline: none;
    background: var(--ah-bg); color: var(--ah-text);
    box-sizing: border-box; transition: border-color 0.15s;
}
.modal-input:focus[b-spl2kum9ij], .modal-select:focus[b-spl2kum9ij] { border-color: var(--ah-text-muted); }

.btn-modal-primary[b-spl2kum9ij] {
    padding: 0.45rem 1rem; font-size: 0.82rem; font-weight: 600;
    border: none; background: var(--ah-text); color: var(--ah-bg);
    border-radius: 6px; cursor: pointer; transition: opacity 0.15s;
}
.btn-modal-primary:hover[b-spl2kum9ij]    { opacity: 0.85; }
.btn-modal-primary:disabled[b-spl2kum9ij] { opacity: 0.5; cursor: not-allowed; }

.btn-modal-danger[b-spl2kum9ij] {
    padding: 0.45rem 1rem; font-size: 0.82rem; font-weight: 600;
    border: none; background: var(--ah-danger); color: #fff;
    border-radius: 6px; cursor: pointer; transition: opacity 0.15s;
}
.btn-modal-danger:hover[b-spl2kum9ij]    { opacity: 0.85; }
.btn-modal-danger:disabled[b-spl2kum9ij] { opacity: 0.5; cursor: not-allowed; }
/* /Features/Auth/Pages/Verify.razor.rz.scp.css */

/* 1. 화면 전체 컨테이너 */
.verify-page[b-2gl2485zk9] {
    height: 100vh;
    width: 100%;
    background-color: #0a0a0a;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

/* 2. 공통 텍스트 스타일 */
.verify-title[b-2gl2485zk9] {
    font-size: 1.5rem;
    font-weight: 700;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
    color: #f1f5f9;
    letter-spacing: -0.02em;
}

.verify-desc[b-2gl2485zk9] {
    font-size: 0.95rem;
    color: #94a3b8;
    margin-bottom: 0;
}

/* 3. 로딩 스피너 (브랜드 컬러 적용) */
.custom-spinner[b-2gl2485zk9] {
    width: 3.5rem;
    height: 3.5rem;
    border-width: 3px;
    color: var(--primary-color, #635bff); /* 브랜드 컬러 */
}

/* 4. 실패 화면 버튼 */
.btn-retry[b-2gl2485zk9] {
    margin-top: 2rem;
    background: transparent;
    border: 1px solid #334155;
    padding: 0.8rem 2rem;
    border-radius: 50px;
    color: #94a3b8;
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s ease;
    cursor: pointer;
}

.btn-retry:hover[b-2gl2485zk9] {
    border-color: var(--ah-link);
    color: #f1f5f9;
    background-color: rgba(99,91,255,0.1);
}

/* 5. 아이콘 크기 */
.status-icon[b-2gl2485zk9] {
    font-size: 3.5rem;
    line-height: 1;
}

/* 4. 알약 모양 버튼 (Verify 페이지와 통일) */
.btn-back-pill[b-2gl2485zk9] {
    background: transparent;
    border: 1px solid #e2e8f0;
    padding: 0.8rem 1.5rem;
    border-radius: 50px; /* 둥근 알약 모양 */
    color: var(--text-sub, #64748b);
    font-size: 0.9rem;
    font-weight: 500;
    transition: all 0.2s ease;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto; /* 꽉 차지 않게 */
}

.btn-back-pill:hover[b-2gl2485zk9] {
    border-color: var(--text-main, #1e293b);
    color: var(--text-main, #1e293b);
    background-color: #f8fafc;
    transform: translateY(-1px);
}
/* /Features/Dashboard/Pages/AppDashboard.razor.rz.scp.css */
/* AppDashboard — page-specific only.
   Common classes are in ah-components.css */

/* [2026-08-05] .page-title/.page-desc 는 세 파일에 똑같이 복붙돼 있던 두 번째 정본.
   <PageHeader> + ah-components.css §27 (.ah-page-*) 로 통합하며 제거. */

/* ── Info box ── */
.info-box[b-tjl58yzeaz] {
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: 10px; padding: 1.25rem 1.4rem; margin-bottom: 1.5rem;
}
.info-box-title[b-tjl58yzeaz] { font-size: 0.75rem; font-weight: 700; color: var(--ah-text); margin-bottom: 0.5rem; }
.info-box-body[b-tjl58yzeaz]  { font-size: 0.78rem; color: var(--ah-text-muted); line-height: 1.65; }

/* ── Stats ── */
.stats-row[b-tjl58yzeaz] { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.stat-card[b-tjl58yzeaz] {
    flex: 1; background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: 10px; padding: 1.1rem 1.25rem; box-shadow: var(--ah-shadow-sm);
}
.stat-label[b-tjl58yzeaz] { font-size: 0.6rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.stat-value[b-tjl58yzeaz] { font-size: 1.4rem; font-weight: 800; color: var(--ah-text); letter-spacing: -0.5px; margin-top: 0.15rem; }
.stat-sub[b-tjl58yzeaz]   { font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.1rem; }

/* ── Groups header ── */
.groups-header[b-tjl58yzeaz] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1rem; }
.table-title[b-tjl58yzeaz]   { font-size: 0.85rem; font-weight: 700; color: var(--ah-text); }

/* ── App cards ── */
.app-card[b-tjl58yzeaz] {
    background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg); padding: 1.5rem;
    box-shadow: var(--ah-shadow-sm); transition: box-shadow 0.15s, border-color 0.15s;
    cursor: pointer; height: 100%; display: flex; flex-direction: column;
}
.app-card:hover[b-tjl58yzeaz] { box-shadow: var(--ah-shadow-md); border-color: var(--ah-border); }

.app-icon[b-tjl58yzeaz] {
    width: 40px; height: 40px; border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.1rem; font-weight: 700; color: #ffffff; flex-shrink: 0;
}
.app-name[b-tjl58yzeaz]       { font-weight: 700; color: var(--ah-text); font-size: 0.95rem; }
.app-desc[b-tjl58yzeaz]       { font-size: 0.7rem; color: var(--ah-text-muted); margin-top: 0.1rem; }
.app-stat[b-tjl58yzeaz]       { font-size: 0.75rem; color: var(--ah-text-muted); }
.app-stat-value[b-tjl58yzeaz] { font-weight: 700; color: var(--ah-text-sub); }

/* ── Type badges ── */
.type-badge[b-tjl58yzeaz]   { font-size: 0.6rem; font-weight: 700; padding: 0.12rem 0.4rem; border-radius: 3px; }
.type-web[b-tjl58yzeaz]     { background: #eff6ff; color: #1d4ed8; }
.type-mobile[b-tjl58yzeaz]  { background: #ecfdf5; color: #065f46; }
.type-m2m[b-tjl58yzeaz]     { background: var(--ah-bg-subtle); color: var(--ah-text-sub); border: 1px solid var(--ah-border); }
.type-api[b-tjl58yzeaz]     { background: #f5f3ff; color: #5b21b6; }
.type-micro[b-tjl58yzeaz]   { background: #fff7ed; color: #9a3412; }
/* [Custom Admin] 로그인 표면이 아닌 유일한 client type — 다른 배지와 확실히 구별되게 slate. */
.type-admin[b-tjl58yzeaz]   { background: #f1f5f9; color: #334155; border: 1px solid #cbd5e1; }
.type-more[b-tjl58yzeaz]    { background: var(--ah-bg-surface); color: var(--ah-text-muted); }

/* ── Environment badges ── */
.env-badge[b-tjl58yzeaz]   { font-size: 0.6rem; font-weight: 700; padding: 0.12rem 0.45rem; border-radius: 3px; }
.env-prod[b-tjl58yzeaz]    { background: #f0fdf4; color: #166534; }
.env-staging[b-tjl58yzeaz] { background: #fff7ed; color: #9a3412; }
.env-testing[b-tjl58yzeaz] { background: #f0f9ff; color: #075985; }
.env-dev[b-tjl58yzeaz]     { background: #f5f3ff; color: #5b21b6; }

/* ── Add card ── */
.add-app-card[b-tjl58yzeaz] {
    background: var(--ah-bg); border: 2px dashed var(--ah-border);
    border-radius: var(--ah-radius-lg); padding: 1.5rem;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    cursor: pointer; height: 100%; min-height: 160px;
    transition: border-color 0.15s, background-color 0.15s;
}
.add-app-card:hover[b-tjl58yzeaz] { border-color: var(--ah-link); background-color: #fafafe; }
.add-app-icon[b-tjl58yzeaz] {
    width: 40px; height: 40px; border-radius: 50%;
    background: var(--ah-bg-surface); color: var(--ah-text-sub);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.25rem; transition: background-color 0.15s, color 0.15s;
}
.add-app-card:hover .add-app-icon[b-tjl58yzeaz] { background-color: #eef2ff; color: var(--ah-link); }

/* ── Buttons ── */
.btn-create[b-tjl58yzeaz] {
    font-size: 0.75rem; font-weight: 700; color: var(--ah-accent-text);
    background: var(--ah-accent); border: 1px solid var(--ah-accent);
    padding: 0.4rem 1.1rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: opacity 0.15s;
    display: inline-flex; align-items: center; gap: 0.3rem;
}
.btn-create:hover[b-tjl58yzeaz] { opacity: 0.85; }

.btn-refresh[b-tjl58yzeaz] {
    font-size: 0.75rem; font-weight: 600; color: var(--ah-text-sub);
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    padding: 0.4rem 1rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: all 0.15s;
    display: inline-flex; align-items: center; gap: 0.3rem;
}
.btn-refresh:hover[b-tjl58yzeaz] { background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); }

/* ── Error bar ── */
.error-bar[b-tjl58yzeaz] {
    background: var(--ah-danger-bg); border: 1px solid var(--ah-danger-border);
    border-radius: var(--ah-radius-md); padding: 0.6rem 0.9rem;
    font-size: 0.78rem; color: var(--ah-danger); margin-bottom: 1rem;
}

/* ── Client list ── */
.client-list[b-tjl58yzeaz]      { display: flex; flex-direction: column; gap: 0.25rem; }
.client-list-item[b-tjl58yzeaz] { display: flex; align-items: center; gap: 0.35rem; font-size: 0.75rem; }
.client-list-type[b-tjl58yzeaz] { font-weight: 600; color: var(--ah-text-sub); }
.client-list-sep[b-tjl58yzeaz]  { color: var(--ah-text-muted); }

/* ── Radio group ── */
.radio-group[b-tjl58yzeaz] { display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem; }
.radio-option[b-tjl58yzeaz] {
    display: flex; align-items: center; gap: 0.6rem;
    font-size: 0.82rem; font-weight: 500; color: var(--ah-text-sub);
    padding: 0.6rem 0.85rem; border-radius: var(--ah-radius-md);
    border: 1px solid var(--ah-border); cursor: pointer; transition: all 0.15s;
}
.radio-option.selected[b-tjl58yzeaz] { border-color: var(--ah-link); background: #f5f3ff; color: #3730a3; }

.radio-dot[b-tjl58yzeaz] {
    width: 14px; height: 14px; border-radius: 50%;
    border: 2px solid var(--ah-text-muted); flex-shrink: 0; transition: all 0.15s;
}
.radio-dot.on[b-tjl58yzeaz] { border-color: var(--ah-link); background: var(--ah-accent); box-shadow: inset 0 0 0 3px var(--ah-bg); }

/* ── Add DB (2026-07-28) ── */
/* 카드에서 눈에 띄어야 하는 유일한 행동이다 — muted 회색은 배경에 묻혔다.
   색을 박지 않고 text/bg 를 뒤집는 이유: 다크 테마에서 검정 버튼은 다시 안 보인다. */
.btn-add-db[b-tjl58yzeaz] {
    display: inline-flex; align-items: center; gap: 0.25rem;
    font-size: 0.7rem; font-weight: 600; font-family: inherit;
    color: var(--ah-bg); background: var(--ah-text);
    border: 1px solid var(--ah-text); border-radius: 5px;
    padding: 0.25rem 0.55rem; cursor: pointer;
    transition: opacity 0.15s;
}
.btn-add-db:hover[b-tjl58yzeaz] { opacity: 0.82; }

.db-or-divider[b-tjl58yzeaz] {
    display: flex; align-items: center; gap: 0.6rem;
    margin: 0.15rem 0 0.75rem;
    font-size: 0.68rem; font-weight: 600; letter-spacing: 0.04em;
    text-transform: uppercase; color: var(--ah-text-muted);
}
.db-or-divider[b-tjl58yzeaz]::before, .db-or-divider[b-tjl58yzeaz]::after {
    content: ""; flex: 1; height: 1px; background: var(--ah-border);
}

.db-ssl[b-tjl58yzeaz] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    font-size: 0.78rem; color: var(--ah-text-sub); cursor: pointer;
}
.db-ssl input[b-tjl58yzeaz] { accent-color: var(--ah-link); }

.db-note[b-tjl58yzeaz] {
    font-size: 0.72rem; color: var(--ah-text-muted); line-height: 1.6;
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: 6px; padding: 0.6rem 0.75rem; margin-bottom: 0.75rem;
}

.db-test[b-tjl58yzeaz] {
    font-size: 0.75rem; line-height: 1.55; border-radius: 6px;
    padding: 0.55rem 0.75rem; margin-bottom: 0.75rem; word-break: break-word;
}
.db-test.ok[b-tjl58yzeaz]   { color: #065f46; background: #ecfdf5; border: 1px solid #6ee7b7; }
.db-test.fail[b-tjl58yzeaz] { color: #991b1b; background: #fef2f2; border: 1px solid #fecaca; }

.btn-test-conn[b-tjl58yzeaz] {
    font-size: 0.78rem; font-weight: 600; font-family: inherit;
    color: var(--ah-text-sub); background: var(--ah-bg);
    border: 1px solid var(--ah-border); border-radius: 6px;
    padding: 0.5rem 1rem; cursor: pointer; transition: border-color 0.15s;
}
.btn-test-conn:hover[b-tjl58yzeaz] { border-color: var(--ah-text-muted); }
.btn-test-conn:disabled[b-tjl58yzeaz] { opacity: 0.5; cursor: default; }

.btn-parse-cs[b-tjl58yzeaz] {
    margin-left: 0.4rem; font-size: 0.68rem; font-weight: 600; font-family: inherit;
    color: var(--ah-link); background: none; border: none; padding: 0; cursor: pointer;
    text-decoration: underline;
}

/* 연결되면 버튼이 상태가 된다 */
.btn-db-state[b-tjl58yzeaz] {
    display: inline-flex; align-items: center; gap: 0.35rem;
    font-size: 0.7rem; font-weight: 600; font-family: inherit;
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 5px; padding: 0.25rem 0.55rem; cursor: pointer;
    transition: border-color 0.15s;
}
.btn-db-state.ok[b-tjl58yzeaz] { color: #047857; border-color: #a7f3d0; background: #ecfdf5; }
.btn-db-state.fail[b-tjl58yzeaz] { color: #b91c1c; border-color: #fecaca; background: #fef2f2; }
.btn-db-state:hover[b-tjl58yzeaz] { filter: brightness(0.97); }
.db-dot[b-tjl58yzeaz] { width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex-shrink: 0; }
.db-count[b-tjl58yzeaz] {
    font-size: 0.62rem; font-weight: 700; opacity: 0.75;
    border-left: 1px solid currentColor; padding-left: 0.35rem; margin-left: 0.15rem;
}
/* /Features/Dashboard/Pages/Dashboard.razor.rz.scp.css */
/* ==========================================================================
   Axowl Dashboard — Dashboard.razor.css
   Scoped to .ah-dashboard, dark mode via [data-theme="dark"]
   ========================================================================== */

   .ah-dashboard[b-x1r61cmrpl] {
    width: 100%;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
}

/* ── Header ───────────────────────────────────────────────────────────── */
/* [2026-08-05] 페이지 머리(.ah-db-header/-title/-subtitle)는 여기서 걷어내고
   ah-components.css §27 (.ah-page-*) + <PageHeader> 로 옮겼다. 이 화면이 그
   기준이었으므로 값은 그대로다. */

/* Live badge */
.ah-live-badge[b-x1r61cmrpl] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
    background: var(--ah-bg-subtle);
    color: var(--ah-text-muted);
    border: 1px solid var(--ah-border);
}

.ah-live-badge.live[b-x1r61cmrpl] {
    background: var(--ah-success-bg);
    color: var(--ah-success);
    border-color: var(--ah-success-border);
}

.ah-live-dot[b-x1r61cmrpl] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

.ah-live-badge.live .ah-live-dot[b-x1r61cmrpl] {
    animation: ah-pulse-b-x1r61cmrpl 2s infinite;
}

@keyframes ah-pulse-b-x1r61cmrpl {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.4; }
}

.ah-db-range-select[b-x1r61cmrpl] {
    font-size: 0.72rem;
    padding: 5px 10px;
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius);
    background: var(--ah-bg);
    color: var(--ah-text-sub);
    cursor: pointer;
    outline: none;
}

/* ── Tabs ─────────────────────────────────────────────────────────────── */
/* [2026-07-09] navy pill 탭 통일 (밑줄 → 흰 pill + navy 활성, member-tab/ra-filter 와 동일). */
.ah-db-tabs[b-x1r61cmrpl] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 1.25rem;
    overflow-x: auto;
    scrollbar-width: none;
}
.ah-db-tabs[b-x1r61cmrpl]::-webkit-scrollbar { display: none; }

.ah-db-tab[b-x1r61cmrpl] {
    padding: 0.4rem 0.9rem;
    font-size: 0.84rem;
    font-weight: 600;
    background: #fff;
    border: 1px solid #e2e8f0;
    color: #64748b;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.12s ease;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ah-db-tab:hover[b-x1r61cmrpl]  { border-color: #cbd5e1; color: #334155; }
.ah-db-tab.active[b-x1r61cmrpl] { background: #0f172a; border-color: #0f172a; color: #fff; }

.ah-db-tab-badge[b-x1r61cmrpl] {
    font-size: 0.6rem;
    font-weight: 700;
    background: var(--ah-link);
    color: #fff;
    padding: 1px 6px;
    border-radius: 10px;
}
[data-theme="dark"] .ah-db-tab-badge[b-x1r61cmrpl] {
    background: #eac4ff;
    color: #1a1a1a;
}

/* ── Metric Cards ─────────────────────────────────────────────────────── */
.ah-db-metrics[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 1.25rem;
}

@media (max-width: 768px) {
    .ah-db-metrics[b-x1r61cmrpl] { grid-template-columns: repeat(2, 1fr); }
}

.ah-metric-card[b-x1r61cmrpl] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-lg);
    padding: 1.25rem 1rem;
    min-height: 100px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.ah-metric-label[b-x1r61cmrpl] {
    margin: 0 0 5px;
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.ah-metric-value[b-x1r61cmrpl] {
    margin: 0;
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--ah-text);
    letter-spacing: -0.5px;
    line-height: 1.1;
}

.ah-metric-sub[b-x1r61cmrpl] {
    margin: 4px 0 0;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
}

.ah-metric-sub.ah-sub-up[b-x1r61cmrpl]    { color: var(--ah-success); }
.ah-metric-sub.ah-sub-danger[b-x1r61cmrpl] { color: var(--ah-danger); }

.ah-value-danger[b-x1r61cmrpl] { color: var(--ah-danger) !important; }
.ah-value-info[b-x1r61cmrpl]   { color: #3b82f6 !important; }

/* ── Card ─────────────────────────────────────────────────────────────── */
.ah-db-card[b-x1r61cmrpl] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-lg);
    padding: 1rem;
    margin-bottom: 12px;
}

.ah-db-card-header[b-x1r61cmrpl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    flex-wrap: wrap;
    gap: 8px;
}

.ah-db-card-title[b-x1r61cmrpl] {
    margin: 0;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--ah-text);
    display: flex;
    align-items: center;
    gap: 6px;
}

.ah-db-card-desc[b-x1r61cmrpl] {
    margin: 3px 0 0;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
}

/* ── Grids ────────────────────────────────────────────────────────────── */
.ah-db-grid-2-1[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

.ah-db-grid-3-2[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 3fr 2fr;
    gap: 12px;
    margin-bottom: 12px;
}

@media (max-width: 768px) {
    .ah-db-grid-2-1[b-x1r61cmrpl],
    .ah-db-grid-3-2[b-x1r61cmrpl] { grid-template-columns: 1fr; }
}

/* ── Chart ────────────────────────────────────────────────────────────── */
.ah-chart-wrap[b-x1r61cmrpl] {
    position: relative;
    width: 100%;
}

.ah-chart-legend[b-x1r61cmrpl] {
    display: flex;
    gap: 12px;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
}

.ah-legend-dot[b-x1r61cmrpl] {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    margin-right: 4px;
}

/* ── Alerts ───────────────────────────────────────────────────────────── */
.ah-alert-badge[b-x1r61cmrpl] {
    font-size: 0.6rem;
    font-weight: 700;
    background: var(--ah-danger-bg);
    color: var(--ah-danger);
    padding: 2px 7px;
    border-radius: 10px;
    border: 1px solid var(--ah-danger-border);
}

.ah-alerts-list[b-x1r61cmrpl] { display: flex; flex-direction: column; gap: 7px; }

.ah-alert-item[b-x1r61cmrpl] {
    padding: 9px;
    border-radius: var(--ah-radius-md);
}

.ah-alert-item.ah-alert-danger[b-x1r61cmrpl]  { background: var(--ah-danger-bg);  border: 1px solid var(--ah-danger-border); }
.ah-alert-item.ah-alert-warning[b-x1r61cmrpl] { background: var(--ah-warning-bg); border: 1px solid var(--ah-warning-border); }
.ah-alert-item.ah-alert-success[b-x1r61cmrpl] { background: var(--ah-success-bg); border: 1px solid var(--ah-success-border); }

.ah-alert-title[b-x1r61cmrpl] {
    margin: 0 0 2px;
    font-size: 0.72rem;
    font-weight: 600;
}

.ah-alert-item.ah-alert-danger  .ah-alert-title[b-x1r61cmrpl] { color: var(--ah-danger); }
.ah-alert-item.ah-alert-warning .ah-alert-title[b-x1r61cmrpl] { color: var(--ah-warning); }
.ah-alert-item.ah-alert-success .ah-alert-title[b-x1r61cmrpl] { color: var(--ah-success); }

.ah-alert-desc[b-x1r61cmrpl] {
    margin: 0;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
}

/* ── Event Table (Identity) ───────────────────────────────────────────── */
.ah-db-filters[b-x1r61cmrpl] {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    align-items: center;
}

.ah-filter-select[b-x1r61cmrpl] {
    font-size: 0.68rem;
    padding: 4px 8px;
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius);
    background: var(--ah-bg-subtle);
    color: var(--ah-text-sub);
    outline: none;
}

.ah-filter-input[b-x1r61cmrpl] {
    font-size: 0.68rem;
    padding: 4px 10px;
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius);
    background: var(--ah-bg);
    color: var(--ah-text);
    width: 160px;
    outline: none;
}

.ah-filter-input[b-x1r61cmrpl]::placeholder { color: var(--ah-text-placeholder); }
.ah-filter-input:focus[b-x1r61cmrpl] { border-color: var(--ah-focus-color); }

.ah-event-table[b-x1r61cmrpl] { overflow-x: auto; }

.ah-event-table-head[b-x1r61cmrpl],
.ah-custom-table-head[b-x1r61cmrpl] {
    display: grid;
    padding: 6px 8px;
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--ah-border-soft);
}

.ah-event-table-head[b-x1r61cmrpl] { grid-template-columns: 80px 1fr 120px 110px 100px 70px; gap: 8px; }
.ah-custom-table-head[b-x1r61cmrpl] { grid-template-columns: 200px 1fr 90px 80px; gap: 8px; }
.ah-session-table-head[b-x1r61cmrpl] { grid-template-columns: 1fr 1fr 90px 110px 80px 70px; gap: 8px; display: grid; padding: 6px 8px; font-size: 0.62rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; border-bottom: 1px solid var(--ah-border-soft); }

.ah-event-table-row[b-x1r61cmrpl],
.ah-custom-table-row[b-x1r61cmrpl] {
    display: grid;
    padding: 7px 8px;
    border-bottom: 1px solid var(--ah-border-soft);
    font-size: 0.72rem;
    align-items: center;
}

.ah-event-table-row[b-x1r61cmrpl]  { grid-template-columns: 80px 1fr 120px 110px 100px 70px; gap: 8px; }
.ah-custom-table-row[b-x1r61cmrpl] { grid-template-columns: 200px 1fr 90px 80px; gap: 8px; }

.ah-event-table-row:last-child[b-x1r61cmrpl],
.ah-custom-table-row:last-child[b-x1r61cmrpl] { border-bottom: none; }

.ah-event-type[b-x1r61cmrpl] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--ah-text);
    font-size: 0.72rem;
}

.ah-event-dot[b-x1r61cmrpl] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    flex-shrink: 0;
}

.ah-cell-sub[b-x1r61cmrpl]   { color: var(--ah-text-sub);   font-size: 0.72rem; }
.ah-cell-muted[b-x1r61cmrpl] { color: var(--ah-text-muted); font-size: 0.68rem; }
.ah-cell-mono[b-x1r61cmrpl]  { color: var(--ah-text-muted); font-size: 0.68rem; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; }

.ah-table-footer[b-x1r61cmrpl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0 0;
    border-top: 1px solid var(--ah-border-soft);
    margin-top: 4px;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
}

.ah-pagination[b-x1r61cmrpl] { display: flex; gap: 4px; }

/* ── User Table ───────────────────────────────────────────────────────── */
.ah-user-table[b-x1r61cmrpl] { overflow-x: auto; }

.ah-user-table-head[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 90px 100px 90px 80px 80px;
    gap: 8px;
    padding: 6px 8px;
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--ah-border-soft);
}

.ah-user-table-row[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 90px 100px 90px 80px 80px;
    gap: 8px;
    padding: 7px 8px;
    border-bottom: 1px solid var(--ah-border-soft);
    font-size: 0.72rem;
    align-items: center;
}

.ah-user-table-row:last-child[b-x1r61cmrpl] { border-bottom: none; }

/* ── App bars ─────────────────────────────────────────────────────────── */
.ah-app-bars[b-x1r61cmrpl] { display: flex; flex-direction: column; gap: 10px; }

.ah-app-bar-row[b-x1r61cmrpl] { display: flex; flex-direction: column; gap: 4px; }

.ah-app-bar-header[b-x1r61cmrpl] {
    display: flex;
    justify-content: space-between;
    font-size: 0.7rem;
    color: var(--ah-text-sub);
    font-weight: 500;
}

.ah-app-bar-track[b-x1r61cmrpl] {
    height: 5px;
    background: var(--ah-bg-subtle);
    border-radius: 3px;
    overflow: hidden;
}

.ah-app-bar-fill[b-x1r61cmrpl] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.4s ease;
}

.ah-provider-badges[b-x1r61cmrpl] {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px solid var(--ah-border-soft);
}

.ah-provider-badge[b-x1r61cmrpl] {
    font-size: 0.68rem;
    background: var(--ah-bg-subtle);
    padding: 3px 8px;
    border-radius: var(--ah-radius);
    color: var(--ah-text-sub);
    border: 1px solid var(--ah-border);
}

/* ── Badges ───────────────────────────────────────────────────────────── */
.ah-badge-success[b-x1r61cmrpl] {
    font-size: 0.62rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--ah-success-bg);
    color: var(--ah-success);
    border: 1px solid var(--ah-success-border);
    white-space: nowrap;
}

.ah-badge-danger[b-x1r61cmrpl] {
    font-size: 0.62rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--ah-danger-bg);
    color: var(--ah-danger);
    border: 1px solid var(--ah-danger-border);
    white-space: nowrap;
}

.ah-badge-info[b-x1r61cmrpl] {
    font-size: 0.62rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 10px;
    background: var(--ah-info-bg);
    color: var(--ah-info);
    border: 1px solid var(--ah-info-border);
    white-space: nowrap;
}

/* ── Custom Event Types ───────────────────────────────────────────────── */
.ah-event-types-list[b-x1r61cmrpl] { display: flex; flex-direction: column; gap: 8px; }

.ah-event-type-row[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    gap: 12px;
    align-items: center;
    padding: 12px;
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    transition: background 0.15s;
}

.ah-event-type-row:hover[b-x1r61cmrpl] { background: var(--ah-bg-subtle); }

.ah-event-type-name[b-x1r61cmrpl] {
    margin: 0 0 3px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ah-text);
}

.ah-event-type-desc[b-x1r61cmrpl] {
    margin: 0;
    font-size: 0.68rem;
    color: var(--ah-text-muted);
}

.ah-mode-badge[b-x1r61cmrpl] {
    font-size: 0.68rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 10px;
    white-space: nowrap;
}

.ah-mode-iron[b-x1r61cmrpl] {
    background: var(--ah-info-bg);
    color: #1d4ed8;
    border: 1px solid var(--ah-info-border);
}

.ah-mode-standard[b-x1r61cmrpl] {
    background: var(--ah-warning-bg);
    color: #a16207;
    border: 1px solid var(--ah-warning-border);
}

/* ── Source legend ────────────────────────────────────────────────────── */
.ah-source-legend[b-x1r61cmrpl] { display: flex; flex-direction: column; gap: 5px; }

.ah-source-row[b-x1r61cmrpl] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.7rem;
    color: var(--ah-text-sub);
}

/* ── 1:1 grid ────────────────────────────────────────────────────────── */
.ah-db-grid-1-1[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

/* ── Section header ──────────────────────────────────────────────────── */
.ah-db-section-header[b-x1r61cmrpl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--ah-border-soft);
}

.ah-db-section-title[b-x1r61cmrpl] {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ah-text);
    letter-spacing: -0.2px;
}

/* ── Campaign table ──────────────────────────────────────────────────── */
.ah-campaign-table-head[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 120px 60px 60px;
    gap: 8px;
    padding: 6px 8px;
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--ah-border-soft);
}

.ah-campaign-table-row[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 120px 60px 60px;
    gap: 8px;
    padding: 8px;
    border-bottom: 1px solid var(--ah-border-soft);
    font-size: 0.72rem;
    align-items: center;
}

.ah-campaign-table-row:last-child[b-x1r61cmrpl] { border-bottom: none; }

/* ── 3-column grid ───────────────────────────────────────────────────── */
.ah-db-grid-3[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 12px;
    margin-bottom: 12px;
}

/* ── Recent events table (5 col) ─────────────────────────────────────── */
.ah-recent-table-head[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 80px 1fr 1.5fr 110px 70px;
    gap: 8px;
    padding: 6px 8px;
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    border-bottom: 1px solid var(--ah-border-soft);
}

.ah-recent-table-row[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 80px 1fr 1.5fr 110px 70px;
    gap: 8px;
    padding: 7px 8px;
    border-bottom: 1px solid var(--ah-border-soft);
    font-size: 0.72rem;
    align-items: center;
}

.ah-recent-table-row:last-child[b-x1r61cmrpl] { border-bottom: none; }

/* ── Session forensics ───────────────────────────────────────────────── */
.ah-forensic-search[b-x1r61cmrpl] {
    width: 100%;
    padding: 10px 14px;
    font-size: 0.85rem;
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    background: var(--ah-bg);
    color: var(--ah-text);
    outline: none;
}

.ah-forensic-search:focus[b-x1r61cmrpl] { border-color: var(--ah-focus-color); box-shadow: 0 0 0 2px rgba(99,102,241,0.12); }
.ah-forensic-search[b-x1r61cmrpl]::placeholder { color: var(--ah-text-placeholder); }
.ah-forensic-search:disabled[b-x1r61cmrpl] { background: var(--ah-bg-subtle); color: var(--ah-text-muted); cursor: not-allowed; }

.ah-forensic-label[b-x1r61cmrpl] {
    display: block;
    margin-bottom: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--ah-text-muted);
}

.ah-forensic-avatar[b-x1r61cmrpl] {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border);
}

.ah-session-table-row[b-x1r61cmrpl] {
    display: grid;
    grid-template-columns: 1fr 1fr 90px 110px 80px 70px;
    gap: 8px;
    padding: 7px 8px;
    border-bottom: 1px solid var(--ah-border-soft);
    font-size: 0.72rem;
    align-items: center;
}

.ah-session-table-row:last-child[b-x1r61cmrpl] { border-bottom: none; }

/* ── Referrer list ────────────────────────────────────────────────────── */
.ah-referrer-list[b-x1r61cmrpl] { display: flex; flex-direction: column; gap: 8px; }

.ah-referrer-row[b-x1r61cmrpl] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.72rem;
}

.ah-referrer-source[b-x1r61cmrpl] {
    min-width: 110px;
    color: var(--ah-text);
    font-weight: 500;
    font-size: 0.7rem;
}

.ah-referrer-bar-track[b-x1r61cmrpl] {
    flex: 1;
    height: 6px;
    background: var(--ah-bg-subtle);
    border-radius: 3px;
    overflow: hidden;
}

.ah-referrer-bar-fill[b-x1r61cmrpl] {
    height: 100%;
    border-radius: 3px;
    transition: width 0.4s ease;
}

/* ── Category Badges ──────────────────────────────────────────────────── */
.ah-category-badge[b-x1r61cmrpl] {
    font-size: 0.6rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    white-space: nowrap;
}

.ah-cat-auth[b-x1r61cmrpl]       { background: #eef2ff; color: #4338ca; border: 1px solid #c7d2fe; }
.ah-cat-org[b-x1r61cmrpl]        { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; }
.ah-cat-permission[b-x1r61cmrpl] { background: #fffbeb; color: #a16207; border: 1px solid #fde68a; }
.ah-cat-device[b-x1r61cmrpl]     { background: #f0f9ff; color: #0369a1; border: 1px solid #bae6fd; }
.ah-cat-security[b-x1r61cmrpl]   { background: var(--ah-danger-bg); color: var(--ah-danger); border: 1px solid var(--ah-danger-border); }
.ah-cat-seal[b-x1r61cmrpl]       { background: #f5f3ff; color: #6d28d9; border: 1px solid #ddd6fe; }

[data-theme="dark"] .ah-cat-auth[b-x1r61cmrpl]       { background: #1e1b4b; color: #a5b4fc; border-color: #312e81; }
[data-theme="dark"] .ah-cat-org[b-x1r61cmrpl]        { background: #052e16; color: #86efac; border-color: #14532d; }
[data-theme="dark"] .ah-cat-permission[b-x1r61cmrpl] { background: #2d1b00; color: #fdba74; border-color: #78350f; }
[data-theme="dark"] .ah-cat-device[b-x1r61cmrpl]     { background: #0c1a3a; color: #7dd3fc; border-color: #0c4a6e; }
[data-theme="dark"] .ah-cat-security[b-x1r61cmrpl]   { background: #2d1111; color: #fca5a5; border-color: #7f1d1d; }
[data-theme="dark"] .ah-cat-seal[b-x1r61cmrpl]       { background: #1e1033; color: #c4b5fd; border-color: #4c1d95; }

/* ── Session Forensics table ─────────────────────────────────────────── */
.ah-session-table-head + .ah-event-table-row[b-x1r61cmrpl] {
    grid-template-columns: 1fr 120px 120px 90px 70px 80px 70px;
}

/* ── Setup Guide ─────────────────────────────────────────────────────── */
.ah-setup-guide[b-x1r61cmrpl] {
    padding: 2rem;
    text-align: center;
}

.ah-setup-icon[b-x1r61cmrpl] {
    width: 56px;
    height: 56px;
    margin: 0 auto 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border);
    font-size: 1.4rem;
    color: var(--ah-accent, #6366f1);
}

.ah-setup-title[b-x1r61cmrpl] {
    margin: 0 0 8px;
    font-size: 1rem;
    font-weight: 700;
    color: var(--ah-text);
}

.ah-setup-desc[b-x1r61cmrpl] {
    margin: 0 auto 20px;
    max-width: 520px;
    font-size: 0.78rem;
    color: var(--ah-text-muted);
    line-height: 1.5;
}

.ah-setup-example[b-x1r61cmrpl] {
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding: 12px 16px;
    margin: 0 auto 20px;
    max-width: 600px;
    text-align: left;
}

.ah-setup-example-label[b-x1r61cmrpl] {
    margin: 0 0 6px;
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.ah-setup-code[b-x1r61cmrpl] {
    font-size: 0.72rem;
    color: var(--ah-text);
    word-break: break-all;
    line-height: 1.6;
}

.ah-setup-code strong[b-x1r61cmrpl] {
    color: var(--ah-accent, #6366f1);
}

.ah-setup-steps[b-x1r61cmrpl] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    max-width: 480px;
    margin: 0 auto 20px;
    text-align: left;
}

.ah-setup-step[b-x1r61cmrpl] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.ah-setup-step-num[b-x1r61cmrpl] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--ah-accent, #6366f1);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ah-setup-step-title[b-x1r61cmrpl] {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ah-text);
}

.ah-setup-step-desc[b-x1r61cmrpl] {
    margin: 2px 0 0;
    font-size: 0.7rem;
    color: var(--ah-text-muted);
}

.ah-setup-step-desc code[b-x1r61cmrpl] {
    font-size: 0.68rem;
    background: var(--ah-bg-subtle);
    padding: 1px 4px;
    border-radius: 3px;
}

.ah-setup-link[b-x1r61cmrpl] {
    display: inline-flex;
    align-items: center;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ah-accent, #6366f1);
    text-decoration: none;
}

.ah-setup-link:hover[b-x1r61cmrpl] {
    text-decoration: underline;
}

/* ── Empty state ──────────────────────────────────────────────────────── */
.ah-empty-state[b-x1r61cmrpl] {
    text-align: center;
    padding: 2rem 1rem;
    color: var(--ah-text-muted);
}
/* /Features/Dashboard/Pages/Systemhome.razor.rz.scp.css */
/* Systemhome.razor.css — CSS variable 기반 */

/* --- Seal 안내 배너 (Org 중 하나라도 seal 없으면 표시) --- */
.seal-guide-banner[b-u1ackoj9fm] {
    display:       flex;
    gap:           0.9rem;
    align-items:   flex-start;
    padding:       1rem 1.25rem;
    margin:        0 0 1.25rem;
    background:    linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border:        1px solid #93c5fd;
    border-radius: 10px;
    box-shadow:    0 1px 2px rgba(37, 99, 235, 0.08);
}
.seal-guide-banner-icon[b-u1ackoj9fm] {
    flex-shrink: 0;
    width:       36px;
    height:      36px;
    display:     flex;
    align-items: center;
    justify-content: center;
    background:    #2563eb;
    color:         #fff;
    border-radius: 8px;
    font-size:     1.1rem;
}
.seal-guide-banner-body[b-u1ackoj9fm] {
    flex: 1;
    line-height: 1.4;
}
.seal-guide-banner-title[b-u1ackoj9fm] {
    font-weight: 600;
    font-size:   0.95rem;
    color:       #1e3a8a;
    margin-bottom: 0.2rem;
}
.seal-guide-banner-sub[b-u1ackoj9fm] {
    font-size: 0.82rem;
    color:     #334155;
}
.seal-guide-banner-sub strong[b-u1ackoj9fm] { color: #0f172a; }

/* --- [2026-06-04] 배너 로고 이미지 + 우측 액션 버튼 2개 --- */
.seal-guide-banner-logo[b-u1ackoj9fm] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    object-fit: cover;
    display: block;
}
.seal-guide-banner-actions[b-u1ackoj9fm] {
    margin-left: auto;
    align-self: center;
    display: flex;
    gap: 0.5rem;
    flex-shrink: 0;
}
.seal-guide-btn[b-u1ackoj9fm] {
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.45rem 0.85rem;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    white-space: nowrap;
    transition: background 0.15s ease;
}
.seal-guide-btn-primary[b-u1ackoj9fm] { background: #1e3a8a; color: #fff; }
.seal-guide-btn-primary:hover[b-u1ackoj9fm] { background: #1e40af; }
.seal-guide-btn-ghost[b-u1ackoj9fm] { background: #fff; color: #1e3a8a; border-color: #bfdbfe; }
.seal-guide-btn-ghost:hover[b-u1ackoj9fm] { background: #eff6ff; }

/* --- Create Seal 버튼 pulse 강조 — 유저 attention 유도 --- */
.create-seal-pulse[b-u1ackoj9fm] {
    position:  relative;
    animation: createSealPulse-b-u1ackoj9fm 1.8s ease-in-out infinite;
    border-color: #2563eb !important;
    color:        #1e3a8a !important;
    font-weight:  700;
}
.create-seal-pulse i[b-u1ackoj9fm] { color: #2563eb; }

@keyframes createSealPulse-b-u1ackoj9fm {
    0%, 100% {
        box-shadow: 0 0 0 0 rgba(37, 99, 235, 0.6),
                    0 0 0 0 rgba(37, 99, 235, 0.3);
        transform:  scale(1);
    }
    50% {
        box-shadow: 0 0 0 6px rgba(37, 99, 235, 0),
                    0 0 0 12px rgba(37, 99, 235, 0);
        transform:  scale(1.03);
    }
}

.summary-card[b-u1ackoj9fm] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem; /* 2026-04-17: 1.25 → 1.65 (카드 높이 증가) */
    box-shadow:    var(--ah-shadow-sm);
}

.summary-value[b-u1ackoj9fm] {
    font-size:      1.75rem;
    font-weight:    800;
    color:          var(--ah-text);
    letter-spacing: -1px;
    line-height:    1;
}

.summary-label[b-u1ackoj9fm] {
    font-size:      0.78rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top:     0.35rem;
}

.org-table[b-u1ackoj9fm] { width: 100%; border-collapse: separate; border-spacing: 0; }

.org-table th[b-u1ackoj9fm] {
    font-size:        0.78rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.05em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.85rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}

.org-table td[b-u1ackoj9fm] {
    padding:        0.85rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.9rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}

.org-table tbody tr:hover[b-u1ackoj9fm]          { background-color: var(--ah-bg-subtle); }
.org-table tbody tr:last-child td[b-u1ackoj9fm]  { border-bottom: none; }

.org-name-link[b-u1ackoj9fm] {
    font-weight:     600;
    color:           var(--ah-text-sub);
    text-decoration: none;
    transition:      color 0.15s;
}
.org-name-link:hover[b-u1ackoj9fm] { color: var(--ah-link); }

.org-type-badge[b-u1ackoj9fm] {
    font-size:      0.65rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    background:     var(--ah-bg-surface);
    border:         1px solid var(--ah-border);
    padding:        0.1rem 0.4rem;
    border-radius:  3px;
}

/* [Sub-org] tree branch + sub-org badge */
.tree-branch[b-u1ackoj9fm] {
    color:          #cbd5e1;
    font-family:    monospace;
    font-size:      0.85rem;
    margin-right:   8px;
    user-select:    none;
}
.org-type-badge.sub-org-badge[b-u1ackoj9fm] {
    color:          #6366f1;
    background:     #eef2ff;
    border-color:   #c7d2fe;
}

.slug-badge[b-u1ackoj9fm] {
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:     0.7rem;
    color:         var(--ah-text-muted);
    background:    var(--ah-bg-subtle);
    padding:       0.15rem 0.4rem;
    border-radius: 4px;
    border:        1px solid var(--ah-border);
}

.status-badge[b-u1ackoj9fm] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    border:        1px solid var(--ah-border);
}
.status-badge.active[b-u1ackoj9fm]  { color: var(--ah-success); }
.status-badge.pending[b-u1ackoj9fm] { color: var(--ah-warning); }
.status-badge.inactive[b-u1ackoj9fm] { color: var(--ah-text-muted); }

.kyb-badge[b-u1ackoj9fm] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    border:        1px solid var(--ah-border);
}
.kyb-badge.verified[b-u1ackoj9fm]    { color: var(--ah-success); }
.kyb-badge.unverified[b-u1ackoj9fm]  { color: var(--ah-danger); }
.kyb-badge.in-progress[b-u1ackoj9fm] { color: var(--ah-info); }

.add-org-btn[b-u1ackoj9fm] {
    background:    #0f172a;
    color:         #ffffff;
    border:        none;
    font-weight:   600;
    font-size:     0.85rem;
    padding:       0.6rem 1.5rem;
    border-radius: var(--ah-radius-md);
    cursor:        pointer;
    transition:    opacity 0.15s;
}
.add-org-btn:hover[b-u1ackoj9fm] { opacity: 0.85; background: #1e293b; }

/* Go Workspace 버튼 — 각 org row 우측, spinner + 데이터 준비 후 navigate */
.go-workspace-btn[b-u1ackoj9fm] {
    display:         inline-flex;
    align-items:     center;
    gap:             0.4rem;
    background:      var(--ah-bg-surface, #f8fafc);
    color:           var(--ah-text, #0f172a);
    border:          1px solid var(--ah-border, #e2e8f0);
    font-weight:     600;
    font-size:       0.75rem;
    padding:         0.45rem 0.9rem;
    border-radius:   var(--ah-radius-md);
    cursor:          pointer;
    transition:      background 0.15s, border-color 0.15s, opacity 0.15s;
    min-width:       120px;
    justify-content: center;
    white-space:     nowrap;
}
.go-workspace-btn:hover:not(:disabled)[b-u1ackoj9fm] {
    background:   var(--ah-bg-subtle, #f1f5f9);
    border-color: var(--ah-link, #6366f1);
    color:        var(--ah-link, #6366f1);
}
.go-workspace-btn:disabled[b-u1ackoj9fm] {
    opacity: 0.6;
    cursor:  not-allowed;
}
.go-workspace-btn i[b-u1ackoj9fm] {
    font-size: 0.85rem;
    transition: transform 0.15s;
}
.go-workspace-btn:hover:not(:disabled) i[b-u1ackoj9fm] { transform: translateX(2px); }

.search-input[b-u1ackoj9fm] {
    border-radius:    8px;
    font-size:        0.85rem;
    height:           36px;
    border:           1px solid var(--ah-border);
    padding-left:     2.25rem;
    background-color: var(--ah-bg);
    color:            var(--ah-text);
}
.search-input:focus[b-u1ackoj9fm] {
    border-color: var(--ah-link);
    box-shadow:   0 0 0 3px rgba(79,70,229,0.08);
    outline:      none;
}

.rep-info[b-u1ackoj9fm]  { font-size: 0.8rem; color: var(--ah-text-sub); font-weight: 600; }
.rep-email[b-u1ackoj9fm] { font-size: 0.7rem; color: var(--ah-text-muted); }
.count-cell[b-u1ackoj9fm] { font-weight: 700; color: var(--ah-text); font-size: 0.85rem; }
.action-link-text[b-u1ackoj9fm] { font-size: 0.75rem; color: var(--ah-link); }
[data-theme="dark"] .action-link-text[b-u1ackoj9fm] { color: #eac4ff; }

.empty-state[b-u1ackoj9fm] { text-align: center; padding: 4rem 2rem; color: var(--ah-text-muted); }

.modal-overlay[b-u1ackoj9fm] {
    position:        fixed;
    inset:           0;
    background:      rgba(0,0,0,0.6);
    backdrop-filter: blur(4px);
    z-index:         1000;
    display:         flex;
    align-items:     center;
    justify-content: center;
}

.modal-card[b-u1ackoj9fm] {
    background:    var(--ah-bg);
    border-radius: 12px;
    padding:       2rem;
    width:         100%;
    max-width:     460px;
    box-shadow:    var(--ah-shadow-lg);
}

.modal-card .form-control[b-u1ackoj9fm],
.modal-card .form-select[b-u1ackoj9fm] {
    height:           42px;
    font-size:        0.85rem;
    background-color: var(--ah-bg);
    color:            var(--ah-text);
    border-color:     var(--ah-border);
}

/* 포커스 — User Profile 모달(.auth-input:focus)과 동일하게 또렷한 2px/0.15 인디고.
   (글로벌 .form-control:focus 의 3px/0.1 흐릿함을 이 모달 안에서만 덮어씀) */
.modal-card .form-control:focus[b-u1ackoj9fm],
.modal-card .form-select:focus[b-u1ackoj9fm] {
    border-color: var(--ah-link, #6366f1);
    box-shadow:   0 0 0 2px rgba(99, 102, 241, 0.15);
    outline:      none;
}

.clickable-badge[b-u1ackoj9fm] { display: inline-block; cursor: pointer; transition: all 0.2s; }
.clickable-badge:hover[b-u1ackoj9fm] { box-shadow: 0 0 0 2px rgba(79,70,229,0.2); transform: translateY(-1px); }

.setup-action-link[b-u1ackoj9fm] { cursor: pointer; transition: opacity 0.2s; }
.setup-action-link:hover[b-u1ackoj9fm] { opacity: 0.7; }

.table-container[b-u1ackoj9fm] {
    background:    #ffffff;
    border:        1px solid #f1f5f9;
    border-radius: var(--ah-radius-lg);
    overflow:      hidden;
    box-shadow:    0 1px 3px rgba(0,0,0,0.05);
}
/* /Features/Home/Pages/AiSafeIam.razor.rz.scp.css */
/* AI-Safe IAM — scoped styles. std-* classes come from global wwwroot/css/standards.css;
   here we only add the hero stat trio, the box-free live demo, and a couple of tweaks. */

/* ── Hero stat trio (mirror /standards hero numbers) ── */
.aii-hero-stats[b-nv7qtyv76w] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
    margin: 3.5rem 0 2.5rem;
    text-align: left;
    max-width: 860px;
    width: 100%;
}

.aii-hero-stat-num[b-nv7qtyv76w] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif;
    font-weight: 800;
    font-size: 3.4rem;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #18181B;
}

.aii-hero-stat-label[b-nv7qtyv76w] {
    margin-top: 0.6rem;
    font-size: 0.95rem;
    color: #475569;
    font-weight: 500;
}

.aii-hero-stat-src[b-nv7qtyv76w] {
    margin-top: 0.25rem;
    font-size: 0.8rem;
    color: #94A3B8;
}

/* ── Live demo — box-free (no browser-chrome frame) ── */
.aii-demo[b-nv7qtyv76w] {
    max-width: 760px;
    margin: 0 auto;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
}

.aii-demo-card[b-nv7qtyv76w] {
    background: #FAFAFA;
    border: 1px solid #E4E4E7;
    border-radius: 12px;
    padding: 22px 24px;
}

.aii-demo-card--scope[b-nv7qtyv76w] {
    background: #0F172A;
    border-color: #1E293B;
}

.aii-demo-label[b-nv7qtyv76w] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #71717A;
    margin-bottom: 14px;
}

.aii-demo-label i[b-nv7qtyv76w] { font-size: 13px; color: #6366F1; }
.aii-demo-card--scope .aii-demo-label[b-nv7qtyv76w] { color: #94A3B8; }
.aii-demo-card--scope .aii-demo-label i[b-nv7qtyv76w] { color: #34D399; }

.aii-prompt-wrap[b-nv7qtyv76w],
.aii-scope-wrap[b-nv7qtyv76w] { position: relative; min-height: 30px; display: block; }

.aii-prompt[b-nv7qtyv76w] {
    position: absolute; inset: 0;
    font-size: 17px; line-height: 30px; color: #18181B; font-weight: 500;
    opacity: 0; overflow: hidden; white-space: nowrap;
    clip-path: inset(0 100% 0 0);
    animation: aii-type-b-nv7qtyv76w 16s infinite;
}
.aii-prompt-1[b-nv7qtyv76w] { animation-delay: 0s; }
.aii-prompt-2[b-nv7qtyv76w] { animation-delay: 4s; }
.aii-prompt-3[b-nv7qtyv76w] { animation-delay: 8s; }
.aii-prompt-4[b-nv7qtyv76w] { animation-delay: 12s; }

.aii-caret[b-nv7qtyv76w] {
    display: inline-block; color: #6366F1; font-weight: 700; margin-left: 1px;
    animation: aii-blink-b-nv7qtyv76w 1s steps(2, start) infinite;
}

.aii-scope[b-nv7qtyv76w] {
    position: absolute; inset: 0;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 14.5px; line-height: 30px; color: #E2E8F0;
    opacity: 0; transform: translateY(8px);
    animation: aii-scope-cycle-b-nv7qtyv76w 16s infinite;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.aii-scope-1[b-nv7qtyv76w] { animation-delay: 0s; }
.aii-scope-2[b-nv7qtyv76w] { animation-delay: 4s; }
.aii-scope-3[b-nv7qtyv76w] { animation-delay: 8s; }
.aii-scope-4[b-nv7qtyv76w] { animation-delay: 12s; }

.aii-scope .sc-ns[b-nv7qtyv76w] { color: #818CF8; font-weight: 600; }
.aii-scope .sc-r[b-nv7qtyv76w]  { color: #FBBF24; }
.aii-scope .sc-a[b-nv7qtyv76w]  { color: #34D399; font-weight: 600; }
.aii-scope .sc-c[b-nv7qtyv76w]  { color: #94A3B8; }
.aii-scope .sc-v[b-nv7qtyv76w]  { color: #F8FAFC; }

.aii-demo-arrow[b-nv7qtyv76w] {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: 16px 0; color: #6366F1;
}
.aii-demo-arrow i[b-nv7qtyv76w] { font-size: 22px; animation: aii-arrow-b-nv7qtyv76w 2.4s ease-in-out infinite; }
.aii-demo-arrow span[b-nv7qtyv76w] {
    font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase; color: #6366F1;
}

@keyframes aii-type-b-nv7qtyv76w {
    0%   { opacity: 0; clip-path: inset(0 100% 0 0); }
    2%   { opacity: 1; }
    14%  { opacity: 1; clip-path: inset(0 0 0 0); }
    23%  { opacity: 1; clip-path: inset(0 0 0 0); }
    25%  { opacity: 0; }
    100% { opacity: 0; }
}

@keyframes aii-blink-b-nv7qtyv76w {
    0%, 49%  { opacity: 1; }
    50%, 100% { opacity: 0; }
}

@keyframes aii-scope-cycle-b-nv7qtyv76w {
    0%   { opacity: 0; transform: translateY(8px); }
    14%  { opacity: 0; transform: translateY(8px); }
    18%  { opacity: 1; transform: translateY(0); }
    23%  { opacity: 1; transform: translateY(0); }
    25%  { opacity: 0; transform: translateY(-4px); }
    100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes aii-arrow-b-nv7qtyv76w {
    0%, 100% { transform: translateY(0); opacity: 0.7; }
    50%      { transform: translateY(2px); opacity: 1; }
}

/* ── Time-boxed gap numbers (∞ / 1 / clock) ── */
.gap-num--check[b-nv7qtyv76w] {
    font-family: inherit !important;
    font-size: 30px;
    color: #18181B;
}
.gap-num--check i[b-nv7qtyv76w] { font-size: 26px; }

@media (max-width: 768px) {
    .aii-hero-stats[b-nv7qtyv76w] { grid-template-columns: 1fr; gap: 1.5rem; margin: 2.5rem 0 2rem; }
    .aii-hero-stat-num[b-nv7qtyv76w] { font-size: 2.6rem; }
    .aii-prompt[b-nv7qtyv76w] { font-size: 15px; }
    .aii-scope[b-nv7qtyv76w] { font-size: 12.5px; }
    .aii-prompt-wrap[b-nv7qtyv76w], .aii-scope-wrap[b-nv7qtyv76w] { min-height: 52px; white-space: normal; }
    .aii-prompt[b-nv7qtyv76w], .aii-scope[b-nv7qtyv76w] { white-space: normal; }
}
/* /Features/Home/Pages/Careers.razor.rz.scp.css */
/* Careers — light landing theme (matches Privacy/Refund/Terms aesthetic) */

.cr-root[b-jjq3q13rmn] {
    min-height: calc(100vh - 72px);
    padding: 5rem 1.5rem 6rem;
}
.cr-inner[b-jjq3q13rmn] {
    max-width: 920px;
    margin: 0 auto;
}

/* ── Hero ── */
.cr-header[b-jjq3q13rmn] {
    text-align: center;
    margin-bottom: 4rem;
}
.cr-eyebrow[b-jjq3q13rmn] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #6366f1;
    margin-bottom: 1rem;
}
.cr-title[b-jjq3q13rmn] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 900;
    font-size: clamp(2.2rem, 4.5vw, 3.4rem);
    letter-spacing: -0.03em;
    color: #18181b;
    margin: 0 0 1.25rem;
}
.cr-lede[b-jjq3q13rmn] {
    font-size: 1.05rem;
    color: #3f3f46;
    line-height: 1.7;
    max-width: 720px;
    margin: 0 auto 1.75rem;
}
.cr-quick[b-jjq3q13rmn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    justify-content: center;
    max-width: 720px;
    margin: 0 auto;
}
.cr-quick-item[b-jjq3q13rmn] {
    font-size: 0.85rem;
    color: #18181b;
    background: #f4f4f5;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    padding: 0.4rem 0.9rem;
}

/* ── Generic sections (context / eo / process) ── */
.cr-context[b-jjq3q13rmn],
.cr-eo[b-jjq3q13rmn],
.cr-process[b-jjq3q13rmn] {
    margin: 0 0 3rem;
    padding: 2rem 2.25rem;
    background: #fafafa;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    color: #27272a;
    font-size: 0.95rem;
    line-height: 1.7;
}
.cr-context p[b-jjq3q13rmn],
.cr-eo p[b-jjq3q13rmn],
.cr-process p[b-jjq3q13rmn] { margin: 0 0 0.85rem; }
.cr-context p:last-child[b-jjq3q13rmn],
.cr-eo p:last-child[b-jjq3q13rmn],
.cr-process p:last-child[b-jjq3q13rmn] { margin-bottom: 0; }

.cr-section-title[b-jjq3q13rmn] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.4rem;
    letter-spacing: -0.02em;
    color: #18181b;
    margin: 0 0 1rem;
}

/* ── Role card ── */
.cr-role[b-jjq3q13rmn] {
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 2rem 2.25rem 2.5rem;
    margin-bottom: 1.75rem;
    background: #ffffff;
    transition: box-shadow 0.2s;
}
.cr-role:hover[b-jjq3q13rmn] {
    box-shadow: 0 4px 14px -4px rgba(0, 0, 0, 0.08);
}
.cr-role-head[b-jjq3q13rmn] {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 1.25rem;
    align-items: center;
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #f4f4f5;
}
.cr-role-meta[b-jjq3q13rmn] { min-width: 0; }
.cr-role-tag[b-jjq3q13rmn] {
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 3px 8px;
    border-radius: 4px;
    background: #18181b;
    color: #ffffff;
    margin-bottom: 0.6rem;
}
.cr-role-title[b-jjq3q13rmn] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 800;
    font-size: 1.6rem;
    letter-spacing: -0.02em;
    color: #18181b;
    margin: 0 0 0.4rem;
}
.cr-role-sub[b-jjq3q13rmn] {
    font-size: 0.9rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}
.cr-apply-btn[b-jjq3q13rmn] {
    display: inline-flex;
    align-items: center;
    padding: 0.7rem 1.2rem;
    background: #18181b;
    color: #ffffff;
    border-radius: 8px;
    font-size: 0.88rem;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s;
}
.cr-apply-btn:hover[b-jjq3q13rmn] { background: #2563eb; color: #ffffff; }

.cr-role-body[b-jjq3q13rmn] {
    font-size: 0.95rem;
    color: #27272a;
    line-height: 1.7;
}
.cr-role-body p[b-jjq3q13rmn] { margin: 0 0 0.85rem; }

.cr-h3[b-jjq3q13rmn] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1rem;
    color: #18181b;
    margin: 1.75rem 0 0.6rem;
}
.cr-h3:first-child[b-jjq3q13rmn] { margin-top: 0; }

.cr-list[b-jjq3q13rmn] {
    margin: 0 0 0.5rem;
    padding-left: 1.25rem;
}
.cr-list li[b-jjq3q13rmn] {
    margin-bottom: 0.55rem;
}

/* ── Tech stack chips ── */
.cr-stack[b-jjq3q13rmn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.25rem;
}
.cr-chip[b-jjq3q13rmn] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #18181b;
    background: #f4f4f5;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    padding: 0.25rem 0.65rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* ── Equal opportunity ── */
.cr-eo-foot[b-jjq3q13rmn] {
    margin-top: 1rem;
    font-size: 0.88rem;
    color: #6b7280;
}

/* ── Process timeline ── */
.cr-steps[b-jjq3q13rmn] {
    list-style: none;
    counter-reset: cr-step;
    padding: 0;
    margin: 0 0 1rem;
    display: grid;
    gap: 1rem;
}
.cr-steps > li[b-jjq3q13rmn] {
    padding: 1rem 1.25rem;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}
.cr-step-h[b-jjq3q13rmn] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: #18181b;
    margin-bottom: 0.35rem;
}
.cr-step-d[b-jjq3q13rmn] {
    font-size: 0.9rem;
    color: #52525b;
    line-height: 1.6;
}
.cr-process-foot[b-jjq3q13rmn] {
    font-size: 0.88rem;
    color: #6b7280;
    margin-top: 0.5rem;
}

/* ── Foot CTA ── */
.cr-foot[b-jjq3q13rmn] {
    text-align: center;
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid #e5e7eb;
}
.cr-foot-lede[b-jjq3q13rmn] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #18181b;
    margin: 0 0 0.5rem;
}
.cr-foot-meta[b-jjq3q13rmn] {
    font-size: 0.92rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.7;
}
.cr-link[b-jjq3q13rmn] {
    color: #2563eb;
    text-decoration: none;
    font-weight: 600;
}
.cr-link:hover[b-jjq3q13rmn] { text-decoration: underline; }

/* ── Responsive ── */
@media (max-width: 640px) {
    .cr-role[b-jjq3q13rmn] { padding: 1.5rem 1.25rem; }
    .cr-role-head[b-jjq3q13rmn] {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .cr-apply-btn[b-jjq3q13rmn] {
        justify-content: center;
        width: 100%;
        margin-top: 0.5rem;
    }
    .cr-context[b-jjq3q13rmn],
    .cr-eo[b-jjq3q13rmn],
    .cr-process[b-jjq3q13rmn] {
        padding: 1.5rem 1.25rem;
    }
}
/* /Features/Home/Pages/ClerkVsAxowl.razor.rz.scp.css */
/* =========================================
   RAG vs Axowl — architectural comparison page
   Inter / zinc base · restrained palette · single accent
   Visual consistency with Solutions.razor.css (sl-) — prefix cmp-
========================================= */

.cmp-hero[b-2l41bj6kqr],
.cmp-section[b-2l41bj6kqr],
.cmp-cta[b-2l41bj6kqr] {
    width: 100%;
    align-self: stretch;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: #27272a;
}

.cmp-hero *[b-2l41bj6kqr],
.cmp-section *[b-2l41bj6kqr],
.cmp-cta *[b-2l41bj6kqr] { font-family: inherit; }

.cmp-container[b-2l41bj6kqr] {
    max-width: 1200px;
    margin:    0 auto;
    padding:   0 32px;
    width:     100%;
}

/* ── Hero ── */
.cmp-hero[b-2l41bj6kqr] {
    position:        relative;
    padding:         128px 0 96px;
    color:           #fafafa;
    background:      linear-gradient(180deg, #0f0f12 0%, #18181b 100%);
    border-bottom:   1px solid #18181b;
}

.cmp-hero-eyebrow[b-2l41bj6kqr] {
    display:       inline-flex;
    align-items:   center;
    gap:           8px;
    font-size:     13px;
    font-weight:   500;
    letter-spacing: 0.02em;
    color:         #a1a1aa;
    margin-bottom: 24px;
    text-transform: uppercase;
}

.cmp-hero-eyebrow i[b-2l41bj6kqr] { font-size: 14px; }

.cmp-hero-h1[b-2l41bj6kqr] {
    font-size:      56px;
    font-weight:    700;
    line-height:    1.08;
    letter-spacing: -1.6px;
    color:          #ffffff;
    margin:         0 0 28px;
}

.cmp-hero-lede[b-2l41bj6kqr] {
    font-size:   17px;
    line-height: 1.65;
    color:       rgba(255,255,255,0.8);
    max-width:   760px;
    margin:      0 0 36px;
}

.cmp-hero-cta[b-2l41bj6kqr] {
    display:   flex;
    gap:       12px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}

.cmp-hero-meta[b-2l41bj6kqr] {
    display: flex;
    gap: 56px;
    flex-wrap: wrap;
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.cmp-hero-meta-item[b-2l41bj6kqr] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cmp-hero-meta-label[b-2l41bj6kqr] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 500;
}

.cmp-hero-meta-value[b-2l41bj6kqr] {
    font-size: 15px;
    color: #ffffff;
    font-weight: 600;
}

/* ── Buttons ── */
.cmp-btn[b-2l41bj6kqr] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    min-width:       148px;
    padding:         12px 22px;
    border-radius:   6px;
    font-size:       14px;
    font-weight:     500;
    line-height:     20px;
    text-decoration: none;
    cursor:          pointer;
    border:          none;
    transition:      all 150ms ease;
}

.cmp-btn--primary[b-2l41bj6kqr] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
}
.cmp-btn--primary:hover[b-2l41bj6kqr] { background: #f4f4f5; color: #18181b; }

.cmp-btn--ghost[b-2l41bj6kqr] {
    background: transparent;
    color:      #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.24);
}
.cmp-btn--ghost:hover[b-2l41bj6kqr] { background: rgba(255,255,255,0.08); color: #ffffff; }

.cmp-section .cmp-btn--primary[b-2l41bj6kqr],
.cmp-cta .cmp-btn--primary[b-2l41bj6kqr] {
    background: #18181b;
    color:      #ffffff;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.18);
}
.cmp-section .cmp-btn--primary:hover[b-2l41bj6kqr],
.cmp-cta .cmp-btn--primary:hover[b-2l41bj6kqr] { background: #27272a; color: #ffffff; }

.cmp-section .cmp-btn--ghost[b-2l41bj6kqr],
.cmp-cta .cmp-btn--ghost[b-2l41bj6kqr] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: inset 0 0 0 1px #e4e4e7;
}
.cmp-section .cmp-btn--ghost:hover[b-2l41bj6kqr],
.cmp-cta .cmp-btn--ghost:hover[b-2l41bj6kqr] { background: #fafafa; color: #18181b; }

/* ── Sections ── */
.cmp-section[b-2l41bj6kqr] {
    padding: 96px 0;
    background: #ffffff;
}

.cmp-section--alt[b-2l41bj6kqr] { background: #fafafa; }

.cmp-section-head[b-2l41bj6kqr] {
    max-width: 760px;
    margin: 0 0 48px;
}

.cmp-kicker[b-2l41bj6kqr] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #71717a;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.cmp-h2[b-2l41bj6kqr] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1px;
    color: #18181b;
    margin: 0 0 16px;
}

.cmp-section-sub[b-2l41bj6kqr] {
    font-size: 16px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
    max-width: 720px;
}

/* ── Prose ── */
.cmp-prose[b-2l41bj6kqr] {
    max-width: 760px;
}

.cmp-prose p[b-2l41bj6kqr] {
    font-size: 16px;
    line-height: 1.75;
    color: #3f3f46;
    margin: 0 0 18px;
}

.cmp-prose p:last-child[b-2l41bj6kqr] { margin-bottom: 0; }

.cmp-prose--space-above[b-2l41bj6kqr] { margin-top: 32px; }

.cmp-table strong[b-2l41bj6kqr] { font-weight: 700; color: #18181b; }

.cmp-prose em[b-2l41bj6kqr] {
    font-style: italic;
    color: #18181b;
}

.cmp-prose-note[b-2l41bj6kqr] {
    font-size: 14.5px !important;
    color: #71717a !important;
    padding: 16px 20px;
    background: #fafafa;
    border-left: 2px solid #d4d4d8;
    margin-top: 18px !important;
}

.cmp-section--alt .cmp-prose-note[b-2l41bj6kqr] { background: #ffffff; border-left-color: #e4e4e7; }

/* ── Definitions (§02) ── */
.cmp-defs[b-2l41bj6kqr] {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    gap: 48px;
    align-items: start;
}

.cmp-def-divider[b-2l41bj6kqr] {
    background: #e4e4e7;
    width: 1px;
    align-self: stretch;
    min-height: 200px;
}

.cmp-def-label[b-2l41bj6kqr] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 600;
    margin-bottom: 12px;
}

.cmp-def-name[b-2l41bj6kqr] {
    font-size: 24px;
    font-weight: 700;
    color: #18181b;
    letter-spacing: -0.4px;
    margin: 0 0 16px;
    line-height: 1.25;
}

.cmp-def-body[b-2l41bj6kqr] {
    font-size: 15.5px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

/* ── Table (§03) ── */
.cmp-table-wrap[b-2l41bj6kqr] {
    overflow-x: auto;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
    background: #ffffff;
}

.cmp-table[b-2l41bj6kqr] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14.5px;
}

.cmp-table thead th[b-2l41bj6kqr] {
    text-align: left;
    padding: 16px 20px;
    background: #fafafa;
    border-bottom: 1px solid #e4e4e7;
    font-weight: 600;
    color: #18181b;
    font-size: 13.5px;
    letter-spacing: 0.02em;
}

.cmp-table thead th:first-child[b-2l41bj6kqr] { width: 200px; }

.cmp-table tbody td[b-2l41bj6kqr] {
    padding: 16px 20px;
    border-bottom: 1px solid #f4f4f5;
    color: #3f3f46;
    line-height: 1.6;
    vertical-align: top;
}

.cmp-table tbody tr:last-child td[b-2l41bj6kqr] { border-bottom: none; }

.cmp-table tbody tr:hover[b-2l41bj6kqr] { background: #fafafa; }

.cmp-table-row-label[b-2l41bj6kqr] {
    font-weight: 600;
    color: #18181b !important;
    width: 200px;
}

/* ── Observations (§04) ── */
.cmp-obs[b-2l41bj6kqr] {
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 880px;
}

.cmp-obs-item[b-2l41bj6kqr] {
    display: grid;
    grid-template-columns: 56px 1fr;
    grid-template-areas:
        "num title"
        ".   body";
    column-gap: 24px;
    row-gap: 12px;
    align-items: start;
    padding: 28px 0;
    border-top: 1px solid #e4e4e7;
}

.cmp-obs-item > .cmp-obs-num[b-2l41bj6kqr]   { grid-area: num; }
.cmp-obs-item > .cmp-obs-title[b-2l41bj6kqr] { grid-area: title; margin-bottom: 0; }
.cmp-obs-item > .cmp-obs-body[b-2l41bj6kqr]  { grid-area: body; }

.cmp-obs-item:first-child[b-2l41bj6kqr] { border-top: none; padding-top: 0; }

.cmp-obs-num[b-2l41bj6kqr] {
    font-size: 14px;
    font-weight: 700;
    color: #a1a1aa;
    letter-spacing: 0.04em;
    padding-top: 4px;
}

.cmp-obs-title[b-2l41bj6kqr] {
    font-size: 19px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 12px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

.cmp-obs-body[b-2l41bj6kqr] {
    font-size: 15.5px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

.cmp-obs-body em[b-2l41bj6kqr] { font-style: italic; color: #18181b; }

/* ── Flow / ASCII (§06, §07) ── */
.cmp-flow[b-2l41bj6kqr] {
    margin: 24px 0;
    padding: 24px;
    background: #0f0f12;
    border-radius: 8px;
    overflow-x: auto;
}

.cmp-section--alt .cmp-flow[b-2l41bj6kqr] {
    background: #ffffff;
    border: 1px solid #e4e4e7;
}

.cmp-flow-ascii[b-2l41bj6kqr] {
    font-family: 'SF Mono', 'Menlo', 'Consolas', 'Monaco', monospace;
    font-size: 13px;
    line-height: 1.55;
    color: #e4e4e7;
    margin: 0;
    white-space: pre;
}

.cmp-section--alt .cmp-flow-ascii[b-2l41bj6kqr] { color: #27272a; }

/* ── Complementary deployment grid (§08) ── */
.cmp-comp-grid[b-2l41bj6kqr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.cmp-comp[b-2l41bj6kqr] {
    padding: 28px;
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
}

.cmp-comp-label[b-2l41bj6kqr] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 600;
    margin-bottom: 16px;
}

.cmp-comp-list[b-2l41bj6kqr] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cmp-comp-list li[b-2l41bj6kqr] {
    position: relative;
    padding: 10px 0 10px 22px;
    font-size: 15px;
    line-height: 1.6;
    color: #3f3f46;
    border-bottom: 1px solid #f4f4f5;
}

.cmp-comp-list li:last-child[b-2l41bj6kqr] { border-bottom: none; }

.cmp-comp-note[b-2l41bj6kqr] {
    margin: 16px 0 0;
    padding-top: 14px;
    border-top: 1px dashed #d4d4d8;
    font-size: 13px;
    line-height: 1.6;
    color: #71717a;
    font-style: italic;
}

.cmp-comp-list li[b-2l41bj6kqr]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 18px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #d4d4d8;
}

/* ── References (§09) ── */
.cmp-refs[b-2l41bj6kqr] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 880px;
}

.cmp-ref[b-2l41bj6kqr] {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 24px;
    padding: 18px 0;
    border-bottom: 1px solid #e4e4e7;
    align-items: start;
}

.cmp-ref:last-child[b-2l41bj6kqr] { border-bottom: none; }

.cmp-ref-tag[b-2l41bj6kqr] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 600;
    padding-top: 2px;
}

.cmp-ref-text[b-2l41bj6kqr] {
    font-size: 14.5px;
    line-height: 1.65;
    color: #3f3f46;
}

.cmp-ref-text em[b-2l41bj6kqr] { font-style: italic; color: #18181b; }

/* ── CTA ── */
.cmp-cta[b-2l41bj6kqr] {
    padding: 96px 0;
    background: #0f0f12;
    color: #fafafa;
    text-align: center;
}

.cmp-cta-title[b-2l41bj6kqr] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.6px;
    color: #ffffff;
    margin: 0 0 20px;
}

.cmp-cta-sub[b-2l41bj6kqr] {
    font-size: 16px;
    line-height: 1.65;
    color: rgba(255,255,255,0.72);
    max-width: 620px;
    margin: 0 auto 36px;
}

.cmp-cta-actions[b-2l41bj6kqr] {
    display: inline-flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}

/* ── Responsive ── */
@media (max-width: 880px) {
    .cmp-hero[b-2l41bj6kqr] { padding: 96px 0 72px; }
    .cmp-hero-h1[b-2l41bj6kqr] { font-size: 40px; letter-spacing: -1.2px; }
    .cmp-section[b-2l41bj6kqr] { padding: 72px 0; }
    .cmp-h2[b-2l41bj6kqr] { font-size: 28px; }
    .cmp-defs[b-2l41bj6kqr] { grid-template-columns: 1fr; }
    .cmp-def-divider[b-2l41bj6kqr] { display: none; }
    .cmp-comp-grid[b-2l41bj6kqr] { grid-template-columns: 1fr; }
    .cmp-ref[b-2l41bj6kqr] { grid-template-columns: 1fr; gap: 6px; }
    .cmp-obs-item[b-2l41bj6kqr] {
        grid-template-columns: 1fr;
        grid-template-areas: "num" "title" "body";
        gap: 8px;
    }
    .cmp-cta-title[b-2l41bj6kqr] { font-size: 28px; }
}
/* /Features/Home/Pages/ComplexOrganizations.razor.rz.scp.css */
/* =========================================
   Solutions · App Group
   Inter / zinc base, single accent, photography carries the differentiation.
   Mirrors the visual language of Solutions.razor.css (sl-*) with an cx-* prefix.
========================================= */

.cx-hero[b-eu1rt51vj3],
.cx-strip[b-eu1rt51vj3],
.cx-section[b-eu1rt51vj3],
.cx-cta[b-eu1rt51vj3] {
    width: 100%;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: #27272a;
}

.cx-hero *[b-eu1rt51vj3],
.cx-strip *[b-eu1rt51vj3],
.cx-section *[b-eu1rt51vj3],
.cx-cta *[b-eu1rt51vj3] { font-family: inherit; }

.cx-container[b-eu1rt51vj3] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
    width: 100%;
}

/* ── Hero ── */
.cx-hero[b-eu1rt51vj3] {
    position: relative;
    padding: 128px 0 88px;
    color: #fafafa;
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid #18181b;
}

.cx-hero-eyebrow[b-eu1rt51vj3] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.02em;
    color: #a1a1aa;
    margin-bottom: 24px;
    text-transform: uppercase;
}

.cx-hero-eyebrow i[b-eu1rt51vj3] { font-size: 14px; }

.cx-hero-h1[b-eu1rt51vj3] {
    font-size: 60px;
    font-weight: 700;
    line-height: 1.06;
    letter-spacing: -2px;
    color: #ffffff;
    margin: 0 0 28px;
}

.cx-hero-lede[b-eu1rt51vj3] {
    font-size: 17px;
    line-height: 1.7;
    color: rgba(255,255,255,0.8);
    max-width: 760px;
    margin: 0 0 36px;
}

.cx-hero-lede strong[b-eu1rt51vj3] { color: #ffffff; font-weight: 600; }

.cx-hero-cta[b-eu1rt51vj3] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}

.cx-hero-meta[b-eu1rt51vj3] {
    display: flex;
    gap: 56px;
    flex-wrap: wrap;
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.cx-hero-meta-item[b-eu1rt51vj3] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cx-hero-meta-label[b-eu1rt51vj3] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 500;
}

.cx-hero-meta-value[b-eu1rt51vj3] {
    font-size: 15px;
    color: #ffffff;
    font-weight: 600;
}

/* ── Buttons ── */
.cx-btn[b-eu1rt51vj3] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 148px;
    padding: 12px 22px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    transition: all 150ms ease;
}

.cx-btn--primary[b-eu1rt51vj3] {
    background: #ffffff;
    color: #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
}
.cx-btn--primary:hover[b-eu1rt51vj3] { background: #f4f4f5; color: #18181b; }

.cx-btn--ghost[b-eu1rt51vj3] {
    background: transparent;
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.24);
}
.cx-btn--ghost:hover[b-eu1rt51vj3] { background: rgba(255,255,255,0.08); color: #ffffff; }

/* ── Numbers strip ── */
.cx-strip[b-eu1rt51vj3] {
    background: #fafafa;
    border-bottom: 1px solid #e4e4e7;
    padding: 44px 0;
}

.cx-strip-grid[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
}

.cx-strip-item[b-eu1rt51vj3] {
    padding: 0 28px;
    border-right: 1px solid #e4e4e7;
}

.cx-strip-item:first-child[b-eu1rt51vj3] { padding-left: 0; }
.cx-strip-item:last-child[b-eu1rt51vj3] { border-right: none; padding-right: 0; }

.cx-strip-num[b-eu1rt51vj3] {
    font-size: 40px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1.5px;
    color: #18181b;
}

.cx-strip-label[b-eu1rt51vj3] {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 600;
    color: #3f3f46;
}

.cx-strip-src[b-eu1rt51vj3] {
    margin-top: 4px;
    font-size: 11.5px;
    line-height: 1.5;
    color: #71717a;
}

/* ── Sections ── */
.cx-section[b-eu1rt51vj3] {
    padding: 96px 0;
    background: #ffffff;
}

.cx-section--alt[b-eu1rt51vj3] { background: #fafafa; }

.cx-section--dark[b-eu1rt51vj3] {
    background: #0a0a0a;
    border-top: 1px solid #18181b;
    border-bottom: 1px solid #18181b;
}

.cx-section-head[b-eu1rt51vj3] {
    max-width: 760px;
    margin: 0 0 56px;
}

.cx-kicker[b-eu1rt51vj3] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #71717a;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.cx-kicker--light[b-eu1rt51vj3] { color: rgba(255,255,255,0.6); }

.cx-h2[b-eu1rt51vj3] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1px;
    color: #18181b;
    margin: 0 0 16px;
}

.cx-h2--light[b-eu1rt51vj3] { color: #ffffff; }

.cx-h3[b-eu1rt51vj3] {
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.4px;
    color: #18181b;
    margin: 0 0 14px;
}

.cx-section-sub[b-eu1rt51vj3] {
    font-size: 16px;
    line-height: 1.7;
    color: #52525b;
    margin: 0;
    max-width: 720px;
}

.cx-section-sub--light[b-eu1rt51vj3] { color: rgba(255,255,255,0.72); }

/* ── Photo cards (problem / in practice) ── */
.cx-cards[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}

.cx-card[b-eu1rt51vj3] {
    display: flex;
    flex-direction: column;
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 10px;
    overflow: hidden;
}

.cx-section--alt .cx-card[b-eu1rt51vj3] { background: #ffffff; }

.cx-card-img[b-eu1rt51vj3] {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #f4f4f5;
}

.cx-card-img img[b-eu1rt51vj3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 400ms ease;
}

.cx-card:hover .cx-card-img img[b-eu1rt51vj3] { transform: scale(1.04); }

.cx-card-body[b-eu1rt51vj3] { padding: 26px 26px 30px; }

.cx-card-num[b-eu1rt51vj3] {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #a1a1aa;
    margin-bottom: 12px;
}

.cx-card-title[b-eu1rt51vj3] {
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: -0.3px;
    color: #18181b;
    margin: 0 0 12px;
}

.cx-card-text[b-eu1rt51vj3] {
    font-size: 14.5px;
    line-height: 1.7;
    color: #52525b;
    margin: 0;
}

/* ── Hierarchy ladder + photo ── */
.cx-split[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 56px;
    align-items: start;
}

.cx-ladder[b-eu1rt51vj3] {
    border-top: 2px solid #18181b;
}

.cx-rung[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: 104px 1fr;
    gap: 20px;
    padding: 20px 0;
    border-bottom: 1px solid #e4e4e7;
    align-items: start;
}

.cx-rung-code[b-eu1rt51vj3] {
    font-family: 'SFMono-Regular', ui-monospace, Menlo, Consolas, monospace;
    font-size: 12px;
    font-weight: 600;
    color: #52525b;
    background: #f4f4f5;
    border: 1px solid #e4e4e7;
    border-radius: 4px;
    padding: 5px 8px;
    text-align: center;
    white-space: nowrap;
}

.cx-rung--1 .cx-rung-body[b-eu1rt51vj3] { padding-left: 0; }
.cx-rung--2 .cx-rung-body[b-eu1rt51vj3] { padding-left: 16px; border-left: 2px solid #e4e4e7; }
.cx-rung--3 .cx-rung-body[b-eu1rt51vj3] { padding-left: 32px; border-left: 2px solid #d4d4d8; }
.cx-rung--4 .cx-rung-body[b-eu1rt51vj3] { padding-left: 48px; border-left: 2px solid #18181b; }

.cx-rung-name[b-eu1rt51vj3] {
    font-size: 16px;
    font-weight: 700;
    color: #18181b;
    letter-spacing: -0.2px;
    margin-bottom: 6px;
}

.cx-rung-desc[b-eu1rt51vj3] {
    font-size: 14px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
}

.cx-ladder-foot[b-eu1rt51vj3] {
    padding-top: 16px;
    font-size: 12.5px;
    line-height: 1.6;
    color: #71717a;
}

.cx-split-img[b-eu1rt51vj3] {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 24px -8px rgba(0,0,0,0.18);
}

.cx-split-img img[b-eu1rt51vj3] {
    width: 100%;
    height: 100%;
    min-height: 460px;
    object-fit: cover;
    display: block;
}

/* ── Photo band ── */
.cx-band[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 56px;
}

.cx-band-item[b-eu1rt51vj3] { margin: 0; }

.cx-band-item img[b-eu1rt51vj3] {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
    border-radius: 8px;
}

.cx-band-item figcaption[b-eu1rt51vj3] {
    margin-top: 12px;
    font-size: 12.5px;
    line-height: 1.55;
    color: #52525b;
}

.cx-band-item figcaption strong[b-eu1rt51vj3] {
    display: block;
    color: #18181b;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.02em;
    margin-bottom: 2px;
}

/* ── Duo (reporting / approval) ── */
.cx-duo[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
}

.cx-duo-img[b-eu1rt51vj3] {
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 24px;
}

.cx-duo-img img[b-eu1rt51vj3] {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}

.cx-duo-title[b-eu1rt51vj3] {
    font-size: 21px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -0.4px;
    color: #18181b;
    margin: 0 0 12px;
}

.cx-duo-text[b-eu1rt51vj3] {
    font-size: 15px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

/* ── Badge row ── */
.cx-badge-row[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 56px;
    align-items: center;
    margin-top: 72px;
    padding-top: 56px;
    border-top: 1px solid #e4e4e7;
}

.cx-badge-img[b-eu1rt51vj3] {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 8px 24px -8px rgba(0,0,0,0.18);
}

.cx-badge-img img[b-eu1rt51vj3] {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
}

.cx-badge-text p[b-eu1rt51vj3] {
    font-size: 15px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0 0 20px;
}

.cx-list[b-eu1rt51vj3] {
    list-style: none;
    padding: 0;
    margin: 0;
    border-top: 1px solid #e4e4e7;
}

.cx-list li[b-eu1rt51vj3] {
    position: relative;
    padding: 12px 0 12px 26px;
    font-size: 14.5px;
    line-height: 1.55;
    color: #3f3f46;
    border-bottom: 1px solid #e4e4e7;
}

.cx-list li[b-eu1rt51vj3]::before {
    content: '';
    position: absolute;
    left: 4px;
    top: 20px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #18181b;
}

/* ── Tiles (dark section) ── */
.cx-tiles[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.cx-tile[b-eu1rt51vj3] {
    background: #131316;
    border: 1px solid #27272a;
    border-radius: 10px;
    overflow: hidden;
    padding-bottom: 22px;
}

.cx-tile-img[b-eu1rt51vj3] {
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #18181b;
}

.cx-tile-img img[b-eu1rt51vj3] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    opacity: 0.86;
    transition: opacity 300ms ease;
}

.cx-tile:hover .cx-tile-img img[b-eu1rt51vj3] { opacity: 1; }

.cx-tile-name[b-eu1rt51vj3] {
    margin: 20px 22px 8px;
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    letter-spacing: -0.2px;
}

.cx-tile-text[b-eu1rt51vj3] {
    margin: 0 22px;
    font-size: 13.5px;
    line-height: 1.65;
    color: rgba(255,255,255,0.62);
}

.cx-note[b-eu1rt51vj3] {
    margin-top: 40px;
    padding: 20px 24px;
    border-left: 2px solid #3f3f46;
    font-size: 14px;
    line-height: 1.7;
    color: rgba(255,255,255,0.66);
    background: rgba(255,255,255,0.03);
}

/* ── Chain (database → deploy) ── */
.cx-chain[b-eu1rt51vj3] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.cx-chain-step[b-eu1rt51vj3] {
    display: flex;
    flex-direction: column;
    border-top: 2px solid #18181b;
    padding-top: 18px;
}

.cx-chain-img[b-eu1rt51vj3] {
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 16px;
}

.cx-chain-img img[b-eu1rt51vj3] {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    display: block;
}

.cx-chain-idx[b-eu1rt51vj3] {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: #a1a1aa;
    margin-bottom: 8px;
}

.cx-chain-name[b-eu1rt51vj3] {
    font-size: 17px;
    font-weight: 700;
    color: #18181b;
    letter-spacing: -0.2px;
    margin-bottom: 10px;
}

.cx-chain-text[b-eu1rt51vj3] {
    font-size: 13.5px;
    line-height: 1.65;
    color: #52525b;
    margin: 0 0 16px;
    flex: 1;
}

.cx-chip[b-eu1rt51vj3] {
    align-self: flex-start;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: 999px;
}

.cx-chip--live[b-eu1rt51vj3] {
    color: #166534;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
}

.cx-chip--design[b-eu1rt51vj3] {
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
}

.cx-foot[b-eu1rt51vj3] {
    margin: 40px 0 0;
    max-width: 820px;
    font-size: 13.5px;
    line-height: 1.75;
    color: #71717a;
}

/* ── Comparison table ── */
.cx-table-wrap[b-eu1rt51vj3] {
    overflow-x: auto;
    border: 1px solid #e4e4e7;
    border-radius: 10px;
    background: #ffffff;
}

.cx-table[b-eu1rt51vj3] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14.5px;
    min-width: 680px;
}

.cx-table thead tr[b-eu1rt51vj3] {
    background: #fafafa;
    border-bottom: 1px solid #e4e4e7;
}

.cx-table th[b-eu1rt51vj3] {
    text-align: left;
    padding: 16px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #52525b;
    text-transform: uppercase;
}

.cx-table th.cx-table-us[b-eu1rt51vj3] {
    text-align: center;
    font-size: 15px;
    font-weight: 800;
    color: #18181b;
    text-transform: none;
    letter-spacing: -0.2px;
    background: #ffffff;
}

.cx-table th.cx-table-them[b-eu1rt51vj3] {
    text-align: center;
    font-weight: 500;
    color: #a1a1aa;
    text-transform: none;
    font-size: 13px;
    letter-spacing: 0;
}

.cx-table tbody tr[b-eu1rt51vj3] { border-bottom: 1px solid #f4f4f5; }
.cx-table tbody tr:last-child[b-eu1rt51vj3] { border-bottom: none; }

.cx-table td[b-eu1rt51vj3] {
    padding: 15px 16px;
    color: #27272a;
    font-weight: 500;
}

.cx-table td.cx-table-us[b-eu1rt51vj3],
.cx-table td.cx-table-them[b-eu1rt51vj3] {
    text-align: center;
    font-size: 16px;
}

.cx-table td.cx-table-us[b-eu1rt51vj3] { background: #fafafa; }

.cx-yes[b-eu1rt51vj3]     { color: #166534; font-weight: 700; }
.cx-partial[b-eu1rt51vj3] { color: #b45309; font-weight: 700; }
.cx-no[b-eu1rt51vj3]      { color: #b91c1c; font-weight: 700; }

.cx-legend[b-eu1rt51vj3] {
    margin-top: 22px;
    font-size: 12px;
    line-height: 1.7;
    color: #71717a;
    text-align: center;
}

/* ── CTA ── */
.cx-cta[b-eu1rt51vj3] {
    padding: 96px 0;
    text-align: center;
    background-size: cover;
    background-position: center;
    border-top: 1px solid #18181b;
}

.cx-cta-title[b-eu1rt51vj3] {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1px;
    color: #ffffff;
    margin: 0 0 20px;
}

.cx-cta-sub[b-eu1rt51vj3] {
    font-size: 16px;
    line-height: 1.7;
    color: rgba(255,255,255,0.72);
    margin: 0 auto 32px;
    max-width: 640px;
}

.cx-cta-actions[b-eu1rt51vj3] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

/* ── Responsive ── */
@media (max-width: 1024px) {
    .cx-hero[b-eu1rt51vj3]        { padding: 96px 0 72px; }
    .cx-hero-h1[b-eu1rt51vj3]     { font-size: 44px; letter-spacing: -1.4px; }
    .cx-hero-lede[b-eu1rt51vj3]   { font-size: 16px; }
    .cx-section[b-eu1rt51vj3]     { padding: 72px 0; }
    .cx-h2[b-eu1rt51vj3]          { font-size: 30px; letter-spacing: -0.7px; }

    .cx-strip-grid[b-eu1rt51vj3]  { grid-template-columns: 1fr 1fr; gap: 28px 0; }
    .cx-strip-item:nth-child(2n)[b-eu1rt51vj3] { border-right: none; padding-right: 0; }
    .cx-strip-item:nth-child(2n+1)[b-eu1rt51vj3] { padding-left: 0; }

    .cx-cards[b-eu1rt51vj3]       { grid-template-columns: 1fr 1fr; gap: 24px; }
    .cx-split[b-eu1rt51vj3]       { grid-template-columns: 1fr; gap: 40px; }
    .cx-split-img img[b-eu1rt51vj3] { min-height: 300px; }
    .cx-band[b-eu1rt51vj3]        { grid-template-columns: 1fr 1fr; }
    .cx-duo[b-eu1rt51vj3]         { grid-template-columns: 1fr; gap: 40px; }
    .cx-badge-row[b-eu1rt51vj3]   { grid-template-columns: 1fr; gap: 32px; }
    .cx-tiles[b-eu1rt51vj3]       { grid-template-columns: 1fr 1fr; }
    .cx-chain[b-eu1rt51vj3]       { grid-template-columns: 1fr 1fr 1fr; gap: 24px; }
    .cx-cta-title[b-eu1rt51vj3]   { font-size: 30px; }
}

@media (max-width: 720px) {
    .cx-container[b-eu1rt51vj3]   { padding: 0 20px; }
    .cx-hero[b-eu1rt51vj3]        { padding: 72px 0 56px; }
    .cx-hero-h1[b-eu1rt51vj3]     { font-size: 33px; letter-spacing: -1px; }
    .cx-hero-lede[b-eu1rt51vj3]   { font-size: 15px; }
    .cx-hero-meta[b-eu1rt51vj3]   { gap: 24px; }
    .cx-section[b-eu1rt51vj3]     { padding: 56px 0; }
    .cx-section-head[b-eu1rt51vj3] { margin-bottom: 36px; }
    .cx-h2[b-eu1rt51vj3]          { font-size: 24px; letter-spacing: -0.5px; }

    .cx-strip-grid[b-eu1rt51vj3]  { grid-template-columns: 1fr; gap: 24px; }
    .cx-strip-item[b-eu1rt51vj3]  { border-right: none; padding: 0; }

    .cx-cards[b-eu1rt51vj3]       { grid-template-columns: 1fr; }
    .cx-rung[b-eu1rt51vj3]        { grid-template-columns: 1fr; gap: 10px; }
    .cx-rung-code[b-eu1rt51vj3]   { justify-self: start; }
    .cx-rung--2 .cx-rung-body[b-eu1rt51vj3],
    .cx-rung--3 .cx-rung-body[b-eu1rt51vj3],
    .cx-rung--4 .cx-rung-body[b-eu1rt51vj3] { padding-left: 14px; }
    .cx-band[b-eu1rt51vj3]        { grid-template-columns: 1fr; }
    .cx-tiles[b-eu1rt51vj3]       { grid-template-columns: 1fr; }
    .cx-chain[b-eu1rt51vj3]       { grid-template-columns: 1fr; }
    .cx-cta[b-eu1rt51vj3]         { padding: 64px 0; }
    .cx-cta-title[b-eu1rt51vj3]   { font-size: 26px; }
}
/* /Features/Home/Pages/Contact.razor.rz.scp.css */
/* =========================================
   Contact — restrained / serious tone
   Inter / zinc · sharp corners · single accent (zinc 900)
========================================= */

.contact-root[b-dj3lziqmlh] {
    background:  #ffffff;
    min-height:  calc(100vh - 72px);
    padding:     6rem 2rem 7rem;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    color:       #27272a;
}

.contact-inner[b-dj3lziqmlh] {
    max-width: 720px;
    margin:    0 auto;
}

/* ── Header ── */
.contact-header[b-dj3lziqmlh] {
    text-align:    left;
    margin-bottom: 3rem;
    border-bottom: 1px solid #e4e4e7;
    padding-bottom: 2rem;
}

.section-eyebrow[b-dj3lziqmlh] {
    font-size:      11px;
    font-weight:    600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color:          #71717a;
    margin-bottom:  0.75rem;
}

.contact-title[b-dj3lziqmlh] {
    font-size:      2.25rem;
    font-weight:    700;
    color:          #18181b;
    letter-spacing: -0.6px;
    line-height:    1.2;
    margin:         0 0 0.75rem;
}

.contact-subtitle[b-dj3lziqmlh] {
    font-size:   15px;
    color:       #52525b;
    line-height: 1.65;
    max-width:   560px;
    margin:      0;
}

/* ── Category ── */
.category-section[b-dj3lziqmlh] { margin-bottom: 2.5rem; }

.category-label[b-dj3lziqmlh] {
    font-size:      11px;
    font-weight:    600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color:          #71717a;
    margin-bottom:  0.85rem;
}

.category-grid[b-dj3lziqmlh] {
    display:               grid;
    grid-template-columns: repeat(3, 1fr);
    gap:                   0;
    border-top:            1px solid #e4e4e7;
    border-left:           1px solid #e4e4e7;
}

.category-card[b-dj3lziqmlh] {
    border-right:  1px solid #e4e4e7;
    border-bottom: 1px solid #e4e4e7;
    padding:       16px 18px;
    cursor:        pointer;
    background:    #ffffff;
    transition:    background 0.12s, color 0.12s;
}

.category-card:hover[b-dj3lziqmlh] {
    background: #fafafa;
}

.category-card.selected[b-dj3lziqmlh] {
    background: #18181b;
    color:      #ffffff;
}

.category-name[b-dj3lziqmlh] {
    font-size:     14px;
    font-weight:   600;
    color:         #18181b;
    margin-bottom: 0.25rem;
    letter-spacing: -0.1px;
}

.category-card.selected .category-name[b-dj3lziqmlh] { color: #ffffff; }

.category-desc[b-dj3lziqmlh] {
    font-size:   12.5px;
    color:       #71717a;
    line-height: 1.5;
}

.category-card.selected .category-desc[b-dj3lziqmlh] { color: rgba(255,255,255,0.7); }

/* ── Form panel ── */
.contact-form-panel[b-dj3lziqmlh] {
    border:     none;
    padding:    0;
    background: transparent;
}

.form-row-two[b-dj3lziqmlh] {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    gap:                   1rem;
    margin-bottom:         1rem;
}

.form-group[b-dj3lziqmlh] { margin-bottom: 1rem; }
.form-group:last-of-type[b-dj3lziqmlh] { margin-bottom: 1.5rem; }

.form-lbl[b-dj3lziqmlh] {
    display:        block;
    font-size:      11px;
    font-weight:    600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color:          #71717a;
    margin-bottom:  0.4rem;
}

.form-optional[b-dj3lziqmlh] {
    font-weight:    400;
    text-transform: none;
    letter-spacing: 0;
    color:          #a1a1aa;
}

.landing-input[b-dj3lziqmlh],
.landing-textarea[b-dj3lziqmlh] {
    width:         100%;
    background:    #ffffff;
    border:        1px solid #d4d4d8;
    border-radius: 3px;
    padding:       10px 12px;
    color:         #18181b;
    font-size:     14px;
    font-family:   inherit;
    outline:       none;
    box-sizing:    border-box;
    transition:    border-color 0.12s;
}

.landing-input:focus[b-dj3lziqmlh],
.landing-textarea:focus[b-dj3lziqmlh] {
    border-color: #18181b;
}

.landing-input[b-dj3lziqmlh]::placeholder,
.landing-textarea[b-dj3lziqmlh]::placeholder { color: #a1a1aa; }

.landing-textarea[b-dj3lziqmlh] {
    resize:      vertical;
    line-height: 1.6;
}

.form-error[b-dj3lziqmlh] {
    font-size:     13px;
    color:         #b91c1c;
    margin-bottom: 1rem;
    padding:       10px 12px;
    background:    #fef2f2;
    border-left:   3px solid #b91c1c;
}

.btn-submit[b-dj3lziqmlh] {
    padding:       10px 24px;
    background:    #18181b;
    color:         #ffffff;
    border:        none;
    border-radius: 3px;
    font-size:     14px;
    font-weight:   600;
    font-family:   inherit;
    cursor:        pointer;
    transition:    background 0.12s;
}

.btn-submit:hover[b-dj3lziqmlh]    { background: #27272a; }
.btn-submit:disabled[b-dj3lziqmlh] { background: #a1a1aa; cursor: not-allowed; }

/* ── Success ── */
.success-panel[b-dj3lziqmlh] {
    text-align: left;
    padding:    3rem 0;
    border-top: 1px solid #e4e4e7;
    margin-top: 1rem;
}

.success-icon[b-dj3lziqmlh] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           36px;
    height:          36px;
    border:          1.5px solid #18181b;
    border-radius:   50%;
    color:           #18181b;
    margin-bottom:   1.25rem;
}

.success-icon i[b-dj3lziqmlh] { font-size: 18px; }

.success-title[b-dj3lziqmlh] {
    font-size:      1.5rem;
    font-weight:    700;
    color:          #18181b;
    letter-spacing: -0.3px;
    margin:         0 0 0.5rem;
}

.success-desc[b-dj3lziqmlh] {
    font-size:   14.5px;
    color:       #52525b;
    line-height: 1.65;
    margin:      0 0 1.75rem;
}

.success-email[b-dj3lziqmlh] { color: #18181b; font-weight: 600; }

.back-link-landing[b-dj3lziqmlh] {
    font-size:       13.5px;
    font-weight:     600;
    color:           #18181b;
    text-decoration: none;
    display:         inline-flex;
    align-items:     center;
    gap:             6px;
    transition:      gap 0.15s;
}
.back-link-landing:hover[b-dj3lziqmlh] { gap: 10px; color: #18181b; }

/* ── Responsive ── */
@media (max-width: 640px) {
    .contact-root[b-dj3lziqmlh]        { padding: 4rem 1.25rem 5rem; }
    .contact-title[b-dj3lziqmlh]       { font-size: 1.75rem; }
    .category-grid[b-dj3lziqmlh]       { grid-template-columns: 1fr 1fr; }
    .form-row-two[b-dj3lziqmlh]        { grid-template-columns: 1fr; }
}

@media (max-width: 420px) {
    .category-grid[b-dj3lziqmlh] { grid-template-columns: 1fr; }
}
/* /Features/Home/Pages/Cookies.razor.rz.scp.css */
/* Legal page — Cookies */

.lp-root[b-u9uzcx4cql] {
    min-height: 70vh;
    padding: 4rem 1.5rem 6rem;
}

.lp-inner[b-u9uzcx4cql] {
    max-width: 820px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 3rem 3rem 3.5rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

@media (max-width: 720px) {
    .lp-root[b-u9uzcx4cql] { padding: 2rem 0.75rem 4rem; }
    .lp-inner[b-u9uzcx4cql] { padding: 1.75rem 1.25rem 2.25rem; border-radius: 8px; }
}

/* Header */
.lp-header[b-u9uzcx4cql] {
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}

.lp-eyebrow[b-u9uzcx4cql] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.lp-title[b-u9uzcx4cql] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 800;
    font-size: 2.25rem;
    letter-spacing: -0.02em;
    color: #18181b;
    margin: 0 0 0.75rem;
}

.lp-meta[b-u9uzcx4cql] {
    color: #6b7280;
    font-size: 0.88rem;
    margin: 0;
}

.lp-meta strong[b-u9uzcx4cql] { color: #18181b; font-weight: 600; }

.lp-dot[b-u9uzcx4cql] { margin: 0 0.5rem; color: #d1d5db; }

/* Body */
.lp-body[b-u9uzcx4cql] {
    color: #27272a;
    font-size: 0.95rem;
    line-height: 1.7;
}

.lp-intro[b-u9uzcx4cql] {
    color: #3f3f46;
    margin: 0 0 1rem;
}

.lp-section[b-u9uzcx4cql] {
    margin-top: 2.5rem;
}

.lp-h2[b-u9uzcx4cql] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    letter-spacing: -0.01em;
    color: #18181b;
    margin: 0 0 1rem;
}

.lp-h3[b-u9uzcx4cql] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    color: #27272a;
    margin: 1.5rem 0 0.5rem;
}

.lp-section p[b-u9uzcx4cql] { margin: 0 0 1rem; }

.lp-list[b-u9uzcx4cql] {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
}

.lp-list li[b-u9uzcx4cql] {
    margin-bottom: 0.4rem;
}

.lp-list--ordered[b-u9uzcx4cql] {
    list-style: decimal;
}

.lp-link[b-u9uzcx4cql] {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.lp-link:hover[b-u9uzcx4cql] {
    text-decoration: underline;
}

.lp-section code[b-u9uzcx4cql] {
    background: #f4f4f5;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85em;
    color: #18181b;
    border: 1px solid #e5e7eb;
}

/* Contact card */
.lp-contact-card[b-u9uzcx4cql] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    display: grid;
    gap: 0.6rem;
}

.lp-contact-row[b-u9uzcx4cql] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1rem;
    font-size: 0.9rem;
}

@media (max-width: 600px) {
    .lp-contact-row[b-u9uzcx4cql] { grid-template-columns: 1fr; gap: 0.15rem; }
}

.lp-contact-label[b-u9uzcx4cql] {
    color: #6b7280;
    font-weight: 600;
}

.lp-placeholder[b-u9uzcx4cql] {
    color: #a1a1aa;
    font-style: italic;
    font-size: 0.85em;
}

/* Divider before country notes */
.lp-divider[b-u9uzcx4cql] {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 3rem 0 0;
}

/* Country notes */
.lp-notes-intro[b-u9uzcx4cql] {
    color: #52525b;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}

.lp-note[b-u9uzcx4cql] {
    background: #f9fafb;
    border-left: 3px solid #d4d4d8;
    padding: 1rem 1.25rem;
    border-radius: 4px;
    margin-bottom: 1rem;
    font-size: 0.88rem;
}

.lp-note p[b-u9uzcx4cql] { margin: 0 0 0.5rem; }
.lp-note p:last-child[b-u9uzcx4cql] { margin-bottom: 0; }
.lp-note .lp-list[b-u9uzcx4cql] { font-size: 0.88rem; margin-bottom: 0.5rem; }

.lp-note-title[b-u9uzcx4cql] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: #18181b;
    margin: 0 0 0.5rem;
}
/* /Features/Home/Pages/DemoAntenna.razor.rz.scp.css */
/* Styles moved to wwwroot/css/demo-pages.css (shared across all /demo/* pages). */
/* /Features/Home/Pages/Enterprise.razor.rz.scp.css */
/* =========================================
   Enterprise — Medusa-style (zinc + Arial-bold accents)
   SOX compliance / hardware-sealed integrity
========================================= */

.ent-hero[b-mhxnd70elx],
.ent-stats[b-mhxnd70elx],
.ent-section[b-mhxnd70elx],
.ent-solution[b-mhxnd70elx],
.ent-cta[b-mhxnd70elx] {
    width: 100%;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-size: 14px;
    line-height: 21px;
    color: #313131;
}

.ent-hero *[b-mhxnd70elx],
.ent-stats *[b-mhxnd70elx],
.ent-section *[b-mhxnd70elx],
.ent-solution *[b-mhxnd70elx],
.ent-cta *[b-mhxnd70elx] { font-family: inherit; }

.ent-container[b-mhxnd70elx] {
    max-width: 1280px;
    margin:    0 auto;
    padding:   0 32px;
    width:     100%;
}

/* ── Hero ── */
.ent-hero[b-mhxnd70elx] {
    background: #ffffff;
    padding:    128px 0 80px;
    text-align: center;
}

.ent-hero .ent-container[b-mhxnd70elx] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ent-eyebrow[b-mhxnd70elx] {
    display:     inline-flex;
    align-items: center;
    gap:         8px;
    font-size:   14px;
    font-weight: 500;
    color:       #18181B;
    margin-bottom: 24px;
}

.ent-eyebrow i[b-mhxnd70elx] { font-size: 14px; }

.ent-h1[b-mhxnd70elx] {
    font-size:      72px;
    font-weight:    700;
    line-height:    1.05;
    letter-spacing: -2.4px;
    color:          #18181B;
    margin:         0 0 24px;
}

.ent-sub[b-mhxnd70elx] {
    font-size:   16px;
    line-height: 24px;
    color:       #52525B;
    max-width:   680px;
    margin:      0 0 32px;
}

[b-mhxnd70elx] .ent-sub strong {
    color:       #18181B;
    font-weight: 600;
}

.ent-hero-cta[b-mhxnd70elx] {
    display:         flex;
    gap:             12px;
    justify-content: center;
    flex-wrap:       wrap;
}

/* ── Buttons ── */
.ent-btn[b-mhxnd70elx] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    min-width:       160px;
    padding:         12px 24px;
    border-radius:   6px;
    font-family:     'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size:       14px;
    font-weight:     500;
    line-height:     20px;
    text-decoration: none;
    cursor:          pointer;
    border:          none;
    transition:      all 150ms ease;
}

.ent-btn--inverted[b-mhxnd70elx] {
    background: #27272A;
    color:      rgba(255,255,255,0.92);
    box-shadow: inset 0 0.75px 0 0 rgba(255,255,255,0.2),
                0 1px 2px 0 rgba(0,0,0,0.4),
                0 0 0 1px #18181B;
}
.ent-btn--inverted:hover[b-mhxnd70elx] { background: #3F3F46; color: rgba(255,255,255,0.92); }

.ent-btn--neutral[b-mhxnd70elx] {
    background: #ffffff;
    color:      #18181B;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12),
                0 0 0 1px rgba(0,0,0,0.08);
}
.ent-btn--neutral:hover[b-mhxnd70elx] { background: #F4F4F5; color: #18181B; }

.ent-btn--light[b-mhxnd70elx] {
    background: #ffffff;
    color:      #18181B;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12),
                0 0 0 1px rgba(0,0,0,0.08);
}
.ent-btn--light:hover[b-mhxnd70elx] { background: #F4F4F5; color: #18181B; }

/* ── Stat strip ── */
.ent-stats[b-mhxnd70elx] {
    background:    #ffffff;
    border-top:    1px solid #E4E4E7;
    border-bottom: 1px solid #E4E4E7;
}

.ent-stats-grid[b-mhxnd70elx] {
    display:         grid;
    grid-template-columns: repeat(4, 1fr);
}

.ent-stat[b-mhxnd70elx] {
    padding:      40px 32px;
    text-align:   center;
    border-right: 1px solid #E4E4E7;
}

.ent-stat:last-child[b-mhxnd70elx] { border-right: none; }

.ent-stat-num[b-mhxnd70elx] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size:   40px;
    font-weight: 700;
    line-height: 46px;
    letter-spacing: -1.2px;
    color:       #18181B;
    margin-bottom: 8px;
}

.ent-stat-label[b-mhxnd70elx] {
    font-size:   13px;
    color:       #52525B;
    line-height: 18px;
}

.ent-stat-src[b-mhxnd70elx] {
    display:     block;
    font-size:   11px;
    color:       #A1A1AA;
    margin-top:  2px;
}

/* ── Sections ── */
.ent-section[b-mhxnd70elx] {
    background: #ffffff;
    padding:    96px 0;
}

.ent-section--alt[b-mhxnd70elx] {
    background: #FAFAFA;
    border-top: 1px solid #E4E4E7;
    border-bottom: 1px solid #E4E4E7;
}

.ent-section-head[b-mhxnd70elx] {
    text-align: center;
    max-width:  680px;
    margin:     0 auto 64px;
}

.ent-kicker[b-mhxnd70elx] {
    display:        inline-block;
    font-size:      12px;
    font-weight:    600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color:          #52525B;
    margin-bottom:  16px;
}

.ent-kicker--light[b-mhxnd70elx] { color: rgba(255,255,255,0.7); }

.ent-h2[b-mhxnd70elx] {
    font-size:      56px;
    font-weight:    700;
    line-height:    1.08;
    letter-spacing: -1.8px;
    color:          #18181B;
    margin:         0 0 20px;
}

.ent-h2--light[b-mhxnd70elx] { color: #ffffff; }

.ent-section-sub[b-mhxnd70elx] {
    font-size:   16px;
    line-height: 24px;
    color:       #52525B;
    margin:      0;
}

/* ── 3-card grid ── */
.ent-gaps[b-mhxnd70elx] {
    display:   grid;
    grid-template-columns: repeat(3, 1fr);
    gap:       0;
    border:    1px solid #E4E4E7;
    background: #ffffff;
    border-radius: 12px;
    overflow:  hidden;
}

.ent-section--alt .ent-gaps[b-mhxnd70elx] { background: #ffffff; }

.ent-gap[b-mhxnd70elx] {
    padding:      40px 32px;
    border-right: 1px solid #E4E4E7;
}

.ent-gap:last-child[b-mhxnd70elx] { border-right: none; }

.ent-gap-num[b-mhxnd70elx] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size:   32px;
    font-weight: 700;
    color:       #A1A1AA;
    letter-spacing: -0.8px;
    margin-bottom: 16px;
}

.ent-gap-num--check[b-mhxnd70elx] {
    font-family: inherit !important;
    font-size:   28px;
    color:       #18181B;
}

.ent-gap-title[b-mhxnd70elx] {
    font-size:   18px;
    font-weight: 600;
    color:       #18181B;
    margin-bottom: 12px;
    line-height: 26px;
}

.ent-gap-body[b-mhxnd70elx] {
    font-size:   14px;
    color:       #52525B;
    line-height: 22px;
}

[b-mhxnd70elx] .ent-gap-body strong {
    color:       #18181B;
    font-weight: 600;
}

/* ── Solution (dark) ── */
.ent-solution[b-mhxnd70elx] {
    background: #18181B;
    padding:    112px 0;
    text-align: center;
    color:      #ffffff;
}

.ent-solution-inner[b-mhxnd70elx] {
    max-width: 900px;
    margin:    0 auto;
}

.ent-h2--light em[b-mhxnd70elx] {
    font-style: italic;
    color:      #ffffff;
    font-weight: 700;
}

.ent-patent-wrap[b-mhxnd70elx] {
    display:     inline-block;
    vertical-align: baseline;
    margin:      0 6px;
}

.ent-patent-badge[b-mhxnd70elx] {
    display:        inline-flex;
    align-items:    center;
    gap:            6px;
    font-family:    Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size:      16px;
    font-weight:    700;
    letter-spacing: -0.3px;
    padding:        4px 12px;
    border-radius:  999px;
    background:     linear-gradient(135deg, #F59E0B 0%, #FBBF24 100%);
    color:          #18181B;
    vertical-align: middle;
    transform:      translateY(-6px);
    box-shadow:     0 2px 8px rgba(251, 191, 36, 0.35);
}

.ent-patent-badge i[b-mhxnd70elx] { font-size: 14px; }

.ent-solution-sub[b-mhxnd70elx] {
    font-size:   18px;
    line-height: 28px;
    color:       rgba(255,255,255,0.75);
    max-width:   680px;
    margin:      24px auto 32px;
}

.ent-solution-proof[b-mhxnd70elx] {
    display:       inline-flex;
    align-items:   center;
    gap:           10px;
    padding:       12px 20px;
    background:    rgba(255,255,255,0.08);
    border:        1px solid rgba(255,255,255,0.15);
    border-radius: 999px;
    font-size:     13px;
    color:         rgba(255,255,255,0.9);
}

.ent-solution-proof i[b-mhxnd70elx] {
    color:     #34D399;
    font-size: 14px;
}

[b-mhxnd70elx] .ent-solution-proof strong {
    color:       #ffffff;
    font-weight: 600;
}

/* ── Flow (how it works) ── */
.ent-flow[b-mhxnd70elx] {
    display:    grid;
    grid-template-columns: repeat(4, 1fr);
    gap:        16px;
}

.ent-flow-step[b-mhxnd70elx] {
    padding:     32px 24px;
    text-align:  center;
    background:  #ffffff;
    border:      1px solid #E4E4E7;
    border-radius: 12px;
    position:    relative;
}

.ent-flow-icon[b-mhxnd70elx] {
    width:           52px;
    height:          52px;
    border-radius:   12px;
    background:      #F4F4F5;
    color:           #18181B;
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    margin-bottom:   20px;
    font-size:       22px;
}

.ent-flow-name[b-mhxnd70elx] {
    font-size:   16px;
    font-weight: 600;
    color:       #18181B;
    margin-bottom: 6px;
}

.ent-flow-desc[b-mhxnd70elx] {
    font-size:   13px;
    color:       #52525B;
    line-height: 20px;
}

/* ── Differentiators ── */
.ent-diff[b-mhxnd70elx] {
    display:    grid;
    grid-template-columns: repeat(3, 1fr);
    gap:        20px;
}

.ent-diff-card[b-mhxnd70elx] {
    background:    #ffffff;
    border:        1px solid #E4E4E7;
    border-radius: 12px;
    padding:       36px 28px;
    position:      relative;
}

.ent-diff-card--patent[b-mhxnd70elx] {
    background: #ffffff;
    box-shadow: 0 0 0 2px #18181B, 0 10px 40px rgba(24,24,27,0.08);
}

.ent-diff-patent[b-mhxnd70elx] {
    display:        inline-flex;
    align-items:    center;
    gap:            6px;
    font-family:    Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size:      11px;
    font-weight:    700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding:        4px 10px;
    border-radius:  999px;
    background:     linear-gradient(135deg, #F59E0B 0%, #FBBF24 100%);
    color:          #18181B;
    margin-bottom:  16px;
}

.ent-diff-title[b-mhxnd70elx] {
    font-size:   20px;
    font-weight: 600;
    color:       #18181B;
    margin-bottom: 12px;
    line-height: 28px;
}

.ent-diff-body[b-mhxnd70elx] {
    font-size:   14px;
    color:       #52525B;
    line-height: 22px;
}

/* ── Industries ── */
.ent-industries[b-mhxnd70elx] {
    display:    grid;
    grid-template-columns: repeat(3, 1fr);
    gap:        16px;
}

.ent-industry[b-mhxnd70elx] {
    padding:       28px;
    background:    #ffffff;
    border:        1px solid #E4E4E7;
    border-radius: 12px;
    display:       flex;
    flex-direction: column;
    gap:           6px;
}

.ent-industry > i[b-mhxnd70elx] {
    font-size:    28px;
    color:        #18181B;
    margin-bottom: 12px;
}

.ent-industry-name[b-mhxnd70elx] {
    font-size:   16px;
    font-weight: 600;
    color:       #18181B;
}

.ent-industry-tag[b-mhxnd70elx] {
    font-size: 13px;
    color:     #71717A;
}

/* ── Final CTA ── */
.ent-cta[b-mhxnd70elx] {
    background:    #18181B;
    padding:       112px 0;
    text-align:    center;
    color:         #ffffff;
}

.ent-cta .ent-h2[b-mhxnd70elx] { margin-bottom: 16px; }
.ent-cta .ent-solution-sub[b-mhxnd70elx] { margin: 0 auto 32px; }
.ent-cta .ent-hero-cta[b-mhxnd70elx] { justify-content: center; }

/* ── 5-card variant for "five problems" ── */
.ent-gaps--five[b-mhxnd70elx] {
    grid-template-columns: repeat(5, 1fr);
}

/* ── Two Deployment Modes (★ core differentiator) ── */
.ent-modes[b-mhxnd70elx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.ent-mode[b-mhxnd70elx] {
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 12px;
    padding: 36px 32px;
    display: flex;
    flex-direction: column;
    position: relative;
}

.ent-mode--recommended[b-mhxnd70elx] {
    border-color: #18181B;
    box-shadow: 0 0 0 1px #18181B, 0 12px 36px -12px rgba(24,24,27,0.18);
}

.ent-mode-tag[b-mhxnd70elx] {
    display: inline-block;
    align-self: flex-start;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: 999px;
    background: #18181B;
    color: #ffffff;
    margin-bottom: 24px;
}

.ent-mode-tag--alt[b-mhxnd70elx] {
    background: #F4F4F5;
    color: #52525B;
    border: 1px solid #E4E4E7;
}

.ent-mode-name[b-mhxnd70elx] {
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.6px;
    color: #18181B;
    margin-bottom: 8px;
    line-height: 1.2;
}

.ent-mode-tagline[b-mhxnd70elx] {
    font-size: 15px;
    color: #18181B;
    font-weight: 500;
    margin-bottom: 16px;
    line-height: 1.45;
}

.ent-mode-body[b-mhxnd70elx] {
    font-size: 14.5px;
    color: #52525B;
    line-height: 1.65;
    margin: 0 0 20px;
}

[b-mhxnd70elx] .ent-mode-body strong { color: #18181B; font-weight: 600; }

.ent-mode-list[b-mhxnd70elx] {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    border-top: 1px solid #E4E4E7;
}

.ent-mode-list li[b-mhxnd70elx] {
    font-size: 13.5px;
    color: #27272a;
    line-height: 1.55;
    padding: 12px 0 12px 22px;
    border-bottom: 1px solid #F4F4F5;
    position: relative;
}

.ent-mode-list li:last-child[b-mhxnd70elx] { border-bottom: none; }

.ent-mode-list li[b-mhxnd70elx]::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 18px;
    width: 8px;
    height: 8px;
    background: #18181B;
    border-radius: 2px;
}

.ent-mode-deploy[b-mhxnd70elx] {
    margin-top: auto;
    padding-top: 16px;
    border-top: 1px solid #E4E4E7;
    font-size: 13px;
    color: #52525B;
    line-height: 1.5;
}

.ent-mode-deploy-label[b-mhxnd70elx] {
    font-weight: 600;
    color: #18181B;
    margin-right: 4px;
}

/* ── Data Sovereignty grid (inside dark .ent-solution section) ── */
.ent-sov-grid[b-mhxnd70elx] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1px;
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 12px;
    overflow: hidden;
    margin-top: 36px;
}

.ent-sov-item[b-mhxnd70elx] {
    background: #18181B;
    padding: 24px 20px;
    text-align: left;
}

.ent-sov-label[b-mhxnd70elx] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #34D399;
    margin-bottom: 10px;
}

.ent-sov-body[b-mhxnd70elx] {
    font-size: 13.5px;
    color: rgba(255,255,255,0.78);
    line-height: 1.55;
}

/* ── Five Reasons / Capability → Need map ── */
.ent-fit[b-mhxnd70elx] {
    border-top: 1px solid #E4E4E7;
}

.ent-fit-row[b-mhxnd70elx] {
    display: grid;
    grid-template-columns: 1fr 56px 1fr;
    gap: 24px;
    padding: 32px 0;
    border-bottom: 1px solid #E4E4E7;
    align-items: start;
}

.ent-fit-cap-eyebrow[b-mhxnd70elx],
.ent-fit-need-eyebrow[b-mhxnd70elx] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #71717A;
    margin-bottom: 8px;
}

.ent-fit-need-eyebrow[b-mhxnd70elx] { color: #b91c1c; }
.ent-fit-cap-eyebrow[b-mhxnd70elx]  { color: #166534; }

.ent-fit-cap-name[b-mhxnd70elx],
.ent-fit-need-name[b-mhxnd70elx] {
    font-size: 19px;
    font-weight: 700;
    color: #18181B;
    margin-bottom: 10px;
    line-height: 1.3;
    letter-spacing: -0.3px;
}

.ent-fit-cap-body[b-mhxnd70elx],
.ent-fit-need-body[b-mhxnd70elx] {
    font-size: 14px;
    color: #52525B;
    line-height: 1.65;
    margin: 0;
}

.ent-fit-arrow[b-mhxnd70elx] {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #A1A1AA;
    font-size: 22px;
    padding-top: 28px;
}

/* ── Tier strip ── */
.ent-tier-strip[b-mhxnd70elx] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border: 1px solid #E4E4E7;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
}

.ent-tier[b-mhxnd70elx] {
    padding: 28px 24px;
    border-right: 1px solid #E4E4E7;
    text-align: left;
}

.ent-tier:last-child[b-mhxnd70elx] { border-right: none; }

.ent-tier-badge[b-mhxnd70elx] {
    display: inline-block;
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #ffffff;
    background: #18181B;
    padding: 3px 9px;
    border-radius: 4px;
    margin-bottom: 14px;
}

.ent-tier-name[b-mhxnd70elx] {
    font-size: 20px;
    font-weight: 700;
    color: #18181B;
    margin-bottom: 8px;
    letter-spacing: -0.3px;
}

.ent-tier-tech[b-mhxnd70elx] {
    font-size: 13px;
    color: #52525B;
    line-height: 1.5;
    margin-bottom: 14px;
    min-height: 39px;
}

.ent-tier-target[b-mhxnd70elx] {
    font-size: 12px;
    color: #71717A;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
    padding-top: 12px;
    border-top: 1px solid #E4E4E7;
}

.ent-tier-foot[b-mhxnd70elx],
.ent-patent-foot[b-mhxnd70elx] {
    margin-top: 32px;
    text-align: center;
}

.ent-foot-link[b-mhxnd70elx] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #18181B;
    text-decoration: none;
    transition: gap 0.15s;
}

.ent-foot-link:hover[b-mhxnd70elx] { gap: 10px; color: #18181B; }

/* ── Compliance grid ── */
.ent-comp[b-mhxnd70elx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.ent-comp-group[b-mhxnd70elx] {
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 12px;
    padding: 24px 24px 16px;
}

.ent-comp-group-name[b-mhxnd70elx] {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #71717A;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E4E4E7;
}

.ent-comp-list[b-mhxnd70elx] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ent-comp-list li[b-mhxnd70elx] {
    font-size: 13.5px;
    color: #18181B;
    font-weight: 500;
    padding: 6px 0 6px 20px;
    position: relative;
    line-height: 1.5;
}

.ent-comp-list li[b-mhxnd70elx]::before {
    content: "";
    position: absolute;
    left: 0;
    top: 13px;
    width: 6px;
    height: 6px;
    background: #166534;
    border-radius: 50%;
}

/* ── SLA strip ── */
.ent-sla[b-mhxnd70elx] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border: 1px solid #E4E4E7;
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
}

.ent-sla-col[b-mhxnd70elx] {
    padding: 36px 32px;
    border-right: 1px solid #E4E4E7;
}

.ent-sla-col:last-child[b-mhxnd70elx] { border-right: none; }

.ent-sla-col .ent-kicker[b-mhxnd70elx] { margin-bottom: 14px; }

.ent-sla-num[b-mhxnd70elx] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size: 44px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -1.4px;
    color: #18181B;
    margin-bottom: 6px;
}

.ent-sla-name[b-mhxnd70elx] {
    font-size: 14px;
    color: #71717A;
    font-weight: 500;
    margin-bottom: 14px;
    text-transform: lowercase;
}

.ent-sla-body[b-mhxnd70elx] {
    font-size: 13.5px;
    color: #52525B;
    line-height: 1.65;
    margin: 0;
}

/* ── Ghost-light button (for dark CTA section) ── */
.ent-btn--ghost-light[b-mhxnd70elx] {
    background: transparent;
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.28);
}
.ent-btn--ghost-light:hover[b-mhxnd70elx] { background: rgba(255,255,255,0.08); color: #ffffff; }

/* =========================================
   Responsive
========================================= */
@media (max-width: 1024px) {
    .ent-stats-grid[b-mhxnd70elx]     { grid-template-columns: repeat(2, 1fr); }
    .ent-stat:nth-child(2)[b-mhxnd70elx] { border-right: none; }
    .ent-stat:nth-child(1)[b-mhxnd70elx],
    .ent-stat:nth-child(2)[b-mhxnd70elx] { border-bottom: 1px solid #E4E4E7; }

    .ent-gaps[b-mhxnd70elx],
    .ent-flow[b-mhxnd70elx],
    .ent-diff[b-mhxnd70elx],
    .ent-industries[b-mhxnd70elx]    { grid-template-columns: repeat(2, 1fr); }

    .ent-gaps--five[b-mhxnd70elx]    { grid-template-columns: repeat(2, 1fr); }

    .ent-gap[b-mhxnd70elx]           { border-right: none; border-bottom: 1px solid #E4E4E7; }
    .ent-gap:nth-child(2n)[b-mhxnd70elx] { border-right: none; }

    .ent-modes[b-mhxnd70elx]         { grid-template-columns: 1fr; }
    .ent-sov-grid[b-mhxnd70elx]      { grid-template-columns: repeat(2, 1fr); }
    .ent-tier-strip[b-mhxnd70elx]    { grid-template-columns: repeat(2, 1fr); }
    .ent-tier:nth-child(2)[b-mhxnd70elx]  { border-right: none; }
    .ent-tier:nth-child(1)[b-mhxnd70elx],
    .ent-tier:nth-child(2)[b-mhxnd70elx]  { border-bottom: 1px solid #E4E4E7; }
    .ent-comp[b-mhxnd70elx]          { grid-template-columns: repeat(2, 1fr); }
    .ent-sla[b-mhxnd70elx]           { grid-template-columns: 1fr; }
    .ent-sla-col[b-mhxnd70elx]       { border-right: none; border-bottom: 1px solid #E4E4E7; }
    .ent-sla-col:last-child[b-mhxnd70elx] { border-bottom: none; }

    .ent-fit-row[b-mhxnd70elx]       { grid-template-columns: 1fr; gap: 16px; }
    .ent-fit-arrow[b-mhxnd70elx]     { transform: rotate(90deg); padding: 0; justify-content: flex-start; }
}

@media (max-width: 768px) {
    .ent-hero[b-mhxnd70elx]          { padding: 80px 0 48px; }
    .ent-h1[b-mhxnd70elx]            { font-size: 40px; line-height: 1.1; letter-spacing: -1.2px; }
    .ent-h2[b-mhxnd70elx]            { font-size: 32px; line-height: 1.1; letter-spacing: -0.8px; }
    .ent-sub[b-mhxnd70elx]           { font-size: 14px; line-height: 21px; }
    .ent-container[b-mhxnd70elx]     { padding: 0 16px; }

    .ent-section[b-mhxnd70elx]       { padding: 64px 0; }
    .ent-solution[b-mhxnd70elx]      { padding: 80px 0; }
    .ent-cta[b-mhxnd70elx]           { padding: 80px 0; }

    .ent-stats-grid[b-mhxnd70elx],
    .ent-gaps[b-mhxnd70elx],
    .ent-flow[b-mhxnd70elx],
    .ent-diff[b-mhxnd70elx],
    .ent-industries[b-mhxnd70elx]    { grid-template-columns: 1fr; }

    .ent-gaps--five[b-mhxnd70elx]    { grid-template-columns: 1fr; }

    .ent-stat[b-mhxnd70elx]          { border-right: none !important; border-bottom: 1px solid #E4E4E7; }
    .ent-stat:last-child[b-mhxnd70elx] { border-bottom: none; }
    .ent-stat-num[b-mhxnd70elx]      { font-size: 32px; line-height: 38px; }

    .ent-gap[b-mhxnd70elx]           { border-right: none; border-bottom: 1px solid #E4E4E7; }
    .ent-gap:last-child[b-mhxnd70elx] { border-bottom: none; }

    .ent-patent-badge[b-mhxnd70elx]  { font-size: 13px; padding: 3px 10px; transform: translateY(-4px); }

    .ent-mode[b-mhxnd70elx]          { padding: 28px 22px; }
    .ent-mode-name[b-mhxnd70elx]     { font-size: 24px; }
    .ent-sov-grid[b-mhxnd70elx]      { grid-template-columns: 1fr; }
    .ent-tier-strip[b-mhxnd70elx]    { grid-template-columns: 1fr; }
    .ent-tier[b-mhxnd70elx]          { border-right: none !important; border-bottom: 1px solid #E4E4E7; }
    .ent-tier:last-child[b-mhxnd70elx] { border-bottom: none; }
    .ent-tier-tech[b-mhxnd70elx]     { min-height: 0; }
    .ent-comp[b-mhxnd70elx]          { grid-template-columns: 1fr; }
    .ent-sla-num[b-mhxnd70elx]       { font-size: 36px; }
}

/* [2026-08-02] 티어→플랜 배지 + 자동 활성화 안내 (Security Tier 축을 Pricing/OrgSettings 와 정렬) */
.ent-tier-plan[b-mhxnd70elx] {
    margin-top: .5rem;
    display: inline-block;
    padding: .15rem .5rem;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    opacity: .85;
}
.ent-tier-note[b-mhxnd70elx] {
    margin: 0 0 .9rem;
    font-size: .82rem;
    line-height: 1.6;
    opacity: .78;
}
/* /Features/Home/Pages/Events.razor.rz.scp.css */
/* =========================================
   Events page — subscription form + success modal
   ========================================= */

/* ── Subscription form ── */
.evt-sub-form[b-2b5gg5coge] {
    display: inline-flex;
    align-items: stretch;
    gap: 0.6rem;
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
    max-width: 560px;
    margin: 0.5rem auto 0;
}

.evt-sub-input[b-2b5gg5coge] {
    flex: 1 1 240px;
    min-width: 0;
    padding: 0.7rem 1rem;
    border: 1px solid #d4d4d8;
    border-radius: 8px;
    background: #ffffff;
    color: #18181b;
    font-size: 0.95rem;
    font-family: inherit;
    transition: border-color 0.15s, box-shadow 0.15s;
}

.evt-sub-input[b-2b5gg5coge]::placeholder { color: #a1a1aa; }

.evt-sub-input:focus[b-2b5gg5coge] {
    outline: none;
    border-color: #18181b;
    box-shadow: 0 0 0 3px rgba(24, 24, 27, 0.08);
}

.evt-sub-input:disabled[b-2b5gg5coge] {
    background: #f4f4f5;
    cursor: not-allowed;
}

.evt-sub-btn[b-2b5gg5coge] {
    flex: 0 0 auto;
    white-space: nowrap;
    border: none;
    cursor: pointer;
}

.evt-sub-btn:disabled[b-2b5gg5coge] {
    opacity: 0.55;
    cursor: not-allowed;
}

.evt-sub-back[b-2b5gg5coge] { flex: 0 0 auto; }

.evt-sub-error[b-2b5gg5coge] {
    color: #b91c1c;
    font-size: 0.85rem;
    margin: 0.85rem 0 0;
    text-align: center;
}

/* ── Business-email hint ── */
.evt-sub-hint[b-2b5gg5coge] {
    font-size:    0.78rem;
    color:        #6b7280;
    text-align:   center;
    margin:       0.85rem 0 0;
    line-height:  1.5;
}
.evt-sub-hint strong[b-2b5gg5coge] { color: #18181b; }

/* ── Turnstile captcha widget container ── */
.evt-sub-captcha[b-2b5gg5coge] {
    display:         flex;
    justify-content: center;
    margin:          1.25rem 0 0;
    min-height:      65px;  /* reserve space so layout doesn't jump on widget render */
}

/* Skeleton placeholder — shown until the Turnstile widget renders.
   turnstile.js sets data-loaded="true" on the container once render() returns,
   which removes the shimmer and the placeholder text. The skeleton text is
   absolutely positioned so the actual Turnstile iframe lays out normally and
   isn't pushed sideways by the placeholder span. */
.turnstile-skeleton[b-2b5gg5coge] {
    position:         relative;
    width:            300px;
    min-height:       65px;
    border-radius:    8px;
    background:       linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%);
    background-size:  200% 100%;
    animation:        evt-turnstile-shimmer-b-2b5gg5coge 1.4s ease-in-out infinite;
    border:           1px solid #e2e8f0;
}
.turnstile-skeleton-text[b-2b5gg5coge] {
    position:         absolute;
    inset:            0;
    display:          flex;
    align-items:      center;
    justify-content:  center;
    font-size:        0.78rem;
    color:            #94a3b8;
    font-weight:      500;
    letter-spacing:   0.02em;
    pointer-events:   none;
}
.turnstile-skeleton[data-loaded][b-2b5gg5coge] {
    background: transparent;
    animation: none;
    border: none;
    width: auto;       /* let the real widget dictate its own size */
    min-height: 0;
}
.turnstile-skeleton[data-loaded] .turnstile-skeleton-text[b-2b5gg5coge] {
    display: none;
}
@keyframes evt-turnstile-shimmer-b-2b5gg5coge {
    0%   { background-position: 100% 0; }
    100% { background-position: -100% 0; }
}

/* ── Success modal ── */
.evt-modal-overlay[b-2b5gg5coge] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    padding: 1rem;
    animation: evtFadeIn-b-2b5gg5coge 0.18s ease;
}

.evt-modal[b-2b5gg5coge] {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.24);
    padding: 2.4rem 2rem 1.8rem;
    max-width: 440px;
    width: 100%;
    text-align: center;
    animation: evtSlideUp-b-2b5gg5coge 0.22s ease;
}

.evt-modal-icon[b-2b5gg5coge] {
    color: #22c55e;
    font-size: 3rem;
    line-height: 1;
    margin-bottom: 1rem;
}

.evt-modal-title[b-2b5gg5coge] {
    font-size: 1.35rem;
    font-weight: 800;
    color: #18181b;
    margin: 0 0 0.6rem;
    letter-spacing: -0.02em;
}

.evt-modal-desc[b-2b5gg5coge] {
    font-size: 0.92rem;
    color: #52525b;
    line-height: 1.6;
    margin: 0 0 1.6rem;
}

.evt-modal-close[b-2b5gg5coge] {
    width: 100%;
    justify-content: center;
    border: none;
    cursor: pointer;
}

@keyframes evtFadeIn-b-2b5gg5coge {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes evtSlideUp-b-2b5gg5coge {
    from { opacity: 0; transform: translateY(12px) scale(0.98); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ── Responsive ── */
@media (max-width: 560px) {
    .evt-sub-form[b-2b5gg5coge]  { flex-direction: column; }
    .evt-sub-input[b-2b5gg5coge] { width: 100%; }
    .evt-sub-btn[b-2b5gg5coge],
    .evt-sub-back[b-2b5gg5coge]  { width: 100%; justify-content: center; }
}
/* /Features/Home/Pages/Faq.razor.rz.scp.css */
/* =========================================
   FAQ page — light theme (matches Privacy/Terms/Refund)
========================================= */

/* 아이템 열고 닫을 때 페이지 scrollbar 등장 / 사라짐 으로 viewport width
   가 살짝 흔들리는 현상 방지 — scrollbar 자리를 항상 예약. */
:root[b-yuppkm3rvj] { scrollbar-gutter: stable; }

.faq-root[b-yuppkm3rvj] {
    min-height: calc(100vh - 72px);
    padding:    5rem 2rem 6rem;
    /* LandingLayout 의 .landing-content 가 flex + align-items:center 라
       direct child 가 shrink-to-fit. width:100% + align-self:stretch 안 박으면
       내부 .faq-inner 의 max-width:1200 이 의미 없어짐 (메모리 룰 참조). */
    width:       100%;
    align-self:  stretch;
    box-sizing:  border-box;
}

.faq-inner[b-yuppkm3rvj] {
    max-width: 1200px;   /* landing-site 기본 1280px 와 정합 (좌우 padding 80px 감안) */
    width:     100%;     /* parent flex/grid 가 아닌 환경에서도 width 고정 */
    margin:    0 auto;
}

/* 답변 본문은 가독성을 위해 760px 로 별도 제한 (line-length ≤ 80자 유지) */
.faq-answer[b-yuppkm3rvj] {
    max-width: 880px;
}

/* faq-list 자체가 답변 펼침으로 width 변화 일으키지 않도록 box-sizing 고정 */
.faq-list[b-yuppkm3rvj] {
    width: 100%;
    box-sizing: border-box;
}

/* ── Header ── */
.faq-header[b-yuppkm3rvj] {
    text-align:    center;
    margin-bottom: 3rem;
}

.section-eyebrow[b-yuppkm3rvj] {
    font-size:      0.72rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color:          #6366f1;
    margin-bottom:  0.75rem;
}

.faq-title[b-yuppkm3rvj] {
    font-size:      3rem;
    font-weight:    900;
    color:          #18181b;
    letter-spacing: -0.04em;
    margin:         0 0 1rem;
}

.faq-subtitle[b-yuppkm3rvj] {
    font-size:   0.95rem;
    color:       #6b7280;
    line-height: 1.7;
}

.faq-contact-link[b-yuppkm3rvj] {
    color:           #2563eb;
    font-weight:     600;
    text-decoration: none;
    transition:      color 0.15s;
}
.faq-contact-link:hover[b-yuppkm3rvj] { color: #1d4ed8; }

/* ── Category filter ── */
.faq-filters[b-yuppkm3rvj] {
    display:         flex;
    gap:             0.5rem;
    flex-wrap:       wrap;
    justify-content: center;
    margin-bottom:   2.5rem;
}

.faq-filter-btn[b-yuppkm3rvj] {
    padding:       0.45rem 1.1rem;
    border-radius: 20px;
    font-size:     0.78rem;
    font-weight:   600;
    cursor:        pointer;
    transition:    all 0.15s;
    background:    #ffffff;
    border:        1px solid #e5e7eb;
    color:         #52525b;
}

.faq-filter-btn:hover[b-yuppkm3rvj] {
    background:   #f4f4f5;
    border-color: #d1d5db;
    color:        #18181b;
}

.faq-filter-btn.active[b-yuppkm3rvj] {
    background:   #18181b;
    border-color: #18181b;
    color:        #ffffff;
}

/* ── Group ── */
.faq-list[b-yuppkm3rvj]  { margin-bottom: 4rem; }
.faq-group[b-yuppkm3rvj] { margin-bottom: 2.5rem; }

.faq-group-title[b-yuppkm3rvj] {
    font-size:      0.7rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color:          #6b7280;
    padding-bottom: 0.75rem;
    margin-bottom:  0.5rem;
    border-bottom:  1px solid #e5e7eb;
}

/* ── Item ── */
.faq-item[b-yuppkm3rvj] {
    border-bottom: 1px solid #e5e7eb;
}

.faq-question[b-yuppkm3rvj] {
    width:           100%;
    text-align:      left;
    background:      none;
    border:          none;
    padding:         1.25rem 0;
    cursor:          pointer;
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    gap:             1rem;
    color:           #18181b;
    font-size:       0.92rem;
    font-weight:     600;
    line-height:     1.4;
    font-family:     inherit;
    transition:      color 0.15s;
}

.faq-question:hover[b-yuppkm3rvj] { color: #2563eb; }
.faq-item.open .faq-question[b-yuppkm3rvj] { color: #2563eb; }

.faq-icon[b-yuppkm3rvj] {
    color:      #9ca3af;
    flex-shrink: 0;
    font-size:  1rem;
    transition: transform 0.2s, color 0.15s;
}
.faq-item.open .faq-icon[b-yuppkm3rvj] { color: #2563eb; }

.faq-answer[b-yuppkm3rvj] {
    padding:     0 0 1.25rem;
    font-size:   0.85rem;
    color:       #52525b;
    line-height: 1.8;
    animation:   faqFadeIn-b-yuppkm3rvj 0.2s ease;
}

.faq-answer strong[b-yuppkm3rvj] { color: #18181b; }

.faq-inline-link[b-yuppkm3rvj] {
    color:           #2563eb;
    font-weight:     600;
    text-decoration: none;
}
.faq-inline-link:hover[b-yuppkm3rvj] { color: #1d4ed8; text-decoration: underline; }

@keyframes faqFadeIn-b-yuppkm3rvj {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── CTA ── */
.faq-cta[b-yuppkm3rvj] {
    text-align:    center;
    padding:       3rem 2rem;
    border:        1px solid #e5e7eb;
    border-radius: 16px;
    background:    #f9fafb;
}

.faq-cta-title[b-yuppkm3rvj] {
    font-size:     1.1rem;
    font-weight:   700;
    color:         #18181b;
    margin-bottom: 0.5rem;
}

.faq-cta-desc[b-yuppkm3rvj] {
    font-size:     0.82rem;
    color:         #6b7280;
    margin-bottom: 1.5rem;
}

.btn-submit[b-yuppkm3rvj] {
    display:       inline-flex;
    align-items:   center;
    gap:           0.4rem;
    padding:       0.8rem 2.2rem;
    background:    var(--ah-accent);
    color:         #fff;
    border:        none;
    border-radius: 8px;
    font-size:     0.9rem;
    font-weight:   700;
    cursor:        pointer;
    text-decoration: none;
    transition:    opacity 0.15s, transform 0.15s;
}
.btn-submit:hover[b-yuppkm3rvj]    { opacity: 0.9; transform: translateY(-1px); color: #fff; }
.btn-submit:disabled[b-yuppkm3rvj] { opacity: 0.5; cursor: not-allowed; transform: none; }

/* ── Responsive ── */
@media (max-width: 640px) {
    .faq-title[b-yuppkm3rvj]    { font-size: 2.2rem; }
    .faq-filters[b-yuppkm3rvj]  { justify-content: flex-start; }
}
/* /Features/Home/Pages/Home.razor.rz.scp.css */
/* =========================================
   Medusa B2B-style Hero + Organizations mockup
========================================= */

.mhero[b-c0nek19kh7],
.mhero-mockup[b-c0nek19kh7] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

.mhero *[b-c0nek19kh7],
.mhero-mockup *[b-c0nek19kh7] { font-family: inherit; }

.mhero[b-c0nek19kh7] {
    padding: 112px 64px 88px;
    text-align: center;
    position: relative;
    background: #FAFAFA;
    width: 100%;
    align-self: stretch;
    box-sizing: border-box;
    border-bottom: 1px solid #D4D4D8;
}

/* Vertical side rails (Medusa B2B 1280px 2-col layout) */
.mhero-rails[b-c0nek19kh7] {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1280px;
    height: 100%;
    pointer-events: none;
    display: flex;
}

.mhero-rail[b-c0nek19kh7] {
    flex: 1;
    border-left: 1px solid #D4D4D8;
    height: 100%;
}

.mhero-rail--r[b-c0nek19kh7] {
    border-left: none;
    border-right: 1px solid #D4D4D8;
}

.mhero-container[b-c0nek19kh7] {
    max-width: 1080px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mhero-eyebrow[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #18181B;
    margin-bottom: 24px;
}

.mhero-eyebrow i[b-c0nek19kh7] { font-size: 14px; }

.mhero-h1[b-c0nek19kh7] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 64px;
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -2.6px;
    color: #18181B;
    margin: 0 0 24px;
    transition: opacity 500ms cubic-bezier(.4,0,.2,1);
    opacity: 1;
}

.mhero-h1.fading[b-c0nek19kh7] { opacity: 0; }

.mhero-sub[b-c0nek19kh7] {
    font-size: 16px;
    line-height: 24px;
    color: #52525B;
    max-width: 680px;
    margin: 0 0 16px;
    transition: opacity 500ms cubic-bezier(.4,0,.2,1);
    opacity: 1;
}

.mhero-sub.fading[b-c0nek19kh7] { opacity: 0; }

.mhero-sub strong[b-c0nek19kh7] {
    color: #18181B;
    font-weight: 600;
}

.mhero-cta[b-c0nek19kh7] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.mhero-microline[b-c0nek19kh7] {
    margin-top: 16px;
    font-size: 13px;
    line-height: 20px;
    color: #71717A;
    letter-spacing: 0.1px;
}

.m-btn[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border-radius: 6px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    transition: background 150ms ease, box-shadow 150ms ease;
}

.m-btn--neutral[b-c0nek19kh7] {
    background: #ffffff;
    color: #18181B;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.08);
}
.m-btn--neutral:hover[b-c0nek19kh7] { background: #F4F4F5; color: #18181B; }

.m-btn--inverted[b-c0nek19kh7] {
    background: #27272A;
    color: rgba(255,255,255,0.92);
    box-shadow: inset 0 0.75px 0 0 rgba(255,255,255,0.2),
                0 1px 2px 0 rgba(0,0,0,0.4),
                0 0 0 1px #18181B;
}
.m-btn--inverted:hover[b-c0nek19kh7] { background: #3F3F46; color: rgba(255,255,255,0.92); }

/* ── Organizations mockup (tilted, slightly cut — Medusa B2B style) ── */
/* Hero intro video — 45s company introduction, sits between hero and mockup */
.mhero-video[b-c0nek19kh7] {
    padding: 48px 32px 0;
    background: #FAFAFA;
    position: relative;
    width: 100%;
    align-self: stretch;
    box-sizing: border-box;
}

.mhero-video-stage[b-c0nek19kh7] {
    max-width: 1180px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.mhero-video-player[b-c0nek19kh7] {
    display: block;
    width: 100%;
    background: #18181B;
}

.mhero-mockup[b-c0nek19kh7] {
    padding: 0 32px 0;
    background: #FAFAFA;
    position: relative;
    overflow: hidden;
    width: 100%;
    align-self: stretch;
    box-sizing: border-box;
}

.mhero-mockup .mhero-rails[b-c0nek19kh7] {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1280px;
    height: 100%;
    display: flex;
    pointer-events: none;
    background: #E4E4E4;
}

.mhero-trust-chips[b-c0nek19kh7] {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 24px 16px 20px;
    font-size: 12.5px;
    color: #52525B;
    background: #FAFAFA;
}

.mhero-trust-chips span[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.mhero-trust-chips i[b-c0nek19kh7] {
    font-size: 13px;
    color: #18181B;
}

.mhero-chip-dot[b-c0nek19kh7] {
    color: #A1A1AA;
}

.mhero-stage[b-c0nek19kh7] {
    max-width: 1180px;
    margin: 0 auto -160px;
    padding: 14px 14px 0;
    border: 1px solid #E4E4E7;
    border-bottom: none;
    border-radius: 32px 32px 0 0;
    background: rgba(24, 24, 27, 0.02);
    overflow: hidden;
    position: relative;
    z-index: 1;
    transform: rotate(-3deg);
    box-shadow: none;
}

.mw[b-c0nek19kh7] {
    background: #ffffff;
    border-radius: 18px 18px 0 0;
    overflow: hidden;
    box-shadow: none;
}

.mw-top[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 16px;
    background: #FAFAFA;
    border-bottom: 1px solid #E4E4E7;
}

.mw-dots[b-c0nek19kh7] { display: flex; gap: 6px; }
.mw-dots span[b-c0nek19kh7] { width: 11px; height: 11px; border-radius: 999px; }
.mw-dots span:nth-child(1)[b-c0nek19kh7] { background: #FF5F57; }
.mw-dots span:nth-child(2)[b-c0nek19kh7] { background: #FEBC2E; }
.mw-dots span:nth-child(3)[b-c0nek19kh7] { background: #28C840; }

.mw-url[b-c0nek19kh7] {
    flex: 1;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 12px;
    color: #71717A;
    text-align: center;
    padding: 4px 12px;
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mw-body[b-c0nek19kh7] { padding: 28px 32px 24px; }

.mw-titlebar[b-c0nek19kh7] {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 24px;
}

.mw-title[b-c0nek19kh7] {
    font-size: 24px;
    font-weight: 700;
    color: #18181B;
    letter-spacing: -0.6px;
}

.mw-subtitle[b-c0nek19kh7] {
    font-size: 13px;
    color: #71717A;
    margin-top: 4px;
}

.mw-btn[b-c0nek19kh7] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size: 12px;
    font-weight: 500;
    padding: 8px 14px;
    border-radius: 6px;
    background: #27272A;
    color: rgba(255,255,255,0.92);
    border: none;
    cursor: pointer;
    box-shadow: inset 0 0.75px 0 0 rgba(255,255,255,0.2), 0 0 0 1px #18181B;
}

/* Stats */
.mw-stats[b-c0nek19kh7] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 20px;
}

.mw-stat[b-c0nek19kh7] {
    padding: 18px 20px;
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    background: #ffffff;
}

.mw-stat-num[b-c0nek19kh7] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', sans-serif !important;
    font-size: 28px;
    font-weight: 700;
    color: #18181B;
    line-height: 1;
    letter-spacing: -0.8px;
}

.mw-stat-label[b-c0nek19kh7] {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #71717A;
    margin-top: 8px;
}

/* Search */
.mw-search[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    background: #ffffff;
    margin-bottom: 16px;
    color: #A1A1AA;
    font-size: 13px;
}
.mw-search i[b-c0nek19kh7] { font-size: 14px; }

/* Table */
.mw-table[b-c0nek19kh7] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.mw-table thead th[b-c0nek19kh7] {
    text-align: left;
    padding: 10px 12px;
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #71717A;
    border-bottom: 1px solid #E4E4E7;
}

.mw-table thead th.mw-num[b-c0nek19kh7],
.mw-table tbody td.mw-num[b-c0nek19kh7] {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.mw-table tbody tr[b-c0nek19kh7] {
    border-bottom: 1px solid #F4F4F5;
}
.mw-table tbody tr:last-child[b-c0nek19kh7] { border-bottom: none; }

.mw-table tbody td[b-c0nek19kh7] {
    padding: 12px;
    color: #313131;
    vertical-align: middle;
}

.mw-org[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.mw-org > i[b-c0nek19kh7] {
    width: 32px;
    height: 32px;
    border-radius: 6px;
    background: #F4F4F5;
    color: #52525B;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    flex-shrink: 0;
}

.mw-org--indent[b-c0nek19kh7] { padding-left: 36px; }
.mw-org--indent > i[b-c0nek19kh7] { background: #FAFAFA; color: #71717A; }

.mw-org-name[b-c0nek19kh7] {
    font-size: 13.5px;
    font-weight: 600;
    color: #18181B;
}

.mw-tag[b-c0nek19kh7] {
    display: inline-block;
    font-size: 10.5px;
    font-weight: 500;
    padding: 1px 7px;
    border-radius: 4px;
    background: #F4F4F5;
    color: #52525B;
    margin-top: 3px;
}

.mw-role[b-c0nek19kh7] {
    display: inline-block;
    font-size: 10.5px;
    color: #71717A;
    margin-left: 6px;
    padding: 1px 7px;
    background: #FAFAFA;
    border: 1px solid #E4E4E7;
    border-radius: 4px;
}

/* SubOrg group row */
.mw-suborg-head td[b-c0nek19kh7] {
    background: #FAFAFA;
    padding: 10px 14px !important;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #52525B;
    border-top: 1px solid #E4E4E7;
    border-bottom: 1px solid #E4E4E7;
}

.mw-suborg-head td i[b-c0nek19kh7] {
    margin-right: 6px;
    color: #71717A;
}

.mw-sub-chev[b-c0nek19kh7] { float: right; color: #A1A1AA; font-size: 12px; margin-top: 2px; }

.mw-sub-row td[b-c0nek19kh7] { background: #FDFDFD; }

/* Responsive */
@media (max-width: 1024px) {
    .mhero[b-c0nek19kh7]          { padding: 96px 32px 32px; }
    .mhero-h1[b-c0nek19kh7]       { font-size: 48px; letter-spacing: -1.4px; }
    .mhero-rails[b-c0nek19kh7]    { display: none; }

    /* iPad — 회전 줄이고 overflow 차단, 내용 padding 조정 */
    .mhero-video[b-c0nek19kh7]    { padding: 32px 24px 0; }
    .mhero-mockup[b-c0nek19kh7]   { padding: 16px 24px 0; overflow: hidden; }
    .mhero-stage[b-c0nek19kh7]    {
        transform: rotate(-1deg);
        margin: 0 auto -60px;
        max-width: 100%;
    }
    .mw[b-c0nek19kh7]             { height: auto; }
    .mw-body[b-c0nek19kh7]        { padding: 20px 22px 16px; }
    .mw-stats[b-c0nek19kh7]       { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .mw-stat-num[b-c0nek19kh7]    { font-size: 32px; }
    .mw-table[b-c0nek19kh7]       { font-size: 12px; }
    .mw-table thead th[b-c0nek19kh7],
    .mw-table tbody td[b-c0nek19kh7] { padding: 10px 8px; }
    .mw-title[b-c0nek19kh7]       { font-size: 20px; }
}
@media (max-width: 768px) {
    .mhero[b-c0nek19kh7]          { padding: 80px 16px 24px; }
    .mhero-h1[b-c0nek19kh7]       { font-size: 32px; line-height: 1.1; letter-spacing: -0.8px; }
    .mhero-sub[b-c0nek19kh7]      { font-size: 14px; }
    .mhero-video[b-c0nek19kh7]    { padding: 24px 16px 0; }
    .mhero-mockup[b-c0nek19kh7]   { padding: 16px 16px 48px; }
    .mhero-stage[b-c0nek19kh7]    { padding: 8px; border-radius: 18px; transform: none; margin: 0 auto; }
    .mw[b-c0nek19kh7]             { border-radius: 12px; height: auto; }
    .mw-body[b-c0nek19kh7]        { padding: 16px; }
    .mw-stats[b-c0nek19kh7]       { grid-template-columns: 1fr; }
    .mw-table[b-c0nek19kh7]       { font-size: 11.5px; }
    .mw-table thead th[b-c0nek19kh7],
    .mw-table tbody td[b-c0nek19kh7] { padding: 8px 6px; }
    .mw-url[b-c0nek19kh7]         { font-size: 10px; }
    .mw-title[b-c0nek19kh7]       { font-size: 18px; }
}

/* =========================================
   Home — Hero (dark, 기존 그대로)
========================================= */

.home-hero[b-c0nek19kh7] {
    position:   relative;
    width:      100%;
    min-height: calc(100vh - 72px);
    display:    flex;
    align-items: center;
    overflow:   hidden;
    background: linear-gradient(135deg, #012d42 0%, #014a6b 40%, #015f87 100%);
}

.hero-bg[b-c0nek19kh7] {
    position:          absolute;
    inset:             0;
    background-size:   cover;
    background-repeat: no-repeat;
    opacity:           0;
    transition:        opacity 3s ease-in-out;
}
.hero-bg.active[b-c0nek19kh7] { opacity: 1; }
.hero-bg-1[b-c0nek19kh7] {
    background-image:    url('/images/axowlhome2_nobg.webp');
    background-position: right bottom;
    background-size:     contain;
}

.hero-bg-2[b-c0nek19kh7] {
    background-image:    url('/images/axowlhome1_nobg.webp');
    background-position: right bottom;
    background-size:     contain;
}

@keyframes heroZoom-b-c0nek19kh7 {
    from { transform: scale(1.05); }
    to   { transform: scale(1.0); }
}

.hero-overlay[b-c0nek19kh7] {
    position:   absolute;
    inset:      0;
    background: linear-gradient(
        90deg,
        rgba(0,0,0,0.88) 0%,
        rgba(0,0,0,0.75) 35%,
        rgba(0,0,0,0.30) 60%,
        rgba(0,0,0,0.00) 80%
    );
    z-index: 1;
}

.hero-corner-mask[b-c0nek19kh7] {
    position:       absolute;
    bottom:         0;
    right:          0;
    width:          300px;
    height:         300px;
    background:     radial-gradient(ellipse at bottom right, rgba(0,0,0,0.45) 0%, transparent 70%);
    z-index:        2;
    pointer-events: none;
}

.hero-inner[b-c0nek19kh7] {
    position:   relative;
    z-index:    3;
    width:      100%;
    max-width:  1200px;
    margin:     0 auto;
    padding:    5rem 2rem 4rem;
    text-align: left;
}

.hero-title-wrap[b-c0nek19kh7] {
    position:      relative;
    padding-top:   1.8rem;
    margin-bottom: 2rem;
}
.hero-title-wrap[b-c0nek19kh7]::before {
    content:       '';
    position:      absolute;
    top:           0; left: 0;
    width:         40px;
    height:        2px;
    background:    rgba(255,255,255,0.55);
    border-radius: 2px;
}

.hero-title[b-c0nek19kh7] {
    font-size:      6rem;
    font-weight:    900;
    line-height:    1.06;
    letter-spacing: -0.04em;
    color:          #ffffff;
    margin:         0;
}

.tl-1[b-c0nek19kh7], .tl-2[b-c0nek19kh7] {
    display:   block;
    opacity:   0;
    transform: translateY(28px);
    animation: fadeUp-b-c0nek19kh7 0.6s cubic-bezier(0.22,0.61,0.36,1) forwards;
}
.tl-1[b-c0nek19kh7] { animation-delay: 0.05s; }
.tl-2[b-c0nek19kh7] { animation-delay: 0.32s; }

@keyframes fadeUp-b-c0nek19kh7 {
    to { opacity: 1; transform: translateY(0); }
}

.tl-cycle[b-c0nek19kh7] {
    display:                 inline-block;
    background:              linear-gradient(90deg, #6366f1, #a78bfa, #38bdf8, #34d399, #6366f1);
    background-size:         300% 100%;
    -webkit-background-clip: text;
    background-clip:         text;
    -webkit-text-fill-color: transparent;
    animation:               gradShift-b-c0nek19kh7 6s linear 2s infinite;
    min-width:               6.5ch;
    text-align:              left;
}
@keyframes gradShift-b-c0nek19kh7 {
    0%   { background-position: 0%   50%; }
    50%  { background-position: 100% 50%; }
    100% { background-position: 0%   50%; }
}
.tl-cycle.fade-in[b-c0nek19kh7]  { opacity: 1; transition: opacity 0.7s ease; }
.tl-cycle.fade-out[b-c0nek19kh7] { opacity: 0; transition: opacity 0.7s ease; }

.hero-subtitle[b-c0nek19kh7] {
    font-size:       1rem;
    line-height:     1.75;
    color:           rgba(255,255,255,0.62);
    margin:          2rem 0 2.5rem;
    max-width:       520px;
    opacity:         0;
    animation:       fadeUp-b-c0nek19kh7 0.5s ease forwards;
    animation-delay: 0.62s;
    word-break:      keep-all;
}
.hero-subtitle strong[b-c0nek19kh7] { color: rgba(255,255,255,0.95); font-weight: 600; }

.hero-actions[b-c0nek19kh7] {
    display:         flex;
    gap:             1rem;
    align-items:     center;
    opacity:         0;
    animation:       fadeUp-b-c0nek19kh7 0.5s ease forwards;
    animation-delay: 0.88s;
}

.btn-hero[b-c0nek19kh7] {
    padding:         0.9rem 2.2rem;
    border-radius:   8px;
    font-size:       1rem;
    font-weight:     600;
    text-decoration: none;
    transition:      all 0.2s ease;
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
}
.btn-hero-primary[b-c0nek19kh7] {
    background: #ffffff;
    color:      #000000;
    border:     1px solid rgba(255,255,255,0.9);
}
.btn-hero-primary:hover[b-c0nek19kh7] {
    background: #f1f5f9;
    transform:  translateY(-2px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.3);
    color:      #000000;
}
.btn-hero-secondary[b-c0nek19kh7] {
    background:      transparent;
    color:           rgba(255,255,255,0.82);
    border:          1px solid rgba(255,255,255,0.3);
    backdrop-filter: blur(4px);
}
.btn-hero-secondary:hover[b-c0nek19kh7] {
    background:   rgba(255,255,255,0.1);
    border-color: rgba(255,255,255,0.55);
    transform:    translateY(-2px);
    color:        #ffffff;
}

/* =========================================
   Mid sections — Light Grey Theme
========================================= */

.hs-section[b-c0nek19kh7] {
    background: #FAFAFA;
    padding:    6rem 2rem;
    width:      100%;
    box-sizing: border-box;
    position:   relative;
}

/* Center rail column (1280px) — mirrors .mhero-rails */
.hs-section:not(.hs-section--mockup)[b-c0nek19kh7]::before {
    content: "";
    position: absolute;
    inset: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1280px;
    background: #ffffff;
    border-left:  1px solid #D4D4D8;
    border-right: 1px solid #D4D4D8;
    pointer-events: none;
    z-index: 0;
}
.hs-section > *[b-c0nek19kh7] { position: relative; z-index: 1; }

.hs-section--alt[b-c0nek19kh7] {
    background: #FAFAFA;
    width:      100%;
    box-sizing: border-box;
}
.hs-section--alt[b-c0nek19kh7]::before {
    background: #f3f4f6 !important;
    border-top:    1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

/* ═════════════════════════════════════════
   Permission Studio mockup (Medusa tilted)
   ═════════════════════════════════════════ */
.hs-section--mockup[b-c0nek19kh7] {
    background: linear-gradient(180deg, #ffffff 0%, #F4F4F5 100%);
    padding:    96px 2rem 48px;
    overflow:   hidden;
    width:      100%;
    box-sizing: border-box;
    font-family:'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    -webkit-font-smoothing: antialiased;
}

.hs-mockup-container[b-c0nek19kh7] {
    max-width: 1280px;
    margin:    0 auto;
}

.hs-mockup-head[b-c0nek19kh7] {
    text-align: center;
    max-width:  720px;
    margin:     0 auto 56px;
}

.hs-mockup-kicker[b-c0nek19kh7] {
    display:        inline-block;
    font-size:      12px;
    font-weight:    600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color:          #52525B;
    margin-bottom:  16px;
}

.hs-mockup-title[b-c0nek19kh7] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size:      48px;
    font-weight:    700;
    line-height:    1.08;
    letter-spacing: -1.6px;
    color:          #18181B;
    margin:         0 0 20px;
}

.hs-mockup-sub[b-c0nek19kh7] {
    font-size:   16px;
    line-height: 24px;
    color:       #52525B;
    margin:      0;
}

[b-c0nek19kh7] .hs-mockup-sub code {
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size:     13px;
    padding:       2px 6px;
    background:    #18181B;
    color:         #F4F4F5;
    border-radius: 4px;
}

/* Tilted stage */
.hs-mockup-stage[b-c0nek19kh7] {
    perspective: 2400px;
    perspective-origin: 50% 40%;
    padding:  40px 0 0;
    -webkit-mask-image: linear-gradient(180deg, #000 65%, transparent 100%);
    mask-image:         linear-gradient(180deg, #000 65%, transparent 100%);
}

.hs-mockup-card[b-c0nek19kh7] {
    max-width:   1120px;
    margin:      0 auto;
    background:  #ffffff;
    border:      1px solid #E4E4E7;
    border-radius: 12px;
    overflow:    hidden;
    box-shadow:
        0 60px 120px -20px rgba(24,24,27,0.25),
        0 30px 60px  -30px rgba(24,24,27,0.35),
        0 0 0 1px rgba(24,24,27,0.04);
    transform:   rotateX(18deg) rotateY(-12deg) rotateZ(4deg);
    transform-origin: 50% 0%;
    transition:  transform 600ms cubic-bezier(.2,.8,.2,1);
}

.hs-mockup-card:hover[b-c0nek19kh7] {
    transform: rotateX(6deg) rotateY(-4deg) rotateZ(1deg);
}

/* Browser-frame top bar */
.hs-mw-top[b-c0nek19kh7] {
    display:     flex;
    align-items: center;
    gap:         12px;
    padding:     10px 16px;
    background:  #FAFAFA;
    border-bottom: 1px solid #E4E4E7;
}

.hs-mw-dots[b-c0nek19kh7] { display: flex; gap: 6px; }
.hs-mw-dots span[b-c0nek19kh7] {
    width:  10px;
    height: 10px;
    border-radius: 999px;
    background: #E4E4E7;
}
.hs-mw-dots span:nth-child(1)[b-c0nek19kh7] { background: #F87171; }
.hs-mw-dots span:nth-child(2)[b-c0nek19kh7] { background: #FBBF24; }
.hs-mw-dots span:nth-child(3)[b-c0nek19kh7] { background: #34D399; }

.hs-mw-url[b-c0nek19kh7] {
    flex: 1;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 12px;
    color:     #71717A;
    text-align: center;
    padding:   4px 12px;
    background: #ffffff;
    border:    1px solid #E4E4E7;
    border-radius: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Mockup body */
.hs-mw-body[b-c0nek19kh7] { padding: 24px 28px 20px; }

.hs-mw-titlebar[b-c0nek19kh7] {
    display:         flex;
    align-items:     flex-end;
    justify-content: space-between;
    margin-bottom:   20px;
}

.hs-mw-title[b-c0nek19kh7] {
    font-size:   20px;
    font-weight: 700;
    color:       #18181B;
    letter-spacing: -0.4px;
}

.hs-mw-subtitle[b-c0nek19kh7] {
    font-size: 12px;
    color:     #71717A;
    margin-top: 2px;
}

[b-c0nek19kh7] .hs-mw-subtitle strong { color: #334155; }

.hs-mw-btn[b-c0nek19kh7] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size:   12px;
    font-weight: 500;
    padding:     6px 12px;
    border-radius: 6px;
    background:  #27272A;
    color:       rgba(255,255,255,0.92);
    border:      none;
    cursor:      pointer;
    box-shadow:  inset 0 0.75px 0 0 rgba(255,255,255,0.2), 0 0 0 1px #18181B;
}

/* Grammar hint line */
.hs-mw-grammar[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size:   13px;
    padding:     10px 14px;
    background:  #FAFAFA;
    border:      1px solid #E4E4E7;
    border-radius: 6px;
    margin-bottom: 16px;
    color:       #27272A;
}

[b-c0nek19kh7] .hs-mw-grammar .gm-ns { color: #0891B2; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-grammar .gm-res { color: #7C3AED; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-grammar .gm-act { color: #DC2626; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-grammar .gm-var { color: #059669; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-grammar .gm-d,
[b-c0nek19kh7] .hs-mw-grammar .gm-col { color: #71717A; }

/* Table */
.hs-mw-table[b-c0nek19kh7] {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.hs-mw-table thead th[b-c0nek19kh7] {
    text-align: left;
    padding:    10px 12px;
    font-size:  11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color:     #71717A;
    border-bottom: 1px solid #E4E4E7;
    background: #ffffff;
}

.hs-mw-table tbody tr[b-c0nek19kh7] {
    border-bottom: 1px solid #F4F4F5;
}

.hs-mw-table tbody tr:last-child[b-c0nek19kh7] { border-bottom: none; }

.hs-mw-table tbody td[b-c0nek19kh7] {
    padding: 10px 12px;
    color:   #18181B;
    vertical-align: middle;
}

[b-c0nek19kh7] .hs-mw-table code {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size:   12.5px;
    color:       #27272A;
}

[b-c0nek19kh7] .hs-mw-table .gm-ns { color: #0891B2; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-table .gm-res { color: #7C3AED; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-table .gm-act { color: #DC2626; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-table .gm-var { color: #059669; font-weight: 600; }
[b-c0nek19kh7] .hs-mw-table .gm-d,
[b-c0nek19kh7] .hs-mw-table .gm-col { color: #71717A; }

/* Effect pills */
.hs-mw-pill[b-c0nek19kh7] {
    display:        inline-flex;
    align-items:    center;
    gap:            4px;
    padding:        3px 8px;
    border-radius:  999px;
    font-size:      10px;
    font-weight:    700;
    letter-spacing: 0.04em;
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
}

.hs-mw-pill--allow[b-c0nek19kh7] { background: #DCFCE7; color: #166534; }
.hs-mw-pill--deny[b-c0nek19kh7]  { background: #FEE2E2; color: #991B1B; }
.hs-mw-pill--seal[b-c0nek19kh7]  {
    background: linear-gradient(135deg, #F59E0B 0%, #FBBF24 100%);
    color:      #18181B;
}
.hs-mw-pill--seal i[b-c0nek19kh7] { font-size: 11px; }

.hs-mw-foot[b-c0nek19kh7] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding-top:     14px;
    margin-top:      8px;
    border-top:      1px solid #F4F4F5;
    font-size:       12px;
    color:           #71717A;
}

.hs-mw-foot-snapshot[b-c0nek19kh7] {
    display:     inline-flex;
    align-items: center;
    gap:         6px;
    color:       #18181B;
    font-weight: 500;
}

.hs-mw-foot-snapshot i[b-c0nek19kh7] { color: #F59E0B; }

/* Responsive: flatten tilt on small screens */
@media (max-width: 1024px) {
    .hs-mockup-title[b-c0nek19kh7] { font-size: 36px; letter-spacing: -1px; }
    /* iPad — 3D 회전 더 평탄화 + overflow 차단 */
    .hs-mockup-card[b-c0nek19kh7]  {
        transform: rotateX(6deg) rotateY(-3deg) rotateZ(1deg);
        max-width: 100%;
    }
    .hs-mockup-card:hover[b-c0nek19kh7] {
        transform: rotateX(3deg) rotateY(-1deg) rotateZ(0deg);
    }
    .hs-mockup-stage[b-c0nek19kh7] { perspective: 1800px; padding: 24px 0 0; }
    .hs-mw-body[b-c0nek19kh7]      { padding: 18px 22px 16px; }
    .hs-mw-table[b-c0nek19kh7]     { font-size: 12px; }
    .hs-mw-table thead th[b-c0nek19kh7],
    .hs-mw-table tbody td[b-c0nek19kh7] { padding: 8px 10px; }
}
@media (max-width: 768px) {
    .hs-section--mockup[b-c0nek19kh7] { padding: 64px 1rem 32px; }
    .hs-mockup-title[b-c0nek19kh7]    { font-size: 28px; }
    .hs-mockup-card[b-c0nek19kh7]     { transform: none; }
    .hs-mw-body[b-c0nek19kh7]         { padding: 16px; }
    .hs-mw-table[b-c0nek19kh7]        { font-size: 11px; }
    .hs-mw-table tbody td[b-c0nek19kh7],
    .hs-mw-table thead th[b-c0nek19kh7] { padding: 8px 6px; }
    .hs-mw-url[b-c0nek19kh7]          { font-size: 10px; }
}

/* ── Logos — Medusa-style IdP strip (light) ── */
.hs-section--logos[b-c0nek19kh7] {
    background:    #FAFAFA;
    padding:       56px 2rem;
    width:         100%;
    box-sizing:    border-box;
}
.hs-section--logos[b-c0nek19kh7]::before {
    background: #ffffff !important;
    border-top:    1px solid #E4E4E7;
    border-bottom: 1px solid #E4E4E7;
}

/* ── CTA 섹션 ── */
.hs-section--cta[b-c0nek19kh7] {
    background: #FAFAFA;
    padding:    7rem 2rem;
    width:      100%;
    box-sizing: border-box;
}
.hs-section--cta[b-c0nek19kh7]::before {
    background: #111827 !important;
}

/* Community-Event variant (5/27) — position:relative so confetti pieces
   absolutely-positioned inside this section don't escape into <html>. */
.hs-cta--event[b-c0nek19kh7] {
    position: relative;
    overflow: hidden;
}

.hs-cta-eyebrow[b-c0nek19kh7] {
    display:         inline-flex;
    align-items:     center;
    gap:             0.5rem;
    font-size:       0.74rem;
    font-weight:     700;
    text-transform:  uppercase;
    letter-spacing:  0.14em;
    color:           #a5b4fc;
    margin-bottom:   1.4rem;
    padding:         0.5rem 1.1rem;
    background:      rgba(99, 102, 241, 0.16);
    border:          1px solid rgba(99, 102, 241, 0.35);
    border-radius:   999px;
}

.hs-cta-eyebrow-icon[b-c0nek19kh7] {
    font-size:    1.1rem;
    line-height:  1;
    display:      inline-block;
    transform-origin: 50% 70%;
    animation:    axowl-emoji-bounce-b-c0nek19kh7 2.2s ease-in-out infinite;
}

@keyframes axowl-emoji-bounce-b-c0nek19kh7 {
    0%, 100% { transform: translateY(0)   rotate(-10deg); }
    50%      { transform: translateY(-3px) rotate(12deg); }
}

@media (prefers-reduced-motion: reduce) {
    .hs-cta-eyebrow-icon[b-c0nek19kh7] { animation: none; }
}

.hs-container[b-c0nek19kh7] {
    max-width: 1200px;
    margin:    0 auto;
}

/* ── Text atoms ── */
.hs-eyebrow[b-c0nek19kh7] {
    font-size:      0.72rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color:          #6366f1;
    margin-bottom:  0.75rem;
}

.hs-title[b-c0nek19kh7] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size:      2.8rem;
    font-weight:    800;
    color:          #18181b;
    letter-spacing: -1.6px;
    line-height:    1.10;
    margin:         0;
}
.hs-title--left[b-c0nek19kh7] { text-align: left; }

.hs-subtitle[b-c0nek19kh7] {
    font-size:   1rem;
    color:       #6b7280;
    line-height: 1.7;
    margin:      1rem auto 0;
    max-width:   520px;
}

.hs-body[b-c0nek19kh7] {
    font-size:   0.9rem;
    color:       #6b7280;
    line-height: 1.75;
    margin:      1rem 0 2rem;
}

.hs-link-arrow[b-c0nek19kh7] {
    display:         inline-flex;
    align-items:     center;
    gap:             0.4rem;
    font-size:       0.88rem;
    font-weight:     700;
    color:           #6366f1;
    text-decoration: none;
    transition:      color 0.15s, gap 0.15s;
}
.hs-link-arrow:hover[b-c0nek19kh7] { color: var(--ah-link); gap: 0.7rem; }

.hs-head[b-c0nek19kh7]         { margin-bottom: 4rem; }
.hs-head--center[b-c0nek19kh7] { text-align: center; }

/* ── Pillar grid ── */
.hs-pillar-grid[b-c0nek19kh7] {
    display:               grid;
    grid-template-columns: repeat(3, 1fr);
    gap:                   1.5rem;
}

.hs-pillar-card[b-c0nek19kh7] {
    border:        1px solid #e5e7eb;
    border-radius: 16px;
    padding:       2rem;
    background:    #ffffff;
    transition:    border-color 0.2s, box-shadow 0.2s;
    cursor:        default;
}
.hs-pillar-card:hover[b-c0nek19kh7] {
    border-color: #c7d2fe;
    box-shadow:   0 4px 20px rgba(99,102,241,0.08);
}

.hs-pillar-icon[b-c0nek19kh7] {
    width:           44px;
    height:          44px;
    border-radius:   10px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       1.1rem;
    margin-bottom:   1.25rem;
}

.hs-pillar-title[b-c0nek19kh7] {
    font-size:     1.1rem;
    font-weight:   700;
    color:         #111827;
    margin-bottom: 0.5rem;
}

.hs-pillar-desc[b-c0nek19kh7] {
    font-size:   0.82rem;
    color:       #6b7280;
    line-height: 1.7;
}

.hs-tag-row[b-c0nek19kh7] {
    display:    flex;
    flex-wrap:  wrap;
    gap:        0.4rem;
    margin-top: 1.25rem;
}

.hs-tag[b-c0nek19kh7] {
    font-size:     0.65rem;
    font-weight:   600;
    color:         #6b7280;
    border:        1px solid #e5e7eb;
    border-radius: 4px;
    padding:       0.2rem 0.55rem;
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    background:    #f9fafb;
}

/* ── Steps ── */
.hs-steps[b-c0nek19kh7] {
    display:               grid;
    grid-template-columns: repeat(4, 1fr);
    gap:                   0;
    position:              relative;
}

.hs-steps-line[b-c0nek19kh7] {
    position:   absolute;
    top:        28px;
    left:       12.5%;
    right:      12.5%;
    height:     1px;
    background: linear-gradient(90deg, transparent, #c7d2fe, transparent);
}

.hs-step[b-c0nek19kh7] { text-align: center; padding: 0 1rem; position: relative; }

.hs-step-icon[b-c0nek19kh7] {
    width:           56px;
    height:          56px;
    border-radius:   50%;
    border:          1px solid #c7d2fe;
    background:      #eef2ff;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       1.1rem;
    margin:          0 auto 1.25rem;
    position:        relative;
    z-index:         1;
}

.hs-step-num[b-c0nek19kh7] {
    font-size:      0.65rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color:          #6366f1;
    margin-bottom:  0.4rem;
}

.hs-step-title[b-c0nek19kh7] {
    font-size:     0.95rem;
    font-weight:   700;
    color:         #111827;
    margin-bottom: 0.5rem;
}

.hs-step-desc[b-c0nek19kh7] {
    font-size:   0.78rem;
    color:       #6b7280;
    line-height: 1.6;
}

/* ── Business Workflow grid (Section 3 — replaces Tiers) ── */
.hs-bw-grid[b-c0nek19kh7] {
    display:               grid;
    grid-template-columns: repeat(3, 1fr);
    gap:                   24px;
}

.hs-bw-card[b-c0nek19kh7] {
    display:         flex;
    flex-direction:  column;
    background:      #ffffff;
    border:          1px solid #e4e4e7;
    border-radius:   4px;
    overflow:        hidden;
    text-decoration: none;
    color:           inherit;
    transition:      border-color 0.15s, transform 0.15s, box-shadow 0.15s;
}

.hs-bw-card:hover[b-c0nek19kh7] {
    border-color: #18181b;
    transform:    translateY(-2px);
    box-shadow:   0 12px 28px -16px rgba(24,24,27,0.25);
}

.hs-bw-img[b-c0nek19kh7] {
    aspect-ratio:        16 / 10;
    background-size:     cover;
    background-position: center;
    background-color:    #fafafa;
}

.hs-bw-body[b-c0nek19kh7] {
    padding:        24px 24px 22px;
    display:        flex;
    flex-direction: column;
    gap:            10px;
    flex:           1;
}

.hs-bw-tag[b-c0nek19kh7] {
    align-self:     flex-start;
    font-size:      10px;
    font-weight:    700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding:        3px 7px;
    background:     #fbbf24;
    color:          #18181b;
    border-radius:  3px;
    line-height:    1.2;
    margin-bottom:  2px;
}

.hs-bw-name[b-c0nek19kh7] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size:      22px;
    font-weight:    800;
    color:          #18181b;
    letter-spacing: -0.6px;
    line-height:    1.22;
}

.hs-bw-desc[b-c0nek19kh7] {
    font-size:   14px;
    line-height: 1.6;
    color:       #52525b;
    margin:      0;
    flex:        1;
}

.hs-bw-link[b-c0nek19kh7] {
    display:        inline-flex;
    align-items:    center;
    gap:            6px;
    font-size:      13.5px;
    font-weight:    600;
    color:          #18181b;
    margin-top:     6px;
    transition:     gap 0.15s;
}

.hs-bw-card:hover .hs-bw-link[b-c0nek19kh7] { gap: 10px; }

/* ── Logos (Medusa-style IdP strip — left label + 4 rotating slots) ── */
.hs-logos-grid[b-c0nek19kh7] {
    display:         grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
    align-items:     center;
    gap:             48px;
}

.hs-logos-label[b-c0nek19kh7] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    font-size:      15px;
    font-weight:    500;
    line-height:    1.5;
    color:          #52525B;
    text-align:     left;
    -webkit-font-smoothing: antialiased;
}

.hs-logos-slots[b-c0nek19kh7] {
    display:         grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items:     center;
    gap:             24px;
}

.hs-logo-slot[b-c0nek19kh7] {
    position:        relative;
    overflow:        hidden;
    height:          44px;
}

.hs-logo-item[b-c0nek19kh7] {
    position:        absolute;
    inset:           0;
    display:         flex;
    align-items:     center;
    justify-content: center;
    gap:             10px;
    font-family:     'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size:       22px;
    font-weight:     700;
    color:           #3F3F46;
    letter-spacing:  -0.02em;
    -webkit-font-smoothing: antialiased;
    white-space:     nowrap;
}

.hs-logo-item i[b-c0nek19kh7] {
    font-size: 24px;
    color:     inherit;
}

/* 신규 아이템: 아래에서 위로 슬라이드 인 */
.hs-logo-item.entering[b-c0nek19kh7] {
    animation: hsLogoSlideUpIn-b-c0nek19kh7 560ms cubic-bezier(.22,.9,.28,1) both;
}

/* 이전 아이템: 위로 슬라이드 아웃 */
.hs-logo-item.exiting[b-c0nek19kh7] {
    animation: hsLogoSlideUpOut-b-c0nek19kh7 560ms cubic-bezier(.22,.9,.28,1) both;
}

@keyframes hsLogoSlideUpIn-b-c0nek19kh7 {
    0%   { transform: translateY(110%); opacity: 0; }
    40%  { opacity: 1; }
    100% { transform: translateY(0);    opacity: 1; }
}

@keyframes hsLogoSlideUpOut-b-c0nek19kh7 {
    0%   { transform: translateY(0);    opacity: 1; }
    60%  { opacity: 0.4; }
    100% { transform: translateY(-110%); opacity: 0; }
}

/* ── CTA ── */
.hs-cta-wrap[b-c0nek19kh7] {
    max-width:  640px;
    margin:     0 auto;
    text-align: center;
    padding:    0 2rem;
}

.hs-cta-title[b-c0nek19kh7] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size:      3rem;
    font-weight:    800;
    color:          #ffffff;
    letter-spacing: -1.8px;
    line-height:    1.10;
    margin:         0 0 1.25rem;
}

.hs-cta-sub[b-c0nek19kh7] {
    font-size:   0.95rem;
    color:       rgba(255,255,255,0.5);
    line-height: 1.7;
    margin:      0 0 2.5rem;
}

.hs-cta-actions[b-c0nek19kh7] {
    display:         flex;
    gap:             1rem;
    justify-content: center;
    flex-wrap:       wrap;
}

/* CTA 섹션 버튼 override */
.hs-section--cta .btn-hero-primary[b-c0nek19kh7] {
    background:   #ffffff;
    color:        #111827;
    border-color: #ffffff;
}
.hs-section--cta .btn-hero-primary:hover[b-c0nek19kh7] {
    background: #f1f5f9;
    color:      #111827;
}

/* =========================================
   반응형
========================================= */
@media (max-width: 1200px) { .hero-title[b-c0nek19kh7] { font-size: 5rem; } }

@media (max-width: 1199.98px) {
    /* 태블릿 공통 — 사람 크게 cover, 하단 텍스트만 어둡게 */
    /* ⚠️ hero-overlay만 변경, 데스크톱 기본 90deg 오버레이는 1200px+ 에서 유지 */
    .hero-bg-1[b-c0nek19kh7],
    .hero-bg-2[b-c0nek19kh7]      { background-size: cover; background-position: 75% bottom; }
    .hero-overlay[b-c0nek19kh7]   {
        background: linear-gradient(
            to top,
            rgba(0,0,0,0.78) 0%,
            rgba(0,0,0,0.55) 30%,
            rgba(0,0,0,0.15) 55%,
            rgba(0,0,0,0.0)  75%
        );
    }
    .hero-title[b-c0nek19kh7]     { font-size: 5rem; }
    .hero-subtitle[b-c0nek19kh7]  { font-size: 1.15rem; line-height: 1.8; }
    .btn-hero[b-c0nek19kh7]       { padding: 1rem 2.4rem; font-size: 1.1rem; }
    .hs-bw-grid[b-c0nek19kh7] { gap: 18px; }
    .hs-steps[b-c0nek19kh7]       { grid-template-columns: repeat(2,1fr); gap: 2.5rem; }
    .hs-steps-line[b-c0nek19kh7]  { display: none; }
}

@media (max-width: 820px) {
    /* iPad Air — 텍스트 max-width 제한 + 크기 조정 */
    .hero-inner[b-c0nek19kh7]    { padding: 3.5rem 2rem; }
    .hero-title[b-c0nek19kh7]    { font-size: 4.2rem; }
    .hero-subtitle[b-c0nek19kh7] { max-width: 55%; font-size: 1.1rem; }
    .hero-overlay[b-c0nek19kh7]  {
        background: linear-gradient(
            to top,
            rgba(0,0,0,0.80) 0%,
            rgba(0,0,0,0.58) 30%,
            rgba(0,0,0,0.18) 55%,
            rgba(0,0,0,0.0)  75%
        );
    }
    .btn-hero[b-c0nek19kh7]      { padding: 1rem 2.5rem; font-size: 1.1rem; }
}

@media (max-width: 768px) {
    /* 모바일 — 사람 이미지 제거, 블루 그라데이션만 */
    .hero-bg-1[b-c0nek19kh7],
    .hero-bg-2[b-c0nek19kh7]        { display: none !important; }
    .hero-overlay[b-c0nek19kh7]     { background: none; }
    .home-hero[b-c0nek19kh7]        {
        min-height:   auto;
        align-items:  flex-start;
        background:   linear-gradient(160deg, #014a6b 0%, #015f87 40%, #012d42 100%);
    }
    .hero-inner[b-c0nek19kh7]       { padding: 3.5rem 1.5rem 3.5rem; text-align: center; }
    .hero-title[b-c0nek19kh7]       { font-size: 3.5rem; }
    .hero-subtitle[b-c0nek19kh7]    { font-size: 1.05rem; max-width: 100%; margin-left: auto; margin-right: auto; }
    .hero-title-wrap[b-c0nek19kh7]  { margin-bottom: 1.25rem; padding-top: 1rem; }
    .hero-title-wrap[b-c0nek19kh7]::before { left: 50%; transform: translateX(-50%); }
    .hero-actions[b-c0nek19kh7]     { justify-content: center; }
    .hero-corner-mask[b-c0nek19kh7] { display: none; }
    .tl-cycle[b-c0nek19kh7]         { min-width: 8ch; }
    .hs-title[b-c0nek19kh7]         { font-size: 2.2rem; }
    .hs-pillar-grid[b-c0nek19kh7]   { grid-template-columns: 1fr; }
    .hs-bw-grid[b-c0nek19kh7]       { grid-template-columns: 1fr; gap: 18px; }
    .hs-cta-title[b-c0nek19kh7]     { font-size: 2.2rem; }
    .hs-logos-grid[b-c0nek19kh7]    { grid-template-columns: 1fr; gap: 24px; }
    .hs-logos-label[b-c0nek19kh7]   { text-align: center; }
    .hs-logos-slots[b-c0nek19kh7]   { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
    .hs-logo-item[b-c0nek19kh7]     { font-size: 18px; }
    .hs-logo-item i[b-c0nek19kh7]   { font-size: 20px; }
}

@media (max-width: 480px) {
    .hero-inner[b-c0nek19kh7]    { padding: 3rem 1.25rem 3rem; }
    .hero-title[b-c0nek19kh7]    { font-size: 3.2rem; }
    .hero-subtitle[b-c0nek19kh7] { font-size: 0.95rem; }
    .hs-section[b-c0nek19kh7]    { padding: 4rem 1.25rem; }
    .hs-steps[b-c0nek19kh7]      { grid-template-columns: 1fr; }
    .hs-cta-title[b-c0nek19kh7]  { font-size: 1.8rem; }
}

@media (max-width: 390px) {
    .hero-title[b-c0nek19kh7] { font-size: 2.8rem; }
}

/* =========================================
   Medusa B2B split section + Integrity Audit mockup
========================================= */
.hs-section--split[b-c0nek19kh7] {
    padding: 0;
    overflow: hidden;
}
.hs-section--split[b-c0nek19kh7]::before { display: none !important; }
.hs-section--split .hs-container[b-c0nek19kh7] {
    max-width: 1280px;
    background: #18181B;
    border-left:  1px solid #27272A;
    border-right: 1px solid #27272A;
    padding: 96px 0 96px 72px;
    overflow: hidden;
}

.hs-split-grid[b-c0nek19kh7] {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 56px;
    align-items: stretch;
}

.hs-split-left[b-c0nek19kh7] {
    color: #E4E4E7;
    padding: 8px 0;
}
.hs-split-eyebrow[b-c0nek19kh7] {
    font-size: 13px;
    font-weight: 500;
    color: #A1A1AA;
    margin-bottom: 18px;
    letter-spacing: 0.2px;
}
.hs-split-title[b-c0nek19kh7] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 40px;
    font-weight: 800;
    line-height: 1.12;
    letter-spacing: -1.4px;
    color: #FAFAFA;
    margin: 0 0 20px;
}
.hs-split-desc[b-c0nek19kh7] {
    font-size: 15px;
    line-height: 1.6;
    color: #A1A1AA;
    margin: 0 0 24px;
    max-width: 440px;
}
.hs-split-link[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #FAFAFA;
    text-decoration: none;
    border-bottom: 1px solid rgba(250, 250, 250, 0.3);
    padding-bottom: 2px;
    transition: border-color 150ms ease;
}
.hs-split-link:hover[b-c0nek19kh7] {
    border-bottom-color: #FAFAFA;
    color: #FAFAFA;
}
.hs-split-link i[b-c0nek19kh7] { font-size: 12px; }

.hs-split-right[b-c0nek19kh7] {
    position: relative;
    min-width: 0;
}

/* ── Integrity Audit mockup (top-aligned, spills past right rail + bottom — clipped) ── */
.ia-mock[b-c0nek19kh7] {
    position: absolute;
    top: 0;
    left: 0;
    background: #ffffff;
    border-radius: 12px 0 0 12px;
    overflow: hidden;
    box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.7),
                0 0 0 1px rgba(255, 255, 255, 0.06);
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    width: 1100px;
    max-width: none;
}

.ia-mock-top[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    background: #FAFAFA;
    border-bottom: 1px solid #E4E4E7;
}
.ia-mock-dots[b-c0nek19kh7] { display: flex; gap: 7px; }
.ia-mock-dots span[b-c0nek19kh7] { width: 12px; height: 12px; border-radius: 999px; }
.ia-mock-dots span:nth-child(1)[b-c0nek19kh7] { background: #FF5F57; }
.ia-mock-dots span:nth-child(2)[b-c0nek19kh7] { background: #FEBC2E; }
.ia-mock-dots span:nth-child(3)[b-c0nek19kh7] { background: #28C840; }
.ia-mock-url[b-c0nek19kh7] {
    flex: 1;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 13px;
    color: #71717A;
    text-align: center;
}

/* ── App nav strip (above dashboard content, inside browser frame) ── */
.ia-mock-nav[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 24px;
    background: #0A0A0A;
    color: #FAFAFA;
    border-bottom: 1px solid #18181B;
}
.ia-mock-nav-brand[b-c0nek19kh7] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.3px;
    color: #FAFAFA;
}
.ia-mock-nav-ws[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #D4D4D8;
    padding: 5px 12px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.06);
}
.ia-mock-nav-ws-ic[b-c0nek19kh7] {
    width: 20px; height: 20px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #FAFAFA;
    color: #0A0A0A;
    font-size: 11px;
    font-weight: 700;
    border-radius: 4px;
}
.ia-mock-nav-ws i[b-c0nek19kh7] { font-size: 11px; color: #71717A; }
.ia-mock-nav-spacer[b-c0nek19kh7] { flex: 1; }
.ia-mock-nav-search[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 280px;
    max-width: 380px;
    flex: 1 1 auto;
    font-size: 13px;
    color: #71717A;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 8px;
    padding: 8px 14px;
}
.ia-mock-nav-search i[b-c0nek19kh7] { font-size: 13px; }
.ia-mock-nav-search span[b-c0nek19kh7] { flex: 1; }
.ia-mock-nav-search kbd[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 11px;
    background: rgba(255, 255, 255, 0.08);
    color: #A1A1AA;
    padding: 2px 7px;
    border-radius: 4px;
    border: none;
}
.ia-mock-nav-icons[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 16px;
}
.ia-mock-nav-icons i[b-c0nek19kh7] {
    font-size: 16px;
    color: #A1A1AA;
}
.ia-mock-nav-avatar[b-c0nek19kh7] {
    width: 28px; height: 28px;
    display: inline-flex; align-items: center; justify-content: center;
    background: #27272A;
    color: #FAFAFA;
    font-size: 11px;
    font-weight: 700;
    border-radius: 999px;
}

.ia-mock-body[b-c0nek19kh7] {
    padding: 32px 36px 36px;
    background: #ffffff;
}

.ia-mock-head[b-c0nek19kh7] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 28px;
}
.ia-mock-title[b-c0nek19kh7] {
    font-size: 24px;
    font-weight: 700;
    color: #18181B;
    letter-spacing: -0.4px;
}
.ia-mock-subline[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
}
.ia-mock-slug[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 13px;
    color: #71717A;
}
.ia-mock-tier[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    font-weight: 600;
    color: #52525B;
    background: transparent;
    border: 1px solid #E4E4E7;
    padding: 3px 10px;
    border-radius: 999px;
    letter-spacing: 0.3px;
}
.ia-mock-tier[b-c0nek19kh7]::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 999px;
    background: #22c55e;
}
.ia-mock-refresh[b-c0nek19kh7] {
    font-size: 13px;
    font-weight: 500;
    color: #52525B;
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    padding: 8px 14px;
    cursor: default;
}
.ia-mock-refresh i[b-c0nek19kh7] { font-size: 13px; margin-right: 5px; }

.ia-mock-cards[b-c0nek19kh7] {
    display: grid;
    grid-template-columns: repeat(4, minmax(210px, 1fr));
    gap: 16px;
    margin-bottom: 28px;
}
.ia-mock-card[b-c0nek19kh7] {
    background: #FAFAFA;
    border: 1px solid #E4E4E7;
    border-radius: 10px;
    padding: 20px 22px;
}
.ia-mock-card-num[b-c0nek19kh7] {
    font-size: 32px;
    font-weight: 700;
    color: #18181B;
    line-height: 1;
    letter-spacing: -0.8px;
}
.ia-mock-card-num.healthy[b-c0nek19kh7] { color: #15803d; }
.ia-mock-card-num .pct[b-c0nek19kh7] { font-size: 18px; font-weight: 600; margin-left: 2px; }
.ia-mock-card-label[b-c0nek19kh7] {
    font-size: 13px;
    color: #71717A;
    margin-top: 10px;
    font-weight: 500;
}

.ia-mock-table[b-c0nek19kh7] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.ia-mock-table thead th[b-c0nek19kh7] {
    text-align: left;
    font-size: 11px;
    font-weight: 600;
    color: #71717A;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 14px 16px;
    border-bottom: 1px solid #E4E4E7;
}
.ia-mock-table tbody td[b-c0nek19kh7] {
    padding: 16px;
    border-bottom: 1px solid #F4F4F5;
    color: #3F3F46;
    vertical-align: middle;
}
.ia-mock-table tbody tr:last-child td[b-c0nek19kh7] { border-bottom: none; }

.ia-mock-actor[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 13px;
    color: #18181B;
}
.ia-mock-ev[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 13px;
    color: #3F3F46;
}
.ia-mock-badge[b-c0nek19kh7] {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 6px;
    letter-spacing: 0.2px;
    background: #F4F4F5;
    color: #52525B;
}
.ia-mock-badge.sealed[b-c0nek19kh7]    { background: #dcfce7; color: #166534; }
.ia-mock-badge.notarized[b-c0nek19kh7] { background: #F4F4F5; color: #52525B; }
.ia-mock-badge.pending[b-c0nek19kh7]   { background: #F4F4F5; color: #A1A1AA; }

.ia-mock-right[b-c0nek19kh7] { text-align: right; }
.ia-mock-time[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 13px;
    color: #71717A;
}

/* ── Reverse split (mockup on LEFT, spills past left rail edge) ── */
.hs-section--split.hs-split--reverse[b-c0nek19kh7] {
    background: #FAFAFA;
    padding: 0;
}
.hs-split--reverse .hs-container[b-c0nek19kh7] {
    background: #ffffff;
    border-left:  1px solid #E4E4E7;
    border-right: 1px solid #E4E4E7;
    padding: 96px 72px 96px 0;
    overflow: hidden;
}
.hs-split--reverse .hs-split-grid[b-c0nek19kh7] {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    align-items: center;
}
.hs-split--reverse .hs-split-mock[b-c0nek19kh7] {
    min-width: 0;
    position: relative;
    padding: 0 24px;
}
.hs-split--reverse .ai-iam-mock[b-c0nek19kh7] { margin: 0 auto; }
.hs-split--reverse .hs-split-left[b-c0nek19kh7] {
    color: #18181B;
    padding-right: 2rem;
}
.hs-split--reverse .hs-split-eyebrow[b-c0nek19kh7] { color: #71717A; }
.hs-split--reverse .hs-split-title[b-c0nek19kh7]   { color: #18181B; }
.hs-split--reverse .hs-split-desc[b-c0nek19kh7]    { color: #52525B; }
.hs-split--reverse .hs-split-desc code[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 13px;
    background: #F4F4F5;
    color: #18181B;
    padding: 1px 6px;
    border-radius: 4px;
}
.hs-split--reverse .hs-split-link[b-c0nek19kh7] {
    color: #18181B;
    border-bottom-color: rgba(24, 24, 27, 0.3);
}
.hs-split--reverse .hs-split-link:hover[b-c0nek19kh7] {
    color: #18181B;
    border-bottom-color: #18181B;
}

/* ── Permission Studio mockup (contained within left column, no spill) ── */
.ps-mock[b-c0nek19kh7] {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.25),
                0 0 0 1px rgba(0, 0, 0, 0.05);
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    width: 100%;
    max-width: none;
    margin-left: 0;
}

.ps-mock-top[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: #FAFAFA;
    border-bottom: 1px solid #E4E4E7;
}
.ps-mock-dots[b-c0nek19kh7] { display: flex; gap: 6px; }
.ps-mock-dots span[b-c0nek19kh7] { width: 10px; height: 10px; border-radius: 999px; }
.ps-mock-dots span:nth-child(1)[b-c0nek19kh7] { background: #FF5F57; }
.ps-mock-dots span:nth-child(2)[b-c0nek19kh7] { background: #FEBC2E; }
.ps-mock-dots span:nth-child(3)[b-c0nek19kh7] { background: #28C840; }
.ps-mock-url[b-c0nek19kh7] {
    flex: 1;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 11px;
    color: #71717A;
    text-align: center;
}

.ps-mock-body[b-c0nek19kh7] {
    padding: 18px 20px 20px;
    background: #F4F4F5;
}

.ps-mock-head[b-c0nek19kh7] { margin-bottom: 14px; }
.ps-mock-title[b-c0nek19kh7] {
    font-size: 17px;
    font-weight: 700;
    color: #18181B;
    letter-spacing: -0.3px;
}
.ps-mock-sub[b-c0nek19kh7] {
    font-size: 12px;
    color: #71717A;
    margin-top: 3px;
}
.ps-mock-sub strong[b-c0nek19kh7] { color: #18181B; font-weight: 600; }

.ps-mock-layout[b-c0nek19kh7] {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 12px;
}

.ps-mock-side[b-c0nek19kh7] {
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 10px;
    padding: 12px 10px;
}
.ps-mock-side-group[b-c0nek19kh7] {
    font-size: 10px;
    font-weight: 600;
    color: #71717A;
    letter-spacing: 0.6px;
    padding: 6px 6px 4px;
    margin-top: 6px;
}
.ps-mock-side-group:first-child[b-c0nek19kh7] { margin-top: 0; }
.ps-mock-side-item[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 8px;
    border-radius: 8px;
    margin-bottom: 2px;
}
.ps-mock-side-item.active[b-c0nek19kh7] { background: #F4F4F5; }
.ps-mock-side-ic[b-c0nek19kh7] {
    width: 24px; height: 24px;
    display: flex; align-items: center; justify-content: center;
    background: #18181B;
    color: #ffffff;
    border-radius: 6px;
    font-size: 10px; font-weight: 700;
    flex-shrink: 0;
}
.ps-mock-side-name[b-c0nek19kh7] {
    font-size: 12px;
    font-weight: 600;
    color: #18181B;
    line-height: 1.2;
}
.ps-mock-side-status[b-c0nek19kh7] {
    font-size: 10px;
    line-height: 1.2;
    margin-top: 1px;
}
.ps-mock-side-status.ok[b-c0nek19kh7]    { color: #15803d; }
.ps-mock-side-status.muted[b-c0nek19kh7] { color: #A1A1AA; }

.ps-mock-main[b-c0nek19kh7] {
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 10px;
    padding: 14px 16px;
}
.ps-mock-main-title[b-c0nek19kh7] {
    font-size: 14px;
    font-weight: 700;
    color: #18181B;
}
.ps-mock-main-desc[b-c0nek19kh7] {
    font-size: 11px;
    color: #71717A;
    margin: 3px 0 14px;
}
.ps-mock-field[b-c0nek19kh7] { margin-bottom: 12px; }
.ps-mock-label[b-c0nek19kh7] {
    font-size: 9px;
    font-weight: 600;
    color: #71717A;
    letter-spacing: 0.5px;
    margin-bottom: 5px;
}
.ps-mock-input[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 12px;
    color: #18181B;
    background: #FAFAFA;
    border: 1px solid #E4E4E7;
    border-radius: 6px;
    padding: 6px 10px;
}
.ps-mock-chips[b-c0nek19kh7] { display: flex; gap: 6px; flex-wrap: wrap; }
.ps-mock-chip[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 11px;
    color: #4338ca;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    padding: 2px 8px;
    border-radius: 6px;
}
.ps-mock-result[b-c0nek19kh7] {
    margin-top: 10px;
    padding: 10px 12px;
    background: #0F172A;
    border-radius: 8px;
}
.ps-mock-result-label[b-c0nek19kh7] {
    font-size: 9px;
    font-weight: 600;
    color: #94a3b8;
    letter-spacing: 0.5px;
    margin-bottom: 4px;
}
.ps-mock-result code[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 11px;
    color: #e0e7ff;
    word-break: break-all;
}

/* ── Split responsive ── */
@media (max-width: 960px) {
    .hs-section--split[b-c0nek19kh7] { padding: 0; }
    .hs-section--split .hs-container[b-c0nek19kh7] {
        padding: 56px 1.5rem;
        overflow: hidden;
    }
    .hs-split--reverse .hs-container[b-c0nek19kh7] {
        padding: 56px 1.5rem;
    }
    .hs-split--reverse .ps-mock[b-c0nek19kh7] { margin-left: 0; }
    .hs-split-grid[b-c0nek19kh7] { grid-template-columns: 1fr; gap: 40px; }
    .hs-split-title[b-c0nek19kh7] { font-size: 32px; }
    .ia-mock[b-c0nek19kh7],
    .ps-mock[b-c0nek19kh7] {
        width: 100%;
        border-radius: 10px;
        margin-left: 0;
    }
    .ia-mock[b-c0nek19kh7] {
        position: static;
    }
    .ia-mock-cards[b-c0nek19kh7] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ia-mock-body[b-c0nek19kh7] { padding: 20px; }
    .ia-mock-nav[b-c0nek19kh7]  { padding: 10px 14px; gap: 12px; }
    .hs-split--reverse .hs-split-grid > .hs-split-mock[b-c0nek19kh7]  { order: 2; }
    .hs-split--reverse .hs-split-grid > .hs-split-left[b-c0nek19kh7]  { order: 1; }
    .hs-split--reverse .hs-split-left[b-c0nek19kh7] { padding-right: 0; }
    .ps-mock-layout[b-c0nek19kh7] { grid-template-columns: 150px 1fr; gap: 10px; }
    .ps-mock-side[b-c0nek19kh7] { padding: 8px 6px; }
}
@media (max-width: 640px) {
    .hs-section--split[b-c0nek19kh7] { padding: 64px 1rem; }
    .hs-section--split .hs-container[b-c0nek19kh7] { padding-right: 1rem; padding-left: 1rem; }
    .hs-split-title[b-c0nek19kh7] { font-size: 26px; letter-spacing: -0.8px; }
    .ia-mock-body[b-c0nek19kh7] { padding: 14px; }
    .ia-mock-table[b-c0nek19kh7] { font-size: 10px; }
    .ia-mock-table thead th[b-c0nek19kh7],
    .ia-mock-table tbody td[b-c0nek19kh7] { padding: 6px 6px; }
    .ia-mock-actor[b-c0nek19kh7], .ia-mock-ev[b-c0nek19kh7], .ia-mock-time[b-c0nek19kh7] { font-size: 9px; }
    .ia-mock-nav[b-c0nek19kh7] { padding: 8px 12px; gap: 10px; }
    .ia-mock-nav-ws span:not(.ia-mock-nav-ws-ic)[b-c0nek19kh7] { display: none; }
    .ia-mock-nav-search[b-c0nek19kh7] { display: none; }
    .ia-mock-nav-icons[b-c0nek19kh7] { gap: 10px; }
    .ps-mock-layout[b-c0nek19kh7] { grid-template-columns: 1fr; }
    .ps-mock-side[b-c0nek19kh7] { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px; }
    .ps-mock-side-group[b-c0nek19kh7] { width: 100%; padding: 0 0 4px; margin: 4px 0 0; }
    .ps-mock-side-item[b-c0nek19kh7] { flex: 1 1 45%; margin: 0; }
}

/* =========================================
   AI-Safe IAM mockup — natural language → verified scope
   Cycling 4 prompt/scope pairs with typewriter reveal.
========================================= */
.ai-iam-mock[b-c0nek19kh7] {
    background: #ffffff;
    border: 1px solid #E4E4E7;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 40px -12px rgba(24,24,27,0.18);
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    max-width: 560px;
}

.ai-iam-mock--center[b-c0nek19kh7] { margin: 0 auto; }

.ai-iam-mock-top[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: #FAFAFA;
    border-bottom: 1px solid #E4E4E7;
}

.ai-iam-mock-dots[b-c0nek19kh7] { display: flex; gap: 5px; }
.ai-iam-mock-dots span[b-c0nek19kh7] {
    width: 9px; height: 9px; border-radius: 50%;
    background: #E4E4E7;
}
.ai-iam-mock-dots span:nth-child(1)[b-c0nek19kh7] { background: #fb7185; }
.ai-iam-mock-dots span:nth-child(2)[b-c0nek19kh7] { background: #fbbf24; }
.ai-iam-mock-dots span:nth-child(3)[b-c0nek19kh7] { background: #34d399; }

.ai-iam-mock-url[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px;
    color: #71717A;
    margin-left: auto;
}

.ai-iam-mock-body[b-c0nek19kh7] {
    padding: 24px;
    background: #ffffff;
}

.ai-iam-section[b-c0nek19kh7] {
    background: #FAFAFA;
    border: 1px solid #E4E4E7;
    border-radius: 8px;
    padding: 18px 20px;
}

.ai-iam-section--scope[b-c0nek19kh7] {
    background: #0F172A;
    border-color: #1E293B;
}

.ai-iam-label[b-c0nek19kh7] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #71717A;
    margin-bottom: 12px;
}

.ai-iam-label i[b-c0nek19kh7] { font-size: 13px; color: #6366f1; }
.ai-iam-section--scope .ai-iam-label[b-c0nek19kh7] { color: #94a3b8; }
.ai-iam-section--scope .ai-iam-label i[b-c0nek19kh7] { color: #34d399; }

.ai-iam-prompt-wrap[b-c0nek19kh7],
.ai-iam-scope-wrap[b-c0nek19kh7] {
    position: relative;
    min-height: 28px;
    display: block;
}

.ai-iam-prompt[b-c0nek19kh7] {
    position: absolute;
    inset: 0;
    font-size: 16px;
    line-height: 28px;
    color: #18181B;
    font-weight: 500;
    opacity: 0;
    overflow: hidden;
    white-space: nowrap;
    clip-path: inset(0 100% 0 0);
    animation: ai-iam-typewriter-b-c0nek19kh7 16s infinite;
}

.ai-iam-prompt-1[b-c0nek19kh7] { animation-delay: 0s; }
.ai-iam-prompt-2[b-c0nek19kh7] { animation-delay: 4s; }
.ai-iam-prompt-3[b-c0nek19kh7] { animation-delay: 8s; }
.ai-iam-prompt-4[b-c0nek19kh7] { animation-delay: 12s; }

.ai-iam-caret[b-c0nek19kh7] {
    display: inline-block;
    color: #6366f1;
    font-weight: 700;
    margin-left: 1px;
    animation: ai-iam-caret-blink-b-c0nek19kh7 1s steps(2, start) infinite;
}

.ai-iam-scope[b-c0nek19kh7] {
    position: absolute;
    inset: 0;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 14px;
    line-height: 28px;
    color: #e2e8f0;
    opacity: 0;
    transform: translateY(8px);
    animation: ai-iam-scope-cycle-b-c0nek19kh7 16s infinite;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ai-iam-scope-1[b-c0nek19kh7] { animation-delay: 0s; }
.ai-iam-scope-2[b-c0nek19kh7] { animation-delay: 4s; }
.ai-iam-scope-3[b-c0nek19kh7] { animation-delay: 8s; }
.ai-iam-scope-4[b-c0nek19kh7] { animation-delay: 12s; }

.ai-iam-scope .sc-ns[b-c0nek19kh7] { color: #818cf8; font-weight: 600; }
.ai-iam-scope .sc-r[b-c0nek19kh7]  { color: #fbbf24; }
.ai-iam-scope .sc-a[b-c0nek19kh7]  { color: #34d399; font-weight: 600; }
.ai-iam-scope .sc-c[b-c0nek19kh7]  { color: #94a3b8; }
.ai-iam-scope .sc-v[b-c0nek19kh7]  { color: #f8fafc; }

.ai-iam-arrow[b-c0nek19kh7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 14px 0;
    color: #6366f1;
}

.ai-iam-arrow i[b-c0nek19kh7] {
    font-size: 22px;
    animation: ai-iam-arrow-pulse-b-c0nek19kh7 2.4s ease-in-out infinite;
}

.ai-iam-arrow span[b-c0nek19kh7] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #6366f1;
}

@keyframes ai-iam-typewriter-b-c0nek19kh7 {
    0%   { opacity: 0; clip-path: inset(0 100% 0 0); }
    1%   { opacity: 1; }
    14%  { opacity: 1; clip-path: inset(0 0 0 0); }
    23%  { opacity: 1; clip-path: inset(0 0 0 0); }
    25%  { opacity: 0; }
    100% { opacity: 0; clip-path: inset(0 0 0 0); }
}

@keyframes ai-iam-scope-cycle-b-c0nek19kh7 {
    0%   { opacity: 0; transform: translateY(8px); }
    14%  { opacity: 0; transform: translateY(8px); }
    18%  { opacity: 1; transform: translateY(0); }
    23%  { opacity: 1; transform: translateY(0); }
    25%  { opacity: 0; transform: translateY(-4px); }
    100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes ai-iam-caret-blink-b-c0nek19kh7 {
    0%, 50%   { opacity: 1; }
    51%, 100% { opacity: 0; }
}

@keyframes ai-iam-arrow-pulse-b-c0nek19kh7 {
    0%, 100% { transform: translateY(0); opacity: 0.7; }
    50%      { transform: translateY(2px); opacity: 1; }
}

@media (max-width: 720px) {
    .ai-iam-mock-body[b-c0nek19kh7]  { padding: 18px; }
    .ai-iam-prompt[b-c0nek19kh7]     { font-size: 14px; line-height: 24px; }
    .ai-iam-scope[b-c0nek19kh7]      { font-size: 12px; line-height: 24px; }
    .ai-iam-prompt-wrap[b-c0nek19kh7],
    .ai-iam-scope-wrap[b-c0nek19kh7] { min-height: 48px; white-space: normal; }
    .ai-iam-prompt[b-c0nek19kh7],
    .ai-iam-scope[b-c0nek19kh7]      { white-space: normal; }
}

/* ══════════════════════════════════════════════════════════════════════════
   LOWER PAGE — design handoff 2026-07-27, option `1a` "The Evidence Case"
   정본 = Axowl_redesign/design_handoff_axowl_lower_page/README.md

   프로토타입의 인라인 스타일을 옮긴 게 아니라, 핸드오프의 토큰·수치 표를 읽고
   이 파일의 스코프드 CSS 관례로 재작성한 것이다. 값은 README 와 1:1 대응한다.

   폰트: README §Type — "사이트가 이미 grotesque 를 쓰면 Archivo 대신 그것" → Inter.
         JetBrains Mono 는 index.html 이 이미 400/500 을 로드한다(추가 요청 없음).
   ══════════════════════════════════════════════════════════════════════════ */

.lp-sec[b-c0nek19kh7] {
    width: 100%;
    box-sizing: border-box;
    position: relative;   /* .lp-rails 기준 */
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ── 좌우 세로 레일 ─────────────────────────────────────────────────────
   히어로(`.mhero-rails`)와 **같은 구조·같은 1280px 프레임**을 쓴다. 값을 베낀 게 아니라
   같은 규칙을 쓰는 것이라 뷰포트가 바뀌어도 히어로 레일과 어긋나지 않는다.
   다크 섹션은 #D4D4D8 이 너무 밝아 토큰의 Hairline(dark) 로 교체. */
.lp-rails[b-c0nek19kh7] {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    max-width: 1280px;
    height: 100%;
    display: flex;
    pointer-events: none;
}
.lp-rail[b-c0nek19kh7] { flex: 1; border-left: 1px solid #D4D4D8; height: 100%; }
.lp-rail--r[b-c0nek19kh7] { border-left: none; border-right: 1px solid #D4D4D8; }
.lp-sec--dark .lp-rail[b-c0nek19kh7] { border-color: #242424; }

/* 레일이 절대배치라 콘텐츠를 위로 올린다. */
.lp-sec > .lp-wrap[b-c0nek19kh7] { position: relative; z-index: 1; }

/* 1240px 프로토타입 프레임 = 1080 콘텐츠 + 80 좌우 거터. */
.lp-wrap[b-c0nek19kh7] {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 80px;
    box-sizing: border-box;
}

.lp-sec--light[b-c0nek19kh7]    { background: #ffffff; }
.lp-sec--offwhite[b-c0nek19kh7] { background: #f4f4f2; }
.lp-sec--dark[b-c0nek19kh7]     { background: #0a0a0a; }

.lp-s1[b-c0nek19kh7] { padding: 100px 0 90px; }
.lp-s2[b-c0nek19kh7] { padding: 100px 0 94px; }
.lp-s3[b-c0nek19kh7] { padding: 100px 0 94px; }
.lp-s4[b-c0nek19kh7] { padding: 94px 0 97px; }
.lp-s5[b-c0nek19kh7] { padding: 108px 0 115px; }

/* ── Scroll reveal (lower-reveal.js 가 .is-revealed 를 붙인다) ─────────── */
.lp-sec [data-reveal][b-c0nek19kh7] {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity .7s ease, transform .7s ease;
}
.lp-sec [data-reveal].is-revealed[b-c0nek19kh7] { opacity: 1; transform: none; }
.lp-sec [data-reveal][data-reveal-delay="1"][b-c0nek19kh7] { transition-delay: .10s; }
.lp-sec [data-reveal][data-reveal-delay="2"][b-c0nek19kh7] { transition-delay: .15s; }

@media (prefers-reduced-motion: reduce) {
    .lp-sec [data-reveal][b-c0nek19kh7] { opacity: 1; transform: none; transition: none; }
}

/* ── 공통 타이포 원자 ──────────────────────────────────────────────────── */
.lp-kicker[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500;
    font-size: 11px;
    line-height: 1;
    letter-spacing: .18em;
    color: #16a34a;
    margin-bottom: 22px;
}

.lp-h2[b-c0nek19kh7] {
    font-weight: 700;
    font-size: 48px;
    line-height: 1.04;
    letter-spacing: -.035em;
    color: #0a0a0a;
    margin: 0 0 24px;
    max-width: 20ch;
    text-wrap: balance;
}
.lp-h2--xl[b-c0nek19kh7]     { font-size: 56px; line-height: 1.02; max-width: 19ch; }
.lp-h2--onDark[b-c0nek19kh7] { color: #ffffff; max-width: 18ch; margin: 0; }
.lp-h2--cta[b-c0nek19kh7]    { font-size: 61px; line-height: 1; letter-spacing: -.04em; color: #ffffff; max-width: none; margin: 0; }

.lp-lead[b-c0nek19kh7] {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.6;
    color: #57575a;
    margin: 0;
    max-width: 58ch;
    text-wrap: pretty;
}
.lp-lead--wide[b-c0nek19kh7] { max-width: 62ch; }

.lp-support[b-c0nek19kh7] {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.65;
    color: #9a9a9d;
    margin: 0;
}
.lp-support--cta[b-c0nek19kh7] { font-size: 17px; line-height: 1.6; max-width: 48ch; margin-top: 24px; }

/* ── 버튼 ──────────────────────────────────────────────────────────────── */
.lp-btn[b-c0nek19kh7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 999px;
    font-family: inherit;
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
.lp-btn--ink[b-c0nek19kh7] { padding: 16px 28px; background: #0a0a0a; color: #ffffff; }
.lp-btn--ink:hover[b-c0nek19kh7] { background: #16a34a; color: #ffffff; }

.lp-btn--white[b-c0nek19kh7] { padding: 12px 22px; background: #ffffff; color: #0a0a0a; font-size: 13px; }
.lp-btn--white:hover[b-c0nek19kh7]  { background: #16a34a; color: #ffffff; }
.lp-btn--white:active[b-c0nek19kh7] { background: #128a3a; color: #ffffff; }
.lp-btn--white[disabled][b-c0nek19kh7] { cursor: default; }

.lp-btn--ghost[b-c0nek19kh7] { background: transparent; color: #ffffff; border: 1px solid #333333; }
.lp-btn--ghost:hover[b-c0nek19kh7] { border-color: #ffffff; }

.lp-btn--block[b-c0nek19kh7] { display: flex; width: 100%; padding: 20px 28px; font-size: 15px; }

/* 사이트에 공용 포커스 처리가 없어 핸드오프 권장값 사용. */
.lp-sec a:focus-visible[b-c0nek19kh7],
.lp-sec button:focus-visible[b-c0nek19kh7] { outline: 2px solid #16a34a; outline-offset: 2px; }

/* ── 1px 헤어라인 그리드 ───────────────────────────────────────────────── */
.lp-grid[b-c0nek19kh7] { display: grid; gap: 1px; }
.lp-grid--3[b-c0nek19kh7] { grid-template-columns: repeat(3, 1fr); }
.lp-grid--4[b-c0nek19kh7] { grid-template-columns: repeat(4, 1fr); }

/* ══ Section 1 ════════════════════════════════════════════════════════════ */
.lp-s1-head[b-c0nek19kh7] {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 54px;
    align-items: end;
}

.lp-claim[b-c0nek19kh7] { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
.lp-claim-head[b-c0nek19kh7] {
    font-weight: 600; font-size: 23px; line-height: 1.25;
    letter-spacing: -.025em; color: #0a0a0a;
}
.lp-claim-body[b-c0nek19kh7] { font-weight: 400; font-size: 15px; line-height: 1.6; color: #57575a; margin: 0; }
.lp-claim-cta[b-c0nek19kh7]  { margin-top: 8px; }

.lp-cap[b-c0nek19kh7] {
    margin-top: 60px;
    background: #e6e6e6;
    border: 1px solid #e6e6e6;
    border-radius: 16px;
    overflow: hidden;
}
.lp-cap-cell[b-c0nek19kh7] { background: #ffffff; padding: 30px 26px 32px; }
.lp-cap-head[b-c0nek19kh7] {
    font-weight: 600; font-size: 17px; line-height: 1.2;
    letter-spacing: -.02em; color: #0a0a0a; margin-bottom: 20px;
}
.lp-cap-list[b-c0nek19kh7] { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 13px; }
.lp-cap-list li[b-c0nek19kh7] {
    display: flex; gap: 10px; align-items: flex-start;
    font-weight: 400; font-size: 14px; line-height: 1.4; color: #57575a;
}
.lp-check[b-c0nek19kh7] { color: #16a34a; flex-shrink: 0; }

/* 코드 무결성 패널 */
.lp-codepanel[b-c0nek19kh7] {
    margin-top: 28px;
    background: #f4f4f2;
    border: 1px solid #e6e6e6;
    border-radius: 16px;
    padding: 36px 34px 34px;
}
.lp-codepanel-head[b-c0nek19kh7] {
    display: grid; grid-template-columns: 1fr 420px; gap: 50px; align-items: end;
}
.lp-codepanel-head .lp-kicker[b-c0nek19kh7] { margin-bottom: 18px; }
.lp-h3[b-c0nek19kh7] {
    font-weight: 700; font-size: 34px; line-height: 1.08;
    letter-spacing: -.03em; color: #0a0a0a; margin: 0; max-width: 22ch;
}
.lp-codepanel-desc[b-c0nek19kh7] { font-weight: 400; font-size: 15px; line-height: 1.6; color: #57575a; margin: 0; }

.lp-stages[b-c0nek19kh7] {
    margin-top: 32px;
    background: #e2e2de;
    border: 1px solid #e2e2de;
    border-radius: 12px;
    overflow: hidden;
}
.lp-stage-cell[b-c0nek19kh7] { background: #ffffff; padding: 22px 22px 24px; }
.lp-stage-label[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500; font-size: 10px; letter-spacing: .14em; color: #9a9a97;
}
.lp-stage-body[b-c0nek19kh7] {
    font-weight: 400; font-size: 14px; line-height: 1.45; color: #0a0a0a; margin: 12px 0 0;
}

.lp-codepanel-foot[b-c0nek19kh7] {
    margin-top: 24px;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 400; font-size: 14px; line-height: 1.5; color: #6b6b6e;
}
.lp-mono-ink[b-c0nek19kh7] { color: #0a0a0a; }

/* "git →" 왼쪽의 Git 마크. inline 이라 줄바꿈 시 텍스트와 같이 흐른다(flex 로 떼어놓지 않음). */
.lp-git-mark[b-c0nek19kh7] {
    font-size: 15px;
    margin-right: 8px;
    vertical-align: -2px;
    color: inherit;
}

.lp-footnote[b-c0nek19kh7] {
    margin-top: 28px;
    display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
    font-weight: 400; font-size: 15px; line-height: 1.5; color: #6b6b6e;
}
.lp-underline[b-c0nek19kh7] {
    font-weight: 600; font-size: 15px; color: #0a0a0a; text-decoration: none;
    border-bottom: 2px solid #0a0a0a; padding-bottom: 2px;
    transition: color .18s ease, border-color .18s ease;
}
.lp-underline:hover[b-c0nek19kh7] { color: #16a34a; border-color: #16a34a; }

/* ══ Section 2 (dark) ═════════════════════════════════════════════════════ */
.lp-s2-head[b-c0nek19kh7] {
    display: grid; grid-template-columns: 1fr 380px; gap: 54px; align-items: end;
}

.lp-steps[b-c0nek19kh7] {
    margin-top: 56px;
    background: #242424;
    border: 1px solid #242424;
    border-radius: 4px;
    overflow: hidden;
}
.lp-step-cell[b-c0nek19kh7] { background: #0f0f0f; padding: 38px 34px 42px; }
.lp-step-label[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500; font-size: 11px; letter-spacing: .16em; color: #16a34a;
}
.lp-step-title[b-c0nek19kh7] {
    font-weight: 600; font-size: 22px; line-height: 1.2; letter-spacing: -.02em;
    color: #ffffff; margin: 22px 0 14px;
}
.lp-step-body[b-c0nek19kh7] { font-weight: 400; font-size: 15px; line-height: 1.6; color: #8e8e91; margin: 0; }

.lp-verify[b-c0nek19kh7] {
    margin-top: 34px;
    background: #0f0f0f;
    border: 1px solid #242424;
    border-radius: 4px;
    padding: 30px 34px 32px;
}
.lp-verify-head[b-c0nek19kh7] { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.lp-verify-label[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500; font-size: 11px; letter-spacing: .16em; color: #6e6e72;
}

.lp-chain[b-c0nek19kh7] { display: flex; align-items: stretch; margin-top: 24px; }
.lp-chain-card[b-c0nek19kh7] {
    flex: 1 1 0;
    border: 1px solid #242424;
    border-radius: 3px;
    padding: 16px 18px;
}
.lp-chain-arrow[b-c0nek19kh7] {
    flex: 0 0 40px;
    display: flex; align-items: center; justify-content: center;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-size: 15px; color: #3a3a3e;
}
.lp-chain-ts[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 400; font-size: 11px; color: #5f5f63;
}
.lp-chain-hash[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500; font-size: 13px; color: #d6d6d8; margin-top: 10px;
}
.lp-chain-event[b-c0nek19kh7] { font-weight: 400; font-size: 12px; color: #8e8e91; margin-top: 10px; }

.lp-verify-status[b-c0nek19kh7] {
    margin-top: 20px;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500; font-size: 13px; line-height: 1.4; color: #6e6e72;
}
.lp-verify-status.is-done[b-c0nek19kh7] { color: #16a34a; }

/* ══ Section 3 ════════════════════════════════════════════════════════════ */
.lp-s3-head .lp-h2[b-c0nek19kh7] { margin-bottom: 24px; }

.lp-fw[b-c0nek19kh7] {
    margin-top: 56px;
    background: #e6e6e6;
    border: 1px solid #e6e6e6;
    overflow: hidden;
}
.lp-fw-cell[b-c0nek19kh7] { background: #ffffff; padding: 30px 28px 32px; }
.lp-fw-name[b-c0nek19kh7] {
    display: flex; align-items: center; gap: 10px;
    font-weight: 600; font-size: 18px; line-height: 1.2; letter-spacing: -.02em; color: #0a0a0a;
}
.lp-dot[b-c0nek19kh7] { width: 7px; height: 7px; border-radius: 999px; background: #16a34a; flex-shrink: 0; }
.lp-fw-desc[b-c0nek19kh7] { font-weight: 400; font-size: 14px; line-height: 1.55; color: #6b6b6e; margin: 14px 0 0; }

/* ══ Section 4 ════════════════════════════════════════════════════════════ */
.lp-compare[b-c0nek19kh7] { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; }
.lp-compare-head[b-c0nek19kh7] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', ui-monospace, monospace;
    font-weight: 500; font-size: 11px; letter-spacing: .18em; margin-bottom: 26px;
}
.lp-compare-head--today[b-c0nek19kh7] { color: #9a9a97; }
.lp-compare-head--axowl[b-c0nek19kh7] { color: #16a34a; }

.lp-compare-row[b-c0nek19kh7] { padding: 20px 0; font-size: 17px; line-height: 1.45; }
.lp-compare-row--today[b-c0nek19kh7] {
    font-weight: 400; color: #79797a;
    border-top: 1px solid #dcdcd8;
}
.lp-compare-row--today:last-child[b-c0nek19kh7] { border-bottom: 1px solid #dcdcd8; }

.lp-compare-row--axowl[b-c0nek19kh7] {
    font-weight: 500; color: #0a0a0a;
    border-top: 1px solid #d2d2ce;
}
/* 오른쪽 열의 첫 룰만 잉크색 — 시선을 With Axowl 쪽으로 끄는 장치. */
.lp-compare-row--axowl:first-of-type[b-c0nek19kh7] { border-top-color: #0a0a0a; }
.lp-compare-row--axowl:last-child[b-c0nek19kh7] { border-bottom: 1px solid #d2d2ce; }

/* ══ Section 5 (dark) ═════════════════════════════════════════════════════ */
.lp-s5-grid[b-c0nek19kh7] { display: grid; grid-template-columns: 1fr 400px; gap: 54px; align-items: end; }
.lp-s5-actions[b-c0nek19kh7] { display: flex; flex-direction: column; gap: 12px; }
.lp-s5-note[b-c0nek19kh7] {
    margin-top: 8px; text-align: center;
    font-weight: 400; font-size: 13px; line-height: 1.4; color: #6e6e72;
}

/* ══ Responsive — README §Responsive behavior ═════════════════════════════ */
@media (max-width: 1239px) {
    .lp-wrap[b-c0nek19kh7] { padding: 0 48px; }
    .lp-h2[b-c0nek19kh7]      { font-size: 41px; }
    .lp-h2--xl[b-c0nek19kh7]  { font-size: 48px; }
    .lp-h2--cta[b-c0nek19kh7] { font-size: 52px; }
    .lp-h3[b-c0nek19kh7]      { font-size: 29px; }
    .lp-s1-head[b-c0nek19kh7],
    .lp-s2-head[b-c0nek19kh7],
    .lp-s5-grid[b-c0nek19kh7] { grid-template-columns: 1fr 340px; gap: 40px; }
    .lp-codepanel-head[b-c0nek19kh7] { grid-template-columns: 1fr 340px; gap: 36px; }
}

@media (max-width: 899px) {
    .lp-wrap[b-c0nek19kh7] { padding: 0 24px; }

    .lp-s1[b-c0nek19kh7], .lp-s2[b-c0nek19kh7], .lp-s3[b-c0nek19kh7], .lp-s4[b-c0nek19kh7] { padding: 44px 0 48px; }
    .lp-s5[b-c0nek19kh7] { padding: 44px 0 56px; }

    .lp-s1-head[b-c0nek19kh7],
    .lp-s2-head[b-c0nek19kh7],
    .lp-s5-grid[b-c0nek19kh7],
    .lp-codepanel-head[b-c0nek19kh7] { grid-template-columns: 1fr; gap: 28px; align-items: start; }

    .lp-h2[b-c0nek19kh7]      { font-size: 34px; max-width: none; }
    .lp-h2--xl[b-c0nek19kh7]  { font-size: 34px; max-width: none; }
    .lp-h2--cta[b-c0nek19kh7] { font-size: 38px; }
    .lp-h3[b-c0nek19kh7]      { font-size: 25px; max-width: none; }
    .lp-lead[b-c0nek19kh7], .lp-support--cta[b-c0nek19kh7] { font-size: 15px; max-width: none; }

    .lp-claim[b-c0nek19kh7] { align-items: stretch; }
    .lp-claim-head[b-c0nek19kh7] { font-size: 22px; }
    .lp-claim-cta[b-c0nek19kh7] { display: flex; width: 100%; }

    .lp-grid--3[b-c0nek19kh7], .lp-grid--4[b-c0nek19kh7] { grid-template-columns: 1fr; }

    .lp-cap[b-c0nek19kh7] { border-radius: 14px; margin-top: 40px; }
    .lp-cap-head[b-c0nek19kh7] { font-size: 15px; }
    .lp-cap-list li[b-c0nek19kh7] { font-size: 13px; }
    /* 모바일 프레임은 각 그룹의 다섯째 행을 뺀다. */
    .lp-cap-list li:nth-child(5)[b-c0nek19kh7] { display: none; }

    .lp-codepanel[b-c0nek19kh7] { padding: 26px 22px 24px; }
    .lp-codepanel-foot[b-c0nek19kh7] { font-size: 12px; }

    /* 모바일 프레임에 없는 두 블록 — 핸드오프대로 뺀다. */
    .lp-verify[b-c0nek19kh7]  { display: none; }
    .lp-compare[b-c0nek19kh7] { display: none; }

    .lp-fw[b-c0nek19kh7]    { margin-top: 40px; }
    .lp-steps[b-c0nek19kh7] { margin-top: 40px; }
    .lp-step-cell[b-c0nek19kh7] { padding: 28px 24px 30px; }

    /* CTA 는 모바일에서 primary 하나 + footnote 제거. */
    .lp-s5-actions .lp-btn--ghost[b-c0nek19kh7] { display: none; }
    .lp-s5-note[b-c0nek19kh7] { display: none; }
}
/* /Features/Home/Pages/HowItWorks.razor.rz.scp.css */
/* =========================================
   How it works — vertical pipeline.
   Greys only; #0a0a0a is the active accent.
   Literal hex throughout — scoped CSS doesn't reliably
   carry custom-property declarations across components.
========================================= */

/* =========================================
   Sections — explicit width:100% so the parent's align-items:center
   on .landing-content doesn't shrink-wrap us to content width.
   Also box-sizing so the 200px padding adds on top of width: 100%.
========================================= */
.hiw-hero[b-yshaxeax3c],
.hiw-stage[b-yshaxeax3c],
.hiw-cta[b-yshaxeax3c] {
    width: 100%;
    box-sizing: border-box;
    align-self: stretch;
}

/* =========================================
   HERO
========================================= */
.hiw-hero[b-yshaxeax3c] {
    padding: 72px 32px 16px;
    text-align: center;
    background: #ffffff;
}

.hiw-eyebrow[b-yshaxeax3c] {
    display: inline-block;
    padding: 4px 11px;
    border: 1px solid #d4d4d4;
    border-radius: 999px;
    color: #737373;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.10em;
    text-transform: uppercase;
    margin-bottom: 18px;
}

.hiw-title[b-yshaxeax3c] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    line-height: 1.08;
    letter-spacing: -0.022em;
    color: #0a0a0a;
    margin: 0 auto 16px;
    max-width: 20ch;
}

.hiw-lede[b-yshaxeax3c] {
    font-size: 0.98rem;
    line-height: 1.6;
    color: #737373;
    max-width: 50ch;
    margin: 0 auto;
}

/* =========================================
   STAGE — vertical timeline
========================================= */
.hiw-stage[b-yshaxeax3c] {
    padding: 0 32px 24px;
    background: #ffffff;
}

.hiw-stage-track[b-yshaxeax3c] {
    position: relative;
    max-width: 720px;
    margin: 0 auto;
    padding: 0 0 0 0;
}

/* Vertical dashed line down the left side, drawing top→bottom. */
.hiw-track-line[b-yshaxeax3c] {
    position: absolute;
    left: 31px; /* aligns with center of 64px actor column */
    top: 32px;
    bottom: 32px;
    width: 1px;
    background-image: linear-gradient(
        to bottom,
        #d4d4d4 0,
        #d4d4d4 6px,
        transparent 6px,
        transparent 14px
    );
    background-size: 1px 14px;
    background-repeat: repeat-y;
    transform-origin: top;
    transform: scaleY(0);
    transition: transform 1.6s cubic-bezier(.22,.61,.36,1) 0.2s;
}

.hiw-stage.hiw-active .hiw-track-line[b-yshaxeax3c] {
    transform: scaleY(1);
}

/* Each station is a row: actor (left) + leader + caption (right) */
.hiw-station[b-yshaxeax3c] {
    position: relative;
    display: grid;
    grid-template-columns: 64px 56px 1fr;
    align-items: center;
    gap: 0;
    padding: 4px 0;
    --hiw-stroke: #a3a3a3; /* per-station local var, supported in modern browsers */
}

/* Actor wrapper sits on the track line; white background masks the dashes
   that pass behind it so the actor reads as a node on the line. */
.hiw-actor[b-yshaxeax3c] {
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.4s ease-out;
}

.hiw-stage.hiw-station-1-visible .hiw-station[data-station="1"] .hiw-actor[b-yshaxeax3c],
.hiw-stage.hiw-station-2-visible .hiw-station[data-station="2"] .hiw-actor[b-yshaxeax3c],
.hiw-stage.hiw-station-3-visible .hiw-station[data-station="3"] .hiw-actor[b-yshaxeax3c],
.hiw-stage.hiw-station-4-visible .hiw-station[data-station="4"] .hiw-actor[b-yshaxeax3c],
.hiw-stage.hiw-station-5-visible .hiw-station[data-station="5"] .hiw-actor[b-yshaxeax3c],
.hiw-stage.hiw-station-6-visible .hiw-station[data-station="6"] .hiw-actor[b-yshaxeax3c],
.hiw-stage.hiw-station-7-visible .hiw-station[data-station="7"] .hiw-actor[b-yshaxeax3c] {
    opacity: 1;
}

/* Active state — flips local stroke var to ink */
.hiw-stage.hiw-station-1-active .hiw-station[data-station="1"][b-yshaxeax3c],
.hiw-stage.hiw-station-2-active .hiw-station[data-station="2"][b-yshaxeax3c],
.hiw-stage.hiw-station-3-active .hiw-station[data-station="3"][b-yshaxeax3c],
.hiw-stage.hiw-station-4-active .hiw-station[data-station="4"][b-yshaxeax3c],
.hiw-stage.hiw-station-5-active .hiw-station[data-station="5"][b-yshaxeax3c],
.hiw-stage.hiw-station-6-active .hiw-station[data-station="6"][b-yshaxeax3c],
.hiw-stage.hiw-station-7-active .hiw-station[data-station="7"][b-yshaxeax3c] {
    --hiw-stroke: #0a0a0a;
}

/* =========================================
   LEADER — short horizontal line + tick at the end
========================================= */
.hiw-leader[b-yshaxeax3c] {
    position: relative;
    height: 1px;
    width: 80px;
    align-self: center;
}

.hiw-leader-line[b-yshaxeax3c] {
    position: absolute;
    top: 0;
    left: 0;
    width: 80px;
    height: 1px;
    background: #d4d4d4;
    transform-origin: left center;
    transform: scaleX(0);
    transition: transform 0.6s cubic-bezier(.22,.61,.36,1), background 0.4s ease-out;
}

.hiw-leader-tip[b-yshaxeax3c] {
    position: absolute;
    top: -3px;
    left: 76px;
    width: 4px;
    height: 7px;
    background: transparent;
    border-left: 1px solid #d4d4d4;
    transform: scaleY(0);
    transform-origin: top center;
    transition: transform 0.3s ease-out 0.5s, border-color 0.4s ease-out;
}

.hiw-stage.hiw-station-1-leader .hiw-station[data-station="1"] .hiw-leader-line[b-yshaxeax3c],
.hiw-stage.hiw-station-2-leader .hiw-station[data-station="2"] .hiw-leader-line[b-yshaxeax3c],
.hiw-stage.hiw-station-3-leader .hiw-station[data-station="3"] .hiw-leader-line[b-yshaxeax3c],
.hiw-stage.hiw-station-4-leader .hiw-station[data-station="4"] .hiw-leader-line[b-yshaxeax3c],
.hiw-stage.hiw-station-5-leader .hiw-station[data-station="5"] .hiw-leader-line[b-yshaxeax3c],
.hiw-stage.hiw-station-6-leader .hiw-station[data-station="6"] .hiw-leader-line[b-yshaxeax3c],
.hiw-stage.hiw-station-7-leader .hiw-station[data-station="7"] .hiw-leader-line[b-yshaxeax3c] {
    transform: scaleX(1);
}

.hiw-stage.hiw-station-1-leader .hiw-station[data-station="1"] .hiw-leader-tip[b-yshaxeax3c],
.hiw-stage.hiw-station-2-leader .hiw-station[data-station="2"] .hiw-leader-tip[b-yshaxeax3c],
.hiw-stage.hiw-station-3-leader .hiw-station[data-station="3"] .hiw-leader-tip[b-yshaxeax3c],
.hiw-stage.hiw-station-4-leader .hiw-station[data-station="4"] .hiw-leader-tip[b-yshaxeax3c],
.hiw-stage.hiw-station-5-leader .hiw-station[data-station="5"] .hiw-leader-tip[b-yshaxeax3c],
.hiw-stage.hiw-station-6-leader .hiw-station[data-station="6"] .hiw-leader-tip[b-yshaxeax3c],
.hiw-stage.hiw-station-7-leader .hiw-station[data-station="7"] .hiw-leader-tip[b-yshaxeax3c] {
    transform: scaleY(1);
}

/* =========================================
   CAPTION — typewriter
========================================= */
.hiw-caption[b-yshaxeax3c] {
    margin: 0;
    font-family: ui-monospace, "SF Mono", "JetBrains Mono", Consolas, monospace;
    font-size: 0.92rem;
    line-height: 1.5;
    color: #525252;
    min-height: 1.5em;
}

.hiw-caption[b-yshaxeax3c]::after {
    content: "▌";
    display: none;
    color: #0a0a0a;
    margin-left: 1px;
    animation: hiw-caret-b-yshaxeax3c 0.85s steps(1) infinite;
}

.hiw-stage.hiw-station-1-typing .hiw-station[data-station="1"] .hiw-caption[b-yshaxeax3c]::after,
.hiw-stage.hiw-station-2-typing .hiw-station[data-station="2"] .hiw-caption[b-yshaxeax3c]::after,
.hiw-stage.hiw-station-3-typing .hiw-station[data-station="3"] .hiw-caption[b-yshaxeax3c]::after,
.hiw-stage.hiw-station-4-typing .hiw-station[data-station="4"] .hiw-caption[b-yshaxeax3c]::after,
.hiw-stage.hiw-station-5-typing .hiw-station[data-station="5"] .hiw-caption[b-yshaxeax3c]::after,
.hiw-stage.hiw-station-6-typing .hiw-station[data-station="6"] .hiw-caption[b-yshaxeax3c]::after,
.hiw-stage.hiw-station-7-typing .hiw-station[data-station="7"] .hiw-caption[b-yshaxeax3c]::after {
    display: inline-block;
}

@keyframes hiw-caret-b-yshaxeax3c {
    0%, 50%   { opacity: 1; }
    51%, 100% { opacity: 0; }
}

/* =========================================
   Station 1 — Fingerprint (concentric arcs blink, then ink)
========================================= */
.hiw-fp[b-yshaxeax3c] {
    position: relative;
    width: 56px;
    height: 56px;
}

.hiw-fp-arc[b-yshaxeax3c] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    border-bottom-color: transparent;
    border-left-color: transparent;
    transform: rotate(-45deg);
    transition: border-color 0.3s ease-out;
}

.hiw-fp-arc:nth-child(2)[b-yshaxeax3c] { inset: 8px;  }
.hiw-fp-arc:nth-child(3)[b-yshaxeax3c] { inset: 16px; }

.hiw-fp-dot[b-yshaxeax3c] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--hiw-stroke, #a3a3a3);
    transform: translate(-50%, -50%);
    transition: background 0.3s ease-out;
}

.hiw-stage.hiw-station-1-visible:not(.hiw-station-1-active) .hiw-fp-arc[b-yshaxeax3c],
.hiw-stage.hiw-station-1-visible:not(.hiw-station-1-active) .hiw-fp-dot[b-yshaxeax3c] {
    animation: hiw-fp-blink-b-yshaxeax3c 1.0s ease-in-out infinite;
}

@keyframes hiw-fp-blink-b-yshaxeax3c {
    0%, 100% { opacity: 1;   }
    50%      { opacity: 0.20; }
}

.hiw-stage.hiw-station-1-active .hiw-fp-arc[b-yshaxeax3c],
.hiw-stage.hiw-station-1-active .hiw-fp-dot[b-yshaxeax3c] {
    animation: none;
}

/* =========================================
   Station 2 — Chip (abstract square + inner circle)
========================================= */
.hiw-chip[b-yshaxeax3c] {
    position: relative;
    width: 48px;
    height: 48px;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    border-radius: 4px;
    transition: border-color 0.4s ease-out;
}

.hiw-chip-mark[b-yshaxeax3c] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: border-color 0.4s ease-out, background 0.4s ease-out;
}

.hiw-stage.hiw-station-2-active .hiw-chip-mark[b-yshaxeax3c] {
    background: #0a0a0a;
    border-color: #0a0a0a;
}

/* =========================================
   Station 3 — Chain (3 squares appear in sequence)
========================================= */
.hiw-chain[b-yshaxeax3c] {
    display: flex;
    align-items: center;
    gap: 4px;
    width: 88px;
    justify-content: center;
}

.hiw-chain-block[b-yshaxeax3c] {
    width: 14px;
    height: 14px;
    border: 1.2px solid var(--hiw-stroke, #a3a3a3);
    border-radius: 2px;
    transform: translateY(-4px);
    opacity: 0;
    transition:
        opacity 0.5s ease-out,
        transform 0.5s cubic-bezier(.34,1.4,.6,1),
        border-color 0.4s ease-out,
        background 0.4s ease-out;
}

.hiw-chain-link[b-yshaxeax3c] {
    width: 6px;
    height: 1px;
    background: var(--hiw-stroke, #a3a3a3);
    opacity: 0;
    transition: opacity 0.3s ease-out, background 0.4s ease-out;
}

.hiw-stage.hiw-station-3-visible .hiw-chain-block--1[b-yshaxeax3c] { opacity: 1; transform: translateY(0); transition-delay: 0s; }
.hiw-stage.hiw-station-3-visible .hiw-chain-link--1[b-yshaxeax3c]  { opacity: 1; transition-delay: 0.18s; }
.hiw-stage.hiw-station-3-visible .hiw-chain-block--2[b-yshaxeax3c] { opacity: 1; transform: translateY(0); transition-delay: 0.28s; }
.hiw-stage.hiw-station-3-visible .hiw-chain-link--2[b-yshaxeax3c]  { opacity: 1; transition-delay: 0.46s; }
.hiw-stage.hiw-station-3-visible .hiw-chain-block--3[b-yshaxeax3c] { opacity: 1; transform: translateY(0); transition-delay: 0.56s; }

.hiw-stage.hiw-station-3-active .hiw-chain-block[b-yshaxeax3c],
.hiw-stage.hiw-station-3-active .hiw-chain-link[b-yshaxeax3c] {
    background: #0a0a0a;
    border-color: #0a0a0a;
}

/* =========================================
   Station 4 — PUF cluster reaches quorum (3 nodes, ≥2 must agree)
   Three small dots in a triangle with thin links between them.
   They light up sequentially; when the second one ticks, quorum is met
   and the whole cluster pulses to ink.
========================================= */
.hiw-quorum[b-yshaxeax3c] {
    position: relative;
    width: 56px;
    height: 56px;
}

.hiw-quorum-node[b-yshaxeax3c] {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    background: #ffffff;
    transition: background 0.3s ease-out, border-color 0.3s ease-out;
    z-index: 1;
}

/* Triangular arrangement: top-center, bottom-left, bottom-right */
.hiw-quorum-node--1[b-yshaxeax3c] { top: 4px;    left: 50%; transform: translateX(-50%); }
.hiw-quorum-node--2[b-yshaxeax3c] { bottom: 4px; left: 8px; }
.hiw-quorum-node--3[b-yshaxeax3c] { bottom: 4px; right: 8px; }

.hiw-quorum-link[b-yshaxeax3c] {
    position: absolute;
    height: 1px;
    background: var(--hiw-stroke, #a3a3a3);
    transform-origin: left center;
    opacity: 0;
    transition: opacity 0.3s ease-out, background 0.3s ease-out;
}

/* Connect node 1 (top) ↔ node 2 (bottom-left) — diagonal */
.hiw-quorum-link--12[b-yshaxeax3c] {
    top: 14px;
    left: 24px;
    width: 22px;
    transform: rotate(120deg);
}
/* node 2 (bottom-left) ↔ node 3 (bottom-right) — horizontal */
.hiw-quorum-link--23[b-yshaxeax3c] {
    bottom: 10px;
    left: 18px;
    width: 22px;
}
/* node 1 (top) ↔ node 3 (bottom-right) — diagonal */
.hiw-quorum-link--13[b-yshaxeax3c] {
    top: 14px;
    right: 6px;
    width: 22px;
    transform: rotate(60deg);
    transform-origin: right center;
}

/* Sequence: node 1 ticks, then 2 (quorum reached!), then 3.
   Ticks = filled black. */
.hiw-stage.hiw-station-4-visible .hiw-quorum-node[b-yshaxeax3c] {
    transition-delay: 0s;
}

.hiw-stage.hiw-station-4-visible .hiw-quorum-link[b-yshaxeax3c] {
    opacity: 1;
    transition-delay: 0.10s;
}

.hiw-stage.hiw-station-4-active .hiw-quorum-node--1[b-yshaxeax3c] {
    background: #0a0a0a;
    border-color: #0a0a0a;
    transition-delay: 0.10s;
}

.hiw-stage.hiw-station-4-active .hiw-quorum-node--2[b-yshaxeax3c] {
    background: #0a0a0a;
    border-color: #0a0a0a;
    transition-delay: 0.55s;
}

/* Node 3 fills last — quorum was already reached at node 2 */
.hiw-stage.hiw-station-4-active .hiw-quorum-node--3[b-yshaxeax3c] {
    background: #0a0a0a;
    border-color: #0a0a0a;
    transition-delay: 1.00s;
}

.hiw-stage.hiw-station-4-active .hiw-quorum-link[b-yshaxeax3c] {
    background: #0a0a0a;
    transition-delay: 0.85s;
}

/* =========================================
   Station 5 — PUF stamp (descends from above onto a mark)
========================================= */
.hiw-puf[b-yshaxeax3c] {
    position: relative;
    width: 56px;
    height: 80px;
}

.hiw-puf-arm[b-yshaxeax3c] {
    position: absolute;
    top: 0;
    left: 50%;
    width: 1.5px;
    height: 30px;
    background: var(--hiw-stroke, #a3a3a3);
    transform: translateX(-50%);
    transition: background 0.4s ease-out;
}

.hiw-puf-pad[b-yshaxeax3c] {
    position: absolute;
    top: 28px;
    left: 50%;
    width: 30px;
    height: 18px;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    border-radius: 2px;
    transform: translateX(-50%);
    transition:
        top 0.5s cubic-bezier(.6,0,.6,1.4),
        background 0.2s ease-out,
        border-color 0.4s ease-out;
}

.hiw-puf-mark[b-yshaxeax3c] {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 24px;
    height: 24px;
    border-radius: 2px;
    background: #0a0a0a;
    transform: translateX(-50%) scale(0);
    opacity: 0;
}

.hiw-stage.hiw-station-5-active .hiw-puf-pad[b-yshaxeax3c] {
    animation: hiw-puf-strike-b-yshaxeax3c 0.9s cubic-bezier(.65,.05,.65,1.4) forwards;
}

@keyframes hiw-puf-strike-b-yshaxeax3c {
    0%   { top: 0;    background: transparent; }
    55%  { top: 50px; background: transparent; }
    62%  { top: 50px; background: #0a0a0a; border-color: #0a0a0a; }
    100% { top: 18px; background: #0a0a0a; border-color: #0a0a0a; }
}

.hiw-stage.hiw-station-5-active .hiw-puf-mark[b-yshaxeax3c] {
    animation: hiw-puf-mark-land-b-yshaxeax3c 0.5s cubic-bezier(.34,1.4,.64,1) 0.55s forwards;
}

@keyframes hiw-puf-mark-land-b-yshaxeax3c {
    0%   { transform: translateX(-50%) scale(0); opacity: 0; }
    60%  { transform: translateX(-50%) scale(1.1); opacity: 1; }
    100% { transform: translateX(-50%) scale(1); opacity: 1; }
}

/* =========================================
   Station 6 — WORM vault (door slides shut, lock engages)
========================================= */
.hiw-vault[b-yshaxeax3c] {
    position: relative;
    width: 64px;
    height: 56px;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    border-radius: 3px;
    overflow: hidden;
    transition: border-color 0.4s ease-out;
}

.hiw-vault-slot[b-yshaxeax3c] {
    position: absolute;
    top: 50%;
    left: 8px;
    right: 8px;
    height: 4px;
    background: #ededed;
    transform: translateY(-50%);
}

.hiw-vault-door[b-yshaxeax3c] {
    position: absolute;
    top: 0;
    bottom: 0;
    right: -100%;
    width: 100%;
    background: #fafafa;
    border-left: 1.5px solid var(--hiw-stroke, #a3a3a3);
    transition: border-color 0.4s ease-out;
}

.hiw-stage.hiw-station-6-active .hiw-vault-door[b-yshaxeax3c] {
    animation: hiw-vault-shut-b-yshaxeax3c 0.8s cubic-bezier(.65,.05,.36,1) 0.2s forwards;
}

@keyframes hiw-vault-shut-b-yshaxeax3c {
    0%   { right: -100%; }
    100% { right: 0; }
}

.hiw-vault-lock[b-yshaxeax3c] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 12px;
    height: 12px;
    border-radius: 2px;
    background: #0a0a0a;
    transform: translate(-50%, -50%) scale(0);
    opacity: 0;
    z-index: 1;
}

.hiw-stage.hiw-station-6-active .hiw-vault-lock[b-yshaxeax3c] {
    animation: hiw-vault-lock-engage-b-yshaxeax3c 0.4s cubic-bezier(.34,1.6,.64,1) 1.0s forwards;
}

@keyframes hiw-vault-lock-engage-b-yshaxeax3c {
    0%   { transform: translate(-50%, -50%) scale(0); opacity: 0; }
    100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}

/* =========================================
   Station 7 — Verify (check snaps in)
========================================= */
.hiw-check[b-yshaxeax3c] {
    position: relative;
    width: 48px;
    height: 48px;
    border: 1.5px solid var(--hiw-stroke, #a3a3a3);
    border-radius: 50%;
    transition: border-color 0.4s ease-out, background 0.4s ease-out;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hiw-check-mark[b-yshaxeax3c] {
    width: 18px;
    height: 10px;
    border-left: 2px solid var(--hiw-stroke, #a3a3a3);
    border-bottom: 2px solid var(--hiw-stroke, #a3a3a3);
    transform: rotate(-45deg) translate(2px, -2px);
    transition: border-color 0.4s ease-out;
}

.hiw-stage.hiw-station-7-active .hiw-check[b-yshaxeax3c] {
    background: #0a0a0a;
    border-color: #0a0a0a;
}

.hiw-stage.hiw-station-7-active .hiw-check-mark[b-yshaxeax3c] {
    border-color: #ffffff;
}

/* =========================================
   CTA
========================================= */
.hiw-cta[b-yshaxeax3c] {
    padding: 64px 32px 96px;
    text-align: center;
    background: #fafafa;
    border-top: 1px solid #ededed;
}

.hiw-cta-title[b-yshaxeax3c] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', -apple-system, "Segoe UI", sans-serif;
    font-weight: 800;
    font-size: clamp(1.7rem, 3.5vw, 2.4rem);
    letter-spacing: -0.022em;
    color: #0a0a0a;
    margin: 0 0 14px;
}

.hiw-cta-body[b-yshaxeax3c] {
    font-size: 1rem;
    color: #737373;
    margin: 0 0 28px;
}

.hiw-cta-btn[b-yshaxeax3c] {
    display: inline-block;
    padding: 13px 26px;
    background: #0a0a0a;
    color: #ffffff;
    font-weight: 600;
    font-size: 0.92rem;
    border-radius: 6px;
    text-decoration: none;
    transition: transform 0.2s ease-out;
}

.hiw-cta-btn:hover[b-yshaxeax3c] {
    transform: translateY(-2px);
}

/* =========================================
   Mobile — keep vertical layout, shrink leader
========================================= */
@media (max-width: 720px) {
    .hiw-hero[b-yshaxeax3c] {
        padding: 140px 20px 60px;
    }
    .hiw-stage[b-yshaxeax3c] {
        padding: 30px 20px 60px;
    }
    .hiw-station[b-yshaxeax3c] {
        grid-template-columns: 64px 36px 1fr;
    }
    .hiw-actor[b-yshaxeax3c] {
        width: 64px;
        height: 64px;
    }
    .hiw-leader[b-yshaxeax3c] {
        width: 36px;
    }
    .hiw-leader-line[b-yshaxeax3c] {
        width: 36px;
    }
    .hiw-leader-tip[b-yshaxeax3c] {
        left: 32px;
    }
    .hiw-track-line[b-yshaxeax3c] {
        left: 31px;
    }
    .hiw-caption[b-yshaxeax3c] {
        font-size: 0.84rem;
    }
    .hiw-cta[b-yshaxeax3c] {
        padding: 80px 20px 120px;
    }
}

/* =========================================
   Reduced motion — show end state
========================================= */
@media (prefers-reduced-motion: reduce) {
    .hiw-track-line[b-yshaxeax3c] { transform: scaleY(1) !important; transition: none !important; }
    .hiw-actor[b-yshaxeax3c] { opacity: 1 !important; }
    .hiw-leader-line[b-yshaxeax3c] { transform: scaleX(1) !important; }
    .hiw-leader-tip[b-yshaxeax3c] { transform: scaleY(1) !important; }
    .hiw-fp-arc[b-yshaxeax3c], .hiw-fp-dot[b-yshaxeax3c],
    .hiw-puf-pad[b-yshaxeax3c], .hiw-puf-mark[b-yshaxeax3c],
    .hiw-vault-door[b-yshaxeax3c], .hiw-vault-lock[b-yshaxeax3c],
    .hiw-chain-block[b-yshaxeax3c], .hiw-chain-link[b-yshaxeax3c] {
        animation: none !important;
        transition: none !important;
        opacity: 1 !important;
    }
    .hiw-puf-mark[b-yshaxeax3c] { transform: translateX(-50%) scale(1) !important; }
    .hiw-vault-door[b-yshaxeax3c] { right: 0 !important; }
    .hiw-vault-lock[b-yshaxeax3c] { transform: translate(-50%, -50%) scale(1) !important; }
}

/* =========================================
   [5/9 Plan v3 — light grey + flat underline tabs]
   max-width 980px 통일 (아래 enterprise 콘텐츠와 동일).
   active state = bottom border 만, 박스 안 만듬.
========================================= */
.hiw-tabs[b-yshaxeax3c] {
    width: 100%;                     /* 부모 (.landing-content) 가 align-items:center 라 explicit 필요 */
    max-width: 980px;
    margin: 4rem auto 3rem;          /* hero 제거 후 page top 여백 + 아래 content 와 spacing */
    padding: 0 1.5rem;
    display: flex;
    gap: 0;                          /* tabs 50/50 — gap 대신 each flex:1 */
    border-bottom: 1px solid #e2e8f0;
    box-sizing: border-box;
}
.hiw-tab[b-yshaxeax3c] {
    flex: 1;                         /* container 폭 균등 분배 */
    display: grid;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto;
    column-gap: 0.7rem;
    align-items: center;
    padding: 1.1rem 1rem;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    cursor: pointer;
    text-align: left;
    font-family: inherit;
    color: #64748b;
    transition: color 0.18s ease, border-color 0.18s ease;
    margin-bottom: -1px;             /* container border 위 overlap */
}
.hiw-tab:hover[b-yshaxeax3c] { color: #334155; }
.hiw-tab.active[b-yshaxeax3c] {
    color: #0f172a;
    border-bottom-color: #0f172a;    /* near-black accent */
}
.hiw-tab-num[b-yshaxeax3c] {
    grid-row: 1 / 3;
    font-size: 1.4rem;
    font-weight: 800;
    letter-spacing: -0.02em;
    color: #cbd5e1;
    line-height: 1;
}
.hiw-tab.active .hiw-tab-num[b-yshaxeax3c] { color: #94a3b8; }
.hiw-tab-label[b-yshaxeax3c] {
    grid-column: 2;
    grid-row: 1;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.hiw-tab-sub[b-yshaxeax3c] {
    grid-column: 2;
    grid-row: 2;
    font-size: 0.7rem;
    color: #94a3b8;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    margin-top: 0.15rem;
}

/* =========================================
   Enterprise section
========================================= */
.hiw-enterprise[b-yshaxeax3c] {
    width: 100%;                     /* tabs 와 width 정렬 */
    max-width: 980px;
    margin: 2rem auto 4rem;
    padding: 0 1.5rem;
    box-sizing: border-box;
}

.hiw-value-bar[b-yshaxeax3c] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
    margin: 1.4rem 0 2.4rem;
}
.hiw-value-item[b-yshaxeax3c] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.1rem 0.85rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}
.hiw-value-item:hover[b-yshaxeax3c] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06);
    transform: translateY(-1px);
}
.hiw-value-icon[b-yshaxeax3c] {
    font-size: 1.15rem;
    color: #475569;
    margin-bottom: 0.35rem;
    line-height: 1;
}
.hiw-value-label[b-yshaxeax3c] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
    margin-bottom: 0.18rem;
}
.hiw-value-detail[b-yshaxeax3c] {
    font-size: 0.66rem;
    color: #64748b;
    line-height: 1.3;
    font-weight: 500;
}

.hiw-mode-picker[b-yshaxeax3c] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    margin-bottom: 2.2rem;
}
.hiw-mode[b-yshaxeax3c] {
    background: #ffffff;
    border: 1.5px solid #e2e8f0;
    border-radius: 14px;
    padding: 1.4rem 1.4rem 1.5rem;
    text-align: left;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
    position: relative;
    /* 5/9 fix: 버튼의 기본 inline 흐름 무력화 — tag/title/desc 명시적 세로 stack. */
    display: flex;
    flex-direction: column;
    align-items: stretch;       /* children full-width by default (line/title/desc) */
    gap: 0.4rem;
}
/* MODE 뱃지는 top-left 에 작게, 다음 element 부터 full-width line 으로 분리 */
.hiw-mode > .hiw-mode-tag[b-yshaxeax3c] {
    align-self: flex-start;
    margin-bottom: 0.45rem;
}
.hiw-mode > .hiw-mode-title[b-yshaxeax3c] {
    margin: 0 -1.4rem;
    padding: 0.85rem 1.4rem 0;
    border-top: 1px solid #e2e8f0;
}
.hiw-mode.active > .hiw-mode-title[b-yshaxeax3c] {
    border-top-color: #cbd5e1;
}
.hiw-mode:hover[b-yshaxeax3c] { border-color: #cbd5e1; }
.hiw-mode.active[b-yshaxeax3c] {
    border-color: #0f172a;       /* near-black */
    background: #f8fafc;
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
}
.hiw-mode.active[b-yshaxeax3c]::after {
    content: "✓";
    position: absolute;
    top: 0.85rem;
    right: 1rem;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #0f172a;        /* near-black */
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hiw-mode-tag[b-yshaxeax3c] {
    display: inline-block;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    color: #64748b;
    text-transform: uppercase;
    padding: 0.22rem 0.55rem;
    background: #f1f5f9;
    border-radius: 4px;
    margin-bottom: 0.7rem;
    white-space: nowrap;
}
.hiw-mode.active .hiw-mode-tag[b-yshaxeax3c] {
    background: #0f172a;         /* near-black */
    color: #ffffff;
}
.hiw-mode-title[b-yshaxeax3c] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.55rem;
    letter-spacing: -0.01em;
}
.hiw-mode-desc[b-yshaxeax3c] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.55;
}

.hiw-steps[b-yshaxeax3c] {
    list-style: none;
    counter-reset: hiw-step;
    padding: 0;
    margin: 0 0 2rem 0;
}
.hiw-step[b-yshaxeax3c] {
    display: grid;
    grid-template-columns: 38px 1fr;
    gap: 1rem;
    padding: 0.85rem 0;
    border-bottom: 1px solid #f1f5f9;
}
.hiw-step:last-child[b-yshaxeax3c] { border-bottom: none; }
.hiw-step-num[b-yshaxeax3c] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #475569;        /* was #0f172a navy */
    color: #ffffff;             /* was #fbbf24 amber */
    font-weight: 800;
    font-size: 0.82rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.hiw-step-body[b-yshaxeax3c] {
    font-size: 0.9rem;
    color: #334155;
    line-height: 1.6;
    padding-top: 0.45rem;
}
.hiw-step-body strong[b-yshaxeax3c] {
    color: #0f172a;
    font-weight: 700;
    display: block;
    margin-bottom: 0.2rem;
}
.hiw-step-body code[b-yshaxeax3c] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', Menlo, Consolas, monospace;
    font-size: 0.8rem;
    background: #f1f5f9;
    color: #0f172a;
    padding: 0.12rem 0.42rem;
    border-radius: 4px;
    font-weight: 500;
}
.hiw-step-body em[b-yshaxeax3c] {
    font-style: italic;
    color: #1e293b;
    font-weight: 600;
}

.hiw-converge[b-yshaxeax3c] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 1.1rem;
    align-items: center;
    background: #f8fafc;            /* was dark navy gradient */
    color: #334155;
    border: 1px solid #e2e8f0;
    padding: 1.4rem 1.6rem;
    border-radius: 14px;
    margin-top: 2rem;
}
.hiw-converge-icon[b-yshaxeax3c] {
    font-size: 2rem;
    color: #475569;                 /* was #fbbf24 amber */
    line-height: 1;
}
.hiw-converge-body[b-yshaxeax3c] {
    font-size: 0.9rem;
    line-height: 1.6;
    color: #475569;                 /* was #cbd5e1 light */
}
.hiw-converge-body strong[b-yshaxeax3c] {
    color: #0f172a;                 /* was #fbbf24 amber */
    font-weight: 700;
    display: block;
    margin-bottom: 0.25rem;
    font-size: 0.95rem;
}
.hiw-converge-body code[b-yshaxeax3c] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', Menlo, Consolas, monospace;
    font-size: 0.8rem;
    background: #e2e8f0;            /* was amber tint */
    color: #0f172a;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
}

/* =========================================
   [Plan v3 — phased step ladder]
   Phase grouping (Foundation / Identity / Permissions / SDK / Validation)
========================================= */
.hiw-phase-flow[b-yshaxeax3c] {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    margin-bottom: 2rem;
}

.hiw-phase[b-yshaxeax3c] {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
    position: relative;
}
.hiw-phase.final[b-yshaxeax3c] {
    border-color: #cbd5e1;          /* was #fbbf24 amber */
    background: #f8fafc;            /* was amber gradient */
}

.hiw-phase-head[b-yshaxeax3c] {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    padding: 0.95rem 1.3rem;
    background: #f8fafc;            /* was 2-stop gradient */
    border-bottom: 1px solid #e2e8f0;
    flex-wrap: wrap;
}
.hiw-phase.final .hiw-phase-head[b-yshaxeax3c] {
    background: #f1f5f9;            /* was amber gradient */
    border-bottom-color: #cbd5e1;
}

.hiw-phase-num[b-yshaxeax3c] {
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #ffffff;
    background: #0f172a;            /* near-black */
    padding: 0.25rem 0.65rem;
    border-radius: 4px;
}
.hiw-phase.final .hiw-phase-num[b-yshaxeax3c] {
    background: #0f172a;            /* near-black (동일) */
    color: #ffffff;
}

.hiw-phase-name[b-yshaxeax3c] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}
.hiw-phase-sub[b-yshaxeax3c] {
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 500;
    margin-left: auto;
}

.hiw-phase .hiw-steps[b-yshaxeax3c] {
    margin: 0;
    padding: 0.5rem 1.3rem 0.85rem;
}
.hiw-phase .hiw-step[b-yshaxeax3c] {
    border-bottom: 1px solid #f1f5f9;
}
.hiw-phase .hiw-step:last-child[b-yshaxeax3c] { border-bottom: none; }

/* =========================================
   Tier pills (Standard vs Iron)
========================================= */
.hiw-tier-pills[b-yshaxeax3c] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    margin-top: 0.6rem;
}
.hiw-tier-pill[b-yshaxeax3c] {
    font-size: 0.78rem;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 0.5rem 0.8rem;
    border-radius: 8px;
    line-height: 1.5;
}
.hiw-tier-pill strong[b-yshaxeax3c] {
    color: #0f172a;
    margin-right: 0.4rem;
    font-weight: 700;
    display: inline !important;     /* override .hiw-step-body strong { display: block } */
}
.hiw-tier-pill.iron[b-yshaxeax3c] {
    background: #f1f5f9;             /* was amber gradient */
    border-color: #cbd5e1;
    color: #334155;
}
.hiw-tier-pill.iron strong[b-yshaxeax3c] { color: #0f172a; }

/* =========================================
   Code block inside step body
========================================= */
.hiw-code-block[b-yshaxeax3c] {
    display: block;
    margin-top: 0.55rem;
    padding: 0.7rem 0.95rem;
    background: #f1f5f9;            /* was #0f172a navy */
    color: #334155;                 /* was #e2e8f0 light */
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', Menlo, Consolas, monospace;
    font-size: 0.78rem;
    line-height: 1.6;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
    word-break: break-word;
    white-space: pre-wrap;
    font-weight: 500;
}

/* =========================================
   Inline badges — sync status etc.
========================================= */
.hiw-inline-badges[b-yshaxeax3c] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-top: 0.55rem;
}
.hiw-badge[b-yshaxeax3c] {
    font-size: 0.72rem;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    padding: 0.22rem 0.55rem;
    border-radius: 4px;
    font-weight: 600;
    letter-spacing: 0.01em;
}
.hiw-badge.ok[b-yshaxeax3c] {
    background: #f1f5f9;             /* was green */
    border-color: #cbd5e1;
    color: #475569;
}

/* =========================================
   Mobile responsive — Enterprise
========================================= */
@media (max-width: 720px) {
    .hiw-tabs[b-yshaxeax3c] { grid-template-columns: 1fr; }
    .hiw-value-bar[b-yshaxeax3c] { grid-template-columns: repeat(2, 1fr); gap: 0.7rem; }
    .hiw-value-item[b-yshaxeax3c] { padding: 0.85rem 0.6rem; }
    .hiw-mode-picker[b-yshaxeax3c] { grid-template-columns: 1fr; }
    .hiw-converge[b-yshaxeax3c] { grid-template-columns: 1fr; gap: 0.7rem; padding: 1.2rem; }
    .hiw-converge-icon[b-yshaxeax3c] { font-size: 1.6rem; }
    .hiw-phase-head[b-yshaxeax3c] { flex-direction: column; align-items: flex-start; gap: 0.4rem; }
    .hiw-phase-sub[b-yshaxeax3c] { margin-left: 0; }
    .hiw-phase .hiw-steps[b-yshaxeax3c] { padding: 0.4rem 0.8rem 0.6rem; }
    .hiw-code-block[b-yshaxeax3c] { font-size: 0.72rem; padding: 0.6rem 0.7rem; }
}
/* /Features/Home/Pages/KycStart.razor.rz.scp.css */
/* 1. 컨테이너 설정 */
.kyc-container[b-pisuoxbze1] {
    max-width: 600px;
    margin: 0 auto;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', -apple-system, sans-serif;
    color: #1e293b;
}

/* 2. 🚀 상단 통합 설명 (강조색 적용) */
.merged-description[b-pisuoxbze1] {
    font-size: 0.825rem;
    color: #64748b;
    line-height: 1.5;
    margin-bottom: 0;
}

.merged-description strong[b-pisuoxbze1] {
    color: var(--ah-link); /* 🚀 브랜드 인디고 컬러 적용 */
    font-weight: 700;
}

/* 3. 슬림 리스트 카드 */
.option-card-slim[b-pisuoxbze1] {
    display: flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 1rem 1.25rem; 
    margin-bottom: 0.75rem;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

.option-card-slim:hover[b-pisuoxbze1],
.option-card-slim.selected[b-pisuoxbze1] {
    background-color: #f8fafc;
    border-color: #94a3b8;
}

.option-card-slim[b-pisuoxbze1]::before {
    content: '';
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 4px;
    background-color: var(--ah-link);
    opacity: 0;
    transition: opacity 0.2s;
}

.option-card-slim:hover[b-pisuoxbze1]::before,
.option-card-slim.selected[b-pisuoxbze1]::before {
    opacity: 1;
}

/* 4. 아이콘 박스 */
.icon-box[b-pisuoxbze1] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 38px; height: 38px;
    background-color: #f1f5f9;
    border-radius: 8px;
    font-size: 1.1rem;
    color: #64748b;
    margin-right: 1rem;
    flex-shrink: 0;
    transition: all 0.2s;
}

.option-card-slim:hover .icon-box[b-pisuoxbze1],
.option-card-slim.selected .icon-box[b-pisuoxbze1] {
    color: var(--ah-link);
    background-color: #eef2ff;
}

/* 5. 텍스트 영역 */
.text-group[b-pisuoxbze1] {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-right: 1rem;
    overflow: hidden;
}

.slim-title[b-pisuoxbze1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #0f172a;
    margin-bottom: 2px;
}

.slim-desc[b-pisuoxbze1] {
    font-size: 0.8rem;
    color: #64748b;
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 6. 뱃지 및 화살표 */
.mini-badge[b-pisuoxbze1] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #64748b;
    background-color: #f1f5f9;
    padding: 1px 6px;
    border-radius: 4px;
    margin-left: 8px;
    border: 1px solid #e2e8f0;
}

.arrow-icon[b-pisuoxbze1] {
    font-size: 1rem;
    color: #cbd5e1;
    transition: transform 0.2s, color 0.2s;
}

.option-card-slim:hover .arrow-icon[b-pisuoxbze1],
.option-card-slim.selected .arrow-icon[b-pisuoxbze1] {
    color: var(--ah-link);
    transform: translateX(3px);
}

/* 7. 하단 링크 */
.footer-link[b-pisuoxbze1] {
    font-size: 0.85rem;
    color: #64748b;
    text-decoration: none;
}

.footer-link:hover[b-pisuoxbze1] {
    color: #0f172a;
    text-decoration: underline;
}

/* =========================================
   추가된 커스텀 상태 스타일 (Verified & Disabled & Email)
   ========================================= */

/* 회색 이메일 경고 배너 */
.email-alert-gray[b-pisuoxbze1] {
    background-color: #f8fafc; /* 연한 그레이 */
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem 1.25rem;
}

/* 레드 배지 (이메일 인증 필요) */
.badge-error[b-pisuoxbze1] {
    font-size: 0.7rem;
    background-color: #fee2e2;
    color: var(--ah-danger);
    padding: 2px 8px;
    border-radius: 20px;
    font-weight: 700;
    border: 1px solid #fecaca;
}

/* 그린 배지 (인증 완료) */
.badge-verified[b-pisuoxbze1] {
    font-size: 0.75rem;
    color: #22c55e;
    font-weight: 700;
}

/* 인증 완료된 카드 (그린 테마) */
.option-card-slim.verified[b-pisuoxbze1] {
    border-color: #bcf0da;
    background-color: #f6fdf9;
}

.option-card-slim.verified[b-pisuoxbze1]::before {
    background-color: #22c55e; /* 맨 왼쪽 컬러 그린 */
    opacity: 1;
}

.option-card-slim.verified .icon-box[b-pisuoxbze1] {
    background-color: #dcfce7;
    color: #22c55e;
}

.option-card-slim.verified .arrow-icon[b-pisuoxbze1],
.option-card-slim.verified:hover .arrow-icon[b-pisuoxbze1] {
    color: #22c55e; /* 오른쪽 컬러 그린 */
}

/* 비활성화 상태 (클릭 방지) */
.option-card-slim.disabled[b-pisuoxbze1] {
    cursor: not-allowed !important;
    pointer-events: none; /* 클릭 막기 */
}

/* hover해도 verified 카드는 배경색과 선만 살짝 강조 */
.option-card-slim.verified:hover[b-pisuoxbze1] {
    background-color: #f0fdf4;
    border-color: #22c55e;
}
/* /Features/Home/Pages/Pricing.razor.rz.scp.css */
/* =========================================
   Pricing — Medusa-style (zinc, flat, Inter)
   Palette: fg #18181B, body #313131, muted #52525B,
            border #E4E4E7, button #27272A
========================================= */

/* Scope all text rendering to match Medusa (Inter + antialiased + features) */
.pr-hero[b-abr7yzqkhj],
.pr-tiers-wrap[b-abr7yzqkhj],
.pr-compare[b-abr7yzqkhj],
.pr-faq[b-abr7yzqkhj] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    font-size: 14px;
    line-height: 21px;
    color: #313131;
}

.pr-hero *[b-abr7yzqkhj],
.pr-tiers-wrap *[b-abr7yzqkhj],
.pr-compare *[b-abr7yzqkhj],
.pr-faq *[b-abr7yzqkhj] {
    font-family: inherit;
}

.pr-container[b-abr7yzqkhj] {
    max-width: 1280px;
    margin:    0 auto;
    padding:   0 32px;
    width:     100%;
}

/* ── Hero ── */
.pr-hero[b-abr7yzqkhj] {
    background: #ffffff;
    padding:    128px 0 80px;
}

.pr-hero--center[b-abr7yzqkhj] { text-align: center; }
.pr-hero--center .pr-container[b-abr7yzqkhj] {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pr-eyebrow[b-abr7yzqkhj] {
    font-size:   14px;
    font-weight: 500;
    line-height: 21px;
    color:       #18181B;
    margin-bottom: 24px;
}

.pr-eyebrow--center[b-abr7yzqkhj] {
    display:     inline-flex;
    align-items: center;
    gap:         8px;
    color:       #18181B;
}

.pr-eyebrow--center i[b-abr7yzqkhj] {
    font-size: 14px;
    color:     #18181B;
}

.pr-h1[b-abr7yzqkhj] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    font-size:      40px;
    font-weight:    500;
    line-height:    46px;
    letter-spacing: -0.64px;
    color:          #18181B;
    margin:         0;
    max-width:      760px;
}

.pr-h1--hero[b-abr7yzqkhj] {
    font-size:      72px;
    font-weight:    700;
    line-height:    1.05;
    letter-spacing: -2.4px;
    max-width:      none;
    margin:         0 0 24px;
}

.pr-sub[b-abr7yzqkhj] {
    font-size:   16px;
    line-height: 24px;
    color:       #52525B;
    max-width:   640px;
    margin:      0 0 32px;
}

[b-abr7yzqkhj] .pr-sub strong {
    color: #18181B;
    font-weight: 600;
}

.pr-enterprise-note[b-abr7yzqkhj] {
    font-size:   14px;
    line-height: 21px;
    color:       #52525B;
    margin:      -20px 0 32px;
}

.pr-enterprise-note a[b-abr7yzqkhj] {
    color:                 #18181B;
    font-weight:           600;
    text-decoration:       underline;
    text-underline-offset: 3px;
}

.pr-enterprise-note a:hover[b-abr7yzqkhj] {
    opacity: 0.7;
}

.pr-hero-cta[b-abr7yzqkhj] {
    display: flex;
    gap:     12px;
    justify-content: center;
    flex-wrap: wrap;
}

.pr-btn--hero[b-abr7yzqkhj] {
    width:        auto !important;
    flex:         0 0 auto;
    min-width:    140px;
    padding:      12px 20px;
    font-size:    14px;
    gap:          8px;
}

.pr-hero-cta[b-abr7yzqkhj] {
    display:         flex;
    flex-direction:  row;
    gap:             12px;
    justify-content: center;
    align-items:     center;
    flex-wrap:       wrap;
}

.pr-save[b-abr7yzqkhj] {
    font-size:   11px;
    font-weight: 500;
    padding:     2px 6px;
    border-radius: 4px;
    background:  rgba(255,255,255,0.15);
    color:       inherit;
    opacity:     0.9;
}

.pr-btn--neutral .pr-save[b-abr7yzqkhj] {
    background: #F4F4F5;
    color:      #52525B;
}

.pr-h2[b-abr7yzqkhj] {
    font-family:    'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    font-size:      40px;
    font-weight:    500;
    line-height:    46px;
    letter-spacing: -0.64px;
    color:          #18181B;
    margin:         0;
}

/* ── Tier cards (flush columns) ── */
.pr-tiers-wrap[b-abr7yzqkhj] {
    background:    #ffffff;
    border-top:    1px solid #E4E4E7;
    border-bottom: 1px solid #E4E4E7;
}

.pr-tiers[b-abr7yzqkhj] {
    display:    flex;
    width:      100%;
    flex-wrap:  wrap;
}

.pr-tier[b-abr7yzqkhj] {
    width:          25%;
    padding:        32px 48px;
    display:        flex;
    flex-direction: column;
    border-right:   1px solid #E4E4E7;
    background:     #ffffff;
    position:       relative;
}

.pr-tier:last-child[b-abr7yzqkhj] { border-right: none; }

/* Most-popular highlight */
.pr-tier--popular[b-abr7yzqkhj] {
    background: #FAFAFA;
    box-shadow: inset 0 0 0 1px #18181B;
    z-index:    1;
}

.pr-tier-badge[b-abr7yzqkhj] {
    position:       absolute;
    top:            -12px;
    left:           50%;
    transform:      translateX(-50%);
    background:     #18181B;
    color:          #ffffff;
    font-size:      11px;
    font-weight:    600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding:        4px 10px;
    border-radius:  999px;
    white-space:    nowrap;
    box-shadow:     0 1px 2px 0 rgba(0,0,0,0.12);
}

.pr-tier-top[b-abr7yzqkhj] {
    margin-bottom: 24px;
}

.pr-tier-name[b-abr7yzqkhj] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size:   24px;
    font-weight: 700;
    line-height: 32px;
    color:       #18181B;
    margin:      0 0 12px;
    letter-spacing: -0.4px;
}

.pr-tier-price[b-abr7yzqkhj] {
    margin:       0 0 12px;
    display:      flex;
    align-items:  baseline;
    gap:          4px;
}

.pr-tier-amount[b-abr7yzqkhj] {
    font-family: Arial, 'Noto Sans KR', 'Noto Sans JP', 'Helvetica Neue', Helvetica, sans-serif !important;
    font-size:   40px;
    font-weight: 700;
    line-height: 46px;
    letter-spacing: -1.2px;
    color:       #18181B;
}

.pr-tier-amount--custom[b-abr7yzqkhj] {
    letter-spacing: -1.2px;
}

.pr-tier-per[b-abr7yzqkhj] {
    font-size:   14px;
    font-weight: 400;
    color:       #52525B;
    line-height: 21px;
}

.pr-tier-desc[b-abr7yzqkhj] {
    font-size:   13px;
    color:       #52525B;
    line-height: 20px;
    margin:      0;
}

.pr-tier-billed[b-abr7yzqkhj] {
    font-size:   12px;
    color:       #71717A;
    margin:      -8px 0 12px;
}

.pr-tier-list[b-abr7yzqkhj] {
    list-style: none;
    padding:    0;
    margin:     0 0 24px;
    flex:       1;
    display:    flex;
    flex-direction: column;
    gap:        10px;
}

.pr-tier-list li[b-abr7yzqkhj] {
    display:     flex;
    align-items: flex-start;
    gap:         8px;
    font-size:   13px;
    line-height: 20px;
    color:       #313131;
}

.pr-tier-list li i[b-abr7yzqkhj] {
    color:        #18181B;
    font-size:    14px;
    flex-shrink:  0;
    margin-top:   2px;
}

.pr-tier-cta[b-abr7yzqkhj] { margin-top: auto; }

/* ── Buttons (Medusa shadow-ring style) ── */
.pr-btn[b-abr7yzqkhj] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           100%;
    padding:         8px 12px;
    border-radius:   6px;
    font-family:     'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size:       13px;
    font-weight:     500;
    line-height:     20px;
    text-decoration: none;
    cursor:          pointer;
    border:          none;
    transition:      background 150ms ease, box-shadow 150ms ease;
}

.pr-btn--inverted[b-abr7yzqkhj] {
    background: #27272A;
    color:      rgba(255,255,255,0.88);
    box-shadow: inset 0 0.75px 0 0 rgba(255,255,255,0.2),
                0 1px 2px 0 rgba(0,0,0,0.4),
                0 0 0 1px #18181B;
}

.pr-btn--inverted:hover[b-abr7yzqkhj] {
    background: #3F3F46;
    color:      rgba(255,255,255,0.88);
}

.pr-btn--neutral[b-abr7yzqkhj] {
    background: #ffffff;
    color:      #18181B;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12),
                0 0 0 1px rgba(0,0,0,0.08);
}

.pr-btn--neutral:hover[b-abr7yzqkhj] {
    background: #F4F4F5;
    color:      #18181B;
}

/* ── Comparison grid ── */
.pr-compare[b-abr7yzqkhj] {
    background: #ffffff;
    padding:    64px 0 96px;
}

.pr-grid[b-abr7yzqkhj] {
    display:      flex;
    width:        100%;
    border-bottom: 1px solid #E4E4E7;
}

.pr-grid--head[b-abr7yzqkhj] {
    position:   sticky;
    top:        57px;
    background: #ffffff;
    z-index:    10;
    border-top: 1px solid #E4E4E7;
}

.pr-grid--head .pr-cell[b-abr7yzqkhj] {
    font-size:   14px;
    font-weight: 600;
    color:       #18181B;
    padding:     16px 32px;
}

.pr-cell[b-abr7yzqkhj] {
    padding:     16px 32px;
    font-size:   14px;
    line-height: 21px;
    color:       #313131;
}

.pr-cell--feat[b-abr7yzqkhj] {
    width:      32%;
    flex-shrink: 0;
}

.pr-cell--plan[b-abr7yzqkhj],
.pr-cell--val[b-abr7yzqkhj] {
    width:       17%;
    flex-shrink: 0;
    border-left: 1px solid #E4E4E7;
    text-align:  center;
}

.pr-cell--plan[b-abr7yzqkhj] { text-align: center; }

/* Add-on rows: one cell spanning all tier columns (not tier-gated) */
.pr-cell--merged[b-abr7yzqkhj] {
    flex:        1;
    border-left: 1px solid #E4E4E7;
    text-align:  center;
    color:       #18181B;
    font-weight: 600;
}

.pr-feat-name[b-abr7yzqkhj] {
    font-size:   14px;
    font-weight: 500;
    color:       #18181B;
    line-height: 21px;
}

.pr-feat-desc[b-abr7yzqkhj] {
    font-size:   13px;
    color:       #71717A;
    line-height: 20px;
    margin-top:  4px;
}

.pr-group-head[b-abr7yzqkhj] {
    font-size:   18px;
    font-weight: 500;
    color:       #52525B;
    padding:     32px 32px 12px;
    border-top:  1px solid #E4E4E7;
}

.pr-group:first-of-type .pr-group-head[b-abr7yzqkhj] { border-top: none; }

[b-abr7yzqkhj] .pr-yes {
    color:       #18181B;
    font-weight: 600;
    font-size:   15px;
}

[b-abr7yzqkhj] .pr-no {
    color:     #A1A1AA;
    font-size: 14px;
}

[b-abr7yzqkhj] .pr-tier-sub {
    font-size: 12px;
    color:     #71717A;
}

[b-abr7yzqkhj] .pr-tier-price {
    font-size:   12px;
    font-weight: 500;
    color:       #18181B;
    font-family: 'Roboto Mono', ui-monospace, monospace;
}

/* ── FAQ (2-col) ── */
.pr-faq[b-abr7yzqkhj] {
    background: #ffffff;
    border-top: 1px solid #E4E4E7;
    padding:    96px 0 128px;
}

.pr-faq-grid[b-abr7yzqkhj] {
    display: flex;
    gap:     48px;
    align-items: flex-start;
}

.pr-faq-head[b-abr7yzqkhj] {
    width: 40%;
    flex-shrink: 0;
    padding-top: 8px;
}

.pr-faq-list[b-abr7yzqkhj] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.pr-faq-item[b-abr7yzqkhj] {
    border-bottom: 1px solid #E4E4E7;
}

.pr-faq-item:first-child[b-abr7yzqkhj] { border-top: 1px solid #E4E4E7; }

.pr-faq-q[b-abr7yzqkhj] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    width:           100%;
    padding:         20px 0;
    background:      none;
    border:          none;
    cursor:          pointer;
    font-family:     'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-size:       15px;
    font-weight:     500;
    line-height:     22px;
    color:           #18181B;
    text-align:      left;
    gap:             1.5rem;
    transition:      color 150ms;
}

.pr-faq-q:hover[b-abr7yzqkhj] { color: #52525B; }

.pr-faq-icon[b-abr7yzqkhj] {
    font-size:   18px;
    color:       #71717A;
    flex-shrink: 0;
}

.pr-faq-a[b-abr7yzqkhj] {
    font-size:      14px;
    color:          #52525B;
    line-height:    22px;
    padding:        0 0 20px;
    max-width:      90%;
}

[b-abr7yzqkhj] .pr-faq-a a {
    color: #18181B;
    text-decoration: underline;
}

[b-abr7yzqkhj] .pr-faq-a strong {
    color: #18181B;
    font-weight: 600;
}

/* =========================================
   Responsive
========================================= */
@media (max-width: 1024px) {
    .pr-tier[b-abr7yzqkhj]      { width: 50%; border-bottom: 1px solid #E4E4E7; }
    .pr-tier:nth-child(2)[b-abr7yzqkhj] { border-right: none; }
    .pr-tier:nth-last-child(-n+2)[b-abr7yzqkhj] { border-bottom: none; }

    .pr-faq-grid[b-abr7yzqkhj]  { flex-direction: column; gap: 32px; }
    .pr-faq-head[b-abr7yzqkhj]  { width: 100%; }
}

@media (max-width: 768px) {
    .pr-hero[b-abr7yzqkhj]      { padding: 80px 0 48px; }
    .pr-h1[b-abr7yzqkhj]        { font-size: 32px; line-height: 38px; letter-spacing: -0.4px; }
    .pr-h1--hero[b-abr7yzqkhj]  { font-size: 44px; line-height: 1.1; letter-spacing: -1.2px; }
    .pr-h2[b-abr7yzqkhj]        { font-size: 28px; line-height: 34px; letter-spacing: -0.4px; }
    .pr-sub[b-abr7yzqkhj]       { font-size: 14px; line-height: 21px; }
    .pr-container[b-abr7yzqkhj] { padding: 0 1rem; }

    .pr-tier[b-abr7yzqkhj]        { width: 100%; border-right: none; padding: 24px 20px; }
    .pr-tier-amount[b-abr7yzqkhj] { font-size: 32px; line-height: 38px; }

    .pr-compare[b-abr7yzqkhj]     { padding: 48px 0 64px; }
    .pr-cell[b-abr7yzqkhj]        { padding: 12px 16px; font-size: 13px; }
    .pr-cell--feat[b-abr7yzqkhj]  { width: 28%; }
    .pr-cell--plan[b-abr7yzqkhj],
    .pr-cell--val[b-abr7yzqkhj]   { width: 18%; padding: 12px 8px; }
    .pr-group-head[b-abr7yzqkhj]  { padding: 24px 16px 8px; font-size: 16px; }

    .pr-faq[b-abr7yzqkhj]         { padding: 64px 0 80px; }
    .pr-faq-q[b-abr7yzqkhj]       { font-size: 14px; padding: 16px 0; }
}

@media (max-width: 480px) {
    .pr-hero[b-abr7yzqkhj]  { padding: 64px 0 32px; }
    .pr-h1[b-abr7yzqkhj]    { font-size: 28px; line-height: 34px; }

    /* Hide comparison columns on narrow screens — show cards only */
    .pr-cell--plan:not(:first-of-type)[b-abr7yzqkhj],
    .pr-cell--val:not(:first-of-type)[b-abr7yzqkhj] { display: none; }
    .pr-cell--feat[b-abr7yzqkhj] { width: 60%; }
    .pr-cell--plan[b-abr7yzqkhj],
    .pr-cell--val[b-abr7yzqkhj]  { width: 40%; }
}
/* /Features/Home/Pages/Privacy.razor.rz.scp.css */
/* Legal page — Privacy */

.lp-root[b-68sg95o6l9] {
    min-height: 70vh;
    padding: 4rem 1.5rem 6rem;
}

.lp-inner[b-68sg95o6l9] {
    max-width: 820px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 3rem 3rem 3.5rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

@media (max-width: 720px) {
    .lp-root[b-68sg95o6l9] { padding: 2rem 0.75rem 4rem; }
    .lp-inner[b-68sg95o6l9] { padding: 1.75rem 1.25rem 2.25rem; border-radius: 8px; }
}

/* Header */
.lp-header[b-68sg95o6l9] {
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}

.lp-eyebrow[b-68sg95o6l9] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.lp-title[b-68sg95o6l9] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 800;
    font-size: 2.25rem;
    letter-spacing: -0.02em;
    color: #18181b;
    margin: 0 0 0.75rem;
}

.lp-meta[b-68sg95o6l9] {
    color: #6b7280;
    font-size: 0.88rem;
    margin: 0;
}

.lp-meta strong[b-68sg95o6l9] { color: #18181b; font-weight: 600; }

.lp-dot[b-68sg95o6l9] { margin: 0 0.5rem; color: #d1d5db; }

/* Body */
.lp-body[b-68sg95o6l9] {
    color: #27272a;
    font-size: 0.95rem;
    line-height: 1.7;
}

.lp-intro[b-68sg95o6l9] {
    color: #3f3f46;
    margin: 0 0 1rem;
}

.lp-section[b-68sg95o6l9] {
    margin-top: 2.5rem;
}

.lp-h2[b-68sg95o6l9] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    letter-spacing: -0.01em;
    color: #18181b;
    margin: 0 0 1rem;
}

.lp-h3[b-68sg95o6l9] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    color: #27272a;
    margin: 1.5rem 0 0.5rem;
}

.lp-section p[b-68sg95o6l9] { margin: 0 0 1rem; }

.lp-list[b-68sg95o6l9] {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
}

.lp-list li[b-68sg95o6l9] {
    margin-bottom: 0.4rem;
}

.lp-list--ordered[b-68sg95o6l9] {
    list-style: decimal;
}

.lp-link[b-68sg95o6l9] {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.lp-link:hover[b-68sg95o6l9] {
    text-decoration: underline;
}

.lp-section code[b-68sg95o6l9] {
    background: #f4f4f5;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85em;
    color: #18181b;
    border: 1px solid #e5e7eb;
}

/* Contact card */
.lp-contact-card[b-68sg95o6l9] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    display: grid;
    gap: 0.6rem;
}

.lp-contact-row[b-68sg95o6l9] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1rem;
    font-size: 0.9rem;
}

@media (max-width: 600px) {
    .lp-contact-row[b-68sg95o6l9] { grid-template-columns: 1fr; gap: 0.15rem; }
}

.lp-contact-label[b-68sg95o6l9] {
    color: #6b7280;
    font-weight: 600;
}

.lp-placeholder[b-68sg95o6l9] {
    color: #a1a1aa;
    font-style: italic;
    font-size: 0.85em;
}

/* Divider before country notes */
.lp-divider[b-68sg95o6l9] {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 3rem 0 0;
}

/* Country notes */
.lp-notes-intro[b-68sg95o6l9] {
    color: #52525b;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}

.lp-note[b-68sg95o6l9] {
    background: #f9fafb;
    border-left: 3px solid #d4d4d8;
    padding: 1rem 1.25rem;
    border-radius: 4px;
    margin-bottom: 1rem;
    font-size: 0.88rem;
}

.lp-note p[b-68sg95o6l9] { margin: 0 0 0.5rem; }
.lp-note p:last-child[b-68sg95o6l9] { margin-bottom: 0; }
.lp-note .lp-list[b-68sg95o6l9] { font-size: 0.88rem; margin-bottom: 0.5rem; }

.lp-note-title[b-68sg95o6l9] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: #18181b;
    margin: 0 0 0.5rem;
}
/* /Features/Home/Pages/Product.razor.rz.scp.css */
/* =========================================
   Product — per-product detail page
   Inter / zinc base · matches Solutions tone
========================================= */

.pr-hero[b-mcntcpu4oa],
.pr-section[b-mcntcpu4oa],
.pr-cta[b-mcntcpu4oa] {
    width: 100%;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: #27272a;
}

.pr-hero *[b-mcntcpu4oa],
.pr-section *[b-mcntcpu4oa],
.pr-cta *[b-mcntcpu4oa] { font-family: inherit; }

.pr-container[b-mcntcpu4oa] {
    max-width: 1200px;
    margin:    0 auto;
    padding:   0 32px;
    width:     100%;
}

/* ── Hero ── */
.pr-hero[b-mcntcpu4oa] {
    position:        relative;
    padding:         128px 0 96px;
    color:           #fafafa;
    background-size: cover;
    background-position: center;
    border-bottom:   1px solid #18181b;
}

.pr-hero-eyebrow[b-mcntcpu4oa] {
    display:       inline-flex;
    align-items:   center;
    gap:           10px;
    font-size:     13px;
    font-weight:   500;
    letter-spacing: 0.02em;
    color:         #a1a1aa;
    margin-bottom: 24px;
    text-transform: uppercase;
}

.pr-hero-eyebrow i[b-mcntcpu4oa] { font-size: 14px; }

.pr-addon-badge[b-mcntcpu4oa] {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: 4px;
    background: #fbbf24;
    color: #18181b;
    margin-left: 4px;
}

.pr-hero-h1[b-mcntcpu4oa] {
    font-size:      60px;
    font-weight:    700;
    line-height:    1.06;
    letter-spacing: -2px;
    color:          #ffffff;
    margin:         0 0 28px;
}

.pr-hero-lede[b-mcntcpu4oa] {
    font-size:   17px;
    line-height: 1.65;
    color:       rgba(255,255,255,0.8);
    max-width:   720px;
    margin:      0 0 36px;
}

.pr-hero-cta[b-mcntcpu4oa] {
    display:   flex;
    gap:       12px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}

.pr-hero-meta[b-mcntcpu4oa] {
    display: flex;
    gap: 56px;
    flex-wrap: wrap;
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.pr-hero-meta-item[b-mcntcpu4oa] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pr-hero-meta-label[b-mcntcpu4oa] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 500;
}

.pr-hero-meta-value[b-mcntcpu4oa] {
    font-size: 15px;
    color: #ffffff;
    font-weight: 600;
}

/* ── Buttons ── */
.pr-btn[b-mcntcpu4oa] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    min-width:       148px;
    padding:         12px 22px;
    border-radius:   6px;
    font-size:       14px;
    font-weight:     500;
    line-height:     20px;
    text-decoration: none;
    cursor:          pointer;
    border:          none;
    transition:      all 150ms ease;
}

.pr-btn--primary[b-mcntcpu4oa] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
}
.pr-btn--primary:hover[b-mcntcpu4oa] { background: #f4f4f5; color: #18181b; }

.pr-btn--ghost[b-mcntcpu4oa] {
    background: transparent;
    color:      #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.24);
}
.pr-btn--ghost:hover[b-mcntcpu4oa] { background: rgba(255,255,255,0.08); color: #ffffff; }

.pr-section .pr-btn--primary[b-mcntcpu4oa],
.pr-cta .pr-btn--primary[b-mcntcpu4oa] {
    background: #18181b;
    color:      #ffffff;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.18);
}
.pr-section .pr-btn--primary:hover[b-mcntcpu4oa],
.pr-cta .pr-btn--primary:hover[b-mcntcpu4oa] { background: #27272a; color: #ffffff; }

.pr-section .pr-btn--ghost[b-mcntcpu4oa],
.pr-cta .pr-btn--ghost[b-mcntcpu4oa] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: inset 0 0 0 1px #e4e4e7;
}
.pr-section .pr-btn--ghost:hover[b-mcntcpu4oa],
.pr-cta .pr-btn--ghost:hover[b-mcntcpu4oa] { background: #fafafa; color: #18181b; }

/* ── Sections ── */
.pr-section[b-mcntcpu4oa] {
    padding: 96px 0;
    background: #ffffff;
    scroll-margin-top: 80px; /* sticky landing nav 가려짐 방지 */
}

.pr-section--alt[b-mcntcpu4oa] { background: #fafafa; }

/* anchor target 시 카드 grid 한 번 강조 — "View form templates →" 클릭 직후 포인트 표시 */
#form-templates:target .pr-forms-grid[b-mcntcpu4oa] {
    animation: prFormsHighlight-b-mcntcpu4oa 1.6s ease-out 1;
}
@keyframes prFormsHighlight-b-mcntcpu4oa {
    0%   { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.0); }
    20%  { box-shadow: 0 0 0 6px rgba(99, 102, 241, 0.18); }
    100% { box-shadow: 0 0 0 0 rgba(99, 102, 241, 0.0); }
}

.pr-section-head[b-mcntcpu4oa] {
    max-width: 720px;
    margin: 0 0 56px;
}

.pr-kicker[b-mcntcpu4oa] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #71717a;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.pr-h2[b-mcntcpu4oa] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1px;
    color: #18181b;
    margin: 0 0 16px;
}

.pr-section-sub[b-mcntcpu4oa] {
    font-size: 16px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
    max-width: 680px;
}

/* ── Capabilities (numbered list, 2 cols) ── */
.pr-caps[b-mcntcpu4oa] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border-top: 2px solid #18181b;
}

.pr-cap[b-mcntcpu4oa] {
    display: grid;
    grid-template-columns: 48px 1fr;
    gap: 12px;
    padding: 24px 28px 24px 0;
    border-bottom: 1px solid #e4e4e7;
    border-right: 1px solid #e4e4e7;
    align-items: start;
}

.pr-cap:nth-child(2n)[b-mcntcpu4oa] { border-right: none; padding-right: 0; padding-left: 28px; }

.pr-cap-num[b-mcntcpu4oa] {
    font-size: 13px;
    font-weight: 700;
    color: #a1a1aa;
    letter-spacing: 0.04em;
    padding-top: 2px;
}

.pr-cap-title[b-mcntcpu4oa] {
    font-size: 17px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 8px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

.pr-cap-desc[b-mcntcpu4oa] {
    font-size: 14px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
}

/* ── How it works (single paragraph emphasis) ── */
.pr-howit[b-mcntcpu4oa] {
    font-size: 18px;
    line-height: 1.7;
    color: #18181b;
    margin: 0;
    max-width: 880px;
    padding: 32px 36px;
    background: #ffffff;
    border-left: 4px solid #18181b;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0,0,0,0.04);
}

/* ── Engagement Models (custom-chip only) ── */
.pr-engages[b-mcntcpu4oa] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.pr-engage[b-mcntcpu4oa] {
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 12px;
    padding: 32px 28px;
}

.pr-engage-name[b-mcntcpu4oa] {
    font-size: 20px;
    font-weight: 700;
    color: #18181b;
    margin-bottom: 14px;
    letter-spacing: -0.3px;
}

.pr-engage-body[b-mcntcpu4oa] {
    font-size: 15px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

/* ── Use cases ── */
.pr-cases[b-mcntcpu4oa] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
    border-top: 1px solid #e4e4e7;
    border-bottom: 1px solid #e4e4e7;
}

.pr-case[b-mcntcpu4oa] {
    padding: 32px 32px 32px 0;
    border-right: 1px solid #e4e4e7;
}

.pr-case:nth-child(3n)[b-mcntcpu4oa] { border-right: none; padding-right: 0; }
.pr-case:nth-child(3n+1)[b-mcntcpu4oa] { padding-left: 0; }
.pr-case:nth-child(3n+2)[b-mcntcpu4oa] { padding-left: 32px; }
.pr-case:nth-child(3n)[b-mcntcpu4oa] { padding-left: 32px; }

.pr-case-num[b-mcntcpu4oa] {
    font-size: 11.5px;
    font-weight: 700;
    color: #a1a1aa;
    letter-spacing: 0.08em;
    margin-bottom: 14px;
}

.pr-case-title[b-mcntcpu4oa] {
    font-size: 18px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 12px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

.pr-case-desc[b-mcntcpu4oa] {
    font-size: 14.5px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
}

/* ── Tier section ── */
.pr-tier-grid[b-mcntcpu4oa] {
    max-width: 760px;
}

.pr-tier-text .pr-h2[b-mcntcpu4oa] {
    font-size: 32px;
    color: #166534;
    margin: 8px 0 18px;
}

.pr-tier-rationale[b-mcntcpu4oa] {
    font-size: 16px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0 0 24px;
}

.pr-tier-link[b-mcntcpu4oa] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: #18181b;
    text-decoration: none;
    transition: gap 0.15s;
}

.pr-tier-link:hover[b-mcntcpu4oa] { gap: 10px; color: #18181b; }

/* ── VS / Incumbent comparison ── */
.pr-vs[b-mcntcpu4oa] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 48px;
    align-items: stretch;
    padding: 8px 0;
}

.pr-vs-label[b-mcntcpu4oa] {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.pr-vs-col--incumbent .pr-vs-label[b-mcntcpu4oa] { color: #b91c1c; }
.pr-vs-col--dpsm     .pr-vs-label[b-mcntcpu4oa] { color: #166534; }

.pr-vs-name[b-mcntcpu4oa] {
    font-size: 22px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 14px;
    line-height: 1.3;
    letter-spacing: -0.3px;
}

.pr-vs-body[b-mcntcpu4oa] {
    font-size: 15px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

.pr-vs-divider[b-mcntcpu4oa] {
    width: 1px;
    background: #e4e4e7;
    align-self: stretch;
}

/* ── CTA ── */
.pr-cta[b-mcntcpu4oa] {
    background: #0a0a0a;
    padding: 88px 0;
    text-align: center;
    border-top: 1px solid #18181b;
}

.pr-cta-title[b-mcntcpu4oa] {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1px;
    color: #ffffff;
    margin: 0 0 20px;
}

.pr-cta-sub[b-mcntcpu4oa] {
    font-size: 16px;
    line-height: 1.65;
    color: rgba(255,255,255,0.7);
    margin: 0 auto 32px;
    max-width: 580px;
}

.pr-cta-actions[b-mcntcpu4oa] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.pr-cta .pr-btn--primary[b-mcntcpu4oa] {
    background: #ffffff;
    color: #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.4);
}
.pr-cta .pr-btn--primary:hover[b-mcntcpu4oa] { background: #f4f4f5; color: #18181b; }

.pr-cta .pr-btn--ghost[b-mcntcpu4oa] {
    background: transparent;
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.28);
}
.pr-cta .pr-btn--ghost:hover[b-mcntcpu4oa] { background: rgba(255,255,255,0.08); color: #ffffff; }

/* ── Responsive ── */
@media (max-width: 1024px) {
    .pr-hero[b-mcntcpu4oa]        { padding: 96px 0 72px; }
    .pr-hero-h1[b-mcntcpu4oa]     { font-size: 44px; letter-spacing: -1.4px; }
    .pr-hero-lede[b-mcntcpu4oa]   { font-size: 16px; }
    .pr-section[b-mcntcpu4oa]     { padding: 72px 0; }
    .pr-h2[b-mcntcpu4oa]          { font-size: 30px; letter-spacing: -0.7px; }

    .pr-caps[b-mcntcpu4oa]        { grid-template-columns: 1fr; }
    .pr-cap[b-mcntcpu4oa]         { border-right: none; padding-right: 0; padding-left: 0 !important; }

    .pr-engages[b-mcntcpu4oa]     { grid-template-columns: 1fr; }

    .pr-cases[b-mcntcpu4oa]       { grid-template-columns: 1fr; }
    .pr-case[b-mcntcpu4oa]        { border-right: none; border-bottom: 1px solid #e4e4e7; padding: 28px 0 !important; }
    .pr-case:last-child[b-mcntcpu4oa] { border-bottom: none; }

    .pr-vs[b-mcntcpu4oa]          { grid-template-columns: 1fr; gap: 32px; }
    .pr-vs-divider[b-mcntcpu4oa]  { width: 100%; height: 1px; }

    .pr-cta-title[b-mcntcpu4oa]   { font-size: 30px; }
}

@media (max-width: 720px) {
    .pr-container[b-mcntcpu4oa]       { padding: 0 20px; }
    .pr-hero[b-mcntcpu4oa]            { padding: 72px 0 56px; }
    .pr-hero-h1[b-mcntcpu4oa]         { font-size: 34px; letter-spacing: -1px; }
    .pr-hero-lede[b-mcntcpu4oa]       { font-size: 15px; }
    .pr-hero-meta[b-mcntcpu4oa]       { gap: 28px; }
    .pr-section[b-mcntcpu4oa]         { padding: 56px 0; }
    .pr-h2[b-mcntcpu4oa]              { font-size: 24px; letter-spacing: -0.5px; }
    .pr-section-head[b-mcntcpu4oa]    { margin-bottom: 36px; }
    .pr-howit[b-mcntcpu4oa]           { font-size: 16px; padding: 24px 22px; }

    .pr-cta[b-mcntcpu4oa]             { padding: 64px 0; }
    .pr-cta-title[b-mcntcpu4oa]       { font-size: 26px; }
}

/* =========================================
   AI-Safe IAM mockup — natural language → verified scope
   (Mirror of Home.razor.css block; razor scoped CSS isolation requires
   the same rules in each consuming page.)
========================================= */
/* Box-free: no browser-chrome frame ("애플박스") — the prompt + scope cards float open. */
.ai-iam-mock[b-mcntcpu4oa] {
    background: transparent;
    border: none;
    box-shadow: none;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, sans-serif;
    max-width: 760px;
}

.ai-iam-mock--center[b-mcntcpu4oa] { margin: 0 auto; }

.ai-iam-mock-top[b-mcntcpu4oa] {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 14px; background: #FAFAFA; border-bottom: 1px solid #E4E4E7;
}

.ai-iam-mock-dots[b-mcntcpu4oa] { display: flex; gap: 5px; }
.ai-iam-mock-dots span[b-mcntcpu4oa] { width: 9px; height: 9px; border-radius: 50%; background: #E4E4E7; }
.ai-iam-mock-dots span:nth-child(1)[b-mcntcpu4oa] { background: #fb7185; }
.ai-iam-mock-dots span:nth-child(2)[b-mcntcpu4oa] { background: #fbbf24; }
.ai-iam-mock-dots span:nth-child(3)[b-mcntcpu4oa] { background: #34d399; }

.ai-iam-mock-url[b-mcntcpu4oa] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 12px; color: #71717A; margin-left: auto;
}

.ai-iam-mock-body[b-mcntcpu4oa] { padding: 0; background: transparent; }

.ai-iam-section[b-mcntcpu4oa] {
    background: #FAFAFA; border: 1px solid #E4E4E7;
    border-radius: 8px; padding: 20px 22px;
}
.ai-iam-section--scope[b-mcntcpu4oa] { background: #0F172A; border-color: #1E293B; }

.ai-iam-label[b-mcntcpu4oa] {
    display: flex; align-items: center; gap: 6px;
    font-size: 11.5px; font-weight: 600; letter-spacing: 0.04em;
    text-transform: uppercase; color: #71717A; margin-bottom: 12px;
}
.ai-iam-label i[b-mcntcpu4oa] { font-size: 13px; color: #6366f1; }
.ai-iam-section--scope .ai-iam-label[b-mcntcpu4oa] { color: #94a3b8; }
.ai-iam-section--scope .ai-iam-label i[b-mcntcpu4oa] { color: #34d399; }

.ai-iam-prompt-wrap[b-mcntcpu4oa], .ai-iam-scope-wrap[b-mcntcpu4oa] { position: relative; min-height: 28px; display: block; }

.ai-iam-prompt[b-mcntcpu4oa] {
    position: absolute; inset: 0;
    font-size: 16px; line-height: 28px; color: #18181B; font-weight: 500;
    opacity: 0; overflow: hidden; white-space: nowrap;
    clip-path: inset(0 100% 0 0);
    animation: ai-iam-typewriter-b-mcntcpu4oa 16s infinite;
}
.ai-iam-prompt-1[b-mcntcpu4oa] { animation-delay: 0s; }
.ai-iam-prompt-2[b-mcntcpu4oa] { animation-delay: 4s; }
.ai-iam-prompt-3[b-mcntcpu4oa] { animation-delay: 8s; }
.ai-iam-prompt-4[b-mcntcpu4oa] { animation-delay: 12s; }

.ai-iam-caret[b-mcntcpu4oa] {
    display: inline-block; color: #6366f1; font-weight: 700; margin-left: 1px;
    animation: ai-iam-caret-blink-b-mcntcpu4oa 1s steps(2, start) infinite;
}

.ai-iam-scope[b-mcntcpu4oa] {
    position: absolute; inset: 0;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 14px; line-height: 28px; color: #e2e8f0;
    opacity: 0; transform: translateY(8px);
    animation: ai-iam-scope-cycle-b-mcntcpu4oa 16s infinite;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ai-iam-scope-1[b-mcntcpu4oa] { animation-delay: 0s; }
.ai-iam-scope-2[b-mcntcpu4oa] { animation-delay: 4s; }
.ai-iam-scope-3[b-mcntcpu4oa] { animation-delay: 8s; }
.ai-iam-scope-4[b-mcntcpu4oa] { animation-delay: 12s; }

.ai-iam-scope .sc-ns[b-mcntcpu4oa] { color: #818cf8; font-weight: 600; }
.ai-iam-scope .sc-r[b-mcntcpu4oa]  { color: #fbbf24; }
.ai-iam-scope .sc-a[b-mcntcpu4oa]  { color: #34d399; font-weight: 600; }
.ai-iam-scope .sc-c[b-mcntcpu4oa]  { color: #94a3b8; }
.ai-iam-scope .sc-v[b-mcntcpu4oa]  { color: #f8fafc; }

.ai-iam-arrow[b-mcntcpu4oa] {
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: 16px 0; color: #6366f1;
}
.ai-iam-arrow i[b-mcntcpu4oa] { font-size: 22px; animation: ai-iam-arrow-pulse-b-mcntcpu4oa 2.4s ease-in-out infinite; }
.ai-iam-arrow span[b-mcntcpu4oa] {
    font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase; color: #6366f1;
}

@keyframes ai-iam-typewriter-b-mcntcpu4oa {
    0%   { opacity: 0; clip-path: inset(0 100% 0 0); }
    1%   { opacity: 1; }
    14%  { opacity: 1; clip-path: inset(0 0 0 0); }
    23%  { opacity: 1; clip-path: inset(0 0 0 0); }
    25%  { opacity: 0; }
    100% { opacity: 0; clip-path: inset(0 0 0 0); }
}

@keyframes ai-iam-scope-cycle-b-mcntcpu4oa {
    0%   { opacity: 0; transform: translateY(8px); }
    14%  { opacity: 0; transform: translateY(8px); }
    18%  { opacity: 1; transform: translateY(0); }
    23%  { opacity: 1; transform: translateY(0); }
    25%  { opacity: 0; transform: translateY(-4px); }
    100% { opacity: 0; transform: translateY(-4px); }
}

@keyframes ai-iam-caret-blink-b-mcntcpu4oa {
    0%, 50%   { opacity: 1; }
    51%, 100% { opacity: 0; }
}

@keyframes ai-iam-arrow-pulse-b-mcntcpu4oa {
    0%, 100% { transform: translateY(0); opacity: 0.7; }
    50%      { transform: translateY(2px); opacity: 1; }
}

@media (max-width: 720px) {
    .ai-iam-mock-body[b-mcntcpu4oa] { padding: 18px; }
    .ai-iam-prompt[b-mcntcpu4oa]    { font-size: 14px; line-height: 24px; }
    .ai-iam-scope[b-mcntcpu4oa]     { font-size: 12px; line-height: 24px; }
    .ai-iam-prompt-wrap[b-mcntcpu4oa],
    .ai-iam-scope-wrap[b-mcntcpu4oa] { min-height: 48px; white-space: normal; }
    .ai-iam-prompt[b-mcntcpu4oa], .ai-iam-scope[b-mcntcpu4oa] { white-space: normal; }
}

/* ── Authentication · Cross-browser passkey comparison ── */
.pr-compare-wrap[b-mcntcpu4oa] {
    overflow-x: auto;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
    margin-bottom: 24px;
    background: #ffffff;
}

.pr-compare[b-mcntcpu4oa] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.pr-compare thead th[b-mcntcpu4oa] {
    text-align: left;
    padding: 14px 18px;
    background: #fafafa;
    border-bottom: 1px solid #e4e4e7;
    font-weight: 700;
    font-size: 12.5px;
    color: #18181b;
    letter-spacing: 0.02em;
}

.pr-compare tbody td[b-mcntcpu4oa] {
    padding: 16px 18px;
    border-bottom: 1px solid #f4f4f5;
    color: #3f3f46;
    line-height: 1.6;
    vertical-align: top;
}

.pr-compare tbody tr:last-child td[b-mcntcpu4oa] { border-bottom: none; }

.pr-compare tbody tr.pr-compare-self[b-mcntcpu4oa] {
    background: #f0fdf4;
}

.pr-compare tbody tr.pr-compare-self td:first-child[b-mcntcpu4oa] {
    border-left: 3px solid #16a34a;
}

.pr-compare-ok[b-mcntcpu4oa] {
    display: inline-block;
    color: #16a34a;
    font-weight: 700;
    font-size: 13px;
}

.pr-compare-ok[b-mcntcpu4oa]::before { content: "✓ "; }

.pr-compare-x[b-mcntcpu4oa] {
    display: inline-block;
    color: #dc2626;
    font-weight: 600;
    font-size: 13px;
}

.pr-compare-x[b-mcntcpu4oa]::before { content: "✕ "; }

.pr-compare-warn[b-mcntcpu4oa] {
    display: inline-block;
    color: #d97706;
    font-weight: 600;
    font-size: 13px;
}

.pr-compare-warn[b-mcntcpu4oa]::before { content: "△ "; }

.pr-compare sup a[b-mcntcpu4oa] {
    color: #0284c7;
    text-decoration: none;
    font-weight: 600;
    font-size: 10.5px;
    padding-left: 2px;
}

.pr-compare sup a:hover[b-mcntcpu4oa] { text-decoration: underline; }

.pr-compare-notes[b-mcntcpu4oa] {
    background: #fafafa;
    border-radius: 6px;
    padding: 16px 20px;
    border: 1px solid #e4e4e7;
}

.pr-compare-notes-title[b-mcntcpu4oa] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #71717a;
    margin: 0 0 8px;
}

.pr-compare-notes-list[b-mcntcpu4oa] {
    margin: 0 0 12px;
    padding-left: 22px;
    font-size: 13px;
}

.pr-compare-notes-list li[b-mcntcpu4oa] {
    margin-bottom: 4px;
    color: #3f3f46;
}

.pr-compare-notes-list a[b-mcntcpu4oa] {
    color: #18181b;
    text-decoration: underline;
    text-decoration-color: #d4d4d8;
}

.pr-compare-notes-list a:hover[b-mcntcpu4oa] { text-decoration-color: #18181b; }

.pr-compare-notes-disclaimer[b-mcntcpu4oa] {
    font-size: 12px;
    color: #71717a;
    font-style: italic;
    margin: 8px 0 0;
    line-height: 1.55;
}

.pr-compare-notes-disclaimer a[b-mcntcpu4oa] {
    color: #18181b;
    text-decoration: underline;
    text-decoration-color: #d4d4d8;
}

@media (max-width: 720px) {
    .pr-compare thead th[b-mcntcpu4oa],
    .pr-compare tbody td[b-mcntcpu4oa] { padding: 12px 12px; font-size: 13px; }
}

/* ── Compliance Reports · Form Templates grid ── */
.pr-forms-grid[b-mcntcpu4oa] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-bottom: 40px;
}

.pr-form-card[b-mcntcpu4oa] {
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 10px;
    padding: 22px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
    transition: border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease;
}

.pr-form-card:hover[b-mcntcpu4oa] {
    border-color: #18181b;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
    transform: translateY(-2px);
    text-decoration: none;
    color: inherit;
}

.pr-form-card:hover .pr-form-card-open[b-mcntcpu4oa] {
    color: #18181b;
    transform: translate(2px, -2px);
}

.pr-form-card-head[b-mcntcpu4oa] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pr-form-card-open[b-mcntcpu4oa] {
    margin-left: auto;
    color: #a1a1aa;
    font-size: 14px;
    transition: color 150ms ease, transform 150ms ease;
}

.pr-form-card-flag[b-mcntcpu4oa] {
    font-size: 22px;
    line-height: 1;
}

.pr-form-card-code[b-mcntcpu4oa] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #52525b;
    padding: 4px 9px;
    background: #f4f4f5;
    border-radius: 4px;
}

.pr-form-card-title[b-mcntcpu4oa] {
    font-size: 15px;
    font-weight: 700;
    color: #18181b;
    margin: 4px 0 0;
    line-height: 1.35;
    letter-spacing: -0.2px;
    min-height: 40px;
}

.pr-form-card-meta[b-mcntcpu4oa] {
    font-size: 11.5px;
    color: #71717a;
    margin: 0;
    line-height: 1.45;
    min-height: 32px;
}

.pr-form-card-mock[b-mcntcpu4oa] {
    margin-top: 4px;
    padding: 14px 16px;
    background: #fafafa;
    border: 1px solid #e4e4e7;
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-height: 116px;
}

.pr-form-mock-bar[b-mcntcpu4oa] {
    height: 5px;
    border-radius: 2px;
    background: #d4d4d8;
}

.pr-form-mock-bar--full[b-mcntcpu4oa] { width: 100%; background: #18181b; }
.pr-form-mock-bar--lg[b-mcntcpu4oa]   { width: 86%; }
.pr-form-mock-bar--md[b-mcntcpu4oa]   { width: 64%; }
.pr-form-mock-bar--sm[b-mcntcpu4oa]   { width: 38%; background: #a1a1aa; }

.pr-form-card-foot[b-mcntcpu4oa] {
    margin-top: 6px;
    padding-top: 12px;
    border-top: 1px solid #e4e4e7;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.pr-form-card-foot-label[b-mcntcpu4oa] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #16a34a;
}

.pr-form-card-foot-fields[b-mcntcpu4oa] {
    font-size: 12.5px;
    color: #3f3f46;
    line-height: 1.45;
}

.pr-forms-cta[b-mcntcpu4oa] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 8px;
}

@media (max-width: 1100px) {
    .pr-forms-grid[b-mcntcpu4oa] { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 560px) {
    .pr-forms-grid[b-mcntcpu4oa] { grid-template-columns: 1fr; }
    .pr-form-card-title[b-mcntcpu4oa] { min-height: 0; }
    .pr-form-card-meta[b-mcntcpu4oa]  { min-height: 0; }
}
/* /Features/Home/Pages/RagVsAxowl.razor.rz.scp.css */
/* =========================================
   RAG vs Axowl — architectural comparison page
   Inter / zinc base · restrained palette · single accent
   Visual consistency with Solutions.razor.css (sl-) — prefix cmp-
========================================= */

.cmp-hero[b-uwi2gfrvch],
.cmp-section[b-uwi2gfrvch],
.cmp-cta[b-uwi2gfrvch] {
    width: 100%;
    align-self: stretch;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: #27272a;
}

.cmp-hero *[b-uwi2gfrvch],
.cmp-section *[b-uwi2gfrvch],
.cmp-cta *[b-uwi2gfrvch] { font-family: inherit; }

.cmp-container[b-uwi2gfrvch] {
    max-width: 1200px;
    margin:    0 auto;
    padding:   0 32px;
    width:     100%;
}

/* ── Hero ── */
.cmp-hero[b-uwi2gfrvch] {
    position:        relative;
    padding:         128px 0 96px;
    color:           #fafafa;
    background:      linear-gradient(180deg, #0f0f12 0%, #18181b 100%);
    border-bottom:   1px solid #18181b;
}

.cmp-hero-eyebrow[b-uwi2gfrvch] {
    display:       inline-flex;
    align-items:   center;
    gap:           8px;
    font-size:     13px;
    font-weight:   500;
    letter-spacing: 0.02em;
    color:         #a1a1aa;
    margin-bottom: 24px;
    text-transform: uppercase;
}

.cmp-hero-eyebrow i[b-uwi2gfrvch] { font-size: 14px; }

.cmp-hero-h1[b-uwi2gfrvch] {
    font-size:      56px;
    font-weight:    700;
    line-height:    1.08;
    letter-spacing: -1.6px;
    color:          #ffffff;
    margin:         0 0 28px;
}

.cmp-hero-lede[b-uwi2gfrvch] {
    font-size:   17px;
    line-height: 1.65;
    color:       rgba(255,255,255,0.8);
    max-width:   760px;
    margin:      0 0 36px;
}

.cmp-hero-cta[b-uwi2gfrvch] {
    display:   flex;
    gap:       12px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}

.cmp-hero-meta[b-uwi2gfrvch] {
    display: flex;
    gap: 56px;
    flex-wrap: wrap;
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.cmp-hero-meta-item[b-uwi2gfrvch] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.cmp-hero-meta-label[b-uwi2gfrvch] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 500;
}

.cmp-hero-meta-value[b-uwi2gfrvch] {
    font-size: 15px;
    color: #ffffff;
    font-weight: 600;
}

/* ── Buttons ── */
.cmp-btn[b-uwi2gfrvch] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    min-width:       148px;
    padding:         12px 22px;
    border-radius:   6px;
    font-size:       14px;
    font-weight:     500;
    line-height:     20px;
    text-decoration: none;
    cursor:          pointer;
    border:          none;
    transition:      all 150ms ease;
}

.cmp-btn--primary[b-uwi2gfrvch] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
}
.cmp-btn--primary:hover[b-uwi2gfrvch] { background: #f4f4f5; color: #18181b; }

.cmp-btn--ghost[b-uwi2gfrvch] {
    background: transparent;
    color:      #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.24);
}
.cmp-btn--ghost:hover[b-uwi2gfrvch] { background: rgba(255,255,255,0.08); color: #ffffff; }

.cmp-section .cmp-btn--primary[b-uwi2gfrvch],
.cmp-cta .cmp-btn--primary[b-uwi2gfrvch] {
    background: #18181b;
    color:      #ffffff;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.18);
}
.cmp-section .cmp-btn--primary:hover[b-uwi2gfrvch],
.cmp-cta .cmp-btn--primary:hover[b-uwi2gfrvch] { background: #27272a; color: #ffffff; }

.cmp-section .cmp-btn--ghost[b-uwi2gfrvch],
.cmp-cta .cmp-btn--ghost[b-uwi2gfrvch] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: inset 0 0 0 1px #e4e4e7;
}
.cmp-section .cmp-btn--ghost:hover[b-uwi2gfrvch],
.cmp-cta .cmp-btn--ghost:hover[b-uwi2gfrvch] { background: #fafafa; color: #18181b; }

/* ── Sections ── */
.cmp-section[b-uwi2gfrvch] {
    padding: 96px 0;
    background: #ffffff;
}

.cmp-section--alt[b-uwi2gfrvch] { background: #fafafa; }

.cmp-section-head[b-uwi2gfrvch] {
    max-width: 760px;
    margin: 0 0 48px;
}

.cmp-kicker[b-uwi2gfrvch] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #71717a;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.cmp-h2[b-uwi2gfrvch] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1px;
    color: #18181b;
    margin: 0 0 16px;
}

.cmp-section-sub[b-uwi2gfrvch] {
    font-size: 16px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
    max-width: 720px;
}

/* ── Prose ── */
.cmp-prose[b-uwi2gfrvch] {
    max-width: 760px;
}

.cmp-prose p[b-uwi2gfrvch] {
    font-size: 16px;
    line-height: 1.75;
    color: #3f3f46;
    margin: 0 0 18px;
}

.cmp-prose p:last-child[b-uwi2gfrvch] { margin-bottom: 0; }

.cmp-prose--space-above[b-uwi2gfrvch] { margin-top: 32px; }

.cmp-table strong[b-uwi2gfrvch] { font-weight: 700; color: #18181b; }

.cmp-prose em[b-uwi2gfrvch] {
    font-style: italic;
    color: #18181b;
}

.cmp-prose-note[b-uwi2gfrvch] {
    font-size: 14.5px !important;
    color: #71717a !important;
    padding: 16px 20px;
    background: #fafafa;
    border-left: 2px solid #d4d4d8;
    margin-top: 18px !important;
}

.cmp-section--alt .cmp-prose-note[b-uwi2gfrvch] { background: #ffffff; border-left-color: #e4e4e7; }

/* ── Definitions (§02) ── */
.cmp-defs[b-uwi2gfrvch] {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    gap: 48px;
    align-items: start;
}

.cmp-def-divider[b-uwi2gfrvch] {
    background: #e4e4e7;
    width: 1px;
    align-self: stretch;
    min-height: 200px;
}

.cmp-def-label[b-uwi2gfrvch] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 600;
    margin-bottom: 12px;
}

.cmp-def-name[b-uwi2gfrvch] {
    font-size: 24px;
    font-weight: 700;
    color: #18181b;
    letter-spacing: -0.4px;
    margin: 0 0 16px;
    line-height: 1.25;
}

.cmp-def-body[b-uwi2gfrvch] {
    font-size: 15.5px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

/* ── Table (§03) ── */
.cmp-table-wrap[b-uwi2gfrvch] {
    overflow-x: auto;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
    background: #ffffff;
}

.cmp-table[b-uwi2gfrvch] {
    width: 100%;
    border-collapse: collapse;
    font-size: 14.5px;
}

.cmp-table thead th[b-uwi2gfrvch] {
    text-align: left;
    padding: 16px 20px;
    background: #fafafa;
    border-bottom: 1px solid #e4e4e7;
    font-weight: 600;
    color: #18181b;
    font-size: 13.5px;
    letter-spacing: 0.02em;
}

.cmp-table thead th:first-child[b-uwi2gfrvch] { width: 200px; }

.cmp-table tbody td[b-uwi2gfrvch] {
    padding: 16px 20px;
    border-bottom: 1px solid #f4f4f5;
    color: #3f3f46;
    line-height: 1.6;
    vertical-align: top;
}

.cmp-table tbody tr:last-child td[b-uwi2gfrvch] { border-bottom: none; }

.cmp-table tbody tr:hover[b-uwi2gfrvch] { background: #fafafa; }

.cmp-table-row-label[b-uwi2gfrvch] {
    font-weight: 600;
    color: #18181b !important;
    width: 200px;
}

/* ── Observations (§04) ── */
.cmp-obs[b-uwi2gfrvch] {
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 880px;
}

.cmp-obs-item[b-uwi2gfrvch] {
    display: grid;
    grid-template-columns: 56px 1fr;
    grid-template-areas:
        "num title"
        ".   body";
    column-gap: 24px;
    row-gap: 12px;
    align-items: start;
    padding: 28px 0;
    border-top: 1px solid #e4e4e7;
}

.cmp-obs-item > .cmp-obs-num[b-uwi2gfrvch]   { grid-area: num; }
.cmp-obs-item > .cmp-obs-title[b-uwi2gfrvch] { grid-area: title; margin-bottom: 0; }
.cmp-obs-item > .cmp-obs-body[b-uwi2gfrvch]  { grid-area: body; }

.cmp-obs-item:first-child[b-uwi2gfrvch] { border-top: none; padding-top: 0; }

.cmp-obs-num[b-uwi2gfrvch] {
    font-size: 14px;
    font-weight: 700;
    color: #a1a1aa;
    letter-spacing: 0.04em;
    padding-top: 4px;
}

.cmp-obs-title[b-uwi2gfrvch] {
    font-size: 19px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 12px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

.cmp-obs-body[b-uwi2gfrvch] {
    font-size: 15.5px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

.cmp-obs-body em[b-uwi2gfrvch] { font-style: italic; color: #18181b; }

/* ── Flow / ASCII (§06, §07) ── */
.cmp-flow[b-uwi2gfrvch] {
    margin: 24px 0;
    padding: 24px;
    background: #0f0f12;
    border-radius: 8px;
    overflow-x: auto;
}

.cmp-section--alt .cmp-flow[b-uwi2gfrvch] {
    background: #ffffff;
    border: 1px solid #e4e4e7;
}

.cmp-flow-ascii[b-uwi2gfrvch] {
    font-family: 'SF Mono', 'Menlo', 'Consolas', 'Monaco', monospace;
    font-size: 13px;
    line-height: 1.55;
    color: #e4e4e7;
    margin: 0;
    white-space: pre;
}

.cmp-section--alt .cmp-flow-ascii[b-uwi2gfrvch] { color: #27272a; }

/* ── Complementary deployment grid (§08) ── */
.cmp-comp-grid[b-uwi2gfrvch] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
}

.cmp-comp[b-uwi2gfrvch] {
    padding: 28px;
    background: #ffffff;
    border: 1px solid #e4e4e7;
    border-radius: 8px;
}

.cmp-comp-label[b-uwi2gfrvch] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 600;
    margin-bottom: 16px;
}

.cmp-comp-list[b-uwi2gfrvch] {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cmp-comp-list li[b-uwi2gfrvch] {
    position: relative;
    padding: 10px 0 10px 22px;
    font-size: 15px;
    line-height: 1.6;
    color: #3f3f46;
    border-bottom: 1px solid #f4f4f5;
}

.cmp-comp-list li:last-child[b-uwi2gfrvch] { border-bottom: none; }

.cmp-comp-note[b-uwi2gfrvch] {
    margin: 16px 0 0;
    padding-top: 14px;
    border-top: 1px dashed #d4d4d8;
    font-size: 13px;
    line-height: 1.6;
    color: #71717a;
    font-style: italic;
}

.cmp-comp-list li[b-uwi2gfrvch]::before {
    content: '';
    position: absolute;
    left: 0;
    top: 18px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #d4d4d8;
}

/* ── References (§09) ── */
.cmp-refs[b-uwi2gfrvch] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 880px;
}

.cmp-ref[b-uwi2gfrvch] {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 24px;
    padding: 18px 0;
    border-bottom: 1px solid #e4e4e7;
    align-items: start;
}

.cmp-ref:last-child[b-uwi2gfrvch] { border-bottom: none; }

.cmp-ref-tag[b-uwi2gfrvch] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 600;
    padding-top: 2px;
}

.cmp-ref-text[b-uwi2gfrvch] {
    font-size: 14.5px;
    line-height: 1.65;
    color: #3f3f46;
}

.cmp-ref-text em[b-uwi2gfrvch] { font-style: italic; color: #18181b; }

/* ── CTA ── */
.cmp-cta[b-uwi2gfrvch] {
    padding: 96px 0;
    background: #0f0f12;
    color: #fafafa;
    text-align: center;
}

.cmp-cta-title[b-uwi2gfrvch] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.6px;
    color: #ffffff;
    margin: 0 0 20px;
}

.cmp-cta-sub[b-uwi2gfrvch] {
    font-size: 16px;
    line-height: 1.65;
    color: rgba(255,255,255,0.72);
    max-width: 620px;
    margin: 0 auto 36px;
}

.cmp-cta-actions[b-uwi2gfrvch] {
    display: inline-flex;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: center;
}

/* ── Responsive ── */
@media (max-width: 880px) {
    .cmp-hero[b-uwi2gfrvch] { padding: 96px 0 72px; }
    .cmp-hero-h1[b-uwi2gfrvch] { font-size: 40px; letter-spacing: -1.2px; }
    .cmp-section[b-uwi2gfrvch] { padding: 72px 0; }
    .cmp-h2[b-uwi2gfrvch] { font-size: 28px; }
    .cmp-defs[b-uwi2gfrvch] { grid-template-columns: 1fr; }
    .cmp-def-divider[b-uwi2gfrvch] { display: none; }
    .cmp-comp-grid[b-uwi2gfrvch] { grid-template-columns: 1fr; }
    .cmp-ref[b-uwi2gfrvch] { grid-template-columns: 1fr; gap: 6px; }
    .cmp-obs-item[b-uwi2gfrvch] {
        grid-template-columns: 1fr;
        grid-template-areas: "num" "title" "body";
        gap: 8px;
    }
    .cmp-cta-title[b-uwi2gfrvch] { font-size: 28px; }
}
/* /Features/Home/Pages/Refund.razor.rz.scp.css */
/* Legal page — Privacy */

.lp-root[b-q9jtk0jyol] {
    min-height: 70vh;
    padding: 4rem 1.5rem 6rem;
}

.lp-inner[b-q9jtk0jyol] {
    max-width: 820px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 3rem 3rem 3.5rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

@media (max-width: 720px) {
    .lp-root[b-q9jtk0jyol] { padding: 2rem 0.75rem 4rem; }
    .lp-inner[b-q9jtk0jyol] { padding: 1.75rem 1.25rem 2.25rem; border-radius: 8px; }
}

/* Header */
.lp-header[b-q9jtk0jyol] {
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}

.lp-eyebrow[b-q9jtk0jyol] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.lp-title[b-q9jtk0jyol] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 800;
    font-size: 2.25rem;
    letter-spacing: -0.02em;
    color: #18181b;
    margin: 0 0 0.75rem;
}

.lp-meta[b-q9jtk0jyol] {
    color: #6b7280;
    font-size: 0.88rem;
    margin: 0;
}

.lp-meta strong[b-q9jtk0jyol] { color: #18181b; font-weight: 600; }

.lp-dot[b-q9jtk0jyol] { margin: 0 0.5rem; color: #d1d5db; }

/* Body */
.lp-body[b-q9jtk0jyol] {
    color: #27272a;
    font-size: 0.95rem;
    line-height: 1.7;
}

.lp-intro[b-q9jtk0jyol] {
    color: #3f3f46;
    margin: 0 0 1rem;
}

.lp-section[b-q9jtk0jyol] {
    margin-top: 2.5rem;
}

.lp-h2[b-q9jtk0jyol] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    letter-spacing: -0.01em;
    color: #18181b;
    margin: 0 0 1rem;
}

.lp-h3[b-q9jtk0jyol] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    color: #27272a;
    margin: 1.5rem 0 0.5rem;
}

.lp-section p[b-q9jtk0jyol] { margin: 0 0 1rem; }

.lp-list[b-q9jtk0jyol] {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
}

.lp-list li[b-q9jtk0jyol] {
    margin-bottom: 0.4rem;
}

.lp-list--ordered[b-q9jtk0jyol] {
    list-style: decimal;
}

.lp-link[b-q9jtk0jyol] {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.lp-link:hover[b-q9jtk0jyol] {
    text-decoration: underline;
}

.lp-section code[b-q9jtk0jyol] {
    background: #f4f4f5;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85em;
    color: #18181b;
    border: 1px solid #e5e7eb;
}

/* Contact card */
.lp-contact-card[b-q9jtk0jyol] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    display: grid;
    gap: 0.6rem;
}

.lp-contact-row[b-q9jtk0jyol] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1rem;
    font-size: 0.9rem;
}

@media (max-width: 600px) {
    .lp-contact-row[b-q9jtk0jyol] { grid-template-columns: 1fr; gap: 0.15rem; }
}

.lp-contact-label[b-q9jtk0jyol] {
    color: #6b7280;
    font-weight: 600;
}

.lp-placeholder[b-q9jtk0jyol] {
    color: #a1a1aa;
    font-style: italic;
    font-size: 0.85em;
}

/* Divider before country notes */
.lp-divider[b-q9jtk0jyol] {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 3rem 0 0;
}

/* Country notes */
.lp-notes-intro[b-q9jtk0jyol] {
    color: #52525b;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}

.lp-note[b-q9jtk0jyol] {
    background: #f9fafb;
    border-left: 3px solid #d4d4d8;
    padding: 1rem 1.25rem;
    border-radius: 4px;
    margin-bottom: 1rem;
    font-size: 0.88rem;
}

.lp-note p[b-q9jtk0jyol] { margin: 0 0 0.5rem; }
.lp-note p:last-child[b-q9jtk0jyol] { margin-bottom: 0; }
.lp-note .lp-list[b-q9jtk0jyol] { font-size: 0.88rem; margin-bottom: 0.5rem; }

.lp-note-title[b-q9jtk0jyol] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: #18181b;
    margin: 0 0 0.5rem;
}
/* /Features/Home/Pages/Sample.razor.rz.scp.css */
/* =========================================
   Compliance Reports · Sample renders (A4 document feel)
   Prefix: cs-  (compliance sample)
========================================= */

.cs-page-wrap[b-4itpwhf6rb] {
    width: 100%;
    background: #ececec;
    min-height: calc(100vh - 60px);
    padding: 0 0 80px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

/* ── Toolbar ── */
.cs-toolbar[b-4itpwhf6rb] {
    background: #18181b;
    color: #fafafa;
    padding: 14px 0;
    position: sticky;
    top: 56px;
    z-index: 10;
    border-bottom: 1px solid #27272a;
}

.cs-toolbar-inner[b-4itpwhf6rb] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    align-items: center;
    gap: 24px;
}

.cs-back[b-4itpwhf6rb] {
    color: #d4d4d8;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color 150ms ease;
}

.cs-back:hover[b-4itpwhf6rb] { color: #ffffff; }

.cs-toolbar-meta[b-4itpwhf6rb] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    margin-right: auto;
    flex-wrap: wrap;
    justify-content: center;
}

.cs-meta-flag[b-4itpwhf6rb] {
    font-size: 18px;
    line-height: 1;
}

.cs-meta-code[b-4itpwhf6rb] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #18181b;
    padding: 4px 9px;
    background: #fbbf24;
    border-radius: 4px;
}

.cs-meta-name[b-4itpwhf6rb] {
    font-size: 14px;
    font-weight: 500;
    color: #fafafa;
    letter-spacing: -0.1px;
}

.cs-actions[b-4itpwhf6rb] {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}

.cs-action[b-4itpwhf6rb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: transparent;
    color: #fafafa;
    cursor: pointer;
    text-decoration: none;
    transition: all 150ms ease;
}

.cs-action:hover[b-4itpwhf6rb] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.4);
    color: #ffffff;
}

.cs-action--primary[b-4itpwhf6rb] {
    background: #fafafa;
    color: #18181b;
    border-color: #fafafa;
}

.cs-action--primary:hover[b-4itpwhf6rb] {
    background: #ffffff;
    color: #18181b;
}

/* ── Paper (A4-like document) ── */
.cs-paper[b-4itpwhf6rb] {
    max-width: 880px;
    margin: 40px auto 0;
    background: #ffffff;
    padding: 64px 72px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.06);
    color: #18181b;
    font-family: 'Source Serif 4', 'Source Serif Pro', Georgia, 'Times New Roman', serif;
    line-height: 1.7;
    font-size: 14.5px;
    border: 1px solid #e4e4e7;
}

/* ── Document header ── */
.cs-doc-head[b-4itpwhf6rb] {
    text-align: center;
    border-bottom: 2px solid #18181b;
    padding-bottom: 24px;
    margin-bottom: 36px;
}

.cs-doc-pretitle[b-4itpwhf6rb] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #71717a;
    margin-bottom: 8px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
}

.cs-doc-title[b-4itpwhf6rb] {
    font-size: 24px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 10px;
    letter-spacing: -0.4px;
    line-height: 1.25;
}

.cs-doc-subtitle[b-4itpwhf6rb] {
    font-size: 13.5px;
    color: #52525b;
    margin: 0;
    font-style: italic;
}

.cs-doc-meta-grid[b-4itpwhf6rb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 32px;
    margin-top: 24px;
    text-align: left;
    font-size: 13px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    font-style: normal;
}

.cs-doc-meta-grid > div[b-4itpwhf6rb] { display: flex; flex-direction: column; gap: 2px; }

.cs-meta-label[b-4itpwhf6rb] {
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #71717a;
}

.cs-meta-value[b-4itpwhf6rb] {
    color: #18181b;
    font-weight: 500;
}

/* ── Sections ── */
.cs-section[b-4itpwhf6rb] {
    margin: 32px 0;
}

.cs-section + .cs-section[b-4itpwhf6rb] { padding-top: 4px; }

.cs-section-head[b-4itpwhf6rb] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #18181b;
    margin: 0 0 6px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    border-top: 1px solid #18181b;
    padding-top: 12px;
}

.cs-section-title[b-4itpwhf6rb] {
    font-size: 17px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 14px;
    letter-spacing: -0.2px;
    line-height: 1.4;
}

.cs-section p[b-4itpwhf6rb] {
    margin: 0 0 12px;
    color: #27272a;
}

.cs-section p:last-child[b-4itpwhf6rb] { margin-bottom: 0; }

/* ── Inline filled-in values (with chain citation) ── */
.cs-fill[b-4itpwhf6rb] {
    background: #fef3c7;
    padding: 1px 5px;
    border-radius: 2px;
    color: #18181b;
    font-weight: 600;
}

.cs-cite[b-4itpwhf6rb] {
    font-size: 9.5px;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', 'Source Code Pro', Consolas, monospace;
    color: #16a34a;
    margin-left: 3px;
    vertical-align: super;
    line-height: 0;
    font-weight: 600;
    text-decoration: none;
    cursor: help;
}

.cs-cite:hover[b-4itpwhf6rb] { color: #15803d; text-decoration: underline; }

/* ── Tables ── */
.cs-table[b-4itpwhf6rb] {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0 16px;
    font-size: 13px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
}

.cs-table thead th[b-4itpwhf6rb] {
    text-align: left;
    padding: 10px 12px;
    background: #fafafa;
    border: 1px solid #d4d4d8;
    font-weight: 700;
    font-size: 11.5px;
    color: #18181b;
    letter-spacing: 0.02em;
}

.cs-table tbody td[b-4itpwhf6rb] {
    padding: 10px 12px;
    border: 1px solid #e4e4e7;
    color: #27272a;
    vertical-align: top;
    line-height: 1.55;
}

.cs-table tbody tr:nth-child(even) td[b-4itpwhf6rb] { background: #fafafa; }

/* ── Signature block ── */
.cs-sig-block[b-4itpwhf6rb] {
    margin-top: 48px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 36px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
}

.cs-sig[b-4itpwhf6rb] {
    border-top: 1.5px solid #18181b;
    padding-top: 8px;
}

.cs-sig-name[b-4itpwhf6rb] {
    font-size: 14px;
    font-weight: 700;
    color: #18181b;
}

.cs-sig-title[b-4itpwhf6rb] {
    font-size: 12px;
    color: #52525b;
    margin-top: 2px;
}

.cs-sig-date[b-4itpwhf6rb] {
    font-size: 11.5px;
    color: #71717a;
    margin-top: 12px;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
}

/* ── Evidence Appendix (sealed evidence cards per citation) ── */
.cs-evidence-section[b-4itpwhf6rb] {
    margin-top: 56px;
    padding-top: 32px;
    border-top: 2px solid #18181b;
}

.cs-evidence-head[b-4itpwhf6rb] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #18181b;
    margin-bottom: 6px;
}

.cs-evidence-title[b-4itpwhf6rb] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 6px;
    letter-spacing: -0.2px;
}

.cs-evidence-lede[b-4itpwhf6rb] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    font-size: 13px;
    color: #52525b;
    line-height: 1.6;
    margin: 0 0 28px;
}

.cs-evidence-grid[b-4itpwhf6rb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.cs-evidence-card[b-4itpwhf6rb] {
    border: 1px solid #e4e4e7;
    border-left: 3px solid #16a34a;
    border-radius: 6px;
    background: #ffffff;
    padding: 16px 18px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
}

.cs-evidence-card-head[b-4itpwhf6rb] {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px dashed #e4e4e7;
}

.cs-evidence-card-num[b-4itpwhf6rb] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 11.5px;
    font-weight: 700;
    color: #16a34a;
    background: #f0fdf4;
    padding: 3px 8px;
    border-radius: 4px;
}

.cs-evidence-card-context[b-4itpwhf6rb] {
    font-size: 13px;
    font-weight: 700;
    color: #18181b;
    flex-grow: 1;
    line-height: 1.35;
}

.cs-evidence-card-status[b-4itpwhf6rb] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    color: #16a34a;
    text-transform: uppercase;
    white-space: nowrap;
}

.cs-evidence-card-data[b-4itpwhf6rb] {
    margin: 0;
    display: grid;
    grid-template-columns: 110px 1fr;
    row-gap: 4px;
    column-gap: 10px;
    font-size: 11.5px;
    line-height: 1.55;
}

.cs-evidence-card-data dt[b-4itpwhf6rb] {
    color: #71717a;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 9.5px;
    letter-spacing: 0.06em;
    padding-top: 2px;
}

.cs-evidence-card-data dd[b-4itpwhf6rb] {
    margin: 0;
    color: #27272a;
}

.cs-mono[b-4itpwhf6rb] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', 'Source Code Pro', Consolas, monospace;
    font-size: 10.5px;
    color: #18181b;
    word-break: break-all;
}

/* ── Chain citations footer ── */
.cs-citations[b-4itpwhf6rb] {
    margin-top: 56px;
    padding-top: 24px;
    border-top: 1px solid #e4e4e7;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', 'Source Code Pro', Consolas, monospace;
    font-size: 11px;
    color: #52525b;
    line-height: 1.6;
}

.cs-citations-head[b-4itpwhf6rb] {
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #16a34a;
    margin-bottom: 12px;
}

.cs-citations-head[b-4itpwhf6rb]::before {
    content: "🔒 ";
}

.cs-citation-row[b-4itpwhf6rb] {
    padding: 4px 0;
    display: grid;
    grid-template-columns: 32px 1fr;
    gap: 8px;
    border-bottom: 1px dashed #f4f4f5;
}

.cs-citation-row:last-child[b-4itpwhf6rb] { border-bottom: none; }

.cs-citation-num[b-4itpwhf6rb] {
    color: #16a34a;
    font-weight: 600;
}

.cs-citation-hash[b-4itpwhf6rb] {
    color: #27272a;
    word-break: break-all;
}

/* ── Axowl render footer ── */
.cs-axowl-footer[b-4itpwhf6rb] {
    max-width: 880px;
    margin: 24px auto 0;
    padding: 16px 24px;
    background: rgba(255, 255, 255, 0.6);
    border: 1px solid #e4e4e7;
    border-radius: 6px;
    font-size: 11.5px;
    color: #52525b;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
}

.cs-axowl-brand[b-4itpwhf6rb] {
    font-weight: 700;
    color: #18181b;
}

.cs-axowl-root[b-4itpwhf6rb] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    color: #16a34a;
}

/* ── Notice / disclaimer banner ── */
.cs-notice[b-4itpwhf6rb] {
    max-width: 880px;
    margin: 0 auto 12px;
    padding: 12px 20px;
    background: #fef3c7;
    border: 1px solid #fbbf24;
    border-radius: 6px;
    font-size: 12.5px;
    color: #78350f;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', sans-serif;
    display: flex;
    align-items: center;
    gap: 8px;
}

.cs-notice strong[b-4itpwhf6rb] { font-weight: 700; }

/* ── Lists in document ── */
.cs-list[b-4itpwhf6rb] {
    margin: 8px 0 16px;
    padding-left: 22px;
}

.cs-list li[b-4itpwhf6rb] {
    margin-bottom: 6px;
    color: #27272a;
    line-height: 1.65;
}

/* ── Two-column layout (e.g., for India IFC opinion + responsibility) ── */
.cs-two-col[b-4itpwhf6rb] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

/* ── Responsive ── */
@media (max-width: 980px) {
    .cs-toolbar-inner[b-4itpwhf6rb] {
        flex-wrap: wrap;
        gap: 12px;
    }
    .cs-toolbar-meta[b-4itpwhf6rb] { margin: 0; order: 3; width: 100%; justify-content: flex-start; }
    .cs-paper[b-4itpwhf6rb] {
        padding: 40px 36px;
        margin: 24px 16px 0;
        max-width: none;
    }
    .cs-doc-meta-grid[b-4itpwhf6rb] { grid-template-columns: 1fr; gap: 10px; }
    .cs-sig-block[b-4itpwhf6rb] { grid-template-columns: 1fr; gap: 24px; }
    .cs-two-col[b-4itpwhf6rb] { grid-template-columns: 1fr; }
    .cs-evidence-grid[b-4itpwhf6rb] { grid-template-columns: 1fr; }
    .cs-evidence-card-data[b-4itpwhf6rb] { grid-template-columns: 90px 1fr; }
    .cs-axowl-footer[b-4itpwhf6rb] { margin-left: 16px; margin-right: 16px; }
    .cs-notice[b-4itpwhf6rb] { margin-left: 16px; margin-right: 16px; }
}

@media (max-width: 600px) {
    .cs-paper[b-4itpwhf6rb] { padding: 28px 22px; font-size: 13.5px; }
    .cs-doc-title[b-4itpwhf6rb] { font-size: 20px; }
    .cs-section-title[b-4itpwhf6rb] { font-size: 15.5px; }
}

/* ── Print ── */
@media print {
    .cs-page-wrap[b-4itpwhf6rb] { background: #ffffff; padding: 0; }
    .cs-toolbar[b-4itpwhf6rb], .cs-axowl-footer[b-4itpwhf6rb], .cs-notice[b-4itpwhf6rb] { display: none; }
    .cs-paper[b-4itpwhf6rb] {
        box-shadow: none;
        border: none;
        margin: 0;
        max-width: none;
        padding: 18mm 16mm;
    }
    .cs-cite[b-4itpwhf6rb] { color: #16a34a; text-decoration: none; }
    .cs-fill[b-4itpwhf6rb] { background: transparent; padding: 0; }
}
/* /Features/Home/Pages/Solutions.razor.rz.scp.css */
/* =========================================
   Solutions — per-industry detail page
   Inter / zinc base · restrained palette · single accent
   No childish color storms; differentiation comes from hero photography.
========================================= */

.sl-hero[b-diow1wbink],
.sl-section[b-diow1wbink],
.sl-cta[b-diow1wbink] {
    width: 100%;
    font-family: 'Inter', 'Noto Sans KR', 'Noto Sans JP', 'Inter Fallback', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
    font-feature-settings: 'cv11', 'ss01', 'ss03';
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    color: #27272a;
}

.sl-hero *[b-diow1wbink],
.sl-section *[b-diow1wbink],
.sl-cta *[b-diow1wbink] { font-family: inherit; }

.sl-container[b-diow1wbink] {
    max-width: 1200px;
    margin:    0 auto;
    padding:   0 32px;
    width:     100%;
}

/* ── Hero ── */
.sl-hero[b-diow1wbink] {
    position:        relative;
    padding:         128px 0 96px;
    color:           #fafafa;
    background-size: cover;
    background-position: center;
    border-bottom:   1px solid #18181b;
}

.sl-hero-eyebrow[b-diow1wbink] {
    display:       inline-flex;
    align-items:   center;
    gap:           8px;
    font-size:     13px;
    font-weight:   500;
    letter-spacing: 0.02em;
    color:         #a1a1aa;
    margin-bottom: 24px;
    text-transform: uppercase;
}

.sl-hero-eyebrow i[b-diow1wbink] { font-size: 14px; }

.sl-hero-h1[b-diow1wbink] {
    font-size:      60px;
    font-weight:    700;
    line-height:    1.06;
    letter-spacing: -2px;
    color:          #ffffff;
    margin:         0 0 28px;
}

.sl-hero-lede[b-diow1wbink] {
    font-size:   17px;
    line-height: 1.65;
    color:       rgba(255,255,255,0.8);
    max-width:   720px;
    margin:      0 0 36px;
}

.sl-hero-cta[b-diow1wbink] {
    display:   flex;
    gap:       12px;
    flex-wrap: wrap;
    margin-bottom: 56px;
}

/* ── Hero meta strip — tier + deployment summary ── */
.sl-hero-meta[b-diow1wbink] {
    display: flex;
    gap: 56px;
    flex-wrap: wrap;
    padding-top: 32px;
    border-top: 1px solid rgba(255,255,255,0.12);
}

.sl-hero-meta-item[b-diow1wbink] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.sl-hero-meta-label[b-diow1wbink] {
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #71717a;
    font-weight: 500;
}

.sl-hero-meta-value[b-diow1wbink] {
    font-size: 15px;
    color: #ffffff;
    font-weight: 600;
}

/* ── Buttons ── */
.sl-btn[b-diow1wbink] {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    gap:             8px;
    min-width:       148px;
    padding:         12px 22px;
    border-radius:   6px;
    font-size:       14px;
    font-weight:     500;
    line-height:     20px;
    text-decoration: none;
    cursor:          pointer;
    border:          none;
    transition:      all 150ms ease;
}

.sl-btn--primary[b-diow1wbink] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.12);
}
.sl-btn--primary:hover[b-diow1wbink] { background: #f4f4f5; color: #18181b; }

.sl-btn--ghost[b-diow1wbink] {
    background: transparent;
    color:      #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.24);
}
.sl-btn--ghost:hover[b-diow1wbink] { background: rgba(255,255,255,0.08); color: #ffffff; }

/* On light sections (CTA buttons reused) */
.sl-section .sl-btn--primary[b-diow1wbink],
.sl-cta .sl-btn--primary[b-diow1wbink] {
    background: #18181b;
    color:      #ffffff;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.18);
}
.sl-section .sl-btn--primary:hover[b-diow1wbink],
.sl-cta .sl-btn--primary:hover[b-diow1wbink] { background: #27272a; color: #ffffff; }

.sl-section .sl-btn--ghost[b-diow1wbink],
.sl-cta .sl-btn--ghost[b-diow1wbink] {
    background: #ffffff;
    color:      #18181b;
    box-shadow: inset 0 0 0 1px #e4e4e7;
}
.sl-section .sl-btn--ghost:hover[b-diow1wbink],
.sl-cta .sl-btn--ghost:hover[b-diow1wbink] { background: #fafafa; color: #18181b; }

/* ── Sections ── */
.sl-section[b-diow1wbink] {
    padding: 96px 0;
    background: #ffffff;
}

.sl-section--alt[b-diow1wbink] { background: #fafafa; }

.sl-section--arch[b-diow1wbink] { background: #ffffff; padding: 96px 0; }

.sl-section-head[b-diow1wbink] {
    max-width: 720px;
    margin: 0 0 56px;
}

.sl-kicker[b-diow1wbink] {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: #71717a;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.sl-h2[b-diow1wbink] {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.18;
    letter-spacing: -1px;
    color: #18181b;
    margin: 0 0 16px;
}

.sl-section-sub[b-diow1wbink] {
    font-size: 16px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
    max-width: 680px;
}

/* ── Threats ── */
.sl-threats[b-diow1wbink] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 1px solid #e4e4e7;
}

.sl-threat[b-diow1wbink] {
    padding: 28px 28px 28px 0;
    border-bottom: 1px solid #e4e4e7;
    border-right: 1px solid #e4e4e7;
    display: grid;
    grid-template-columns: 44px 1fr;
    gap: 0;
    align-items: start;
}

.sl-threat:nth-child(3n)[b-diow1wbink] { border-right: none; padding-right: 0; }
.sl-threat:nth-child(3n+1)[b-diow1wbink] { padding-left: 0; }
.sl-threat:nth-child(3n+2)[b-diow1wbink] { padding-left: 28px; }
.sl-threat:nth-child(3n)[b-diow1wbink] { padding-left: 28px; }

.sl-threat-num[b-diow1wbink] {
    font-size: 13px;
    font-weight: 700;
    color: #a1a1aa;
    letter-spacing: 0.04em;
    padding-top: 2px;
}

.sl-threat-title[b-diow1wbink] {
    font-size: 17px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 10px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

.sl-threat-desc[b-diow1wbink] {
    font-size: 14px;
    line-height: 1.65;
    color: #52525b;
    margin: 0 0 18px;
}

.sl-threat-stat[b-diow1wbink] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-top: 14px;
    border-top: 1px solid #ededed;
}

.sl-threat-stat-num[b-diow1wbink] {
    font-size: 22px;
    font-weight: 700;
    color: #18181b;
    letter-spacing: -0.4px;
}

.sl-threat-stat-src[b-diow1wbink] {
    font-size: 11.5px;
    color: #71717a;
    line-height: 1.4;
}

/* ── Patents (centerpiece) ── */
.sl-patents[b-diow1wbink] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 8px;
    border-top: 2px solid #18181b;
    border-bottom: 1px solid #e4e4e7;
}

.sl-patent[b-diow1wbink] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 32px;
    padding: 36px 0;
    border-bottom: 1px solid #e4e4e7;
}

.sl-patent:last-child[b-diow1wbink] { border-bottom: none; }

.sl-patent-num[b-diow1wbink] {
    font-size: 11.5px;
    font-weight: 600;
    color: #71717a;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.sl-patent-name[b-diow1wbink] {
    font-size: 13.5px;
    font-weight: 700;
    color: #18181b;
    line-height: 1.4;
    letter-spacing: -0.1px;
}

.sl-patent-headline[b-diow1wbink] {
    font-size: 21px;
    font-weight: 700;
    color: #18181b;
    line-height: 1.3;
    margin: 0 0 14px;
    letter-spacing: -0.4px;
}

.sl-patent-body[b-diow1wbink] {
    font-size: 15px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

/* ── Architecture ── */
.sl-arch-grid[b-diow1wbink] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    align-items: center;
}

.sl-arch-text .sl-section-head[b-diow1wbink] { margin-bottom: 24px; }

.sl-arch-text .sl-h2[b-diow1wbink] { font-size: 32px; }

.sl-arch-desc[b-diow1wbink] {
    font-size: 15px;
    line-height: 1.7;
    color: #52525b;
    margin: 0 0 28px;
}

.sl-arch-row[b-diow1wbink] {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 16px;
    padding: 16px 0;
    border-top: 1px solid #e4e4e7;
}

.sl-arch-row--last[b-diow1wbink] { border-bottom: 1px solid #e4e4e7; }

.sl-arch-row-label[b-diow1wbink] {
    font-size: 12px;
    font-weight: 600;
    color: #71717a;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding-top: 2px;
}

.sl-arch-row-value[b-diow1wbink] {
    font-size: 15px;
    color: #18181b;
    font-weight: 600;
    line-height: 1.5;
}

.sl-arch-row-value--accent[b-diow1wbink] { color: #166534; }

.sl-arch-row-value--small[b-diow1wbink] {
    font-size: 14px;
    font-weight: 400;
    color: #3f3f46;
    line-height: 1.65;
}

.sl-arch-link[b-diow1wbink] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 24px;
    font-size: 14px;
    font-weight: 600;
    color: #18181b;
    text-decoration: none;
    transition: gap 0.15s;
}

.sl-arch-link:hover[b-diow1wbink] { gap: 10px; color: #18181b; }

.sl-arch-img[b-diow1wbink] {
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 8px 24px -8px rgba(0,0,0,0.18);
}

.sl-arch-img img[b-diow1wbink] {
    width: 100%;
    height: 100%;
    min-height: 420px;
    object-fit: cover;
    display: block;
}

/* ── Scenarios ── */
.sl-scenarios[b-diow1wbink] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0;
    border-top: 1px solid #e4e4e7;
    border-bottom: 1px solid #e4e4e7;
}

.sl-scenario[b-diow1wbink] {
    padding: 32px 32px 32px 0;
    border-right: 1px solid #e4e4e7;
}

.sl-scenario:nth-child(3n)[b-diow1wbink] { border-right: none; padding-right: 0; }
.sl-scenario:nth-child(3n+1)[b-diow1wbink] { padding-left: 0; }
.sl-scenario:nth-child(3n+2)[b-diow1wbink] { padding-left: 32px; }
.sl-scenario:nth-child(3n)[b-diow1wbink] { padding-left: 32px; }

.sl-scenario-num[b-diow1wbink] {
    font-size: 11.5px;
    font-weight: 700;
    color: #a1a1aa;
    letter-spacing: 0.08em;
    margin-bottom: 14px;
}

.sl-scenario-title[b-diow1wbink] {
    font-size: 18px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 12px;
    line-height: 1.35;
    letter-spacing: -0.2px;
}

.sl-scenario-desc[b-diow1wbink] {
    font-size: 14.5px;
    line-height: 1.65;
    color: #52525b;
    margin: 0;
}

/* ── VS / Incumbent comparison ── */
.sl-vs[b-diow1wbink] {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: 48px;
    align-items: stretch;
    padding: 8px 0;
}

.sl-vs-col[b-diow1wbink] {
    padding: 0;
}

.sl-vs-label[b-diow1wbink] {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.sl-vs-col--incumbent .sl-vs-label[b-diow1wbink] { color: #b91c1c; }
.sl-vs-col--dpsm     .sl-vs-label[b-diow1wbink] { color: #166534; }

.sl-vs-name[b-diow1wbink] {
    font-size: 22px;
    font-weight: 700;
    color: #18181b;
    margin: 0 0 14px;
    line-height: 1.3;
    letter-spacing: -0.3px;
}

.sl-vs-body[b-diow1wbink] {
    font-size: 15px;
    line-height: 1.7;
    color: #3f3f46;
    margin: 0;
}

.sl-vs-divider[b-diow1wbink] {
    width: 1px;
    background: #e4e4e7;
    align-self: stretch;
}

/* ── Compliance ── */
.sl-compliance[b-diow1wbink] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px 32px;
    border-top: 1px solid #e4e4e7;
    padding-top: 28px;
}

.sl-compliance-item[b-diow1wbink] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
    color: #18181b;
    font-weight: 500;
    padding: 6px 0;
}

.sl-compliance-item i[b-diow1wbink] {
    font-size: 16px;
    color: #166534;
    flex-shrink: 0;
}

/* ── CTA ── */
.sl-cta[b-diow1wbink] {
    background: #0a0a0a;
    padding: 88px 0;
    text-align: center;
    border-top: 1px solid #18181b;
}

.sl-cta-title[b-diow1wbink] {
    font-size: 38px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -1px;
    color: #ffffff;
    margin: 0 0 20px;
}

.sl-cta-sub[b-diow1wbink] {
    font-size: 16px;
    line-height: 1.65;
    color: rgba(255,255,255,0.7);
    margin: 0 auto 32px;
    max-width: 580px;
}

.sl-cta-actions[b-diow1wbink] {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.sl-cta .sl-btn--primary[b-diow1wbink] {
    background: #ffffff;
    color: #18181b;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.4);
}
.sl-cta .sl-btn--primary:hover[b-diow1wbink] { background: #f4f4f5; color: #18181b; }

.sl-cta .sl-btn--ghost[b-diow1wbink] {
    background: transparent;
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.28);
}
.sl-cta .sl-btn--ghost:hover[b-diow1wbink] { background: rgba(255,255,255,0.08); color: #ffffff; }

/* ── Responsive ── */
@media (max-width: 1024px) {
    .sl-hero[b-diow1wbink]        { padding: 96px 0 72px; }
    .sl-hero-h1[b-diow1wbink]     { font-size: 44px; letter-spacing: -1.4px; }
    .sl-hero-lede[b-diow1wbink]   { font-size: 16px; }
    .sl-section[b-diow1wbink]     { padding: 72px 0; }
    .sl-h2[b-diow1wbink]          { font-size: 30px; letter-spacing: -0.7px; }

    .sl-threats[b-diow1wbink]     { grid-template-columns: 1fr 1fr; }
    .sl-threat:nth-child(3n)[b-diow1wbink]   { border-right: 1px solid #e4e4e7; padding-right: 28px; padding-left: 28px; }
    .sl-threat:nth-child(2n)[b-diow1wbink]   { border-right: none; padding-right: 0; padding-left: 28px; }
    .sl-threat:nth-child(2n+1)[b-diow1wbink] { border-right: 1px solid #e4e4e7; padding-left: 0; padding-right: 28px; }

    .sl-patent[b-diow1wbink]      { grid-template-columns: 1fr; gap: 16px; }

    .sl-arch-grid[b-diow1wbink]   { grid-template-columns: 1fr; gap: 40px; }
    .sl-arch-img img[b-diow1wbink] { min-height: 280px; }

    .sl-scenarios[b-diow1wbink]   { grid-template-columns: 1fr; }
    .sl-scenario[b-diow1wbink]    { border-right: none; border-bottom: 1px solid #e4e4e7; padding: 28px 0 !important; }
    .sl-scenario:last-child[b-diow1wbink] { border-bottom: none; }

    .sl-vs[b-diow1wbink]          { grid-template-columns: 1fr; gap: 32px; }
    .sl-vs-divider[b-diow1wbink]  { width: 100%; height: 1px; }

    .sl-compliance[b-diow1wbink]  { grid-template-columns: 1fr 1fr; }

    .sl-cta-title[b-diow1wbink]   { font-size: 30px; }
}

@media (max-width: 720px) {
    .sl-container[b-diow1wbink]       { padding: 0 20px; }
    .sl-hero[b-diow1wbink]            { padding: 72px 0 56px; }
    .sl-hero-h1[b-diow1wbink]         { font-size: 34px; letter-spacing: -1px; }
    .sl-hero-lede[b-diow1wbink]       { font-size: 15px; }
    .sl-hero-meta[b-diow1wbink]       { gap: 28px; }
    .sl-section[b-diow1wbink]         { padding: 56px 0; }
    .sl-h2[b-diow1wbink]              { font-size: 24px; letter-spacing: -0.5px; }
    .sl-section-head[b-diow1wbink]    { margin-bottom: 36px; }

    .sl-threats[b-diow1wbink]         { grid-template-columns: 1fr; }
    .sl-threat[b-diow1wbink]          { border-right: none !important; padding: 24px 0 !important; }

    .sl-arch-row[b-diow1wbink]        { grid-template-columns: 1fr; gap: 4px; }

    .sl-compliance[b-diow1wbink]      { grid-template-columns: 1fr; }

    .sl-cta[b-diow1wbink]             { padding: 64px 0; }
    .sl-cta-title[b-diow1wbink]       { font-size: 26px; }
}
/* /Features/Home/Pages/Terms.razor.rz.scp.css */
/* Legal page — Privacy */

.lp-root[b-6ivjz9yimo] {
    min-height: 70vh;
    padding: 4rem 1.5rem 6rem;
}

.lp-inner[b-6ivjz9yimo] {
    max-width: 820px;
    margin: 0 auto;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 3rem 3rem 3.5rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

@media (max-width: 720px) {
    .lp-root[b-6ivjz9yimo] { padding: 2rem 0.75rem 4rem; }
    .lp-inner[b-6ivjz9yimo] { padding: 1.75rem 1.25rem 2.25rem; border-radius: 8px; }
}

/* Header */
.lp-header[b-6ivjz9yimo] {
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 1.5rem;
    margin-bottom: 2rem;
}

.lp-eyebrow[b-6ivjz9yimo] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #6b7280;
    margin-bottom: 0.5rem;
}

.lp-title[b-6ivjz9yimo] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 800;
    font-size: 2.25rem;
    letter-spacing: -0.02em;
    color: #18181b;
    margin: 0 0 0.75rem;
}

.lp-meta[b-6ivjz9yimo] {
    color: #6b7280;
    font-size: 0.88rem;
    margin: 0;
}

.lp-meta strong[b-6ivjz9yimo] { color: #18181b; font-weight: 600; }

.lp-dot[b-6ivjz9yimo] { margin: 0 0.5rem; color: #d1d5db; }

/* Body */
.lp-body[b-6ivjz9yimo] {
    color: #27272a;
    font-size: 0.95rem;
    line-height: 1.7;
}

.lp-intro[b-6ivjz9yimo] {
    color: #3f3f46;
    margin: 0 0 1rem;
}

.lp-section[b-6ivjz9yimo] {
    margin-top: 2.5rem;
}

.lp-h2[b-6ivjz9yimo] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    letter-spacing: -0.01em;
    color: #18181b;
    margin: 0 0 1rem;
}

.lp-h3[b-6ivjz9yimo] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 600;
    font-size: 1rem;
    color: #27272a;
    margin: 1.5rem 0 0.5rem;
}

.lp-section p[b-6ivjz9yimo] { margin: 0 0 1rem; }

.lp-list[b-6ivjz9yimo] {
    margin: 0 0 1rem;
    padding-left: 1.25rem;
}

.lp-list li[b-6ivjz9yimo] {
    margin-bottom: 0.4rem;
}

.lp-list--ordered[b-6ivjz9yimo] {
    list-style: decimal;
}

.lp-link[b-6ivjz9yimo] {
    color: #2563eb;
    text-decoration: none;
    font-weight: 500;
}

.lp-link:hover[b-6ivjz9yimo] {
    text-decoration: underline;
}

.lp-section code[b-6ivjz9yimo] {
    background: #f4f4f5;
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    font-size: 0.85em;
    color: #18181b;
    border: 1px solid #e5e7eb;
}

/* Contact card */
.lp-contact-card[b-6ivjz9yimo] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 1.25rem 1.5rem;
    display: grid;
    gap: 0.6rem;
}

.lp-contact-row[b-6ivjz9yimo] {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 1rem;
    font-size: 0.9rem;
}

@media (max-width: 600px) {
    .lp-contact-row[b-6ivjz9yimo] { grid-template-columns: 1fr; gap: 0.15rem; }
}

.lp-contact-label[b-6ivjz9yimo] {
    color: #6b7280;
    font-weight: 600;
}

.lp-placeholder[b-6ivjz9yimo] {
    color: #a1a1aa;
    font-style: italic;
    font-size: 0.85em;
}

/* Divider before country notes */
.lp-divider[b-6ivjz9yimo] {
    border: none;
    border-top: 1px solid #e5e7eb;
    margin: 3rem 0 0;
}

/* Country notes */
.lp-notes-intro[b-6ivjz9yimo] {
    color: #52525b;
    font-size: 0.9rem;
    margin-bottom: 1.5rem;
}

.lp-note[b-6ivjz9yimo] {
    background: #f9fafb;
    border-left: 3px solid #d4d4d8;
    padding: 1rem 1.25rem;
    border-radius: 4px;
    margin-bottom: 1rem;
    font-size: 0.88rem;
}

.lp-note p[b-6ivjz9yimo] { margin: 0 0 0.5rem; }
.lp-note p:last-child[b-6ivjz9yimo] { margin-bottom: 0; }
.lp-note .lp-list[b-6ivjz9yimo] { font-size: 0.88rem; margin-bottom: 0.5rem; }

.lp-note-title[b-6ivjz9yimo] {
    font-family: Inter, 'Noto Sans KR', 'Noto Sans JP', system-ui, sans-serif;
    font-weight: 700;
    font-size: 0.95rem;
    color: #18181b;
    margin: 0 0 0.5rem;
}
/* /Features/Home/Pages/Whitepaper.razor.rz.scp.css */
/* Whitepaper styles moved to /wwwroot/css/whitepaper.css so they apply
   across all whitepaper sub-pages (Blazor CSS isolation would otherwise
   scope them to this single .razor file). */
/* /Features/Identity/Applications/Pages/ApplicationDetail.razor.rz.scp.css */
/* ApplicationDetail — page-specific only.
   Common classes are in ah-components.css */

/* ── App header ── */
.app-icon-lg[b-hkeaap0nsr] {
    width:         48px;
    height:        48px;
    border-radius: var(--ah-radius-lg);
    display:       flex;
    align-items:   center;
    justify-content: center;
    font-size:     1.3rem;
    font-weight:   800;
    color:         #ffffff;
    flex-shrink:   0;
}

.app-type-badge-lg[b-hkeaap0nsr] {
    font-size:     0.68rem;
    font-weight:   700;
    padding:       0.2rem 0.55rem;
    border-radius: var(--ah-radius-sm);
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}

.app-env-badge[b-hkeaap0nsr] { font-size: 0.62rem; font-weight: 700; padding: 0.15rem 0.45rem; border-radius: var(--ah-radius-sm); }
.env-prod[b-hkeaap0nsr]    { background: #f0fdf4; color: #166534; }
.env-staging[b-hkeaap0nsr] { background: #fff7ed; color: #9a3412; }
.env-testing[b-hkeaap0nsr] { background: #f0f9ff; color: #075985; }
.env-dev[b-hkeaap0nsr]     { background: #f5f3ff; color: #5b21b6; }

/* ── Checklist ── */
.checklist[b-hkeaap0nsr] { display: flex; flex-direction: column; gap: 0.75rem; }

.checklist-item[b-hkeaap0nsr] {
    display:       flex;
    align-items:   center;
    gap:           0.85rem;
    padding:       0.85rem 1rem;
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    transition:    border-color 0.15s;
}
.checklist-item.done[b-hkeaap0nsr] { border-color: var(--ah-success-border); background: var(--ah-success-bg); }

.checklist-icon[b-hkeaap0nsr] {
    width:           28px;
    height:          28px;
    border-radius:   50%;
    background:      var(--ah-bg-surface);
    color:           var(--ah-text-muted);
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       0.75rem;
    font-weight:     700;
    flex-shrink:     0;
}
.checklist-item.done .checklist-icon[b-hkeaap0nsr] { background: var(--ah-success); color: #ffffff; }

.checklist-title[b-hkeaap0nsr] { font-size: 0.82rem; font-weight: 700; color: var(--ah-text); }
.checklist-desc[b-hkeaap0nsr]  { font-size: 0.72rem; color: var(--ah-text-muted); }

/* ── Key display ── */
.key-display-row[b-hkeaap0nsr] {
    display:     flex;
    align-items: center;
    gap:         0.75rem;
    padding:     0.75rem 1rem;
    background:  var(--ah-bg-subtle);
    border:      1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    margin-bottom: 0.5rem;
}
.key-display-label[b-hkeaap0nsr] {
    font-size:      0.68rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    min-width:      90px;
    flex-shrink:    0;
}
.key-display-value[b-hkeaap0nsr] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:   0.82rem;
    font-weight: 600;
    color:       var(--ah-text);
    flex:        1;
    word-break:  break-all;
}

/* ── Code snippet ── */
.snippet-tabs[b-hkeaap0nsr] {
    display:       flex;
    border-bottom: 1px solid #1e293b;
    background:    #0f172a;
}
.snippet-tab[b-hkeaap0nsr] {
    padding:       0.5rem 1rem;
    font-size:     0.72rem;
    font-weight:   600;
    color:         #475569;
    cursor:        pointer;
    border:        none;
    background:    none;
    border-bottom: 2px solid transparent;
    transition:    all 0.15s;
}
.snippet-tab:hover[b-hkeaap0nsr]  { color: #94a3b8; }
.snippet-tab.active[b-hkeaap0nsr] { color: #e2e8f0; border-bottom-color: var(--ah-link); }

.snippet-code[b-hkeaap0nsr] {
    background:    #0f172a;
    border-radius: 0 0 var(--ah-radius-lg) var(--ah-radius-lg);
    padding:       1.25rem 1.5rem;
    overflow-x:    auto;
    position:      relative;
}
.snippet-code pre[b-hkeaap0nsr] {
    margin:      0;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:   0.75rem;
    line-height: 1.7;
    color:       #94a3b8;
    white-space: pre;
}
.btn-copy[b-hkeaap0nsr] {
    position:      absolute;
    top:           0.75rem;
    right:         0.75rem;
    font-size:     0.65rem;
    font-weight:   700;
    color:         #475569;
    background:    none;
    border:        1px solid #334155;
    padding:       0.2rem 0.55rem;
    border-radius: var(--ah-radius-sm);
    cursor:        pointer;
    transition:    all 0.12s;
}
.btn-copy:hover[b-hkeaap0nsr] { color: #e2e8f0; border-color: #475569; }

/* ── Social provider ── */
.provider-list[b-hkeaap0nsr] { display: flex; flex-direction: column; gap: 0; }

.provider-row[b-hkeaap0nsr] {
    display:     flex;
    align-items: center;
    gap:         0.85rem;
    padding:     0.85rem 0;
    border-bottom: 1px solid var(--ah-border-soft);
}
.provider-row:last-child[b-hkeaap0nsr] { border-bottom: none; }

.provider-icon[b-hkeaap0nsr] {
    width:           32px;
    height:          32px;
    border-radius:   var(--ah-radius-md);
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       0.75rem;
    font-weight:     800;
    color:           #ffffff;
    flex-shrink:     0;
}
.provider-icon.google[b-hkeaap0nsr] { background: #4285F4; }
.provider-icon.line[b-hkeaap0nsr]   { background: #06C755; }

.provider-name[b-hkeaap0nsr] { font-size: 0.82rem; font-weight: 600; color: var(--ah-text); }
.provider-desc[b-hkeaap0nsr] { font-size: 0.7rem; color: var(--ah-text-muted); }

/* ── Users table ── */
.table-container[b-hkeaap0nsr] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg);
    box-shadow:    var(--ah-shadow-sm);
    overflow:      hidden;
}
.table-header[b-hkeaap0nsr] {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         1rem 1.5rem;
    border-bottom:   1px solid var(--ah-border-soft);
}
.table-title[b-hkeaap0nsr] { font-size: 0.85rem; font-weight: 700; color: var(--ah-text); }

.filter-select[b-hkeaap0nsr], .search-input[b-hkeaap0nsr] {
    font-size:     0.82rem;
    padding:       0.45rem 0.75rem;
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius);
    outline:       none;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg);
}
.filter-select:focus[b-hkeaap0nsr], .search-input:focus[b-hkeaap0nsr] {
    border-color: var(--ah-focus-color);
    box-shadow:   var(--ah-focus-ring);
}
.search-input[b-hkeaap0nsr] { width: 200px; }
.search-input[b-hkeaap0nsr]::placeholder { color: var(--ah-text-placeholder); }

.role-table[b-hkeaap0nsr] { width: 100%; border-collapse: separate; border-spacing: 0; }
.role-table th[b-hkeaap0nsr] {
    font-size:      0.7rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color:          var(--ah-text-muted);
    background:     var(--ah-bg);
    border-bottom:  1px solid var(--ah-border-soft);
    padding:        0.7rem 1.25rem;
    text-align:     left;
    white-space:    nowrap;
}
.role-table td[b-hkeaap0nsr] {
    padding:        0.8rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.85rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}
.role-table tbody tr[b-hkeaap0nsr] { transition: background 0.1s; }
.role-table tbody tr:hover[b-hkeaap0nsr] { background: var(--ah-bg-subtle); }
.role-table tbody tr:last-child td[b-hkeaap0nsr] { border-bottom: none; }

.user-avatar[b-hkeaap0nsr] {
    width:           28px;
    height:          28px;
    border-radius:   50%;
    background:      var(--ah-bg-surface);
    color:           var(--ah-text-sub);
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-size:       0.72rem;
    font-weight:     700;
    flex-shrink:     0;
}

.provider-badge[b-hkeaap0nsr] { font-size: 0.62rem; font-weight: 700; padding: 0.12rem 0.45rem; border-radius: var(--ah-radius-sm); }
.provider-badge.google[b-hkeaap0nsr] { background: #eff6ff; color: #1d4ed8; }
.provider-badge.line[b-hkeaap0nsr]   { background: var(--ah-success-bg); color: #166534; }

.status-dot[b-hkeaap0nsr] { width: 6px; height: 6px; border-radius: 50%; display: inline-block; margin-right: 0.4rem; }
.status-dot.active[b-hkeaap0nsr]   { background: var(--ah-success); }
.status-dot.inactive[b-hkeaap0nsr] { background: var(--ah-text-muted); }
.status-text[b-hkeaap0nsr] { font-size: 0.8rem; font-weight: 600; color: var(--ah-text-sub); }

.date-mono[b-hkeaap0nsr]   { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text-muted); }

/* ── Row action buttons ─── */
.btn-row-action[b-hkeaap0nsr] {
    font-size:     1rem;
    color:         var(--ah-text-muted);
    background:    none;
    border:        1px solid transparent;
    border-radius: var(--ah-radius-sm);
    cursor:        pointer;
    padding:       0.35rem 0.45rem;
    transition:    all 0.15s;
    line-height:   1;
}
.btn-row-action:hover[b-hkeaap0nsr] {
    background: var(--ah-danger);
    color:      #ffffff;
    border-color: var(--ah-danger);
}
.btn-row-action.btn-suspend:hover[b-hkeaap0nsr] {
    background: var(--ah-warning, #f59e0b);
    border-color: var(--ah-warning, #f59e0b);
    color: #ffffff;
}
.btn-row-action.btn-activate:hover[b-hkeaap0nsr] {
    background: var(--ah-success);
    border-color: var(--ah-success);
    color: #ffffff;
}

/* ── Confirm Modal ─── */
.confirm-overlay[b-hkeaap0nsr] {
    position:   fixed;
    inset:      0;
    background: rgba(0,0,0,0.5);
    display:    flex;
    align-items: center;
    justify-content: center;
    z-index:    9999;
}
.confirm-box[b-hkeaap0nsr] {
    background:    var(--ah-bg, #1e1e2e);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-lg, 12px);
    padding:       1.5rem 2rem;
    min-width:     360px;
    max-width:     420px;
    text-align:    center;
    box-shadow:    0 20px 60px rgba(0,0,0,0.5);
}
.confirm-box h3[b-hkeaap0nsr] {
    font-size:   1rem;
    font-weight: 700;
    color:       var(--ah-text);
    margin:      0 0 0.5rem;
}
.confirm-box p[b-hkeaap0nsr] {
    font-size: 0.82rem;
    color:     var(--ah-text-muted);
    margin:    0 0 1.25rem;
}
.confirm-actions[b-hkeaap0nsr] {
    display: flex;
    gap:     0.75rem;
    justify-content: center;
}
.confirm-actions .btn-cancel[b-hkeaap0nsr] {
    padding:       0.5rem 1.25rem;
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius);
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    font-size:     0.82rem;
    font-weight:   600;
    cursor:        pointer;
}
.confirm-actions .btn-danger[b-hkeaap0nsr] {
    padding:       0.5rem 1.25rem;
    border:        none;
    border-radius: var(--ah-radius);
    background:    var(--ah-danger);
    color:         #ffffff;
    font-size:     0.82rem;
    font-weight:   600;
    cursor:        pointer;
}

.pagination-bar[b-hkeaap0nsr] {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         0.75rem 1.5rem;
    border-top:      1px solid var(--ah-border-soft);
}
.pagination-info[b-hkeaap0nsr] { font-size: 0.72rem; color: var(--ah-text-muted); font-weight: 600; }

/* ── Coming soon ── */
.coming-soon-badge[b-hkeaap0nsr] {
    font-size:     0.55rem;
    font-weight:   700;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-muted);
    border:        1px solid var(--ah-border);
    padding:       0.1rem 0.35rem;
    border-radius: var(--ah-radius-sm);
}

/* ── Repository tab (2026-07-28) ── */
.repo-notice[b-hkeaap0nsr] {
    display: flex; align-items: flex-start; gap: 0.4rem;
    font-size: 0.78rem; color: #92400e; background: #fffbeb;
    border: 1px solid #fde68a; border-radius: 6px; padding: 0.7rem 0.9rem; margin-top: 0.75rem;
}

.repo-linked[b-hkeaap0nsr] {
    display: flex; align-items: center; gap: 0.9rem; margin-top: 0.9rem;
    border: 1px solid var(--ah-border); border-radius: 8px; padding: 0.9rem 1rem;
    background: var(--ah-bg);
}
.repo-linked-icon[b-hkeaap0nsr] { font-size: 1.3rem; color: var(--ah-text); flex-shrink: 0; }
.repo-linked-body[b-hkeaap0nsr] { flex: 1; min-width: 0; }
.repo-linked-name[b-hkeaap0nsr] {
    display: flex; align-items: center; gap: 0.45rem;
    font-size: 0.85rem; font-weight: 700; color: var(--ah-text);
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
}
.repo-linked-meta[b-hkeaap0nsr] { font-size: 0.72rem; color: var(--ah-text-muted); margin-top: 0.2rem; }

.repo-chip[b-hkeaap0nsr] {
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.04em;
    color: var(--ah-text-muted); border: 1px solid var(--ah-border);
    border-radius: 4px; padding: 0.05rem 0.35rem;
}

.btn-repo-disconnect[b-hkeaap0nsr] {
    flex-shrink: 0; font-size: 0.75rem; font-weight: 600; font-family: inherit;
    color: var(--ah-danger); background: none; border: 1px solid var(--ah-border);
    padding: 0.4rem 0.9rem; border-radius: 6px; cursor: pointer; transition: border-color 0.15s;
}
.btn-repo-disconnect:hover[b-hkeaap0nsr] { border-color: var(--ah-danger); }
.btn-repo-disconnect:disabled[b-hkeaap0nsr] { opacity: 0.5; cursor: default; }

.repo-pick-list[b-hkeaap0nsr] { display: flex; flex-direction: column; gap: 0.4rem; margin-top: 0.75rem; }
.repo-pick[b-hkeaap0nsr] {
    display: flex; align-items: center; gap: 0.5rem; width: 100%; text-align: left;
    font-family: inherit; cursor: pointer; transition: border-color 0.15s, background 0.15s;
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 6px; padding: 0.6rem 0.8rem;
}
.repo-pick:hover[b-hkeaap0nsr] { border-color: var(--ah-text-muted); }
.repo-pick.selected[b-hkeaap0nsr] { border-color: var(--ah-link); background: var(--ah-bg-subtle); }
.repo-pick-name[b-hkeaap0nsr] {
    font-size: 0.8rem; font-weight: 600; color: var(--ah-text);
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.repo-pick-branch[b-hkeaap0nsr] { margin-left: auto; font-size: 0.7rem; color: var(--ah-text-muted); }

.repo-empty[b-hkeaap0nsr] { text-align: center; padding: 2.5rem 1rem 2rem; }
.repo-empty-title[b-hkeaap0nsr] { font-size: 0.88rem; font-weight: 700; color: var(--ah-text); margin-bottom: 0.4rem; }
.repo-empty-body[b-hkeaap0nsr] {
    font-size: 0.78rem; color: var(--ah-text-muted); line-height: 1.65;
    max-width: 28rem; margin: 0 auto 1.2rem;
}

.repo-error[b-hkeaap0nsr] {
    font-size: 0.75rem; color: var(--ah-danger);
    margin-top: 0.75rem; word-break: break-word;
}

.repo-connect-row[b-hkeaap0nsr] { display: flex; gap: 0.5rem; align-items: stretch; }
.repo-connect-row .field-input[b-hkeaap0nsr] { flex: 1; min-width: 0; }
.repo-connect-row .btn-primary[b-hkeaap0nsr] { flex-shrink: 0; white-space: nowrap; }
.repo-optional[b-hkeaap0nsr] {
    font-size: 0.66rem; font-weight: 500; color: var(--ah-text-muted);
    margin-left: 0.35rem; letter-spacing: 0;
}
/* /Features/Identity/Devices/Pages/DeviceIdentity.razor.rz.scp.css */
/* DeviceIdentity.razor.css — Seal Registry 디자인 컨셉 차용 (scoped). 아이콘 없음. */

/* ── Buttons ── */
.di-btn-primary[b-3harga6tdh] {
    background: var(--ah-text);
    color: var(--ah-bg);
    border: 1px solid var(--ah-text);
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.5rem 1.1rem;
    border-radius: 6px;
    cursor: pointer;
    transition: opacity 0.15s;
    white-space: nowrap;
}
.di-btn-primary:hover[b-3harga6tdh]    { opacity: 0.85; }
.di-btn-primary:disabled[b-3harga6tdh] { opacity: 0.5; cursor: not-allowed; }

.di-btn-secondary[b-3harga6tdh] {
    background: var(--ah-bg);
    color: var(--ah-text-sub);
    border: 1px solid var(--ah-border);
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.5rem 1.1rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s;
}
.di-btn-secondary:hover[b-3harga6tdh] { background: var(--ah-bg-subtle); }

.di-btn-danger[b-3harga6tdh] {
    background: var(--ah-danger-bg);
    color: var(--ah-danger);
    border: 1px solid var(--ah-danger-border);
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.55rem 1rem;
    border-radius: 6px;
    cursor: pointer;
    transition: opacity 0.15s;
}
.di-btn-danger:hover[b-3harga6tdh] { opacity: 0.85; }

/* ── Filter chips ── */
.di-filters[b-3harga6tdh] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 1.25rem; }

/* [2026-08-08] Register CTA — 필터 칩과 같은 줄, 맨 오른쪽으로 밀기(래퍼는 스코프 O → margin-left:auto 직접 적용). */
.di-filters-cta[b-3harga6tdh] { margin-left: auto; }
/* 검정 버튼 스타일은 EntitledButton 내부 <button> 까지 닿아야 함(자식 컴포넌트라 스코프 CSS 미도달) → ::deep. */
.di-filters-cta[b-3harga6tdh]  .di-cta {
    background: var(--ah-text);
    color: var(--ah-bg);
    border: 1px solid var(--ah-text);
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.5rem 1.1rem;
    border-radius: 6px;
    cursor: pointer;
    transition: opacity 0.15s;
    white-space: nowrap;
}
.di-filters-cta[b-3harga6tdh]  .di-cta:hover    { opacity: 0.85; }
.di-filters-cta[b-3harga6tdh]  .di-cta:disabled { opacity: 0.5; cursor: not-allowed; }
.di-chip[b-3harga6tdh] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--ah-text-sub);
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: 999px;
    padding: 0.4rem 0.9rem;
    cursor: pointer;
    transition: all 0.15s;
}
.di-chip:hover[b-3harga6tdh]  { border-color: var(--ah-text-muted); }
/* [2026-07-10 Sonny] 선택 탭 = 검정 채움(흰 글씨) — Request & Approval .ra-filter.on 과 통일 */
.di-chip.active[b-3harga6tdh] { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); font-weight: 700; }
.di-chip-n[b-3harga6tdh] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.7rem; color: var(--ah-text-muted); }
.di-chip.active .di-chip-n[b-3harga6tdh] { color: var(--ah-bg); }

/* ── Panel + table ── */
.di-panel[b-3harga6tdh] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: 12px;
    /* [Phase 3] overflow:hidden 이 per-row ⋮ 드롭다운을 잘랐음 → visible 로. 둥근 모서리는 table 자체가 안쪽이라 유지. */
    overflow: visible;
}
.di-table[b-3harga6tdh] { width: 100%; border-collapse: separate; border-spacing: 0; margin-bottom: 0; }
.di-table th[b-3harga6tdh] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--ah-text-muted);
    background: var(--ah-bg);
    border-bottom: 1px solid var(--ah-border);
    padding: 0.9rem 1.25rem;
    text-align: left;
    white-space: nowrap;
}
.di-table td[b-3harga6tdh] {
    padding: 0.9rem 1.25rem;
    border-bottom: 1px solid var(--ah-bg-subtle);
    font-size: 0.85rem;
    color: var(--ah-text-sub);
    vertical-align: middle;
    white-space: nowrap;
}
.di-table tbody tr:last-child td[b-3harga6tdh] { border-bottom: none; }
.di-table tbody tr.di-row[b-3harga6tdh] { cursor: pointer; transition: background 0.12s; }
.di-table tbody tr.di-row:hover[b-3harga6tdh] { background: var(--ah-bg-subtle); }

.di-name[b-3harga6tdh]     { font-weight: 700; color: var(--ah-text); font-size: 0.82rem; }
.di-sub[b-3harga6tdh]      { font-size: 0.68rem; color: var(--ah-text-muted); margin-top: 0.1rem; }
.di-mono[b-3harga6tdh]     { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text); }
.di-assignee[b-3harga6tdh] { font-size: 0.8rem; font-weight: 600; color: var(--ah-text); }

/* ── Badges ── */
.di-badge[b-3harga6tdh] {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.2rem 0.5rem;
    border-radius: 4px;
    background: var(--ah-bg-surface);
    color: var(--ah-text-sub);
    border: 1px solid var(--ah-border);
}
.di-badge.ok[b-3harga6tdh]   { background: rgba(34,197,94,0.10);  color: #16a34a; border-color: rgba(34,197,94,0.25); }
.di-badge.warn[b-3harga6tdh] { background: rgba(245,158,11,0.12); color: #b45309; border-color: rgba(245,158,11,0.30); }

.status-badge[b-3harga6tdh]   { font-size: 0.65rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; }
.status-active[b-3harga6tdh]  { background: var(--ah-success-bg); color: var(--ah-success); border: 1px solid var(--ah-success-border); }
.status-pending[b-3harga6tdh] { background: var(--ah-warning-bg); color: var(--ah-warning); border: 1px solid var(--ah-warning-border); }
.status-blocked[b-3harga6tdh] { background: var(--ah-danger-bg);  color: var(--ah-danger);  border: 1px solid var(--ah-danger-border); }
.status-revoked[b-3harga6tdh] { background: var(--ah-bg-surface); color: var(--ah-text-muted); border: 1px solid var(--ah-border); }

.di-count[b-3harga6tdh] { font-size: 0.7rem; color: var(--ah-text-muted); padding: 0.75rem 1.25rem; text-align: right; border-top: 1px solid var(--ah-bg-subtle); }
.di-count strong[b-3harga6tdh] { color: var(--ah-text-sub); }

/* ── Register modal fields (input/select 동일 높이) ── */
.di-field[b-3harga6tdh] {
    width: 100%;
    font-size: 0.85rem;
    height: 42px;
    padding: 0.5rem 0.85rem;
    border: 1px solid var(--ah-border);
    border-radius: 8px;
    background: var(--ah-bg);
    color: var(--ah-text);
    box-sizing: border-box;
}
.di-field:focus[b-3harga6tdh] { outline: none; border-color: var(--ah-text); }

/* ── Detail drawer ── */
.di-drawer-overlay[b-3harga6tdh] {
    position: fixed;
    inset: 0;
    background: rgba(15,23,42,0.35);
    z-index: 1000;
    display: flex;
    justify-content: flex-end;
}
.di-drawer[b-3harga6tdh] {
    width: 440px;
    max-width: 92vw;
    height: 100%;
    background: var(--ah-bg);
    box-shadow: -8px 0 32px rgba(0,0,0,0.18);
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}
.di-drawer-head[b-3harga6tdh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid var(--ah-border);
}
.di-x[b-3harga6tdh] { background: none; border: none; font-size: 1.5rem; line-height: 1; color: var(--ah-text-muted); cursor: pointer; }
.di-x:hover[b-3harga6tdh] { color: var(--ah-text); }

.di-drawer-body[b-3harga6tdh] { padding: 0.5rem 1.5rem 1rem; flex: 1; }
.di-field-row[b-3harga6tdh] { padding: 0.85rem 0; border-bottom: 1px solid var(--ah-bg-subtle); }
.di-field-row:last-child[b-3harga6tdh] { border-bottom: none; }
.di-field-label[b-3harga6tdh] { font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ah-text-muted); margin-bottom: 0.35rem; }
.di-field-val[b-3harga6tdh] { font-size: 0.85rem; color: var(--ah-text); }

.di-drawer-actions[b-3harga6tdh] {
    padding: 1rem 1.5rem;
    border-top: 1px solid var(--ah-border);
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.di-textarea[b-3harga6tdh] {
    width: 100%;
    min-height: 72px;
    font-size: 0.82rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid var(--ah-border);
    border-radius: 8px;
    background: var(--ah-bg);
    color: var(--ah-text);
    resize: vertical;
    box-sizing: border-box;
}
.di-textarea:focus[b-3harga6tdh] { outline: none; border-color: var(--ah-text); }

/* ── Allowed-countries chips ── */
.di-chips[b-3harga6tdh] { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-bottom: 0.5rem; }
.di-country-chip[b-3harga6tdh] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--ah-text);
    background: var(--ah-bg-surface);
    border: 1px solid var(--ah-border);
    border-radius: 4px;
    padding: 0.15rem 0.2rem 0.15rem 0.45rem;
}
.di-country-chip button[b-3harga6tdh] {
    background: none;
    border: none;
    color: var(--ah-text-muted);
    cursor: pointer;
    font-size: 0.9rem;
    line-height: 1;
    padding: 0 0.2rem;
}
.di-country-chip button:hover[b-3harga6tdh] { color: var(--ah-danger); }

.di-country-add[b-3harga6tdh] { display: flex; gap: 0.4rem; align-items: center; }
.di-country-add .di-field[b-3harga6tdh] { flex: 1; }

.di-add-link[b-3harga6tdh] {
    background: none;
    border: none;
    color: var(--ah-text-sub);
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    padding: 0;
}
.di-add-link:hover[b-3harga6tdh] { color: var(--ah-text); }
/* /Features/Identity/EndUsers/Pages/EndUserDirectory.razor.rz.scp.css */
/* EndUserDirectory.razor.css — CSS variable 기반 (통합본) */

/* ════════════════════════════════
   Buttons
════════════════════════════════ */
.eu-btn-primary[b-hud6lzeig8] {
    font-size: 0.8rem; font-weight: 700;
    color: var(--ah-bg); background: var(--ah-text);
    border: 1px solid var(--ah-text);
    padding: 0.5rem 1.25rem; border-radius: 6px;
    cursor: pointer; display: inline-flex; align-items: center; gap: 0.3rem;
    transition: opacity 0.15s; text-decoration: none;
}
.eu-btn-primary:hover[b-hud6lzeig8] { opacity: 0.85; }

.eu-btn-secondary[b-hud6lzeig8] {
    font-size: 0.8rem; font-weight: 600;
    color: var(--ah-text-sub); background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    padding: 0.5rem 1.25rem; border-radius: 6px;
    cursor: pointer; display: inline-flex; align-items: center; gap: 0.3rem;
    transition: all 0.15s;
}
.eu-btn-secondary:hover[b-hud6lzeig8] { background: var(--ah-bg-subtle); }

/* ════════════════════════════════
   Info box
════════════════════════════════ */
.eu-info-box[b-hud6lzeig8] {
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 0.85rem 1rem; margin-bottom: 1.25rem;
    display: flex; align-items: flex-start; gap: 0.6rem;
}

/* ════════════════════════════════
   Stat cards
════════════════════════════════ */
.eu-stat-card[b-hud6lzeig8] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 12px; box-shadow: var(--ah-shadow-sm);
    padding: 1.25rem 1.5rem;
}
.eu-stat-label[b-hud6lzeig8] {
    font-size: 0.68rem; font-weight: 700; color: var(--ah-text-muted);
    text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.4rem;
}
.eu-stat-value[b-hud6lzeig8] { font-size: 1.8rem; font-weight: 800; color: var(--ah-text); line-height: 1; }

/* ════════════════════════════════
   Table container
════════════════════════════════ */
.eu-table-container[b-hud6lzeig8] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 12px; box-shadow: var(--ah-shadow-sm); overflow: hidden;
}
.eu-table-header[b-hud6lzeig8] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.5rem; border-bottom: 1px solid var(--ah-border);
}
.eu-table-title[b-hud6lzeig8] { font-size: 0.85rem; font-weight: 700; color: var(--ah-text); }

.eu-select[b-hud6lzeig8] {
    font-size: 0.82rem; padding: 0.45rem 0.75rem;
    border: 1px solid var(--ah-border); border-radius: 6px;
    outline: none; color: var(--ah-text); background: var(--ah-bg);
}
.eu-search[b-hud6lzeig8] {
    font-size: 0.82rem; padding: 0.45rem 0.75rem;
    border: 1px solid var(--ah-border); border-radius: 6px;
    outline: none; width: 200px; color: var(--ah-text); background: var(--ah-bg);
}
.eu-search:focus[b-hud6lzeig8] { border-color: var(--ah-link); box-shadow: 0 0 0 2px rgba(129,140,248,0.2); }

/* ════════════════════════════════
   Table
════════════════════════════════ */
.eu-table[b-hud6lzeig8] { width: 100%; border-collapse: separate; border-spacing: 0; }

.eu-table th[b-hud6lzeig8] {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.03em; color: var(--ah-text-muted); background: var(--ah-bg);
    border-bottom: 1px solid var(--ah-border);
    padding: 0.7rem 1.25rem; text-align: left; white-space: nowrap;
}
.eu-table td[b-hud6lzeig8] {
    padding: 0.8rem 1.25rem;
    border-bottom: 1px solid var(--ah-bg-subtle);
    vertical-align: middle;
}
.eu-table tbody tr[b-hud6lzeig8] { transition: background 0.1s; }
.eu-table tbody tr:hover[b-hud6lzeig8] { background: var(--ah-bg-subtle); }
.eu-table tbody tr:last-child td[b-hud6lzeig8] { border-bottom: none; }

/* ════════════════════════════════
   Row elements
════════════════════════════════ */
.eu-avatar[b-hud6lzeig8] {
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--ah-bg-surface); color: var(--ah-text-sub);
    display: flex; align-items: center; justify-content: center;
    font-size: 0.72rem; font-weight: 700; flex-shrink: 0;
}
.eu-user-name[b-hud6lzeig8]  { font-size: 0.82rem; font-weight: 600; color: var(--ah-text); }
.eu-user-email[b-hud6lzeig8] { font-size: 0.7rem; color: var(--ah-text-muted); }

.eu-provider-badge[b-hud6lzeig8] {
    font-size: 0.62rem; font-weight: 700;
    padding: 0.12rem 0.45rem; border-radius: 4px;
    background: var(--ah-info-bg); color: var(--ah-info);
    border: 1px solid var(--ah-info-border);
}

.eu-mono[b-hud6lzeig8] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text-muted); }

.eu-status-dot[b-hud6lzeig8] {
    width: 6px; height: 6px; border-radius: 50%;
    display: inline-block; margin-right: 0.4rem;
}
.eu-status-dot.active[b-hud6lzeig8]   { background: var(--ah-success); }
.eu-status-dot.pending[b-hud6lzeig8]  { background: #f59e0b; }
.eu-status-dot.inactive[b-hud6lzeig8] { background: var(--ah-text-muted); }
.eu-status-text[b-hud6lzeig8] { font-size: 0.8rem; font-weight: 600; color: var(--ah-text-sub); }

.eu-action-btn[b-hud6lzeig8] {
    font-size: 0.75rem; font-weight: 600;
    padding: 0.35rem 0.85rem; border-radius: 6px;
    cursor: pointer; min-width: 90px; transition: opacity 0.15s;
    border: 1px solid; display: inline-flex;
    align-items: center; justify-content: center; gap: 0.4rem;
}
.eu-action-btn.danger[b-hud6lzeig8]  { color: var(--ah-danger);  background: var(--ah-danger-bg);  border-color: var(--ah-danger-border); }
.eu-action-btn.success[b-hud6lzeig8] { color: var(--ah-success); background: var(--ah-success-bg); border-color: var(--ah-success-border); }
.eu-action-btn:disabled[b-hud6lzeig8] { color: var(--ah-text-muted); background: var(--ah-bg-subtle); border-color: var(--ah-border); cursor: default; }
.eu-action-btn:hover:not(:disabled)[b-hud6lzeig8] { opacity: 0.85; }

/* ════════════════════════════════
   Pagination
════════════════════════════════ */
.eu-pagination[b-hud6lzeig8] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.75rem 1.5rem; border-top: 1px solid var(--ah-border);
}
.eu-pagination-info[b-hud6lzeig8] { font-size: 0.72rem; color: var(--ah-text-muted); font-weight: 600; }
.eu-page-btn[b-hud6lzeig8] {
    font-size: 0.75rem; font-weight: 600; color: var(--ah-text-sub);
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    padding: 0.3rem 0.75rem; border-radius: 5px; cursor: pointer; transition: all 0.15s;
}
.eu-page-btn:hover[b-hud6lzeig8]    { background: var(--ah-bg-subtle); }
.eu-page-btn.active[b-hud6lzeig8]   { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }
.eu-page-btn:disabled[b-hud6lzeig8] { opacity: 0.4; cursor: default; }

/* ════════════════════════════════
   Modal
════════════════════════════════ */
.eu-modal-backdrop[b-hud6lzeig8] {
    position: fixed; inset: 0; background: rgba(15,23,42,0.5);
    z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 1rem;
}
.eu-modal[b-hud6lzeig8] {
    background: var(--ah-bg); border-radius: 12px; padding: 2rem;
    width: 100%; max-width: 440px;
    box-shadow: var(--ah-shadow-lg); border: 1px solid var(--ah-border);
}
.eu-modal-title[b-hud6lzeig8] { font-size: 1rem; font-weight: 700; color: var(--ah-text); }
.eu-modal-desc[b-hud6lzeig8]  { font-size: 0.83rem; color: var(--ah-text-muted); margin-bottom: 1.5rem; line-height: 1.6; }
.eu-modal-actions[b-hud6lzeig8] {
    display: flex; gap: 0.5rem; justify-content: flex-end;
    padding-top: 1rem; border-top: 1px solid var(--ah-border); margin-top: 0.5rem;
}

/* ════════════════════════════════
   Form
════════════════════════════════ */
.eu-field[b-hud6lzeig8] { margin-bottom: 1rem; }
.eu-field-label[b-hud6lzeig8] {
    font-size: 0.7rem; font-weight: 700; color: var(--ah-text-sub);
    text-transform: uppercase; letter-spacing: 0.03em;
    margin-bottom: 0.35rem; display: block;
}
.eu-input[b-hud6lzeig8] {
    width: 100%; font-size: 0.88rem; padding: 0.6rem 0.85rem;
    border: 1px solid var(--ah-border); border-radius: 6px; outline: none;
    color: var(--ah-text); background: var(--ah-bg); box-sizing: border-box;
    transition: border-color 0.15s;
}
.eu-input:focus[b-hud6lzeig8] { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }

/* ════════════════════════════════
   Spinner
════════════════════════════════ */
.eu-spin[b-hud6lzeig8] {
    width: 11px; height: 11px;
    border: 2px solid rgba(128,128,128,0.3);
    border-top-color: currentColor;
    border-radius: 50%;
    animation: eu-spin-b-hud6lzeig8 0.7s linear infinite;
    display: inline-block;
}
@keyframes eu-spin-b-hud6lzeig8 { to { transform: rotate(360deg); } }
/* /Features/Identity/Pages/PermissionStudio.razor.rz.scp.css */
/* PermissionStudio — page-specific only.
   Common classes are in ah-components.css */

/* ── Layout ── */
.studio-layout[b-m8rjnz6m5n] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1.5rem;
    align-items: start;
}
@media (max-width: 960px) { .studio-layout[b-m8rjnz6m5n] { grid-template-columns: 1fr; } }

/* ── Risk selector ── */
.risk-selector[b-m8rjnz6m5n] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.risk-option[b-m8rjnz6m5n] {
    flex: 1; min-width: 100px; border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 0.6rem 0.75rem;
    cursor: pointer; transition: all 0.15s; background: var(--ah-bg);
}
.risk-option:hover[b-m8rjnz6m5n]   { border-color: var(--ah-text-muted); background: var(--ah-bg-subtle); }
.risk-option.selected[b-m8rjnz6m5n] { border-color: var(--ah-text); background: var(--ah-bg-subtle); }

.risk-option-level[b-m8rjnz6m5n]  { font-size: 0.6rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.risk-option-name[b-m8rjnz6m5n]   { font-size: 0.78rem; font-weight: 700; color: var(--ah-text); margin: 0.15rem 0; }
.risk-option-policy[b-m8rjnz6m5n] { font-size: 0.65rem; color: var(--ah-text-muted); font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; }

/* ── Grammar box ── */
.grammar-box[b-m8rjnz6m5n] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-lg); padding: 0; margin-bottom: 1.5rem;
    box-shadow: var(--ah-shadow-sm); overflow: hidden;
}
.grammar-header[b-m8rjnz6m5n] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.85rem 1.5rem; cursor: pointer; transition: background 0.15s;
}
.grammar-header:hover[b-m8rjnz6m5n] { background: var(--ah-bg-subtle); }
.grammar-title[b-m8rjnz6m5n]        { font-size: 0.72rem; font-weight: 700; color: var(--ah-text); margin: 0; }
.grammar-toggle[b-m8rjnz6m5n]       { display: flex; align-items: center; gap: 0.3rem; }
.grammar-toggle-text[b-m8rjnz6m5n]  { font-size: 0.65rem; font-weight: 600; color: var(--ah-text-muted); }
.grammar-chevron[b-m8rjnz6m5n]      { font-size: 0.6rem; color: var(--ah-text-muted); transition: transform 0.3s ease; }
.grammar-chevron.open[b-m8rjnz6m5n] { transform: rotate(180deg); }

.grammar-body[b-m8rjnz6m5n]       { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.35s ease; padding: 0 1.5rem; }
.grammar-body.open[b-m8rjnz6m5n]  { max-height: 500px; padding: 0 1.5rem 1.25rem; }

.grammar-formula[b-m8rjnz6m5n] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.85rem; font-weight: 600;
    color: var(--ah-text); background: var(--ah-bg-subtle); border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius); padding: 0.6rem 1rem; margin-bottom: 0.75rem;
    display: flex; align-items: center; flex-wrap: wrap; gap: 0;
}
.gf-part[b-m8rjnz6m5n]     { padding: 0.1rem 0.35rem; border-radius: 3px; background: var(--ah-bg-surface); color: var(--ah-text-sub); font-size: 0.78rem; }
.gf-dot[b-m8rjnz6m5n]      { color: var(--ah-text-muted); font-weight: 800; padding: 0 0.1rem; }
.gf-colon[b-m8rjnz6m5n]    { color: var(--ah-text-muted); font-weight: 800; padding: 0 0.2rem; }

.grammar-section-label[b-m8rjnz6m5n] {
    font-size: 0.65rem; font-weight: 700; color: var(--ah-text-sub);
    text-transform: uppercase; letter-spacing: 0.05em; margin: 0.75rem 0 0.35rem;
}
.grammar-examples[b-m8rjnz6m5n] { margin-bottom: 0.75rem; }
.ge-row[b-m8rjnz6m5n] {
    display: flex; align-items: center; gap: 0.75rem;
    padding: 0.3rem 0; border-bottom: 1px solid var(--ah-bg-subtle);
}
.ge-row:last-child[b-m8rjnz6m5n] { border-bottom: none; }
.ge-scope[b-m8rjnz6m5n] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.72rem; font-weight: 600;
    color: var(--ah-text); background: var(--ah-bg-subtle);
    padding: 0.15rem 0.5rem; border-radius: var(--ah-radius-sm);
    border: 1px solid var(--ah-border-soft); white-space: nowrap; min-width: 280px;
}
.ge-desc[b-m8rjnz6m5n]  { font-size: 0.7rem; color: var(--ah-text-muted); }
.ge-allow[b-m8rjnz6m5n] {
    font-size: 0.55rem; font-weight: 800; color: var(--ah-text-muted);
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    padding: 0.05rem 0.3rem; border-radius: 3px;
}
.ge-deny[b-m8rjnz6m5n] {
    font-size: 0.55rem; font-weight: 800; color: var(--ah-danger);
    background: var(--ah-danger-bg); border: 1px solid var(--ah-danger-border);
    padding: 0.05rem 0.3rem; border-radius: 3px;
}
.grammar-note[b-m8rjnz6m5n] { font-size: 0.68rem; color: var(--ah-text-muted); line-height: 1.5; }
.grammar-note code[b-m8rjnz6m5n] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; font-weight: 700;
    background: var(--ah-bg-surface); padding: 0.1rem 0.3rem; border-radius: 3px; color: var(--ah-text);
}

/* ── Sidebar ── */
.sidebar-panel[b-m8rjnz6m5n] {
    background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg); box-shadow: var(--ah-shadow-sm); overflow: hidden;
}
.sidebar-section[b-m8rjnz6m5n] { padding: 1rem 1.25rem; border-bottom: 1px solid var(--ah-border-soft); }
.sidebar-section:last-child[b-m8rjnz6m5n] { border-bottom: none; }
.sidebar-title[b-m8rjnz6m5n] { font-size: 0.65rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.6rem; }

.integration-item[b-m8rjnz6m5n] {
    display: flex; align-items: center; gap: 0.5rem;
    padding: 0.4rem 0.5rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: background 0.12s; margin-bottom: 0.15rem;
}
.integration-item:hover[b-m8rjnz6m5n]  { background: var(--ah-bg-subtle); }
.integration-item.active[b-m8rjnz6m5n] { background: var(--ah-bg-surface); }

.integration-icon[b-m8rjnz6m5n] {
    width: 28px; height: 28px; border-radius: var(--ah-radius);
    background: var(--ah-bg-surface); display: flex; align-items: center; justify-content: center;
    font-size: 0.7rem; font-weight: 800; color: var(--ah-text-sub); flex-shrink: 0;
}
.integration-name[b-m8rjnz6m5n]   { font-size: 0.8rem; font-weight: 600; color: var(--ah-text); }
.integration-status[b-m8rjnz6m5n] { font-size: 0.6rem; color: var(--ah-text-muted); }

/* ── Standard variables ── */
.standard-var-row[b-m8rjnz6m5n] { display: flex; align-items: baseline; gap: 0.3rem; padding: 0.3rem 0; }
.sv-key[b-m8rjnz6m5n]     { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.72rem; font-weight: 600; color: var(--ah-text); }
.sv-type[b-m8rjnz6m5n]    { font-size: 0.55rem; color: var(--ah-text-muted); font-weight: 600; }
.sv-example[b-m8rjnz6m5n] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.6rem; color: var(--ah-text-muted);
    background: var(--ah-bg-subtle); padding: 0.05rem 0.25rem; border-radius: 2px; margin-left: auto;
}
.sv-desc[b-m8rjnz6m5n] { font-size: 0.6rem; color: var(--ah-text-muted); padding-bottom: 0.35rem; border-bottom: 1px solid var(--ah-bg-subtle); }

/* ── Main panel ── */
.main-panel[b-m8rjnz6m5n] { display: flex; flex-direction: column; gap: 1.5rem; }

/* ── Scope entry rows ── */
.scope-entry-row[b-m8rjnz6m5n] { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.5rem; }
.scope-entry-row input[b-m8rjnz6m5n] {
    flex: 1; font-size: 0.82rem; padding: 0.5rem 0.7rem;
    border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; box-sizing: border-box;
    background: var(--ah-bg); color: var(--ah-text);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.scope-entry-row input:focus[b-m8rjnz6m5n] { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }
.scope-entry-row input[b-m8rjnz6m5n]::placeholder { color: var(--ah-text-placeholder); }

.btn-row-remove[b-m8rjnz6m5n] { font-size: 0.7rem; color: var(--ah-text-muted); background: none; border: none; cursor: pointer; padding: 0.2rem; transition: color 0.12s; }
.btn-row-remove:hover[b-m8rjnz6m5n] { color: var(--ah-danger); }
.btn-row-add[b-m8rjnz6m5n]    { font-size: 0.72rem; font-weight: 600; color: var(--ah-text-sub); background: none; border: none; cursor: pointer; padding: 0.3rem 0; transition: color 0.12s; }
.btn-row-add:hover[b-m8rjnz6m5n] { color: var(--ah-text); }

/* ── Variable rows ── */
.var-entry-row[b-m8rjnz6m5n] { display: flex; gap: 0.35rem; align-items: center; margin-bottom: 0.5rem; }
.var-entry-row input[b-m8rjnz6m5n] {
    font-size: 0.82rem; padding: 0.5rem 0.7rem;
    border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; box-sizing: border-box;
    background: var(--ah-bg); color: var(--ah-text);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.var-entry-row input:focus[b-m8rjnz6m5n] { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }
.var-entry-row input[b-m8rjnz6m5n]::placeholder { color: var(--ah-text-placeholder); }
.var-key-input[b-m8rjnz6m5n] { flex: 0.35; }
.var-val-input[b-m8rjnz6m5n] { flex: 0.5; }

.var-mode-toggle[b-m8rjnz6m5n] {
    flex-shrink: 0; width: 32px; height: 32px; border-radius: var(--ah-radius);
    border: 1px solid var(--ah-border); font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.72rem; font-weight: 800; cursor: pointer;
    display: flex; align-items: center; justify-content: center; transition: all 0.15s;
}
.var-mode-toggle.allow[b-m8rjnz6m5n] { background: var(--ah-bg-subtle); color: var(--ah-text-sub); border-color: var(--ah-border); }
.var-mode-toggle.allow:hover[b-m8rjnz6m5n] { background: var(--ah-bg-surface); }
.var-mode-toggle.deny[b-m8rjnz6m5n]  { background: var(--ah-danger-bg); color: var(--ah-danger); border-color: var(--ah-danger-border); }
.var-mode-toggle.deny:hover[b-m8rjnz6m5n]  { background: #fee2e2; }

/* Comparison-operator dropdown (mirrors Integrations). */
.var-op-select[b-m8rjnz6m5n] {
    flex-shrink: 0; width: 56px; height: 32px; border-radius: var(--ah-radius);
    border: 1px solid var(--ah-border); font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.78rem; font-weight: 700; cursor: pointer; padding: 0 0.35rem;
    text-align: center; transition: all 0.15s;
}
.var-op-select.allow[b-m8rjnz6m5n] { background: var(--ah-bg-subtle); color: var(--ah-text-sub); border-color: var(--ah-border); }
.var-op-select.deny[b-m8rjnz6m5n]  { background: var(--ah-danger-bg); color: var(--ah-danger); border-color: var(--ah-danger-border); }

/* ── Bulk input ── */
.bulk-textarea[b-m8rjnz6m5n] {
    width: 100%; font-size: 0.82rem; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    padding: 0.75rem 0.85rem; border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; color: var(--ah-text); background: var(--ah-bg);
    resize: vertical; min-height: 120px; line-height: 1.6;
    transition: border-color 0.15s, box-shadow 0.15s; box-sizing: border-box;
}
.bulk-textarea:focus[b-m8rjnz6m5n]       { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }
.bulk-textarea[b-m8rjnz6m5n]::placeholder { color: var(--ah-text-placeholder); }

.btn-parse[b-m8rjnz6m5n] {
    font-size: 0.72rem; font-weight: 700; color: var(--ah-text-sub);
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    padding: 0.35rem 0.9rem; border-radius: var(--ah-radius); cursor: pointer; transition: all 0.15s;
}
.btn-parse:hover[b-m8rjnz6m5n] { border-color: var(--ah-text-muted); background: var(--ah-bg-surface); }

/* ── Preview ── */
.preview-box[b-m8rjnz6m5n] {
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 1rem 1.25rem;
}
.preview-title[b-m8rjnz6m5n] { font-size: 0.65rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.5rem; }
.preview-scope[b-m8rjnz6m5n] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.78rem; font-weight: 600;
    color: var(--ah-text); padding: 0.3rem 0; border-bottom: 1px solid var(--ah-border);
    display: flex; align-items: center; gap: 0.5rem;
}
.preview-scope:last-child[b-m8rjnz6m5n] { border-bottom: none; }
.preview-scope.deny[b-m8rjnz6m5n] { color: var(--ah-danger); }
.preview-deny-badge[b-m8rjnz6m5n] {
    font-size: 0.5rem; font-weight: 800; color: var(--ah-danger);
    background: var(--ah-danger-bg); border: 1px solid var(--ah-danger-border);
    padding: 0.05rem 0.3rem; border-radius: 3px; flex-shrink: 0;
}
.preview-empty[b-m8rjnz6m5n] { font-size: 0.75rem; color: var(--ah-text-muted); font-style: italic; }

/* ── Notice bar override (warning color for PermissionStudio) ── */
.notice-bar[b-m8rjnz6m5n] {
    background: var(--ah-warning-bg);
    border-color: var(--ah-warning-border);
    color: #92400e;
}
.notice-bar a[b-m8rjnz6m5n] { color: #92400e; font-weight: 700; text-decoration: underline; }

/* ── Risk badges ── */
.risk-badge[b-m8rjnz6m5n] { font-size: 0.62rem; font-weight: 700; padding: 0.12rem 0.45rem; border-radius: var(--ah-radius-sm); display: inline-block; }
.risk-0[b-m8rjnz6m5n] { background: var(--ah-success-bg); color: #166534; }
.risk-1[b-m8rjnz6m5n] { background: #f0f9ff; color: #075985; }
.risk-2[b-m8rjnz6m5n] { background: #fff7ed; color: #9a3412; }
.risk-3[b-m8rjnz6m5n] { background: var(--ah-danger-bg); color: var(--ah-danger); }
.risk-4[b-m8rjnz6m5n] { background: #f5f3ff; color: #5b21b6; }

/* ── Trigger status ── */
.trigger-status[b-m8rjnz6m5n] { font-size: 0.68rem; font-weight: 700; padding: 0.12rem 0.45rem; border-radius: var(--ah-radius-sm); display: inline-block; }
.trigger-status.pending[b-m8rjnz6m5n]   { background: #fff7ed; color: #9a3412; }
.trigger-status.approved[b-m8rjnz6m5n]  { background: #f0f9ff; color: #075985; }
.trigger-status.rejected[b-m8rjnz6m5n]  { background: var(--ah-danger-bg); color: var(--ah-danger); }
.trigger-status.executed[b-m8rjnz6m5n]  { background: var(--ah-success-bg); color: #166534; }
.trigger-status.escalated[b-m8rjnz6m5n] { background: var(--ah-danger-bg); color: var(--ah-danger); border: 1px solid var(--ah-danger); }
.trigger-status.failed[b-m8rjnz6m5n]    { background: var(--ah-danger-bg); color: var(--ah-danger); }

/* ── Approval cards ── */
.apr-card[b-m8rjnz6m5n] { border: 1px solid var(--ah-border); border-radius: 10px; padding: 1rem 1.1rem; margin-bottom: 0.65rem; }
.escalated-card[b-m8rjnz6m5n] { border: 2px solid var(--ah-danger); background: var(--ah-danger-bg); }

.btn-approve[b-m8rjnz6m5n] {
    font-size: 0.72rem; font-weight: 700; padding: 0.35rem 0.8rem;
    border-radius: var(--ah-radius-sm); cursor: pointer;
    border: 1px solid var(--ah-success); background: var(--ah-success-bg); color: #166534;
}
.btn-approve:hover[b-m8rjnz6m5n]    { background: #dcfce7; }
.btn-approve:disabled[b-m8rjnz6m5n] { opacity: 0.5; cursor: default; }

.btn-reject[b-m8rjnz6m5n] {
    font-size: 0.72rem; font-weight: 700; padding: 0.35rem 0.8rem;
    border-radius: var(--ah-radius-sm); cursor: pointer;
    border: 1px solid var(--ah-danger-border); background: var(--ah-danger-bg); color: var(--ah-danger);
}
.btn-reject:hover[b-m8rjnz6m5n]    { background: #fee2e2; }
.btn-reject:disabled[b-m8rjnz6m5n] { opacity: 0.5; cursor: default; }
/* /Features/Identity/Pages/RolesDetail.razor.rz.scp.css */
/* RolesDetail — page-specific only.
   Common classes are in ah-components.css */

/* ── Role card header ── */
.role-card[b-ob7tw1lqy2] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg);
    padding:       1.5rem 1.75rem;
    margin:        1rem 0 1.25rem;
    box-shadow:    var(--ah-shadow-sm);
}
/* [2026-08-05] .role-title/.role-desc → 공용 .ah-page-title/.ah-page-subtitle
   (ah-components.css §27). 여기 제목만 1.2rem/800 이라 다른 화면과 어긋났다. */
.role-meta[b-ob7tw1lqy2]  { font-size: 0.7rem; color: var(--ah-text-muted); font-weight: 600; }

/* ── Kebab menu ── */
.kebab-btn[b-ob7tw1lqy2] {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           32px;
    height:          32px;
    border-radius:   var(--ah-radius-md);
    border:          1px solid transparent;
    background:      transparent;
    cursor:          pointer;
    transition:      all 0.12s;
}
.kebab-btn:hover[b-ob7tw1lqy2] { background: var(--ah-bg-surface); border-color: var(--ah-border); }

.kebab-dot[b-ob7tw1lqy2] {
    width:         3px;
    height:        3px;
    background:    var(--ah-text-muted);
    border-radius: 50%;
    margin:        1.2px 0;
}

.kebab-dropdown[b-ob7tw1lqy2] {
    position:      absolute;
    top:           calc(100% + 4px);
    right:         0;
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    box-shadow:    var(--ah-shadow-md);
    min-width:     170px;
    z-index:       100;
    overflow:      hidden;
}
.kd-item[b-ob7tw1lqy2] {
    display:     flex;
    align-items: center;
    width:       100%;
    padding:     0.55rem 0.9rem;
    font-size:   0.78rem;
    font-weight: 600;
    color:       var(--ah-text-sub);
    cursor:      pointer;
    transition:  background 0.12s;
    border:      none;
    background:  none;
    text-align:  left;
}
.kd-icon[b-ob7tw1lqy2]    { width: 18px; font-size: 0.7rem; text-align: center; flex-shrink: 0; margin-right: 0.45rem; }
.kd-item:hover[b-ob7tw1lqy2]  { background: var(--ah-bg-subtle); }
.kd-item.danger[b-ob7tw1lqy2] { color: var(--ah-danger); }
.kd-item.danger:hover[b-ob7tw1lqy2] { background: var(--ah-danger-bg); }
.kd-divider[b-ob7tw1lqy2] { height: 1px; background: var(--ah-border-soft); }

.menu-backdrop[b-ob7tw1lqy2] { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99; }

/* ── Section tabs ── */
.section-tabs[b-ob7tw1lqy2] {
    display:       flex;
    gap:           0;
    border-bottom: 1px solid var(--ah-border);
    margin-bottom: 1.25rem;
}
.section-tab[b-ob7tw1lqy2] {
    padding:       0.65rem 1.2rem;
    font-size:     0.78rem;
    font-weight:   700;
    color:         var(--ah-text-muted);
    border:        none;
    background:    none;
    cursor:        pointer;
    border-bottom: 2px solid transparent;
    transition:    all 0.15s;
}
.section-tab:hover[b-ob7tw1lqy2]  { color: var(--ah-text-sub); }
.section-tab.active[b-ob7tw1lqy2] { color: var(--ah-text); border-bottom-color: var(--ah-text); }

.tab-content-area[b-ob7tw1lqy2] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg);
    padding:       1.25rem 1.5rem;
    box-shadow:    var(--ah-shadow-sm);
}

/* ── Add buttons ── */
.btn-add[b-ob7tw1lqy2] {
    font-size:     0.72rem;
    font-weight:   700;
    color:         var(--ah-accent-text);
    background:    var(--ah-accent);
    border:        1px solid var(--ah-accent);
    padding:       0.35rem 0.9rem;
    border-radius: var(--ah-radius);
    cursor:        pointer;
    transition:    opacity 0.15s;
    white-space:   nowrap;
}
.btn-add:hover[b-ob7tw1lqy2] { opacity: 0.85; }

.btn-add-outline[b-ob7tw1lqy2] {
    font-size:     0.72rem;
    font-weight:   700;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    padding:       0.35rem 0.9rem;
    border-radius: var(--ah-radius);
    cursor:        pointer;
    transition:    all 0.15s;
    white-space:   nowrap;
    text-decoration: none;
}
.btn-add-outline:hover[b-ob7tw1lqy2] { background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); }

/* ── Detail table ── */
.detail-table[b-ob7tw1lqy2] { width: 100%; border-collapse: separate; border-spacing: 0; }
.detail-table th[b-ob7tw1lqy2] {
    font-size:      0.65rem;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color:          var(--ah-text-muted);
    border-bottom:  1px solid var(--ah-border-soft);
    padding:        0.6rem 1rem;
    text-align:     left;
}
.detail-table td[b-ob7tw1lqy2] {
    padding:        0.7rem 1rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.82rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}
.detail-table tbody tr:hover[b-ob7tw1lqy2]          { background: var(--ah-bg-subtle); }
.detail-table tbody tr:last-child td[b-ob7tw1lqy2]  { border-bottom: none; }

/* ── Badges ── */
.perm-text[b-ob7tw1lqy2] {
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:     0.75rem;
    font-weight:   600;
    color:         var(--ah-text);
    background:    var(--ah-bg-subtle);
    padding:       0.15rem 0.5rem;
    border-radius: var(--ah-radius-sm);
    border:        1px solid var(--ah-border-soft);
}

.source-badge[b-ob7tw1lqy2] {
    font-size:      0.6rem;
    font-weight:    700;
    padding:        0.12rem 0.4rem;
    border-radius:  var(--ah-radius-sm);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.source-badge.internal[b-ob7tw1lqy2] { background: var(--ah-success-bg);  color: var(--ah-success); border: 1px solid var(--ah-success-border); }
.source-badge.external[b-ob7tw1lqy2] { background: var(--ah-info-bg);     color: #3b82f6;            border: 1px solid var(--ah-info-border); }

.var-chip[b-ob7tw1lqy2] {
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:     0.65rem;
    font-weight:   600;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg-surface);
    padding:       0.1rem 0.4rem;
    border-radius: var(--ah-radius-sm);
    border:        1px solid var(--ah-border);
}

.sync-pill[b-ob7tw1lqy2] {
    font-size:      0.6rem;
    font-weight:    700;
    padding:        0.12rem 0.45rem;
    border-radius:  var(--ah-radius-sm);
    text-transform: uppercase;
}
.sync-pill.synced[b-ob7tw1lqy2]  { background: var(--ah-success-bg); color: var(--ah-success); border: 1px solid var(--ah-success-border); }
.sync-pill.pending[b-ob7tw1lqy2] { background: var(--ah-warning-bg); color: var(--ah-warning); border: 1px solid var(--ah-warning-border); }
.sync-pill.failed[b-ob7tw1lqy2]  { background: var(--ah-danger-bg);  color: var(--ah-danger);  border: 1px solid var(--ah-danger-border); }

.date-mono[b-ob7tw1lqy2] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text-muted); }

.remove-btn[b-ob7tw1lqy2] {
    display:         flex;
    align-items:     center;
    justify-content: center;
    width:           26px;
    height:          26px;
    border:          1px solid transparent;
    border-radius:   var(--ah-radius);
    background:      none;
    color:           var(--ah-text-muted);
    font-size:       0.65rem;
    cursor:          pointer;
    transition:      all 0.12s;
}
.remove-btn:hover[b-ob7tw1lqy2] { background: var(--ah-danger-bg); color: var(--ah-danger); border-color: var(--ah-danger-border); }

/* ── Modal context ── */
.modal-context[b-ob7tw1lqy2] {
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius);
    padding:       0.6rem 0.85rem;
    margin-bottom: 1.25rem;
    display:       flex;
    align-items:   center;
    gap:           0.5rem;
}
.modal-context-label[b-ob7tw1lqy2] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; }
.modal-context-value[b-ob7tw1lqy2] { font-size: 0.82rem; font-weight: 700; color: var(--ah-text); }

.scope-preview[b-ob7tw1lqy2] {
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius);
    padding:       0.6rem 0.85rem;
    margin-bottom: 1rem;
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:     0.8rem;
    font-weight:   600;
    color:         var(--ah-text);
}
.scope-label[b-ob7tw1lqy2] {
    display:        block;
    font-family:    inherit;
    font-size:      0.6rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom:  0.2rem;
}

.advanced-link-bar[b-ob7tw1lqy2] {
    display:       flex;
    align-items:   flex-start;
    gap:           0.6rem;
    background:    var(--ah-info-bg);
    border:        1px solid var(--ah-info-border);
    border-radius: var(--ah-radius-md);
    padding:       0.75rem 1rem;
    margin-bottom: 0.5rem;
}
.al-icon[b-ob7tw1lqy2] { font-size: 0.85rem; color: #3b82f6; margin-top: 0.1rem; }
.advanced-link-bar a[b-ob7tw1lqy2] { font-size: 0.78rem; font-weight: 700; color: var(--ah-info); text-decoration: none; }
.advanced-link-bar a:hover[b-ob7tw1lqy2] { text-decoration: underline; }
.al-desc[b-ob7tw1lqy2] { font-size: 0.68rem; color: var(--ah-text-muted); margin-top: 0.15rem; }

.no-members-hint[b-ob7tw1lqy2] {
    font-size:     0.78rem;
    color:         var(--ah-text-muted);
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius);
    padding:       0.7rem 0.85rem;
}

.var-info-box[b-ob7tw1lqy2] {
    background:    var(--ah-warning-bg);
    border:        1px solid var(--ah-warning-border);
    border-radius: var(--ah-radius-md);
    padding:       0.8rem 1rem;
    margin-bottom: 0.5rem;
}
.var-info-title[b-ob7tw1lqy2] { font-size: 0.72rem; font-weight: 700; color: #92400e; margin-bottom: 0.3rem; }
.var-info-desc[b-ob7tw1lqy2]  { font-size: 0.72rem; color: #78716c; line-height: 1.5; }
.var-info-desc a[b-ob7tw1lqy2] { color: var(--ah-info); font-weight: 600; text-decoration: none; }
.var-info-desc a:hover[b-ob7tw1lqy2] { text-decoration: underline; }

/* ── [2026-07-17] Permission 검색 콤보 (dropdown 345개 대체) ── */
.scope-search-panel[b-ob7tw1lqy2] {
    position: absolute;
    left: 0; right: 0;
    top: calc(100% + 4px);
    z-index: 50;
    background: #fff;
    border: 1px solid var(--ah-border);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    max-height: 260px;
    overflow-y: auto;
    padding: 0.3rem 0;
}
.scope-search-item[b-ob7tw1lqy2] {
    display: block;
    width: 100%;
    text-align: left;
    border: none;
    background: transparent;
    padding: 0.4rem 0.85rem;
    font-size: 0.8rem;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    color: var(--ah-text);
    cursor: pointer;
}
.scope-search-item:hover[b-ob7tw1lqy2] { background: var(--ah-bg-subtle, #f1f5f9); }
.scope-search-empty[b-ob7tw1lqy2] {
    padding: 0.5rem 0.85rem;
    font-size: 0.78rem;
    color: var(--ah-text-muted);
}
/* /Features/Identity/Pages/RolesPermissions.razor.rz.scp.css */
/* RolesPermissions — page-specific only.
   Common classes are in ah-components.css */

/* [2026-08-05] .page-title/.page-desc 는 세 파일에 똑같이 복붙돼 있던 두 번째 정본.
   <PageHeader> + ah-components.css §27 (.ah-page-*) 로 통합하며 제거. */

/* ── Stats ── */
.stats-row[b-6v94e014fu] { display: flex; gap: 1rem; margin-bottom: 1.5rem; }
.stat-card[b-6v94e014fu] {
    flex: 1; background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: 10px; padding: 1.1rem 1.25rem; box-shadow: var(--ah-shadow-sm);
}
.stat-label[b-6v94e014fu] { font-size: 0.6rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.stat-value[b-6v94e014fu] { font-size: 1.4rem; font-weight: 800; color: var(--ah-text); letter-spacing: -0.5px; margin-top: 0.15rem; }
.stat-sub[b-6v94e014fu]   { font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.1rem; }

/* ── Table container ── */
.table-container[b-6v94e014fu] {
    background: var(--ah-bg); border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg); box-shadow: var(--ah-shadow-sm);
    overflow: hidden; margin-bottom: 3rem;
}
.table-header[b-6v94e014fu] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 1rem 1.5rem; border-bottom: 1px solid var(--ah-border-soft);
}
.table-title[b-6v94e014fu] { font-size: 0.85rem; font-weight: 700; color: var(--ah-text); }

.filter-select[b-6v94e014fu], .search-input[b-6v94e014fu] {
    font-size: 0.82rem; padding: 0.5rem 0.85rem;
    border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; color: var(--ah-text-sub); background: var(--ah-bg);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.filter-select:focus[b-6v94e014fu], .search-input:focus[b-6v94e014fu] {
    border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring);
}
.filter-select[b-6v94e014fu]       { margin-right: 0.5rem; }
.search-input[b-6v94e014fu]        { width: 220px; }
.search-input[b-6v94e014fu]::placeholder { color: var(--ah-text-placeholder); }

/* ── Role table ── */
.role-table[b-6v94e014fu] { width: 100%; border-collapse: separate; border-spacing: 0; }
.role-table th[b-6v94e014fu] {
    font-size: 0.7rem; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.03em; color: var(--ah-text-muted); background: var(--ah-bg);
    border-bottom: 1px solid var(--ah-border-soft);
    padding: 0.7rem 1.25rem; text-align: left; white-space: nowrap;
}
.role-table td[b-6v94e014fu] {
    padding: 0.8rem 1.25rem; border-bottom: 1px solid var(--ah-bg-subtle);
    font-size: 0.85rem; color: var(--ah-text-sub); vertical-align: middle;
}
.role-table tbody tr[b-6v94e014fu]          { cursor: pointer; transition: background 0.1s; }
.role-table tbody tr:hover[b-6v94e014fu]    { background: var(--ah-bg-subtle); }
.role-table tbody tr:last-child td[b-6v94e014fu] { border-bottom: none; }

.role-name[b-6v94e014fu]   { font-weight: 700; color: var(--ah-text); font-size: 0.85rem; }
.role-desc[b-6v94e014fu]   { font-size: 0.7rem; color: var(--ah-text-muted); margin-top: 0.1rem; }
.count-badge[b-6v94e014fu] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; font-weight: 700; color: var(--ah-text-sub); }

.status-dot[b-6v94e014fu]          { width: 6px; height: 6px; border-radius: 50%; display: inline-block; margin-right: 0.4rem; }
.status-dot.active[b-6v94e014fu]   { background: var(--ah-success); }
.status-dot.archived[b-6v94e014fu] { background: var(--ah-text-muted); }
.status-text[b-6v94e014fu]         { font-size: 0.8rem; font-weight: 600; color: var(--ah-text-sub); }
.date-mono[b-6v94e014fu]           { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text-muted); }

.system-lock[b-6v94e014fu] {
    font-size: 0.6rem; font-weight: 700; color: var(--ah-text-muted);
    display: inline-flex; align-items: center; gap: 0.2rem;
}
.preset-badge[b-6v94e014fu] {
    font-size: 0.55rem; font-weight: 700; color: var(--ah-text-sub);
    background: var(--ah-bg-surface); border: 1px solid var(--ah-border);
    padding: 0.1rem 0.35rem; border-radius: 3px;
    letter-spacing: 0.02em;
}

/* ── Buttons ── */
.btn-create[b-6v94e014fu] {
    font-size: 0.75rem; font-weight: 700; color: var(--ah-accent-text);
    background: var(--ah-accent); border: 1px solid var(--ah-accent);
    padding: 0.4rem 1.1rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: opacity 0.15s; white-space: nowrap;
}
.btn-create:hover[b-6v94e014fu] { opacity: 0.85; }

.btn-advanced[b-6v94e014fu] {
    font-size: 0.75rem; font-weight: 700; color: var(--ah-text-sub);
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    padding: 0.4rem 1.1rem; border-radius: var(--ah-radius);
    cursor: pointer; transition: background 0.15s; white-space: nowrap;
    text-decoration: none; display: inline-flex; align-items: center;
}
.btn-advanced:hover[b-6v94e014fu] { background: var(--ah-bg-subtle); }

/* ── Row kebab menu ── */
.row-kebab[b-6v94e014fu] { position: relative; }
.row-kebab-btn[b-6v94e014fu] {
    display: flex; align-items: center; justify-content: center;
    width: 28px; height: 28px; border-radius: var(--ah-radius);
    border: 1px solid transparent; background: transparent;
    cursor: pointer; transition: all 0.12s;
}
.row-kebab-btn:hover[b-6v94e014fu] { background: var(--ah-bg-surface); border-color: var(--ah-border); }

.row-kebab-dot[b-6v94e014fu] { width: 2.5px; height: 2.5px; background: var(--ah-text-muted); border-radius: 50%; margin: 1.2px 0; }

.row-kebab-dropdown[b-6v94e014fu] {
    position: absolute; bottom: calc(100% + 4px); right: 0;
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); box-shadow: var(--ah-shadow-md);
    min-width: 160px; z-index: 100; overflow: hidden;
}
.rk-item[b-6v94e014fu] {
    display: flex; align-items: center; width: 100%;
    padding: 0.55rem 0.9rem; font-size: 0.78rem; font-weight: 600;
    color: var(--ah-text-sub); cursor: pointer; transition: background 0.12s;
    border: none; background: none; text-align: left;
}
.rk-item .rk-icon[b-6v94e014fu] { width: 18px; font-size: 0.7rem; text-align: center; flex-shrink: 0; margin-right: 0.45rem; }
.rk-item:hover[b-6v94e014fu]        { background: var(--ah-bg-subtle); }
.rk-item.danger[b-6v94e014fu]       { color: var(--ah-danger); }
.rk-item.danger:hover[b-6v94e014fu] { background: var(--ah-danger-bg); }
.rk-divider[b-6v94e014fu] { height: 1px; background: var(--ah-border-soft); }

.menu-backdrop[b-6v94e014fu] { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99; }

/* ── Modal (scroll variant) ── */
.modal-overlay[b-6v94e014fu] {
    position: fixed; top: 0; left: 0; right: 0; bottom: 0;
    background: var(--ah-bg-overlay); backdrop-filter: blur(4px);
    z-index: 1000; display: flex; align-items: flex-start;
    justify-content: center; padding: 2rem 0; overflow-y: auto;
}
.modal-panel[b-6v94e014fu] {
    background: var(--ah-bg); border-radius: var(--ah-radius-xl);
    box-shadow: var(--ah-shadow-lg); padding: 2rem;
    max-width: 480px; width: 92%;
}

/* ── Pagination 은 공통 컴포넌트 <TablePager> 로 이동 (Components/Common/TablePager.razor.css) ── */
/* /Features/Integrations/IntegrationSetup.razor.rz.scp.css */
/* [2026-07-17] Integration Setup Wizard — CreateForm(cf-*) 레이아웃/진행바 미러(iw-* prefix). */

.iw-screen[b-s9aqvdf0lz] {
    position: fixed;
    inset: 0;
    background: #fff;
    display: flex;
    flex-direction: column;
    overflow: auto;
    z-index: 50;
}

.iw-top[b-s9aqvdf0lz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}

.iw-logo[b-s9aqvdf0lz] { height: 34px; width: auto; display: block; }

.iw-close[b-s9aqvdf0lz] {
    background: none; border: none; font-size: 1rem; color: #94a3b8;
    cursor: pointer; padding: 0.25rem 0.55rem; border-radius: 8px; line-height: 1;
}
.iw-close:hover[b-s9aqvdf0lz] { background: #f1f5f9; color: #0f172a; }

.iw-stage[b-s9aqvdf0lz] { flex: 1; display: flex; justify-content: center; padding: 2.5rem 1.5rem 3rem; }
.iw-wizard[b-s9aqvdf0lz] { width: 100%; max-width: 680px; }

.iw-progress[b-s9aqvdf0lz] { margin-bottom: 2rem; }
.iw-progress-row[b-s9aqvdf0lz] { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 0.6rem; }
.iw-step-num[b-s9aqvdf0lz] { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: #0f172a; }
.iw-step-label[b-s9aqvdf0lz] { font-size: 0.8rem; font-weight: 600; color: #94a3b8; }
.iw-track[b-s9aqvdf0lz] { height: 4px; background: #f1f5f9; border-radius: 99px; overflow: hidden; }
.iw-fill[b-s9aqvdf0lz] { height: 100%; background: #0f172a; border-radius: 99px; transition: width 0.25s ease; }

.iw-body[b-s9aqvdf0lz] { min-height: 340px; }

.iw-h1[b-s9aqvdf0lz] { font-size: 1.5rem; font-weight: 800; color: #0f172a; letter-spacing: -0.5px; margin: 0 0 0.4rem; }
.iw-desc[b-s9aqvdf0lz] { font-size: 0.92rem; color: #64748b; margin: 0 0 1.75rem; line-height: 1.5; }

/* ── Connect step blocks ── */
.iw-block[b-s9aqvdf0lz] { border: 1px solid #f1f5f9; border-radius: 12px; padding: 1rem 1.1rem; margin-bottom: 1rem; }
.iw-block-h[b-s9aqvdf0lz] { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: #94a3b8; margin-bottom: 0.7rem; }

.iw-token-row[b-s9aqvdf0lz] { display: flex; align-items: center; gap: 0.5rem; }
.iw-token[b-s9aqvdf0lz] {
    flex: 1 1 auto; min-width: 0; overflow-x: auto; white-space: nowrap;
    font-family: inherit; font-size: 0.84rem;   /* [2026-07-17] mono 제거 — 일반 폰트 */
    background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0.5rem 0.6rem; color: #0f172a;
}
/* [2026-07-17] 녹색 절제 — 초록 배너/패널 제거. verify 는 얇은 라인+찐한 초록 텍스트만. */
.iw-verified[b-s9aqvdf0lz] {
    font-size: 0.88rem; font-weight: 600; color: #166534;
    background: #fafefb; border: 1px solid #e6f4ea; border-left: 3px solid #16a34a;
    border-radius: 6px; padding: 0.55rem 0.75rem;
}

/* Copy 확인 = 작은 찐한 초록 (버튼 텍스트만 바뀜, 배경 과하지 않게) */
.iw-copied[b-s9aqvdf0lz] { color: #166534 !important; border-color: #bbf7d0 !important; background: #f6fefa !important; }

.iw-hint[b-s9aqvdf0lz] { font-size: 0.78rem; color: #94a3b8; margin: 0.55rem 0 0; line-height: 1.5; }
.iw-hint code[b-s9aqvdf0lz] { font-family: ui-monospace, monospace; font-size: 0.74rem; background: #f1f5f9; padding: 0.05rem 0.3rem; border-radius: 4px; }

/* ── Step 2/3 preview ── */
.iw-input[b-s9aqvdf0lz] {
    flex: 1 1 auto; min-width: 0; font-family: inherit; font-size: 0.85rem;
    background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0.5rem 0.65rem; color: #0f172a;
}
.iw-input:focus[b-s9aqvdf0lz] { outline: none; border-color: #94a3b8; }

.iw-rows[b-s9aqvdf0lz] { display: flex; flex-direction: column; gap: 0.35rem; }
.iw-row[b-s9aqvdf0lz] {
    display: flex; align-items: center; gap: 0.6rem;
    padding: 0.5rem 0.65rem; background: #f8fafc; border: 1px solid #f1f5f9; border-radius: 8px;
}
.iw-row-val[b-s9aqvdf0lz] { flex: 1 1 auto; min-width: 0; font-size: 0.85rem; font-weight: 600; color: #0f172a; overflow-x: auto; white-space: nowrap; }
.iw-row-count[b-s9aqvdf0lz] { flex: none; font-size: 0.78rem; font-weight: 700; color: #64748b; }

/* ── Step 0 structure advisor tree ── */
.iw-rec-level[b-s9aqvdf0lz] {
    display: inline-block; font-size: 0.82rem; font-weight: 700; color: #3730a3;
    background: #e0e7ff; border-radius: 999px; padding: 0.25rem 0.7rem; margin: 0 0 0.7rem;
    text-transform: capitalize;
}
.iw-tree[b-s9aqvdf0lz] { background: #f8fafc; border: 1px solid #eef2f7; border-radius: 10px; padding: 0.9rem 1rem; font-size: 0.86rem; color: #0f172a; line-height: 1.7; }
.iw-tree-acct[b-s9aqvdf0lz] { font-weight: 800; }
.iw-tree-org[b-s9aqvdf0lz] { margin-top: 0.35rem; }
.iw-tree-team[b-s9aqvdf0lz] { color: #64748b; font-size: 0.8rem; padding-left: 1.4rem; }
.iw-tree-b[b-s9aqvdf0lz] { color: #cbd5e1; font-family: ui-monospace, monospace; }
.iw-tree-tag[b-s9aqvdf0lz] { font-size: 0.68rem; font-weight: 700; color: #3730a3; background: #e0e7ff; border-radius: 6px; padding: 0.1rem 0.4rem; margin-left: 0.3rem; }
.iw-tree-note[b-s9aqvdf0lz] { margin: 0.4rem 0; font-size: 0.8rem; font-weight: 600; color: #b45309; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: 0.45rem 0.6rem; }
.iw-tree-more[b-s9aqvdf0lz] { color: #94a3b8; font-size: 0.8rem; padding-left: 1.4rem; margin-top: 0.2rem; }

/* ── Step 4 chips ── */
.iw-chips[b-s9aqvdf0lz] { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.6rem; }
.iw-chip[b-s9aqvdf0lz] {
    font-family: inherit; font-size: 0.78rem; font-weight: 600; color: #475569;
    background: #fff; border: 1px solid #e2e8f0; border-radius: 999px; padding: 0.3rem 0.7rem; cursor: pointer;
}
.iw-chip:hover[b-s9aqvdf0lz] { background: #f8fafc; }
.iw-chip-on[b-s9aqvdf0lz] { color: #fff; background: #0f172a; border-color: #0f172a; }
.iw-chip-on:hover[b-s9aqvdf0lz] { background: #1e293b; }

.iw-tag[b-s9aqvdf0lz] { flex: none; font-size: 0.68rem; font-weight: 700; border-radius: 6px; padding: 0.1rem 0.45rem; white-space: nowrap; }
.iw-tag-existing[b-s9aqvdf0lz] { color: #3730a3; background: #e0e7ff; }
.iw-tag-new[b-s9aqvdf0lz] { color: #166534; background: #f0fdf4; }
.iw-tag-unknown[b-s9aqvdf0lz] { color: #94a3b8; background: #f1f5f9; }

/* ── Placeholder (Step 4~6) ── */
.iw-placeholder[b-s9aqvdf0lz] { display: flex; align-items: center; gap: 0.6rem; font-size: 0.85rem; color: #64748b; background: #f8fafc; border: 1px dashed #e2e8f0; border-radius: 10px; padding: 0.9rem 1rem; }
.iw-badge[b-s9aqvdf0lz] { font-size: 0.68rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #6366f1; background: #eef2ff; border-radius: 6px; padding: 0.15rem 0.45rem; flex: none; }

/* ── Buttons ── */
.iw-btn[b-s9aqvdf0lz] {
    background: #0f172a; color: #fff; border: none; padding: 0.6rem 1.4rem; border-radius: 10px;
    font-size: 0.9rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 0.5rem;
}
.iw-btn:hover:not(:disabled)[b-s9aqvdf0lz] { background: #1e293b; }
.iw-btn:disabled[b-s9aqvdf0lz] { opacity: 0.6; cursor: not-allowed; }

.iw-btn-ghost[b-s9aqvdf0lz] {
    background: none; border: 1px solid #e2e8f0; color: #475569; padding: 0.6rem 1.2rem; border-radius: 10px;
    font-size: 0.9rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 0.5rem;
}
.iw-btn-ghost:hover:not(:disabled)[b-s9aqvdf0lz] { background: #f8fafc; }
.iw-btn-ghost:disabled[b-s9aqvdf0lz] { opacity: 0.6; cursor: not-allowed; }

.iw-foot[b-s9aqvdf0lz] { display: flex; justify-content: space-between; margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #f1f5f9; }

.iw-spinner[b-s9aqvdf0lz] { width: 0.9rem; height: 0.9rem; border: 2px solid rgba(255,255,255,0.4); border-top-color: #fff; border-radius: 50%; animation: iw-spin-b-s9aqvdf0lz 0.6s linear infinite; }
.iw-spinner-dark[b-s9aqvdf0lz] { border: 2px solid rgba(15,23,42,0.25); border-top-color: #0f172a; }
@keyframes iw-spin-b-s9aqvdf0lz { to { transform: rotate(360deg); } }
/* /Features/Integrations/IntegrationsList.razor.rz.scp.css */
/* Path: Axowl.Client/Features/Integrations/IntegrationsList.razor.css
   Permission Studio 패턴 (PermissionStudio.razor.css 에서 배낀 구조 + 통합-specific 추가) */

/* ── SCIM Endpoint bar (Scope Grammar 스타일 복제) ── */
.endpoint-box[b-wecujdutu4] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-lg);
    margin-bottom: 1.5rem;
    box-shadow: var(--ah-shadow-sm);
    overflow: hidden;
}
.endpoint-header[b-wecujdutu4] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.85rem 1.5rem; cursor: pointer; transition: background 0.15s;
}
.endpoint-header:hover[b-wecujdutu4] { background: var(--ah-bg-subtle); }
.endpoint-title[b-wecujdutu4]        { font-size: 0.72rem; font-weight: 700; color: var(--ah-text); margin: 0; }
.endpoint-toggle[b-wecujdutu4]       { display: flex; align-items: center; gap: 0.3rem; }
.endpoint-toggle-text[b-wecujdutu4]  { font-size: 0.65rem; font-weight: 600; color: var(--ah-text-muted); }
.endpoint-chevron[b-wecujdutu4]      { font-size: 0.6rem; color: var(--ah-text-muted); transition: transform 0.3s ease; }
.endpoint-chevron.open[b-wecujdutu4] { transform: rotate(180deg); }

.endpoint-body[b-wecujdutu4]       { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.35s ease; padding: 0 1.5rem; }
.endpoint-body.open[b-wecujdutu4]  { max-height: 500px; padding: 0 1.5rem 1.25rem; }

.endpoint-row[b-wecujdutu4] {
    display: flex; align-items: baseline; gap: 0.75rem;
    padding: 0.4rem 0; border-bottom: 1px solid var(--ah-bg-subtle);
}
.endpoint-row:last-of-type[b-wecujdutu4] { border-bottom: none; }
.endpoint-label[b-wecujdutu4] {
    font-size: 0.65rem; font-weight: 700; color: var(--ah-text-muted);
    text-transform: uppercase; letter-spacing: 0.04em; min-width: 80px;
}
.endpoint-value[b-wecujdutu4] {
    font-size: 0.75rem; color: var(--ah-text);
}
.endpoint-value.mono[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    background: var(--ah-bg-subtle);
    padding: 0.15rem 0.5rem; border-radius: var(--ah-radius-sm);
    border: 1px solid var(--ah-border-soft);
}
.endpoint-note[b-wecujdutu4] {
    margin-top: 0.75rem; font-size: 0.7rem; color: var(--ah-text-muted);
    line-height: 1.55;
}

/* ── Layout ── */
.studio-layout[b-wecujdutu4] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 1.5rem;
    align-items: start;
}

@media (max-width: 960px) {
    .studio-layout[b-wecujdutu4] { grid-template-columns: 1fr; }
}

/* ── Sidebar ── */
.sidebar-panel[b-wecujdutu4] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg);
    box-shadow: var(--ah-shadow-sm);
    overflow: hidden;
}

.sidebar-section[b-wecujdutu4] {
    padding: 1rem 1.25rem;
    border-bottom: 1px solid var(--ah-border-soft);
}

.sidebar-section:last-child[b-wecujdutu4] {
    border-bottom: none;
}

.sidebar-title[b-wecujdutu4] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.6rem;
}

.integration-item[b-wecujdutu4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.5rem;
    border-radius: var(--ah-radius);
    cursor: pointer;
    transition: background 0.12s;
    margin-bottom: 0.15rem;
}

.integration-item:hover[b-wecujdutu4]  { background: var(--ah-bg-subtle); }
/* Phase 1 E1 PR #9 (5/15) — selected 사이드바 항목 강조 (검정 outline + 검정 텍스트).
   이전엔 옅은 회색 background 만이라 선택 표시가 잘 안 보임. */
.integration-item.active[b-wecujdutu4] {
    background: #f8fafc;
    box-shadow: 0 0 0 1px #0f172a inset;
    border-radius: var(--ah-radius);
}
.integration-item.active .integration-name[b-wecujdutu4] { color: #0f172a; font-weight: 700; }

.integration-icon[b-wecujdutu4] {
    width: 28px;
    height: 28px;
    border-radius: var(--ah-radius);
    background: var(--ah-bg-surface);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    font-weight: 800;
    color: var(--ah-text-sub);
    flex-shrink: 0;
}

.integration-name[b-wecujdutu4] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ah-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.integration-status[b-wecujdutu4] {
    font-size: 0.6rem;
    color: var(--ah-text-muted);
}

/* Status dot — 색 최소화 (active 는 초록, 나머지는 중립) */
.status-dot[b-wecujdutu4] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--ah-border);
}
.status-dot.dot-active[b-wecujdutu4]    { background: #10b981; }
.status-dot.dot-pending[b-wecujdutu4]   { background: #f59e0b; }  /* Wizard intent — amber, EnabledModules 와 구분 */
.status-dot.dot-available[b-wecujdutu4] { background: var(--ah-border); }
.status-dot.dot-request[b-wecujdutu4]   { background: var(--ah-text-muted); }
.status-dot.dot-soon[b-wecujdutu4]      { background: transparent; border: 1px dashed var(--ah-border); }

/* ── Main panel ── */
.main-panel[b-wecujdutu4] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.empty-detail[b-wecujdutu4] {
    background: var(--ah-bg);
    border: 1px dashed var(--ah-border);
    border-radius: var(--ah-radius-lg);
    padding: 3rem 2rem;
    text-align: center;
}

/* ── Detail header ── */
.detail-header[b-wecujdutu4] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    background: var(--ah-bg);
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg);
    padding: 1rem 1.25rem;
    box-shadow: var(--ah-shadow-sm);
}

.detail-header-icon[b-wecujdutu4] {
    width: 40px;
    height: 40px;
    border-radius: var(--ah-radius);
    background: var(--ah-bg-surface);
    color: var(--ah-text-sub);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    font-weight: 800;
    flex-shrink: 0;
}

.detail-header-title[b-wecujdutu4] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--ah-text);
}

.detail-header-sub[b-wecujdutu4] {
    font-size: 0.78rem;
    color: var(--ah-text-muted);
    margin-top: 0.15rem;
}

.detail-header-action[b-wecujdutu4] {
    flex-shrink: 0;
}

/* ── Action buttons ── */
.btn-activate[b-wecujdutu4],
.btn-request[b-wecujdutu4],
.btn-disconnect[b-wecujdutu4] {
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.45rem 0.9rem;
    border-radius: var(--ah-radius);
    border: 1px solid;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}

/* PR #27 (5/16) — 사용자 directive: 녹색 제거, 검정 톤으로 (사이트 nav/btn-next 와 일관) */
.btn-activate[b-wecujdutu4]   { background: #0f172a; color: #fff; border-color: #0f172a; }
.btn-activate:hover[b-wecujdutu4]   { background: #1e293b; border-color: #1e293b; }

.btn-request[b-wecujdutu4]    { background: var(--ah-text); color: #fff; border-color: var(--ah-text); }
.btn-request:hover[b-wecujdutu4]    { opacity: 0.9; }

.btn-disconnect[b-wecujdutu4] { background: var(--ah-bg); color: var(--ah-text-sub); border-color: var(--ah-border); }
.btn-disconnect:hover[b-wecujdutu4] { color: var(--ah-danger); border-color: var(--ah-danger-border); background: var(--ah-danger-bg); }

.coming-soon-pill[b-wecujdutu4] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border);
    padding: 0.2rem 0.55rem;
    border-radius: var(--ah-radius-sm);
}

/* ── Detail tabs ── */
.detail-tabs[b-wecujdutu4] {
    display: flex;
    gap: 1.25rem;
    border-bottom: 1px solid var(--ah-border);
    padding: 0 0.25rem;
}

.detail-tab[b-wecujdutu4] {
    appearance: none;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--ah-text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.55rem 0;
    cursor: pointer;
}

.detail-tab:hover[b-wecujdutu4]  { color: var(--ah-text-sub); }
.detail-tab.active[b-wecujdutu4] { color: var(--ah-text); border-bottom-color: var(--ah-text); }

/* ── Detail body ── */
.detail-body[b-wecujdutu4] {
    background: var(--ah-bg);
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-lg);
    padding: 1.25rem;
    box-shadow: var(--ah-shadow-sm);
}

.detail-placeholder[b-wecujdutu4] {
    font-size: 0.82rem;
    color: var(--ah-text-muted);
    line-height: 1.6;
}

.detail-meta-row[b-wecujdutu4] {
    display: flex;
    align-items: baseline;
    gap: 0.75rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid var(--ah-bg-subtle);
}

.detail-meta-row:last-of-type[b-wecujdutu4] { border-bottom: none; }

.detail-meta-label[b-wecujdutu4] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    min-width: 110px;
}

.detail-meta-value[b-wecujdutu4] {
    font-size: 0.82rem;
    color: var(--ah-text);
}

/* ── Detail section (User Sync / Permissions tab body) ── */
.detail-section-title[b-wecujdutu4] {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--ah-text);
    margin-bottom: 0.35rem;
}

.detail-section-sub[b-wecujdutu4] {
    font-size: 0.78rem;
    color: var(--ah-text-muted);
    line-height: 1.55;
    margin-bottom: 1rem;
}

.detail-section-sub code[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.74rem;
    background: var(--ah-bg-subtle);
    padding: 0.05rem 0.35rem;
    border-radius: var(--ah-radius-sm);
    border: 1px solid var(--ah-border-soft);
}

/* ── Sync mode radio option ── */
.sync-option[b-wecujdutu4] {
    display: flex;
    align-items: flex-start;
    gap: 0.7rem;
    padding: 0.7rem 0.9rem;
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius);
    cursor: pointer;
    margin-bottom: 0.5rem;
    transition: border-color 0.12s, background 0.12s;
}

.sync-option:hover[b-wecujdutu4] {
    border-color: var(--ah-border);
    background: var(--ah-bg-subtle);
}

.sync-option input[type="radio"][b-wecujdutu4] {
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.sync-option-title[b-wecujdutu4] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--ah-text);
}

.sync-option-sub[b-wecujdutu4] {
    font-size: 0.72rem;
    color: var(--ah-text-muted);
    margin-top: 0.2rem;
    line-height: 1.5;
}

.sync-recommended[b-wecujdutu4] {
    font-size: 0.6rem;
    font-weight: 600;
    color: #10b981;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    padding: 0.05rem 0.4rem;
    border-radius: var(--ah-radius-sm);
    margin-left: 0.35rem;
    letter-spacing: 0.02em;
}

/* ── Trust banner (access governed by customer admin) ── */
.trust-box[b-wecujdutu4] {
    background: linear-gradient(180deg, #f0fdfa 0%, #ecfdf5 100%);
    border: 1px solid #a7f3d0;
    border-radius: var(--ah-radius);
    padding: 0.85rem 1rem;
    margin-bottom: 1rem;
}

.trust-box-title[b-wecujdutu4] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #065f46;
    margin-bottom: 0.3rem;
}

.trust-box-body[b-wecujdutu4] {
    font-size: 0.72rem;
    color: #0f766e;
    line-height: 1.55;
}

.trust-box-body strong[b-wecujdutu4] {
    color: #064e3b;
}

/* ── Zero-copy / scope-lock badges ── */
.zero-copy-badge[b-wecujdutu4] {
    display: inline-flex;
    align-items: center;
    font-size: 0.6rem;
    font-weight: 700;
    color: #065f46;
    background: #d1fae5;
    border: 1px solid #6ee7b7;
    padding: 0.05rem 0.4rem;
    border-radius: var(--ah-radius-sm);
    margin-left: 0.35rem;
    letter-spacing: 0.02em;
}

.scope-lock-badge[b-wecujdutu4] {
    display: inline-flex;
    align-items: center;
    font-size: 0.6rem;
    font-weight: 700;
    color: #92400e;
    background: #fef3c7;
    border: 1px solid #fde68a;
    padding: 0.05rem 0.4rem;
    border-radius: var(--ah-radius-sm);
    margin-left: 0.35rem;
    letter-spacing: 0.02em;
}

/* ── Sync option scope hint ── */
.sync-option-scope[b-wecujdutu4] {
    font-size: 0.68rem;
    color: var(--ah-text-muted);
    margin-top: 0.3rem;
    font-family: inherit;
}

.sync-option-scope code[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.65rem;
    background: var(--ah-bg-subtle);
    padding: 0.05rem 0.3rem;
    border-radius: var(--ah-radius-sm);
    border: 1px solid var(--ah-border-soft);
    color: var(--ah-text-sub);
}

/* ── Disabled sync option ── */
.sync-option-disabled[b-wecujdutu4] {
    opacity: 0.65;
    cursor: not-allowed;
}

.sync-option-disabled:hover[b-wecujdutu4] {
    border-color: var(--ah-border-soft);
    background: transparent;
}

/* ── Advanced disclosure ── */
.advanced-disclosure[b-wecujdutu4] {
    margin-top: 0.5rem;
    border-top: 1px solid var(--ah-border-soft);
    padding-top: 0.75rem;
}

.advanced-toggle[b-wecujdutu4] {
    appearance: none;
    background: transparent;
    border: 0;
    color: var(--ah-text-sub);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 0.4rem 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.advanced-toggle:hover[b-wecujdutu4] {
    color: var(--ah-text);
}

.advanced-chevron[b-wecujdutu4] {
    font-size: 0.7rem;
    transition: transform 0.2s ease;
}

.advanced-chevron.open[b-wecujdutu4] {
    transform: rotate(90deg);
}

.advanced-toggle-note[b-wecujdutu4] {
    font-size: 0.68rem;
    font-weight: 400;
    color: var(--ah-text-muted);
    margin-left: 0.3rem;
}

.advanced-warning[b-wecujdutu4] {
    font-size: 0.7rem;
    color: #92400e;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: var(--ah-radius);
    padding: 0.5rem 0.75rem;
    margin: 0.5rem 0 0.75rem;
    line-height: 1.5;
}

/* ── Connection scope matrix ── */
.scope-matrix[b-wecujdutu4] {
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius);
    padding: 0.85rem 1rem;
}

.scope-matrix-title[b-wecujdutu4] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--ah-text);
    margin-bottom: 0.3rem;
}

.scope-matrix-sub[b-wecujdutu4] {
    font-size: 0.7rem;
    color: var(--ah-text-muted);
    line-height: 1.55;
    margin-bottom: 0.75rem;
}

.scope-row[b-wecujdutu4] {
    display: flex;
    align-items: baseline;
    gap: 0.6rem;
    padding: 0.3rem 0;
    border-bottom: 1px solid var(--ah-bg-surface);
    font-size: 0.74rem;
}

.scope-row:last-of-type[b-wecujdutu4] {
    border-bottom: none;
}

.scope-check[b-wecujdutu4] {
    font-weight: 800;
    width: 14px;
    text-align: center;
    flex-shrink: 0;
}

.scope-granted[b-wecujdutu4] {
    color: #10b981;
}

.scope-denied[b-wecujdutu4] {
    color: var(--ah-text-muted);
}

.scope-name[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.72rem;
    color: var(--ah-text);
    min-width: 110px;
}

.scope-note[b-wecujdutu4] {
    font-size: 0.68rem;
    color: var(--ah-text-muted);
    flex: 1;
}

.scope-matrix-note[b-wecujdutu4] {
    font-size: 0.68rem;
    color: var(--ah-text-muted);
    margin-top: 0.6rem;
    padding-top: 0.5rem;
    border-top: 1px dashed var(--ah-border-soft);
}

/* ── Example policies (group-based expressiveness hint) ── */
.sync-option-examples[b-wecujdutu4] {
    margin-top: 0.5rem;
    padding: 0.5rem 0.65rem;
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius-sm);
}

.example-label[b-wecujdutu4] {
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.3rem;
}

.example-row[b-wecujdutu4] {
    font-size: 0.68rem;
    color: var(--ah-text-sub);
    line-height: 1.65;
}

.example-row code[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.64rem;
    background: var(--ah-bg);
    padding: 0.03rem 0.3rem;
    border-radius: 3px;
    border: 1px solid var(--ah-border-soft);
    color: var(--ah-text);
}

/* ── Beyond native (SAP native vs Axowl value prop) ── */
.beyond-native[b-wecujdutu4] {
    margin-top: 0.55rem;
    padding: 0.6rem 0.75rem;
    background: #fefce8;
    border: 1px solid #fde68a;
    border-radius: var(--ah-radius-sm);
}

.beyond-native-label[b-wecujdutu4] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #854d0e;
    margin-bottom: 0.4rem;
    letter-spacing: 0.01em;
}

.beyond-native-row[b-wecujdutu4] {
    display: flex;
    align-items: flex-start;
    gap: 0.4rem;
    font-size: 0.68rem;
    color: #713f12;
    line-height: 1.55;
    padding: 0.15rem 0;
}

.bn-check[b-wecujdutu4] {
    color: #ca8a04;
    font-weight: 800;
    flex-shrink: 0;
    margin-top: 0.05rem;
}

/* ── SDK Endpoint info (SAP / Salesforce / Oracle Connection tab) ── */
.sdk-endpoint-info[b-wecujdutu4] {
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius);
    padding: 0.5rem 0.9rem;
}

.sdk-row[b-wecujdutu4] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 0.5rem 0;
    border-bottom: 1px solid var(--ah-bg-surface);
}

.sdk-row:last-child[b-wecujdutu4] {
    border-bottom: none;
}

.sdk-label[b-wecujdutu4] {
    font-size: 0.7rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    min-width: 90px;
    flex-shrink: 0;
}

.sdk-value[b-wecujdutu4] {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--ah-text);
    flex: 1;
    word-break: break-all;
}

.sdk-value.mono[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.75rem;
}

.sdk-copy-btn[b-wecujdutu4] {
    font-size: 0.7rem;
    padding: 0.3rem 0.6rem;
    border: 1px solid var(--ah-border);
    background: var(--ah-bg);
    border-radius: var(--ah-radius-sm);
    color: var(--ah-text-sub);
    cursor: pointer;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}

.sdk-copy-btn:hover[b-wecujdutu4] {
    background: var(--ah-bg-subtle);
    color: var(--ah-text);
}

/* ===================================================================
   Scope Builder (mirrored from PermissionStudio.razor.css)
   Used by Group Permissions tab — same scope grammar UI as Permission
   Studio, embedded inline so SCIM/SAP groups stay in Integrations.
   =================================================================== */

/* ── Grammar box ── */
.grammar-box[b-wecujdutu4] {
    background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-lg); padding: 0; margin-bottom: 1rem;
    box-shadow: var(--ah-shadow-sm); overflow: hidden;
}
.grammar-header[b-wecujdutu4] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.7rem 1rem; cursor: pointer; transition: background 0.15s;
}
.grammar-header:hover[b-wecujdutu4] { background: var(--ah-bg-subtle); }
.grammar-title[b-wecujdutu4]        { font-size: 0.72rem; font-weight: 700; color: var(--ah-text); margin: 0; }
.grammar-toggle[b-wecujdutu4]       { display: flex; align-items: center; gap: 0.3rem; }
.grammar-toggle-text[b-wecujdutu4]  { font-size: 0.65rem; font-weight: 600; color: var(--ah-text-muted); }
.grammar-chevron[b-wecujdutu4]      { font-size: 0.6rem; color: var(--ah-text-muted); transition: transform 0.3s ease; }
.grammar-chevron.open[b-wecujdutu4] { transform: rotate(180deg); }

.grammar-body[b-wecujdutu4]       { max-height: 0; overflow: hidden; transition: max-height 0.35s ease, padding 0.35s ease; padding: 0 1rem; }
.grammar-body.open[b-wecujdutu4]  { max-height: 500px; padding: 0 1rem 1rem; }

.grammar-formula[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.85rem; font-weight: 600;
    color: var(--ah-text); background: var(--ah-bg-subtle); border: 1px solid var(--ah-border-soft);
    border-radius: var(--ah-radius); padding: 0.6rem 1rem; margin-bottom: 0.75rem;
    display: flex; align-items: center; flex-wrap: wrap; gap: 0;
}
.gf-part[b-wecujdutu4]     { padding: 0.1rem 0.35rem; border-radius: 3px; background: var(--ah-bg-surface); color: var(--ah-text-sub); font-size: 0.78rem; }
.gf-dot[b-wecujdutu4]      { color: var(--ah-text-muted); font-weight: 800; padding: 0 0.1rem; }
.gf-colon[b-wecujdutu4]    { color: var(--ah-text-muted); font-weight: 800; padding: 0 0.2rem; }
.grammar-note[b-wecujdutu4] { font-size: 0.68rem; color: var(--ah-text-muted); line-height: 1.5; }
.grammar-note code[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; font-weight: 700;
    background: var(--ah-bg-surface); padding: 0.1rem 0.3rem; border-radius: 3px; color: var(--ah-text);
}

/* ── Scope entry rows ── */
.scope-entry-row[b-wecujdutu4] { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 0.5rem; }
.scope-entry-row input[b-wecujdutu4] {
    flex: 1; font-size: 0.82rem; padding: 0.5rem 0.7rem;
    border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; box-sizing: border-box;
    background: var(--ah-bg); color: var(--ah-text);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.scope-entry-row input:focus[b-wecujdutu4] { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }
.scope-entry-row input[b-wecujdutu4]::placeholder { color: var(--ah-text-placeholder); }

.btn-row-remove[b-wecujdutu4] { font-size: 0.7rem; color: var(--ah-text-muted); background: none; border: none; cursor: pointer; padding: 0.2rem; transition: color 0.12s; }
.btn-row-remove:hover[b-wecujdutu4] { color: var(--ah-danger); }
.btn-row-add[b-wecujdutu4]    { font-size: 0.72rem; font-weight: 600; color: var(--ah-text-sub); background: none; border: none; cursor: pointer; padding: 0.3rem 0; transition: color 0.12s; }
.btn-row-add:hover[b-wecujdutu4] { color: var(--ah-text); }

/* ── Variable rows ── */
.var-entry-row[b-wecujdutu4] { display: flex; gap: 0.35rem; align-items: center; margin-bottom: 0.5rem; }
.var-entry-row input[b-wecujdutu4] {
    font-size: 0.82rem; padding: 0.5rem 0.7rem;
    border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; box-sizing: border-box;
    background: var(--ah-bg); color: var(--ah-text);
    transition: border-color 0.15s, box-shadow 0.15s;
}
.var-entry-row input:focus[b-wecujdutu4] { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }
.var-entry-row input[b-wecujdutu4]::placeholder { color: var(--ah-text-placeholder); }
.var-key-input[b-wecujdutu4] { flex: 0.35; }
.var-val-input[b-wecujdutu4] { flex: 0.5; }

.var-mode-toggle[b-wecujdutu4] {
    flex-shrink: 0; width: 32px; height: 32px; border-radius: var(--ah-radius);
    border: 1px solid var(--ah-border); font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.72rem; font-weight: 800; cursor: pointer;
    display: flex; align-items: center; justify-content: center; transition: all 0.15s;
}
.var-mode-toggle.allow[b-wecujdutu4] { background: var(--ah-bg-subtle); color: var(--ah-text-sub); border-color: var(--ah-border); }
.var-mode-toggle.allow:hover[b-wecujdutu4] { background: var(--ah-bg-surface); }
.var-mode-toggle.deny[b-wecujdutu4]  { background: var(--ah-danger-bg); color: var(--ah-danger); border-color: var(--ah-danger-border); }
.var-mode-toggle.deny:hover[b-wecujdutu4]  { background: #fee2e2; }

/* Comparison-operator dropdown — replaces the old binary toggle.
   Same dimensions as var-mode-toggle so the row height matches. */
.var-op-select[b-wecujdutu4] {
    flex-shrink: 0; width: 56px; height: 32px; border-radius: var(--ah-radius);
    border: 1px solid var(--ah-border); font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.78rem; font-weight: 700; cursor: pointer; padding: 0 0.35rem;
    text-align: center; transition: all 0.15s;
}
.var-op-select.allow[b-wecujdutu4] { background: var(--ah-bg-subtle); color: var(--ah-text-sub); border-color: var(--ah-border); }
.var-op-select.deny[b-wecujdutu4]  { background: var(--ah-danger-bg); color: var(--ah-danger); border-color: var(--ah-danger-border); }

/* ── Bulk input ── */
.bulk-textarea[b-wecujdutu4] {
    width: 100%; font-size: 0.82rem; font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    padding: 0.75rem 0.85rem; border: 1px solid var(--ah-border); border-radius: var(--ah-radius);
    outline: none; color: var(--ah-text); background: var(--ah-bg);
    resize: vertical; min-height: 100px; line-height: 1.6;
    transition: border-color 0.15s, box-shadow 0.15s; box-sizing: border-box;
}
.bulk-textarea:focus[b-wecujdutu4]       { border-color: var(--ah-focus-color); box-shadow: var(--ah-focus-ring); }
.bulk-textarea[b-wecujdutu4]::placeholder { color: var(--ah-text-placeholder); }

/* ── Preview ── */
.preview-box[b-wecujdutu4] {
    background: var(--ah-bg-subtle); border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 1rem 1.25rem;
}
.preview-title[b-wecujdutu4] { font-size: 0.65rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.5rem; }
.preview-scope[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.78rem; font-weight: 600;
    color: var(--ah-text); padding: 0.3rem 0; border-bottom: 1px solid var(--ah-border);
    display: flex; align-items: center; gap: 0.5rem;
}
.preview-scope:last-child[b-wecujdutu4] { border-bottom: none; }
.preview-scope.deny[b-wecujdutu4] { color: var(--ah-danger); }
.preview-deny-badge[b-wecujdutu4] {
    font-size: 0.5rem; font-weight: 800; color: var(--ah-danger);
    background: var(--ah-danger-bg); border: 1px solid var(--ah-danger-border);
    padding: 0.05rem 0.3rem; border-radius: 3px; flex-shrink: 0;
}
.preview-empty[b-wecujdutu4] { font-size: 0.75rem; color: var(--ah-text-muted); font-style: italic; }

/* ── Risk selector ── */
.risk-selector[b-wecujdutu4] { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.5rem; }
.risk-option[b-wecujdutu4] {
    flex: 1; min-width: 100px; border: 1px solid var(--ah-border);
    border-radius: var(--ah-radius-md); padding: 0.6rem 0.75rem;
    cursor: pointer; transition: all 0.15s; background: var(--ah-bg);
}
.risk-option:hover[b-wecujdutu4]    { border-color: var(--ah-text-muted); background: var(--ah-bg-subtle); }
.risk-option.selected[b-wecujdutu4] { border-color: var(--ah-text); background: var(--ah-bg-subtle); }

.risk-option-level[b-wecujdutu4]  { font-size: 0.6rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.risk-option-name[b-wecujdutu4]   { font-size: 0.78rem; font-weight: 700; color: var(--ah-text); margin: 0.15rem 0; }
.risk-option-policy[b-wecujdutu4] { font-size: 0.65rem; color: var(--ah-text-muted); font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; }

/* ── Risk badges (used in Group Permissions row) ── */
.risk-badge[b-wecujdutu4] { font-size: 0.62rem; font-weight: 700; padding: 0.12rem 0.45rem; border-radius: var(--ah-radius-sm); display: inline-block; }
.risk-0[b-wecujdutu4] { background: var(--ah-success-bg); color: #166534; }
.risk-1[b-wecujdutu4] { background: #f0f9ff; color: #075985; }
.risk-2[b-wecujdutu4] { background: #fff7ed; color: #9a3412; }
.risk-3[b-wecujdutu4] { background: var(--ah-danger-bg); color: var(--ah-danger); }
.risk-4[b-wecujdutu4] { background: #f5f3ff; color: #5b21b6; }

/* ── AI toggle button (Add Group Permission card header) ── */
.ai-toggle-btn[b-wecujdutu4] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.4rem 0.85rem;
    border-radius: 999px;
    border: 1px solid #e9d5ff;
    background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%);
    color: #6b21a8;
    font-size: 0.74rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
    flex-shrink: 0;
}
.ai-toggle-btn:hover[b-wecujdutu4] {
    background: linear-gradient(135deg, #f3e8ff 0%, #e9d5ff 100%);
    border-color: #d8b4fe;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(124, 58, 237, 0.15);
}
.ai-toggle-btn.active[b-wecujdutu4] {
    background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
    border-color: #6d28d9;
    color: #fff;
}
.ai-toggle-btn.active:hover[b-wecujdutu4] {
    background: linear-gradient(135deg, #6d28d9 0%, #5b21b6 100%);
}

/* ── Group combobox (typeahead) ── */
.group-combo[b-wecujdutu4] {
    position: relative;
}
.group-combo-chip[b-wecujdutu4] {
    display: inline-flex;
    align-items: center;
    font-size: 0.72rem;
    font-weight: 700;
    color: #ffffff;
    background: #2563eb;
    border: 1px solid #2563eb;
    border-radius: 999px;
    padding: 0.6rem 1rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
    line-height: 1;
}
.group-combo-chip:hover[b-wecujdutu4] {
    background: #1d4ed8;
    border-color: #1d4ed8;
}
.group-combo-badge-x[b-wecujdutu4] {
    font-size: 0.62rem;
    opacity: 0.9;
}
.group-combo-panel[b-wecujdutu4] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0; right: 0;
    background: #fff;
    border: 1px solid var(--ah-border);
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
    z-index: 50;
    max-height: 280px;
    overflow-y: auto;
    padding: 0.3rem 0;
}
.group-combo-section[b-wecujdutu4] {
    font-size: 0.6rem;
    font-weight: 700;
    color: var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.4rem 0.85rem 0.2rem;
}
.group-combo-item[b-wecujdutu4] {
    display: flex; align-items: center;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 0.5rem 0.85rem;
    font-size: 0.78rem;
    color: var(--ah-text);
    cursor: pointer;
    transition: background 0.1s;
}
.group-combo-item:hover[b-wecujdutu4] {
    background: var(--ah-bg-subtle);
}
.group-combo-item.all-option[b-wecujdutu4] {
    color: #b91c1c;
    font-weight: 600;
}
.group-combo-item.all-option.active[b-wecujdutu4] {
    background: #fef2f2;
}
.group-combo-item.new-option[b-wecujdutu4] {
    color: #6d28d9;
}
.group-combo-meta[b-wecujdutu4] {
    margin-left: auto;
    font-size: 0.65rem;
    color: var(--ah-text-muted);
    font-weight: 400;
}

/* ── Save confirmation modal ── */
.save-confirm-backdrop[b-wecujdutu4] {
    position: fixed; inset: 0;
    background: rgba(15, 23, 42, 0.45);
    z-index: 1000;
}
.save-confirm-modal[b-wecujdutu4] {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: min(560px, calc(100vw - 2rem));
    max-height: calc(100vh - 4rem);
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.25);
    z-index: 1001;
    display: flex; flex-direction: column;
}
.save-confirm-header[b-wecujdutu4] {
    padding: 1rem 1.25rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--ah-text);
    border-bottom: 1px solid var(--ah-border);
}
.save-confirm-body[b-wecujdutu4] {
    padding: 1rem 1.25rem;
    overflow-y: auto;
}
.save-confirm-list[b-wecujdutu4] {
    background: #f8fafc;
    border: 1px solid var(--ah-border);
    border-radius: 8px;
    padding: 0.5rem;
    margin-bottom: 0.6rem;
    max-height: 220px;
    overflow-y: auto;
}
.save-confirm-scope[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.72rem;
    color: var(--ah-text);
    padding: 0.3rem 0.5rem;
    border-radius: 4px;
}
.save-confirm-scope.deny[b-wecujdutu4] {
    color: #b91c1c;
    background: #fef2f2;
}
.save-confirm-meta[b-wecujdutu4] {
    font-size: 0.7rem;
    color: var(--ah-text-muted);
    padding-top: 0.4rem;
}
.save-confirm-meta code[b-wecujdutu4] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.65rem;
    background: #f1f5f9;
    padding: 0.05rem 0.3rem;
    border-radius: 3px;
}
.save-confirm-actions[b-wecujdutu4] {
    display: flex; justify-content: flex-end; gap: 0.5rem;
    padding: 0.85rem 1.25rem;
    border-top: 1px solid var(--ah-border);
}

/* "View all in Roles" link — sits in the Group Permissions section header. */
.recent-groups-all[b-wecujdutu4] {
    background: none; border: 0;
    color: var(--ah-primary);
    font-size: 0.78rem; font-weight: 500;
    cursor: pointer; padding: 0;
}

.recent-groups-all:hover[b-wecujdutu4] { text-decoration: underline; }
/* /Features/Notification/Pages/NotificationPage.razor.rz.scp.css */
/* NotificationPage.razor.css — CSS variable 기반 */
.summary-card[b-nqboh4zjux] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem; /* 2026-04-17: 1.25 → 1.65 (카드 높이 증가) */
    box-shadow:    var(--ah-shadow-sm);
}
.summary-value[b-nqboh4zjux] { font-size: 1.75rem; font-weight: 800; color: var(--ah-text); letter-spacing: -1px; line-height: 1; }
.summary-label[b-nqboh4zjux] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem; }

.filter-tab[b-nqboh4zjux] {
    background:    none;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0.35rem 0.85rem;
    font-size:     0.8rem;
    font-weight:   500;
    color:         var(--ah-text-muted);
    cursor:        pointer;
    transition:    all 0.15s;
}
.filter-tab:hover[b-nqboh4zjux]  { background: var(--ah-bg-subtle); color: var(--ah-text-sub); }
.filter-tab.active[b-nqboh4zjux] { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }

.mark-all-btn[b-nqboh4zjux] {
    background:    var(--ah-bg);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.5rem 1.25rem;
    border-radius: 8px;
    cursor:        pointer;
    transition:    all 0.15s;
}
.mark-all-btn:hover[b-nqboh4zjux] { background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); }

.notif-table[b-nqboh4zjux] { width: 100%; border-collapse: separate; border-spacing: 0; }

.notif-table th[b-nqboh4zjux] {
    font-size:        0.7rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.05em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.85rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}

.notif-table td[b-nqboh4zjux] {
    padding:        0.85rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.85rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}

.notif-table tbody tr:hover[b-nqboh4zjux]          { background-color: var(--ah-bg-subtle); }
.notif-table tbody tr:last-child td[b-nqboh4zjux]  { border-bottom: none; }
.notif-table tbody tr.row-unread[b-nqboh4zjux]     { background-color: var(--ah-bg-subtle); }
.notif-table tbody tr.row-unread:hover[b-nqboh4zjux] { background-color: var(--ah-bg-surface); }

.notif-title-text[b-nqboh4zjux] {
    font-size:   0.85rem;
    color:       var(--ah-text);
    line-height: 1.3;
}
.notif-message-text[b-nqboh4zjux] {
    font-size:              0.75rem;
    color:                  var(--ah-text-muted);
    margin-top:             2px;
    line-height:            1.3;
    display:                -webkit-box;
    -webkit-line-clamp:     1;
    line-clamp:             1;
    -webkit-box-orient:     vertical;
    overflow:               hidden;
}

.category-badge[b-nqboh4zjux] {
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:     0.7rem;
    color:         var(--ah-text-muted);
    background:    var(--ah-bg-subtle);
    padding:       0.15rem 0.4rem;
    border-radius: 4px;
    border:        1px solid var(--ah-border);
}
.type-text[b-nqboh4zjux] { font-size: 0.75rem; color: var(--ah-text-muted); }

.status-badge[b-nqboh4zjux] { font-size: 0.65rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; border: 1px solid; }
.status-badge.read[b-nqboh4zjux]   { background: var(--ah-bg-surface); color: var(--ah-text-muted); border-color: var(--ah-border); }
.status-badge.unread[b-nqboh4zjux] { background: var(--ah-info-bg);    color: var(--ah-info);       border-color: var(--ah-info-border); }

.search-input[b-nqboh4zjux] {
    border-radius:    8px;
    font-size:        0.85rem;
    height:           36px;
    border:           1px solid var(--ah-border);
    padding-left:     2.25rem;
    background-color: var(--ah-bg);
    color:            var(--ah-text);
}
.search-input:focus[b-nqboh4zjux] { border-color: var(--ah-link); box-shadow: 0 0 0 3px rgba(79,70,229,0.08); outline: none; }

.empty-state[b-nqboh4zjux] { text-align: center; padding: 4rem 2rem; color: var(--ah-text-muted); }

.table-container[b-nqboh4zjux] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    overflow:      hidden;
    box-shadow:    var(--ah-shadow-sm);
    margin-bottom: 2rem;
}

/* [2026-06-17] 체크박스는 글로벌 .ah-checkbox 로 통일 (ah-components.css §25). */
.row-selected[b-nqboh4zjux] { background-color: var(--ah-info-bg) !important; }

/* ── Delete button ── */
.delete-selected-btn[b-nqboh4zjux] {
    background:    transparent;
    color:         var(--ah-danger);
    border:        1px solid var(--ah-danger);
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.35rem 0.85rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    all 0.15s;
    margin-left:   0.5rem;
}
.delete-selected-btn:hover[b-nqboh4zjux] { background: var(--ah-danger-bg); }
.delete-selected-btn:disabled[b-nqboh4zjux] { opacity: 0.5; cursor: not-allowed; }
/* /Features/Org/Pages/ApprovalForms.razor.rz.scp.css */
/* ApprovalForms.razor.css — mirrors WorkList.razor.css (same look as Approval Types / Team Members). */

.summary-card[b-upqye0if8i] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem;
    box-shadow:    var(--ah-shadow-sm);
}
.summary-value[b-upqye0if8i] { font-size: 1.75rem; font-weight: 800; color: var(--ah-text); letter-spacing: -1px; line-height: 1; }
.summary-label[b-upqye0if8i] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem; }

.slug-mono[b-upqye0if8i] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.7rem; color: var(--ah-text-muted); }

.info-box[b-upqye0if8i] {
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 10px;
    padding:       1.25rem 1.4rem;
    margin-bottom: 1.5rem;
}
.info-box-title[b-upqye0if8i] { font-size: 0.75rem; font-weight: 700; color: var(--ah-text); margin-bottom: 0.5rem; }
.info-box-body[b-upqye0if8i]  { font-size: 0.78rem; color: var(--ah-text-muted); line-height: 1.65; }

.table-container[b-upqye0if8i] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-sm);
    overflow:      hidden;
}
.tab-header-bar[b-upqye0if8i] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         0 1.25rem;
    border-bottom:   1px solid var(--ah-border);
}
.member-tab[b-upqye0if8i] { padding: 0.875rem 1.25rem; font-size: 0.8rem; font-weight: 600; color: var(--ah-text-muted); border-bottom: 2px solid transparent; }
.member-tab.active[b-upqye0if8i] { color: var(--ah-text); font-weight: 700; border-bottom-color: var(--ah-text); }

.member-table[b-upqye0if8i] { width: 100%; border-collapse: separate; border-spacing: 0; }
.member-table th[b-upqye0if8i] {
    font-size:        0.7rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.03em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.75rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}
.member-table td[b-upqye0if8i] {
    padding:        1rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.85rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}
.member-table tbody tr[b-upqye0if8i]           { cursor: pointer; transition: background 0.1s; }
.member-table tbody tr:hover[b-upqye0if8i]     { background-color: var(--ah-bg-subtle); }
.member-table tbody tr:last-child td[b-upqye0if8i] { border-bottom: none; }

.member-name[b-upqye0if8i] { font-weight: 700; color: var(--ah-text); font-size: 0.85rem; }
.member-sub[b-upqye0if8i]  { font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.15rem; }

.invite-btn[b-upqye0if8i] {
    background:    var(--ah-text);
    color:         var(--ah-bg);
    border:        none;
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.6rem 1.5rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    opacity 0.15s;
}
.invite-btn:hover[b-upqye0if8i]    { opacity: 0.85; }
.invite-btn:disabled[b-upqye0if8i] { opacity: 0.5; cursor: not-allowed; }

.page-count[b-upqye0if8i] { font-size: 0.7rem; color: var(--ah-text-muted); padding: 0.75rem 1.25rem; text-align: right; border-top: 1px solid var(--ah-bg-subtle); }
.page-count strong[b-upqye0if8i] { color: var(--ah-text-sub); }

/* badges */
.wl-badge[b-upqye0if8i] {
    display:       inline-flex;
    align-items:   center;
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}
.wl-badge.managed[b-upqye0if8i]  { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }
.wl-badge.active[b-upqye0if8i]   { background: var(--ah-success-bg); color: #166534; border-color: var(--ah-success-border); }
.wl-badge.inactive[b-upqye0if8i] { background: var(--ah-bg-surface); color: var(--ah-text-muted); }
.wl-badge.pre[b-upqye0if8i]      { background: var(--ah-info-bg); color: #1e40af; }

.wl-mono[b-upqye0if8i] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.72rem; color: var(--ah-text); }

/* row actions */
.wl-action-cell[b-upqye0if8i] { text-align: right; white-space: nowrap; }
.wl-icon-btn[b-upqye0if8i] {
    border:        1px solid var(--ah-border);
    background:    var(--ah-bg);
    color:         var(--ah-text-sub);
    width:         30px;
    height:        30px;
    border-radius: 6px;
    cursor:        pointer;
    margin-left:   0.35rem;
}
.wl-icon-btn:hover[b-upqye0if8i]         { background: var(--ah-bg-subtle); color: var(--ah-text); }
.wl-icon-btn.danger[b-upqye0if8i]        { border-color: var(--ah-danger-border); color: var(--ah-danger); }
.wl-icon-btn.danger:hover[b-upqye0if8i]  { background: var(--ah-danger-bg); }
.wl-icon-btn:disabled[b-upqye0if8i]      { opacity: 0.5; cursor: not-allowed; }

/* modal (mirror Members invite modal) */
.modal-backdrop[b-upqye0if8i] {
    position:        fixed;
    inset:           0;
    background:      rgba(0,0,0,0.45);
    z-index:         1000;
    display:         flex;
    align-items:     center;
    justify-content: center;
}
.modal-panel[b-upqye0if8i] {
    background:    var(--ah-bg);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-lg);
    width:         480px;
    max-width:     90vw;
    max-height:    90vh;
    overflow-y:    auto;
    padding:       2rem;
}
.modal-title[b-upqye0if8i] { font-weight: 800; font-size: 1.1rem; color: var(--ah-text); letter-spacing: -0.3px; margin-bottom: 1.5rem; }
.modal-label[b-upqye0if8i] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-sub); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.4rem; }

.modal-input[b-upqye0if8i], .modal-select[b-upqye0if8i] {
    width:         100%;
    height:        40px;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0 0.75rem;
    font-size:     0.85rem;
    color:         var(--ah-text);
    background:    var(--ah-bg);
    margin-bottom: 1.25rem;
    box-sizing:    border-box;
}
.modal-input:focus[b-upqye0if8i]  { outline: none; border-color: var(--ah-text-muted); box-shadow: 0 0 0 2px rgba(148,163,184,0.15); }
.modal-select:focus[b-upqye0if8i] { outline: none; border-color: var(--ah-text-muted); }

.modal-textarea[b-upqye0if8i] {
    width:         100%;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0.6rem 0.75rem;
    font-size:     0.85rem;
    color:         var(--ah-text);
    background:    var(--ah-bg);
    margin-bottom: 0.85rem;
    box-sizing:    border-box;
    resize:        vertical;
    font-family:   inherit;
}
.modal-textarea:focus[b-upqye0if8i] { outline: none; border-color: var(--ah-text-muted); box-shadow: 0 0 0 2px rgba(148,163,184,0.15); }

.wl-locale-head[b-upqye0if8i] {
    font-size:     0.78rem;
    font-weight:   700;
    color:         var(--ah-text);
    margin:        0.5rem 0 0.6rem;
    padding-top:   0.9rem;
    border-top:    1px solid var(--ah-bg-subtle);
}

.modal-actions[b-upqye0if8i] { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1rem; }
.modal-cancel[b-upqye0if8i] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    color:         var(--ah-text-sub);
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.45rem 1rem;
    border-radius: 6px;
    cursor:        pointer;
}
.modal-cancel:hover[b-upqye0if8i] { background: var(--ah-bg-subtle); }

.wl-check[b-upqye0if8i] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.82rem; color: var(--ah-text-sub); margin-bottom: 1rem; cursor: pointer; }

.wl-managed-note[b-upqye0if8i] {
    font-size:     0.78rem;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 8px;
    padding:       0.6rem 0.8rem;
    margin-bottom: 1.25rem;
}
.wl-managed-note code[b-upqye0if8i] { color: var(--ah-text); }

.wl-error[b-upqye0if8i] {
    font-size:     0.82rem;
    color:         var(--ah-danger);
    background:    var(--ah-danger-bg);
    border:        1px solid var(--ah-danger-border);
    border-radius: 8px;
    padding:       0.55rem 0.8rem;
    margin-bottom: 1.25rem;
}

/* ── A4 document modal (full-screen) ── */
.doc-overlay[b-upqye0if8i] {
    position: fixed; inset: 0; background: rgba(15,23,42,0.55);
    z-index: 1000; display: flex; flex-direction: column;
}
.doc-shell[b-upqye0if8i] { display: flex; flex-direction: column; width: 100%; height: 100%; }

.doc-toolbar[b-upqye0if8i] {
    display: flex; align-items: center; justify-content: space-between;
    padding: 0.75rem 1.25rem; background: var(--ah-bg);
    border-bottom: 1px solid var(--ah-border); flex-shrink: 0;
}
.doc-tabs[b-upqye0if8i] { display: flex; gap: 0.25rem; }
.doc-tab[b-upqye0if8i] {
    border: 1px solid var(--ah-border); background: var(--ah-bg);
    color: var(--ah-text-muted); font-weight: 600; font-size: 0.8rem;
    padding: 0.4rem 1.1rem; border-radius: 6px; cursor: pointer;
}
.doc-tab.active[b-upqye0if8i] { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }
.doc-actions[b-upqye0if8i] { display: flex; align-items: center; gap: 0.6rem; }
.doc-managed[b-upqye0if8i] { font-size: 0.75rem; font-weight: 600; color: var(--ah-text-muted); }
.doc-error[b-upqye0if8i] { margin: 0.75rem 1.25rem 0; }

.doc-meta[b-upqye0if8i] {
    display: flex; align-items: flex-end; gap: 1rem; flex-wrap: wrap;
    padding: 0.75rem 1.25rem; background: var(--ah-bg-subtle);
    border-bottom: 1px solid var(--ah-border); flex-shrink: 0;
}
.doc-meta-field[b-upqye0if8i] { display: flex; flex-direction: column; gap: 0.25rem; }
.doc-meta-field.grow[b-upqye0if8i] { flex: 1; min-width: 180px; }
.doc-meta-field label[b-upqye0if8i] { font-size: 0.62rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--ah-text-muted); }
.doc-meta-field input[b-upqye0if8i] {
    height: 34px; border: 1px solid var(--ah-border); border-radius: 6px;
    padding: 0 0.65rem; font-size: 0.82rem; background: var(--ah-bg); color: var(--ah-text);
}
.doc-meta-field input:focus[b-upqye0if8i] { outline: none; border-color: var(--ah-text-muted); }
.doc-meta-check[b-upqye0if8i] { display: flex; align-items: center; gap: 0.4rem; font-size: 0.8rem; color: var(--ah-text-sub); font-weight: 600; padding-bottom: 0.45rem; cursor: pointer; }

.doc-scroll[b-upqye0if8i] { flex: 1; overflow-y: auto; background: #e5e7eb; padding: 2rem 1rem; display: flex; justify-content: center; }

/* A4 paper @96dpi ≈ 794 × 1123 */
.a4-page[b-upqye0if8i] {
    position: relative; box-sizing: border-box;
    width: 794px; max-width: 100%; min-height: 1123px;
    background: #fff; box-shadow: 0 8px 30px rgba(0,0,0,0.25);
    padding: 64px 72px; margin-bottom: 2rem;
    font-size: 14px; color: #111827; line-height: 1.7;
}

/* ── Letterhead (회사명/레터헤드) ── */
.doc-letterhead[b-upqye0if8i] { display: flex; align-items: center; justify-content: center; gap: 12px; }
.doc-logo[b-upqye0if8i] {
    width: 34px; height: 34px; border-radius: 7px; background: #111827; color: #fff;
    display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 16px;
}
.doc-logo-img[b-upqye0if8i] { height: 34px; max-width: 160px; object-fit: contain; }
.doc-company[b-upqye0if8i] { font-size: 20px; font-weight: 800; letter-spacing: 1.5px; color: #111827; }
.doc-rule[b-upqye0if8i] { border-bottom: 2px solid #111827; margin: 12px 0 22px; }

/* placeholder (발의 시 채워짐) */
.doc-ph[b-upqye0if8i] { color: #9ca3af; font-style: italic; }

/* 두문 — KR 왼쪽 메타 + 우상단 결재란 */
.kr-head[b-upqye0if8i] { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; margin-bottom: 14px; }
.kr-meta-list[b-upqye0if8i] { display: flex; flex-direction: column; gap: 5px; }
.kr-meta[b-upqye0if8i] { font-size: 12.5px; color: #1f2937; }
.kr-meta .lbl[b-upqye0if8i] { display: inline-block; width: 66px; color: #6b7280; font-weight: 600; }
.kr-recipients[b-upqye0if8i] { font-size: 12.5px; border: 1px solid #d1d5db; padding: 8px 12px; margin-bottom: 22px; display: flex; flex-direction: column; gap: 8px; }
.kr-recipients .lbl[b-upqye0if8i] { width: 40px; color: #374151; font-weight: 700; flex-shrink: 0; }

/* 수신처 칩 + 피커 */
.recip-row[b-upqye0if8i] { display: flex; align-items: flex-start; gap: 8px; }
.recip-cell[b-upqye0if8i] { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.recip-chip[b-upqye0if8i] { display: inline-flex; align-items: center; gap: 4px; background: #f1f5f9; border: 1px solid #d1d5db; border-radius: 12px; padding: 1px 4px 1px 8px; font-size: 11.5px; color: #111827; }
.chip-x[b-upqye0if8i] { border: none; background: none; cursor: pointer; color: #6b7280; font-size: 14px; line-height: 1; padding: 0 2px; }
.chip-x:hover[b-upqye0if8i] { color: #dc2626; }
.recip-pick-wrap[b-upqye0if8i] { position: relative; display: inline-block; }
.recip-add-btn[b-upqye0if8i] { border: 1px dashed #9ca3af; background: #fff; color: #2563eb; border-radius: 6px; padding: 2px 8px; font-size: 11px; cursor: pointer; }
.recip-add-btn:hover[b-upqye0if8i] { background: #eff6ff; }
.recip-popover[b-upqye0if8i] { position: absolute; top: calc(100% + 4px); left: 0; z-index: 20; min-width: 190px; max-height: 240px; overflow-y: auto; background: #fff; border: 1px solid #d1d5db; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.18); padding: 4px; }
.recip-choice[b-upqye0if8i] { display: block; width: 100%; text-align: left; border: none; background: none; padding: 6px 8px; font-size: 12px; color: #111827; border-radius: 6px; cursor: pointer; }
.recip-choice:hover[b-upqye0if8i] { background: #f1f5f9; }
.recip-empty[b-upqye0if8i] { padding: 8px; font-size: 11px; color: #9ca3af; text-align: center; }

/* English header block */
.en-head[b-upqye0if8i] { display: flex; flex-direction: column; gap: 5px; margin-bottom: 22px; font-size: 12.5px; color: #1f2937; }
.en-meta .lbl[b-upqye0if8i] { display: inline-block; width: 118px; color: #6b7280; font-weight: 600; }

/* 결재란 (도장 그리드) — 두문 우측에 in-flow */
.seal-grid[b-upqye0if8i] { border-collapse: collapse; flex-shrink: 0; }
.seal-grid td[b-upqye0if8i] { border: 1px solid #111827; text-align: center; }
.seal-label[b-upqye0if8i] { width: 24px; font-size: 12px; font-weight: 700; letter-spacing: 2px; writing-mode: vertical-rl; padding: 6px 2px; background: #f3f4f6; }
.seal-role[b-upqye0if8i] { min-width: 62px; height: 22px; font-size: 11px; font-weight: 600; background: #f3f4f6; padding: 2px 6px; }
.seal-box[b-upqye0if8i]  { height: 54px; }

/* 붙임 / Enclosures */
.doc-attach[b-upqye0if8i] { margin-top: 26px; font-size: 13px; color: #1f2937; }
.doc-attach .lbl[b-upqye0if8i] { font-weight: 700; margin-right: 10px; }

/* 발신명의 / sender */
.doc-sender[b-upqye0if8i] { display: flex; align-items: center; justify-content: center; gap: 10px; font-size: 16px; font-weight: 800; letter-spacing: 1.5px; color: #111827; margin-top: 48px; }
.doc-seal-img[b-upqye0if8i] { height: 52px; width: 52px; object-fit: contain; }
.doc-seal-mark[b-upqye0if8i] { font-size: 11px; font-weight: 600; color: #9ca3af; vertical-align: middle; }
.doc-foot-note[b-upqye0if8i] { margin-top: 20px; padding-top: 10px; border-top: 1px dashed #e5e7eb; font-size: 10px; color: #9ca3af; text-align: center; }

.a4-title[b-upqye0if8i] { text-align: center; font-size: 22px; font-weight: 800; letter-spacing: -0.5px; margin: 8px 0 28px; color: #111827; }
.a4-body[b-upqye0if8i]  { white-space: pre-wrap; min-height: 200px; color: #1f2937; }

.a4-title-input[b-upqye0if8i] {
    width: 100%; text-align: center; font-size: 22px; font-weight: 800; letter-spacing: -0.5px;
    border: none; border-bottom: 1px dashed #d1d5db; padding: 4px 0; margin: 8px 0 24px;
    color: #111827; background: transparent;
}
.a4-title-input:focus[b-upqye0if8i] { outline: none; border-bottom-color: #9ca3af; }
.a4-body-input[b-upqye0if8i] {
    width: 100%; min-height: 360px; resize: vertical;
    border: 1px dashed #e5e7eb; border-radius: 4px; padding: 10px 12px;
    font-size: 14px; line-height: 1.7; color: #1f2937; background: transparent; font-family: inherit;
}
.a4-body-input:focus[b-upqye0if8i] { outline: none; border-color: #9ca3af; }

/* 도장칸 — 템플릿에선 'Sealed' 텍스트(실제 도장은 결재 단계). */
.seal-mark[b-upqye0if8i] { font-size: 11px; font-weight: 600; color: #9ca3af; letter-spacing: 0.5px; }
.kr-stamp[b-upqye0if8i] { display: block; width: 46px; height: 46px; margin: 0 auto; color: #c0392b; }
.en-stamp[b-upqye0if8i] { position: absolute; top: 2px; right: 6px; width: 150px; height: 90px; color: #1e40af; opacity: 0.85; pointer-events: none; }

.seal-block[b-upqye0if8i] { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.seal-edit[b-upqye0if8i] { display: flex; align-items: center; gap: 6px; }
.seal-edit-btn[b-upqye0if8i] { border: 1px dashed #c0392b; background: #fff; color: #c0392b; border-radius: 6px; padding: 2px 9px; font-size: 11px; cursor: pointer; }
.seal-edit-btn.ok[b-upqye0if8i] { border-style: solid; background: #c0392b; color: #fff; }
.seal-edit-input[b-upqye0if8i] { width: 82px; height: 26px; border: 1px solid #d1d5db; border-radius: 6px; padding: 0 8px; font-size: 13px; text-align: center; }

/* Western sign-off block (English) — 도장 그리드 대신 하단 서명란 */
.signoff[b-upqye0if8i] { position: relative; margin-top: 56px; border-top: 1px solid #d1d5db; padding-top: 22px; }
.signoff-title[b-upqye0if8i] { font-size: 12px; font-weight: 700; letter-spacing: 0.6px; text-transform: uppercase; color: #374151; margin-bottom: 20px; }
.signoff-row[b-upqye0if8i] { display: flex; align-items: flex-end; gap: 28px; margin-bottom: 30px; }
.signoff-role[b-upqye0if8i] { width: 92px; font-size: 12px; font-weight: 600; color: #6b7280; padding-bottom: 4px; }
.signoff-line[b-upqye0if8i] { flex: 1; border-bottom: 1px solid #111827; height: 30px; position: relative; }
.signoff-line.date[b-upqye0if8i] { max-width: 150px; }
.signoff-line .lbl[b-upqye0if8i] { position: absolute; bottom: -15px; left: 0; font-size: 10px; color: #9ca3af; }
.signoff-caption[b-upqye0if8i] { margin-top: 18px; font-size: 10px; color: #9ca3af; }
/* /Features/Org/Pages/CreateForm.razor.rz.scp.css */
/* [Form=Role 2026-06-26] Create Form 풀스크린 위저드 — 페이지 스코프.
   전체화면 takeover(EmptyLayout) · 온보딩 스타일 · 색 절제(그레이스케일 + 다크 액센트 #0f172a). */

.cf-screen[b-mk5x282u1k] {
    position: fixed;
    inset: 0;
    background: #fff;
    display: flex;
    flex-direction: column;
    overflow: auto;
    z-index: 50;
}

/* ── Top bar ── */
.cf-top[b-mk5x282u1k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}

.cf-brand[b-mk5x282u1k] {
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.5px;
    font-size: 1.05rem;
}

/* 위저드 상단 로고 — 텍스트 brand 대신 실제 로고, 키운 사이즈 */
.cf-logo[b-mk5x282u1k] { height: 34px; width: auto; display: block; }

.cf-close[b-mk5x282u1k] {
    background: none;
    border: none;
    font-size: 1rem;
    color: #94a3b8;
    cursor: pointer;
    padding: 0.25rem 0.55rem;
    border-radius: 8px;
    line-height: 1;
}

.cf-close:hover[b-mk5x282u1k] { background: #f1f5f9; color: #0f172a; }

/* ── Stage / wizard column ── */
.cf-stage[b-mk5x282u1k] {
    flex: 1;
    display: flex;
    justify-content: center;
    padding: 2.5rem 1.5rem 3rem;
}

.cf-wizard[b-mk5x282u1k] {
    width: 100%;
    max-width: 680px;
}

/* ── Progress ── */
.cf-progress[b-mk5x282u1k] { margin-bottom: 2rem; }

.cf-progress-row[b-mk5x282u1k] {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.6rem;
}

.cf-step-num[b-mk5x282u1k] {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #0f172a;
}

.cf-step-label[b-mk5x282u1k] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #94a3b8;
}

.cf-track[b-mk5x282u1k] {
    height: 4px;
    background: #f1f5f9;
    border-radius: 99px;
    overflow: hidden;
}

.cf-fill[b-mk5x282u1k] {
    height: 100%;
    background: #0f172a;
    border-radius: 99px;
    transition: width 0.25s ease;
}

/* ── Body ── */
.cf-body[b-mk5x282u1k] { min-height: 340px; }

.cf-h1[b-mk5x282u1k] {
    font-size: 1.5rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.5px;
    margin: 0 0 0.4rem;
}

.cf-desc[b-mk5x282u1k] {
    font-size: 0.92rem;
    color: #64748b;
    margin: 0 0 1.75rem;
    line-height: 1.5;
}

.cf-label[b-mk5x282u1k] {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #94a3b8;
    margin: 1.4rem 0 0.6rem;
}

.cf-input[b-mk5x282u1k] {
    width: 100%;
    padding: 0.65rem 0.9rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-size: 0.92rem;
    color: #0f172a;
    background: #fff;
    box-sizing: border-box;
}

.cf-input:focus[b-mk5x282u1k] { outline: none; border-color: #0f172a; }

.cf-textarea[b-mk5x282u1k] {
    min-height: 120px;
    resize: vertical;
    font-family: inherit;
    line-height: 1.5;
}

/* ── Selectable cards ── */
.cf-cards[b-mk5x282u1k] {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;   /* 3 types (Access/Document/Reporting) on one row */
    gap: 0.7rem;
}

.cf-card[b-mk5x282u1k] {
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.95rem 1.05rem;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
    cursor: pointer;
    transition: all 0.12s ease;
}

.cf-card:hover[b-mk5x282u1k] { border-color: #cbd5e1; }

.cf-card.on[b-mk5x282u1k] {
    border-color: #0f172a;
    background: #f8fafc;
    box-shadow: inset 0 0 0 1px #0f172a;
}

.cf-card-t[b-mk5x282u1k] { font-weight: 700; font-size: 0.95rem; color: #0f172a; }
.cf-card-d[b-mk5x282u1k] { font-size: 0.78rem; color: #64748b; line-height: 1.4; }

/* Review — the ONE formula this Form completes (scope⟨vars⟩ ⊢ seal-line ⟨mode·≥risk⟩). */
.cf-formula[b-mk5x282u1k] {
    margin: 0 0 1.4rem;
    padding: 1.1rem 1.2rem;
    border: 1px solid #0f172a;
    border-radius: 12px;
    background: #0f172a;
}
.cf-formula-cap[b-mk5x282u1k] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #94a3b8;
    margin-bottom: 0.6rem;
}
.cf-formula-code[b-mk5x282u1k] {
    display: block;
    font-family: ui-monospace, Menlo, Consolas, monospace;
    font-size: 0.95rem;
    line-height: 1.55;
    color: #f8fafc;
    word-break: break-word;
}
.cf-formula-note[b-mk5x282u1k] {
    margin-top: 0.7rem;
    font-size: 0.72rem;
    line-height: 1.5;
    color: #94a3b8;
}
.cf-formula-note strong[b-mk5x282u1k] { color: #cbd5e1; }

/* ── Action library list ── */
.cf-group[b-mk5x282u1k] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #cbd5e1;
    margin: 1.1rem 0 0.45rem;
}

/* Resource(entity) 아코디언 — head(펼침) + All(전부 담기). 2-층. */
.cf-res[b-mk5x282u1k] { display: flex; align-items: stretch; gap: 0.4rem; margin-top: 0.4rem; }
.cf-res-head[b-mk5x282u1k] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex: 1 1 auto;
    text-align: left;
    padding: 0.7rem 0.9rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    transition: all 0.12s ease;
}
.cf-res-head:hover[b-mk5x282u1k] { border-color: #cbd5e1; background: #f8fafc; }
.cf-res-chev[b-mk5x282u1k] { flex: none; width: 0.9rem; color: #94a3b8; font-size: 0.8rem; }
.cf-res-name[b-mk5x282u1k] { flex: 1 1 auto; font-weight: 700; font-size: 0.9rem; color: #0f172a; }
.cf-res-count[b-mk5x282u1k] {
    flex: none;
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    background: #f1f5f9;
    border-radius: 999px;
    padding: 0.1rem 0.5rem;
}
.cf-res-all[b-mk5x282u1k] {
    flex: none;
    padding: 0 0.8rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    color: #4f46e5;
    font-weight: 700;
    font-size: 0.75rem;
    cursor: pointer;
    transition: all 0.12s ease;
}
.cf-res-all:hover[b-mk5x282u1k] { border-color: #4f46e5; background: #eef2ff; }
.cf-res-body[b-mk5x282u1k] { margin: 0.4rem 0 0.2rem 0.6rem; }
.cf-noctl[b-mk5x282u1k] { padding: 0.45rem 0.6rem; font-size: 0.8rem; font-style: italic; }

/* picked control 체크 마크 (드로어 행 좌측). */
.cf-row-check[b-mk5x282u1k] { flex: none; width: 1rem; color: #4f46e5; font-weight: 800; font-size: 0.85rem; }

/* Policy 묶음 chips (Step 1 grant 영역). */
.cf-label-sub[b-mk5x282u1k] { font-weight: 400; color: #94a3b8; font-size: 0.78rem; }
.cf-chips[b-mk5x282u1k] { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.7rem; }
.cf-chip[b-mk5x282u1k] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.5rem 0.4rem 0.75rem;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    background: #f8fafc;
}
.cf-chip-name[b-mk5x282u1k] { font-weight: 600; font-size: 0.82rem; color: #0f172a; }
.cf-chip-scope[b-mk5x282u1k] { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.68rem; color: #94a3b8; }
.cf-chip-x[b-mk5x282u1k] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.1rem;
    height: 1.1rem;
    border: none;
    border-radius: 999px;
    background: #e2e8f0;
    color: #475569;
    font-size: 0.7rem;
    cursor: pointer;
}
.cf-chip-x:hover[b-mk5x282u1k] { background: #fecaca; color: #b91c1c; }

/* 드로어 푸터 — multi-select 는 골라도 안 닫히니 Done 으로 확정. */
.cf-drawer-foot[b-mk5x282u1k] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.9rem 1.2rem;
    border-top: 1px solid #e2e8f0;
    background: #fff;
}
.cf-drawer-count[b-mk5x282u1k] { font-size: 0.8rem; font-weight: 600; color: #64748b; }

.cf-list[b-mk5x282u1k] { display: flex; flex-direction: column; gap: 0.4rem; }

.cf-row[b-mk5x282u1k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    text-align: left;
    padding: 0.7rem 0.9rem;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    transition: all 0.12s ease;
}

.cf-row:hover[b-mk5x282u1k] { border-color: #cbd5e1; }

.cf-row.on[b-mk5x282u1k] {
    border-color: #0f172a;
    background: #f8fafc;
    box-shadow: inset 0 0 0 1px #0f172a;
}

.cf-row-main[b-mk5x282u1k] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; flex: 1 1 auto; }
.cf-row-t[b-mk5x282u1k] { font-weight: 600; font-size: 0.9rem; color: #0f172a; }

.cf-row-scope[b-mk5x282u1k] {
    font-family: ui-monospace, Menlo, Consolas, monospace;
    font-size: 0.72rem;
    color: #94a3b8;
}

.cf-risk[b-mk5x282u1k] {
    flex-shrink: 0;
    font-size: 0.7rem;
    font-weight: 600;
    color: #64748b;
    background: #f1f5f9;
    padding: 0.12rem 0.55rem;
    border-radius: 99px;
}

/* ── States / notes ── */
.cf-muted[b-mk5x282u1k] { color: #94a3b8; font-size: 0.85rem; padding: 0.6rem 0; }

.cf-note[b-mk5x282u1k] {
    font-size: 0.84rem;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 10px;
    padding: 0.8rem 1rem;
    margin-top: 1rem;
    line-height: 1.45;
}

.cf-todo[b-mk5x282u1k] {
    color: #94a3b8;
    border-style: dashed;
    border-color: #e2e8f0;
    background: #fff;
}

/* ── Review summary ── */
.cf-summary[b-mk5x282u1k] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}

.cf-sum[b-mk5x282u1k] {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.88rem;
}

.cf-sum:last-child[b-mk5x282u1k] { border-bottom: none; }
.cf-sum span:first-child[b-mk5x282u1k] { color: #94a3b8; font-weight: 600; }
.cf-sum span:last-child[b-mk5x282u1k] { color: #0f172a; font-weight: 600; }

/* ── Nav ── */
.cf-nav[b-mk5x282u1k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f5f9;
}

.cf-btn[b-mk5x282u1k] {
    background: #0f172a;
    color: #fff;
    border: none;
    padding: 0.6rem 1.4rem;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
}

.cf-btn:hover:not(:disabled)[b-mk5x282u1k] { background: #1e293b; }
.cf-btn:disabled[b-mk5x282u1k] { opacity: 0.6; cursor: not-allowed; }

/* spinner on the Create button */
.cf-btn[b-mk5x282u1k] { display: inline-flex; align-items: center; gap: 0.5rem; }
.cf-spinner[b-mk5x282u1k] {
    width: 0.9rem; height: 0.9rem;
    border: 2px solid rgba(255,255,255,0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: cf-spin-b-mk5x282u1k 0.6s linear infinite;
}
@keyframes cf-spin-b-mk5x282u1k { to { transform: rotate(360deg); } }

.cf-btn-ghost[b-mk5x282u1k] {
    background: none;
    border: 1px solid #e2e8f0;
    color: #475569;
    padding: 0.6rem 1.2rem;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
}

.cf-btn-ghost:hover[b-mk5x282u1k] { background: #f8fafc; }

/* ── [per-Form 2026-07-01] Step 2 inline editor rows — one clean line each (Sonny) ── */
.cf-hint[b-mk5x282u1k] { font-size: 0.78rem; color: #94a3b8; margin: 0.5rem 0 0; }

/* [2026-07-10] 결재 컬럼 헤더 — row(.cf-row-edit) 구조와 폭 정렬(idx 1.1rem + label 120px + role flex:1). */
.cf-col-heads[b-mk5x282u1k] { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.6rem; }
.cf-col-heads .cf-col-idx-spacer[b-mk5x282u1k] { width: 1.1rem; flex: none; }
.cf-col-head[b-mk5x282u1k] { font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: #94a3b8; }
.cf-col-head-label[b-mk5x282u1k] { width: 120px; flex: none; }
.cf-col-head-role[b-mk5x282u1k] { flex: 1; }

.cf-rows[b-mk5x282u1k] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.35rem; }

/* [2026-07-10] 결재자 미매핑 경고 — Next 막힌 이유 표시. */
.cf-warn[b-mk5x282u1k] { margin-top: 0.6rem; font-size: 0.8rem; font-weight: 600; color: #b45309; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: 0.55rem 0.7rem; }

.cf-row-edit[b-mk5x282u1k] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: nowrap; }
.cf-row-edit .cf-input[b-mk5x282u1k] { width: auto; padding: 0.5rem 0.6rem; font-size: 0.85rem; border-radius: 8px; }

.cf-row-idx[b-mk5x282u1k]   { width: 1.1rem; flex: none; text-align: center; color: #94a3b8; font-size: 0.8rem; }
.cf-row-label[b-mk5x282u1k] { width: 120px; flex: none; }
.cf-row-sel[b-mk5x282u1k]   { width: 140px; flex: none; }
.cf-row-grow[b-mk5x282u1k]  { flex: 1 1 auto; min-width: 0; }

/* Drafter(담당) — fixed first column, no dropdown. */
.cf-drafter-tag[b-mk5x282u1k] {
    flex: 1 1 auto; min-width: 0;
    display: inline-flex; align-items: center;
    padding: 0.5rem 0.7rem;
    font-size: 0.82rem; color: #475569;
    background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 8px;
}

.cf-row-btn[b-mk5x282u1k] {
    flex: none;
    width: 2rem; height: 2rem;
    border: 1px solid #e2e8f0; border-radius: 8px;
    background: #fff; color: #475569; cursor: pointer;
    font-size: 0.9rem; line-height: 1;
}
.cf-row-btn:hover:not(:disabled)[b-mk5x282u1k] { background: #f8fafc; }
.cf-row-btn.danger[b-mk5x282u1k] { color: #dc2626; }
.cf-row-btn:disabled[b-mk5x282u1k] { opacity: 0.4; cursor: not-allowed; }

.cf-add[b-mk5x282u1k] { margin-top: 0.7rem; }

/* ── Target picker trigger / selected ── */
.cf-picker[b-mk5x282u1k] {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem 1rem;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
    transition: all 0.12s ease;
}

.cf-picker:hover[b-mk5x282u1k] { border-color: #0f172a; background: #f8fafc; }
.cf-picker-text[b-mk5x282u1k] { font-size: 0.9rem; color: #64748b; }
.cf-picker-chev[b-mk5x282u1k] { font-size: 0.95rem; color: #94a3b8; }

.cf-picked[b-mk5x282u1k] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid #0f172a;
    border-radius: 10px;
    background: #f8fafc;
}

.cf-picked-main[b-mk5x282u1k] { display: flex; flex-direction: column; gap: 0.15rem; min-width: 0; }
.cf-picked-meta[b-mk5x282u1k] { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }

.cf-change[b-mk5x282u1k] {
    background: none;
    border: 1px solid #cbd5e1;
    color: #475569;
    padding: 0.3rem 0.7rem;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
}

.cf-change:hover[b-mk5x282u1k] { background: #fff; border-color: #0f172a; }

.cf-badge[b-mk5x282u1k] {
    flex-shrink: 0;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: #475569;
    background: #e2e8f0;
    padding: 0.14rem 0.5rem;
    border-radius: 99px;
}

/* ── Right slide-over drawer (di-drawer 패턴) ── */
.cf-drawer-overlay[b-mk5x282u1k] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    z-index: 1000;
    display: flex;
    justify-content: flex-end;
}

.cf-drawer[b-mk5x282u1k] {
    width: 480px;
    max-width: 92vw;
    height: 100%;
    background: #fff;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.18);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.cf-drawer-head[b-mk5x282u1k] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding: 1.25rem 1.5rem 1rem;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}

.cf-drawer-title[b-mk5x282u1k] { font-size: 1.05rem; font-weight: 800; color: #0f172a; letter-spacing: -0.3px; }
.cf-drawer-sub[b-mk5x282u1k] { font-size: 0.8rem; color: #94a3b8; margin-top: 0.15rem; }

.cf-x[b-mk5x282u1k] {
    background: none;
    border: none;
    font-size: 1.5rem;
    line-height: 1;
    color: #94a3b8;
    cursor: pointer;
}

.cf-x:hover[b-mk5x282u1k] { color: #0f172a; }

.cf-tabs[b-mk5x282u1k] {
    display: flex;
    gap: 0.25rem;
    padding: 0.6rem 1.5rem 0;
    border-bottom: 1px solid #f1f5f9;
    flex-shrink: 0;
}

.cf-tab[b-mk5x282u1k] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.5rem 0.4rem 0.7rem;
    margin-bottom: -1px;
    font-size: 0.86rem;
    font-weight: 600;
    color: #94a3b8;
    cursor: pointer;
}

.cf-tab:hover[b-mk5x282u1k] { color: #475569; }
.cf-tab.on[b-mk5x282u1k] { color: #0f172a; border-bottom-color: #0f172a; }

.cf-tab-count[b-mk5x282u1k] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #64748b;
    background: #f1f5f9;
    padding: 0.05rem 0.45rem;
    border-radius: 99px;
}

.cf-drawer-body[b-mk5x282u1k] {
    padding: 0.75rem 1.5rem 1.5rem;
    flex: 1;
    overflow-y: auto;
}

/* Action Library 검색 */
.cf-search[b-mk5x282u1k] {
    padding: 0.75rem 1.5rem 0;
    flex-shrink: 0;
}
.cf-search-input[b-mk5x282u1k] {
    width: 100%;
    font-size: 0.85rem;
    padding: 0.5rem 0.7rem;
}

@media (max-width: 640px) {
    .cf-cards[b-mk5x282u1k] { grid-template-columns: 1fr; }
}
/* /Features/Org/Pages/Members.razor.rz.scp.css */
/* Members.razor.css — CSS variable 기반 */
.summary-card[b-5olu85pshl] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem; /* 2026-04-17: 1.25 → 1.65 (카드 높이 증가) */
    box-shadow:    var(--ah-shadow-sm);
}

.summary-value[b-5olu85pshl] { font-size: 1.75rem; font-weight: 800; color: var(--ah-text); letter-spacing: -1px; line-height: 1; }
.summary-label[b-5olu85pshl] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem; }

.slug-mono[b-5olu85pshl] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.7rem; color: var(--ah-text-muted); }

.tier-badge[b-5olu85pshl] {
    font-size:     0.7rem;
    font-weight:   600;
    padding:       0.25rem 0.6rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}

.section-title[b-5olu85pshl] { font-size: 0.7rem; font-weight: 800; color: var(--ah-text-sub); text-transform: uppercase; letter-spacing: 0.03em; }

.table-container[b-5olu85pshl] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-sm);
    /* overflow: visible — 케밥(3-dot) 드롭다운이 카드 밖으로 나가야 안 잘림.
       모서리 라운드는 상단 tab-header-bar / 하단 page-count(둘 다 투명)가 만들어 유지됨. */
    overflow:      visible;
}

/* [2026-07-09] Requests&Approvals 페이지의 .ra-filter 탭 스타일 재사용 — 흰 pill + 얇은 테두리 + navy 활성.
   테이블 밖 standalone 바. revert: 이 블록을 git으로 되돌리면 원복. */
.tab-header-bar[b-5olu85pshl] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         0 0.25rem;   /* 카드 밖 — 좌우 정렬만 */
    margin-bottom:   1rem;        /* 아래 테이블 카드와 간격 */
}
.tab-header-bar .d-flex[b-5olu85pshl] { gap: 0.4rem; }

.member-tab[b-5olu85pshl] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    background: #fff; border: 1px solid #e2e8f0; color: #64748b;
    padding: 0.4rem 0.9rem; border-radius: 8px;
    font-size: 0.84rem; font-weight: 600; cursor: pointer; transition: all 0.12s ease;
}
.member-tab:hover[b-5olu85pshl]  { border-color: #cbd5e1; color: #334155; }
.member-tab.active[b-5olu85pshl] { background: #0f172a; border-color: #0f172a; color: #fff; }
/* 활성 navy pill 위 카운트 배지는 반전(흰 배경/navy 글자) — 인라인 스타일이라 !important 필요. */
.member-tab.active span[b-5olu85pshl] { background: #fff !important; color: #0f172a !important; }

.member-table[b-5olu85pshl] { width: 100%; border-collapse: separate; border-spacing: 0; }

.member-table th[b-5olu85pshl] {
    font-size:        0.7rem;
    font-weight:      500;                /* [2026-07-09] bold → 얇게(500) */
    text-transform:   uppercase;
    letter-spacing:   0.03em;
    color:            #0f172a;            /* gray → 검정 */
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.75rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}

.member-table td[b-5olu85pshl] {
    padding:        1rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.85rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}

.member-table tbody tr[b-5olu85pshl]           { cursor: pointer; transition: background 0.1s; }
.member-table tbody tr:hover[b-5olu85pshl]     { background-color: var(--ah-bg-subtle); }
.member-table tbody tr:last-child td[b-5olu85pshl] { border-bottom: none; }

.member-avatar[b-5olu85pshl] {
    width:           36px;
    height:          36px;
    border-radius:   50%;
    background:      var(--ah-bg-surface);
    color:           var(--ah-text-sub);
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-weight:     700;
    font-size:       0.8rem;
    flex-shrink:     0;
}

.member-name[b-5olu85pshl] { font-weight: 700; color: var(--ah-text); font-size: 0.85rem; }
.member-sub[b-5olu85pshl]  { font-size: 0.65rem; color: var(--ah-text-muted); }
.member-mono[b-5olu85pshl] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; color: var(--ah-text-muted); }

.role-badge[b-5olu85pshl] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}
.role-badge.owner[b-5olu85pshl] { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }

.kyc-badge[b-5olu85pshl] { font-size: 0.65rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; border: 1px solid var(--ah-border); }
.kyc-badge.verified[b-5olu85pshl]  { background: var(--ah-success-bg); color: #166534; border-color: var(--ah-success-border); }
.kyc-badge.pending[b-5olu85pshl]   { background: var(--ah-warning-bg); color: #92400e; border-color: var(--ah-warning-border); }
.kyc-badge.rejected[b-5olu85pshl]  { background: var(--ah-danger-bg);  color: var(--ah-danger); border-color: var(--ah-danger-border); }

.last-active-text[b-5olu85pshl] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text-muted); white-space: nowrap; }
.supervisor-text[b-5olu85pshl]  { font-size: 0.8rem; color: var(--ah-text); font-weight: 600; }
.supervisor-none[b-5olu85pshl]  { font-size: 0.75rem; color: var(--ah-text-placeholder); }

.invite-btn[b-5olu85pshl] {
    background:    var(--ah-text);
    color:         var(--ah-bg);
    border:        none;
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.6rem 1.5rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    opacity 0.15s;
}
.invite-btn:hover[b-5olu85pshl] { opacity: 0.85; }

/* PR #21 (5/15) — active IdP 시 invite 자리에 표시되는 read-only badge. */
.invite-managed-badge[b-5olu85pshl] {
    display: inline-flex;
    align-items: center;
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    padding: 0.55rem 1rem;
    border-radius: 6px;
    cursor: default;
}
.invite-managed-badge i[b-5olu85pshl] { color: #0f172a; }

.page-count[b-5olu85pshl] { font-size: 0.7rem; color: var(--ah-text-muted); padding: 0.75rem 1.25rem; text-align: right; border-top: 1px solid var(--ah-bg-subtle); }
.page-count strong[b-5olu85pshl] { color: var(--ah-text-sub); }

.filter-select[b-5olu85pshl] { font-size: 0.75rem; font-weight: 600; color: var(--ah-text-muted); border: none; background: transparent; cursor: pointer; appearance: none; padding-right: 1rem; }
.filter-select:focus[b-5olu85pshl] { outline: none; }

.modal-backdrop[b-5olu85pshl] {
    position:        fixed;
    inset:           0;
    background:      rgba(0,0,0,0.45);
    z-index:         1000;
    display:         flex;
    align-items:     center;
    justify-content: center;
}

.modal-panel[b-5olu85pshl] {
    background:    var(--ah-bg);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-lg);
    width:         440px;
    max-width:     90vw;
    padding:       2rem;
}

.modal-title[b-5olu85pshl]  { font-weight: 800; font-size: 1.1rem; color: var(--ah-text); letter-spacing: -0.3px; margin-bottom: 1.5rem; }

/* [2026-07-04 Sonny] Invite 모달 세로 과장 → 2열 그리드. 필드 짝 배치(Email|Name·Role|Team·Manager|Device),
   긴 안내문/기기 상세는 ig-full(풀폭). 좁은 화면은 1열 폴백. */
.modal-panel.invite-wide[b-5olu85pshl] { width: 720px; }
.invite-grid[b-5olu85pshl] { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; align-items: start; }
.invite-grid .ig-full[b-5olu85pshl] { grid-column: 1 / -1; }
@media (max-width: 680px) {
    .invite-grid[b-5olu85pshl] { grid-template-columns: 1fr; }
    .modal-panel.invite-wide[b-5olu85pshl] { width: 440px; }
}
.modal-label[b-5olu85pshl]  { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-sub); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.4rem; }

.modal-input[b-5olu85pshl] {
    width:         100%;
    height:        40px;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0 0.75rem;
    font-size:     0.85rem;
    color:         var(--ah-text);
    background:    var(--ah-bg);
    margin-bottom: 1.25rem;
    box-sizing:    border-box;
}
.modal-input:focus[b-5olu85pshl] { outline: none; border-color: var(--ah-text-muted); box-shadow: 0 0 0 2px rgba(148,163,184,0.15); }

.modal-select[b-5olu85pshl] {
    width:         100%;
    height:        40px;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0 0.75rem;
    font-size:     0.85rem;
    color:         var(--ah-text);
    background:    var(--ah-bg);
    margin-bottom: 1.25rem;
    box-sizing:    border-box;
}
.modal-select:focus[b-5olu85pshl] { outline: none; border-color: var(--ah-text-muted); }

.modal-actions[b-5olu85pshl] { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.5rem; }

.modal-cancel[b-5olu85pshl] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    color:         var(--ah-text-sub);
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.45rem 1rem;
    border-radius: 6px;
    cursor:        pointer;
}
.modal-cancel:hover[b-5olu85pshl] { background: var(--ah-bg-subtle); }

.status-pending-badge[b-5olu85pshl] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-warning-bg);
    color:         #92400e;
    border:        1px solid var(--ah-warning-border);
}

.resend-btn[b-5olu85pshl] {
    font-size:     0.72rem;
    font-weight:   600;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 5px;
    padding:       0.25rem 0.65rem;
    cursor:        pointer;
}
.resend-btn:hover[b-5olu85pshl] { background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); }

.cancel-invite-btn[b-5olu85pshl] {
    padding:       0.3rem 0.75rem;
    font-size:     0.78rem;
    font-weight:   600;
    border:        1px solid var(--ah-danger-border);
    background:    var(--ah-bg);
    color:         var(--ah-danger);
    border-radius: 6px;
    cursor:        pointer;
    transition:    background 0.15s;
}
.cancel-invite-btn:hover[b-5olu85pshl]    { background: var(--ah-danger-bg); }

/* ── 행 선택 ──────────────────────────────────────────────────────── */
/* [2026-06-17] 체크박스는 글로벌 .ah-checkbox 로 통일 (ah-components.css §25). */
.member-table tbody tr.row-selected[b-5olu85pshl]      { background-color: var(--ah-info-bg); }
.member-table tbody tr.row-selected:hover[b-5olu85pshl] { background-color: var(--ah-info-bg); }

/* ── 케밥(3-dot) 메뉴 ─────────────────────────────────────────────── */
.kebab-cell[b-5olu85pshl] { position: relative; text-align: right; padding-right: 1.25rem; }

.kebab-btn[b-5olu85pshl] {
    border:        none;
    background:    transparent;
    color:         var(--ah-text-muted);
    width:         30px;
    height:        30px;
    border-radius: 6px;
    cursor:        pointer;
    display:       inline-flex;
    align-items:   center;
    justify-content: center;
    transition:    all 0.12s;
}
.kebab-btn:hover[b-5olu85pshl] { background: var(--ah-bg-surface); color: var(--ah-text); }

.kebab-menu[b-5olu85pshl] {
    position:      absolute;
    top:           calc(100% - 4px);
    right:         1.25rem;
    z-index:       1001;
    min-width:     200px;
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 10px;
    box-shadow:    var(--ah-shadow-lg);
    padding:       0.35rem;
    display:       flex;
    flex-direction: column;
}
.kebab-menu button[b-5olu85pshl] {
    display:       flex;
    align-items:   center;
    width:         100%;
    border:        none;
    background:    none;
    text-align:    left;
    font-size:     0.82rem;
    font-weight:   500;
    color:         var(--ah-text);
    padding:       0.55rem 0.7rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    background 0.12s;
}
.kebab-menu button:hover[b-5olu85pshl] { background: var(--ah-bg-subtle); }
.kebab-menu button i[b-5olu85pshl]     { color: var(--ah-text-muted); font-size: 0.85rem; }

/* 메뉴 바깥 클릭 닫기용 투명 백드롭 */
.kebab-backdrop[b-5olu85pshl] { position: fixed; inset: 0; z-index: 1000; background: transparent; }

/* [2026-07-09] All Roles 커스텀 팝업 드롭다운 (native select 대체) — 버튼 큼직 + 케밥式 팝업 */
.ah-roledd[b-5olu85pshl] { position: relative; display: inline-flex; }
.ah-roledd-btn[b-5olu85pshl] {
    display: inline-flex; align-items: center; justify-content: space-between; gap: 0.6rem;
    min-width: 170px; background: #fff; border: 1px solid #e2e8f0; color: #334155;
    font-size: 0.84rem; font-weight: 600; padding: 0.55rem 0.95rem; border-radius: 8px;
    cursor: pointer; transition: border-color 0.12s;
}
.ah-roledd-btn:hover[b-5olu85pshl], .ah-roledd-btn.open[b-5olu85pshl] { border-color: #cbd5e1; }
.ah-roledd-btn i[b-5olu85pshl] { color: #64748b; font-size: 0.7rem; transition: transform 0.12s; }
.ah-roledd-btn.open i[b-5olu85pshl] { transform: rotate(180deg); }
.ah-roledd-backdrop[b-5olu85pshl] { position: fixed; inset: 0; z-index: 1000; background: transparent; }
.ah-roledd-menu[b-5olu85pshl] {
    position: absolute; top: calc(100% + 5px); right: 0; z-index: 1001;
    min-width: 190px; background: var(--ah-bg); border: 1px solid var(--ah-border);
    border-radius: 10px; box-shadow: var(--ah-shadow-lg); padding: 0.35rem;
    display: flex; flex-direction: column; max-height: 320px; overflow-y: auto;
}
.ah-roledd-menu button[b-5olu85pshl] {
    display: flex; align-items: center; width: 100%; border: none; background: none;
    text-align: left; font-size: 0.82rem; font-weight: 500; color: var(--ah-text);
    padding: 0.5rem 0.7rem; border-radius: 6px; cursor: pointer; transition: background 0.12s;
}
.ah-roledd-menu button:hover[b-5olu85pshl] { background: var(--ah-bg-subtle); }
.ah-roledd-menu button.sel[b-5olu85pshl] { background: #0f172a; color: #fff; font-weight: 600; }
.cancel-invite-btn:disabled[b-5olu85pshl] { opacity: 0.5; cursor: not-allowed; }
/* /Features/Org/Pages/NewRequest.razor.rz.scp.css */
/* [Form=Role 2026-06-27] New Request 작성 — A4 문서 풀스크린 + 인쇄. */

.nr-screen[b-vt7rdtoqql] { position: fixed; inset: 0; background: #e5e7eb; display: flex; flex-direction: column; z-index: 50; }

.nr-top[b-vt7rdtoqql] {
    display: flex; justify-content: space-between; align-items: center;
    padding: 0.85rem 1.5rem; background: #fff; border-bottom: 1px solid #e2e8f0; flex-shrink: 0;
}
.nr-brand-wrap[b-vt7rdtoqql] { display: flex; align-items: baseline; gap: 0.6rem; min-width: 0; }
.nr-brand[b-vt7rdtoqql] { font-weight: 800; color: #0f172a; letter-spacing: -0.3px; font-size: 1.05rem; flex: none; }
.nr-form-name[b-vt7rdtoqql] {
    font-size: 0.85rem; font-weight: 600; color: #475569;
    padding: 0.15rem 0.6rem; background: #f1f5f9; border-radius: 999px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 40vw;
}
.nr-top-actions[b-vt7rdtoqql] { display: flex; align-items: center; gap: 0.5rem; }

/* [개인 도장] Submit 도장 팝업 */
.nr-stamp-overlay[b-vt7rdtoqql] { position: fixed; inset: 0; background: rgba(15,23,42,0.45); z-index: 60; display: flex; align-items: center; justify-content: center; }
.nr-stamp-modal[b-vt7rdtoqql] { background: #fff; border-radius: 14px; width: 340px; max-width: 92vw; padding: 1.6rem 1.5rem 1.3rem; box-shadow: 0 20px 60px rgba(0,0,0,0.3); text-align: center; }
.nr-stamp-title[b-vt7rdtoqql] { font-size: 1.05rem; font-weight: 800; color: #0f172a; }
.nr-stamp-seal[b-vt7rdtoqql] { display: flex; justify-content: center; margin: 1.1rem 0 0.6rem; }
.nr-stamp-svg[b-vt7rdtoqql] { width: 96px; height: 96px; }
.nr-stamp-msg[b-vt7rdtoqql] { font-size: 0.85rem; color: #64748b; line-height: 1.5; margin-bottom: 1.2rem; }
.nr-stamp-actions[b-vt7rdtoqql] { display: flex; gap: 0.6rem; justify-content: center; }
.nr-stamp-go[b-vt7rdtoqql] { background: #c0392b; }
.nr-stamp-go:hover:not(:disabled)[b-vt7rdtoqql] { background: #a93226; }

.nr-btn[b-vt7rdtoqql] { background: #0f172a; color: #fff; border: none; padding: 0.55rem 1.3rem; border-radius: 9px; font-size: 0.88rem; font-weight: 600; cursor: pointer; }
.nr-btn:hover:not(:disabled)[b-vt7rdtoqql] { background: #1e293b; }
.nr-btn:disabled[b-vt7rdtoqql] { opacity: 0.4; cursor: not-allowed; }
.nr-btn-ghost[b-vt7rdtoqql] { background: #fff; border: 1px solid #e2e8f0; color: #475569; padding: 0.55rem 1.1rem; border-radius: 9px; font-size: 0.88rem; font-weight: 600; cursor: pointer; }
.nr-btn-ghost:hover:not(:disabled)[b-vt7rdtoqql] { background: #f8fafc; }
.nr-btn-ghost:disabled[b-vt7rdtoqql] { opacity: 0.5; cursor: not-allowed; }

/* [2026-07-11] 제출/서명 진행 스피너 — 버튼 글자색 따라감(currentColor). Windows Hello 서명+봉인 파이프라인 대기 표시. */
.nr-spin[b-vt7rdtoqql] { display: inline-block; width: 0.85em; height: 0.85em; margin-right: 0.45em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; vertical-align: -0.12em; animation: nr-spin-b-vt7rdtoqql 0.6s linear infinite; }
@keyframes nr-spin-b-vt7rdtoqql { to { transform: rotate(360deg); } }

.nr-doc-stage[b-vt7rdtoqql] { flex: 1; overflow-y: auto; padding: 2rem 1rem 3rem; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.nr-muted[b-vt7rdtoqql] { color: #64748b; font-size: 0.95rem; padding: 3rem; }

/* ── 인쇄: 헤더·회색배경 제거, A4 문서만 ── */
@media print {
    .nr-screen[b-vt7rdtoqql] { position: static; background: #fff; display: block; }
    .nr-noprint[b-vt7rdtoqql] { display: none !important; }
    .nr-doc-stage[b-vt7rdtoqql] { overflow: visible; padding: 0; display: block; }
}
/* /Features/Org/Pages/Notifications.razor.rz.scp.css */
/* Notifications.razor.css (Org) — /dashboard/notifications 디자인을 그대로 복제.
   원본: Features/Notification/Pages/NotificationPage.razor.css (CSS isolation 이라 컴포넌트별 복제) */

.summary-card[b-qy8l2yu0o3] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem;
    box-shadow:    var(--ah-shadow-sm);
}
.summary-value[b-qy8l2yu0o3] { font-size: 1.75rem; font-weight: 800; color: var(--ah-text); letter-spacing: -1px; line-height: 1; }
.summary-label[b-qy8l2yu0o3] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem; }

.filter-tab[b-qy8l2yu0o3] {
    background:    none;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0.35rem 0.85rem;
    font-size:     0.8rem;
    font-weight:   500;
    color:         var(--ah-text-muted);
    cursor:        pointer;
    transition:    all 0.15s;
}
.filter-tab:hover[b-qy8l2yu0o3]  { background: var(--ah-bg-subtle); color: var(--ah-text-sub); }
.filter-tab.active[b-qy8l2yu0o3] { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }

/* ── + Write 버튼 (Search 자리). compose modal 을 연다. ── */
.write-btn[b-qy8l2yu0o3] {
    background:     var(--ah-text);
    color:         var(--ah-bg);
    border:        1px solid var(--ah-text);
    font-weight:   600;
    font-size:     0.82rem;
    padding:       0.5rem 1.1rem;
    border-radius: 8px;
    cursor:        pointer;
    transition:    all 0.15s;
    display:       inline-flex;
    align-items:   center;
}
.write-btn:hover[b-qy8l2yu0o3] { opacity: 0.88; }

.notif-table[b-qy8l2yu0o3] { width: 100%; border-collapse: separate; border-spacing: 0; }

.notif-table th[b-qy8l2yu0o3] {
    font-size:        0.7rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.05em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.85rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}

.notif-table td[b-qy8l2yu0o3] {
    padding:        0.85rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.85rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}

.notif-table tbody tr:hover[b-qy8l2yu0o3]          { background-color: var(--ah-bg-subtle); }
.notif-table tbody tr:last-child td[b-qy8l2yu0o3]  { border-bottom: none; }
.notif-table tbody tr.row-unread[b-qy8l2yu0o3]     { background-color: var(--ah-bg-subtle); }
.notif-table tbody tr.row-unread:hover[b-qy8l2yu0o3] { background-color: var(--ah-bg-surface); }

.notif-title-text[b-qy8l2yu0o3] {
    font-size:   0.85rem;
    color:       var(--ah-text);
    line-height: 1.3;
}
.notif-message-text[b-qy8l2yu0o3] {
    font-size:              0.75rem;
    color:                  var(--ah-text-muted);
    margin-top:             2px;
    line-height:            1.3;
    display:                -webkit-box;
    -webkit-line-clamp:     1;
    line-clamp:             1;
    -webkit-box-orient:     vertical;
    overflow:               hidden;
}

.sev-badge[b-qy8l2yu0o3] {
    font-size:     0.7rem;
    font-weight:   600;
    padding:       0.15rem 0.5rem;
    border-radius: 4px;
    border:        1px solid;
}

.status-badge[b-qy8l2yu0o3] { font-size: 0.65rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; border: 1px solid; }
.status-badge.read[b-qy8l2yu0o3]   { background: var(--ah-bg-surface); color: var(--ah-text-muted); border-color: var(--ah-border); }
.status-badge.unread[b-qy8l2yu0o3] { background: var(--ah-info-bg);    color: var(--ah-info);       border-color: var(--ah-info-border); }

.empty-state[b-qy8l2yu0o3] { text-align: center; padding: 4rem 2rem; color: var(--ah-text-muted); }

.table-container[b-qy8l2yu0o3] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    overflow:      hidden;
    box-shadow:    var(--ah-shadow-sm);
    margin-bottom: 2rem;
}

/* ── 선택 / 삭제 ──────────────────────────────────────────────────── */
/* [2026-06-17] 체크박스는 글로벌 .ah-checkbox 로 통일 (ah-components.css §25). */
.row-selected[b-qy8l2yu0o3] { background-color: var(--ah-info-bg) !important; }

/* [2026-06-17] 선택 삭제 버튼은 글로벌 .ah-bulk-bar / .ah-btn-danger 로 통일 (ah-components.css §26). */

/* ── 펼친 내용 패널 (긴 본문 전체 표시) ──────────────────────────── */
.notif-table tbody tr.expand-row:hover[b-qy8l2yu0o3] { background-color: transparent; }
.notif-table tbody tr.expand-row td[b-qy8l2yu0o3]    { border-bottom: 1px solid var(--ah-bg-subtle); padding-top: 0; }

.expand-panel[b-qy8l2yu0o3] {
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 8px;
    padding:       0.9rem 1.1rem;
    margin:        0 0 0.6rem 0;
}
.expand-message[b-qy8l2yu0o3] {
    font-size:     0.85rem;
    color:         var(--ah-text);
    line-height:   1.55;
    white-space:   pre-wrap;       /* 줄바꿈 보존 */
    word-break:    break-word;
}
.expand-meta[b-qy8l2yu0o3] {
    display:     flex;
    flex-wrap:   wrap;
    gap:         1.1rem;
    margin-top:  0.75rem;
    padding-top: 0.6rem;
    border-top:  1px solid var(--ah-border);
    font-size:   0.72rem;
    color:       var(--ah-text-muted);
}

/* ── 첨부파일 (compose 업로드 chip / expand 다운로드 chip) ──────────── */
.attach-add[b-qy8l2yu0o3] {
    display:       inline-flex;
    align-items:   center;
    gap:           0.25rem;
    font-size:     0.8rem;
    font-weight:   600;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg);
    border:        1px dashed var(--ah-border);
    border-radius: 8px;
    padding:       0.5rem 0.9rem;
    cursor:        pointer;
    transition:    all 0.15s;
}
.attach-add:hover[b-qy8l2yu0o3]           { background: var(--ah-bg-subtle); border-color: var(--ah-text-muted); }
.attach-add.disabled[b-qy8l2yu0o3]        { opacity: 0.6; cursor: default; }

.attach-list[b-qy8l2yu0o3] {
    display:   flex;
    flex-wrap: wrap;
    gap:       0.4rem;
}
.attach-chip[b-qy8l2yu0o3] {
    display:       inline-flex;
    align-items:   center;
    gap:           0.35rem;
    font-size:     0.76rem;
    color:         var(--ah-text);
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0.3rem 0.55rem;
    max-width:     100%;
}
.attach-name[b-qy8l2yu0o3] {
    overflow:      hidden;
    text-overflow: ellipsis;
    white-space:   nowrap;
    max-width:     180px;
}
.attach-size[b-qy8l2yu0o3] { color: var(--ah-text-muted); font-size: 0.68rem; flex-shrink: 0; }
.attach-remove[b-qy8l2yu0o3] {
    border:      none;
    background:  none;
    color:       var(--ah-text-muted);
    font-size:   1rem;
    line-height: 1;
    cursor:      pointer;
    padding:     0 0 0 0.1rem;
}
.attach-remove:hover[b-qy8l2yu0o3] { color: var(--ah-danger); }

/* expand 패널의 다운로드 chip (링크) */
.attach-dl[b-qy8l2yu0o3] { text-decoration: none; transition: all 0.15s; }
.attach-dl:hover[b-qy8l2yu0o3] { background: var(--ah-bg-surface); border-color: var(--ah-text-muted); }
.attach-dl .bi-download[b-qy8l2yu0o3] { color: var(--ah-text-muted); font-size: 0.72rem; }

/* ── Compose modal 폼 필드 (넉넉한 높이) ─────────────────────────────── */
.compose-field[b-qy8l2yu0o3] {
    height:        46px;
    font-size:     0.9rem;
    border-radius: 8px;
}
/* textarea 는 고정높이 대신 넉넉한 min-height + 세로 리사이즈 */
textarea.compose-field.compose-textarea[b-qy8l2yu0o3] {
    height:     auto;
    min-height: 160px;
    resize:     vertical;
}

/* Recipients — 큼직한 옵션 행 */
.recip-list[b-qy8l2yu0o3] { display: flex; flex-direction: column; gap: 0.5rem; }
.recip-option[b-qy8l2yu0o3] {
    display:       flex;
    align-items:   center;
    gap:           0.65rem;
    padding:       0.75rem 0.95rem;
    border:        1px solid var(--ah-border);
    border-radius: 10px;
    cursor:        pointer;
    font-size:     0.92rem;
    color:         var(--ah-text);
    transition:    all 0.15s;
    margin:        0;
}
.recip-option:hover[b-qy8l2yu0o3]     { background: var(--ah-bg-subtle); }
.recip-option.selected[b-qy8l2yu0o3]  { border-color: var(--ah-text); background: var(--ah-bg-subtle); }
.recip-option input[type=radio][b-qy8l2yu0o3] {
    width:        18px;
    height:       18px;
    accent-color: var(--ah-link);
    cursor:       pointer;
    flex-shrink:  0;
}

/* Specific members — 멤버가 많아도(20+) 스크롤, 디자인 안 깨짐 */
.member-scroll[b-qy8l2yu0o3] { max-height: 240px; overflow-y: auto; }
.member-row[b-qy8l2yu0o3] {
    display:       flex;
    align-items:   center;
    gap:           0.55rem;
    padding:       0.5rem 0.7rem;
    font-size:     0.84rem;
    color:         var(--ah-text);
    border-radius: 6px;
    cursor:        pointer;
    margin:        0;
}
.member-row:hover[b-qy8l2yu0o3] { background: var(--ah-bg-subtle); }
.member-row input[type=checkbox][b-qy8l2yu0o3] {
    width:        16px;
    height:       16px;
    accent-color: var(--ah-link);
    cursor:       pointer;
    flex-shrink:  0;
}
/* /Features/Org/Pages/OnboardingSetup.razor.rz.scp.css */
/* Phase 1 E1 onboarding wizard — skeleton styles (PR #1, 5/15). */

/* LandingLayout 의 .landing-content 가 flex+align-items:center 라 직계 section 들은 자동
   수평 중앙 정렬. 좌측 stretch 가 필요한 케이스가 아니므로 그대로 두되, 내부 container 는
   top nav 의 landing-header-inner 폭 (max-width: 1280px / padding: 64px) 에 맞춤. */
.onboarding-section[b-x4r3sqr7x1] {
    width: 100%;
    align-self: stretch;
    /* top padding 늘려서 LandingLayout top nav 아래 충분한 호흡공간 — wizard 가 화면 중앙쪽으로 내려옴 */
    padding: 8rem 64px 6rem 64px;
}

.onboarding-container[b-x4r3sqr7x1] {
    /* PR #13 (5/15) — 사용자: "왜 여전히 왼쪽으로 되어있어?" → 가운데 정렬 복원.
       카드 grid 자체는 1-col 좌측 정렬 (아래 module-grid). container 는 가운데. */
    max-width: 720px;
    margin: 0 auto;
}

/* ── Progress ── */
.onboarding-progress[b-x4r3sqr7x1] {
    margin-bottom: 2.5rem;
}

.progress-label[b-x4r3sqr7x1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.75rem;
    font-size: 0.85rem;
}

.step-num[b-x4r3sqr7x1] {
    font-weight: 700;
    color: #0f172a;
    letter-spacing: 0.02em;
}

.step-title[b-x4r3sqr7x1] {
    color: #64748b;
    font-weight: 500;
}

.progress-track[b-x4r3sqr7x1] {
    width: 100%;
    height: 4px;
    background: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
}

.progress-fill[b-x4r3sqr7x1] {
    height: 100%;
    background: #0f172a;
    transition: width 0.3s ease;
}

/* ── Step body ── */
.onboarding-step[b-x4r3sqr7x1] {
    min-height: 320px;
    margin-bottom: 2.5rem;
}

.step-h1[b-x4r3sqr7x1] {
    font-size: 2rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: -0.02em;
    margin-bottom: 0.75rem;
}

.step-desc[b-x4r3sqr7x1] {
    font-size: 1rem;
    color: #475569;
    line-height: 1.6;
    margin-bottom: 2rem;
}

/* ── Step 1 — user-source picker ── */
.source-grid[b-x4r3sqr7x1] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

.source-card[b-x4r3sqr7x1] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.source-card:hover[b-x4r3sqr7x1] {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.source-card.selected[b-x4r3sqr7x1] {
    border-color: #0f172a;
    background: #f8fafc;
    box-shadow: 0 0 0 1px #0f172a inset;
}

.source-icon[b-x4r3sqr7x1] {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #f1f5f9;
    color: #0f172a;
    border-radius: 8px;
    font-size: 1.1rem;
}

.source-card.selected .source-icon[b-x4r3sqr7x1] {
    background: #0f172a;
    color: #fff;
}

.source-body[b-x4r3sqr7x1] {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.source-title[b-x4r3sqr7x1] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
}

.source-desc[b-x4r3sqr7x1] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.45;
}

.source-check[b-x4r3sqr7x1] {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #0f172a;
    color: #fff;
    border-radius: 50%;
    font-size: 0.85rem;
}

/* ── Step 2 — integration catalog ── */
.catalog-group[b-x4r3sqr7x1] {
    margin-bottom: 1.75rem;
}

.catalog-group:last-child[b-x4r3sqr7x1] {
    margin-bottom: 0;
}

.catalog-group-heading[b-x4r3sqr7x1] {
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    margin-bottom: 0.65rem;
    /* PR #14 (5/15) — heading text 시작점을 카드 안 체크박스 위치와 정렬.
       카드 padding-left (1rem) 만큼 indent + 체크박스 좌측 align. */
    padding: 0 1rem 0.4rem 1rem;
    border-bottom: 1px solid #f1f5f9;
}

.module-grid[b-x4r3sqr7x1] {
    /* PR #13 (5/15) — 사용자 directive: "예전처럼 두줄로" → 2-col 복원. */
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}

.module-card[b-x4r3sqr7x1] {
    display: flex;
    align-items: flex-start;
    /* [2026-07-15] 전역 button 스타일의 justify-content:center 오염 차단 — 카드 내용은 좌측 정렬.
       (미선언 시 전역/UA center 가 먹어 짧은 설명 카드(SAP)일수록 체크박스가 중앙으로 밀렸음.) */
    justify-content: flex-start;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
    /* grid item 의 기본 min-width:auto 가 긴 설명(더존/오라클 2줄)을 못 줄여서 카드가
       1fr 셀 밖으로 삐져나오던 정렬 버그 fix — min-width:0 으로 셀 안에서 wrap 강제. */
    min-width: 0;
}

.module-card:hover[b-x4r3sqr7x1] {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.module-card.selected[b-x4r3sqr7x1] {
    /* [2026-07-15] 검정 테두리 제거 — 선택 표시는 체크박스 채움(아래 .module-check)으로만. */
    border-color: #cbd5e1;
    background: #f8fafc;
}

.module-check[b-x4r3sqr7x1] {
    flex: 0 0 auto;
    font-size: 1.05rem;
    color: #94a3b8;
    line-height: 1;
    padding-top: 1px;
}

.module-card.selected .module-check[b-x4r3sqr7x1] {
    color: #0f172a;
}

.module-body[b-x4r3sqr7x1] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    /* flex item 도 min-width:0 으로 — 긴 설명이 body 폭을 밀어내지 않고 줄바꿈되게. */
    min-width: 0;
}

.module-title[b-x4r3sqr7x1] {
    font-size: 0.88rem;
    font-weight: 700;
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.module-badge[b-x4r3sqr7x1] {
    font-size: 0.6rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 4px;
    background: #f1f5f9;
    color: #475569;
    line-height: 1.2;
}

/* DEFAULT badge — tier_general 카드 강조 (검정 톤, 다른 badge 와 구분). */
.module-badge-default[b-x4r3sqr7x1] {
    background: #0f172a;
    color: #fff;
}

.module-desc[b-x4r3sqr7x1] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.45;
}

/* [2026-07-15] Business-tier 확인 팝업 */
.biz-modal-backdrop[b-x4r3sqr7x1] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 1rem;
}

.biz-modal[b-x4r3sqr7x1] {
    background: #fff;
    border-radius: 14px;
    padding: 1.5rem;
    max-width: 380px;
    width: 100%;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.22);
}

.biz-modal-title[b-x4r3sqr7x1] {
    font-size: 1rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 0.55rem;
}

.biz-modal-body[b-x4r3sqr7x1] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.55;
    margin-bottom: 1.35rem;
}

.biz-modal-actions[b-x4r3sqr7x1] {
    display: flex;
    gap: 0.6rem;
    justify-content: flex-end;
}

.biz-btn-skip[b-x4r3sqr7x1],
.biz-btn-go[b-x4r3sqr7x1] {
    font-family: inherit;
    font-size: 0.83rem;
    font-weight: 600;
    padding: 0.5rem 0.95rem;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}

.biz-btn-skip[b-x4r3sqr7x1] {
    background: #fff;
    border: 1px solid #cbd5e1;
    color: #475569;
}

.biz-btn-skip:hover[b-x4r3sqr7x1] {
    background: #f8fafc;
}

.biz-btn-go[b-x4r3sqr7x1] {
    background: #4338ca;
    border: 1px solid #4338ca;
    color: #fff;
}

.biz-btn-go:hover[b-x4r3sqr7x1] {
    background: #3730a3;
}

/* ── Step 3 — welcome summary ── */
.summary-card[b-x4r3sqr7x1] {
    padding: 1.5rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.summary-row[b-x4r3sqr7x1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid #e2e8f0;
}

.summary-row:last-child[b-x4r3sqr7x1] {
    border-bottom: none;
    padding-bottom: 0;
}

.summary-row:first-child[b-x4r3sqr7x1] {
    padding-top: 0;
}

.summary-label[b-x4r3sqr7x1] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.summary-value[b-x4r3sqr7x1] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #0f172a;
    text-align: right;
}

.summary-value em[b-x4r3sqr7x1] {
    color: #94a3b8;
    font-style: italic;
    font-weight: 500;
}

/* Selected modules 를 chip 으로 표시 (count 만 → 이름 나열) */
.summary-modules[b-x4r3sqr7x1] {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    justify-content: flex-end;
}

.summary-chip[b-x4r3sqr7x1] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #0f172a;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 2px 10px;
    line-height: 1.45;
}

/* PR #24 (5/15) — OnFinish PUT error banner */
.finish-error[b-x4r3sqr7x1] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin: 1rem 0;
    padding: 0.85rem 1rem;
    background: #fef2f2;
    border: 1px solid #fca5a5;
    border-radius: 8px;
}
.finish-error-icon[b-x4r3sqr7x1] { color: #b91c1c; font-size: 1.1rem; }
.finish-error-body[b-x4r3sqr7x1] { flex: 1; }
.finish-error-title[b-x4r3sqr7x1] { font-size: 0.85rem; font-weight: 700; color: #991b1b; margin-bottom: 0.2rem; }
.finish-error-msg[b-x4r3sqr7x1] { font-size: 0.78rem; color: #7f1d1d; line-height: 1.5; word-break: break-word; }
.finish-error-dismiss[b-x4r3sqr7x1] {
    background: transparent; border: none; color: #991b1b;
    font-size: 1.2rem; cursor: pointer; padding: 0 0.4rem;
}

/* PR #21 (5/15) — IdP confirmation modal */
.idp-confirm-backdrop[b-x4r3sqr7x1] {
    position: fixed; inset: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex; align-items: center; justify-content: center;
    z-index: 1000;
}
.idp-confirm-modal[b-x4r3sqr7x1] {
    background: #fff;
    max-width: 480px; width: 90%;
    border-radius: 12px;
    padding: 1.75rem 1.75rem 1.5rem 1.75rem;
    box-shadow: 0 12px 48px rgba(0, 0, 0, 0.25);
}
.idp-confirm-title[b-x4r3sqr7x1] {
    font-size: 1.1rem; font-weight: 800; color: #0f172a;
    margin: 0 0 0.75rem 0;
}
.idp-confirm-body[b-x4r3sqr7x1] {
    font-size: 0.88rem; color: #475569; line-height: 1.55;
    margin: 0 0 0.85rem 0;
}
.idp-confirm-note[b-x4r3sqr7x1] {
    font-size: 0.78rem; color: #64748b;
    background: #f8fafc; border: 1px solid #e2e8f0;
    border-radius: 8px; padding: 0.65rem 0.85rem;
    margin-bottom: 1.25rem;
}
.idp-confirm-email[b-x4r3sqr7x1] {
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size: 0.85rem; color: #0f172a; font-weight: 700;
}
.idp-confirm-actions[b-x4r3sqr7x1] {
    display: flex; gap: 0.5rem; justify-content: flex-end;
}

/* ── Nav ── */
.onboarding-nav[b-x4r3sqr7x1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding-top: 1.5rem;
    border-top: 1px solid #f1f5f9;
}

.nav-left[b-x4r3sqr7x1],
.nav-right[b-x4r3sqr7x1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.btn-back[b-x4r3sqr7x1],
.btn-skip[b-x4r3sqr7x1],
.btn-next[b-x4r3sqr7x1] {
    font-family: inherit;
    font-size: 0.9rem;
    font-weight: 600;
    padding: 0.65rem 1.25rem;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.15s ease;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.btn-back[b-x4r3sqr7x1] {
    background: transparent;
    border: 1px solid #e2e8f0;
    color: #475569;
}

.btn-back:hover:not(:disabled)[b-x4r3sqr7x1] {
    background: #f8fafc;
    border-color: #cbd5e1;
}

.btn-skip[b-x4r3sqr7x1] {
    background: transparent;
    border: none;
    color: #64748b;
}

.btn-skip:hover:not(:disabled)[b-x4r3sqr7x1] {
    color: #0f172a;
    text-decoration: underline;
}

.btn-next[b-x4r3sqr7x1] {
    background: #0f172a;
    border: 1px solid #0f172a;
    color: #fff;
}

.btn-next:hover:not(:disabled)[b-x4r3sqr7x1] {
    background: #1e293b;
    border-color: #1e293b;
}

.btn-back:disabled[b-x4r3sqr7x1],
.btn-skip:disabled[b-x4r3sqr7x1],
.btn-next:disabled[b-x4r3sqr7x1] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ── Mobile ── */
@media (max-width: 640px) {
    .onboarding-section[b-x4r3sqr7x1] {
        padding: 3rem 20px 3rem 20px;
    }

    .step-h1[b-x4r3sqr7x1] {
        font-size: 1.5rem;
    }

    .module-grid[b-x4r3sqr7x1] {
        grid-template-columns: 1fr;
    }

    .summary-row[b-x4r3sqr7x1] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.25rem;
    }

    .summary-value[b-x4r3sqr7x1] {
        text-align: left;
    }

    .onboarding-nav[b-x4r3sqr7x1] {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .nav-left[b-x4r3sqr7x1],
    .nav-right[b-x4r3sqr7x1] {
        width: 100%;
        justify-content: space-between;
    }

    .btn-back[b-x4r3sqr7x1],
    .btn-skip[b-x4r3sqr7x1],
    .btn-next[b-x4r3sqr7x1] {
        flex: 1;
        justify-content: center;
    }
}
/* /Features/Org/Pages/OrganizationSettings.razor.rz.scp.css */
/* OrganizationSettings — page-specific only.
   All common classes (card-panel, field-*, btn-*, modal-*, etc.)
   are now in wwwroot/css/ah-components.css */

/* [2026-07-10 Sonny] Settings 내부 여백 확대 — 모든 탭 카드에 더 넉넉한 패딩(색 변경 아님).
   .card-panel 은 전역(ah-components.css) 공유라 여기 스코프드 룰로만 이 페이지에서 덮어씀
   (Billing 등 타 페이지 영향 없음). 전역 1.5rem → 2.25rem. */
.card-panel[b-tx2u0yikcb] { padding: 2.25rem; }

/* ── SCIM Token ─────────────────────────────────────────────────────── */
.scim-token-row[b-tx2u0yikcb] {
    cursor: pointer;
    transition: background 0.1s;
}
.scim-token-row:hover[b-tx2u0yikcb] { background: var(--ah-bg-subtle); }
/* /Features/Org/Pages/RequestsApprovals.razor.rz.scp.css */
/* [Form=Role 2026-06-27] Requests & Approvals — 페이지 스코프. 색 절제(그레이스케일 + 상태색 최소). */

/* 툴바 = 필터 + 문서번호 조회 */
.ra-toolbar[b-fz9l9leyyo] { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin: 1rem 0 1.25rem; }
.ra-toolbar .ra-filters[b-fz9l9leyyo] { margin: 0; }

/* New Request = 채워진 버튼 (텍스트 링크처럼 보이던 invite-btn 대체) */
.ra-new-btn[b-fz9l9leyyo] { display: inline-flex; align-items: center; background: #0f172a; color: #fff; border: none; border-radius: 8px; padding: 0.55rem 1.1rem; font-size: 0.85rem; font-weight: 600; cursor: pointer; transition: background 0.15s; }
.ra-new-btn:hover[b-fz9l9leyyo] { background: #1e293b; }

.ra-lookup[b-fz9l9leyyo] { display: flex; align-items: center; gap: 0.4rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0.5rem 0.75rem; }
.ra-lookup-ico[b-fz9l9leyyo] { color: #94a3b8; font-size: 0.9rem; }
.ra-lookup-input[b-fz9l9leyyo] { border: none; outline: none; font-size: 0.85rem; min-width: 220px; background: transparent; color: #1f2937; padding: 0.15rem 0; }
.ra-lookup-btn[b-fz9l9leyyo] { border: none; background: #111827; color: #fff; border-radius: 6px; padding: 0.4rem 0.85rem; font-size: 0.8rem; font-weight: 600; cursor: pointer; }
.ra-lookup-btn:disabled[b-fz9l9leyyo] { opacity: 0.5; cursor: default; }

/* 리스트 부가 정보 */
.ra-docnum[b-fz9l9leyyo] { font-variant-numeric: tabular-nums; color: #64748b; }
.ra-attn[b-fz9l9leyyo] { color: #64748b; }

.ra-filters[b-fz9l9leyyo] { display: flex; gap: 0.4rem; margin: 1rem 0 1.25rem; flex-wrap: wrap; }

.ra-filter[b-fz9l9leyyo] {
    display: inline-flex; align-items: center; gap: 0.4rem;
    background: #fff; border: 1px solid #e2e8f0; color: #64748b;
    padding: 0.4rem 0.9rem; border-radius: 99px;
    font-size: 0.84rem; font-weight: 600; cursor: pointer; transition: all 0.12s ease;
}
.ra-filter:hover[b-fz9l9leyyo] { border-color: #cbd5e1; color: #334155; }
.ra-filter.on[b-fz9l9leyyo] { background: #0f172a; border-color: #0f172a; color: #fff; }

.ra-pill[b-fz9l9leyyo] { font-size: 0.7rem; font-weight: 700; background: #ef4444; color: #fff; border-radius: 99px; padding: 0.02rem 0.4rem; }
.ra-pill.ra-pill-neutral[b-fz9l9leyyo] { background: #0f172a; }   /* Drafts = 알림 아님 → 빨강 대신 검정 */
.ra-filter.on .ra-pill[b-fz9l9leyyo] { background: #fff; color: #0f172a; }

.ra-muted[b-fz9l9leyyo] { color: #94a3b8; font-size: 0.9rem; padding: 1.5rem 0; }
.ra-empty[b-fz9l9leyyo] {
    color: #64748b; font-size: 0.9rem; padding: 2rem; text-align: center;
    background: #f8fafc; border: 1px dashed #e2e8f0; border-radius: 12px;
}

.ra-list[b-fz9l9leyyo] { display: flex; flex-direction: column; gap: 0.5rem; }

.ra-item[b-fz9l9leyyo] {
    display: flex; justify-content: space-between; align-items: center; gap: 1rem;
    padding: 0.9rem 1.1rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px;
}

.ra-item-main[b-fz9l9leyyo] { min-width: 0; }
.ra-item-title[b-fz9l9leyyo] { font-size: 0.95rem; font-weight: 700; color: #0f172a; }
.ra-item-sub[b-fz9l9leyyo] { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.2rem; font-size: 0.78rem; color: #94a3b8; }
.ra-type[b-fz9l9leyyo] { font-weight: 600; color: #64748b; }
.ra-dot[b-fz9l9leyyo] { color: #cbd5e1; }

.ra-item-right[b-fz9l9leyyo] { display: flex; align-items: center; gap: 0.6rem; flex-shrink: 0; }

.ra-status[b-fz9l9leyyo] {
    font-size: 0.72rem; font-weight: 700; padding: 0.18rem 0.6rem; border-radius: 99px;
    background: #f1f5f9; color: #475569;
}
.ra-status.go[b-fz9l9leyyo] { background: #f1f5f9; color: #475569; }
.ra-status.ok[b-fz9l9leyyo] { background: #dcfce7; color: #166534; }
.ra-status.no[b-fz9l9leyyo] { background: #fee2e2; color: #991b1b; }
.ra-status.draft[b-fz9l9leyyo] { background: #fef9c3; color: #854d0e; }

.ra-act[b-fz9l9leyyo] {
    font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.85rem; border-radius: 8px;
    border: 1px solid transparent; cursor: pointer;
}
.ra-act.ok[b-fz9l9leyyo] { background: #0f172a; color: #fff; }
.ra-act.ok:hover:not(:disabled)[b-fz9l9leyyo] { background: #1e293b; }
.ra-act.no[b-fz9l9leyyo] { background: #fff; border-color: #e2e8f0; color: #991b1b; }
.ra-act.no:hover:not(:disabled)[b-fz9l9leyyo] { background: #fef2f2; border-color: #fecaca; }
.ra-act.edit[b-fz9l9leyyo] { background: #fff; border-color: #e2e8f0; color: #334155; }
.ra-act.edit:hover:not(:disabled)[b-fz9l9leyyo] { background: #f8fafc; border-color: #cbd5e1; }
.ra-act:disabled[b-fz9l9leyyo] { opacity: 0.5; cursor: not-allowed; }

/* [2026-07-11] 승인/반려 진행 스피너 — 버튼 글자색 따라감(Approve=흰색, Reject=빨강). Windows Hello 서명+봉인 대기. */
.ra-spin[b-fz9l9leyyo] { display: inline-block; width: 0.8em; height: 0.8em; margin-right: 0.4em; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; vertical-align: -0.1em; animation: ra-spin-b-fz9l9leyyo 0.6s linear infinite; }
@keyframes ra-spin-b-fz9l9leyyo { to { transform: rotate(360deg); } }

/* ── "+ New Request" modal ── */
.ra-modal-overlay[b-fz9l9leyyo] {
    position: fixed; inset: 0; background: rgba(15, 23, 42, 0.35);
    z-index: 1000; display: flex; align-items: center; justify-content: center;
}
.ra-modal[b-fz9l9leyyo] {
    width: 420px; max-width: 92vw; background: #fff; border-radius: 16px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.2); overflow: hidden;
}
.ra-modal-head[b-fz9l9leyyo] { font-size: 1.1rem; font-weight: 800; color: #0f172a; padding: 1.25rem 1.5rem 0.75rem; }
.ra-modal-body[b-fz9l9leyyo] { padding: 0 1.5rem 1rem; }
.ra-modal-label[b-fz9l9leyyo] { display: block; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #94a3b8; margin: 1rem 0 0.5rem; }
.ra-modal-select[b-fz9l9leyyo] { width: 100%; padding: 0.6rem 0.85rem; border: 1px solid #e2e8f0; border-radius: 10px; font-size: 0.92rem; color: #0f172a; background: #fff; }
.ra-modal-select:focus[b-fz9l9leyyo] { outline: none; border-color: #0f172a; }
.ra-note[b-fz9l9leyyo] { font-size: 0.85rem; color: #64748b; background: #f8fafc; border: 1px dashed #e2e8f0; border-radius: 10px; padding: 0.7rem 0.9rem; }

.ra-lang[b-fz9l9leyyo] { display: flex; gap: 0.4rem; }
.ra-lang-opt[b-fz9l9leyyo] { flex: 1; padding: 0.5rem; border: 1px solid #e2e8f0; border-radius: 9px; background: #fff; color: #64748b; font-size: 0.85rem; font-weight: 600; cursor: pointer; }
.ra-lang-opt:hover[b-fz9l9leyyo] { border-color: #cbd5e1; }
.ra-lang-opt.on[b-fz9l9leyyo] { border-color: #0f172a; background: #0f172a; color: #fff; }

.ra-modal-foot[b-fz9l9leyyo] { display: flex; justify-content: flex-end; gap: 0.5rem; padding: 0.75rem 1.5rem 1.25rem; border-top: 1px solid #f1f5f9; }
.ra-btn[b-fz9l9leyyo] { background: #0f172a; color: #fff; border: none; padding: 0.55rem 1.3rem; border-radius: 9px; font-size: 0.88rem; font-weight: 600; cursor: pointer; }
.ra-btn:hover:not(:disabled)[b-fz9l9leyyo] { background: #1e293b; }
.ra-btn:disabled[b-fz9l9leyyo] { opacity: 0.4; cursor: not-allowed; }
.ra-btn-ghost[b-fz9l9leyyo] { background: none; border: 1px solid #e2e8f0; color: #475569; padding: 0.55rem 1.1rem; border-radius: 9px; font-size: 0.88rem; font-weight: 600; cursor: pointer; }
.ra-btn-ghost:hover[b-fz9l9leyyo] { background: #f8fafc; }
.ra-btn-danger[b-fz9l9leyyo] { background: #b91c1c; }
.ra-btn-danger:hover:not(:disabled)[b-fz9l9leyyo] { background: #991b1b; }

/* [2026-07-11] Reject 사유 입력 + 발의자에게 보이는 반려 사유 */
.ra-reject-input[b-fz9l9leyyo] { width: 100%; box-sizing: border-box; border: 1px solid #e2e8f0; border-radius: 10px; padding: 0.65rem 0.85rem; font-size: 0.9rem; color: #0f172a; resize: vertical; font-family: inherit; }
.ra-reject-input:focus[b-fz9l9leyyo] { outline: none; border-color: #b91c1c; }
.ra-reject-reason[b-fz9l9leyyo] { margin-top: 0.35rem; font-size: 0.8rem; color: #991b1b; background: #fef2f2; border: 1px solid #fecaca; border-radius: 8px; padding: 0.35rem 0.6rem; display: inline-block; }

.ra-clickable[b-fz9l9leyyo] { cursor: pointer; transition: border-color 0.12s; }
.ra-clickable:hover[b-fz9l9leyyo] { border-color: #cbd5e1; }

/* ── A4 문서 열람 (full-screen) ── */
.ra-view[b-fz9l9leyyo] { position: fixed; inset: 0; background: #e5e7eb; z-index: 1000; display: flex; flex-direction: column; }
.ra-view-top[b-fz9l9leyyo] { display: flex; justify-content: space-between; align-items: center; padding: 0.85rem 1.5rem; background: #fff; border-bottom: 1px solid #e2e8f0; flex-shrink: 0; }
.ra-view-title[b-fz9l9leyyo] { font-weight: 800; color: #0f172a; font-size: 1rem; letter-spacing: -0.3px; }
.ra-view-actions[b-fz9l9leyyo] { display: flex; align-items: center; gap: 0.5rem; }
.ra-view-stage[b-fz9l9leyyo] { flex: 1; overflow-y: auto; padding: 2rem 1rem 3rem; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }

@media print {
    .ra-view[b-fz9l9leyyo] { position: static; background: #fff; display: block; }
    .ra-noprint[b-fz9l9leyyo] { display: none !important; }
    .ra-view-stage[b-fz9l9leyyo] { overflow: visible; padding: 0; display: block; }
}

/* [2026-07-20] 카드 리스트 → 테이블(헤더 상시 표시, 빈 상태도 골격 유지) */
.ra-table-wrap[b-fz9l9leyyo] { border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; background: #fff; box-shadow: 0 1px 2px rgba(15,23,42,0.04); }
.ra-table[b-fz9l9leyyo] { width: 100%; border-collapse: separate; border-spacing: 0; }
.ra-table th[b-fz9l9leyyo] {
    font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em;
    color: #94a3b8; background: #f8fafc; text-align: left; padding: 0.7rem 1.1rem;
    border-bottom: 1px solid #e2e8f0; white-space: nowrap;
}
.ra-table td[b-fz9l9leyyo] { padding: 0.85rem 1.1rem; border-bottom: 1px solid #f1f5f9; font-size: 0.85rem; color: #475569; vertical-align: middle; }
.ra-table tbody tr:last-child td[b-fz9l9leyyo] { border-bottom: none; }
.ra-row.ra-clickable[b-fz9l9leyyo] { cursor: pointer; transition: background 0.1s; }
.ra-row.ra-clickable:hover[b-fz9l9leyyo] { background: #f8fafc; }
.ra-tcenter[b-fz9l9leyyo] { text-align: center; color: #94a3b8; padding: 2.75rem 1rem; font-size: 0.9rem; }
.ra-td-doc .ra-item-sub[b-fz9l9leyyo] { margin-top: 0.15rem; }
.ra-td-act[b-fz9l9leyyo] { text-align: right; white-space: nowrap; }
.ra-td-act .ra-act[b-fz9l9leyyo] { margin-left: 0.4rem; }
/* /Features/Org/Pages/Seals.razor.rz.scp.css */
/* Seals.razor.css — CSS variable 기반 */
.light-dashboard[b-pl3y5ra7yw] {
    width: 100%;
    margin: 0 auto;
    padding-bottom: 80px;
}

/* Seal 모델 설명 배너 — 페이지 상단, Org Type 에 따라 내용 변동 */
/* [2026-07-09] App Group Model 안내보드(.info-box)와 동일 톤으로 — 파랑 → 중립 회색. */
.seal-model-info[b-pl3y5ra7yw] {
    display: flex;
    gap: 0.75rem;
    padding: 1.25rem 1.4rem;
    background: var(--ah-bg-subtle);
    border: 1px solid var(--ah-border);
    border-radius: 10px;
    margin: 0 0 1.5rem;
}
.seal-model-info-icon[b-pl3y5ra7yw] {
    color: var(--ah-text-muted);
    font-size: 1.05rem;
    line-height: 1.5;
    flex-shrink: 0;
}
.seal-model-info-body[b-pl3y5ra7yw] {
    flex: 1;
    font-size: 0.78rem;
    color: var(--ah-text-muted);
    line-height: 1.65;
}
.seal-model-info-title[b-pl3y5ra7yw] {
    font-weight: 700;
    font-size: 0.75rem;
    margin-bottom: 0.5rem;
    color: var(--ah-text);
}
.seal-model-info-text[b-pl3y5ra7yw] {
    color: var(--ah-text-muted, #334155);
}
.seal-model-info-text strong[b-pl3y5ra7yw] {
    color: var(--ah-text, #0f172a);
    font-weight: 600;
}

.x-small[b-pl3y5ra7yw] {
    font-size: 0.75rem;
    letter-spacing: 0.02em;
    color: var(--ah-text-muted);
    font-weight: 500;
}

.custom-time-font[b-pl3y5ra7yw] {
    font-size: 0.8rem;
    font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    color: var(--ah-text-muted);
    background-color: var(--ah-bg-surface);
    padding: 2px 6px;
    border-radius: 4px;
    display: inline-block;
}

.text-silver[b-pl3y5ra7yw] { color: var(--ah-text-placeholder); }

.dot[b-pl3y5ra7yw] { height: 10px; width: 10px; border-radius: 50%; display: inline-block; margin-right: 6px; }
.dot-green[b-pl3y5ra7yw] { background-color: #10b981; box-shadow: 0 0 0 2px rgba(16,185,129,0.2); }
.dot-red[b-pl3y5ra7yw]   { background-color: var(--ah-danger); box-shadow: 0 0 0 2px color-mix(in srgb, var(--ah-danger) 20%, transparent); }

.shadow-xs[b-pl3y5ra7yw] { box-shadow: 0 1px 2px rgba(0,0,0,0.05); }

.metric-card[b-pl3y5ra7yw] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    padding:       24px;
    box-shadow:    var(--ah-shadow-sm);
    height:        100%;
}

.label[b-pl3y5ra7yw] {
    font-weight:    600;
    letter-spacing: 0.05em;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
}

.notify-tpm-btn[b-pl3y5ra7yw] {
    margin-top:    0.3rem;
    display:       block;
    padding:       0.15rem 0.5rem;
    font-size:     0.62rem;
    font-weight:   600;
    border:        1px solid var(--ah-warning-border);
    background:    var(--ah-warning-bg);
    color:         var(--ah-warning);
    border-radius: 4px;
    cursor:        pointer;
    transition:    background 0.15s;
}
.notify-tpm-btn:hover[b-pl3y5ra7yw]    { opacity: 0.85; }
.notify-tpm-btn:disabled[b-pl3y5ra7yw] { opacity: 0.5; cursor: not-allowed; }

.audit-table[b-pl3y5ra7yw] {
    width:           100%;
    border-collapse: separate;
    border-spacing:  0;
    margin-bottom:   0;
}

.audit-table th[b-pl3y5ra7yw] {
    font-size:       0.75rem;
    font-weight:     700;
    text-transform:  uppercase;
    letter-spacing:  0.05em;
    color:           var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:   1px solid var(--ah-border);
    padding:         1rem 1.5rem;
    text-align:      left;
    white-space:     nowrap;
    vertical-align:  middle;
}

.audit-table td[b-pl3y5ra7yw] {
    padding:        1rem 1.5rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.9rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
    white-space:    nowrap;
}

.audit-table tbody tr:hover[b-pl3y5ra7yw]          { background-color: var(--ah-bg-subtle); }
.audit-table tbody tr:last-child td[b-pl3y5ra7yw]  { border-bottom: none; }

.avatar-circle[b-pl3y5ra7yw] {
    width:           36px;
    height:          36px;
    border-radius:   50%;
    display:         flex;
    align-items:     center;
    justify-content: center;
    font-weight:     700;
    font-size:       0.85rem;
    color:           var(--ah-text);
}

.btn-detail-outline[b-pl3y5ra7yw] {
    background-color: var(--ah-bg);
    border:           1px solid var(--ah-border);
    color:            var(--ah-text-sub);
    font-weight:      600;
    font-size:        0.85rem;
    padding:          0.5rem 1rem;
    border-radius:    6px;
    cursor:           pointer;
    transition:       all 0.2s;
    height:           auto;
    min-height:       auto;
    min-width:        80px;
}
.btn-detail-outline:hover[b-pl3y5ra7yw]    { background-color: var(--ah-bg-subtle); color: var(--ah-text); }
.btn-detail-outline:disabled[b-pl3y5ra7yw] { opacity: 0.4; cursor: not-allowed; }

.summary-value[b-pl3y5ra7yw] {
    font-size:      1.75rem;
    font-weight:    800;
    color:          var(--ah-text);
    letter-spacing: -1px;
    line-height:    1;
}

.summary-label[b-pl3y5ra7yw] {
    font-size:      0.7rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top:     0.35rem;
}

.slug-mono[b-pl3y5ra7yw] {
    font-family:    'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:      0.7rem;
    color:          var(--ah-text-muted);
    letter-spacing: -0.3px;
}

.tier-badge[b-pl3y5ra7yw] {
    font-size:     0.7rem;
    font-weight:   600;
    padding:       0.25rem 0.6rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}

.tab-header-bar[b-pl3y5ra7yw] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         0 1.5rem;
    border-bottom:   1px solid var(--ah-border);
}

.seal-tab[b-pl3y5ra7yw] {
    padding:       0.875rem 1.25rem; /* 15% 더 높게 (2026-04-17) */
    font-size:     0.8rem;
    font-weight:   600;
    color:         var(--ah-text-muted);
    cursor:        pointer;
    border-bottom: 2px solid transparent;
    transition:    color 0.15s, border-color 0.15s;
}
.seal-tab:hover[b-pl3y5ra7yw]  { color: var(--ah-text-sub); }
.seal-tab.active[b-pl3y5ra7yw] { color: var(--ah-text); font-weight: 700; border-bottom-color: var(--ah-text); }

.tab-action-link[b-pl3y5ra7yw] {
    font-size:   0.75rem;
    font-weight: 600;
    color:       var(--ah-text-muted);
    cursor:      pointer;
    border:      none;
    background:  none;
    transition:  color 0.15s;
}
.tab-action-link:hover[b-pl3y5ra7yw] { color: var(--ah-text); }

.seal-name[b-pl3y5ra7yw]  { font-weight: 700; color: var(--ah-text);       font-size: 0.85rem; }
.seal-id[b-pl3y5ra7yw]    { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; color: var(--ah-text-muted); }

.authenticator-badge[b-pl3y5ra7yw] {
    display:        inline-flex;
    align-items:    center;
    gap:            0.3rem;
    margin-top:     0.25rem;
    font-size:      0.65rem;
    font-weight:    600;
    padding:        0.15rem 0.45rem;
    border-radius:  4px;
    border:         1px solid transparent;
}
.authenticator-badge.ok[b-pl3y5ra7yw]   { background: rgba(34,197,94,0.10); color: #16a34a; border-color: rgba(34,197,94,0.25); }
.authenticator-badge.warn[b-pl3y5ra7yw] { background: rgba(245,158,11,0.12); color: #b45309; border-color: rgba(245,158,11,0.30); }
.authenticator-badge i[b-pl3y5ra7yw]    { font-size: 0.7rem; }

.type-badge[b-pl3y5ra7yw] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}
.type-badge.master[b-pl3y5ra7yw] { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }

.holder-name[b-pl3y5ra7yw] { font-weight: 700; color: var(--ah-text); font-size: 0.8rem; }
.holder-sub[b-pl3y5ra7yw]  { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.65rem; color: var(--ah-text-muted); }

.scope-text[b-pl3y5ra7yw] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text-sub); }

.ownership-badge[b-pl3y5ra7yw] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}

.geo-ip[b-pl3y5ra7yw]    { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.75rem; color: var(--ah-text); }
.geo-label[b-pl3y5ra7yw] { font-size: 0.65rem; color: var(--ah-text-muted); }

.device-time[b-pl3y5ra7yw] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.8rem; font-weight: 600; color: var(--ah-text); }
.device-tz[b-pl3y5ra7yw]   { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.6rem; color: var(--ah-text-muted); }

.page-count[b-pl3y5ra7yw] { font-size: 0.7rem; color: var(--ah-text-muted); padding: 0.75rem 1.5rem; text-align: right; border-top: 1px solid var(--ah-bg-subtle); }
.page-count strong[b-pl3y5ra7yw] { color: var(--ah-text-sub); }

.status-badge[b-pl3y5ra7yw]    { font-size: 0.65rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; }
.status-active[b-pl3y5ra7yw]   { background: var(--ah-success-bg); color: var(--ah-success); border: 1px solid var(--ah-success-border); }
.status-pending[b-pl3y5ra7yw]  { background: var(--ah-warning-bg); color: var(--ah-warning); border: 1px solid var(--ah-warning-border); }
.status-blocked[b-pl3y5ra7yw]  { background: var(--ah-danger-bg);  color: var(--ah-danger);  border: 1px solid var(--ah-danger-border); }
.status-revoked[b-pl3y5ra7yw]  { background: var(--ah-bg-surface);  color: var(--ah-text-muted); border: 1px solid var(--ah-border); }

.kebab-wrapper[b-pl3y5ra7yw] { position: relative; display: inline-block; }
.kebab-btn[b-pl3y5ra7yw] {
    background:    none;
    border:        1px solid transparent;
    font-size:     1.2rem;
    letter-spacing: 2px;
    color:         var(--ah-text-muted);
    cursor:        pointer;
    padding:       0.2rem 0.5rem;
    border-radius: 6px;
    transition:    all 0.15s;
    line-height:   1;
}
.kebab-btn:hover[b-pl3y5ra7yw] { background: var(--ah-bg-surface); color: var(--ah-text-sub); border-color: var(--ah-border); }

.kebab-menu[b-pl3y5ra7yw] {
    position:      absolute;
    right:         0;
    top:           100%;
    margin-top:    4px;
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 8px;
    box-shadow:    var(--ah-shadow-md);
    min-width:     160px;
    z-index:       50;
    padding:       4px;
}

.kebab-item[b-pl3y5ra7yw] {
    display:       block;
    width:         100%;
    text-align:    left;
    padding:       0.5rem 0.75rem;
    font-size:     0.8rem;
    font-weight:   600;
    color:         var(--ah-text);
    background:    none;
    border:        none;
    border-radius: 6px;
    cursor:        pointer;
    transition:    background 0.1s;
}
.kebab-item:hover[b-pl3y5ra7yw]        { background: var(--ah-bg-subtle); }
.kebab-item.danger[b-pl3y5ra7yw]       { color: var(--ah-danger); }
.kebab-item.danger:hover[b-pl3y5ra7yw] { background: var(--ah-danger-bg); }

.member-select-row[b-pl3y5ra7yw] {
    display:       flex;
    align-items:   center;
    gap:           0.75rem;
    padding:       0.65rem 0.85rem;
    border:        1px solid var(--ah-border);
    border-radius: 8px;
    cursor:        pointer;
    transition:    all 0.15s;
}
.member-select-row:hover:not(.disabled)[b-pl3y5ra7yw] { border-color: var(--ah-link); background: #f5f3ff; }
.member-select-row.selected[b-pl3y5ra7yw]             { border-color: var(--ah-link); background: #eef2ff; }
.member-select-row.disabled[b-pl3y5ra7yw]             { opacity: 0.5; cursor: not-allowed; background: var(--ah-bg-subtle); }

.seal-notice[b-pl3y5ra7yw] {
    border-radius: 10px;
    padding:       1rem 1.25rem;
    margin-bottom: 1.5rem;
    font-size:     0.78rem;
    line-height:   1.65;
    display:       flex;
    align-items:   center;
    justify-content: space-between;
    gap:           1.5rem;
}
.seal-notice-content[b-pl3y5ra7yw] { flex: 1; }
.seal-notice-title[b-pl3y5ra7yw]   { display: block; font-weight: 700; font-size: 0.8rem; margin-bottom: 0.2rem; }

.seal-notice-btn[b-pl3y5ra7yw] {
    flex-shrink:   0;
    padding:       0.45rem 1.1rem;
    font-size:     0.75rem;
    font-weight:   700;
    border-radius: 6px;
    cursor:        pointer;
    border:        none;
    white-space:   nowrap;
    transition:    opacity 0.15s;
    background:    var(--ah-text);
    color:         var(--ah-bg);
}
.seal-notice-btn:hover[b-pl3y5ra7yw] { opacity: 0.8; }

.seal-notice-btn-outline[b-pl3y5ra7yw] {
    flex-shrink:   0;
    padding:       0.45rem 1.1rem;
    font-size:     0.75rem;
    font-weight:   600;
    border-radius: 6px;
    cursor:        pointer;
    white-space:   nowrap;
    transition:    opacity 0.15s;
    background:    transparent;
    border:        1px solid var(--ah-text);
    color:         var(--ah-text);
}
.seal-notice-btn-outline:hover[b-pl3y5ra7yw] { opacity: 0.7; }

.seal-notice.warning[b-pl3y5ra7yw] { background: var(--ah-warning-bg); border: 1px solid var(--ah-warning-border); color: #9a3412; }
.seal-notice.info[b-pl3y5ra7yw]    { background: var(--ah-info-bg);    border: 1px solid var(--ah-info-border);    color: #1e40af; }
.seal-notice.danger[b-pl3y5ra7yw]  { background: var(--ah-danger-bg);  border: 1px solid var(--ah-danger-border);  color: var(--ah-danger); }
.seal-notice.success[b-pl3y5ra7yw] { background: var(--ah-success-bg); border: 1px solid var(--ah-success-border); color: #14532d; }
/* /Features/Org/Pages/SubOrgs.razor.rz.scp.css */
/* Systemhome.razor.css — CSS variable 기반 */
.summary-card[b-sbfp3x04jm] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem; /* 2026-04-17: 1.25 → 1.65 (카드 높이 증가) */
    box-shadow:    var(--ah-shadow-sm);
}

.summary-value[b-sbfp3x04jm] {
    font-size:      1.75rem;
    font-weight:    800;
    color:          var(--ah-text);
    letter-spacing: -1px;
    line-height:    1;
}

.summary-label[b-sbfp3x04jm] {
    font-size:      0.78rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.03em;
    margin-top:     0.35rem;
}

.org-table[b-sbfp3x04jm] { width: 100%; border-collapse: separate; border-spacing: 0; }

.org-table th[b-sbfp3x04jm] {
    font-size:        0.78rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.05em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.85rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}

.org-table td[b-sbfp3x04jm] {
    padding:        0.85rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.9rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}

.org-table tbody tr:hover[b-sbfp3x04jm]          { background-color: var(--ah-bg-subtle); }
.org-table tbody tr:last-child td[b-sbfp3x04jm]  { border-bottom: none; }

.org-name-link[b-sbfp3x04jm] {
    font-weight:     600;
    color:           var(--ah-text-sub);
    text-decoration: none;
    transition:      color 0.15s;
}
.org-name-link:hover[b-sbfp3x04jm] { color: var(--ah-link); }

.org-type-badge[b-sbfp3x04jm] {
    font-size:      0.65rem;
    font-weight:    700;
    color:          var(--ah-text-muted);
    background:     var(--ah-bg-surface);
    border:         1px solid var(--ah-border);
    padding:        0.1rem 0.4rem;
    border-radius:  3px;
}

/* [Sub-org] tree branch + sub-org badge */
.tree-branch[b-sbfp3x04jm] {
    color:          #cbd5e1;
    font-family:    monospace;
    font-size:      0.85rem;
    margin-right:   8px;
    user-select:    none;
}
.org-type-badge.sub-org-badge[b-sbfp3x04jm] {
    color:          #6366f1;
    background:     #eef2ff;
    border-color:   #c7d2fe;
}

.slug-badge[b-sbfp3x04jm] {
    font-family:   'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace;
    font-size:     0.7rem;
    color:         var(--ah-text-muted);
    background:    var(--ah-bg-subtle);
    padding:       0.15rem 0.4rem;
    border-radius: 4px;
    border:        1px solid var(--ah-border);
}

.status-badge[b-sbfp3x04jm] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    border:        1px solid var(--ah-border);
}
.status-badge.active[b-sbfp3x04jm]  { color: var(--ah-success); }
.status-badge.pending[b-sbfp3x04jm] { color: var(--ah-warning); }
.status-badge.inactive[b-sbfp3x04jm] { color: var(--ah-text-muted); }

.kyb-badge[b-sbfp3x04jm] {
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    border:        1px solid var(--ah-border);
}
.kyb-badge.verified[b-sbfp3x04jm]    { color: var(--ah-success); }
.kyb-badge.unverified[b-sbfp3x04jm]  { color: var(--ah-danger); }
.kyb-badge.in-progress[b-sbfp3x04jm] { color: var(--ah-info); }

.add-org-btn[b-sbfp3x04jm] {
    background:    #0f172a;
    color:         #ffffff;
    border:        none;
    font-weight:   600;
    font-size:     0.85rem;
    padding:       0.6rem 1.5rem;
    border-radius: var(--ah-radius-md);
    cursor:        pointer;
    transition:    opacity 0.15s;
}
.add-org-btn:hover[b-sbfp3x04jm] { opacity: 0.85; background: #1e293b; }

/* Go Workspace 버튼 — 각 org row 우측, spinner + 데이터 준비 후 navigate */
.go-workspace-btn[b-sbfp3x04jm] {
    display:         inline-flex;
    align-items:     center;
    gap:             0.4rem;
    background:      var(--ah-bg-surface, #f8fafc);
    color:           var(--ah-text, #0f172a);
    border:          1px solid var(--ah-border, #e2e8f0);
    font-weight:     600;
    font-size:       0.75rem;
    padding:         0.45rem 0.9rem;
    border-radius:   var(--ah-radius-md);
    cursor:          pointer;
    transition:      background 0.15s, border-color 0.15s, opacity 0.15s;
    min-width:       120px;
    justify-content: center;
    white-space:     nowrap;
}
.go-workspace-btn:hover:not(:disabled)[b-sbfp3x04jm] {
    background:   var(--ah-bg-subtle, #f1f5f9);
    border-color: var(--ah-link, #6366f1);
    color:        var(--ah-link, #6366f1);
}
.go-workspace-btn:disabled[b-sbfp3x04jm] {
    opacity: 0.6;
    cursor:  not-allowed;
}
.go-workspace-btn i[b-sbfp3x04jm] {
    font-size: 0.85rem;
    transition: transform 0.15s;
}
.go-workspace-btn:hover:not(:disabled) i[b-sbfp3x04jm] { transform: translateX(2px); }

.search-input[b-sbfp3x04jm] {
    border-radius:    8px;
    font-size:        0.85rem;
    height:           36px;
    border:           1px solid var(--ah-border);
    padding-left:     2.25rem;
    background-color: var(--ah-bg);
    color:            var(--ah-text);
}
.search-input:focus[b-sbfp3x04jm] {
    border-color: var(--ah-link);
    box-shadow:   0 0 0 3px rgba(79,70,229,0.08);
    outline:      none;
}

.rep-info[b-sbfp3x04jm]  { font-size: 0.8rem; color: var(--ah-text-sub); font-weight: 600; }
.rep-email[b-sbfp3x04jm] { font-size: 0.7rem; color: var(--ah-text-muted); }
.count-cell[b-sbfp3x04jm] { font-weight: 700; color: var(--ah-text); font-size: 0.85rem; }
.action-link-text[b-sbfp3x04jm] { font-size: 0.75rem; color: var(--ah-link); }
[data-theme="dark"] .action-link-text[b-sbfp3x04jm] { color: #eac4ff; }

.empty-state[b-sbfp3x04jm] { text-align: center; padding: 4rem 2rem; color: var(--ah-text-muted); }

.modal-overlay[b-sbfp3x04jm] {
    position:        fixed;
    inset:           0;
    background:      rgba(0,0,0,0.6);
    backdrop-filter: blur(4px);
    z-index:         1000;
    display:         flex;
    align-items:     center;
    justify-content: center;
}

.modal-card[b-sbfp3x04jm] {
    background:    var(--ah-bg);
    border-radius: 12px;
    padding:       2rem;
    width:         100%;
    max-width:     460px;
    box-shadow:    var(--ah-shadow-lg);
}

.modal-card .form-control[b-sbfp3x04jm],
.modal-card .form-select[b-sbfp3x04jm] {
    height:           42px;
    font-size:        0.85rem;
    background-color: var(--ah-bg);
    color:            var(--ah-text);
    border-color:     var(--ah-border);
}

.clickable-badge[b-sbfp3x04jm] { display: inline-block; cursor: pointer; transition: all 0.2s; }
.clickable-badge:hover[b-sbfp3x04jm] { box-shadow: 0 0 0 2px rgba(79,70,229,0.2); transform: translateY(-1px); }

.setup-action-link[b-sbfp3x04jm] { cursor: pointer; transition: opacity 0.2s; }
.setup-action-link:hover[b-sbfp3x04jm] { opacity: 0.7; }

.table-container[b-sbfp3x04jm] {
    background:    #ffffff;
    border:        1px solid #f1f5f9;
    border-radius: var(--ah-radius-lg);
    overflow:      hidden;
    box-shadow:    0 1px 3px rgba(0,0,0,0.05);
}
/* /Features/Org/Pages/WorkList.razor.rz.scp.css */
/* WorkList.razor.css — mirrors Members.razor.css (same look as Team Members). CSS variable based. */

.summary-card[b-uv495be0q8] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: var(--ah-radius-md);
    padding:       1.65rem 1.5rem;
    box-shadow:    var(--ah-shadow-sm);
}

.summary-value[b-uv495be0q8] { font-size: 1.75rem; font-weight: 800; color: var(--ah-text); letter-spacing: -1px; line-height: 1; }
.summary-label[b-uv495be0q8] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-top: 0.35rem; }

.slug-mono[b-uv495be0q8] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.7rem; color: var(--ah-text-muted); }

.table-container[b-uv495be0q8] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-sm);
    overflow:      hidden;
}

.tab-header-bar[b-uv495be0q8] {
    display:         flex;
    justify-content: space-between;
    align-items:     center;
    padding:         0 1.25rem;
    border-bottom:   1px solid var(--ah-border);
}

.member-tab[b-uv495be0q8] { padding: 0.875rem 1.25rem; font-size: 0.8rem; font-weight: 600; color: var(--ah-text-muted); border-bottom: 2px solid transparent; }
.member-tab.active[b-uv495be0q8] { color: var(--ah-text); font-weight: 700; border-bottom-color: var(--ah-text); }

.member-table[b-uv495be0q8] { width: 100%; border-collapse: separate; border-spacing: 0; }

.member-table th[b-uv495be0q8] {
    font-size:        0.7rem;
    font-weight:      700;
    text-transform:   uppercase;
    letter-spacing:   0.03em;
    color:            var(--ah-text-muted);
    background-color: var(--ah-bg);
    border-bottom:    1px solid var(--ah-border);
    padding:          0.75rem 1.25rem;
    text-align:       left;
    white-space:      nowrap;
}

.member-table td[b-uv495be0q8] {
    padding:        1rem 1.25rem;
    border-bottom:  1px solid var(--ah-bg-subtle);
    font-size:      0.85rem;
    color:          var(--ah-text-sub);
    vertical-align: middle;
}

.member-table tbody tr[b-uv495be0q8]           { cursor: pointer; transition: background 0.1s; }
.member-table tbody tr:hover[b-uv495be0q8]     { background-color: var(--ah-bg-subtle); }
.member-table tbody tr:last-child td[b-uv495be0q8] { border-bottom: none; }

.member-name[b-uv495be0q8] { font-weight: 700; color: var(--ah-text); font-size: 0.85rem; }
.member-sub[b-uv495be0q8]  { font-size: 0.65rem; color: var(--ah-text-muted); margin-top: 0.15rem; }

.invite-btn[b-uv495be0q8] {
    background:    var(--ah-text);
    color:         var(--ah-bg);
    border:        none;
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.6rem 1.5rem;
    border-radius: 6px;
    cursor:        pointer;
    transition:    opacity 0.15s;
}
.invite-btn:hover[b-uv495be0q8]    { opacity: 0.85; }
.invite-btn:disabled[b-uv495be0q8] { opacity: 0.5; cursor: not-allowed; }

.page-count[b-uv495be0q8] { font-size: 0.7rem; color: var(--ah-text-muted); padding: 0.75rem 1.25rem; text-align: right; border-top: 1px solid var(--ah-bg-subtle); }
.page-count strong[b-uv495be0q8] { color: var(--ah-text-sub); }

/* ── badges (mirror role-badge / kyc-badge visual language) ── */
.wl-badge[b-uv495be0q8] {
    display:       inline-flex;
    align-items:   center;
    white-space:   nowrap;
    font-size:     0.65rem;
    font-weight:   600;
    padding:       0.2rem 0.5rem;
    border-radius: 4px;
    background:    var(--ah-bg-surface);
    color:         var(--ah-text-sub);
    border:        1px solid var(--ah-border);
}
.wl-badge.managed[b-uv495be0q8]  { background: var(--ah-text); color: var(--ah-bg); border-color: var(--ah-text); }
.wl-badge.active[b-uv495be0q8]   { background: var(--ah-success-bg); color: #166534; border-color: var(--ah-success-border); }
.wl-badge.inactive[b-uv495be0q8] { background: var(--ah-bg-surface); color: var(--ah-text-muted); }
.wl-badge.pre[b-uv495be0q8]      { background: var(--ah-info-bg); color: #1e40af; }
.wl-badge.post[b-uv495be0q8]     { background: var(--ah-warning-bg); color: #92400e; }

/* info box under the header — mirrors AppDashboard .info-box */
.info-box[b-uv495be0q8] {
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 10px;
    padding:       1.25rem 1.4rem;
    margin-bottom: 1.5rem;
}
.info-box-title[b-uv495be0q8] { font-size: 0.75rem; font-weight: 700; color: var(--ah-text); margin-bottom: 0.5rem; }
.info-box-body[b-uv495be0q8]  { font-size: 0.78rem; color: var(--ah-text-muted); line-height: 1.65; }
/* [2026-07-10 Sonny] pre/post 강조 = 색 없이 검정만 */
.info-box-body .pre-em[b-uv495be0q8]  { color: var(--ah-text); font-weight: 700; }
.info-box-body .post-em[b-uv495be0q8] { color: var(--ah-text); font-weight: 700; }

.wl-mono[b-uv495be0q8] { font-family: 'JetBrains Mono', 'Noto Sans KR', 'Noto Sans JP', monospace; font-size: 0.72rem; color: var(--ah-text-muted); }

/* ── row actions ── */
.wl-action-cell[b-uv495be0q8] { text-align: right; white-space: nowrap; }
.wl-icon-btn[b-uv495be0q8] {
    border:        1px solid var(--ah-border);
    background:    var(--ah-bg);
    color:         var(--ah-text-sub);
    width:         30px;
    height:        30px;
    border-radius: 6px;
    cursor:        pointer;
    margin-left:   0.35rem;
}
.wl-icon-btn:hover[b-uv495be0q8]         { background: var(--ah-bg-subtle); color: var(--ah-text); }
.wl-icon-btn.danger[b-uv495be0q8]        { border-color: var(--ah-danger-border); color: var(--ah-danger); }
.wl-icon-btn.danger:hover[b-uv495be0q8]  { background: var(--ah-danger-bg); }
.wl-icon-btn:disabled[b-uv495be0q8]      { opacity: 0.5; cursor: not-allowed; }

/* ── modal (mirror Members invite modal) ── */
.modal-backdrop[b-uv495be0q8] {
    position:        fixed;
    inset:           0;
    background:      rgba(0,0,0,0.45);
    z-index:         1000;
    display:         flex;
    align-items:     center;
    justify-content: center;
}

.modal-panel[b-uv495be0q8] {
    background:    var(--ah-bg);
    border-radius: 12px;
    box-shadow:    var(--ah-shadow-lg);
    width:         460px;
    max-width:     90vw;
    max-height:    90vh;
    overflow-y:    auto;
    padding:       2rem;
}

.modal-title[b-uv495be0q8] { font-weight: 800; font-size: 1.1rem; color: var(--ah-text); letter-spacing: -0.3px; margin-bottom: 1.5rem; }
.modal-label[b-uv495be0q8] { font-size: 0.7rem; font-weight: 700; color: var(--ah-text-sub); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.4rem; }

.modal-input[b-uv495be0q8], .modal-select[b-uv495be0q8] {
    width:         100%;
    height:        40px;
    border:        1px solid var(--ah-border);
    border-radius: 6px;
    padding:       0 0.75rem;
    font-size:     0.85rem;
    color:         var(--ah-text);
    background:    var(--ah-bg);
    margin-bottom: 1.25rem;
    box-sizing:    border-box;
}
.modal-input:focus[b-uv495be0q8]  { outline: none; border-color: var(--ah-text-muted); box-shadow: 0 0 0 2px rgba(148,163,184,0.15); }
.modal-select:focus[b-uv495be0q8] { outline: none; border-color: var(--ah-text-muted); }

.modal-actions[b-uv495be0q8] { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.5rem; }

.modal-cancel[b-uv495be0q8] {
    background:    var(--ah-bg);
    border:        1px solid var(--ah-border);
    color:         var(--ah-text-sub);
    font-weight:   600;
    font-size:     0.8rem;
    padding:       0.45rem 1rem;
    border-radius: 6px;
    cursor:        pointer;
}
.modal-cancel:hover[b-uv495be0q8] { background: var(--ah-bg-subtle); }

.wl-help[b-uv495be0q8]  { font-size: 0.7rem; color: var(--ah-text-muted); margin: -0.9rem 0 1.25rem; }

.wl-check[b-uv495be0q8] { display: flex; align-items: center; gap: 0.5rem; font-size: 0.85rem; color: var(--ah-text); font-weight: 600; margin-bottom: 1.5rem; cursor: pointer; }

.wl-managed-note[b-uv495be0q8] {
    font-size:     0.78rem;
    color:         var(--ah-text-sub);
    background:    var(--ah-bg-subtle);
    border:        1px solid var(--ah-border);
    border-radius: 8px;
    padding:       0.6rem 0.8rem;
    margin-bottom: 1.25rem;
}
.wl-managed-note code[b-uv495be0q8] { color: var(--ah-text); }

.wl-error[b-uv495be0q8] {
    font-size:     0.82rem;
    color:         var(--ah-danger);
    background:    var(--ah-danger-bg);
    border:        1px solid var(--ah-danger-border);
    border-radius: 8px;
    padding:       0.55rem 0.8rem;
    margin-bottom: 1.25rem;
}

/* ── [2026-07-10] 2열 그리드 모달(Invite 스타일) + 결재선 맵핑 인라인 ── */
.modal-panel.wl-wide[b-uv495be0q8] { width: 720px; }

.wl-grid[b-uv495be0q8] { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; align-items: start; }
.wl-grid .wl-full[b-uv495be0q8] { grid-column: 1 / -1; }
.wl-cell[b-uv495be0q8] { margin-bottom: 1.1rem; }
.wl-cell .wl-help[b-uv495be0q8] { margin: 0.35rem 0 0; }         /* 그리드 안에선 음수 마진 제거 */
.wl-check.wl-full[b-uv495be0q8] { margin-top: 0.2rem; margin-bottom: 1.25rem; }

/* 결재선 맵핑 섹션 */
.wl-map[b-uv495be0q8] { border-top: 1px solid var(--ah-border); padding-top: 1.1rem; margin-bottom: 1.25rem; }
.wl-col-heads[b-uv495be0q8] { display: flex; align-items: center; gap: 0.5rem; margin-top: 0.4rem; }
.wl-col-heads .wl-idx-spacer[b-uv495be0q8] { width: 1.1rem; flex: none; }
.wl-col-head[b-uv495be0q8] { font-size: 0.66rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--ah-text-muted); }
.wl-col-head-label[b-uv495be0q8] { width: 130px; flex: none; }
.wl-col-head-role[b-uv495be0q8] { flex: 1; }

.wl-rows[b-uv495be0q8] { display: flex; flex-direction: column; gap: 0.5rem; margin-top: 0.3rem; }
.wl-row[b-uv495be0q8] { display: flex; align-items: center; gap: 0.5rem; flex-wrap: nowrap; }
.wl-idx[b-uv495be0q8] { width: 1.1rem; flex: none; text-align: center; color: var(--ah-text-muted); font-size: 0.8rem; }
.wl-row-label[b-uv495be0q8] { width: 130px; flex: none; }
.wl-row .modal-input[b-uv495be0q8] { margin-bottom: 0; }
.wl-drafter[b-uv495be0q8] { flex: 1; font-size: 0.78rem; color: var(--ah-text-muted); font-weight: 600; padding-left: 0.2rem; }
.wl-row-btn[b-uv495be0q8] { flex: none; width: 30px; height: 30px; border: 1px solid var(--ah-border); background: var(--ah-bg); border-radius: 7px; cursor: pointer; color: var(--ah-text-sub); }
.wl-row-btn:hover:not(:disabled)[b-uv495be0q8] { background: var(--ah-bg-subtle); }
.wl-row-btn.danger[b-uv495be0q8] { color: var(--ah-danger); }
.wl-row-btn:disabled[b-uv495be0q8] { opacity: 0.4; cursor: not-allowed; }
.wl-add[b-uv495be0q8] { margin-top: 0.6rem; background: none; border: 1px dashed var(--ah-border); color: var(--ah-text-sub); border-radius: 8px; padding: 0.45rem 0.8rem; font-size: 0.82rem; font-weight: 600; cursor: pointer; }
.wl-add:hover[b-uv495be0q8] { background: var(--ah-bg-subtle); }
.wl-warn[b-uv495be0q8] { margin-top: 0.6rem; font-size: 0.8rem; font-weight: 600; color: #b45309; background: #fffbeb; border: 1px solid #fde68a; border-radius: 8px; padding: 0.55rem 0.7rem; }

@media (max-width: 640px) {
    .modal-panel.wl-wide[b-uv495be0q8] { width: 100%; }
    .wl-grid[b-uv495be0q8] { grid-template-columns: 1fr; }
}