/**
 * TSS UI Renewal production manifest.
 *
 * 모든 규칙은 .tss-renewal 아래에 격리되며 승인된 Figma A안과
 * 화면별 기능 계약을 기준으로 한다.
 */
/* bundled: tokens.css */
/**
 * UI 개편 격리 토큰. 운영 화면의 --tss-* 를 바꾸지 않는다.
 *
 * Figma 파일 gYgvsIpvJ8K7hoCzahybGZ 에서 2026-10-16에 다시 읽은 값만 원시 색으로 둔다.
 * A안 157:1152 가 Light, Source-faithful Dark 148:1461 이 Dark 색 기준이다.
 * Figma 변수 이름은 var(--tss-*) 이지만 운영 tss-theme.css 의 --tss-* 와 값이 다르다.
 * 그래서 이 파일은 .tss-renewal 안에서 --rn-* 로만 정의한다.
 *
 * Figma에 없는 상태 배경·hover·그림자는 확인된 색의 color-mix 로만 만든다.
 * 새 원시 색을 추가하지 않는다.
 */

/* rn-token-block: shared */
.tss-renewal {
    /* 새 외부 폰트를 추가하지 않는다. 로드되는 굵기는 400/500/700 뿐이다. */
    --rn-font-sans: "Noto Sans KR", system-ui, -apple-system, "Segoe UI", sans-serif;
    --rn-font-mono: ui-monospace, "SFMono-Regular", Consolas, monospace;
    --rn-font-weight-regular: 400;
    --rn-font-weight-medium: 500;
    --rn-font-weight-bold: 700;

    /* Foundations 35:2·15:2 에 묶인 글자 스타일 */
    --rn-font-size-display: 28px;
    --rn-line-height-display: 38px;
    --rn-letter-spacing-display: -0.4px;
    --rn-font-size-section: 16px;
    --rn-line-height-section: 24px;
    --rn-letter-spacing-section: -0.1px;
    --rn-font-size-body: 14px;
    --rn-line-height-body: 22px;
    --rn-letter-spacing-body: 0;
    --rn-font-size-compact: 13px;
    --rn-line-height-compact: 20px;
    --rn-font-size-label: 12px;
    --rn-line-height-label: 18px;
    --rn-letter-spacing-label: 0.1px;
    --rn-font-size-nav: 14px;
    --rn-line-height-nav: 20px;
    --rn-font-size-kpi: 28px;
    --rn-line-height-kpi: 34px;
    --rn-letter-spacing-kpi: -0.3px;
    --rn-font-size-card: 14px;
    --rn-line-height-card: 22px;

    /* 확인된 간격: xs 4, sm 8, md 16, xl 32. 12·24·48은 Foundations 막대 너비의 1/4 해석이다. */
    --rn-space-1: 4px;
    --rn-space-2: 8px;
    --rn-space-3: 12px;
    --rn-space-4: 16px;
    --rn-space-5: 20px;
    --rn-space-6: 24px;
    --rn-space-8: 32px;
    --rn-space-10: 40px;
    --rn-space-12: 48px;
    --rn-space-xs: var(--rn-space-1);
    --rn-space-sm: var(--rn-space-2);
    --rn-space-md: var(--rn-space-4);
    --rn-space-lg: var(--rn-space-6);
    --rn-space-xl: var(--rn-space-8);
    --rn-space-2xl: var(--rn-space-12);
    --rn-space-page: var(--rn-space-xl);
    --rn-space-panel: var(--rn-space-md);
    --rn-space-row: var(--rn-space-3);
    --rn-space-field: var(--rn-space-sm);
    --rn-space-mobile: var(--rn-space-md);

    /* md 10, lg 14, full 999는 Figma 변수. sm 6은 기존 초안이며 변수 바인딩은 확인 필요. */
    --rn-radius-sm: 6px;
    --rn-radius-md: 10px;
    --rn-radius-lg: 14px;
    --rn-radius-full: 999px;

    /* 크기는 Figma 변수로 확인되지 않은 기존 초안이다. 홈 레이아웃을 여기서 확정하지 않는다. */
    --rn-sidebar-width: 220px;
    --rn-topbar-height: 68px;
    --rn-content-max: 1284px;
    --rn-detail-width: 300px;
    --rn-directory-width: 250px;
    --rn-control-sm: 32px;
    --rn-control-md: 40px;
    --rn-control-lg: 48px;
    --rn-row-compact: 44px;
    --rn-row-default: 60px;
    --rn-row-comfortable: 72px;

    --rn-duration-fast: 120ms;
    --rn-duration-normal: 180ms;
    --rn-ease-standard: cubic-bezier(0.2, 0, 0, 1);
    --rn-focus-ring-width: 2px;
    --rn-disabled-opacity: 0.46;
    --rn-z-base: 1;
    --rn-z-sticky: 20;
    --rn-z-dropdown: 30;
    --rn-z-overlay: 40;
    --rn-z-modal: 50;
    --rn-z-toast: 60;
}

/* rn-token-block: light */
.tss-renewal,
html[data-tss-theme="dark"] .tss-renewal[data-theme="light"] {
    color-scheme: light;

    --rn-bg-canvas: #f4f6f8;
    --rn-bg-surface: #ffffff;
    --rn-bg-subtle: #f8fafc;
    --rn-bg-section: var(--rn-bg-subtle);
    --rn-bg-elevated: var(--rn-bg-surface);
    --rn-bg-sidebar: #18212f;
    --rn-bg-accent: #2f5d8c;
    --rn-bg-accent-soft: #eaf0f6;
    /* 기존 .rn-modal-backdrop 이 overlay를 어두운 막으로 쓴다. scrim과 같은 역할이다. */
    --rn-bg-overlay: color-mix(in srgb, var(--rn-bg-sidebar) 52%, transparent);
    --rn-bg-scrim: var(--rn-bg-overlay);
    --rn-bg-selected: var(--rn-bg-accent-soft);
    --rn-bg-hover: color-mix(in srgb, var(--rn-bg-accent-soft) 50%, var(--rn-bg-surface));
    --rn-bg-input: var(--rn-bg-surface);
    --rn-bg-disabled: color-mix(in srgb, var(--rn-bg-subtle) 72%, var(--rn-bg-surface));

    --rn-text-primary: #18212f;
    --rn-text-secondary: #607086;
    /* Figma는 muted 하나만 있다. secondary와 같은 값으로 두고 역할을 문서에만 구분한다. */
    --rn-text-muted: var(--rn-text-secondary);
    --rn-text-disabled: color-mix(in srgb, var(--rn-text-secondary) 42%, var(--rn-bg-surface));
    --rn-text-placeholder: var(--rn-text-secondary);
    --rn-text-accent: #2f5d8c;
    --rn-text-link: var(--rn-text-accent);
    --rn-text-on-dark: #ffffff;
    --rn-text-inverse: var(--rn-text-on-dark);

    --rn-border-default: #dce2ea;
    --rn-border-strong: #9ba9bc;
    --rn-border-subtle: color-mix(in srgb, var(--rn-border-default) 55%, var(--rn-bg-surface));
    --rn-border-focus: var(--rn-text-accent);
    --rn-divider: var(--rn-border-default);

    --rn-accent: var(--rn-bg-accent);
    --rn-accent-hover: color-mix(in srgb, var(--rn-bg-accent) 82%, var(--rn-text-primary));
    --rn-accent-active: color-mix(in srgb, var(--rn-bg-accent) 70%, var(--rn-text-primary));
    --rn-accent-soft: var(--rn-bg-accent-soft);
    --rn-accent-soft-hover: color-mix(in srgb, var(--rn-bg-accent-soft) 70%, var(--rn-bg-accent));
    --rn-accent-contrast: var(--rn-text-on-dark);

    --rn-status-info: #2f5d8c;
    --rn-status-info-soft: var(--rn-bg-accent-soft);
    --rn-status-info-border: color-mix(in srgb, var(--rn-status-info) 35%, var(--rn-border-default));
    --rn-status-success: #2e7d61;
    --rn-status-success-soft: color-mix(in srgb, var(--rn-status-success) 5%, var(--rn-bg-surface));
    --rn-status-success-border: color-mix(in srgb, var(--rn-status-success) 32%, var(--rn-border-default));
    --rn-status-warning: #9a6a1d;
    --rn-status-warning-soft: color-mix(in srgb, var(--rn-status-warning) 12%, var(--rn-bg-surface));
    --rn-status-warning-border: color-mix(in srgb, var(--rn-status-warning) 32%, var(--rn-border-default));
    --rn-status-danger: #a94747;
    --rn-status-danger-soft: color-mix(in srgb, var(--rn-status-danger) 12%, var(--rn-bg-surface));
    --rn-status-danger-border: color-mix(in srgb, var(--rn-status-danger) 32%, var(--rn-border-default));

    /* Dark에서는 밝은 그림자를 쓰지 않는다. Light 그림자는 확인된 글자색의 투명 혼합이다. */
    --rn-shadow-subtle: 0 1px 2px color-mix(in srgb, var(--rn-text-primary) 6%, transparent);
    --rn-shadow-floating: 0 8px 24px color-mix(in srgb, var(--rn-text-primary) 8%, transparent);
    --rn-shadow-overlay: 0 18px 48px color-mix(in srgb, var(--rn-text-primary) 16%, transparent);
}

/* rn-token-block: dark */
html[data-tss-theme="dark"] .tss-renewal,
.tss-renewal[data-theme="dark"] {
    color-scheme: dark;

    --rn-bg-canvas: #0c111b;
    --rn-bg-surface: #141b28;
    --rn-bg-subtle: #1b2534;
    --rn-bg-section: var(--rn-bg-surface);
    --rn-bg-elevated: var(--rn-bg-surface);
    --rn-bg-sidebar: #090d14;
    --rn-bg-accent: #75a7d5;
    --rn-bg-accent-soft: #1c2c3d;
    --rn-bg-overlay: color-mix(in srgb, var(--rn-bg-sidebar) 72%, transparent);
    --rn-bg-scrim: var(--rn-bg-overlay);
    --rn-bg-selected: var(--rn-bg-accent-soft);
    --rn-bg-hover: color-mix(in srgb, var(--rn-bg-subtle) 70%, var(--rn-bg-surface));
    --rn-bg-input: var(--rn-bg-surface);
    --rn-bg-disabled: color-mix(in srgb, var(--rn-bg-subtle) 72%, var(--rn-bg-surface));

    --rn-text-primary: #e7ecf3;
    --rn-text-secondary: #9ba9bc;
    --rn-text-muted: var(--rn-text-secondary);
    --rn-text-disabled: color-mix(in srgb, var(--rn-text-secondary) 45%, var(--rn-bg-surface));
    --rn-text-placeholder: var(--rn-text-secondary);
    --rn-text-accent: #75a7d5;
    --rn-text-link: var(--rn-text-accent);
    --rn-text-on-dark: #ffffff;
    /* 다크 화면 안의 밝은 칩에 올릴 글자. Light에서 확인한 primary와 같다. */
    --rn-text-inverse: #18212f;

    --rn-border-default: #2b3647;
    --rn-border-strong: #607086;
    --rn-border-subtle: color-mix(in srgb, var(--rn-border-default) 55%, var(--rn-bg-surface));
    --rn-border-focus: var(--rn-text-accent);
    --rn-divider: var(--rn-border-default);

    --rn-accent: var(--rn-bg-accent);
    --rn-accent-hover: color-mix(in srgb, var(--rn-bg-accent) 88%, var(--rn-text-on-dark));
    --rn-accent-active: color-mix(in srgb, var(--rn-bg-accent) 92%, var(--rn-bg-canvas));
    --rn-accent-soft: var(--rn-bg-accent-soft);
    --rn-accent-soft-hover: color-mix(in srgb, var(--rn-bg-accent-soft) 75%, var(--rn-bg-accent));
    /* 흰 글자를 다크 액센트 #75a7d5 위에 올리면 대비가 2.55:1이다. 캔버스 색을 쓴다. */
    --rn-accent-contrast: var(--rn-bg-canvas);

    --rn-status-info: #75a7d5;
    --rn-status-info-soft: var(--rn-bg-accent-soft);
    --rn-status-info-border: color-mix(in srgb, var(--rn-status-info) 35%, var(--rn-border-default));
    --rn-status-success: #70b89b;
    --rn-status-success-soft: color-mix(in srgb, var(--rn-status-success) 20%, var(--rn-bg-surface));
    --rn-status-success-border: color-mix(in srgb, var(--rn-status-success) 32%, var(--rn-border-default));
    --rn-status-warning: #d8b56b;
    --rn-status-warning-soft: color-mix(in srgb, var(--rn-status-warning) 12%, var(--rn-bg-surface));
    --rn-status-warning-border: color-mix(in srgb, var(--rn-status-warning) 32%, var(--rn-border-default));
    --rn-status-danger: #dd8585;
    --rn-status-danger-soft: color-mix(in srgb, var(--rn-status-danger) 16%, var(--rn-bg-surface));
    --rn-status-danger-border: color-mix(in srgb, var(--rn-status-danger) 32%, var(--rn-border-default));

    --rn-shadow-subtle: 0 1px 2px color-mix(in srgb, var(--rn-bg-sidebar) 80%, transparent);
    --rn-shadow-floating: 0 8px 24px color-mix(in srgb, var(--rn-bg-sidebar) 88%, transparent);
    --rn-shadow-overlay: 0 18px 48px color-mix(in srgb, var(--rn-bg-sidebar) 92%, transparent);
}
/* rn-token-block: end */

/* contrast-exception: light --rn-status-warning / --rn-bg-canvas | Figma warning #9a6a1d 는 흰 surface에서 4.72:1이지만 canvas #f4f6f8에서는 4.35:1이다. 경고 글자는 surface 위에만 둔다. */
/* contrast-exception: light --rn-status-warning / --rn-status-warning-soft | Light 경고색은 눈에 보이는 틴트 위 작은 글자에서 4.5:1을 넘기지 못한다. soft는 면이고 글자는 surface 위에 둔다. Dark 조합은 4.5:1 이상이다. */
/* contrast-exception: --rn-text-disabled / --rn-bg-disabled | WCAG는 비활성 글자의 4.5:1을 요구하지 않는다. */

@media (prefers-contrast: more) {
    .tss-renewal {
        --rn-border-default: var(--rn-border-strong);
        --rn-border-focus: var(--rn-text-accent);
    }
}

/* bundled: base.css */
/** Step 1 — scoped reset, typography, accessibility and low-level utilities. */
.tss-renewal,
.tss-renewal *,
.tss-renewal *::before,
.tss-renewal *::after {
    box-sizing: border-box;
}

.tss-renewal {
    min-height: 100%;
    background: var(--rn-bg-canvas);
    color: var(--rn-text-primary);
    font-family: var(--rn-font-sans);
    font-size: 14px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

.tss-renewal :where(h1, h2, h3, h4, p, ul, ol, dl, dd) {
    margin-block-start: 0;
}

.tss-renewal :where(h1, h2, h3, h4) {
    color: var(--rn-text-primary);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal h1 {
    margin-block-end: var(--rn-space-2);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
    letter-spacing: var(--rn-letter-spacing-display);
}
.tss-renewal h2 {
    margin-block-end: var(--rn-space-3);
    font-size: var(--rn-font-size-section);
    line-height: var(--rn-line-height-section);
    letter-spacing: var(--rn-letter-spacing-section);
}
.tss-renewal h3 {
    margin-block-end: var(--rn-space-2);
    font-size: var(--rn-font-size-card);
    line-height: var(--rn-line-height-card);
    letter-spacing: var(--rn-letter-spacing-body);
}
.tss-renewal h4 {
    margin-block-end: var(--rn-space-2);
    font-size: var(--rn-font-size-label);
    line-height: var(--rn-line-height-label);
    font-weight: var(--rn-font-weight-medium);
    letter-spacing: var(--rn-letter-spacing-label);
}
.tss-renewal p { margin-block-end: var(--rn-space-4); font-size: var(--rn-font-size-body); line-height: var(--rn-line-height-body); }

.tss-renewal :where(button, input, select, textarea) {
    font: inherit;
}

.tss-renewal :where(button, [role="button"], a[href]) {
    -webkit-tap-highlight-color: transparent;
}

.tss-renewal a {
    color: var(--rn-text-accent);
    text-decoration: none;
}

/* Filled link-buttons must retain their contrast text, not the generic link color. */
.tss-renewal a:is(.btn-primary, .btn-tss-primary) {
    color: var(--rn-accent-contrast);
}

.tss-renewal a:hover { text-decoration: underline; text-underline-offset: 0.18em; }

.tss-renewal :where(button, input, select, textarea, a[href], [tabindex]):focus-visible {
    outline: 2px solid var(--rn-border-focus);
    outline-offset: 2px;
}

.tss-renewal ::selection {
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-primary);
}

.tss-renewal :where(code, kbd, samp) {
    font-family: var(--rn-font-mono);
}

.tss-renewal .rn-visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.tss-renewal .rn-muted { color: var(--rn-text-secondary); }
.tss-renewal .rn-accent { color: var(--rn-text-accent); }
.tss-renewal .rn-success { color: var(--rn-status-success); }
.tss-renewal .rn-warning { color: var(--rn-status-warning); }
.tss-renewal .rn-danger { color: var(--rn-status-danger); }
.tss-renewal .rn-numeric { font-variant-numeric: tabular-nums; }
.tss-renewal .rn-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tss-renewal .rn-no-wrap { white-space: nowrap; }

.tss-renewal .rn-divider {
    width: 100%;
    height: 1px;
    border: 0;
    background: var(--rn-border-default);
}

.tss-renewal .rn-scroll-region {
    min-width: 0;
    overflow: auto;
    scrollbar-color: var(--rn-border-strong) transparent;
    scrollbar-width: thin;
}

.tss-renewal .rn-scroll-region::-webkit-scrollbar { width: 8px; height: 8px; }
.tss-renewal .rn-scroll-region::-webkit-scrollbar-thumb { border: 2px solid transparent; border-radius: var(--rn-radius-full); background: var(--rn-border-strong); background-clip: padding-box; }

@media (prefers-reduced-motion: reduce) {
    .tss-renewal *,
    .tss-renewal *::before,
    .tss-renewal *::after {
        scroll-behavior: auto;
        transition-duration: 0.01ms;
        animation-duration: 0.01ms;
        animation-iteration-count: 1;
    }
}

/* 토큰 검증 화면. 운영 컴포넌트가 아니며 원시 색을 쓰지 않는다. */
.tss-renewal .rn-token-compare {
    display: grid;
    min-width: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--rn-space-4);
    margin-block-end: var(--rn-space-8);
}

.tss-renewal .rn-token-stage {
    min-width: 0;
    min-height: 0;
    padding: var(--rn-space-panel);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-canvas);
    color: var(--rn-text-primary);
}

.tss-renewal .rn-token-stage h3 { margin-block-end: var(--rn-space-3); }
.tss-renewal .rn-token-kicker {
    margin: 0 0 var(--rn-space-3);
    color: var(--rn-text-muted);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
    letter-spacing: var(--rn-letter-spacing-label);
    line-height: var(--rn-line-height-label);
}

.tss-renewal .rn-token-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
    gap: var(--rn-space-2);
    margin-block-end: var(--rn-space-4);
}

.tss-renewal .rn-token-swatch {
    display: grid;
    gap: var(--rn-space-1);
    min-width: 0;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    line-height: var(--rn-line-height-label);
}

.tss-renewal .rn-token-swatch span {
    display: block;
    height: 36px;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal .rn-token-type-sample { margin: 0 0 var(--rn-space-2); }
.tss-renewal .rn-token-type-kpi {
    font-size: var(--rn-font-size-kpi);
    font-weight: var(--rn-font-weight-bold);
    letter-spacing: var(--rn-letter-spacing-kpi);
    line-height: var(--rn-line-height-kpi);
}
.tss-renewal .rn-token-type-body { font-size: var(--rn-font-size-body); font-weight: var(--rn-font-weight-regular); line-height: var(--rn-line-height-body); }
.tss-renewal .rn-token-type-label { font-size: var(--rn-font-size-label); font-weight: var(--rn-font-weight-medium); letter-spacing: var(--rn-letter-spacing-label); line-height: var(--rn-line-height-label); }
.tss-renewal .rn-token-mono { font-family: var(--rn-font-mono); font-size: var(--rn-font-size-compact); }

.tss-renewal .rn-token-scale { display: flex; flex-wrap: wrap; gap: var(--rn-space-3); align-items: end; margin-block-end: var(--rn-space-4); }
.tss-renewal .rn-token-bar { background: var(--rn-accent); border-radius: var(--rn-radius-sm); }
.tss-renewal .rn-token-radius { width: 48px; height: 32px; border: 1px solid var(--rn-border-strong); background: var(--rn-bg-surface); }
.tss-renewal .rn-token-shadow { width: 72px; height: 40px; background: var(--rn-bg-elevated); }

.tss-renewal .rn-token-actions,
.tss-renewal .rn-token-inline { display: flex; flex-wrap: wrap; gap: var(--rn-space-2); align-items: center; margin-block-end: var(--rn-space-3); }
.tss-renewal .rn-token-button {
    min-height: var(--rn-control-md);
    padding-inline: var(--rn-space-4);
    border: 1px solid transparent;
    border-radius: var(--rn-radius-sm);
    font: inherit;
    font-size: var(--rn-font-size-compact);
    font-weight: var(--rn-font-weight-medium);
    cursor: pointer;
}
.tss-renewal .rn-token-button--primary { background: var(--rn-accent); color: var(--rn-accent-contrast); }
.tss-renewal .rn-token-button--primary:hover,
.tss-renewal .rn-token-state-hover.rn-token-button--primary { background: var(--rn-accent-hover); }
.tss-renewal .rn-token-button--primary:active { background: var(--rn-accent-active); }
.tss-renewal .rn-token-button--soft { background: var(--rn-accent-soft); color: var(--rn-text-accent); }
.tss-renewal .rn-token-button:disabled { background: var(--rn-bg-disabled); color: var(--rn-text-disabled); cursor: not-allowed; opacity: var(--rn-disabled-opacity); }
.tss-renewal .rn-token-state-focus { outline: var(--rn-focus-ring-width) solid var(--rn-border-focus); outline-offset: 2px; }

.tss-renewal .rn-token-input {
    min-height: var(--rn-control-md);
    width: 100%;
    padding-inline: var(--rn-space-3);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-input);
    color: var(--rn-text-primary);
    font: inherit;
}
.tss-renewal .rn-token-input::placeholder { color: var(--rn-text-placeholder); }
.tss-renewal .rn-token-input:disabled { background: var(--rn-bg-disabled); color: var(--rn-text-disabled); }
.tss-renewal .rn-token-field { display: grid; gap: var(--rn-space-field); margin-block-end: var(--rn-space-3); }
.tss-renewal .rn-token-error { margin: 0; color: var(--rn-status-danger); font-size: var(--rn-font-size-label); }

.tss-renewal .rn-token-table { width: 100%; border-collapse: collapse; margin-block-end: var(--rn-space-3); }
.tss-renewal .rn-token-table th,
.tss-renewal .rn-token-table td { padding: var(--rn-space-2) var(--rn-space-3); border-bottom: 1px solid var(--rn-divider); text-align: left; }
.tss-renewal .rn-token-table th { color: var(--rn-text-secondary); font-size: var(--rn-font-size-label); font-weight: var(--rn-font-weight-medium); }
.tss-renewal .rn-token-row-hover { background: var(--rn-bg-hover); }
.tss-renewal .rn-token-row-selected { background: var(--rn-bg-selected); color: var(--rn-text-primary); }

.tss-renewal .rn-token-status { display: inline-flex; min-height: 24px; align-items: center; padding-inline: var(--rn-space-2); border: 1px solid transparent; border-radius: var(--rn-radius-full); font-size: var(--rn-font-size-label); }
.tss-renewal .rn-token-status--info { background: var(--rn-status-info-soft); color: var(--rn-status-info); border-color: var(--rn-status-info-border); }
.tss-renewal .rn-token-status--success { background: var(--rn-status-success-soft); color: var(--rn-status-success); border-color: var(--rn-status-success-border); }
.tss-renewal .rn-token-status--warning { background: var(--rn-bg-surface); color: var(--rn-status-warning); border-color: var(--rn-status-warning-border); }
.tss-renewal .rn-token-status--danger { background: var(--rn-status-danger-soft); color: var(--rn-status-danger); border-color: var(--rn-status-danger-border); }

.tss-renewal .rn-token-overlay {
    position: relative;
    min-height: 96px;
    margin-block-end: var(--rn-space-3);
    overflow: hidden;
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-scrim);
}
.tss-renewal .rn-token-dialog {
    position: absolute;
    inset: var(--rn-space-4);
    display: grid;
    align-content: center;
    padding: var(--rn-space-3);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-elevated);
    box-shadow: var(--rn-shadow-overlay);
    color: var(--rn-text-primary);
}
.tss-renewal .rn-token-note { margin: 0; color: var(--rn-text-muted); font-size: var(--rn-font-size-compact); line-height: var(--rn-line-height-compact); }
.tss-renewal .rn-token-loading { color: var(--rn-text-secondary); }
.tss-renewal .rn-token-empty,
.tss-renewal .rn-token-sidebar-sample {
    padding: var(--rn-space-3);
    border-radius: var(--rn-radius-sm);
}
.tss-renewal .rn-token-empty { background: var(--rn-bg-subtle); color: var(--rn-text-secondary); }
.tss-renewal .rn-token-sidebar-sample { background: var(--rn-bg-sidebar); color: var(--rn-text-on-dark); }

/* CSS Lab의 폭이 넓은 후속 샘플은 섹션 안에서만 스크롤하며 페이지 폭을 밀지 않는다. */
.rn-css-lab .tss-renewal .rn-crm {
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
}

.rn-css-lab .tss-renewal .rn-crm > * { min-width: 0; }

.rn-css-lab .tss-renewal .rn-crm > section {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-margin-top: calc(var(--rn-topbar-height) + var(--rn-space-4));
}

@media (max-width: 800px) {
    .tss-renewal .rn-token-compare { grid-template-columns: 1fr; }
}

/* bundled: shell.css */
/** Step 2 — application shell and consistent page frame. */
.tss-renewal .rn-app {
    min-height: 100vh;
    background: var(--rn-bg-canvas);
}

.tss-renewal .rn-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 50;
    display: flex;
    width: var(--rn-sidebar-width);
    flex-direction: column;
    background: var(--rn-bg-sidebar);
    color: var(--rn-text-on-dark);
}

.tss-renewal .rn-brand {
    display: flex;
    min-height: 74px;
    align-items: center;
    gap: var(--rn-space-3);
    padding-inline: var(--rn-space-5);
    border-bottom: 1px solid color-mix(in srgb, var(--rn-text-on-dark) 12%, transparent);
}

.tss-renewal .rn-brand__mark {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 auto;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--rn-text-on-dark) 64%, transparent);
    border-radius: var(--rn-radius-sm);
    font-weight: 700;
}

.tss-renewal .rn-brand__copy { display: grid; gap: 2px; min-width: 0; }
.tss-renewal .rn-brand__title { font-size: 16px; font-weight: 700; }
.tss-renewal .rn-brand__meta { color: var(--rn-text-accent); font-size: 10px; letter-spacing: 0.08em; }

.tss-renewal .rn-nav {
    flex: 1;
    overflow-y: auto;
    padding: var(--rn-space-5) var(--rn-space-3);
}

.tss-renewal .rn-nav__label {
    margin: var(--rn-space-5) var(--rn-space-3) var(--rn-space-2);
    color: color-mix(in srgb, var(--rn-text-on-dark) 46%, var(--rn-bg-sidebar));
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.tss-renewal .rn-nav__label:first-child { margin-top: 0; }

.tss-renewal .rn-nav__item {
    position: relative;
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: var(--rn-space-3);
    padding-inline: var(--rn-space-3);
    border-radius: var(--rn-radius-sm);
    color: color-mix(in srgb, var(--rn-text-on-dark) 72%, var(--rn-bg-sidebar));
    font-size: 13px;
    font-weight: 500;
    transition: color var(--rn-duration-fast) var(--rn-ease-standard), background var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal .rn-nav__item:hover { background: color-mix(in srgb, var(--rn-text-on-dark) 7%, transparent); color: var(--rn-text-on-dark); text-decoration: none; }
.tss-renewal .rn-nav__item[aria-current="page"] { background: var(--rn-accent-soft); color: var(--rn-text-accent); }
.tss-renewal .rn-nav__item[aria-current="page"]::before { position: absolute; left: 0; width: 3px; height: 22px; border-radius: 0 3px 3px 0; background: var(--rn-accent); content: ""; }
.tss-renewal .rn-nav__icon { width: 18px; flex: 0 0 auto; text-align: center; }
.tss-renewal .rn-nav__count { margin-left: auto; color: color-mix(in srgb, var(--rn-text-on-dark) 58%, var(--rn-bg-sidebar)); font-size: 10px; font-variant-numeric: tabular-nums; }

.tss-renewal .rn-sidebar-user {
    display: grid;
    min-height: 72px;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--rn-space-3);
    padding: var(--rn-space-3) var(--rn-space-4);
    border-top: 1px solid color-mix(in srgb, var(--rn-text-on-dark) 12%, transparent);
}

.tss-renewal .rn-shell { min-height: 100vh; margin-left: var(--rn-sidebar-width); }

.tss-renewal .rn-topbar {
    position: sticky;
    top: 0;
    z-index: 40;
    display: flex;
    height: var(--rn-topbar-height);
    align-items: center;
    justify-content: space-between;
    gap: var(--rn-space-4);
    padding-inline: var(--rn-space-8);
    border-bottom: 1px solid var(--rn-border-default);
    background: color-mix(in srgb, var(--rn-bg-surface) 94%, transparent);
    backdrop-filter: blur(14px);
}

.tss-renewal .rn-global-search {
    display: flex;
    width: min(420px, 46vw);
    height: 40px;
    align-items: center;
    gap: var(--rn-space-2);
    padding-inline: var(--rn-space-3);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-subtle);
    color: var(--rn-text-secondary);
}

.tss-renewal .rn-global-search input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--rn-text-primary); }
.tss-renewal .rn-topbar__actions { display: flex; align-items: center; gap: var(--rn-space-1); }

.tss-renewal .rn-main {
    width: min(100%, calc(var(--rn-content-max) + 64px));
    margin-inline: auto;
    padding: var(--rn-space-8);
}

.tss-renewal .rn-page-header {
    display: flex;
    min-height: 64px;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--rn-space-6);
    margin-bottom: var(--rn-space-5);
}

.tss-renewal .rn-page-header__copy { min-width: 0; }
.tss-renewal .rn-page-header__title { margin: 0; }
.tss-renewal .rn-page-header__description { margin: var(--rn-space-1) 0 0; color: var(--rn-text-secondary); font-size: 13px; }
.tss-renewal .rn-page-header__actions { display: flex; flex: 0 0 auto; align-items: center; gap: var(--rn-space-2); }

.tss-renewal .rn-mobile-menu,
.tss-renewal .rn-sidebar-backdrop { display: none; }

/*
 * Approved A shell adapter — Figma 157:1152.
 * 실제 default/TS/super-admin DOM을 바꾸지 않고 같은 220px navy navigation language를 적용한다.
 */
body.tss-renewal {
    --sidebar-w: var(--rn-sidebar-width);
    --super-sidebar-width: var(--rn-sidebar-width);
    --navbar-h: var(--rn-topbar-height);
    --tss-header-h: var(--rn-topbar-height);
    --tss-portal-sidebar-width: var(--rn-sidebar-width);
    --tss-portal-sidebar-top: var(--rn-topbar-height);
}

body.tss-renewal > header.navbar,
body.tss-renewal > nav.navbar {
    min-height: var(--rn-topbar-height);
    border-bottom: 1px solid var(--rn-border-default);
    background: var(--rn-bg-surface) !important;
    box-shadow: none !important;
}

body.tss-renewal .tss-nav-flex {
    min-height: var(--rn-topbar-height);
}

body.tss-renewal .tss-nav-left {
    align-self: stretch;
    width: var(--rn-sidebar-width);
    min-width: var(--rn-sidebar-width);
    padding-inline: var(--rn-space-5);
    background: var(--rn-bg-sidebar);
}

/* 기본 로고 variant는 밝은 헤더용이다. A안의 고정 Navy 브랜드 영역에서는 항상 고대비 워드마크를 쓴다. */
body.tss-renewal .tss-nav-left .tss-brand-logo__wordmark {
    color: var(--rn-text-on-dark) !important;
}

body.tss-renewal .tss-nav-right :where(.nav-link, .btn, button),
body.tss-renewal .tss-nav-right :where(.bi, .fas, .far) {
    color: var(--rn-text-secondary) !important;
}

body.tss-renewal .tss-nav-right :where(.nav-link, .btn, button):hover {
    color: var(--rn-text-primary) !important;
}

body.tss-renewal :where(.tss-portal-sidebar, #sidebarMenu.sidebar) {
    border-right: 1px solid color-mix(in srgb, var(--rn-text-on-dark) 10%, transparent) !important;
    background: var(--rn-bg-sidebar) !important;
    box-shadow: none !important;
    color: var(--rn-text-on-dark);
    scrollbar-color: color-mix(in srgb, var(--rn-text-on-dark) 24%, transparent) transparent;
}

body.tss-renewal #sidebarMenu.sidebar {
    flex-basis: var(--rn-sidebar-width) !important;
    width: var(--rn-sidebar-width) !important;
    max-width: var(--rn-sidebar-width) !important;
    background: var(--rn-bg-sidebar) !important;
    border-right-color: color-mix(in srgb, var(--rn-text-on-dark) 10%, transparent) !important;
    box-shadow: none !important;
}

body.tss-renewal #sidebarMenu .sidebar-nav::before {
    display: block;
    padding: var(--rn-space-4) var(--rn-space-5) var(--rn-space-2);
    color: color-mix(in srgb, var(--rn-text-on-dark) 48%, var(--rn-bg-sidebar));
    content: "WORKSPACE";
    font-size: 9px;
    font-weight: var(--rn-font-weight-bold);
    letter-spacing: 0.1em;
}

body.tss-renewal #sidebarMenu .sidebar-nav > .nav {
    gap: 2px;
    padding: 0 var(--rn-space-5) var(--rn-space-5);
}

body.tss-renewal :where(
    .tss-portal-sidebar__link,
    .tss-portal-sidebar__accordion-btn,
    #sidebarMenu.sidebar .nav-link
) {
    min-height: 38px;
    margin: 0;
    gap: 10px;
    padding: 8px 12px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: color-mix(in srgb, var(--rn-text-on-dark) 72%, var(--rn-bg-sidebar));
    font-size: 12px;
    font-weight: var(--rn-font-weight-medium);
    line-height: 1.4;
}

body.tss-renewal :where(
    .tss-portal-sidebar__link,
    .tss-portal-sidebar__accordion-btn,
    #sidebarMenu.sidebar .nav-link
):hover {
    background: color-mix(in srgb, var(--rn-text-on-dark) 7%, transparent);
    color: var(--rn-text-on-dark);
    text-decoration: none;
}

body.tss-renewal :where(
    .tss-portal-sidebar__link.is-active,
    .tss-portal-sidebar__accordion-btn.is-active,
    #sidebarMenu.sidebar .nav-link.active
) {
    background: var(--rn-accent-soft) !important;
    color: var(--rn-text-accent) !important;
    font-weight: var(--rn-font-weight-bold);
}

body.tss-renewal #sidebarMenu.sidebar .nav-link.active::before {
    display: none;
}

body.tss-renewal :where(
    .tss-portal-sidebar__link,
    .tss-portal-sidebar__accordion-btn,
    #sidebarMenu.sidebar .nav-link
) > i {
    width: 16px;
    height: auto;
    margin: 0;
    color: color-mix(in srgb, var(--rn-text-on-dark) 58%, var(--rn-bg-sidebar));
    font-size: 13px;
}

body.tss-renewal :where(
    .tss-portal-sidebar__link.is-active,
    .tss-portal-sidebar__accordion-btn.is-active,
    #sidebarMenu.sidebar .nav-link.active
) > i {
    color: var(--rn-text-accent) !important;
}

/* Child-tree geometry and connectors are owned by tss-sidebar-tree.css. */
body.tss-renewal .tss-portal-sidebar__sublink {
    background: transparent;
    color: color-mix(in srgb, var(--rn-text-on-dark) 70%, var(--rn-bg-sidebar));
    font-size: 12px;
}

body.tss-renewal .tss-portal-sidebar__sublink > i {
    width: 14px;
    color: color-mix(in srgb, var(--rn-text-on-dark) 54%, var(--rn-bg-sidebar));
    font-size: 11px;
}

body.tss-renewal .tss-portal-sidebar__sublink:hover,
body.tss-renewal .tss-portal-sidebar__sublink.is-active {
    background: color-mix(in srgb, var(--rn-text-on-dark) 9%, transparent);
    color: var(--rn-text-on-dark);
}

body.tss-renewal .tss-portal-sidebar__sublink.is-active {
    box-shadow: inset 3px 0 var(--rn-accent);
    font-weight: var(--rn-font-weight-bold);
}

body.tss-renewal #sidebarMenu.sidebar .sidebar-group-title {
    padding: 16px 10px 6px;
    color: color-mix(in srgb, var(--rn-text-on-dark) 68%, var(--rn-bg-sidebar));
    font-size: 12px;
    font-weight: var(--rn-font-weight-medium);
    line-height: 18px;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

body.tss-renewal #sidebarMenu.sidebar .sidebar-group-title span {
    padding: 0;
    border: 0;
}

/*
 * TS/super-admin legacy CSS uses #sidebarMenu and Bootstrap spacing utilities.
 * Keep the live DOM and behavior, but make the approved A shell the visual authority.
 */
body.tss-renewal #sidebarMenu.sidebar .sidebar-nav-wrap {
    padding-top: 0;
}

body.tss-renewal #sidebarMenu.sidebar .sidebar-nav > .nav,
body.tss-renewal #sidebarMenu.sidebar ul.sidebar-nav {
    gap: 2px;
    padding: 0 var(--rn-space-5) var(--rn-space-5) !important;
}

body.tss-renewal #sidebarMenu.sidebar .nav-link {
    min-height: 38px;
    margin: 0;
    gap: 10px;
    padding: 8px 12px !important;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: color-mix(in srgb, var(--rn-text-on-dark) 72%, var(--rn-bg-sidebar));
    font-size: 12px;
    font-weight: var(--rn-font-weight-medium);
    line-height: 1.4;
}

body.tss-renewal #sidebarMenu.sidebar .nav-link:hover {
    background: color-mix(in srgb, var(--rn-text-on-dark) 7%, transparent);
    color: var(--rn-text-on-dark);
}

body.tss-renewal #sidebarMenu.sidebar .nav-link.active {
    background: var(--rn-accent-soft) !important;
    color: var(--rn-text-accent) !important;
    font-weight: var(--rn-font-weight-bold);
}

body.tss-renewal #sidebarMenu.sidebar .nav-link.active::before {
    display: none !important;
}

body.tss-renewal #sidebarMenu.sidebar .nav-link > i {
    width: 16px;
    min-width: 16px;
    height: auto;
    margin: 0 !important;
    color: color-mix(in srgb, var(--rn-text-on-dark) 58%, var(--rn-bg-sidebar));
    font-size: 13px;
}

body.tss-renewal #sidebarMenu.sidebar .nav-link:hover > i,
body.tss-renewal #sidebarMenu.sidebar .nav-link.active > i {
    color: currentColor !important;
}

body.tss-renewal #sidebarMenu.sidebar .nav .collapse .nav-link {
    color: color-mix(in srgb, var(--rn-text-on-dark) 70%, var(--rn-bg-sidebar));
    font-size: 12px;
}

body.tss-renewal #sidebarMenu.sidebar .nav .collapse .nav-link:hover {
    background: color-mix(in srgb, var(--rn-text-on-dark) 7%, transparent);
    color: var(--rn-text-on-dark) !important;
}

/* Light에서 밝은 선택 배경 위에 흰 글자가 올라가던 규칙 충돌을 제거한다. Dark도 동일 의미 토큰 쌍을 쓴다. */
body.tss-renewal #sidebarMenu.sidebar .nav .collapse .nav-link.active,
body.tss-renewal #sidebarMenu.sidebar .nav .collapse .nav-link.active:hover {
    background: var(--rn-bg-selected) !important;
    color: var(--rn-text-accent) !important;
}

@media (max-width: 991.98px) {
    body.tss-renewal .tss-nav-left {
        width: auto;
        min-width: 0;
        padding-left: 0;
        background: transparent;
    }

    body.tss-renewal .tss-nav-left .tss-brand-logo__wordmark {
        color: var(--rn-text-primary) !important;
    }
}

/* bundled: components.css */
/**
 * Step 4 — cardless common components and interaction-state contracts.
 * 반복 데이터에 독립된 둥근 카드와 부유 그림자를 사용하지 않는다.
 */

/* Buttons */
.tss-renewal .rn-button,
.tss-renewal .rn-icon-button {
    display: inline-flex;
    min-height: var(--rn-control-md);
    align-items: center;
    justify-content: center;
    gap: var(--rn-space-2);
    border: 1px solid transparent;
    border-radius: var(--rn-radius-sm);
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: border-color var(--rn-duration-fast) var(--rn-ease-standard), background var(--rn-duration-fast) var(--rn-ease-standard), color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal .rn-button { padding-inline: var(--rn-space-4); }
.tss-renewal .rn-button--small { min-height: var(--rn-control-sm); padding-inline: var(--rn-space-3); font-size: 12px; }
.tss-renewal .rn-button--large { min-height: var(--rn-control-lg); padding-inline: var(--rn-space-5); font-size: 14px; }
.tss-renewal .rn-button--block { width: 100%; }
.tss-renewal .rn-button--primary { background: var(--rn-accent); color: var(--rn-accent-contrast); }
.tss-renewal .rn-button--primary:hover { background: var(--rn-accent-hover); text-decoration: none; }
.tss-renewal .rn-button--primary:active,
.tss-renewal .rn-button--primary.is-active { background: var(--rn-accent-active); }
.tss-renewal .rn-button--secondary { border-color: var(--rn-border-default); background: var(--rn-bg-surface); color: var(--rn-text-primary); }
.tss-renewal .rn-button--secondary:hover { border-color: var(--rn-border-strong); background: var(--rn-bg-subtle); text-decoration: none; }
.tss-renewal .rn-button--secondary:active,
.tss-renewal .rn-button--secondary.is-active { border-color: var(--rn-text-accent); background: var(--rn-bg-selected); color: var(--rn-text-accent); }
.tss-renewal .rn-button--ghost { background: transparent; color: var(--rn-text-secondary); }
.tss-renewal .rn-button--ghost:hover { background: var(--rn-bg-subtle); color: var(--rn-text-primary); text-decoration: none; }
.tss-renewal .rn-button--danger { border-color: var(--rn-status-danger-border); color: var(--rn-status-danger); background: var(--rn-bg-surface); }
.tss-renewal .rn-button--danger:hover { background: var(--rn-status-danger-soft); text-decoration: none; }
.tss-renewal .rn-button:disabled,
.tss-renewal .rn-button[aria-disabled="true"] { border-color: var(--rn-border-subtle); background: var(--rn-bg-disabled); color: var(--rn-text-disabled); opacity: var(--rn-disabled-opacity); cursor: not-allowed; pointer-events: none; }
.tss-renewal .rn-button.is-loading { position: relative; cursor: wait; }
.tss-renewal .rn-button.is-loading::before {
    width: 14px;
    height: 14px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: rn-spin 0.72s linear infinite;
    content: "";
}
.tss-renewal .rn-icon-button { width: var(--rn-control-md); padding: 0; border-color: var(--rn-border-default); background: transparent; color: var(--rn-text-secondary); }
.tss-renewal .rn-icon-button:hover { background: var(--rn-bg-subtle); color: var(--rn-text-primary); }
.tss-renewal .rn-icon-button:active,
.tss-renewal .rn-icon-button[aria-pressed="true"] { border-color: var(--rn-text-accent); background: var(--rn-bg-selected); color: var(--rn-text-accent); }
.tss-renewal .rn-icon-button:disabled { color: var(--rn-text-disabled); cursor: not-allowed; opacity: var(--rn-disabled-opacity); }

.tss-renewal .rn-link { display: inline-flex; align-items: center; gap: var(--rn-space-1); color: var(--rn-text-link); font-weight: var(--rn-font-weight-medium); }
.tss-renewal .rn-link:hover { color: var(--rn-text-primary); }
.tss-renewal .rn-link[aria-disabled="true"] { color: var(--rn-text-disabled); pointer-events: none; text-decoration: none; }

@keyframes rn-spin { to { transform: rotate(360deg); } }

/* Form controls */
.tss-renewal .rn-field { display: grid; min-width: 0; gap: var(--rn-space-2); }
.tss-renewal .rn-field__label { color: var(--rn-text-secondary); font-size: 12px; font-weight: 500; }
.tss-renewal .rn-field__hint,
.tss-renewal .rn-field__error { margin: 0; font-size: 11px; }
.tss-renewal .rn-field__hint { color: var(--rn-text-secondary); }
.tss-renewal .rn-field__error { color: var(--rn-status-danger); }

.tss-renewal .rn-input,
.tss-renewal .rn-select,
.tss-renewal .rn-textarea {
    width: 100%;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-input);
    color: var(--rn-text-primary);
    transition: border-color var(--rn-duration-fast) var(--rn-ease-standard), background var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal .rn-input,
.tss-renewal .rn-select { min-height: var(--rn-control-md); padding-inline: var(--rn-space-3); }
.tss-renewal .rn-textarea { min-height: 112px; padding: var(--rn-space-3); resize: vertical; }
.tss-renewal :where(.rn-input, .rn-textarea)::placeholder { color: var(--rn-text-placeholder); }
.tss-renewal .rn-input:hover,
.tss-renewal .rn-select:hover,
.tss-renewal .rn-textarea:hover { border-color: var(--rn-border-strong); }
.tss-renewal :where(.rn-input, .rn-select, .rn-textarea):focus { border-color: var(--rn-border-focus); background: var(--rn-bg-surface); }
.tss-renewal :where(.rn-input, .rn-select, .rn-textarea):read-only { background: var(--rn-bg-subtle); color: var(--rn-text-secondary); }
.tss-renewal :where(.rn-input, .rn-select, .rn-textarea):disabled { background: var(--rn-bg-disabled); color: var(--rn-text-disabled); cursor: not-allowed; opacity: var(--rn-disabled-opacity); }
.tss-renewal .rn-field[aria-invalid="true"] :where(.rn-input, .rn-select, .rn-textarea) { border-color: var(--rn-status-danger); }
.tss-renewal .rn-field[aria-invalid="true"] :where(.rn-input, .rn-select, .rn-textarea):focus-visible { outline-color: var(--rn-status-danger); }

.tss-renewal .rn-search-control { position: relative; min-width: 0; }
.tss-renewal .rn-search-control > i { position: absolute; top: 50%; left: var(--rn-space-3); color: var(--rn-text-secondary); pointer-events: none; transform: translateY(-50%); }
.tss-renewal .rn-search-control .rn-input { padding-left: 36px; }
.tss-renewal .rn-search-control__clear { position: absolute; top: 50%; right: var(--rn-space-1); transform: translateY(-50%); }
.tss-renewal .rn-input-group { display: flex; min-width: 0; }
.tss-renewal .rn-input-group > :first-child { border-radius: var(--rn-radius-md) 0 0 var(--rn-radius-md); }
.tss-renewal .rn-input-group > :last-child { border-radius: 0 var(--rn-radius-md) var(--rn-radius-md) 0; }
.tss-renewal .rn-input-group > * + * { margin-left: -1px; }

.tss-renewal .rn-check {
    display: inline-flex;
    min-height: 32px;
    align-items: center;
    gap: var(--rn-space-2);
    color: var(--rn-text-primary);
    cursor: pointer;
}
.tss-renewal .rn-check input { width: 16px; height: 16px; accent-color: var(--rn-bg-accent); }

/* Status uses neutral surfaces; semantic color is reserved for text and icon. */
.tss-renewal .rn-badge {
    display: inline-flex;
    min-height: 24px;
    align-items: center;
    gap: var(--rn-space-1);
    padding-inline: var(--rn-space-2);
    border: 1px solid transparent;
    border-radius: var(--rn-radius-full);
    background: var(--rn-bg-subtle);
    color: var(--rn-text-secondary);
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap;
}
.tss-renewal .rn-badge--accent { border-color: var(--rn-status-info-border); background: var(--rn-bg-accent-soft); color: var(--rn-text-accent); }
.tss-renewal .rn-badge--success { border-color: var(--rn-status-success-border); color: var(--rn-status-success); }
.tss-renewal .rn-badge--warning { border-color: var(--rn-status-warning-border); background: var(--rn-bg-surface); color: var(--rn-status-warning); }
.tss-renewal .rn-badge--danger { border-color: var(--rn-status-danger-border); color: var(--rn-status-danger); }

/* Linear tabs, not detached tab cards. */
.tss-renewal .rn-tabs {
    display: flex;
    min-width: 0;
    overflow-x: auto;
    border-bottom: 1px solid var(--rn-border-default);
    scrollbar-width: none;
}
.tss-renewal .rn-tabs::-webkit-scrollbar { display: none; }
.tss-renewal .rn-tab {
    position: relative;
    display: inline-flex;
    min-height: 46px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: var(--rn-space-2);
    padding-inline: var(--rn-space-4);
    border: 0;
    background: transparent;
    color: var(--rn-text-secondary);
    font-weight: 500;
    cursor: pointer;
}
.tss-renewal .rn-tab:hover { color: var(--rn-text-primary); }
.tss-renewal .rn-tab:active { background: var(--rn-bg-hover); }
.tss-renewal .rn-tab:disabled,
.tss-renewal .rn-tab[aria-disabled="true"] { color: var(--rn-text-disabled); cursor: not-allowed; }
.tss-renewal .rn-tab[aria-selected="true"],
.tss-renewal .rn-tab[aria-current="page"] { color: var(--rn-text-accent); }
.tss-renewal .rn-tab[aria-selected="true"]::after,
.tss-renewal .rn-tab[aria-current="page"]::after { position: absolute; right: var(--rn-space-3); bottom: -1px; left: var(--rn-space-3); height: 2px; background: var(--rn-bg-accent); content: ""; }

/* One connected summary surface replaces multiple KPI cards. */
.tss-renewal .rn-summary-strip {
    display: grid;
    grid-template-columns: repeat(var(--rn-summary-columns, 4), minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}
.tss-renewal .rn-summary-strip__item {
    position: relative;
    display: grid;
    min-height: 82px;
    align-content: center;
    gap: 2px;
    padding: var(--rn-space-4) var(--rn-space-5);
}
.tss-renewal .rn-summary-strip__item + .rn-summary-strip__item::before { position: absolute; top: var(--rn-space-4); bottom: var(--rn-space-4); left: 0; width: 1px; background: var(--rn-border-default); content: ""; }
.tss-renewal .rn-summary-strip__label { color: var(--rn-text-secondary); font-size: 11px; font-weight: 500; }
.tss-renewal .rn-summary-strip__line { display: flex; align-items: baseline; gap: var(--rn-space-3); }
.tss-renewal .rn-summary-strip__value { color: var(--rn-text-primary); font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.03em; }
.tss-renewal .rn-summary-strip__meta { color: var(--rn-text-secondary); font-size: 11px; }

/* Structural panel: one per work area, never repeated as a content tile grid. */
.tss-renewal .rn-panel {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}
.tss-renewal .rn-panel__header {
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    gap: var(--rn-space-4);
    padding: var(--rn-space-3) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
}
.tss-renewal .rn-panel__title { margin: 0; font-size: 15px; }
.tss-renewal .rn-panel__description { margin: 3px 0 0; color: var(--rn-text-secondary); font-size: 11px; }
.tss-renewal .rn-panel__body { min-width: 0; }

/* A single analysis surface keeps filters, chart and legend in one hierarchy. */
.tss-renewal .rn-analysis-canvas {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}
.tss-renewal .rn-analysis-canvas__header { display: flex; min-height: 58px; align-items: center; justify-content: space-between; gap: var(--rn-space-4); padding: var(--rn-space-3) var(--rn-space-5); border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-analysis-canvas__body { min-height: 280px; }
.tss-renewal .rn-analysis-canvas__footer { padding: var(--rn-space-3) var(--rn-space-5); border-top: 1px solid var(--rn-border-default); color: var(--rn-text-secondary); }

.tss-renewal .rn-lab-notice {
    display: flex;
    align-items: flex-start;
    gap: var(--rn-space-3);
    padding: var(--rn-space-3) var(--rn-space-4);
    border-left: 3px solid var(--rn-bg-accent);
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-secondary);
    font-size: 12px;
    line-height: 1.6;
}
.tss-renewal .rn-lab-notice strong { color: var(--rn-text-primary); }

/* Compact toolbar replaces large filter cards. */
.tss-renewal .rn-toolbar {
    display: flex;
    min-height: 56px;
    align-items: center;
    gap: var(--rn-space-3);
    padding: var(--rn-space-2) var(--rn-space-3);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}
.tss-renewal .rn-toolbar__search { min-width: 220px; flex: 1 1 340px; }
.tss-renewal .rn-toolbar__group { display: flex; align-items: center; gap: var(--rn-space-2); }
.tss-renewal .rn-toolbar__actions { display: flex; margin-left: auto; align-items: center; gap: var(--rn-space-2); }
.tss-renewal .rn-filter-control { display: inline-flex; min-height: 36px; align-items: center; gap: var(--rn-space-2); padding-inline: var(--rn-space-3); border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-md); background: var(--rn-bg-surface); color: var(--rn-text-secondary); white-space: nowrap; }
.tss-renewal .rn-filter-control:hover { border-color: var(--rn-border-strong); color: var(--rn-text-primary); }
.tss-renewal .rn-filter-control[aria-pressed="true"] { border-color: var(--rn-text-accent); background: var(--rn-bg-selected); color: var(--rn-text-accent); }

/* Data table/list: flat rows, shared columns and one outer surface. */
.tss-renewal .rn-data-table { width: 100%; border-collapse: collapse; border-spacing: 0; }
.tss-renewal .rn-data-table th { height: 42px; padding: 0 var(--rn-space-4); border-bottom: 1px solid var(--rn-border-default); background: var(--rn-bg-section); color: var(--rn-text-secondary); font-size: 11px; font-weight: 500; text-align: left; white-space: nowrap; }
.tss-renewal .rn-data-table td { height: var(--rn-row-default); padding: 0 var(--rn-space-4); border-bottom: 1px solid var(--rn-border-default); color: var(--rn-text-secondary); vertical-align: middle; }
.tss-renewal .rn-data-table tbody tr:last-child td { border-bottom: 0; }
.tss-renewal .rn-data-table tbody tr { transition: background var(--rn-duration-fast) var(--rn-ease-standard); }
.tss-renewal .rn-data-table tbody tr:hover { background: var(--rn-bg-subtle); }
.tss-renewal .rn-data-table tbody tr[aria-selected="true"] { background: var(--rn-bg-accent-soft); box-shadow: inset 3px 0 var(--rn-bg-accent); }
.tss-renewal .rn-data-table tbody tr:focus-visible { position: relative; outline: var(--rn-focus-ring-width) solid var(--rn-border-focus); outline-offset: -2px; }
.tss-renewal .rn-data-table__primary { color: var(--rn-text-primary); font-weight: 500; }
.tss-renewal .rn-data-table__secondary { display: block; margin-top: 3px; color: var(--rn-text-secondary); font-size: 11px; }
.tss-renewal .rn-data-table__numeric { text-align: right; font-variant-numeric: tabular-nums; }

.tss-renewal .rn-data-list { margin: 0; padding: 0; list-style: none; }
.tss-renewal .rn-data-row {
    position: relative;
    display: grid;
    min-height: var(--rn-row-default);
    grid-template-columns: var(--rn-row-columns, minmax(220px, 2fr) repeat(3, minmax(100px, 1fr)));
    align-items: center;
    gap: var(--rn-space-4);
    padding-inline: var(--rn-space-4);
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
}
.tss-renewal .rn-data-row:last-child { border-bottom: 0; }
.tss-renewal .rn-data-row:hover { background: var(--rn-bg-subtle); }
.tss-renewal .rn-data-row[aria-selected="true"] { background: var(--rn-bg-accent-soft); box-shadow: inset 3px 0 var(--rn-bg-accent); }
.tss-renewal .rn-data-row:focus-visible { outline: var(--rn-focus-ring-width) solid var(--rn-border-focus); outline-offset: -2px; }
.tss-renewal .rn-data-row__title { min-width: 0; color: var(--rn-text-primary); font-weight: 500; }

/* Directory + list + detail rail. */
.tss-renewal .rn-split-workspace {
    display: grid;
    min-height: 520px;
    grid-template-columns: var(--rn-directory-width) minmax(0, 1fr) var(--rn-detail-width);
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}
.tss-renewal .rn-directory { min-width: 0; padding: var(--rn-space-5) var(--rn-space-4); border-right: 1px solid var(--rn-border-default); background: var(--rn-bg-section); }
.tss-renewal .rn-directory__title { margin: 0 0 var(--rn-space-4); font-size: 14px; }
.tss-renewal .rn-directory__list { display: grid; gap: var(--rn-space-1); margin: 0; padding: 0; list-style: none; }
.tss-renewal .rn-directory__item { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: var(--rn-space-3); padding-inline: var(--rn-space-3); border-radius: var(--rn-radius-md); color: var(--rn-text-primary); }
.tss-renewal .rn-directory__item:hover { background: color-mix(in srgb, var(--rn-bg-accent-soft) 55%, transparent); text-decoration: none; }
.tss-renewal .rn-directory__item[aria-current="page"],
.tss-renewal .rn-directory__item[aria-selected="true"] { background: var(--rn-bg-accent-soft); color: var(--rn-text-accent); font-weight: 500; }
.tss-renewal .rn-directory__count { color: var(--rn-text-secondary); font-size: 11px; font-variant-numeric: tabular-nums; }
.tss-renewal .rn-work-list { min-width: 0; background: var(--rn-bg-surface); }
.tss-renewal .rn-detail-rail { min-width: 0; padding: var(--rn-space-5); border-left: 1px solid var(--rn-border-default); background: var(--rn-bg-section); }

/* Form sections use hierarchy and dividers instead of one card per field group. */
.tss-renewal .rn-form-layout { border-block: 1px solid var(--rn-border-default); background: var(--rn-bg-surface); }
.tss-renewal .rn-form-section { display: grid; grid-template-columns: minmax(180px, 0.32fr) minmax(0, 1fr); gap: var(--rn-space-8); padding: var(--rn-space-6) var(--rn-space-5); border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-form-section:last-child { border-bottom: 0; }
.tss-renewal .rn-form-section__heading h2 { margin: 0 0 var(--rn-space-1); font-size: 15px; }
.tss-renewal .rn-form-section__heading p { margin: 0; color: var(--rn-text-secondary); font-size: 12px; }
.tss-renewal .rn-form-section__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rn-space-4); }
.tss-renewal .rn-field--full { grid-column: 1 / -1; }

/* Description, timeline and workflow status. */
.tss-renewal .rn-description-list { display: grid; grid-template-columns: minmax(100px, 0.45fr) minmax(0, 1fr); gap: var(--rn-space-3) var(--rn-space-4); margin: 0; }
.tss-renewal .rn-description-list dt { color: var(--rn-text-secondary); font-size: 12px; }
.tss-renewal .rn-description-list dd { margin: 0; color: var(--rn-text-primary); font-weight: 500; }
.tss-renewal .rn-timeline { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.tss-renewal .rn-timeline__item { position: relative; display: grid; min-height: 58px; grid-template-columns: 20px minmax(0, 1fr); gap: var(--rn-space-3); }
.tss-renewal .rn-timeline__item::before { position: absolute; top: 18px; bottom: -10px; left: 5px; width: 1px; background: var(--rn-border-default); content: ""; }
.tss-renewal .rn-timeline__item:last-child::before { display: none; }
.tss-renewal .rn-timeline__dot { width: 11px; height: 11px; margin-top: 5px; border: 2px solid var(--rn-bg-surface); border-radius: 50%; background: var(--rn-border-strong); box-shadow: 0 0 0 1px var(--rn-border-default); }
.tss-renewal .rn-timeline__item.is-current .rn-timeline__dot { background: var(--rn-bg-accent); }
.tss-renewal .rn-timeline__title { color: var(--rn-text-primary); font-size: 12px; font-weight: 500; }
.tss-renewal .rn-timeline__meta { color: var(--rn-text-secondary); font-size: 11px; }

/* Feedback layers are allowed to float because they are transient, not repeated content. */
.tss-renewal .rn-modal-backdrop { position: fixed; inset: 0; z-index: var(--rn-z-modal); display: grid; place-items: center; padding: var(--rn-space-6); background: var(--rn-bg-overlay); }
.tss-renewal .rn-modal-backdrop[hidden],
.tss-renewal .rn-drawer-backdrop[hidden],
.tss-renewal .rn-drawer[hidden],
.tss-renewal .rn-toast[hidden],
.tss-renewal .rn-alert[hidden] { display: none; }
.tss-renewal .rn-modal { width: min(640px, 100%); max-height: min(760px, calc(100vh - 48px)); overflow: auto; border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-lg); background: var(--rn-bg-surface); box-shadow: var(--rn-shadow-overlay); }
.tss-renewal .rn-modal__header,
.tss-renewal .rn-modal__footer { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: var(--rn-space-4); padding: var(--rn-space-3) var(--rn-space-5); }
.tss-renewal .rn-modal__header { border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-modal__footer { justify-content: flex-end; border-top: 1px solid var(--rn-border-default); }
.tss-renewal .rn-modal__body { padding: var(--rn-space-5); }
.tss-renewal .rn-drawer-backdrop { position: fixed; inset: 0; z-index: var(--rn-z-overlay); background: var(--rn-bg-overlay); }
.tss-renewal .rn-drawer { position: fixed; top: 0; right: 0; z-index: var(--rn-z-modal); display: grid; width: min(440px, 100vw); height: 100vh; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; border-left: 1px solid var(--rn-border-default); background: var(--rn-bg-surface); box-shadow: var(--rn-shadow-overlay); }
.tss-renewal .rn-drawer__header,
.tss-renewal .rn-drawer__footer { display: flex; min-height: 64px; align-items: center; justify-content: space-between; gap: var(--rn-space-4); padding: var(--rn-space-3) var(--rn-space-5); }
.tss-renewal .rn-drawer__header { border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-drawer__body { overflow: auto; padding: var(--rn-space-5); }
.tss-renewal .rn-drawer__footer { justify-content: flex-end; border-top: 1px solid var(--rn-border-default); }

.tss-renewal .rn-alert {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: var(--rn-space-3);
    align-items: flex-start;
    padding: var(--rn-space-3) var(--rn-space-4);
    border: 1px solid var(--rn-border-default);
    border-left-width: 3px;
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
    color: var(--rn-text-secondary);
}
.tss-renewal .rn-alert strong { display: block; margin-bottom: 2px; color: var(--rn-text-primary); }
.tss-renewal .rn-alert p { margin: 0; font-size: var(--rn-font-size-compact); line-height: var(--rn-line-height-compact); }
.tss-renewal .rn-alert--info { border-color: var(--rn-status-info-border); border-left-color: var(--rn-status-info); }
.tss-renewal .rn-alert--success { border-color: var(--rn-status-success-border); border-left-color: var(--rn-status-success); }
.tss-renewal .rn-alert--warning { border-color: var(--rn-status-warning-border); border-left-color: var(--rn-status-warning); }
.tss-renewal .rn-alert--danger { border-color: var(--rn-status-danger-border); border-left-color: var(--rn-status-danger); }
.tss-renewal .rn-alert--info > i { color: var(--rn-status-info); }
.tss-renewal .rn-alert--success > i { color: var(--rn-status-success); }
.tss-renewal .rn-alert--warning > i { color: var(--rn-status-warning); }
.tss-renewal .rn-alert--danger > i { color: var(--rn-status-danger); }

.tss-renewal .rn-toast-stack { position: fixed; right: var(--rn-space-5); bottom: var(--rn-space-5); z-index: var(--rn-z-toast); display: grid; width: min(380px, calc(100vw - 32px)); gap: var(--rn-space-2); }
.tss-renewal .rn-toast { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: var(--rn-space-3); align-items: center; padding: var(--rn-space-3) var(--rn-space-4); border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-md); background: var(--rn-bg-elevated); box-shadow: var(--rn-shadow-floating); color: var(--rn-text-secondary); }
.tss-renewal .rn-toast strong { color: var(--rn-text-primary); }

.tss-renewal .rn-empty,
.tss-renewal .rn-error-state { display: grid; min-height: 240px; place-items: center; align-content: center; gap: var(--rn-space-3); padding: var(--rn-space-8); color: var(--rn-text-secondary); text-align: center; }
.tss-renewal .rn-empty__title,
.tss-renewal .rn-error-state__title { margin: 0; color: var(--rn-text-primary); font-size: 16px; }
.tss-renewal .rn-skeleton { overflow: hidden; border-radius: var(--rn-radius-sm); background: linear-gradient(90deg, var(--rn-bg-subtle) 20%, color-mix(in srgb, var(--rn-border-default) 65%, var(--rn-bg-subtle)) 50%, var(--rn-bg-subtle) 80%); background-size: 200% 100%; animation: rn-skeleton 1.35s ease-in-out infinite; }
@keyframes rn-skeleton { to { background-position-x: -200%; } }

.tss-renewal .rn-spinner { display: inline-block; width: 22px; height: 22px; border: 2px solid var(--rn-border-default); border-top-color: var(--rn-accent); border-radius: 50%; animation: rn-spin 0.72s linear infinite; }

.tss-renewal .rn-pagination { display: flex; min-height: 52px; align-items: center; justify-content: space-between; gap: var(--rn-space-4); padding: var(--rn-space-2) var(--rn-space-4); border-top: 1px solid var(--rn-border-default); color: var(--rn-text-secondary); font-size: 12px; }
.tss-renewal .rn-pagination__pages { display: flex; align-items: center; gap: var(--rn-space-1); }
.tss-renewal .rn-page {
    display: inline-grid;
    min-width: var(--rn-control-sm);
    min-height: var(--rn-control-sm);
    place-items: center;
    padding-inline: var(--rn-space-2);
    border: 1px solid transparent;
    border-radius: var(--rn-radius-sm);
    background: transparent;
    color: var(--rn-text-secondary);
    cursor: pointer;
}
.tss-renewal .rn-page:hover { background: var(--rn-bg-hover); color: var(--rn-text-primary); }
.tss-renewal .rn-page[aria-current="page"] { border-color: var(--rn-status-info-border); background: var(--rn-bg-selected); color: var(--rn-text-accent); font-weight: var(--rn-font-weight-bold); }
.tss-renewal .rn-page:disabled,
.tss-renewal .rn-page[aria-disabled="true"] { color: var(--rn-text-disabled); cursor: not-allowed; }

/* bundled: modules.css */
/** Step 4~5 — module composition rules built from the shared cardless patterns. */

/* Home portal */
.tss-renewal .rn-home {
    display: grid;
    gap: var(--rn-space-5);
}
.tss-renewal .rn-home__workspace {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, 0.9fr);
    gap: var(--rn-space-5);
    align-items: start;
}
.tss-renewal .rn-home__aside { display: grid; gap: var(--rn-space-5); }
.tss-renewal .rn-home-feed { margin: 0; padding: 0; list-style: none; }
.tss-renewal .rn-home-feed__item { display: grid; min-height: 58px; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: var(--rn-space-3); padding-inline: var(--rn-space-5); border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-home-feed__item:last-child { border-bottom: 0; }
.tss-renewal .rn-home-feed__title { min-width: 0; color: var(--rn-text-primary); font-size: 12px; font-weight: 500; }
.tss-renewal .rn-home-feed__meta { color: var(--rn-text-secondary); font-size: 10px; }

/* Electronic approval */
.tss-renewal .rn-approval {
    display: grid;
    gap: var(--rn-space-4);
}
.tss-renewal .rn-approval__workspace { --rn-detail-width: 280px; grid-template-columns: minmax(0, 1fr) var(--rn-detail-width); }
.tss-renewal .rn-approval__queue { min-width: 0; }
.tss-renewal .rn-approval__document { display: grid; min-width: 0; gap: 2px; }
.tss-renewal .rn-approval__document-number { color: var(--rn-text-secondary); font-size: 10px; }
.tss-renewal .rn-approval__amount { color: var(--rn-text-primary); font-weight: 600; font-variant-numeric: tabular-nums; }
.tss-renewal .rn-approval__due.is-urgent { color: var(--rn-status-danger); font-weight: 600; }
.tss-renewal .rn-approval-line { margin: 0; padding: 0; list-style: none; }
.tss-renewal .rn-approval-line__step { display: grid; min-height: 54px; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: var(--rn-space-3); }
.tss-renewal .rn-approval-line__number { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 50%; background: var(--rn-bg-subtle); color: var(--rn-text-secondary); font-size: 11px; font-weight: 600; }
.tss-renewal .rn-approval-line__step.is-complete .rn-approval-line__number,
.tss-renewal .rn-approval-line__step.is-current .rn-approval-line__number { background: var(--rn-bg-accent-soft); color: var(--rn-text-accent); }
.tss-renewal .rn-approval-form-actions { position: sticky; bottom: 0; z-index: 10; display: flex; justify-content: flex-end; gap: var(--rn-space-2); padding: var(--rn-space-3) var(--rn-space-5); border-top: 1px solid var(--rn-border-default); background: color-mix(in srgb, var(--rn-bg-surface) 94%, transparent); backdrop-filter: blur(12px); }

/* CRM */
.tss-renewal .rn-crm { display: grid; gap: var(--rn-space-4); }
.tss-renewal .rn-crm__workspace {
    --rn-directory-width: 250px;
    --rn-detail-width: 300px;
}
.tss-renewal .rn-crm__deal-code { color: var(--rn-text-primary); font-family: var(--rn-font-mono); font-size: 11px; font-weight: 600; }
.tss-renewal .rn-crm__company { color: var(--rn-text-primary); font-weight: 500; }
.tss-renewal .rn-crm__amount { color: var(--rn-text-primary); font-weight: 600; font-variant-numeric: tabular-nums; }
.tss-renewal .rn-crm-pipeline { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: hidden; border-block: 1px solid var(--rn-border-default); background: var(--rn-bg-surface); }
.tss-renewal .rn-crm-pipeline__stage { position: relative; min-height: 72px; padding: var(--rn-space-3) var(--rn-space-4); }
.tss-renewal .rn-crm-pipeline__stage + .rn-crm-pipeline__stage { border-left: 1px solid var(--rn-border-default); }
.tss-renewal .rn-crm-pipeline__label { color: var(--rn-text-secondary); font-size: 11px; }
.tss-renewal .rn-crm-pipeline__value { margin-top: 3px; color: var(--rn-text-primary); font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Community and boards */
.tss-renewal .rn-community { display: grid; gap: var(--rn-space-4); }
.tss-renewal .rn-community__workspace { grid-template-columns: 280px minmax(0, 1fr); }
.tss-renewal .rn-community__workspace .rn-detail-rail { display: none; }
.tss-renewal .rn-community-post { --rn-row-columns: 90px minmax(280px, 1fr) 100px 90px 64px; }
.tss-renewal .rn-community-post__category { color: var(--rn-text-accent); font-size: 11px; font-weight: 600; }
.tss-renewal .rn-community-post__title { min-width: 0; color: var(--rn-text-primary); font-weight: 500; }
.tss-renewal .rn-community-post.is-pinned::before { position: absolute; left: 7px; width: 5px; height: 5px; border-radius: 50%; background: var(--rn-bg-accent); content: ""; }
.tss-renewal .rn-post-view { max-width: 920px; margin-inline: auto; }
.tss-renewal .rn-post-view__header { padding: var(--rn-space-6) 0; border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-post-view__meta { display: flex; flex-wrap: wrap; gap: var(--rn-space-2) var(--rn-space-4); color: var(--rn-text-secondary); font-size: 12px; }
.tss-renewal .rn-post-view__body { min-height: 320px; padding-block: var(--rn-space-8); border-bottom: 1px solid var(--rn-border-default); color: var(--rn-text-primary); font-size: 15px; line-height: 1.75; }

/* Ticket and request intake queues */
.tss-renewal .rn-request-queue { display: grid; gap: var(--rn-space-4); }
.tss-renewal .rn-request-queue__workspace { grid-template-columns: 240px minmax(0, 1fr) 320px; }
.tss-renewal .rn-request-row { --rn-row-columns: 120px minmax(240px, 2fr) 110px 100px 100px; }
.tss-renewal .rn-request-row__priority { display: inline-flex; align-items: center; gap: var(--rn-space-1); font-size: 11px; font-weight: 600; }
.tss-renewal .rn-request-row__priority::before { width: 7px; height: 7px; border-radius: 50%; background: var(--rn-border-strong); content: ""; }
.tss-renewal .rn-request-row__priority.is-high { color: var(--rn-status-danger); }
.tss-renewal .rn-request-row__priority.is-high::before { background: var(--rn-status-danger); }
.tss-renewal .rn-request-row__priority.is-medium { color: var(--rn-status-warning); }
.tss-renewal .rn-request-row__priority.is-medium::before { background: var(--rn-status-warning); }

/* Document library */
.tss-renewal .rn-document-library { display: grid; min-height: calc(100vh - var(--rn-topbar-height) - 64px); grid-template-columns: 260px minmax(0, 1fr) 320px; overflow: hidden; border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-lg); background: var(--rn-bg-surface); }
.tss-renewal .rn-folder-tree { overflow: auto; padding: var(--rn-space-4); border-right: 1px solid var(--rn-border-default); background: var(--rn-bg-section); }
.tss-renewal .rn-folder-tree__item { display: flex; min-height: 36px; align-items: center; gap: var(--rn-space-2); padding-inline: var(--rn-space-2); border-radius: var(--rn-radius-sm); color: var(--rn-text-secondary); }
.tss-renewal .rn-folder-tree__item:hover { background: var(--rn-bg-accent-soft); color: var(--rn-text-primary); text-decoration: none; }
.tss-renewal .rn-folder-tree__item[aria-current="page"] { background: var(--rn-bg-accent-soft); color: var(--rn-text-accent); font-weight: 500; }
.tss-renewal .rn-document-list { min-width: 0; }
.tss-renewal .rn-document-preview { overflow: auto; padding: var(--rn-space-5); border-left: 1px solid var(--rn-border-default); background: var(--rn-bg-section); }
.tss-renewal .rn-document-row { --rn-row-columns: minmax(260px, 2fr) 110px 100px 90px; }

/* Reservations */
.tss-renewal .rn-resources { display: grid; gap: var(--rn-space-4); }
.tss-renewal .rn-resource-layout { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: var(--rn-space-4); }
.tss-renewal .rn-resource-list { overflow: hidden; border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-lg); background: var(--rn-bg-surface); }
.tss-renewal .rn-resource-list__item { display: grid; min-height: 64px; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: var(--rn-space-3); padding-inline: var(--rn-space-4); border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .rn-resource-list__item:last-child { border-bottom: 0; }
.tss-renewal .rn-resource-list__item[aria-selected="true"] { background: var(--rn-bg-accent-soft); box-shadow: inset 3px 0 var(--rn-bg-accent); }
.tss-renewal .rn-calendar { min-width: 760px; border-collapse: collapse; table-layout: fixed; }
.tss-renewal .rn-calendar th { height: 42px; border-bottom: 1px solid var(--rn-border-default); color: var(--rn-text-secondary); font-size: 11px; font-weight: 500; }
.tss-renewal .rn-calendar td { height: 112px; padding: var(--rn-space-2); border-right: 1px solid var(--rn-border-default); border-bottom: 1px solid var(--rn-border-default); vertical-align: top; }
.tss-renewal .rn-calendar td:last-child { border-right: 0; }
.tss-renewal .rn-calendar-event { display: block; margin-top: var(--rn-space-1); padding: 4px 6px; border-left: 3px solid var(--rn-bg-accent); background: var(--rn-bg-accent-soft); color: var(--rn-text-accent); font-size: 10px; }

/* Dashboards: one analytical canvas, not a tile wall. */
.tss-renewal .rn-dashboard { display: grid; gap: var(--rn-space-5); }
.tss-renewal .rn-dashboard__canvas { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, 0.8fr); border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-lg); background: var(--rn-bg-surface); }
.tss-renewal .rn-chart-region { min-width: 0; min-height: 360px; padding: var(--rn-space-5); }
.tss-renewal .rn-chart-region + .rn-chart-region { border-left: 1px solid var(--rn-border-default); }
.tss-renewal .rn-chart-region__header { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--rn-space-4); margin-bottom: var(--rn-space-5); }
.tss-renewal .rn-chart-placeholder { display: grid; min-height: 280px; place-items: center; border-block: 1px dashed var(--rn-border-default); color: var(--rn-text-secondary); }

/* Admin */
.tss-renewal .rn-admin { --rn-content-max: 1440px; }
.tss-renewal .rn-admin__layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: var(--rn-space-5); }
.tss-renewal .rn-admin__subnav { position: sticky; top: calc(var(--rn-topbar-height) + var(--rn-space-5)); align-self: start; padding: var(--rn-space-3); border-right: 1px solid var(--rn-border-default); }
.tss-renewal .rn-admin__content { min-width: 0; }
.tss-renewal .rn-admin-table td { height: var(--rn-row-compact); font-size: 12px; }
.tss-renewal .rn-admin-bulkbar { display: flex; min-height: 48px; align-items: center; gap: var(--rn-space-3); padding-inline: var(--rn-space-4); border-bottom: 1px solid var(--rn-border-default); background: var(--rn-bg-accent-soft); color: var(--rn-text-accent); }

/* Global list and action contract ---------------------------------------
 * Source of truth: Figma Cardless UI 35:2 and document-library paging.
 * Every operational list exposes named columns on desktop and data labels
 * on compact screens. Buttons share one density regardless of module.
 */
.tss-renewal .rn-data-list {
    --rn-data-list-columns: minmax(220px, 2fr) minmax(120px, 1fr) minmax(120px, 1fr) 108px;
    --rn-data-list-min-width: 760px;
    min-width: 0;
    overflow-x: auto;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal .rn-data-list__head,
.tss-renewal .rn-data-list__row {
    display: grid;
    grid-template-columns: var(--rn-data-list-columns);
    min-width: var(--rn-data-list-min-width, 760px);
    align-items: center;
    column-gap: var(--rn-space-3);
    padding-inline: var(--rn-space-4);
}

.tss-renewal .rn-data-list__head {
    min-height: 40px;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-divider);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-bold);
    line-height: var(--rn-line-height-label);
}

.tss-renewal .rn-data-list__row {
    min-height: 58px;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-divider);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal .rn-data-list__row:last-child { border-bottom: 0; }
.tss-renewal .rn-data-list__row:hover { background: var(--rn-bg-hover); }
.tss-renewal .rn-data-list__cell { min-width: 0; }
.tss-renewal .rn-data-list__cell--primary { color: var(--rn-text-primary); font-weight: var(--rn-font-weight-medium); }
.tss-renewal .rn-data-list__cell--secondary { color: var(--rn-text-secondary); }
.tss-renewal .rn-data-list__cell--number { font-variant-numeric: tabular-nums; text-align: right; }
.tss-renewal .rn-data-list__cell--actions { display: flex; align-items: center; justify-content: flex-end; gap: var(--rn-space-1); }
.tss-renewal .rn-data-list__cell--actions form { display: contents; }

.tss-renewal :where(.btn, .rn-button):not(.btn-close) {
    display: inline-flex;
    min-height: 36px;
    align-items: center;
    justify-content: center;
    gap: var(--rn-space-2);
    padding: 0 var(--rn-space-4);
    border-radius: var(--rn-radius-sm);
    font-size: var(--rn-font-size-compact);
    font-weight: var(--rn-font-weight-medium);
    line-height: 1;
    white-space: nowrap;
    box-shadow: none;
}

.tss-renewal :where(.btn-sm, .rn-button--sm):not(.btn-close) {
    min-height: 32px;
    padding-inline: var(--rn-space-3);
    font-size: var(--rn-font-size-label);
}

.tss-renewal :where(.rn-page-actions, .rn-list-actions, .rn-filter-actions) {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: var(--rn-space-2);
}

@media (max-width: 767.98px) {
    .tss-renewal .rn-data-list { overflow: visible; border-radius: var(--rn-radius-sm); }
    .tss-renewal .rn-data-list__head { display: none; }
    .tss-renewal .rn-data-list__row {
        min-width: 0;
        grid-template-columns: minmax(0, 1fr);
        row-gap: var(--rn-space-2);
        padding-block: var(--rn-space-3);
    }
    .tss-renewal .rn-data-list__cell {
        display: grid;
        grid-template-columns: minmax(84px, 32%) minmax(0, 1fr);
        align-items: start;
        gap: var(--rn-space-3);
    }
    .tss-renewal .rn-data-list__cell::before {
        color: var(--rn-text-secondary);
        font-size: var(--rn-font-size-label);
        font-weight: var(--rn-font-weight-medium);
        content: attr(data-label);
    }
    .tss-renewal .rn-data-list__cell--actions { justify-content: start; }
    .tss-renewal .rn-data-list__cell--number { text-align: left; }
}

/* Profile, settings and authentication: a single focused surface is allowed. */
.tss-renewal .rn-profile { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--rn-space-6); }
.tss-renewal .rn-profile__nav { padding-right: var(--rn-space-5); border-right: 1px solid var(--rn-border-default); }
.tss-renewal .rn-profile__content { min-width: 0; }
.tss-renewal .rn-auth { display: grid; min-height: 100vh; grid-template-columns: minmax(360px, 0.9fr) minmax(0, 1.4fr); background: var(--rn-bg-canvas); }
.tss-renewal .rn-auth__form { display: grid; align-content: center; padding: clamp(32px, 6vw, 96px); background: var(--rn-bg-surface); }
.tss-renewal .rn-auth__form-inner { width: min(420px, 100%); margin-inline: auto; }
.tss-renewal .rn-auth__visual { display: grid; place-items: center; padding: var(--rn-space-10); background: var(--rn-bg-sidebar); color: var(--rn-text-on-dark); }
.tss-renewal .rn-auth__visual :is(h1, h2, h3, h4, h5, h6, strong, b) { color: var(--rn-text-on-dark); }
.tss-renewal .rn-auth__visual :is(p, small) { color: color-mix(in srgb, var(--rn-text-on-dark) 78%, var(--rn-bg-sidebar)); }

/* bundled: home.css */
/**
 * UI Step 5 — 운영 홈포털 A안(157:1152).
 *
 * 실제 데이터, 권한 조건, 링크와 JavaScript ID는 user/dashboard.html 계약을 그대로 쓴다.
 * 이 파일은 .rn-home-portal 아래에서만 동작하므로 전역 화면과 기존 홈 복구 모드에 영향이 없다.
 */
.tss-renewal.rn-home-portal {
    --tss-bg: var(--rn-bg-canvas);
    --tss-surface: var(--rn-bg-surface);
    --tss-surface-muted: var(--rn-bg-subtle);
    --tss-text: var(--rn-text-primary);
    --tss-muted: var(--rn-text-secondary);
    --tss-border: var(--rn-border-default);
    --tss-accent: var(--rn-bg-accent);
    --tss-accent-soft: var(--rn-bg-accent-soft);
    --tss-accent-strong: var(--rn-text-accent);
    --tss-success: var(--rn-status-success);
    --tss-warning: var(--rn-status-warning);
    --tss-danger: var(--rn-status-danger);
    width: 100%;
    max-width: 1220px;
    margin: 0 auto;
    padding: 0 0 var(--rn-space-8);
    background: transparent;
}

.rn-home-portal .portal-home-alerts {
    margin-bottom: var(--rn-space-4);
}

.rn-home-portal .portal-greeting {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: 24px;
    font-weight: var(--rn-font-weight-bold);
    line-height: 34px;
    letter-spacing: -0.35px;
}

.rn-home-portal .portal-greeting-subtitle {
    margin: 2px 0 var(--rn-space-4);
    color: var(--rn-text-secondary);
    font-size: 12px;
    line-height: 18px;
}

.rn-home-portal .portal-greeting-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--rn-space-3);
}

.rn-home-portal .portal-widget-settings-link {
    flex: 0 0 auto;
    min-height: 36px;
}

.rn-home-portal .portal-widget-layout {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

/* 프로필·결재·대시보드는 원래 권한 DOM을 유지한 채 A안의 두 행에 재배치한다. */
.rn-home-portal :where(
    .portal-widget-zone--profile,
    .portal-widget-zone--approval,
    .portal-widget-zone--launcher
) {
    display: contents;
}

.rn-home-portal .portal-widget-zone--profile > .portal-bento-card {
    grid-column: 1 / span 4;
}

.rn-home-portal .portal-widget-zone--approval > .portal-bento-card--approval-summary {
    grid-column: 5 / -1;
}

.rn-home-portal .portal-widget-zone--approval > .portal-bento-card:not(.portal-bento-card--approval-summary) {
    grid-column: 1 / span 8;
}

.rn-home-portal .portal-widget-zone--launcher > .portal-bento-card {
    grid-column: 9 / -1;
}

.rn-home-portal .portal-widget-layout:not(:has([data-portal-widget="approval-summary"]))
    .portal-widget-zone--profile > .portal-bento-card {
    grid-column: 1 / -1;
}

.rn-home-portal .portal-widget-layout:not(:has([data-portal-widget="approval-pending"]))
    .portal-widget-zone--launcher > .portal-bento-card {
    grid-column: 1 / -1;
}

.rn-home-portal .portal-widget-layout:not(:has([data-portal-widget="approval-summary"])):not(:has([data-portal-widget="approval-pending"]))
    .portal-widget-zone--profile > .portal-bento-card {
    grid-column: 1 / span 6;
}

.rn-home-portal .portal-widget-layout:not(:has([data-portal-widget="approval-summary"])):not(:has([data-portal-widget="approval-pending"]))
    .portal-widget-zone--launcher > .portal-bento-card {
    grid-column: 7 / -1;
}

.rn-home-portal .portal-widget-layout:not(:has(.portal-widget-zone--launcher))
    [data-portal-widget="approval-pending"] {
    grid-column: 1 / -1;
}

.rn-home-portal .portal-bento-card {
    min-width: 0;
    padding: 16px 18px;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: 12px;
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.rn-home-portal .portal-bento-card:hover {
    transform: none;
    box-shadow: none;
}

.rn-home-portal .portal-bento-card > .portal-widget-header {
    min-height: 34px;
    padding: 0 0 var(--rn-space-2);
    border: 0;
}

.rn-home-portal .portal-bento-card > .portal-widget-body {
    padding: 0;
}

.rn-home-portal .portal-widget-title {
    gap: var(--rn-space-2);
    color: var(--rn-text-primary);
    font-size: 15px;
    font-weight: var(--rn-font-weight-bold);
    line-height: 22px;
}

.rn-home-portal .portal-widget-title > i {
    color: var(--rn-text-accent);
    font-size: 14px;
}

.rn-home-portal .portal-widget-link {
    min-height: 28px;
    color: var(--rn-text-accent);
    font-size: 11px;
    font-weight: var(--rn-font-weight-medium);
}

.rn-home-portal .portal-widget-link:hover {
    color: var(--rn-text-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* 프로필 */
.rn-home-portal .portal-bento-card--profile {
    min-height: 150px;
}

.rn-home-portal .portal-profile-section-title {
    margin-bottom: var(--rn-space-2);
    color: var(--rn-text-primary);
    font-size: 15px;
    font-weight: var(--rn-font-weight-bold);
    line-height: 26px;
}

.rn-home-portal .portal-bento-card--profile .portal-profile {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: var(--rn-space-3);
    align-items: center;
}

.rn-home-portal :where(
    .portal-avatar .dashboard-profile-wrap,
    .portal-avatar .dashboard-profile-image,
    .portal-avatar .dashboard-profile-placeholder
) {
    width: 64px;
    height: 64px;
}

.rn-home-portal .portal-avatar-online {
    display: none;
}

.rn-home-portal .dashboard-profile-placeholder.portal-avatar-initial,
.rn-home-portal .dashboard-profile-skeleton {
    border: 0;
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-accent);
    box-shadow: none;
}

.rn-home-portal .portal-avatar-letter {
    font-size: 20px;
}

.rn-home-portal .portal-bento-card--profile .portal-profile-main {
    display: contents;
}

.rn-home-portal .portal-bento-card--profile .portal-avatar {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.rn-home-portal .portal-bento-card--profile :is(.portal-profile-name, .portal-profile-meta) {
    grid-column: 2;
}

.rn-home-portal .portal-profile-name {
    margin: 0 0 2px;
    color: var(--rn-text-primary);
    font-size: 14px;
    font-weight: var(--rn-font-weight-bold);
    line-height: 20px;
}

.rn-home-portal .portal-profile .dashboard-role-badge {
    margin: 0;
    padding: 0;
    background: transparent;
    color: var(--rn-text-secondary);
    font-size: 10px;
    font-weight: var(--rn-font-weight-regular);
}

.rn-home-portal .portal-bento-card--profile .portal-profile-actions {
    grid-column: 1 / -1;
    grid-row: auto;
    display: flex;
    flex-wrap: wrap;
    gap: var(--rn-space-2);
    margin-top: var(--rn-space-2);
}

.rn-home-portal .portal-profile-actions .btn {
    display: inline-flex;
    flex: 1 1 auto;
    align-items: center;
    min-height: 36px;
    justify-content: center;
    padding: 7px 10px;
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-accent);
    font-size: 12px;
    font-weight: var(--rn-font-weight-medium);
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.4;
}

.rn-home-portal .portal-profile-actions .btn:hover {
    border-color: var(--rn-border-default);
    background: var(--rn-bg-hover);
    color: var(--rn-text-primary);
}

/* KPI는 작은 카드 묶음이 아니라 하나의 평면 요약 스트립으로 보인다. */
.rn-home-portal .portal-kpi-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
}

.rn-home-portal .portal-bento-card--approval-summary .portal-kpi-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.rn-home-portal .portal-bento-card--approval-summary .portal-kpi-grid--with-review {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.rn-home-portal .portal-kpi-grid--3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.rn-home-portal .portal-kpi-card {
    position: relative;
    min-width: 0;
    min-height: 68px;
    padding: 10px 12px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--rn-text-primary);
    filter: none;
}

/*
 * 기존 tss-theme.css의 상태별 틴트 배경은 html[data-tss-theme] 선택자를 사용한다.
 * 갱신 홈에서는 배경색을 중립화하고 값의 색으로만 상태를 구분해 A안의 절제된 톤을 유지한다.
 */
html[data-tss-theme] .rn-home-portal .portal-kpi-card,
html[data-tss-theme] .rn-home-portal .portal-kpi-card--pending,
html[data-tss-theme] .rn-home-portal .portal-kpi-card--progress,
html[data-tss-theme] .rn-home-portal .portal-kpi-card--done,
html[data-tss-theme] .rn-home-portal .portal-kpi-card--alert,
html[data-tss-theme] .rn-home-portal .portal-kpi-card--review {
    background: transparent;
}

.rn-home-portal .portal-kpi-card + .portal-kpi-card::before {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 0;
    width: 1px;
    background: var(--rn-border-default);
    content: "";
}

.rn-home-portal .portal-kpi-card:hover {
    background: var(--rn-bg-subtle);
    color: var(--rn-text-primary);
    filter: none;
    text-decoration: none;
}

.rn-home-portal .portal-kpi-label {
    margin: 0 0 4px;
    color: var(--rn-text-secondary);
    font-size: 11px;
    font-weight: var(--rn-font-weight-medium);
    line-height: 18px;
}

.rn-home-portal .portal-kpi-value,
.rn-home-portal :where(
    .portal-kpi-card--pending,
    .portal-kpi-card--progress,
    .portal-kpi-card--alert,
    .portal-kpi-card--review
) .portal-kpi-value {
    color: var(--rn-text-accent);
    font-size: 22px;
    font-weight: var(--rn-font-weight-bold);
    line-height: 30px;
    font-variant-numeric: tabular-nums;
}

html[data-tss-theme] .rn-home-portal :where(
    .portal-kpi-card--pending,
    .portal-kpi-card--progress,
    .portal-kpi-card--alert,
    .portal-kpi-card--review
) .portal-kpi-value {
    color: var(--rn-text-accent);
}

html[data-tss-theme] .rn-home-portal .portal-kpi-card--done .portal-kpi-value {
    color: var(--rn-status-success);
}

html[data-tss-theme] .rn-home-portal .portal-kpi-card--overdue .portal-kpi-value {
    color: var(--rn-status-warning);
}

.rn-home-portal .portal-kpi-card--done .portal-kpi-value {
    color: var(--rn-status-success);
}

.rn-home-portal .portal-kpi-card--overdue .portal-kpi-value {
    color: var(--rn-status-warning);
}

.rn-home-portal .portal-kpi-value.portal-kpi-value--status {
    font-size: 12px;
    line-height: 20px;
}

.rn-home-portal .portal-kpi-error {
    margin-top: var(--rn-space-2);
    color: var(--rn-status-danger);
    font-size: 11px;
}

/* 전자결재 대기·피드 행은 중첩 카드 대신 구분선 목록을 쓴다. */
.rn-home-portal .portal-approval-list {
    gap: 0;
}

.rn-home-portal .portal-approval-item {
    min-height: 50px;
    padding: 8px 4px;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
}

.rn-home-portal .portal-approval-item:last-child {
    border-bottom: 0;
}

.rn-home-portal .portal-approval-item:hover {
    background: var(--rn-bg-subtle);
}

.rn-home-portal .portal-approval-item-title,
.rn-home-portal .portal-feed-title {
    color: var(--rn-text-primary);
    font-size: 11px;
    font-weight: var(--rn-font-weight-bold);
    line-height: 18px;
}

.rn-home-portal .portal-approval-item-sub,
.rn-home-portal .portal-feed-sub,
.rn-home-portal .portal-feed-time {
    color: var(--rn-text-secondary);
    font-size: 10px;
    line-height: 16px;
}

.rn-home-portal .portal-approval-item-amount {
    color: var(--rn-text-secondary);
    font-size: 10px;
    font-weight: var(--rn-font-weight-medium);
}

/* 대시보드 바로가기 */
.rn-home-portal .portal-dash-tabs {
    gap: 4px;
    margin-bottom: var(--rn-space-2);
}

.rn-home-portal .portal-dash-tab {
    min-height: 28px;
    padding: 5px 10px;
    border: 0;
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-subtle);
    color: var(--rn-text-secondary);
    font-size: 10px;
}

.rn-home-portal .portal-dash-tab.is-active {
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-accent);
}

.rn-home-portal .portal-dash-link-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px;
}

.rn-home-portal .portal-dash-link-grid a {
    min-height: 38px;
    padding: 8px 10px;
    border: 0;
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-subtle);
    color: var(--rn-text-primary);
    font-size: 10px;
}

.rn-home-portal .portal-dash-link-grid a:hover {
    border: 0;
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-accent);
}

.rn-home-portal .portal-dash-carousel-btn {
    width: 28px;
    height: 28px;
    border-color: var(--rn-border-default);
    background: transparent;
    color: var(--rn-text-secondary);
}

.rn-home-portal .portal-dash-carousel-page-status {
    color: var(--rn-text-secondary);
    font-size: 10px;
}

/* 재무·CRM·자원예약은 A안의 한 개 업무 현황 패널로 묶는다. */
.rn-home-portal .portal-widget-zone--work {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    padding: 16px 18px;
    border: 1px solid var(--rn-border-default);
    border-radius: 12px;
    background: var(--rn-bg-surface);
}

.rn-home-portal .portal-widget-zone--work[data-visible-count="2"] {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* The CEO's fourth summary uses two readable rows instead of narrow columns. */
@media (min-width: 992px) {
    .rn-home-portal .portal-widget-zone--work[data-visible-count="4"] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 18px;
    }
    .rn-home-portal .portal-widget-zone--work[data-visible-count="4"] > .portal-bento-card:nth-of-type(odd) {
        padding-left: 0;
    }
    .rn-home-portal .portal-widget-zone--work[data-visible-count="4"] > .portal-bento-card:nth-of-type(even) {
        padding-right: 0;
        border-right: 0;
    }
}

.rn-home-portal .portal-widget-zone--work[data-visible-count="1"] {
    grid-template-columns: minmax(0, 1fr);
}

.rn-home-portal .portal-zone-title {
    grid-column: 1 / -1;
    margin: 0 0 var(--rn-space-3);
    color: var(--rn-text-primary);
    font-size: 15px;
    line-height: 22px;
}

.rn-home-portal .portal-widget-zone--work > .portal-bento-card {
    min-height: 116px;
    padding: 0 18px;
    border: 0;
    border-right: 1px solid var(--rn-border-default);
    border-radius: 0;
}

.rn-home-portal .portal-widget-zone--work > .portal-bento-card:first-of-type {
    padding-left: 0;
}

.rn-home-portal .portal-widget-zone--work > .portal-bento-card:last-child {
    padding-right: 0;
    border-right: 0;
}

/* 요청접수·콘텐츠·알림 */
.rn-home-portal .portal-widget-zone--task,
.rn-home-portal .portal-widget-zone--content,
.rn-home-portal .portal-widget-zone--notification {
    grid-column: 1 / -1;
}

.rn-home-portal .portal-widget-zone--task,
.rn-home-portal .portal-widget-zone--notification {
    grid-template-columns: minmax(0, 1fr);
}

.rn-home-portal .portal-widget-zone--content {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.rn-home-portal .portal-widget-zone--content[data-visible-count="1"] {
    grid-template-columns: minmax(0, 1fr);
}

.rn-home-portal .portal-ticket-scopes {
    gap: 0;
    padding: 4px 10px;
    background: var(--rn-bg-section);
}

.rn-home-portal .portal-ticket-scope {
    padding: 8px 10px;
}

.rn-home-portal #portalTicketHandleScope:not(.d-none) + #portalTicketMineScope {
    border-left-color: var(--rn-border-default);
}

.rn-home-portal .portal-ticket-scope-label {
    color: var(--rn-text-primary);
    font-size: 11px;
}

.rn-home-portal .portal-feed-list {
    gap: 0;
}

.rn-home-portal .portal-feed-list--divide .portal-feed-item {
    min-height: 48px;
    margin: 0;
    padding: 8px 4px;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
}

.rn-home-portal .portal-feed-list--divide .portal-feed-item:hover {
    background: var(--rn-bg-subtle);
}

.rn-home-portal .portal-feed-icon {
    width: 28px;
    height: 28px;
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-subtle);
    color: var(--rn-text-accent);
}

.rn-home-portal .portal-feed-icon--warn {
    background: var(--rn-status-warning-soft);
    color: var(--rn-status-warning);
}

.rn-home-portal .portal-widget-zone--notification .portal-feed-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 18px;
}

.rn-home-portal .portal-widget-empty {
    min-height: 72px;
    display: grid;
    place-items: center;
    margin: 0;
    padding: var(--rn-space-4);
    color: var(--rn-text-secondary);
    font-size: 11px;
}

@media (max-width: 1199.98px) {
    .tss-renewal.rn-home-portal {
        max-width: none;
    }

    .rn-home-portal .portal-widget-zone--profile > .portal-bento-card {
        grid-column: 1 / span 5;
    }

    .rn-home-portal .portal-widget-zone--approval > .portal-bento-card--approval-summary {
        grid-column: 6 / -1;
    }

    .rn-home-portal .portal-widget-layout:not(:has([data-portal-widget="approval-summary"]))
        .portal-widget-zone--profile > .portal-bento-card {
        grid-column: 1 / -1;
    }

    .rn-home-portal .portal-widget-zone--approval > .portal-bento-card:not(.portal-bento-card--approval-summary),
    .rn-home-portal .portal-widget-zone--launcher > .portal-bento-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 991.98px) {
    .rn-home-portal .portal-widget-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--rn-space-4);
    }

    .rn-home-portal .portal-widget-zone--profile > .portal-bento-card,
    .rn-home-portal .portal-widget-zone--approval > .portal-bento-card--approval-summary,
    .rn-home-portal .portal-widget-zone--approval > .portal-bento-card:not(.portal-bento-card--approval-summary),
    .rn-home-portal .portal-widget-zone--launcher > .portal-bento-card,
    .rn-home-portal .portal-widget-zone--work,
    .rn-home-portal .portal-widget-zone--task,
    .rn-home-portal .portal-widget-zone--content,
    .rn-home-portal .portal-widget-zone--notification {
        grid-column: 1 / -1;
        width: 100%;
    }

    .rn-home-portal .portal-widget-zone--work {
        grid-template-columns: minmax(0, 1fr);
    }

    .rn-home-portal .portal-widget-zone--work > .portal-bento-card,
    .rn-home-portal .portal-widget-zone--work > .portal-bento-card:first-of-type,
    .rn-home-portal .portal-widget-zone--work > .portal-bento-card:last-child {
        padding: 14px 0;
        border-right: 0;
        border-bottom: 1px solid var(--rn-border-default);
    }

    .rn-home-portal .portal-widget-zone--work > .portal-bento-card:last-child {
        border-bottom: 0;
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-home-portal {
        padding-bottom: var(--rn-space-5);
    }

    .rn-home-portal .portal-greeting {
        font-size: 21px;
        line-height: 30px;
    }

    .rn-home-portal .portal-greeting-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .rn-home-portal .portal-bento-card,
    .rn-home-portal .portal-widget-zone--work {
        padding: 14px;
        border-radius: var(--rn-radius-md);
    }

    .rn-home-portal .portal-bento-card--profile .portal-profile {
        grid-template-columns: 56px minmax(0, 1fr);
    }

    .rn-home-portal :where(
        .portal-avatar .dashboard-profile-wrap,
        .portal-avatar .dashboard-profile-image,
        .portal-avatar .dashboard-profile-placeholder
    ) {
        width: 56px;
        height: 56px;
    }

    .rn-home-portal .portal-bento-card--profile .portal-profile-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .rn-home-portal .portal-profile-actions .btn {
        min-height: 40px;
    }

    .rn-home-portal .portal-bento-card--approval-summary .portal-kpi-grid,
    .rn-home-portal .portal-bento-card--approval-summary .portal-kpi-grid--with-review,
    .rn-home-portal .portal-kpi-grid--3 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .rn-home-portal .portal-kpi-card:nth-child(odd)::before {
        display: none;
    }

    .rn-home-portal .portal-kpi-card:nth-child(n + 3) {
        border-top: 1px solid var(--rn-border-default);
    }

    .rn-home-portal .portal-dash-link-grid,
    .rn-home-portal .portal-widget-zone--notification .portal-feed-list {
        grid-template-columns: minmax(0, 1fr);
    }

    .rn-home-portal .portal-approval-item {
        align-items: flex-start;
    }

    .rn-home-portal .portal-approval-item-amount {
        max-width: 35%;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}

@media print {
    .rn-home-portal .portal-widget-layout {
        display: block;
    }

    .rn-home-portal .portal-bento-card,
    .rn-home-portal .portal-widget-zone--work {
        margin-bottom: 12px;
        break-inside: avoid;
        border-color: var(--rn-border-strong);
    }
}

/* bundled: approval.css */
/**
 * Step 6 · 사용자 전자결재 운영 화면
 * Figma: 20:180, 35:9, 105:736, 105:906, 105:1050
 * 목록·상태는 평면 행, KPI는 연결형 요약 스트립으로 표현한다.
 * 재무 지급결재·재무 확정 검토와 관리자 설정 화면은 이 파일의 opt-in 대상이 아니다.
 */

.tss-renewal.rn-approval-page {
    width: 100%;
    max-width: var(--rn-content-max);
    margin-inline: auto;
    color: var(--rn-text-primary);
    font-family: var(--rn-font-sans);
}

.tss-renewal.rn-approval-page :where(h1, h2, h3, h4, h5, h6) {
    color: var(--rn-text-primary);
    letter-spacing: -0.02em;
}

.tss-renewal.rn-approval-page :where(.text-muted, .form-text) {
    color: var(--rn-text-secondary) !important;
}

.tss-renewal.rn-approval-page .approval-page-header,
.tss-renewal.rn-approval-page .approval-detail-header {
    min-height: auto;
    margin-bottom: var(--rn-space-6) !important;
    padding-bottom: var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-approval-page .approval-page-header h2,
.tss-renewal.rn-approval-page .approval-detail-header__title,
.tss-renewal.rn-approval-page--form > h2 {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    font-weight: var(--rn-font-weight-bold);
    line-height: 1.3;
}

.tss-renewal.rn-approval-page .approval-page-header h2 i,
.tss-renewal.rn-approval-page--form > h2 i {
    color: var(--rn-accent) !important;
}

.tss-renewal.rn-approval-page .btn {
    min-height: 38px;
    border-radius: var(--rn-radius-sm);
    box-shadow: none !important;
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-approval-page .btn-sm {
    min-height: 32px;
}

.tss-renewal.rn-approval-page :where(.btn-tss-primary, .btn-primary) {
    color: var(--rn-accent-contrast);
    background: var(--rn-accent);
    border-color: var(--rn-accent);
}

.tss-renewal.rn-approval-page :where(.btn-tss-primary, .btn-primary):hover {
    color: var(--rn-accent-contrast);
    background: var(--rn-accent-hover);
    border-color: var(--rn-accent-hover);
}

.tss-renewal.rn-approval-page :where(.btn-tss-ghost, .btn-outline-secondary) {
    color: var(--rn-text-primary);
    background: transparent;
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-approval-page :where(.btn-tss-ghost, .btn-outline-secondary):hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-hover);
    border-color: var(--rn-border-strong);
}

.tss-renewal.rn-approval-page :where(.form-control, .form-select) {
    min-height: 38px;
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-approval-page :where(.form-control, .form-select):focus {
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 3px var(--rn-accent-soft);
}

.tss-renewal.rn-approval-page .form-label {
    margin-bottom: var(--rn-space-2);
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

/* 목록: 하나의 검색 바 + 선형 탭 + 공유 열을 갖는 평면 행. */
.tss-renewal.rn-approval-page--list .approval-list-toolbar {
    min-height: 0;
    height: auto;
    padding: var(--rn-space-3);
    margin-bottom: var(--rn-space-4);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-approval-page--list .approval-list-filter__basic,
.tss-renewal.rn-approval-page--list .approval-list-filter__advanced {
    min-height: 0;
    align-content: flex-start;
    justify-content: flex-start;
    gap: var(--rn-space-2);
}

.tss-renewal.rn-approval-page--list .approval-list-filter__basic {
    padding: 0;
}

.tss-renewal.rn-approval-page--list .approval-list-filter__field,
.tss-renewal.rn-approval-page--list .approval-list-filter__actions {
    align-self: flex-end;
}

.tss-renewal.rn-approval-page--list .approval-list-filter__advanced {
    padding-top: var(--rn-space-3);
    margin-top: var(--rn-space-3);
    border-top: 1px solid var(--rn-divider);
}

.tss-renewal.rn-approval-page--list .approval-tabs {
    gap: var(--rn-space-5);
    padding: 0;
    margin-bottom: var(--rn-space-2) !important;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
}

.tss-renewal.rn-approval-page--list .approval-tab {
    min-height: 42px;
    padding: 0 0 var(--rn-space-2);
    color: var(--rn-text-secondary);
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
}

.tss-renewal.rn-approval-page--list .approval-tab:hover {
    color: var(--rn-text-primary);
    background: transparent;
}

.tss-renewal.rn-approval-page--list .approval-tab.active {
    color: var(--rn-text-accent);
    background: transparent;
    border-bottom-color: var(--rn-accent);
}

.tss-renewal.rn-approval-page--list .approval-quick-filters {
    gap: var(--rn-space-2);
    padding-block: var(--rn-space-2) var(--rn-space-3);
}

.tss-renewal.rn-approval-page--list .approval-quick-filter {
    min-height: 30px;
    padding: var(--rn-space-1) var(--rn-space-3);
    color: var(--rn-text-secondary);
    background: transparent;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-full);
}

.tss-renewal.rn-approval-page--list .approval-quick-filter[aria-pressed="true"] {
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
    border-color: var(--rn-status-info-border);
}

.tss-renewal.rn-approval-page--list .approval-bulk-toolbar {
    padding: var(--rn-space-2) var(--rn-space-3);
    margin-bottom: var(--rn-space-2);
    background: var(--rn-bg-section);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-approval-page--list .approval-list-panel {
    box-shadow: none;
}

.tss-renewal.rn-approval-page--list .approval-list-row {
    min-height: 60px;
    height: auto;
}

.tss-renewal.rn-approval-page--list .approval-list-pager {
    padding-top: var(--rn-space-4);
    color: var(--rn-text-secondary);
}

/* 결재현황: 네 개의 독립 카드를 하나의 연결형 summary strip으로 바꾼다. */
.tss-renewal.rn-approval-page--dashboard #kpiRow {
    margin-bottom: var(--rn-space-4) !important;
}

.tss-renewal.rn-approval-page--dashboard #kpiRow .approval-kpi-value--pending,
.tss-renewal.rn-approval-page--dashboard #kpiRow .approval-kpi-value--audit {
    color: var(--rn-status-warning);
}

.tss-renewal.rn-approval-page--dashboard #kpiRow .approval-kpi-value--approved {
    color: var(--rn-status-success);
}

.tss-renewal.rn-approval-page--dashboard #kpiRow .approval-kpi-value--drafting {
    color: var(--rn-text-primary);
}

/* 의미 단위 패널만 남기고 중첩 카드의 장식은 제거한다. */
.tss-renewal.rn-approval-page .approval-section-card {
    margin-bottom: var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-approval-page .approval-section-header {
    min-height: 48px;
    padding: 0 var(--rn-space-4);
    color: var(--rn-text-primary);
    background: transparent;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-approval-page .approval-section-header i {
    color: var(--rn-text-accent);
}

.tss-renewal.rn-approval-page .approval-section-body {
    padding: var(--rn-space-5);
    color: var(--rn-text-primary);
}

/* 상세: 상단 메타 스트립 + 본문/결재선 분할 작업공간. */
.tss-renewal.rn-approval-page--detail .approval-detail-header__docno {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-approval-page--detail .approval-meta-bar {
    gap: 0;
    padding: var(--rn-space-3) 0;
    margin-bottom: var(--rn-space-4);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-approval-page--detail .approval-meta-bar__item {
    min-width: 130px;
    padding: var(--rn-space-2) var(--rn-space-4);
    border-left: 1px solid var(--rn-divider);
}

.tss-renewal.rn-approval-page--detail .approval-meta-bar__item:first-child {
    border-left: 0;
}

.tss-renewal.rn-approval-page--detail .approval-meta-bar__label {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-approval-page--detail .approval-meta-bar__value {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-approval-page--detail .approval-detail-layout {
    grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
    gap: var(--rn-space-4);
}

.tss-renewal.rn-approval-page--detail .approval-detail-layout__side {
    position: sticky;
    top: calc(var(--rn-topbar-height) + var(--rn-space-4));
}

.tss-renewal.rn-approval-page--detail .approval-stamp-board {
    display: grid;
    gap: 0;
    padding: 0;
}

.tss-renewal.rn-approval-page--detail .approval-stamp-col {
    min-width: 0;
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

.tss-renewal.rn-approval-page--detail .approval-stamp-cell {
    display: grid;
    grid-template-columns: minmax(84px, auto) 64px minmax(0, 1fr);
    min-height: 64px;
    padding: var(--rn-space-2) var(--rn-space-3);
    border: 0;
    border-bottom: 1px solid var(--rn-divider);
    border-radius: 0;
    background: transparent;
}

.tss-renewal.rn-approval-page--detail .approval-stamp-cell:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-approval-page--detail .approval-stamp-cell__role {
    color: var(--rn-text-secondary);
    border: 0;
    text-align: left;
}

.tss-renewal.rn-approval-page--detail .approval-stamp-cell__footer {
    min-width: 0;
    color: var(--rn-text-primary);
    border-top: 0;
    padding-top: 0;
}

.tss-renewal.rn-approval-page--detail :where(.table, .approval-voucher-table) {
    --bs-table-bg: transparent;
    --bs-table-color: var(--rn-text-primary);
    --bs-table-border-color: var(--rn-border-default);
}

/* 작성/수정: 기존 조건부 필드와 ID를 유지한 채 긴 폼을 선형 섹션으로 정돈한다. */
.tss-renewal.rn-approval-page--form > h2 {
    margin-bottom: var(--rn-space-5) !important;
}

.tss-renewal.rn-approval-page--form #approvalForm {
    display: grid;
    gap: var(--rn-space-4);
}

.tss-renewal.rn-approval-page--form #approvalForm > .approval-section-card {
    margin-bottom: 0;
}

.tss-renewal.rn-approval-page--form .approval-category-chips {
    gap: var(--rn-space-2);
}

.tss-renewal.rn-approval-page--form .approval-category-chip {
    color: var(--rn-text-secondary);
    background: transparent;
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-full);
}

.tss-renewal.rn-approval-page--form .approval-category-chip:is(.active, [aria-pressed="true"]) {
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
    border-color: var(--rn-status-info-border);
}

.tss-renewal.rn-approval-page--form :where(.approval-line-items, .approval-line-item-row) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
    border-color: var(--rn-border-default);
    box-shadow: none;
}

.tss-renewal.rn-approval-page--form .approval-form-error-panel {
    color: var(--rn-status-danger);
    background: var(--rn-status-danger-soft);
    border-color: var(--rn-status-danger-border);
}

/* 위임 설정: 등록 폼은 의미 패널, 등록 내역은 평면 표 행. */
.tss-renewal.rn-approval-page--delegation .approval-delegation-table {
    margin: 0;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--rn-radius-md);
    overflow: hidden;
}

.tss-renewal.rn-approval-page--delegation .approval-delegation-table > :not(caption) > * > * {
    padding: var(--rn-space-3) var(--rn-space-4);
    color: var(--rn-text-primary);
    background: transparent;
    border-bottom-color: var(--rn-divider);
}

.tss-renewal.rn-approval-page--delegation .approval-delegation-table thead th {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

/* 전자결재 전용 보조 메뉴. 재무 Step 10 화면은 opt-in 클래스가 붙지 않는다. */
.rn-approval-subnav {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface) !important;
    border-right-color: var(--rn-border-default) !important;
}

.rn-approval-subnav .approval-sidebar__brand {
    color: var(--rn-text-primary);
    border-bottom-color: var(--rn-divider);
}

.rn-approval-subnav .approval-sidebar__brand i,
.rn-approval-subnav .approval-sidebar__link:is(:hover, .is-active) {
    color: var(--rn-text-accent);
}

.rn-approval-subnav .approval-sidebar__section-title {
    color: var(--rn-text-muted);
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.rn-approval-subnav .approval-sidebar__link {
    color: var(--rn-text-secondary);
    border-left-color: transparent;
    border-radius: var(--rn-radius-sm);
}

.rn-approval-subnav .approval-sidebar__link:hover {
    background: var(--rn-bg-hover);
}

.rn-approval-subnav .approval-sidebar__link.is-active {
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
    border-left-color: var(--rn-accent);
}

.rn-approval-subnav .approval-sidebar__link:focus-visible {
    outline: 2px solid var(--rn-border-focus);
    outline-offset: 2px;
}

@media (max-width: 991.98px) {
    .tss-renewal.rn-approval-page {
        max-width: none;
    }

    .tss-renewal.rn-approval-page--detail .approval-detail-layout {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-approval-page--detail .approval-detail-layout__side {
        position: static;
    }

    .tss-renewal.rn-approval-page--dashboard #kpiRow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-approval-page--dashboard #kpiRow > :nth-child(3) .approval-kpi-card {
        border-left: 0;
    }

    .tss-renewal.rn-approval-page--dashboard #kpiRow > :nth-child(n + 3) .approval-kpi-card {
        border-top: 1px solid var(--rn-divider);
    }
}

@media (max-width: 767.98px) {
    .tss-renewal.rn-approval-page .approval-page-header,
    .tss-renewal.rn-approval-page .approval-detail-header {
        align-items: stretch !important;
        flex-direction: column;
        padding-bottom: var(--rn-space-4);
    }

    .tss-renewal.rn-approval-page .approval-page-actions,
    .tss-renewal.rn-approval-page .approval-detail-header__actions {
        width: 100%;
        overflow-x: auto;
    }

    .tss-renewal.rn-approval-page--detail .approval-meta-bar {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-approval-page--detail .approval-meta-bar__item {
        min-width: 0;
        border-left: 0;
        border-top: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-approval-page--detail .approval-meta-bar__item:nth-child(-n + 2) {
        border-top: 0;
    }

    .tss-renewal.rn-approval-page .approval-section-body {
        padding: var(--rn-space-4);
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-approval-page--list .approval-tabs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0 var(--rn-space-2);
        overflow: visible;
        white-space: normal;
    }

    .tss-renewal.rn-approval-page--list .approval-tab {
        justify-content: flex-start;
        min-width: 0;
        width: 100%;
    }

    .tss-renewal.rn-approval-page--list .approval-list-filter__actions {
        align-self: stretch;
        width: 100%;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .tss-renewal.rn-approval-page--list .approval-list-filter__actions .btn {
        flex: 1 1 0;
        min-width: 0;
        width: auto;
    }

    /* The delegation history is a labelled row on phones, not six crushed columns. */
    .tss-renewal.rn-approval-page--delegation .approval-delegation-table,
    .tss-renewal.rn-approval-page--delegation .approval-delegation-table tbody,
    .tss-renewal.rn-approval-page--delegation .approval-delegation-table tr {
        display: block;
        width: 100%;
    }

    .tss-renewal.rn-approval-page--delegation .approval-delegation-table thead {
        display: none;
    }

    .tss-renewal.rn-approval-page--delegation .approval-delegation-table tbody tr + tr {
        border-top: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-approval-page--delegation .approval-delegation-table tbody td:not([colspan]) {
        display: grid;
        grid-template-columns: minmax(5rem, 34%) minmax(0, 1fr);
        gap: var(--rn-space-2);
        align-items: center;
        overflow-wrap: anywhere;
    }

    .tss-renewal.rn-approval-page--delegation .approval-delegation-table tbody td:not([colspan])::before {
        content: attr(data-label);
        color: var(--rn-text-secondary);
        font-size: var(--rn-font-size-label);
        font-weight: var(--rn-font-weight-medium);
    }

    .tss-renewal.rn-approval-page--delegation .approval-delegation-table tbody td[colspan] {
        display: block;
        width: 100%;
        padding: var(--rn-space-4);
        white-space: normal;
    }

    .tss-renewal.rn-approval-page .approval-page-header h2,
    .tss-renewal.rn-approval-page .approval-detail-header__title,
    .tss-renewal.rn-approval-page--form > h2 {
        font-size: var(--rn-font-size-section);
    }

    .tss-renewal.rn-approval-page--dashboard #kpiRow {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-approval-page--dashboard #kpiRow .approval-kpi-card {
        min-height: 74px;
        border-left: 0;
        border-top: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-approval-page--dashboard #kpiRow > :first-child .approval-kpi-card {
        border-top: 0;
    }

    .tss-renewal.rn-approval-page--detail .approval-meta-bar {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-approval-page--detail .approval-meta-bar__item:nth-child(2) {
        border-top: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-approval-page--detail .approval-stamp-cell {
        grid-template-columns: minmax(72px, auto) 56px minmax(0, 1fr);
    }
}

@media print {
    .tss-renewal.rn-approval-page .approval-page-actions,
    .tss-renewal.rn-approval-page .approval-detail-header__actions,
    .rn-approval-subnav {
        display: none !important;
    }
}

/* bundled: structure-preserving.css */
/**
 * Structure-preserving adapter / Approved list style A.
 *
 * This layer changes only the visual treatment of the existing TS reference
 * list DOM. It is inert unless the opt-in class below is added alongside the
 * renewal namespace:
 *
 * <body class="tss-renewal tss-renewal--structure-preserving-a">
 *
 * Figma source:
 * - CRM structure-preserving sample A: 43:463
 * - Data Table Row / Customer: 47:118
 */

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

/* CRM customer-list search/filter ---------------------------------------
 * Existing DOM: customers.html .ts-ref-filter and its five fields.
 * Search, reset, URL state and API behavior remain unchanged.
 * Figma: CRM list filter state board 67:584
 */
.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter {
    margin-bottom: var(--rn-space-4) !important;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body {
    padding: var(--rn-space-4);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .form-label {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 700 !important;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.g-3.mt-2 {
    --bs-gutter-x: var(--rn-space-3);
    --bs-gutter-y: var(--rn-space-3);
    display: grid;
    grid-template-columns: 1.1fr repeat(3, minmax(0, 1fr)) 1.05fr;
    margin-top: var(--rn-space-2) !important;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.g-3.mt-2 > [class*="col-"] {
    width: auto;
    max-width: none;
    padding-inline: calc(var(--rn-space-3) / 2);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter .form-label:not(.fw-bold) {
    margin-bottom: var(--rn-space-1);
    color: var(--rn-text-secondary);
    font-size: 0.6875rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter :where(.form-control, .form-select) {
    min-height: 38px;
    padding: var(--rn-space-2) var(--rn-space-3);
    color: var(--rn-text-primary);
    font-size: 0.75rem;
    background-color: var(--rn-bg-subtle);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter :where(.form-control, .form-select):focus {
    background-color: var(--rn-bg-surface);
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 2px var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.mt-3 {
    margin-top: var(--rn-space-3) !important;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.mt-3 .btn {
    min-height: 36px;
    padding-inline: var(--rn-space-4);
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel > .card-header {
    min-height: 48px;
    padding: 0 var(--rn-space-4);
    display: flex;
    align-items: center;
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel > .card-body {
    padding: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-list {
    display: block;
    gap: 0;
    min-width: 0;
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: var(--rn-space-4);
    min-width: 0;
    min-height: 54px;
    padding: var(--rn-space-2) var(--rn-space-3);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
    transition:
        background-color var(--rn-duration-fast) var(--rn-ease-standard),
        color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card:hover {
    background: var(--rn-bg-subtle);
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card:is(.is-selected, [aria-selected="true"]) {
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card:focus-within {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--rn-border-focus);
    outline-offset: -2px;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__content {
    display: grid;
    grid-template-columns: minmax(220px, 0.9fr) minmax(280px, 1.1fr);
    align-items: center;
    gap: var(--rn-space-4);
    min-width: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--rn-space-2);
    min-width: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__name {
    min-width: 0;
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.5;
    overflow: hidden;
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__name:hover {
    color: var(--rn-text-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__heading .badge {
    padding: var(--rn-space-1) var(--rn-space-2);
    color: var(--rn-text-accent);
    font-size: 0.75rem;
    font-weight: 500;
    line-height: 1.125rem;
    background: var(--rn-bg-accent-soft);
    border: 0;
    border-radius: var(--rn-radius-full);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__heading .badge-tss-info {
    padding-inline: 0;
    color: var(--rn-text-secondary);
    background: transparent;
    border-radius: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__heading .badge-tss-secondary {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-subtle);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__description {
    min-width: 0;
    margin: 0;
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    line-height: 1.5;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__description a {
    color: inherit;
    text-decoration: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__description a:hover {
    color: var(--rn-text-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__aside {
    display: grid;
    grid-template-columns: minmax(120px, auto) minmax(32px, auto);
    align-items: center;
    justify-content: end;
    gap: var(--rn-space-4);
    min-width: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__date {
    display: inline-flex;
    align-items: center;
    gap: var(--rn-space-1);
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    line-height: 1.5;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--rn-space-1);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel #customersPagination {
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-4);
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel #customersPagination .page-link {
    min-width: 32px;
    min-height: 32px;
    display: inline-grid;
    place-items: center;
    padding: var(--rn-space-1) var(--rn-space-2);
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel #customersPagination .page-item.active .page-link {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border-color: var(--rn-border-default);
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.g-3.mt-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__content {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--rn-space-1);
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body {
        padding: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.g-3.mt-2 {
        grid-template-columns: minmax(0, 1fr);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-filter > .card-body > .row.mt-3 .btn-primary {
        min-width: min(210px, calc(100% - 124px));
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel #customersPagination > .d-flex {
        flex-direction: column;
        align-items: stretch !important;
        gap: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-panel #customersPagination .position-absolute {
        position: static !important;
        transform: none !important;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: var(--rn-space-2);
        min-height: 0;
        padding: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__description {
        white-space: normal;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card__aside {
        display: flex;
        justify-content: space-between;
        gap: var(--rn-space-3);
        padding-top: 0;
        border-top: 0;
    }
}

/* 2026-09-28 batch: approval detail/form/delegation + request intake */
.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft,
.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft {
    margin-bottom: 2.5rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__meta,
.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__body,
.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__rail,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft > div,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft > aside,
.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__table,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__list,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__detail {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__meta dl {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    margin: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__meta dl > div {
    padding: 0.85rem 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__meta dl > div + div {
    border-left: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a dt {
    color: var(--rn-text-secondary);
    font-size: 0.7rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a dd {
    margin: 0.3rem 0 0;
    color: var(--rn-text-primary);
    font-size: 0.82rem;
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__layout,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 23rem;
    gap: 1rem;
    margin-top: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__body,
.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__rail,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__detail {
    padding: 1.15rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft h3,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft h3,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft h3 {
    margin: 0 0 1rem;
    color: var(--rn-text-primary);
    font-size: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__body > p,
.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__detail > p {
    color: var(--rn-text-secondary);
    font-size: 0.82rem;
    line-height: 1.7;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__line,
.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__attachments {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.8rem 0;
    border-top: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__attachments {
    justify-content: flex-start;
    flex-wrap: wrap;
    margin-top: 1.2rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-step-list,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__people {
    margin: 0;
    padding: 0;
    list-style: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-step-list li,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__people li {
    display: grid;
    grid-template-columns: 2rem minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.65rem;
    min-height: 4rem;
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-step-list__seq,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__people li > span {
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-step-list strong,
.tss-renewal.tss-renewal--structure-preserving-a .approval-step-list small {
    display: block;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-step-list small {
    margin-top: 0.22rem;
    color: var(--rn-text-secondary);
    font-size: 0.68rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__comment {
    display: grid;
    gap: 0.45rem;
    margin-top: 1rem;
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 23rem;
    gap: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__main > section,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__side > section {
    padding: 1.15rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__main > section + section,
.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__side > section + section {
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft label,
.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__form label {
    display: grid;
    gap: 0.35rem;
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft .is-wide {
    grid-column: 1 / -1;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__editor {
    min-height: 11rem;
    margin-bottom: 0.9rem;
    padding: 1rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
    font-size: 0.82rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__people {
    margin-top: 0.8rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__people li {
    grid-template-columns: 2rem minmax(0, 1fr);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__actions {
    display: flex;
    grid-column: 1 / -1;
    justify-content: flex-end;
    gap: 0.55rem;
    padding-top: 0.25rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__notice {
    margin-bottom: 1rem;
    padding: 0.85rem 1rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__form {
    display: grid;
    grid-template-columns: repeat(5, minmax(8rem, 1fr)) auto;
    align-items: end;
    gap: 0.75rem;
    margin-bottom: 1rem;
    padding: 1rem;
    border-top: 1px solid var(--rn-border-default);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__head,
.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__row {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1.5fr 1.3fr 0.7fr;
    align-items: center;
    gap: 0.75rem;
    min-height: 3.6rem;
    padding: 0 1rem;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.76rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__head {
    min-height: 2.8rem;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.68rem;
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__row:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__tabs {
    display: flex;
    gap: 1.3rem;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__tabs button {
    padding: 0.75rem 0;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--rn-text-secondary);
    background: transparent;
    font-size: 0.78rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__tabs button.is-active {
    border-color: var(--rn-bg-accent);
    color: var(--rn-text-accent);
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft > .rn-summary-strip {
    margin: 1rem 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 10rem auto;
    gap: 0.6rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__list {
    overflow: hidden;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-row {
    display: grid;
    grid-template-columns: 9.5rem minmax(12rem, 1fr) 6rem 5rem 5rem;
    align-items: center;
    gap: 0.75rem;
    min-height: 4.25rem;
    padding: 0 1rem;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.73rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-row.is-selected {
    box-shadow: inset 3px 0 0 var(--rn-bg-accent);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-row:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-row strong {
    color: var(--rn-text-primary);
    font-size: 0.8rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__detail dl {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 1rem 0;
    padding: 0.75rem 0;
    border-top: 1px solid var(--rn-border-default);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__detail h4 {
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__detail ol {
    padding-left: 1.1rem;
    color: var(--rn-text-secondary);
    font-size: 0.74rem;
    line-height: 2;
}

@media (max-width: 1200px) {
    .tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__form {
        grid-template-columns: repeat(3, minmax(9rem, 1fr));
    }
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__layout,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft,
    .tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__meta dl,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-form-draft__grid,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__form,
    .tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__toolbar {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-detail-draft__meta dl > div + div {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__tabs {
        gap: 0.85rem;
        overflow-x: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__tabs button {
        flex: 0 0 auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__table,
    .tss-renewal.tss-renewal--structure-preserving-a .ticket-workspace-draft__list {
        overflow-x: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__head,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-delegation-draft__row {
        min-width: 42rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ticket-row {
        grid-template-columns: 8rem minmax(13rem, 1fr) 5rem 4.5rem 4.5rem;
        min-width: 40rem;
    }
}

/* CRM 거래그룹: 기존 목록/상세 기능을 평면 작업공간으로 표현하는 초안 */
.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip > div {
    display: grid;
    gap: 0.25rem;
    padding: 1rem 1.25rem;
}

.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip > div + div {
    border-left: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip span {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip strong {
    color: var(--rn-text-primary);
    font-size: 1.25rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-filter {
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-filter .form-label,
.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form label {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-workspace {
    display: grid;
    grid-template-columns: minmax(0, 2.2fr) minmax(17rem, 0.8fr);
    min-height: 23rem;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-list__head,
.tss-renewal.tss-renewal--structure-preserving-a .crm-group-row {
    display: grid;
    grid-template-columns: 7rem minmax(12rem, 1fr) 4.5rem 4.5rem 5rem 8.5rem 5.5rem;
    align-items: center;
    width: 100%;
    min-height: 3.25rem;
    padding: 0 0.75rem;
    column-gap: 0.5rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-list__head {
    min-height: 2.5rem;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.7rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-row {
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: transparent;
    text-align: left;
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-row:hover,
.tss-renewal.tss-renewal--structure-preserving-a .crm-group-row.is-selected {
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-row.is-selected {
    box-shadow: inset 3px 0 0 var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-row strong {
    color: var(--rn-text-primary);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-pagination nav {
    display: flex;
    gap: 0.25rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-pagination button {
    min-width: 2rem;
    min-height: 2rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-pagination button.is-current {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border-color: var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    padding: 1.25rem;
    border-left: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail h4 {
    margin: 0;
    color: var(--rn-text-primary);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail small,
.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail dt {
    color: var(--rn-text-secondary);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail dl {
    margin: 0;
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail dl > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 0;
    border-bottom: 1px solid var(--rn-border-default);
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail dd {
    margin: 0;
    color: var(--rn-text-primary);
    font-weight: 600;
    text-align: right;
}

/* CRM 영업활동 폼: 기존 ID/순서/동작을 보존한 카드리스 섹션 초안 */
.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form {
    display: grid;
    gap: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form .mn-form-section {
    padding: 1rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form .mn-form-section-title {
    margin: 0 0 0.75rem;
    color: var(--rn-text-primary);
    font-size: 0.9rem;
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form__grid {
    display: grid;
    grid-template-columns: minmax(14rem, 1.4fr) repeat(4, minmax(9rem, 1fr));
    gap: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form__grid--links {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form label {
    display: grid;
    gap: 0.35rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form .mn-link-collapse-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0;
    border: 0;
    color: var(--rn-text-primary);
    background: transparent;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-wysiwyg {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-wysiwyg__toolbar {
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-wysiwyg textarea {
    border: 0;
    border-radius: 0;
    resize: vertical;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form .attachment-drop-zone {
    display: grid;
    min-height: 4.5rem;
    place-items: center;
    border: 1px dashed var(--rn-border-strong);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form .meeting-note-form-footer {
    position: sticky;
    bottom: 0;
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border: 1px solid var(--rn-border-default);
    background: color-mix(in srgb, var(--rn-bg-surface) 94%, transparent);
    backdrop-filter: blur(8px);
    z-index: 2;
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-workspace {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-detail {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-list {
        overflow-x: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-list__head,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-row {
        min-width: 58rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form__grid,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form__grid--links {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip > div:nth-child(3) {
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-a .rn-summary-strip > div:nth-child(n + 3) {
        border-top: 1px solid var(--rn-border-default);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-list__head {
        display: none;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-row {
        grid-template-columns: 1fr auto;
        min-width: 0;
        min-height: 5rem;
        padding: 0.8rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-row > span:not(:last-child) {
        display: none;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-group-pagination,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form .mn-link-collapse-toggle {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.5rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form__grid,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-form__grid--links {
        grid-template-columns: 1fr;
    }
}

/* CRM deal create/edit form -------------------------------------------
 * Existing DOM: admin/ts/deal-form.html
 * Figma board: 77:714
 */
.tss-renewal.tss-renewal--structure-preserving-a #dealForm {
    color: var(--rn-text-primary);
}

.tss-renewal.tss-renewal--structure-preserving-a .card.ts-panel-table:has(#dealForm),
.tss-renewal.tss-renewal--structure-preserving-a #dealForm + * {
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .card:has(#dealForm) {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .card:has(#dealForm) > .card-header {
    padding: var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .card:has(#dealForm) > .card-body {
    padding: var(--rn-space-4);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm > .row {
    margin-inline: 0;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm > .row > [class*="col-"] {
    margin-bottom: 0 !important;
    padding-block: var(--rn-space-3);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm .form-label,
.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .form-label {
    margin-bottom: var(--rn-space-1);
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm :where(.form-control, .form-select),
.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) :where(.form-control, .form-select, .input-group-text) {
    min-height: 38px;
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm :where(.form-control, .form-select):focus,
.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) :where(.form-control, .form-select):focus {
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 2px var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm :where(.form-control, .form-select):disabled,
.tss-renewal.tss-renewal--structure-preserving-a #dealForm .form-control[readonly] {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-subtle);
    opacity: 1;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm .form-text {
    color: var(--rn-text-secondary) !important;
    font-size: 0.6875rem;
    line-height: 1.45;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm textarea.form-control {
    min-height: 84px;
    resize: vertical;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm > .mb-4 {
    margin: var(--rn-space-4) 0 !important;
    padding: var(--rn-space-3);
    background: var(--rn-bg-section);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm > .mb-4 .alert-info {
    margin-bottom: 0;
    padding: var(--rn-space-3);
    color: var(--rn-text-primary);
    background: var(--rn-bg-accent-soft);
    border-color: transparent;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealForm > .d-flex.gap-2 {
    padding-top: var(--rn-space-2);
}

/* CRM Bootstrap modal surfaces ----------------------------------------
 * Existing DOM: deal-form party search + deal-detail line workflows
 * Figma board: 78:724
 */
.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal, #editLineModal, #bulkQtyModal, #bulkPriceModal) .modal-content {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal, #editLineModal, #bulkQtyModal, #bulkPriceModal) .modal-header {
    min-height: 64px;
    padding: var(--rn-space-4);
    color: var(--rn-text-primary) !important;
    background: var(--rn-bg-surface) !important;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal, #editLineModal, #bulkQtyModal, #bulkPriceModal) .modal-title {
    font-size: 1.0625rem;
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal, #editLineModal, #bulkQtyModal, #bulkPriceModal) .modal-body {
    padding: var(--rn-space-4);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal, #editLineModal, #bulkQtyModal, #bulkPriceModal) .modal-footer {
    position: sticky;
    bottom: 0;
    z-index: 2;
    min-height: 70px;
    padding: var(--rn-space-3) var(--rn-space-4);
    background: var(--rn-bg-surface) !important;
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .table {
    margin-bottom: 0;
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .table thead th {
    height: 40px;
    padding: var(--rn-space-2);
    color: var(--rn-text-secondary);
    font-size: 0.6875rem;
    font-weight: 500;
    vertical-align: middle;
    background: var(--rn-bg-section) !important;
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .table tbody td {
    height: 52px;
    padding: var(--rn-space-2);
    color: var(--rn-text-primary);
    font-size: 0.75rem;
    vertical-align: middle;
    background: transparent;
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .table tbody tr:hover,
.tss-renewal.tss-renewal--structure-preserving-a #bulkEditModal .table tbody tr.table-warning {
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .nav-tabs {
    border-bottom-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .nav-tabs .nav-link {
    min-width: 96px;
    color: var(--rn-text-secondary);
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .nav-tabs .nav-link.active {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border-bottom-color: var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal #selectedSection > .bg-light {
    background: var(--rn-bg-subtle) !important;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm) !important;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal #selectedSection .card,
.tss-renewal.tss-renewal--structure-preserving-a #bulkEditModal #changesSummary {
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default) !important;
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal #calculateTotalBtn {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .rn-accent-surface {
    color: var(--rn-text-primary);
    background: var(--rn-bg-accent-soft);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .preview-total {
    color: var(--rn-text-accent);
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a #bulkEditModal .alert-info,
.tss-renewal.tss-renewal--structure-preserving-a #bulkEditModal #changesSummary .card-body {
    color: var(--rn-text-primary);
    background: var(--rn-bg-accent-soft) !important;
    border-color: var(--rn-border-default);
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a #dealForm > .row > [class*="col-"] {
        flex: 0 0 auto;
        width: 100%;
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .modal-dialog {
        width: 100%;
        max-width: none;
        min-height: 100%;
        margin: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#partySearchModal, #dealLineAddModal, #bulkEditModal) .modal-content {
        min-height: 100vh;
        border: 0;
        border-radius: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .deal-line-modal-body {
        max-height: calc(100vh - 134px) !important;
        padding: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal :where(.row.mb-3 > .col-md-8, .row.mb-3 > .col-md-4) {
        width: 100%;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .input-group {
        flex-wrap: wrap;
        gap: var(--rn-space-2);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #dealLineAddModal .input-group > .form-control {
        flex: 1 1 100%;
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tss-renewal.tss-renewal--structure-preserving-a .ts-ref-card {
        transition: none;
    }
}

/* CRM deal history --------------------------------------------------------
 * Existing DOM: customer-detail.html #dealsTableBody > .ts-ref-card
 * Figma: CRM Deal Row 15:23
 */
.tss-renewal.tss-renewal--structure-preserving-a #dealsTableBody .ts-ref-card__content {
    grid-template-columns: minmax(280px, 1fr) minmax(120px, 0.35fr);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealsTableBody .ts-ref-card__description {
    color: var(--rn-text-primary);
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealsTableBody .ts-ref-card__aside {
    grid-template-columns: minmax(120px, auto) minmax(64px, auto);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealsTableBody .ts-ref-card__aside > .btn {
    min-height: 32px;
    padding: 0 var(--rn-space-3);
    color: var(--rn-text-accent);
    font-size: 0.75rem;
    font-weight: 500;
    background: transparent;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

/* CRM customer detail shell ----------------------------------------------
 * Existing DOM: customer-detail.html page header, #customerDetailTabs,
 *               #customerDetailTabContent and #dealsFilterRow
 * Figma: CRM customer detail state board 54:462
 */
.tss-renewal.tss-renewal--structure-preserving-a .customer-detail-actions {
    gap: var(--rn-space-2);
}

.tss-renewal.tss-renewal--structure-preserving-a .customer-detail-action-btn {
    min-width: 0;
    min-height: 36px;
    padding: 0 var(--rn-space-3);
    font-size: 0.75rem;
    font-weight: 500;
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .customer-detail-action-btn.is-primary {
    color: var(--rn-text-on-dark);
    background: var(--rn-bg-accent);
    border-color: var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a .customer-detail-action-btn.is-outline {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) {
    display: flex;
    flex-wrap: nowrap;
    gap: 0;
    overflow-x: auto;
    margin-bottom: var(--rn-space-4);
    border-bottom: 1px solid var(--rn-border-default);
    scrollbar-width: thin;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) .nav-link {
    position: relative;
    min-height: 44px;
    padding: var(--rn-space-2) var(--rn-space-4);
    color: var(--rn-text-secondary);
    font-size: 0.8125rem;
    font-weight: 500;
    white-space: nowrap;
    background: transparent;
    border: 0;
    border-radius: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) .nav-link::after {
    position: absolute;
    right: var(--rn-space-4);
    bottom: -1px;
    left: var(--rn-space-4);
    height: 2px;
    background: transparent;
    content: "";
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) .nav-link:hover {
    color: var(--rn-text-primary);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) .nav-link.active {
    color: var(--rn-text-accent);
    background: transparent;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) .nav-link.active::after {
    background: var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabContent, .crm-detail-preview-content) > .tab-pane > .card,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-panel {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabContent, .crm-detail-preview-content) > .tab-pane > .card > .card-body,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-panel > .card-body {
    padding: var(--rn-space-4);
}

.tss-renewal.tss-renewal--structure-preserving-a #customerBasicInfoContent .basic-info-section,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-panel .basic-info-section {
    margin: 0;
    padding: var(--rn-space-4) 0;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #customerBasicInfoContent .basic-info-section:first-child,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-panel .basic-info-section:first-child {
    padding-top: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a #customerBasicInfoContent .basic-info-section:last-child,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-panel .basic-info-section:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerBasicInfoContent, .crm-detail-preview-panel) .basic-info-section-title {
    margin: 0 0 var(--rn-space-2);
    padding: 0 0 var(--rn-space-2);
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 700;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerBasicInfoContent, .crm-detail-preview-panel) .basic-info-section :where(dt, dd) {
    min-height: 44px;
    margin: 0;
    padding-block: var(--rn-space-3);
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#customerBasicInfoContent, .crm-detail-preview-panel) .basic-info-section dt {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#dealsFilterRow, .crm-detail-preview-filter) {
    min-height: 56px;
    margin: 0 0 var(--rn-space-3) !important;
    padding: var(--rn-space-2) var(--rn-space-4);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#dealsFilterRow, .crm-detail-preview-filter) .form-select {
    min-width: 190px;
    min-height: 36px;
    color: var(--rn-text-primary);
    font-size: 0.75rem;
    background-color: var(--rn-bg-subtle);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

/* CRM customer detail timeline and system states -------------------------
 * Existing DOM: customer-detail.html #timelineLoading, #timelineWrap,
 *               #timelineTableBody > .ts-ref-card and #timelineEmpty
 * Figma: CRM Timeline Row 61:688 / state board 62:516
 */
.tss-renewal.tss-renewal--structure-preserving-a :where(#timelineLoading, .crm-detail-preview-loading) {
    min-height: 176px;
    display: grid;
    place-items: center;
    color: var(--rn-text-secondary);
    font-size: 0.8125rem;
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineWrap > .text-muted,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-timeline-hint {
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-4);
    color: var(--rn-text-secondary) !important;
    font-size: 0.75rem;
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineTableBody .ts-ref-card__content,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-timeline .ts-ref-card__content {
    grid-template-columns: minmax(0, 1fr) minmax(96px, 0.22fr);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineTableBody .ts-ref-card__description,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-timeline .ts-ref-card__description {
    text-align: right;
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineTableBody .ts-ref-card__aside,
.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-timeline .ts-ref-card__aside {
    grid-template-columns: minmax(132px, auto);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(.ts-ref-state, .crm-detail-preview-state) {
    min-height: 176px;
    margin: 0;
    padding: var(--rn-space-6) var(--rn-space-4);
    display: grid;
    place-items: center;
    color: var(--rn-text-secondary);
    font-size: 0.8125rem;
    text-align: center;
    background: var(--rn-bg-surface);
    border: 1px dashed var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-state.is-error {
    color: var(--rn-status-danger);
}

/* CRM contacts ------------------------------------------------------------
 * Existing DOM: customer-detail.html #contactsTableBody > .ts-ref-card
 * Figma: CRM Contact Row 51:135
 */
.tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card {
    grid-template-columns: minmax(0, 1fr) 96px;
}

.tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__content {
    grid-template-columns: minmax(260px, 0.8fr) minmax(360px, 1.2fr);
}

.tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__heading {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) minmax(100px, 0.7fr);
    gap: var(--rn-space-3);
}

.tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__heading .badge {
    justify-self: start;
    padding: 0;
    color: var(--rn-text-secondary);
    background: transparent;
    border-radius: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__description {
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__aside {
    grid-template-columns: minmax(72px, auto);
}

/* CRM activities / meeting notes ----------------------------------------
 * Existing DOM: customer-detail.html and meeting-notes.html
 *               #meetingNotesTable > .ts-ref-card (preview alias: #meetingNotesTableBody)
 * Figma: CRM Activity Row 52:169
 */
.tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card {
    grid-template-columns: minmax(0, 1fr) minmax(140px, auto);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__content {
    grid-template-columns: minmax(300px, 1.2fr) minmax(280px, 0.9fr);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__heading {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) auto auto;
    gap: var(--rn-space-2);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__heading .badge {
    justify-self: start;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__aside {
    grid-template-columns: minmax(104px, auto) minmax(32px, auto);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#contactsTableBody, #meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__actions .btn {
    min-width: 32px;
    min-height: 32px;
    padding: 0 var(--rn-space-2);
    color: var(--rn-text-secondary);
    background: transparent;
    border: 0;
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(#contactsTableBody, #meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__actions .btn:hover {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
}

/* Approval dashboard -----------------------------------------------------
 * Existing DOM: approval-dashboard.html #kpiRow and its following chart row
 * Figma reference: Cardless Summary Strip 35:9 / 35:120
 */
.tss-renewal.tss-renewal--structure-preserving-a #kpiRow {
    --bs-gutter-x: 0;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    overflow: hidden;
    margin-inline: 0;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow > [class*="col-"] {
    width: auto;
    max-width: none;
    padding: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow .approval-kpi-card {
    min-height: 92px;
    padding: var(--rn-space-4) var(--rn-space-5);
    background: transparent;
    border: 0;
    border-left: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow > :first-child .approval-kpi-card {
    border-left: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow .approval-kpi-label {
    margin-bottom: var(--rn-space-2);
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow .approval-kpi-value {
    color: var(--rn-text-primary);
    font-size: 1.5rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow + .row .approval-section-card {
    margin-bottom: 0;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow + .row .approval-section-header {
    min-height: 48px;
    padding: 0 var(--rn-space-4);
    color: var(--rn-text-primary);
    background: transparent;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #kpiRow + .row .approval-section-body {
    padding: var(--rn-space-4);
}

/* Approval document list -------------------------------------------------
 * Existing DOM: approvals.html .approval-list-panel/.approval-list-row
 * Figma: Approval Document Row 15:30
 */
.tss-renewal.tss-renewal--structure-preserving-a .approval-list-panel {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-head,
.tss-renewal.tss-renewal--structure-preserving-a .approval-list-row {
    display: grid;
    grid-template-columns: 28px 100px minmax(360px, 1fr) 156px 112px 112px 64px;
    align-items: center;
    gap: var(--rn-space-4);
    padding-inline: var(--rn-space-4);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-head {
    height: 38px;
    color: var(--rn-text-secondary);
    font-size: 0.6875rem;
    font-weight: 500;
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-row {
    min-height: 60px;
    height: auto;
    padding-block: var(--rn-space-2);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
    cursor: pointer;
    transition: background-color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-row:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-row:hover {
    background: var(--rn-bg-subtle);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-row:is(.is-selected, [aria-selected="true"]) {
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-row:focus-within {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--rn-border-focus);
    outline-offset: -2px;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-title .t-main {
    overflow: hidden;
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.5;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-cat-chip {
    min-width: 64px;
    padding: var(--rn-space-1) var(--rn-space-2);
    color: var(--rn-text-accent);
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1.125rem;
    text-align: center;
    white-space: nowrap;
    background: var(--rn-bg-accent-soft);
    border-radius: var(--rn-radius-full);
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-docno,
.tss-renewal.tss-renewal--structure-preserving-a .approval-list-title .t-sub {
    overflow: hidden;
    color: var(--rn-text-secondary);
    font-size: 0.6875rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-amount {
    color: var(--rn-text-primary);
    font-size: 0.75rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(.approval-list-date, .approval-list-status) {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .approval-list-action {
    color: var(--rn-text-accent);
    font-size: 0.75rem;
    font-weight: 500;
}

/* Board post list --------------------------------------------------------
 * Existing DOM: post/list.html .bd-post-list-panel/.bd-post-list-row
 * Figma: Board Post Row 15:37
 */
.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-panel {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-row {
    display: grid;
    grid-template-columns: 48px minmax(280px, 1fr) 120px 110px 140px;
    align-items: center;
    gap: var(--rn-space-3);
    min-height: 60px;
    padding: var(--rn-space-2) var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
    text-decoration: none;
    transition: background-color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-row:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-row:hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-subtle);
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-row:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--rn-border-focus);
    outline-offset: -2px;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-no {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    text-align: center;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-title {
    display: flex;
    align-items: center;
    gap: var(--rn-space-2);
    min-width: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-title .bd-link {
    min-width: 0;
    overflow: hidden;
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-title .bd-badge-new,
.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-title .bd-badge-new-comment {
    flex: 0 0 auto;
    padding: 2px 6px;
    color: var(--rn-text-accent);
    font-size: 0.625rem;
    font-weight: 500;
    line-height: 1rem;
    background: var(--rn-bg-accent-soft);
    border-radius: var(--rn-radius-full);
}

.tss-renewal.tss-renewal--structure-preserving-a :where(.bd-post-list-author, .bd-post-list-date, .bd-post-list-stats) {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-date,
.tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-stats {
    font-variant-numeric: tabular-nums;
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__content,
    .tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__content {
        grid-template-columns: minmax(0, 1fr);
        gap: var(--rn-space-1);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #kpiRow {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.tss-renewal--structure-preserving-a #kpiRow > :nth-child(3) .approval-kpi-card {
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #kpiRow > :nth-child(n + 3) .approval-kpi-card {
        border-top: 1px solid var(--rn-border-default);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-head,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-row {
        grid-template-columns: 28px 72px minmax(0, 1fr) 96px 56px;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-head .col-amount,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-head .col-date,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-row .approval-list-amount,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-row .approval-list-date {
        display: none;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-row {
        grid-template-columns: 40px minmax(0, 1fr) 100px;
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(.bd-post-list-author, .bd-post-list-date) {
        display: none;
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .customer-detail-actions {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .customer-detail-action-btn {
        flex: 1 1 auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabs, .crm-detail-preview-tabs) {
        margin-inline: calc(var(--rn-space-3) * -1);
        padding-inline: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#customerDetailTabContent, .crm-detail-preview-content) > .tab-pane > .card > .card-body,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-panel > .card-body {
        padding: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#customerBasicInfoContent, .crm-detail-preview-panel) .basic-info-section :where(dt, dd) {
        flex: 0 0 auto;
        width: 100%;
        min-height: 0;
        padding-block: var(--rn-space-2);
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#customerBasicInfoContent, .crm-detail-preview-panel) .basic-info-section dt {
        padding-bottom: 0;
        border-bottom: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#dealsFilterRow, .crm-detail-preview-filter) {
        padding: var(--rn-space-2) var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#dealsFilterRow, .crm-detail-preview-filter) .form-select {
        min-width: 0;
        width: 100%;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #timelineTableBody .ts-ref-card__content,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-timeline .ts-ref-card__content {
        grid-template-columns: minmax(0, 1fr);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #timelineTableBody .ts-ref-card__description,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-detail-preview-timeline .ts-ref-card__description {
        text-align: left;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #dealsTableBody .ts-ref-card__content {
        grid-template-columns: minmax(0, 1fr);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #dealsTableBody .ts-ref-card__description {
        text-align: left;
    }

    .tss-renewal.tss-renewal--structure-preserving-a :where(#contactsTableBody, #meetingNotesTable, #meetingNotesTableBody) .ts-ref-card {
        grid-template-columns: minmax(0, 1fr);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #contactsTableBody .ts-ref-card__heading,
    .tss-renewal.tss-renewal--structure-preserving-a :where(#meetingNotesTable, #meetingNotesTableBody) .ts-ref-card__heading {
        display: flex;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #kpiRow .approval-kpi-card {
        min-height: 82px;
        padding: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-head {
        display: none;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .approval-list-row {
        grid-template-columns: 40px minmax(0, 1fr) auto;
        grid-template-rows: auto auto auto;
        align-items: start;
        gap: var(--rn-space-1) var(--rn-space-2);
        min-height: 0;
        padding: var(--rn-space-3);
    }
}

@media (max-width: 576px) {
    .tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-row {
        grid-template-columns: 32px minmax(0, 1fr);
        padding-inline: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .bd-post-list-stats {
        display: none;
    }
}

/* CRM deal detail -------------------------------------------------------
 * Existing DOM: admin/ts/deal-detail.html
 * Figma: CRM Deal Line Row 70:195, deal-detail board 72:584
 * Contract: preserve the Bootstrap 7/3/2 information row, the 10-column
 * line table, permission-driven action buttons, and timeline behavior.
 */
.tss-renewal.tss-renewal--structure-preserving-a .deal-info-card {
    margin-bottom: var(--rn-space-4);
    padding: var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-info-card > h5,
.tss-renewal.tss-renewal--structure-preserving-a .deal-info-card > .d-flex > h5 {
    color: var(--rn-text-primary);
    font-size: 0.9375rem;
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealBasicInfo {
    margin-inline: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a #dealBasicInfo > [class*="col-"] {
    min-width: 0;
    margin-bottom: 0 !important;
    padding-block: var(--rn-space-3);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #dealBasicInfo .form-label.small {
    margin-bottom: var(--rn-space-1);
    color: var(--rn-text-secondary) !important;
    font-size: 0.6875rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(.deal-value, .deal-status) {
    min-width: 0;
    min-height: 1.375rem;
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.5;
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-amount {
    color: var(--rn-text-accent);
    font-size: 0.9375rem;
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a :where(.status-badge, .delayed-badge) {
    padding: var(--rn-space-1) var(--rn-space-2);
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: 1.125rem;
    border-radius: var(--rn-radius-full);
}

.tss-renewal.tss-renewal--structure-preserving-a #actionButtons .btn {
    min-height: 36px;
    justify-content: center;
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-stats-card .row > [class*="col-"] + [class*="col-"] {
    border-left: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-stats-card :where(#totalLines, #avgLineAmount) {
    color: var(--rn-text-accent) !important;
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a #bulkActionToolbar {
    padding: var(--rn-space-3);
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table {
    width: 100%;
    min-width: 1350px;
    margin-bottom: 0;
    table-layout: fixed;
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > thead > tr > th {
    height: 40px;
    padding: var(--rn-space-2);
    color: var(--rn-text-secondary);
    font-size: 0.6875rem;
    font-weight: 500;
    vertical-align: middle;
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > tbody > tr {
    min-height: 56px;
    background: var(--rn-bg-surface);
    transition: background-color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > tbody > tr:hover,
.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > tbody > tr:has(.line-checkbox:checked) {
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > tbody > tr > td {
    height: 56px;
    padding: var(--rn-space-2);
    color: var(--rn-text-primary);
    font-size: 0.75rem;
    vertical-align: middle;
    background: transparent;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > tbody > tr > td:nth-child(8),
.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table > tbody > tr > td:nth-child(9) {
    font-variant-numeric: tabular-nums;
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table .badge {
    padding: var(--rn-space-1) var(--rn-space-2);
    color: var(--rn-text-accent) !important;
    font-size: 0.6875rem;
    font-weight: 500;
    background: var(--rn-bg-accent-soft) !important;
    border-radius: var(--rn-radius-full);
}

.tss-renewal.tss-renewal--structure-preserving-a .deal-lines-table td:nth-child(10) .btn {
    width: 30px;
    height: 30px;
    padding: 0;
    border-color: transparent;
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineContainer {
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineContainer .timeline-item {
    position: relative;
    min-height: 64px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-2) var(--rn-space-3) 34px;
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineContainer .timeline-item::before {
    left: 12px;
    top: 22px;
    width: 8px;
    height: 8px;
    background: var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineContainer .timeline-item::after {
    left: 15px;
    top: 30px;
    width: 1px;
    height: calc(100% - 8px);
    background: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #timelineContainer .timeline-note-text {
    color: var(--rn-text-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.5;
}

.tss-renewal.tss-renewal--structure-preserving-a #noteInputArea > .card {
    background: var(--rn-bg-section);
    border-color: var(--rn-border-default) !important;
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a .deal-info-card {
        padding: var(--rn-space-3);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #actionButtons {
        display: flex !important;
        flex-wrap: wrap;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #actionButtons .btn {
        flex: 1 1 9rem;
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a #dealBasicInfo > [class*="col-"] {
        flex: 0 0 auto;
        width: 100%;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .deal-info-card > .d-flex.justify-content-between {
        align-items: flex-start !important;
        gap: var(--rn-space-2);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .deal-info-card > .d-flex.justify-content-between .btn-group {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #bulkActionToolbar > .d-flex {
        align-items: flex-start !important;
        flex-direction: column;
        gap: var(--rn-space-2);
    }

    .tss-renewal.tss-renewal--structure-preserving-a #bulkActionToolbar .btn-group {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #timelineContainer .timeline-item > .d-flex {
        gap: var(--rn-space-2);
        flex-direction: column;
    }

    .tss-renewal.tss-renewal--structure-preserving-a #timelineContainer .timeline-item > .d-flex > .d-flex {
        justify-content: flex-start;
    }
}

/* 거래그룹 Bootstrap 모달 초안: DOM과 이벤트 계약은 그대로 둔다. */
.tss-renewal.tss-renewal--structure-preserving-a .crm-modal-stage {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-modal-a .modal-content,
.tss-renewal.tss-renewal--structure-preserving-a #crm-activity-detail-a .mn-next-action-shell-panel {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-modal-a .modal-header,
.tss-renewal.tss-renewal--structure-preserving-a #crm-deal-group-modal-a .modal-footer {
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results button {
    display: grid;
    grid-template-columns: 9rem minmax(10rem, 1fr) 5rem 6rem 9rem;
    align-items: center;
    width: 100%;
    min-height: 3.5rem;
    padding: 0 0.85rem;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
    text-align: left;
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results button:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results button:hover,
.tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results button:focus-visible {
    background: var(--rn-bg-accent-soft);
    box-shadow: inset 3px 0 0 var(--rn-bg-accent);
    outline: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results strong {
    color: var(--rn-text-primary);
}

/* 영업활동 상세·다음 액션 전용 오버레이 초안 */
.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail {
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    margin: 0;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div {
    padding: 0.75rem;
    border-right: 1px solid var(--rn-border-default);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div:nth-child(4n) {
    border-right: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div:nth-child(n + 5) {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta dt,
.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail h4 {
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta dd {
    margin: 0.25rem 0 0;
    color: var(--rn-text-primary);
    font-size: 0.82rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail .note-content {
    min-height: 7rem;
    padding: 1rem;
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail .attachment-drop-zone {
    display: grid;
    min-height: 4rem;
    place-items: center;
    border: 1px dashed var(--rn-border-strong);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell--preview {
    position: relative;
    display: grid;
    min-height: 38rem;
    margin-top: 1rem;
    place-items: center;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell--preview .mn-next-action-shell-backdrop {
    position: absolute;
    inset: 0;
    background: color-mix(in srgb, var(--rn-bg-sidebar) 72%, transparent);
}

.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell--preview .mn-next-action-shell-panel {
    position: relative;
    width: min(44rem, calc(100% - 2rem));
    z-index: 1;
}

.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell-header,
.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.9rem 1rem;
    border-color: var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell-body {
    padding: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .mn-next-action-shell-footer {
    justify-content: flex-end;
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a #nextActionWysiwygPreview {
    min-height: 15rem;
    padding: 1rem;
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .crm-modal-stage {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results button {
        grid-template-columns: 1fr auto;
        gap: 0.5rem;
        min-height: 4.5rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-add-deal-results button > span:not(.badge) {
        display: none;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div:nth-child(4n) {
        border-right: 1px solid var(--rn-border-default);
        border-bottom: 1px solid var(--rn-border-default);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div:nth-child(2n) {
        border-right: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-activity-detail__meta > div:nth-child(n + 7) {
        border-bottom: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .meeting-note-detail-toolbar {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        width: 100%;
    }
}

/* 영업활동 캘린더: FullCalendar DOM을 둘러싼 필터·툴바 시각 초안 */
.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-filter {
    display: grid;
    grid-template-columns: minmax(14rem, 2fr) minmax(8rem, 1fr) minmax(8rem, 1fr) auto auto auto;
    align-items: end;
    gap: 0.5rem;
    padding: 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-filter label,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-filter label {
    display: grid;
    gap: 0.25rem;
    color: var(--rn-text-secondary);
    font-size: 0.7rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-my {
    display: flex !important;
    align-items: center;
    min-height: 2rem;
    white-space: nowrap;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-advanced {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0.5rem 0;
    padding: 0.65rem 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    font-size: 0.78rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-advanced small {
    color: var(--rn-text-secondary);
    font-weight: 400;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-panel {
    padding: 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-toolbar {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-toolbar > div:last-child {
    text-align: right;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-toolbar button,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-tabs button,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-quick button,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart header button {
    min-height: 2rem;
    padding: 0.35rem 0.65rem;
    border: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
    font-size: 0.72rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-toolbar button.is-active,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-tabs button.is-active,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-quick button.is-active,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart header button.is-active {
    color: var(--rn-text-accent);
    border-color: var(--rn-bg-accent);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__weekdays,
.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__days {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__weekdays span {
    padding: 0.5rem;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.7rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__days > div {
    min-height: 6.5rem;
    padding: 0.45rem;
    border-top: 1px solid var(--rn-border-default);
    border-right: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__days > div:nth-child(7n) {
    border-right: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__days a {
    display: block;
    margin-top: 0.4rem;
    padding: 0.3rem 0.4rem;
    overflow: hidden;
    border-radius: 0.25rem;
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.68rem;
    text-decoration: none;
}

/* CRM 영업 대시보드: KPI 카드를 요약 스트립으로 통합 */
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-tabs {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin-bottom: 0.5rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-tabs span {
    margin-left: 0.5rem;
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-filter {
    display: grid;
    grid-template-columns: minmax(20rem, 1.8fr) repeat(3, minmax(7rem, 0.6fr));
    align-items: end;
    gap: 0.65rem;
    padding: 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis > div {
    display: grid;
    gap: 0.25rem;
    padding: 1rem 1.25rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis > div + div {
    border-left: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis span,
.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis small {
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis strong {
    color: var(--rn-text-primary);
    font-size: 1.25rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart {
    margin-top: 0.75rem;
    padding: 1rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart h4 {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: 0.9rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart__plot {
    display: flex;
    align-items: flex-end;
    gap: clamp(0.75rem, 4vw, 3rem);
    height: 20rem;
    margin-top: 1rem;
    padding: 1rem 2rem 0;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart__plot i {
    flex: 1;
    height: var(--value);
    min-width: 1rem;
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart__plot i.is-current {
    background: var(--rn-bg-accent);
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-filter,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-sales-filter {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-filter,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-sales-filter,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-advanced,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-toolbar {
        align-items: flex-start;
        grid-template-columns: 1fr;
        text-align: left;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-calendar-toolbar > div:last-child {
        text-align: left;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid {
        overflow-x: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__weekdays,
    .tss-renewal.tss-renewal--structure-preserving-a .crm-month-grid__days {
        min-width: 42rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-sales-kpis > div + div {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-sales-chart__plot {
        gap: 0.5rem;
        height: 14rem;
        padding-inline: 0.5rem;
    }
}

/* CRM 영업활동 유형: 반복 카드는 평면 행, 폼/상세만 보조 레일로 유지 */
.tss-renewal.tss-renewal--structure-preserving-a .crm-type-filter {
    display: grid;
    grid-template-columns: minmax(16rem, 1fr) 10rem auto;
    align-items: end;
    gap: 0.65rem;
    margin-bottom: 0.75rem;
    padding: 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-filter label,
.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor label,
.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-report-filter label {
    display: grid;
    gap: 0.3rem;
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-workspace {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 18rem;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-list__head,
.tss-renewal.tss-renewal--structure-preserving-a .crm-type-row {
    display: grid;
    grid-template-columns: 1.1fr 1.4fr 0.7fr 0.8fr 1.2fr;
    align-items: center;
    gap: 0.75rem;
    min-width: 42rem;
    padding: 0.7rem 0.9rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-list {
    overflow-x: auto;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-list__head {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: 0.68rem;
    font-weight: 600;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-row {
    min-height: 3.25rem;
    border-top: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.78rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-row.is-selected {
    box-shadow: inset 3px 0 0 var(--rn-bg-accent);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-row strong,
.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor h4,
.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-detail h4,
.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts h4 {
    color: var(--rn-text-primary);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-pagination {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem 0.9rem;
    border-top: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-pagination button {
    border: 0;
    color: var(--rn-text-accent);
    background: transparent;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    padding: 1rem;
    border-left: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor dl {
    display: grid;
    gap: 0.45rem;
    margin: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor dl div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--rn-border-default);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor dt {
    color: var(--rn-text-secondary);
    font-weight: 400;
}

.tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor dd {
    margin: 0;
    color: var(--rn-text-primary);
    font-weight: 600;
}

/* TS 매출·매입 리포트: KPI를 연결형 스트립으로 통합하고 분석 영역만 얇은 패널 사용 */
.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-period {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    margin-bottom: 0.5rem;
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-period span {
    margin-left: auto;
    color: var(--rn-text-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-report-filter {
    display: grid;
    grid-template-columns: minmax(18rem, 1.5fr) repeat(6, minmax(7rem, 0.55fr)) auto;
    align-items: end;
    gap: 0.55rem;
    padding: 0.75rem;
    overflow-x: auto;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-quick {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-quick button {
    min-height: 2rem;
    padding: 0.3rem 0.55rem;
    border: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
    font-size: 0.7rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-quick button.is-active {
    color: var(--rn-text-accent);
    border-color: var(--rn-bg-accent);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-filter-actions {
    display: flex;
    gap: 0.35rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-top: 0.75rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis > div {
    display: grid;
    gap: 0.25rem;
    padding: 0.9rem 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis > div + div {
    border-left: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis span {
    color: var(--rn-text-secondary);
    font-size: 0.7rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis strong {
    color: var(--rn-text-primary);
    font-size: 1.1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts {
    display: grid;
    grid-template-columns: minmax(0, 1.7fr) minmax(16rem, 0.8fr);
    gap: 0.75rem;
    margin-top: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts section,
.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-detail {
    padding: 0.9rem;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts h4,
.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-detail h4 {
    margin: 0;
    font-size: 0.85rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-bars {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    height: 12rem;
    margin-top: 0.75rem;
    padding: 0.75rem 1rem 0;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-bars i {
    flex: 1;
    height: var(--value);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-bars i.is-current {
    background: var(--rn-bg-accent);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts ol {
    display: grid;
    gap: 0;
    margin: 0.55rem 0 0;
    padding: 0;
    list-style: none;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.65rem 0;
    border-top: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-detail {
    margin-top: 0.75rem;
    padding: 0;
    overflow: hidden;
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-detail__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 0.9rem;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .ts-sales-detail table {
    min-width: 60rem;
    color: var(--rn-text-secondary);
}

@media (max-width: 1200px) {
    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-report-filter {
        grid-template-columns: repeat(4, minmax(8rem, 1fr));
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-quick {
        grid-column: 1 / -1;
    }
}

@media (max-width: 992px) {
    .tss-renewal.tss-renewal--structure-preserving-a .crm-type-workspace,
    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-charts {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .crm-type-editor {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .crm-type-filter,
    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-report-filter,
    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-quick,
    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-filter-actions {
        grid-column: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-kpis > div + div {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-period {
        align-items: flex-start;
        flex-direction: column;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .ts-sales-period span {
        margin-left: 0;
    }
}
/* 2026-09-28 batch: document library browse/detail/upload + reservation calendar */
.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft,
.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft,
.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft {
    margin-bottom: 2.5rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft__search {
    display: grid;
    grid-template-columns: 9rem minmax(0, 1fr) auto;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-document-library {
    grid-template-columns: 16rem minmax(0, 1fr);
    min-height: 31rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-folder-tree strong {
    display: block;
    margin-bottom: 0.65rem;
    color: var(--rn-text-primary);
    font-size: 0.82rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-folder-tree__item {
    justify-content: flex-start;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-folder-tree__item small {
    margin-left: auto;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-folder-tree__item.is-child {
    padding-left: 1.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft__main {
    min-width: 0;
    padding: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft__main > header,
.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft > header,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__calendar > header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft__main > header small {
    display: block;
    margin-top: 0.2rem;
    color: var(--rn-text-secondary);
    font-size: 0.68rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .document-row {
    display: grid;
    grid-template-columns: 3rem minmax(12rem, 1fr) 7rem 3rem 6.5rem 4rem;
    align-items: center;
    gap: 0.7rem;
    min-height: 4.4rem;
    padding: 0 0.8rem;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .document-row.is-selected {
    box-shadow: inset 3px 0 var(--rn-bg-accent);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.tss-renewal--structure-preserving-a .document-row strong {
    color: var(--rn-text-primary);
    font-size: 0.8rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft,
.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__calendar {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft {
    padding: 1.1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft h3,
.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft h3 {
    margin: 0.2rem 0 0;
    font-size: 1.15rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft > header small {
    color: var(--rn-text-secondary);
    font-size: 0.7rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft dl {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 1rem 0;
    border-top: 1px solid var(--rn-border-default);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft dl > div {
    padding: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft dl > div + div {
    border-left: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft dl .is-wide {
    grid-column: 1 / -1;
    border-top: 1px solid var(--rn-border-default);
    border-left: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft nav,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs {
    display: flex;
    gap: 1.2rem;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft nav button,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs button {
    padding: 0.7rem 0;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--rn-text-secondary);
    background: transparent;
    font-size: 0.76rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft nav button.is-active,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs button.is-active {
    border-color: var(--rn-bg-accent);
    color: var(--rn-text-accent);
    font-weight: 700;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft__files > div {
    display: grid;
    grid-template-columns: minmax(12rem, 1fr) 7rem 12rem;
    gap: 1rem;
    align-items: center;
    min-height: 4rem;
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.75rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft__files > div:last-child {
    border-bottom: 0;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft {
    padding: 1.2rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem;
    margin-top: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft label {
    display: grid;
    gap: 0.35rem;
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
    font-weight: 500;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft .is-wide {
    grid-column: 1 / -1;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft__drop {
    display: grid;
    min-height: 9rem;
    place-items: center;
    align-content: center;
    gap: 0.35rem;
    margin-top: 1rem;
    border: 1px dashed var(--rn-border-strong);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft__drop i {
    color: var(--rn-text-accent);
    font-size: 1.5rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft__drop small {
    font-size: 0.7rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft footer {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs span {
    flex: 1;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__legend {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin: 1rem 0;
    padding: 0.8rem 1rem;
    border-block: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 0.72rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .is-pending { color: var(--rn-status-warning); }
.tss-renewal.tss-renewal--structure-preserving-a .is-approved { color: var(--rn-status-success); }
.tss-renewal.tss-renewal--structure-preserving-a .is-rejected { color: var(--rn-status-danger); }
.tss-renewal.tss-renewal--structure-preserving-a .is-completed { color: var(--rn-text-accent); }

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__calendar {
    padding: 1rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__calendar > header {
    justify-content: flex-start;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__calendar > header button:last-child {
    margin-left: auto;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__week,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__week strong {
    padding: 0.55rem;
    border: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    text-align: center;
    font-size: 0.7rem;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__grid > div {
    min-height: 7rem;
    padding: 0.4rem;
    border: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
}

.tss-renewal.tss-renewal--structure-preserving-a .calendar-event {
    display: block;
    margin-top: 0.45rem;
    padding: 0.4rem;
    border-left: 3px solid currentColor;
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-accent-soft);
    font-size: 0.65rem;
    line-height: 1.45;
}

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft__search,
    .tss-renewal.tss-renewal--structure-preserving-a .doc-upload-draft__grid,
    .tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft dl {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-document-library {
        display: block;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft .rn-folder-tree {
        max-height: 12rem;
        border-right: 0;
        border-bottom: 1px solid var(--rn-border-default);
    }

    .tss-renewal.tss-renewal--structure-preserving-a .doc-library-draft__main,
    .tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft__files {
        overflow-x: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .document-row,
    .tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft__files > div {
        min-width: 42rem;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft dl > div + div {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .doc-detail-draft > header,
    .tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs {
        align-items: flex-start;
        flex-direction: column;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs {
        flex-direction: row;
        overflow-x: auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__tabs button {
        flex: 0 0 auto;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__week {
        display: none;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__grid {
        grid-template-columns: 1fr;
    }

    .tss-renewal.tss-renewal--structure-preserving-a .reservation-calendar-draft__grid > div {
        min-height: 4.5rem;
    }
}

/* 2026-09-28: resource/profile/help structure-preserving drafts */
.tss-renewal.tss-renewal--structure-preserving-a .reservation-list-draft,
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft,
.tss-renewal.tss-renewal--structure-preserving-a .profile-draft,
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
    overflow: hidden;
}

.tss-renewal.tss-renewal--structure-preserving-a .reservation-list-draft .reservation-calendar-draft__tabs,
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft .reservation-calendar-draft__tabs { padding-inline: 1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .reservation-list-draft table,
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft table { min-width: 68rem; color: var(--rn-text-primary); }
.tss-renewal.tss-renewal--structure-preserving-a .reservation-list-draft th,
.tss-renewal.tss-renewal--structure-preserving-a .reservation-list-draft td,
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft th,
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft td { padding: .8rem .75rem; border-color: var(--rn-border-default); font-size: .72rem; vertical-align: middle; }
.tss-renewal.tss-renewal--structure-preserving-a .reservation-list-draft tbody tr:nth-child(odd),
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft tbody tr:nth-child(odd) { background: var(--rn-bg-section); }

.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__toolbar { display:flex; align-items:center; gap:.55rem; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__toolbar small { margin-left:auto; color:var(--rn-text-secondary); }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__layout { display:grid; grid-template-columns:18rem minmax(24rem,1fr) 17rem; min-height:30rem; }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__rooms,
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline,
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__guide { padding:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline { border-inline:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft h3 { margin:0 0 1rem; font-size:.95rem; }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__rooms button { display:grid; width:100%; gap:.25rem; padding:.85rem 0; border:0; border-bottom:1px solid var(--rn-border-default); color:var(--rn-text-primary); text-align:left; background:transparent; }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__rooms button.is-active { color:var(--rn-text-accent); background:var(--rn-bg-accent-soft); }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__rooms span,
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline small { color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline > div { display:grid; grid-template-columns:7rem 1fr; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline > div.is-current span { padding:.65rem; border-left:3px solid var(--rn-bg-accent); background:var(--rn-bg-accent-soft); }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline span { display:grid; gap:.2rem; }
.tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__guide { display:flex; flex-direction:column; gap:.65rem; color:var(--rn-text-secondary); font-size:.78rem; }

.tss-renewal.tss-renewal--structure-preserving-a .profile-draft { max-width:48rem; margin-inline:auto; padding:1.25rem; }
.tss-renewal.tss-renewal--structure-preserving-a .profile-draft section + section { margin-top:1.25rem; padding-top:1.25rem; border-top:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .profile-draft h3 { font-size:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .profile-draft p { color:var(--rn-text-secondary); font-size:.74rem; }
.tss-renewal.tss-renewal--structure-preserving-a .profile-draft__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-block:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .profile-draft label,
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft > label { display:grid; gap:.4rem; color:var(--rn-text-secondary); font-size:.72rem; font-weight:500; }

.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft > label { width:15rem; padding:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft td strong,
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft td small { display:block; }
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft td small { margin-top:.25rem; color:var(--rn-text-secondary); }
.tss-renewal.tss-renewal--structure-preserving-a .help-center-draft a { color:var(--rn-text-accent); font-weight:600; text-decoration:none; }

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__toolbar { flex-wrap:wrap; }
    .tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__toolbar small { width:100%; margin-left:0; }
    .tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__layout { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .meeting-status-draft__timeline { border-inline:0; border-block:1px solid var(--rn-border-default); }
    .tss-renewal.tss-renewal--structure-preserving-a .profile-draft__grid { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .help-center-draft > label { width:100%; }
}

/* 2026-09-28: administrator foundation drafts */
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft,
.tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft,
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft,
.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft {
    border:1px solid var(--rn-border-default);
    border-radius:var(--rn-radius-md);
    background:var(--rn-bg-surface);
    overflow:hidden;
}
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__headline,
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__actions { display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__headline div,
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__favorites a { display:grid; gap:.25rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft small { color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(18rem,1fr); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__favorites { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__favorites a { min-height:5.4rem; padding:1rem; color:var(--rn-text-primary); background:var(--rn-bg-surface); text-decoration:none; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside { padding:1rem; border-left:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside h3 { margin:0 0 .7rem; font-size:.85rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside div { display:flex; justify-content:space-between; padding:.7rem 0; border-bottom:1px solid var(--rn-border-default); font-size:.75rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside div strong { color:var(--rn-status-danger); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside h3:nth-of-type(2) { margin-top:1.5rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside p { color:var(--rn-text-accent); font-size:.72rem; }

.tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__add { display:grid; grid-template-columns:8rem repeat(8,minmax(6rem,1fr)) 4rem; gap:.5rem; align-items:center; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__search { display:grid; grid-template-columns:minmax(16rem,1fr) 12rem auto auto 6rem; gap:.5rem; align-items:center; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__search strong { color:var(--rn-text-accent); text-align:right; font-size:.75rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__head,
.tss-renewal.tss-renewal--structure-preserving-a .admin-user-row { display:grid; grid-template-columns:3rem 8rem minmax(20rem,1fr) 8rem 8rem 14rem; align-items:center; gap:.75rem; min-width:65rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__head { grid-template-columns:11.75rem minmax(20rem,1fr) 8rem 8rem 14rem; padding:.7rem 1rem; color:var(--rn-text-secondary); background:var(--rn-bg-section); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-user-row { min-height:4.5rem; padding:.5rem 1rem; border-top:1px solid var(--rn-border-default); font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-user-row i { display:grid; width:2.25rem; height:2.25rem; place-items:center; border-radius:50%; color:var(--rn-text-accent); background:var(--rn-bg-accent-soft); font-style:normal; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-user-row span:nth-last-child(1),
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__list > div span:last-child { color:var(--rn-text-accent); }

.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__actions { justify-content:flex-end; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace { display:grid; grid-template-columns:22rem minmax(36rem,1fr); min-height:28rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace aside { border-right:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace aside header { display:flex; justify-content:space-between; padding:1rem; color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace aside button { display:flex; width:100%; justify-content:space-between; padding:.85rem 1rem; border:0; border-top:1px solid var(--rn-border-default); color:var(--rn-text-primary); background:transparent; text-align:left; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace aside button.is-active { color:var(--rn-text-accent); background:var(--rn-bg-accent-soft); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__head,
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__list > div { display:grid; grid-template-columns:1.2fr .8fr .8fr 2fr .8fr; gap:1rem; align-items:center; min-width:44rem; padding:.85rem 1rem; border-bottom:1px solid var(--rn-border-default); font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__head { color:var(--rn-text-secondary); background:var(--rn-bg-section); font-weight:600; }

.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft { padding:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft > label { display:grid; grid-template-columns:10rem minmax(18rem,30rem); align-items:center; gap:1rem; margin-bottom:1rem; color:var(--rn-text-secondary); font-size:.75rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft fieldset { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.9rem; margin:0 0 1rem; padding:1rem; border:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft legend { float:none; width:auto; margin:0; padding:0 .4rem; color:var(--rn-text-primary); font-size:.85rem; font-weight:700; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft fieldset label { color:var(--rn-text-primary); font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft footer { display:flex; justify-content:flex-end; }

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__layout,
    .tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft__favorites { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .admin-dashboard-draft aside,
    .tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__workspace aside { border-left:0; border-right:0; border-top:1px solid var(--rn-border-default); }
    .tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__add,
    .tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__search { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .admin-users-draft__list,
    .tss-renewal.tss-renewal--structure-preserving-a .admin-departments-draft__list { overflow-x:auto; }
    .tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft > label,
    .tss-renewal.tss-renewal--structure-preserving-a .admin-permissions-draft fieldset { grid-template-columns:1fr; }
}

/* 2026-09-28: electronic approval administration drafts */
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-draft,
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft {
    border:1px solid var(--rn-border-default);
    border-radius:var(--rn-radius-md);
    background:var(--rn-bg-surface);
    overflow:hidden;
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-toolbar {
    display:grid;
    grid-template-columns:minmax(18rem,1fr) 14rem 12rem;
    gap:.6rem;
    padding:1rem;
    border-bottom:1px solid var(--rn-border-default);
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-table { overflow-x:auto; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-row {
    display:grid;
    align-items:center;
    gap:.75rem;
    min-height:3.5rem;
    padding:.65rem 1rem;
    border-bottom:1px solid var(--rn-border-default);
    color:var(--rn-text-secondary);
    font-size:.72rem;
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-row:last-child { border-bottom:0; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-row.is-head {
    min-height:2.5rem;
    color:var(--rn-text-secondary);
    background:var(--rn-bg-section);
    font-size:.68rem;
    font-weight:600;
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-row strong { color:var(--rn-text-primary); }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-row button {
    justify-self:start;
    padding:.2rem .45rem;
    border:0;
    color:var(--rn-text-accent);
    background:transparent;
    font-size:.72rem;
    font-weight:600;
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-table--types .approval-admin-row { grid-template-columns:8rem 1fr 9rem 5rem 13rem 6rem 5rem; min-width:62rem; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-table--forms .approval-admin-row { grid-template-columns:10rem 1.25fr 10rem 10rem 5rem 6rem 5rem; min-width:67rem; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-table--roles .approval-admin-row { grid-template-columns:13rem 1fr 1.35fr 5rem 6rem 5rem; min-width:62rem; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-table--steps .approval-admin-row { grid-template-columns:2rem 7rem 8rem 1fr 5rem 5rem; min-width:42rem; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-status {
    justify-self:start;
    padding:.2rem .5rem;
    border-radius:999px;
    color:var(--rn-text-secondary);
    background:var(--rn-bg-section);
    font-size:.66rem;
    font-weight:600;
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-status.is-on { color:var(--rn-status-success); background:var(--rn-status-success-soft); }
.tss-renewal.tss-renewal--structure-preserving-a .approval-admin-note,
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft__main > p { margin:0; padding:.85rem 1rem; color:var(--rn-text-secondary); font-size:.7rem; }

.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft { display:grid; grid-template-columns:20rem minmax(42rem,1fr); }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft > aside { border-right:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft > aside > header { padding:1rem; color:var(--rn-text-primary); font-size:.82rem; font-weight:700; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft > aside > button {
    display:grid;
    width:100%;
    gap:.25rem;
    padding:.85rem 1rem;
    border:0;
    border-top:1px solid var(--rn-border-default);
    color:var(--rn-text-primary);
    background:transparent;
    text-align:left;
}
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft > aside > button.is-active { color:var(--rn-text-accent); background:var(--rn-bg-accent-soft); }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft > aside small { color:var(--rn-text-secondary); font-size:.68rem; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft__main > header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft__main > header div { display:grid; gap:.2rem; }
.tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft__main > header small { color:var(--rn-text-secondary); font-size:.68rem; }

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .approval-admin-toolbar,
    .tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .approval-chain-draft > aside { border-right:0; border-bottom:1px solid var(--rn-border-default); }
    .tss-renewal.tss-renewal--structure-preserving-a .approval-admin-table { overflow-x:auto; }
}

/* 2026-09-28: representative content and operations drafts */
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft,
.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft,
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft,
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft,
.tss-renewal.tss-renewal--structure-preserving-a .admin-board-posts-draft,
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft {
    border:1px solid var(--rn-border-default);
    border-radius:var(--rn-radius-md);
    background:var(--rn-bg-surface);
    overflow:hidden;
}
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft > header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:1rem;
    padding:1.25rem;
    border-bottom:1px solid var(--rn-border-default);
}
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft > header > div { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:.5rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft h3 { grid-column:2; margin:0; font-size:1.15rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft > header p { grid-column:2; margin:0; color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__body { min-height:10rem; padding:1.5rem; color:var(--rn-text-primary); line-height:1.75; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__attachments { display:grid; grid-template-columns:8rem 1fr auto; gap:1rem; padding:1rem 1.5rem; border-top:1px solid var(--rn-border-default); font-size:.75rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__attachments a { color:var(--rn-text-accent); text-decoration:none; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__attachments span { color:var(--rn-text-secondary); }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__poll { display:grid; grid-template-columns:1fr 1fr auto; gap:.75rem; align-items:center; margin:0 1.5rem 1.5rem; padding:1rem; border:1px solid var(--rn-border-default); border-radius:var(--rn-radius-sm); background:var(--rn-bg-section); }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__poll header { grid-column:1 / -1; display:flex; justify-content:space-between; }
.tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__poll label { font-size:.75rem; }

.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft { margin-top:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft > header { display:flex; align-items:center; justify-content:space-between; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft h3 { margin:0; font-size:.9rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft > header label { display:flex; align-items:center; gap:.5rem; color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft > header .form-select { width:9rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft form { display:grid; grid-template-columns:1fr auto; gap:.75rem; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .post-comment-row { display:grid; grid-template-columns:8rem 1fr auto; gap:1rem; align-items:center; padding:1rem; border-bottom:1px solid var(--rn-border-default); font-size:.74rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-comment-row p { margin:0; }
.tss-renewal.tss-renewal--structure-preserving-a .post-comment-row small { color:var(--rn-text-secondary); }

.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft { padding:1.25rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft > label { display:grid; gap:.45rem; margin-bottom:1rem; color:var(--rn-text-primary); font-size:.75rem; font-weight:600; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft label > span,
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft small { color:var(--rn-text-secondary); font-size:.68rem; font-weight:400; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__editor { border:1px solid var(--rn-border-default); border-radius:var(--rn-radius-sm); overflow:hidden; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__editor nav { padding:.7rem; border-bottom:1px solid var(--rn-border-default); color:var(--rn-text-secondary); background:var(--rn-bg-section); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__editor textarea { border:0; border-radius:0; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__lower { display:grid; grid-template-columns:2fr 1fr; gap:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft fieldset { display:grid; grid-template-columns:2fr 1fr; gap:.75rem; margin:0; padding:1rem; border:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft legend { float:none; width:auto; padding:0 .4rem; font-size:.85rem; font-weight:700; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft fieldset p { grid-column:1 / -1; margin:0; color:var(--rn-text-secondary); font-size:.68rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft fieldset label { display:grid; gap:.35rem; color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__options { grid-column:1 / -1; display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__file { grid-column:1 / -1; display:flex; justify-content:space-between; padding:.75rem 0; border-top:1px solid var(--rn-border-default); font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__file button { border:0; color:var(--rn-status-danger); background:transparent; }
.tss-renewal.tss-renewal--structure-preserving-a .post-form-draft footer { display:flex; justify-content:flex-end; gap:.6rem; margin-top:1.25rem; padding-top:1rem; border-top:1px solid var(--rn-border-default); }

.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > header { display:flex; justify-content:space-between; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > header small { color:var(--rn-text-secondary); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > a { display:grid; grid-template-columns:13rem 1.5fr 1fr 5rem; gap:1rem; align-items:center; min-height:3.75rem; padding:.75rem 1rem; border-bottom:1px solid var(--rn-border-default); color:var(--rn-text-primary); text-decoration:none; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > a.is-active { color:var(--rn-text-accent); background:var(--rn-bg-accent-soft); }
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > a span,
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > a code { color:var(--rn-text-secondary); font-size:.7rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > a b { color:var(--rn-text-accent); text-align:right; font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-board-posts-draft { margin-top:1rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-board-post-row { display:grid; grid-template-columns:3rem 1fr 10rem 7rem 5rem 9rem; gap:.75rem; align-items:center; min-width:56rem; min-height:3.5rem; padding:.65rem 1rem; border-bottom:1px solid var(--rn-border-default); font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-board-post-row.is-head { color:var(--rn-text-secondary); background:var(--rn-bg-section); font-size:.68rem; font-weight:600; }
.tss-renewal.tss-renewal--structure-preserving-a .admin-board-post-row button,
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-row button { border:0; color:var(--rn-text-accent); background:transparent; font-size:.7rem; font-weight:600; }

.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft nav { display:flex; gap:.25rem; padding:.75rem 1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft nav button { padding:.55rem .8rem; border:0; color:var(--rn-text-secondary); background:transparent; font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft nav button.is-active { color:var(--rn-text-accent); background:var(--rn-bg-accent-soft); font-weight:600; }
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft__filter { display:grid; grid-template-columns:1fr 14rem 14rem auto; gap:.6rem; padding:1rem; border-bottom:1px solid var(--rn-border-default); }
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-row { display:grid; grid-template-columns:10rem 10rem 12rem 1fr 10rem 6rem; gap:.75rem; align-items:center; min-width:58rem; min-height:3.5rem; padding:.65rem 1rem; border-bottom:1px solid var(--rn-border-default); color:var(--rn-text-secondary); font-size:.72rem; }
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-row.is-head { min-height:2.5rem; background:var(--rn-bg-section); font-size:.68rem; font-weight:600; }
.tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-row strong { color:var(--rn-text-primary); }

@media (max-width: 768px) {
    .tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__attachments,
    .tss-renewal.tss-renewal--structure-preserving-a .post-detail-draft__poll,
    .tss-renewal.tss-renewal--structure-preserving-a .post-comment-row,
    .tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__lower,
    .tss-renewal.tss-renewal--structure-preserving-a .post-form-draft fieldset,
    .tss-renewal.tss-renewal--structure-preserving-a .admin-directory-draft > a,
    .tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft__filter { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .post-comments-draft form { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .post-form-draft__options { grid-template-columns:1fr; }
    .tss-renewal.tss-renewal--structure-preserving-a .admin-board-posts-draft,
    .tss-renewal.tss-renewal--structure-preserving-a .vehicle-admin-draft { overflow-x:auto; }
}
/* 2026-09-28 representative draft batches B/C — isolated CSS Lab only. */
.tss-renewal.tss-renewal--structure-preserving-a :where(
    #admin-ticket-list-a,
    #admin-ticket-detail-a,
    #finance-dashboard-a,
    #finance-vouchers-a,
    #login-a,
    #error-access-a,
    #master-data-account-codes-a,
    #admin-ticket-stats-a
) {
    display: grid;
    gap: var(--rn-space-4);
    scroll-margin-top: calc(var(--rn-topbar-height) + var(--rn-space-5));
}

.tss-renewal.tss-renewal--structure-preserving-a :where(
    #admin-ticket-list-a,
    #admin-ticket-detail-a,
    #finance-dashboard-a,
    #finance-vouchers-a,
    #login-a,
    #error-access-a,
    #master-data-account-codes-a,
    #admin-ticket-stats-a
) + section {
    margin-top: var(--rn-space-10);
}

.tss-renewal .final-batch-toolbar {
    display: flex;
    min-height: 58px;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--rn-space-2);
    padding: var(--rn-space-2) var(--rn-space-3);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal .final-batch-toolbar :where(.form-control, .form-select) {
    width: auto;
    min-width: 148px;
    flex: 1 1 148px;
}

.tss-renewal .rn-summary-strip > div {
    position: relative;
    display: grid;
    min-height: 78px;
    align-content: center;
    gap: 3px;
    padding: var(--rn-space-3) var(--rn-space-5);
}

.tss-renewal .rn-summary-strip > div + div::before {
    position: absolute;
    top: var(--rn-space-4);
    bottom: var(--rn-space-4);
    left: 0;
    width: 1px;
    background: var(--rn-border-default);
    content: "";
}

.tss-renewal .rn-summary-strip > div > span { color: var(--rn-text-secondary); font-size: 11px; }
.tss-renewal .rn-summary-strip > div > strong { color: var(--rn-text-primary); font-size: 21px; font-variant-numeric: tabular-nums; }

.tss-renewal .final-batch-table {
    min-width: 0;
    overflow-x: auto;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal .final-batch-row {
    display: grid;
    min-width: 920px;
    min-height: 58px;
    align-items: center;
    gap: var(--rn-space-3);
    padding: var(--rn-space-2) var(--rn-space-3);
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    font-size: 12px;
}

.tss-renewal .final-batch-row:last-child { border-bottom: 0; }
.tss-renewal .final-batch-row.is-head { min-height: 40px; background: var(--rn-bg-section); color: var(--rn-text-secondary); font-size: 11px; font-weight: 600; }
.tss-renewal .final-batch-row.is-selected { background: var(--rn-bg-accent-soft); box-shadow: inset 3px 0 var(--rn-bg-accent); }
.tss-renewal .final-batch-row strong { color: var(--rn-text-primary); }
.tss-renewal .final-batch-row small { color: var(--rn-text-secondary); }
.tss-renewal .final-batch-row button { border: 0; background: transparent; color: var(--rn-text-accent); }
.tss-renewal .final-batch-table--tickets .final-batch-row { grid-template-columns: 44px 146px minmax(240px, 2fr) 100px 100px 90px 104px 82px; }
.tss-renewal .final-batch-table--finance .final-batch-row { grid-template-columns: 160px 120px 140px minmax(170px, 1fr) 120px 120px 150px; }
.tss-renewal .final-batch-table--voucher-queue .final-batch-row { grid-template-columns: 170px minmax(230px, 2fr) 160px 110px 150px 110px; }
.tss-renewal .final-batch-table--voucher-lines .final-batch-row { min-width: 680px; grid-template-columns: 100px 170px 140px minmax(170px, 1fr) 120px; }
.tss-renewal .final-batch-table--accounts .final-batch-row { min-width: 1100px; grid-template-columns: 52px 92px minmax(160px, 1.5fr) 90px minmax(140px, 1fr) 88px 88px 72px 72px 72px; }

.tss-renewal .ticket-admin-detail-draft,
.tss-renewal .finance-voucher-draft,
.tss-renewal .finance-dashboard-draft,
.tss-renewal .stats-preview-draft,
.tss-renewal .state-preview-draft {
    display: grid;
    gap: var(--rn-space-4);
}

.tss-renewal .ticket-admin-detail-draft { grid-template-columns: minmax(0, 2fr) minmax(280px, 0.85fr); }
.tss-renewal .ticket-admin-detail-draft > :where(main, aside > section),
.tss-renewal .finance-voucher-draft > :where(section, aside),
.tss-renewal .finance-dashboard-draft > section,
.tss-renewal .stats-preview-draft > section,
.tss-renewal .state-preview-draft > article,
.tss-renewal .master-data-form-draft {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal .ticket-admin-detail-draft > main { padding: var(--rn-space-5); }
.tss-renewal .ticket-admin-detail-draft > aside { display: grid; align-content: start; gap: var(--rn-space-4); }
.tss-renewal .ticket-admin-detail-draft > aside > section { display: grid; gap: var(--rn-space-3); padding: var(--rn-space-4); }
.tss-renewal .ticket-admin-detail-draft__title { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--rn-space-4); }
.tss-renewal .ticket-admin-detail-draft h3,
.tss-renewal .ticket-admin-detail-draft h4 { margin: 0; }
.tss-renewal .ticket-admin-detail-draft main > section { margin-top: var(--rn-space-5); padding-top: var(--rn-space-4); border-top: 1px solid var(--rn-border-default); }
.tss-renewal .ticket-admin-detail-draft dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rn-space-3); }
.tss-renewal .ticket-admin-detail-draft dl div,
.tss-renewal .finance-voucher-draft dl div,
.tss-renewal .finance-dashboard-draft dl div,
.tss-renewal .stats-preview-draft dl div { display: flex; justify-content: space-between; gap: var(--rn-space-3); padding-block: var(--rn-space-2); border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal :where(.ticket-admin-detail-draft, .finance-voucher-draft) label { display: grid; gap: var(--rn-space-2); color: var(--rn-text-secondary); font-size: 12px; }

.tss-renewal .finance-dashboard-draft { grid-template-columns: minmax(0, 1.8fr) minmax(260px, 1fr); }
.tss-renewal .finance-dashboard-draft > section,
.tss-renewal .stats-preview-draft > section { padding: var(--rn-space-4); }
.tss-renewal .finance-dashboard-draft h4,
.tss-renewal .stats-preview-draft h4 { margin: 0 0 var(--rn-space-4); }
.tss-renewal .finance-bars { display: flex; height: 190px; align-items: end; justify-content: space-around; gap: var(--rn-space-3); padding: var(--rn-space-4); border-bottom: 1px solid var(--rn-border-default); }
.tss-renewal .finance-bars i { width: 9%; height: var(--bar); border-radius: var(--rn-radius-sm) var(--rn-radius-sm) 0 0; background: var(--rn-bg-accent); }

.tss-renewal .finance-voucher-draft { grid-template-columns: minmax(0, 2fr) minmax(290px, 0.8fr); }
.tss-renewal .finance-voucher-draft > :where(section, aside) { display: grid; align-content: start; gap: var(--rn-space-3); padding: var(--rn-space-4); }
.tss-renewal .finance-voucher-draft h4 { margin: 0; }
.tss-renewal .finance-voucher-draft footer { display: flex; justify-content: flex-end; gap: var(--rn-space-2); }

.tss-renewal .auth-preview-draft { display: grid; min-height: 530px; grid-template-columns: minmax(300px, 1.15fr) minmax(360px, 0.85fr); overflow: hidden; border: 1px solid var(--rn-border-default); border-radius: var(--rn-radius-lg); background: var(--rn-bg-surface); }
.tss-renewal .auth-preview-draft > aside { display: grid; align-content: center; gap: var(--rn-space-4); padding: var(--rn-space-10); background: var(--rn-bg-sidebar); color: var(--rn-text-on-dark); }
.tss-renewal .auth-preview-draft > aside h3 { margin: 0; color: var(--rn-text-on-dark); font-size: 34px; line-height: 1.35; }
.tss-renewal .auth-preview-draft > aside p { max-width: 430px; color: color-mix(in srgb, var(--rn-text-on-dark) 78%, var(--rn-bg-sidebar)); }
.tss-renewal .auth-preview-draft > form { display: grid; width: min(100%, 460px); align-self: center; gap: var(--rn-space-4); padding: var(--rn-space-8); justify-self: center; }
.tss-renewal .auth-preview-draft > form h3,
.tss-renewal .auth-preview-draft > form p { margin: 0; }
.tss-renewal .auth-preview-draft > form label { display: grid; gap: var(--rn-space-2); color: var(--rn-text-secondary); font-size: 12px; }

.tss-renewal .state-preview-draft { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tss-renewal .state-preview-draft > article { display: grid; min-height: 330px; align-content: center; gap: var(--rn-space-3); padding: var(--rn-space-8); }
.tss-renewal .state-preview-draft > article > strong { color: var(--rn-status-danger); font-size: 50px; line-height: 1; }
.tss-renewal .state-preview-draft > article:nth-child(2) > strong { color: var(--rn-status-warning); }
.tss-renewal .state-preview-draft h3,
.tss-renewal .state-preview-draft p { margin: 0; }
.tss-renewal .state-preview-draft .rn-button { width: fit-content; }

.tss-renewal .master-data-form-draft { display: grid; grid-template-columns: repeat(5, minmax(120px, 1fr)); align-items: end; gap: var(--rn-space-3); padding: var(--rn-space-4); }
.tss-renewal .master-data-form-draft header,
.tss-renewal .master-data-form-draft p { grid-column: 1 / -1; }
.tss-renewal .master-data-form-draft h4,
.tss-renewal .master-data-form-draft p { margin: 0; }
.tss-renewal .master-data-form-draft label { display: grid; gap: var(--rn-space-2); color: var(--rn-text-secondary); font-size: 12px; }
.tss-renewal .master-data-form-draft footer { display: flex; grid-column: 4 / -1; justify-content: flex-end; gap: var(--rn-space-2); }

.tss-renewal .stats-preview-draft { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tss-renewal .stats-preview-draft > section:last-child { grid-column: 1 / -1; }
.tss-renewal .stats-bars p { display: grid; grid-template-columns: 76px minmax(0, 1fr) 42px; align-items: center; gap: var(--rn-space-3); }
.tss-renewal .stats-bars i { height: 16px; width: var(--bar); border-radius: var(--rn-radius-full); background: var(--rn-bg-accent); }
.tss-renewal .channel-columns { display: flex; height: 180px; align-items: end; justify-content: space-around; }
.tss-renewal .channel-columns p { display: grid; height: 100%; align-content: end; justify-items: center; gap: var(--rn-space-2); }
.tss-renewal .channel-columns i { width: 54px; height: var(--bar); border-radius: var(--rn-radius-sm) var(--rn-radius-sm) 0 0; background: var(--rn-bg-accent); }

@media (max-width: 900px) {
    .tss-renewal .ticket-admin-detail-draft,
    .tss-renewal .finance-voucher-draft,
    .tss-renewal .finance-dashboard-draft,
    .tss-renewal .auth-preview-draft,
    .tss-renewal .state-preview-draft,
    .tss-renewal .stats-preview-draft { grid-template-columns: 1fr; }
    .tss-renewal .stats-preview-draft > section:last-child { grid-column: auto; }
    .tss-renewal .master-data-form-draft { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tss-renewal .master-data-form-draft footer { grid-column: 1 / -1; }
}

@media (max-width: 560px) {
    .tss-renewal .rn-summary-strip { --rn-summary-columns: 2; }
    .tss-renewal .rn-summary-strip > div:nth-child(3)::before { display: none; }
    .tss-renewal .final-batch-toolbar { align-items: stretch; }
    .tss-renewal .final-batch-toolbar :where(.form-control, .form-select, label, .rn-button) { width: 100%; }
    .tss-renewal .ticket-admin-detail-draft dl,
    .tss-renewal .master-data-form-draft { grid-template-columns: 1fr; }
    .tss-renewal .auth-preview-draft > aside { min-height: 280px; padding: var(--rn-space-6); }
    .tss-renewal .auth-preview-draft > aside h3 { font-size: 28px; }
    .tss-renewal .auth-preview-draft > form { padding: var(--rn-space-5); }
}

/* bundled: crm.css */
/**
 * TSS UI Renewal Step 7 — CRM production skin.
 *
 * Figma implementation references:
 * - CRM workspace 18:60
 * - Customer list 67:584
 * - Customer detail / timeline 54:462, 62:516
 * - Deal row / detail / form 15:23, 72:584, 77:714
 * - Deal group / activity / calendar 86:1131, 92:1084, 95:1154
 *
 * The selectors deliberately preserve every existing id, form name, table,
 * modal and JavaScript hook. Repeated records become flat rows; cards remain
 * only where a form, summary, detail rail, calendar or modal needs a boundary.
 */

.tss-renewal.rn-crm-page {
    background: var(--rn-bg-canvas);
    color: var(--rn-text-primary);
}

.tss-renewal.rn-crm-page .content {
    min-width: 0;
    padding: var(--rn-space-6);
    background: var(--rn-bg-canvas);
}

.tss-renewal.rn-crm-page .content > [data-layout-fragment],
.tss-renewal.rn-crm-page .content > div {
    min-width: 0;
}

.tss-renewal.rn-crm-page .ts-page-header {
    display: flex;
    min-height: auto;
    align-items: center;
    justify-content: space-between;
    gap: var(--rn-space-4);
    margin-bottom: var(--rn-space-6);
    padding: 0 0 var(--rn-space-5);
    color: var(--rn-text-primary);
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
}

.tss-renewal.rn-crm-page .ts-page-header__intro {
    min-width: 0;
}

.tss-renewal.rn-crm-page .ts-page-title {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    font-weight: var(--rn-font-weight-bold);
    letter-spacing: var(--rn-letter-spacing-display);
    line-height: var(--rn-line-height-display);
}

.tss-renewal.rn-crm-page .ts-page-title > i {
    color: var(--rn-text-accent);
    font-size: 0.8em;
}

.tss-renewal.rn-crm-page .ts-page-subtitle {
    margin: var(--rn-space-1) 0 0;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-crm-page .ts-page-header__actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--rn-space-2);
}

.tss-renewal.rn-crm-page :where(.btn, .form-control, .form-select, .input-group-text) {
    min-height: var(--rn-control-md);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-crm-page :where(.form-control, .form-select, .input-group-text) {
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
}

.tss-renewal.rn-crm-page :where(.form-control, .form-select)::placeholder {
    color: var(--rn-text-placeholder);
}

.tss-renewal.rn-crm-page :where(.form-control, .form-select):focus {
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) var(--rn-bg-accent-soft);
}

.tss-renewal.rn-crm-page .form-label {
    margin-bottom: var(--rn-space-1);
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-crm-page .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--rn-space-1);
    padding-inline: var(--rn-space-3);
    font-size: var(--rn-font-size-compact);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-crm-page .btn-primary {
    color: var(--rn-accent-contrast);
    background: var(--rn-bg-accent);
    border-color: var(--rn-bg-accent);
}

.tss-renewal.rn-crm-page .btn-primary:hover {
    color: var(--rn-accent-contrast);
    background: var(--rn-accent-hover);
    border-color: var(--rn-accent-hover);
}

.tss-renewal.rn-crm-page :where(.btn-outline-primary, .btn-outline-secondary, .btn-light) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page :where(.btn-outline-primary, .btn-outline-secondary, .btn-light):hover {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border-color: var(--rn-border-focus);
}

/* Intentional panels: filters, forms, details and calendars only. */
.tss-renewal.rn-crm-page .card {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-crm-page .card-header {
    min-height: 48px;
    color: var(--rn-text-primary);
    background: var(--rn-bg-section) !important;
    border-bottom-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page .card-title {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-body);
    font-weight: var(--rn-font-weight-bold);
}

/* Generic filters become one restrained toolbar instead of a floating card. */
.tss-renewal.rn-crm-page :where(.ts-ref-filter, #meetingNotesFilterCard, #followUpsFilterCard, #calMeetingNotesFilterCard) {
    margin-bottom: var(--rn-space-4) !important;
    border-radius: var(--rn-radius-md);
}

.tss-renewal.rn-crm-page :where(.ts-ref-filter, #meetingNotesFilterCard, #followUpsFilterCard, #calMeetingNotesFilterCard) > .card-body {
    padding: var(--rn-space-4);
}

.tss-renewal.rn-crm-page :where(.ts-ref-filter, #meetingNotesFilterCard, #followUpsFilterCard, #calMeetingNotesFilterCard) .card-title {
    margin-bottom: var(--rn-space-3) !important;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    letter-spacing: var(--rn-letter-spacing-label);
}

/* All conventional data tables share the same flat-row rhythm. */
.tss-renewal.rn-crm-page .table-responsive {
    min-width: 0;
    border-color: var(--rn-border-default);
    scrollbar-color: var(--rn-border-strong) transparent;
    scrollbar-width: thin;
}

.tss-renewal.rn-crm-page .table {
    margin-bottom: 0;
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page .table > :not(caption) > * > * {
    color: inherit;
    background: transparent;
    border-color: var(--rn-border-default);
    box-shadow: none;
}

.tss-renewal.rn-crm-page .table > thead > tr > th {
    min-height: 40px;
    padding: var(--rn-space-2) var(--rn-space-3);
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
    vertical-align: middle;
    background: var(--rn-bg-section);
    border-bottom-width: 1px;
}

.tss-renewal.rn-crm-page .table > tbody > tr {
    background: var(--rn-bg-surface);
    transition: background-color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.rn-crm-page .table > tbody > tr:hover {
    background: var(--rn-bg-subtle);
}

.tss-renewal.rn-crm-page .table > tbody > tr:is(.table-active, .selected, [aria-selected="true"]) {
    background: var(--rn-bg-accent-soft);
    box-shadow: inset 3px 0 var(--rn-bg-accent);
}

.tss-renewal.rn-crm-page .table > tbody > tr > td {
    min-height: 56px;
    padding: var(--rn-space-3);
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-compact);
    vertical-align: middle;
}

/* Legacy record cards are rendered as a single connected list. */
.tss-renewal.rn-crm-page :where(.ts-ref-list, #dealsList, #activitiesList, #eventsList) {
    gap: 0;
}

.tss-renewal.rn-crm-page :where(.ts-ref-card, .timeline-card) {
    margin: 0;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-crm-page :where(.ts-ref-card, .timeline-card):hover {
    background: var(--rn-bg-subtle);
    box-shadow: none;
    transform: none;
}

/*
 * Deal list — Figma Deal Row 15:23 translated to the live fields.
 * Every value has one stable column; metadata no longer floats between unrelated values.
 */
.tss-renewal.rn-crm-page .rn-deal-list {
    overflow: hidden;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.rn-crm-page .rn-deal-list__titlebar {
    display: flex;
    min-height: 48px;
    align-items: center;
    padding: var(--rn-space-3) var(--rn-space-4);
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-crm-page .rn-deal-list__titlebar h2 {
    display: flex;
    align-items: center;
    gap: var(--rn-space-2);
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-body);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-crm-page .rn-deal-list__titlebar i {
    color: var(--rn-text-accent);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-crm-page .rn-deal-table-shell {
    max-width: 100%;
    overflow-x: auto;
    scrollbar-color: var(--rn-border-strong) transparent;
    scrollbar-width: thin;
}

.tss-renewal.rn-crm-page .rn-deal-table {
    min-width: 1180px;
}

.tss-renewal.rn-crm-page :where(.rn-deal-table__header, .rn-deal-row) {
    display: grid;
    grid-template-columns:
        minmax(170px, 1.35fr)
        minmax(145px, 1fr)
        minmax(100px, 0.7fr)
        minmax(72px, 0.5fr)
        minmax(92px, 0.65fr)
        minmax(140px, 0.9fr)
        minmax(150px, 1fr)
        minmax(145px, 0.95fr)
        minmax(82px, 0.55fr);
    align-items: center;
    column-gap: var(--rn-space-3);
    padding-inline: var(--rn-space-4);
}

.tss-renewal.rn-crm-page .rn-deal-table__header {
    min-height: 40px;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-crm-page .rn-deal-table__actions-heading {
    text-align: center;
}

.tss-renewal.rn-crm-page .rn-deal-row {
    min-height: 66px;
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
    transition: background-color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.rn-crm-page .rn-deal-row:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-crm-page .rn-deal-row:hover {
    background: var(--rn-bg-subtle);
}

.tss-renewal.rn-crm-page .rn-deal-cell {
    min-width: 0;
    padding-block: var(--rn-space-3);
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-crm-page :where(.rn-deal-cell--party, .rn-deal-cell--code) {
    overflow: hidden;
}

.tss-renewal.rn-crm-page :where(.rn-deal-primary-link, .rn-deal-code-link) {
    display: block;
    overflow: hidden;
    color: var(--rn-text-primary);
    font-weight: var(--rn-font-weight-medium);
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-crm-page .rn-deal-code-link,
.tss-renewal.rn-crm-page .rn-deal-code-link code {
    color: var(--rn-text-accent);
    font-family: var(--rn-font-sans);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-crm-page :where(.rn-deal-primary-link, .rn-deal-code-link):hover {
    color: var(--rn-text-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tss-renewal.rn-crm-page .rn-deal-cell .badge {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: var(--rn-space-1);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-crm-page .rn-deal-type {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-crm-page :where(.rn-deal-cell--amount, .rn-deal-cell--owner, .rn-deal-cell--date) {
    display: grid;
    gap: 3px;
}

.tss-renewal.rn-crm-page .rn-deal-cell--amount {
    font-variant-numeric: tabular-nums;
}

.tss-renewal.rn-crm-page .rn-deal-cell--amount strong {
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-crm-page .rn-deal-cell small {
    overflow: hidden;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-crm-page .rn-deal-cell--actions {
    display: flex;
    justify-content: center;
}

.tss-renewal.rn-crm-page .rn-deal-cell--actions:empty::after,
.tss-renewal.rn-crm-page .rn-deal-cell--actions .btn-group:empty::after {
    color: var(--rn-text-disabled);
    content: "—";
}

.tss-renewal.rn-crm-page .rn-deal-cell--actions .btn {
    width: 30px;
    min-height: 30px;
    padding: 0;
}

/*
 * Shared CRM record list — the live equivalent of Figma's cardless Data Table Row.
 * A column always represents one meaning; mobile changes layout, never field meaning.
 */
.tss-renewal.rn-crm-page .rn-crm-record-list {
    max-width: 100%;
    overflow: hidden;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.rn-crm-page .rn-crm-record-list__scroller {
    max-width: 100%;
    overflow-x: auto;
    scrollbar-color: var(--rn-border-strong) transparent;
    scrollbar-width: thin;
}

.tss-renewal.rn-crm-page .rn-crm-record-list__header,
.tss-renewal.rn-crm-page .rn-crm-record-row {
    display: grid;
    grid-template-columns: var(--rn-crm-record-columns);
    min-width: var(--rn-crm-record-min-width, 1080px);
    align-items: center;
    column-gap: var(--rn-space-3);
    padding-inline: var(--rn-space-4);
}

.tss-renewal.rn-crm-page .rn-crm-record-list--groups {
    --rn-crm-record-columns: minmax(160px, 1.2fr) minmax(135px, 0.9fr) minmax(82px, 0.55fr) minmax(70px, 0.5fr) minmax(78px, 0.55fr) minmax(125px, 0.85fr) minmax(125px, 0.85fr) minmax(120px, 0.8fr) minmax(105px, 0.7fr) minmax(76px, 0.5fr);
    --rn-crm-record-min-width: 1240px;
}

.tss-renewal.rn-crm-page .rn-crm-record-list--customers {
    --rn-crm-record-columns: minmax(180px, 1.35fr) minmax(100px, 0.75fr) minmax(82px, 0.58fr) minmax(78px, 0.55fr) minmax(78px, 0.55fr) minmax(130px, 0.9fr) minmax(125px, 0.85fr) minmax(70px, 0.48fr);
    --rn-crm-record-min-width: 1080px;
}

.tss-renewal.rn-crm-page .rn-crm-record-list--meeting-notes {
    --rn-crm-record-columns: minmax(220px, 1.55fr) minmax(90px, 0.62fr) minmax(190px, 1.3fr) minmax(120px, 0.8fr) minmax(120px, 0.8fr) minmax(145px, 0.95fr) minmax(110px, 0.72fr);
    --rn-crm-record-min-width: 1120px;
}

.tss-renewal.rn-crm-page .rn-crm-record-list--follow-ups {
    --rn-crm-record-columns: minmax(210px, 1.45fr) minmax(160px, 1.05fr) minmax(150px, 1fr) minmax(86px, 0.58fr) minmax(110px, 0.72fr) minmax(120px, 0.8fr) minmax(150px, 1fr);
    --rn-crm-record-min-width: 1080px;
}

.tss-renewal.rn-crm-page .rn-crm-record-list--activities {
    --rn-crm-record-columns: minmax(120px, 0.78fr) minmax(155px, 1fr) minmax(170px, 1.1fr) minmax(240px, 1.55fr) minmax(120px, 0.8fr) minmax(145px, 0.95fr) minmax(72px, 0.48fr);
    --rn-crm-record-min-width: 1120px;
}

.tss-renewal.rn-crm-page .rn-crm-record-list__header {
    min-height: 42px;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

/* Dark section headings share their panel surface instead of adding another band. */
html[data-tss-theme="dark"] .tss-renewal.rn-crm-page :is(.rn-deal-table__header, .rn-crm-record-list__header, .table thead tr, .table thead th) {
    background: var(--rn-bg-surface) !important;
}

.tss-renewal.rn-crm-page .rn-crm-sortable {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: var(--rn-space-1);
    padding: 0;
    color: inherit;
    font: inherit;
    text-align: left;
    background: transparent;
    border: 0;
}

.tss-renewal.rn-crm-page .rn-crm-sortable:hover,
.tss-renewal.rn-crm-page .rn-crm-sortable:focus-visible {
    color: var(--rn-text-accent);
}

.tss-renewal.rn-crm-page .rn-crm-sortable:focus-visible {
    outline: 2px solid var(--rn-border-focus);
    outline-offset: 3px;
}

.tss-renewal.rn-crm-page .rn-crm-record-row {
    min-height: 64px;
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
    transition: background-color var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.rn-crm-page .rn-crm-record-row:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-crm-page .rn-crm-record-row:hover {
    background: var(--rn-bg-subtle);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell {
    min-width: 0;
    padding-block: var(--rn-space-3);
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--primary {
    display: grid;
    align-items: start;
    gap: var(--rn-space-1);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--primary :where(.badge, [class*="badge-tss-"]) {
    width: max-content;
    max-width: 100%;
    justify-self: start;
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--primary small {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell > small,
.tss-renewal.rn-crm-page .rn-crm-record-secondary {
    display: block;
    margin-top: var(--rn-space-1);
    overflow: hidden;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-crm-page :where(.rn-crm-record-link, .rn-crm-record-code) {
    display: block;
    overflow: hidden;
    color: var(--rn-text-primary);
    font-weight: var(--rn-font-weight-medium);
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-crm-page .rn-crm-record-code {
    color: var(--rn-text-accent);
}

.tss-renewal.rn-crm-page :where(.rn-crm-record-link, .rn-crm-record-code):hover {
    color: var(--rn-text-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--truncate,
.tss-renewal.rn-crm-page .rn-crm-record-cell--note {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--metric,
.tss-renewal.rn-crm-page .rn-crm-record-cell--money {
    font-variant-numeric: tabular-nums;
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--money {
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--date {
    color: var(--rn-text-secondary);
    font-variant-numeric: tabular-nums;
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--rn-space-1);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--actions > .ts-desktop-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: var(--rn-space-1);
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--actions .btn {
    min-width: 32px;
    min-height: 32px;
    padding: 4px 6px;
}

.tss-renewal.rn-crm-page .rn-crm-record-cell--actions > .ts-desktop-actions > .btn {
    margin-inline: 0 !important;
}

.tss-renewal.rn-crm-page .rn-crm-progress {
    display: grid;
    grid-template-columns: minmax(54px, 1fr) auto;
    align-items: center;
    gap: var(--rn-space-2);
}

.tss-renewal.rn-crm-page .rn-crm-progress .progress {
    height: 6px;
    background: var(--rn-bg-subtle);
}

.tss-renewal.rn-crm-page .rn-crm-progress small {
    color: var(--rn-text-secondary);
    font-variant-numeric: tabular-nums;
}

.tss-renewal.rn-crm-page .rn-crm-record-list .ts-ref-state {
    min-width: var(--rn-crm-record-min-width, 1080px);
}

/* Existing KPI card markup becomes one connected summary strip. */
.tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) {
    --bs-gutter-x: 0;
    overflow: hidden;
    margin-right: 0;
    margin-left: 0;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) > [class*="col-"] {
    padding: 0;
}

.tss-renewal.rn-crm-page .stats-card {
    min-height: 88px;
    margin: 0;
    background: transparent;
    border: 0;
    border-left: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) > [class*="col-"]:first-child .stats-card {
    border-left: 0;
}

.tss-renewal.rn-crm-page .stats-card:hover {
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-crm-page .stats-card .card-body {
    display: grid;
    min-height: 88px;
    align-content: center;
    padding: var(--rn-space-3) var(--rn-space-4);
    text-align: left !important;
}

.tss-renewal.rn-crm-page .stats-card :where(.card-title, small) {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-crm-page .stats-card :where(h2, h3, .display-6) {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-kpi);
    font-variant-numeric: tabular-nums;
}

.tss-renewal.rn-crm-page .stats-card #totalRevenue {
    font-size: clamp(16px, 1.7vw, 22px);
    white-space: nowrap;
}

.tss-renewal.rn-crm-page .stats-card .icon {
    display: none;
}

/* Form pages use a calm content column and a narrow guidance rail. */
.tss-renewal.rn-crm-page :where(#dealForm, #dealGroupForm, #meetingNoteForm, form.ts-form) {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-crm-page :where(#dealForm, #dealGroupForm, #meetingNoteForm, form.ts-form) .row {
    --bs-gutter-y: var(--rn-space-4);
}

.tss-renewal.rn-crm-page :where(.mn-form-section, .form-section, fieldset) {
    border-color: var(--rn-border-default) !important;
    background: var(--rn-bg-surface) !important;
}

.tss-renewal.rn-crm-page :where(.mn-form-section-title, legend) {
    color: var(--rn-text-secondary) !important;
}

/* Detail pages retain their information architecture with lighter boundaries. */
.tss-renewal.rn-crm-page :where(.group-info-card, .deal-info-card, .basic-info-section, .crm-activity-detail) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
    box-shadow: none;
}

.tss-renewal.rn-crm-page :where(.nav-tabs, .nav-pills) {
    gap: 0;
    border-bottom-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page :where(.nav-tabs, .nav-pills) .nav-link {
    color: var(--rn-text-secondary);
    background: transparent;
    border-color: transparent;
    border-radius: 0;
}

.tss-renewal.rn-crm-page :where(.nav-tabs, .nav-pills) .nav-link.active {
    color: var(--rn-text-accent);
    background: transparent;
    border-bottom: 2px solid var(--rn-bg-accent);
}

/* Modals, dropdowns and calendars must be symmetric in Light and Dark. */
.tss-renewal.rn-crm-page :where(.modal-content, .dropdown-menu, .popover) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-elevated);
    border-color: var(--rn-border-default);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.rn-crm-page :where(.modal-header, .modal-footer) {
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page :where(.dropdown-item, .list-group-item) {
    color: var(--rn-text-primary);
    background: transparent;
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page :where(.dropdown-item, .list-group-item):hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-subtle);
}

.tss-renewal.rn-crm-page :where(.fc, .cal-calendar-wrap) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-crm-page .fc :where(.fc-scrollgrid, td, th) {
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-crm-page .fc .fc-col-header-cell {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-crm-page .fc .fc-daygrid-day.fc-day-today {
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.rn-crm-page .rn-list-pagination-wrap {
    margin-top: var(--rn-space-4);
}

/* Paging stays above async rows; changing result counts never moves its controls. */
.tss-renewal.rn-crm-page .rn-stable-pagination {
    min-height: 88px;
    display: flex;
    align-items: center;
    width: 100%;
}
.tss-renewal.rn-crm-page .rn-stable-pagination > div { width: 100%; }
@media (max-width: 767.98px) {
    .tss-renewal.rn-crm-page .rn-stable-pagination { min-height: 128px; }
    .tss-renewal.rn-crm-page .rn-stable-pagination > div { flex-wrap: wrap; gap: 8px; }
    .tss-renewal.rn-crm-page .rn-stable-pagination nav.position-absolute {
        position: static !important;
        transform: none !important;
        width: 100%;
    }
    .tss-renewal.rn-crm-page .rn-stable-pagination .pagination { flex-wrap: wrap; }
    .tss-renewal.rn-crm-page .rn-stable-pagination [style*="visibility: hidden"] { display: none; }
}

.tss-renewal.rn-crm-page :where(.badge, [class*="badge-tss-"]) {
    border-radius: var(--rn-radius-full);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-crm-page .text-muted {
    color: var(--rn-text-secondary) !important;
}

.tss-renewal.rn-crm-page .bg-white,
.tss-renewal.rn-crm-page .bg-light {
    background: var(--rn-bg-surface) !important;
}

.tss-renewal.rn-crm-page .alert-info {
    color: var(--rn-text-primary);
    background: var(--rn-bg-accent-soft);
    border-color: var(--rn-border-default);
}

/* Standalone party-type chooser. */
.tss-renewal.rn-crm-page--popup .search-modal {
    min-height: 100vh;
    color: var(--rn-text-primary);
    background: var(--rn-bg-canvas);
}

.tss-renewal.rn-crm-page--popup .search-container {
    max-width: 720px;
    padding: var(--rn-space-6);
}

@media (max-width: 991.98px) {
    .tss-renewal.rn-crm-page .content {
        padding: var(--rn-space-5);
    }

    .tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) > [class*="col-"] {
        width: auto;
        max-width: none;
    }

    .tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) > [class*="col-"]:nth-child(odd) .stats-card {
        border-left: 0;
    }

    .tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) > [class*="col-"]:nth-child(n + 3) .stats-card {
        border-top: 1px solid var(--rn-border-default);
    }
}

@media (max-width: 767.98px) {
    .tss-renewal.rn-crm-page .content {
        padding: var(--rn-space-4);
    }

    .tss-renewal.rn-crm-page .ts-page-header {
        min-height: 0;
        align-items: stretch;
        flex-direction: column;
        margin-bottom: var(--rn-space-4);
        padding: 0 0 var(--rn-space-4);
    }

    .tss-renewal.rn-crm-page .ts-page-header__intro {
        flex: 0 1 auto;
        width: 100%;
    }

    .tss-renewal.rn-crm-page .ts-page-header__actions {
        width: 100%;
        justify-content: flex-start;
    }

    .tss-renewal.rn-crm-page .ts-page-header__actions > :where(.btn, .dropdown) {
        flex: 1 1 auto;
    }

    .tss-renewal.rn-crm-page :where(.ts-ref-filter, #meetingNotesFilterCard, #followUpsFilterCard, #calMeetingNotesFilterCard) > .card-body {
        padding: var(--rn-space-3);
    }

    .tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-crm-page .stats-card {
        min-height: 72px;
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.rn-crm-page .row:has(> [class*="col-"] .stats-card) > [class*="col-"]:first-child .stats-card {
        border-top: 0;
    }

    .tss-renewal.rn-crm-page .stats-card .card-body {
        min-height: 72px;
        padding: var(--rn-space-3);
    }

    .tss-renewal.rn-crm-page .table-responsive {
        overflow-x: auto;
    }

    .tss-renewal.rn-crm-page .rn-deal-table {
        min-width: 0;
    }

    .tss-renewal.rn-crm-page .rn-deal-table__header {
        display: none;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-list__header {
        display: none;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-list__scroller {
        overflow-x: visible;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        min-width: 0;
        gap: var(--rn-space-3) var(--rn-space-4);
        padding-block: var(--rn-space-4);
    }

    .tss-renewal.rn-crm-page .rn-crm-record-cell {
        display: grid;
        grid-template-columns: minmax(92px, 0.42fr) minmax(0, 1fr);
        align-items: center;
        gap: var(--rn-space-2);
        padding: 0;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-cell::before {
        color: var(--rn-text-secondary);
        content: attr(data-label);
        font-size: var(--rn-font-size-label);
        font-weight: var(--rn-font-weight-medium);
    }

    .tss-renewal.rn-crm-page .rn-crm-record-cell--primary small {
        grid-column: 2;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-cell--actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-cell--actions::before {
        flex-basis: 100%;
        text-align: center;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-list .ts-ref-state {
        min-width: 0;
    }

    .tss-renewal.rn-crm-page .rn-deal-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: var(--rn-space-3) var(--rn-space-4);
        padding-block: var(--rn-space-4);
    }

    .tss-renewal.rn-crm-page .rn-deal-cell {
        display: grid;
        grid-template-columns: minmax(88px, 0.42fr) minmax(0, 1fr);
        align-items: center;
        gap: var(--rn-space-2);
        padding: 0;
    }

    .tss-renewal.rn-crm-page .rn-deal-cell::before {
        color: var(--rn-text-secondary);
        content: attr(data-label);
        font-size: var(--rn-font-size-label);
        font-weight: var(--rn-font-weight-medium);
    }

    .tss-renewal.rn-crm-page .rn-deal-cell--actions {
        justify-content: stretch;
    }

    .tss-renewal.rn-crm-page .rn-deal-cell--actions .btn-group {
        justify-self: start;
    }

    .tss-renewal.rn-crm-page .modal-dialog {
        margin: var(--rn-space-2);
    }

    .tss-renewal.rn-crm-page--popup .search-container {
        padding: var(--rn-space-4);
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-crm-page .content {
        padding: var(--rn-space-3);
    }

    .tss-renewal.rn-crm-page .ts-page-title {
        font-size: var(--rn-font-size-section);
    }

    .tss-renewal.rn-crm-page .ts-page-header__actions > :where(.btn, .dropdown) {
        width: 100%;
        flex-basis: 100%;
    }

    .tss-renewal.rn-crm-page .rn-deal-row {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-crm-page .rn-crm-record-row {
        grid-template-columns: 1fr;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tss-renewal.rn-crm-page :where(.table > tbody > tr, .ts-ref-card, .timeline-card, .rn-deal-row, .rn-crm-record-row) {
        transition: none;
    }
}

/* bundled: content.css */
/**
 * TSS UI Renewal Step 8 — board, community and document-library production skin.
 *
 * Figma implementation references:
 * - Community workspace 21:322
 * - Board post row 15:37
 * - Post form 119:1203
 * - Admin board workspace 119:1338
 * - Document library 110:880
 * - Document upload 110:1274
 *
 * Existing routes, permission conditions, form names, DOM ids and JavaScript
 * hooks remain intact. Repeated content is rendered as directory or data rows;
 * panels remain only for meaningful reading, editing, tree and modal surfaces.
 */

body.tss-renewal.rn-content-page {
    color: var(--rn-text-primary);
    background: var(--rn-bg-canvas);
}

body.tss-renewal.rn-content-page > main.container {
    width: 100%;
    max-width: none;
    margin-block: 0 !important;
    padding: var(--rn-space-6);
}

/* 문서함은 트리와 7열 목록을 함께 보므로, 데스크톱에서 사이드바를 떼고 남은 폭을 전부 사용한다. */
body.tss-renewal.rn-content-page:has(.doc-lib) > main.container {
    max-width: none;
}

.tss-renewal.rn-content-page :where(.bd-page, .wb-page, .doc-lib) {
    min-width: 0;
    color: var(--rn-text-primary);
}

/*
 * 공통 콘텐츠 레일: 사이드바 옆에 바로 붙지 않고 가용 영역 안에서 가운데 정렬한다.
 * 문서함은 폴더 트리와 다열 목록을 함께 사용하므로 기존처럼 전체 폭을 쓰는 예외다.
 */
.tss-renewal.rn-content-page :where(.bd-page, .wb-page) {
    width: 100%;
    max-width: var(--rn-content-max);
    margin-inline: auto;
}

.tss-renewal.rn-content-page :where(.bd-page, .wb-page) > .container,
.tss-renewal.rn-content-page .bd-page > .container {
    width: 100%;
    max-width: none;
    margin-top: 0 !important;
    padding: 0;
}

.tss-renewal.rn-content-page :where(.form-control, .form-select, .input-group-text) {
    min-height: var(--rn-control-md);
    color: var(--rn-text-primary);
    background: var(--rn-bg-input);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-content-page :where(.form-control, .form-select)::placeholder {
    color: var(--rn-text-placeholder);
}

.tss-renewal.rn-content-page :where(.form-control, .form-select):focus {
    color: var(--rn-text-primary);
    background: var(--rn-bg-input);
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) var(--rn-bg-accent-soft);
}

.tss-renewal.rn-content-page .form-label {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
}

.tss-renewal.rn-content-page :where(.btn, .bd-action-btn, .wb-action-btn, .wb-btn-primary, .wb-btn-ghost) {
    min-height: var(--rn-control-md);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-content-page :where(.btn-tss-primary, .btn-primary, .bd-action-btn-primary, .wb-action-btn--primary, .wb-btn-primary) {
    color: var(--rn-accent-contrast);
    background: var(--rn-bg-accent);
    border-color: var(--rn-bg-accent);
}

.tss-renewal.rn-content-page :where(.btn-tss-primary, .btn-primary, .bd-action-btn-primary, .wb-action-btn--primary, .wb-btn-primary):hover {
    color: var(--rn-accent-contrast);
    background: var(--rn-accent-hover);
    border-color: var(--rn-accent-hover);
}

.tss-renewal.rn-content-page :where(.btn-tss-ghost, .btn-outline-secondary, .bd-action-btn-ghost, .wb-btn-ghost) {
    color: var(--rn-text-secondary);
    background: transparent;
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-content-page :where(.pagination, .doc-lib-pagination) {
    gap: var(--rn-space-1);
}

.tss-renewal.rn-content-page :where(.page-link, .doc-lib-page-number, .doc-lib-page-arrow) {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm) !important;
}

.tss-renewal.rn-content-page :where(.page-item.active .page-link, .doc-lib-page-number.is-active) {
    color: var(--rn-accent-contrast);
    background: var(--rn-bg-accent);
    border-color: var(--rn-bg-accent);
}

/* Board hub and post list — directory + structured rows. */
.tss-renewal.rn-content-page .bd-page-hero,
.tss-renewal.rn-content-page .wb-page-header,
.tss-renewal.rn-content-page .doc-lib-hero {
    display: flex;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: var(--rn-space-4);
    margin-bottom: var(--rn-space-6) !important;
    padding: 0 0 var(--rn-space-5);
    color: var(--rn-text-primary);
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
}

.tss-renewal.rn-content-page :where(.bd-title, .wb-page-title, .doc-lib-title) {
    display: inline-flex;
    align-items: center;
    gap: var(--rn-space-2);
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    font-weight: var(--rn-font-weight-bold);
    letter-spacing: var(--rn-letter-spacing-display);
    line-height: var(--rn-line-height-display);
}

.tss-renewal.rn-content-page :where(.bd-title, .wb-page-title, .doc-lib-title) > i {
    color: var(--rn-text-accent);
    font-size: 1em;
}

.tss-renewal.rn-content-page :where(.bd-page-hero p, .wb-page-lead, .doc-lib-subtitle) {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-content-page .bd-board-grid {
    display: block;
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: none;
}

.tss-renewal.rn-content-page .bd-board-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    gap: 0 var(--rn-space-3);
    align-items: center;
    min-height: 72px;
    padding: var(--rn-space-3) var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-content-page .bd-board-card:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-content-page .bd-board-card:hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-hover);
    border-color: var(--rn-border-default);
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-content-page .bd-board-card::after {
    content: "›";
    grid-column: 3;
    grid-row: 1 / span 2;
    color: var(--rn-text-muted);
    font-size: var(--rn-font-size-section);
}

.tss-renewal.rn-content-page .bd-board-card__icon {
    grid-column: 1;
    grid-row: 1 / span 2;
    width: 36px;
    height: 36px;
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border: 1px solid var(--rn-border-subtle);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-content-page .bd-board-card__title {
    grid-column: 2;
    grid-row: 1;
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-card);
}

.tss-renewal.rn-content-page .bd-board-card__desc {
    grid-column: 2;
    grid-row: 2;
    margin: 0;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-content-page .bd-search-toolbar {
    padding: var(--rn-space-4);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: none;
}

.tss-renewal.rn-content-page .bd-post-list-panel {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: none;
}

.tss-renewal.rn-content-page .bd-post-list-row {
    min-height: 60px;
    padding: var(--rn-space-3) var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
}

.tss-renewal.rn-content-page .bd-post-list-row:hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-hover);
}

.tss-renewal.rn-content-page :where(.bd-post-list-no, .bd-post-list-author, .bd-post-list-date, .bd-post-list-stats) {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-content-page .bd-link,
.tss-renewal.rn-content-page .bd-post-list-title {
    color: var(--rn-text-primary);
    font-weight: var(--rn-font-weight-medium);
}

/* Reading and form surfaces stay bounded, but avoid nested card stacks. */
.tss-renewal.rn-content-page :where(.bd-card, .bd-post-content-card, .bd-post-form-card, .wb-panel, .doc-lib-panel) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: none;
}

.tss-renewal.rn-content-page :where(.bd-card .card-body, .bd-post-content-card .card-body, .bd-post-form-card .card-body) {
    padding: var(--rn-space-6);
}

.tss-renewal.rn-content-page :where(.bd-post-meta, .bd-post-list-stats, .wb-post-meta, .wb-post-stats, .doc-lib-detail-meta) {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-content-page .bd-post-body-divider {
    border-color: var(--rn-border-default);
    opacity: 1;
}

.tss-renewal.rn-content-page .bd-content {
    color: var(--rn-text-primary);
    line-height: var(--rn-line-height-body);
}

.tss-renewal.rn-content-page :where(.bd-form-field, .bd-poll-form, .poll-question-card) {
    padding-block: var(--rn-space-4);
    border: 0 !important;
    border-bottom: 1px solid var(--rn-border-default) !important;
    border-radius: 0 !important;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-content-page .bd-form-field:first-of-type {
    padding-top: 0;
}

.tss-renewal.rn-content-page .tox-tinymce {
    border-color: var(--rn-border-default) !important;
    border-radius: var(--rn-radius-sm) !important;
}

/* Whistleblow keeps confidentiality/status logic and uses the same flat feed. */
.tss-renewal.rn-content-page .wb-post-list {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
}

.tss-renewal.rn-content-page .wb-post-card {
    margin: 0;
    padding: var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-content-page .wb-post-card:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-content-page .wb-post-card:hover {
    background: var(--rn-bg-hover);
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-content-page :where(.wb-post-card__title, .wb-section-title, .wb-detail-header) {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-content-page :where(.wb-comment-item, .wb-attach-item, .list-group-item) {
    color: var(--rn-text-primary);
    background: transparent;
    border-color: var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
}

.tss-renewal.rn-content-page .wb-comment-item {
    border-width: 0 0 1px;
}

.tss-renewal.rn-content-page :where(.wb-comment-form, .wb-info-box, .wb-warning-box, .wb-read-alert) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-subtle);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

/* Document library — directory rail + user-selectable card/list views. */
.tss-renewal.rn-content-page .doc-lib {
    --doc-hero-bg: transparent;
    --doc-lib-bg: var(--rn-bg-canvas);
    --doc-lib-surface: var(--rn-bg-surface);
    --doc-lib-border: var(--rn-border-default);
    --doc-lib-text: var(--rn-text-primary);
    --doc-lib-muted: var(--rn-text-secondary);
    --doc-lib-primary: var(--rn-bg-accent);
    --doc-lib-primary-soft: var(--rn-bg-accent-soft);
    max-width: none;
    color: var(--rn-text-primary);
}

.tss-renewal.rn-content-page .doc-lib-hero {
    display: grid;
    gap: var(--rn-space-3);
}

.tss-renewal.rn-content-page .doc-lib-hero-top {
    align-items: center;
}

.tss-renewal.rn-content-page .doc-lib-search {
    display: grid;
    grid-template-columns: minmax(120px, 180px) minmax(0, 1fr) auto;
    gap: var(--rn-space-2);
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.tss-renewal.rn-content-page .doc-lib-search-input {
    min-height: var(--rn-control-md);
    color: var(--rn-text-primary);
    background: var(--rn-bg-input);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-content-page :where(.doc-lib-search-btn, .doc-lib-btn-upload, .doc-lib-btn-permissions) {
    min-height: var(--rn-control-md);
    color: var(--rn-accent-contrast);
    background: var(--rn-bg-accent);
    border: 1px solid var(--rn-bg-accent);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-content-page .doc-lib-body {
    display: grid;
    grid-template-columns: minmax(220px, var(--rn-directory-width)) minmax(0, 1fr);
    gap: var(--rn-space-4);
    align-items: start;
}

.tss-renewal.rn-content-page .doc-lib-sidebar {
    position: sticky;
    top: calc(var(--rn-topbar-height) + var(--rn-space-4));
    overflow: hidden;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: none;
}

.tss-renewal.rn-content-page .doc-lib-sidebar-head {
    min-height: 48px;
    padding: var(--rn-space-3) var(--rn-space-4);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-content-page .doc-lib-cat-list {
    padding: var(--rn-space-2) 0;
}

.tss-renewal.rn-content-page .doc-cat-item {
    min-height: 40px;
    margin: 0;
    padding: var(--rn-space-2) var(--rn-space-3);
    color: var(--rn-text-primary);
    background: transparent;
    border: 0;
    border-radius: 0;
}

.tss-renewal.rn-content-page .doc-cat-item:hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-hover);
}

.tss-renewal.rn-content-page .doc-cat-item.active {
    color: var(--rn-text-accent);
    background: var(--rn-bg-selected);
    box-shadow: inset 3px 0 0 var(--rn-bg-accent);
}

.tss-renewal.rn-content-page .doc-lib-main {
    min-width: 0;
    overflow: hidden;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: none;
}

.tss-renewal.rn-content-page .doc-lib-main-head {
    padding: var(--rn-space-4);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-content-page .doc-lib-main-body {
    padding: 0;
}

.tss-renewal.rn-content-page .doc-lib-doc-views[data-view="grid"] {
    padding: var(--rn-space-4);
}

.tss-renewal.rn-content-page .doc-preview-list-wrap {
    overflow-x: auto;
    border: 0;
    border-radius: 0;
}

.tss-renewal.rn-content-page .doc-preview-list {
    width: 100%;
    min-width: 720px;
    table-layout: fixed;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-content-page .doc-preview-list thead th {
    height: 38px;
    padding: var(--rn-space-2) var(--rn-space-3);
    color: var(--rn-text-secondary);
    background: var(--doc-table-head);
    border-color: var(--rn-border-default);
    font-size: var(--rn-font-size-label);
}

.tss-renewal.rn-content-page .doc-preview-list tbody td {
    height: 72px;
    padding: var(--rn-space-3);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
}

/* 72px 행 안에서 긴 제목·파일명·폴더 경로가 행 높이를 밀어내지 않게 한다. */
.tss-renewal.rn-content-page .doc-list-col-title {
    min-width: 0;
}

.tss-renewal.rn-content-page .doc-list-col-folder {
    width: clamp(12rem, 22vw, 20rem);
}

.tss-renewal.rn-content-page .doc-list-col-actions {
    width: 8rem;
}

.tss-renewal.rn-content-page .doc-list-title-link {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: var(--rn-space-1);
}

.tss-renewal.rn-content-page .doc-list-title-text,
.tss-renewal.rn-content-page .doc-list-filename,
.tss-renewal.rn-content-page .doc-list-folder-link {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: normal;
}

.tss-renewal.rn-content-page .doc-list-row:hover td {
    background: var(--rn-bg-hover);
}

.tss-renewal.rn-content-page :where(.doc-list-title-link, .doc-list-folder-link) {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-content-page .doc-list-title-link:hover,
.tss-renewal.rn-content-page .doc-list-folder-link:hover {
    color: var(--rn-text-accent);
}

.tss-renewal.rn-content-page :where(.doc-list-filename, .doc-list-col-date, .doc-list-col-size) {
    color: var(--rn-text-secondary) !important;
}

.tss-renewal.rn-content-page .doc-list-action {
    color: var(--rn-text-accent);
    background: transparent;
    border-color: transparent;
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-content-page .doc-list-action:hover {
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
}

.tss-renewal.rn-content-page .doc-lib-panel-head {
    padding: var(--rn-space-4) var(--rn-space-5);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-content-page .doc-lib-panel-body {
    padding: var(--rn-space-5);
}

.tss-renewal.rn-content-page .doc-lib-tabs {
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-content-page .doc-lib-tabs .nav-link {
    color: var(--rn-text-secondary);
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
}

.tss-renewal.rn-content-page .doc-lib-tabs .nav-link.active {
    color: var(--rn-text-accent);
    background: transparent;
    border-bottom-color: var(--rn-bg-accent);
}

.tss-renewal.rn-content-page .doc-lib-table :where(th, td) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-content-page .doc-lib-dropzone {
    min-height: 180px;
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
    border: 1px dashed var(--rn-border-strong);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-content-page .doc-lib-dropzone:hover,
.tss-renewal.rn-content-page .doc-lib-dropzone:focus-visible,
.tss-renewal.rn-content-page .doc-lib-dropzone.is-dragover {
    background: var(--rn-bg-accent-soft);
    border-color: var(--rn-border-focus);
}

/* Admin board/document workspaces — flat tables and connected KPI strips. */
.tss-renewal.rn-content-page--admin .super-admin-main {
    min-width: 0;
    padding: var(--rn-space-6) !important;
    color: var(--rn-text-primary);
    background: var(--rn-bg-canvas);
}

.tss-renewal.rn-content-page--admin .super-admin-main > div {
    min-width: 0;
}

.tss-renewal.rn-content-page--admin :where(.help-page-header, .super-admin-main > div > .d-flex.border-bottom) {
    margin-bottom: var(--rn-space-5) !important;
    padding: var(--rn-space-4) var(--rn-space-5) !important;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default) !important;
    border-radius: var(--rn-radius-lg);
}

.tss-renewal.rn-content-page--admin :where(.h2, .help-page-header h1, .help-page-header h2) {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
}

.tss-renewal.rn-content-page--admin .card {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-content-page--admin .card-header {
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-content-page--admin .ts-ref-list {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
}

.tss-renewal.rn-content-page--admin .ts-ref-card {
    min-height: 60px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-4);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-content-page--admin .ts-ref-card:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-content-page--admin .ts-ref-card:hover {
    background: var(--rn-bg-hover);
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-content-page--admin .table {
    --bs-table-bg: var(--rn-bg-surface);
    --bs-table-color: var(--rn-text-primary);
    --bs-table-border-color: var(--rn-border-default);
    --bs-table-hover-bg: var(--rn-bg-hover);
    color: var(--rn-text-primary);
}

.tss-renewal.rn-content-page--admin .table thead th {
    color: var(--rn-text-secondary);
    background: var(--rn-bg-section);
    font-size: var(--rn-font-size-label);
}

.tss-renewal.rn-content-page--admin .row:has(.stat-card) {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    margin-inline: 0;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
}

.tss-renewal.rn-content-page--admin .row:has(.stat-card) > [class*="col-"] {
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
}

.tss-renewal.rn-content-page--admin .stat-card {
    min-height: 92px;
    margin: 0;
    color: var(--rn-text-primary) !important;
    background: transparent !important;
    border: 0;
    border-left: 1px solid var(--rn-border-default);
    border-radius: 0;
}

.tss-renewal.rn-content-page--admin .row:has(.stat-card) > [class*="col-"]:first-child .stat-card {
    border-left: 0;
}

.tss-renewal.rn-content-page--admin .stat-card :where(.card-header, .card-body, .card-title) {
    color: var(--rn-text-primary) !important;
    background: transparent !important;
    border: 0;
}

.tss-renewal.rn-content-page--admin .board-admin-panel > .board-admin-directory {
    display: block;
    overflow: hidden;
    margin: 0;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
}

.tss-renewal.rn-content-page--admin .board-admin-panel > .board-admin-directory > [class*="col-"] {
    width: 100%;
    max-width: none;
    margin: 0 !important;
    padding: 0;
}

.tss-renewal.rn-content-page--admin .board-admin-panel > .board-admin-directory > [class*="col-"] > .card {
    min-height: 80px;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
}

.tss-renewal.rn-content-page--admin .board-admin-panel > .board-admin-directory > [class*="col-"]:last-child > .card {
    border-bottom: 0;
}

.tss-renewal.rn-content-page--admin .board-admin-directory .card-body {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    column-gap: var(--rn-space-3);
    align-items: center;
    min-height: 80px;
    padding: var(--rn-space-3) var(--rn-space-4);
    text-align: left !important;
}

.tss-renewal.rn-content-page--admin .board-admin-directory .board-admin-card-icon {
    display: grid;
    grid-column: 1;
    grid-row: 1 / span 2;
    place-items: center;
    width: 36px;
    height: 36px;
    color: var(--rn-text-accent);
    background: var(--rn-bg-accent-soft);
    border-radius: var(--rn-radius-sm);
    font-size: var(--rn-font-size-section);
}

.tss-renewal.rn-content-page--admin .board-admin-directory .card-title {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    margin: 0 !important;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-body);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-content-page--admin .board-admin-directory .card-text {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-content-page--admin .board-admin-directory .card-body > .btn {
    grid-column: 3;
    grid-row: 1 / span 2;
    min-width: 64px;
}

.tss-renewal.rn-content-page :where(.modal-content, .dropdown-menu) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-elevated);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.rn-content-page :where(.modal-header, .modal-footer) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-elevated) !important;
    border-color: var(--rn-border-default) !important;
}

.tss-renewal.rn-content-page .text-muted {
    color: var(--rn-text-secondary) !important;
}

@media (max-width: 991.98px) {
    body.tss-renewal.rn-content-page > main.container,
    .tss-renewal.rn-content-page--admin .super-admin-main {
        padding: var(--rn-space-5) !important;
    }

    .tss-renewal.rn-content-page .doc-lib-body {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-content-page .doc-lib-sidebar {
        position: static;
        display: none;
    }

    .tss-renewal.rn-content-page .doc-lib-sidebar.is-open {
        display: block;
    }

    .tss-renewal.rn-content-page--admin .row:has(.stat-card) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-content-page--admin .row:has(.stat-card) > [class*="col-"]:nth-child(odd) .stat-card {
        border-left: 0;
    }

    .tss-renewal.rn-content-page--admin .row:has(.stat-card) > [class*="col-"]:nth-child(n + 3) .stat-card {
        border-top: 1px solid var(--rn-border-default);
    }
}

@media (max-width: 767.98px) {
    body.tss-renewal.rn-content-page > main.container,
    .tss-renewal.rn-content-page--admin .super-admin-main {
        padding: var(--rn-space-4) !important;
    }

    .tss-renewal.rn-content-page .bd-page-hero,
    .tss-renewal.rn-content-page .wb-page-header,
    .tss-renewal.rn-content-page .doc-lib-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 0 0 var(--rn-space-4);
    }

    .tss-renewal.rn-content-page :where(.bd-title, .wb-page-title, .doc-lib-title) {
        font-size: var(--rn-font-size-section);
        line-height: var(--rn-line-height-section);
    }

    .tss-renewal.rn-content-page .doc-lib-search {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-content-page .doc-lib-search-btn {
        width: 100%;
    }

    .tss-renewal.rn-content-page :where(.bd-card .card-body, .bd-post-content-card .card-body, .bd-post-form-card .card-body, .doc-lib-panel-body) {
        padding: var(--rn-space-4);
    }

    .tss-renewal.rn-content-page .bd-post-list-row {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas:
            "title title"
            "author date"
            "stats stats";
        gap: var(--rn-space-1) var(--rn-space-2);
        min-height: 72px;
    }

    .tss-renewal.rn-content-page .bd-post-list-no {
        display: none;
    }

    .tss-renewal.rn-content-page .bd-post-list-title { grid-area: title; }
    .tss-renewal.rn-content-page .bd-post-list-author { grid-area: author; }
    .tss-renewal.rn-content-page .bd-post-list-date { grid-area: date; text-align: right; }
    .tss-renewal.rn-content-page .bd-post-list-stats { grid-area: stats; }

    .tss-renewal.rn-content-page .doc-preview-list {
        min-width: 560px;
    }

    .tss-renewal.rn-content-page .doc-list-col-folder,
    .tss-renewal.rn-content-page .doc-list-col-size {
        display: none;
    }

    .tss-renewal.rn-content-page--admin .row:has(.stat-card) {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-content-page--admin .stat-card {
        border-top: 1px solid var(--rn-border-default);
        border-left: 0;
    }

    .tss-renewal.rn-content-page--admin .row:has(.stat-card) > [class*="col-"]:first-child .stat-card {
        border-top: 0;
    }

    .tss-renewal.rn-content-page :where(.doc-lib-actions, .bd-post-toolbar, .wb-detail-toolbar) {
        align-items: stretch;
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-content-page--admin .board-admin-directory .card-body {
        grid-template-columns: 40px minmax(0, 1fr);
        min-height: 96px;
    }

    .tss-renewal.rn-content-page--admin .board-admin-directory .card-body > .btn {
        grid-column: 2;
        grid-row: 3;
        justify-self: start;
        min-height: var(--rn-control-sm);
        margin-top: var(--rn-space-2);
    }

    body.tss-renewal.rn-content-page > main.container,
    .tss-renewal.rn-content-page--admin .super-admin-main {
        padding: var(--rn-space-3) !important;
    }

    .tss-renewal.rn-content-page .bd-board-card {
        grid-template-columns: 36px minmax(0, 1fr) auto;
        padding: var(--rn-space-3);
    }

    .tss-renewal.rn-content-page .bd-board-card__icon {
        width: 32px;
        height: 32px;
    }

    .tss-renewal.rn-content-page .doc-preview-list {
        min-width: 480px;
    }

    .tss-renewal.rn-content-page .doc-list-col-date {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tss-renewal.rn-content-page :where(.bd-board-card, .bd-post-list-row, .wb-post-card, .doc-list-row, .ts-ref-card) {
        transition: none;
    }
}

/* bundled: operations.css */
/**
 * TSS UI/UX Step 9 — 요청접수·자원예약·차량 운영 화면.
 *
 * Figma references
 * - Ticket workspace 105:1171
 * - Reservation calendar 110:1392
 * - User reservation list 112:1064
 * - Meeting-room status 112:1291
 * - Admin vehicle workspace 119:1494
 * - Admin ticket list 122:1149
 *
 * 기존 URL, 권한, DOM ID와 JavaScript 이벤트는 변경하지 않는다. 반복 데이터만
 * 카드에서 연결형 행으로 평면화하고, 폼·상세·캘린더·모달에는 의미 경계를 남긴다.
 */

/* --------------------------------------------------------------------------
   Shared operations canvas
   -------------------------------------------------------------------------- */

.tss-renewal.rn-operations-page {
    color: var(--rn-text-primary);
    background: var(--rn-bg-canvas);
}

.tss-renewal.rn-operations-page main.container {
    width: min(100%, var(--rn-content-max));
    max-width: var(--rn-content-max);
    margin-inline: auto;
    padding-inline: var(--rn-space-page);
}

.tss-renewal.rn-operations-page :where(
    .tickets-page-inner,
    .vehicle-page,
    .vehicle-admin-panel,
    .ticket-admin-panel,
    .ticket-delegation-admin,
    .mrs-page
) {
    width: 100%;
    max-width: none;
    color: var(--rn-text-primary);
    font-family: var(--rn-font-sans);
}

.tss-renewal.rn-operations-page :where(.bd-page-hero, .help-page-header) {
    min-height: auto;
    margin: 0 0 var(--rn-space-6);
    padding: 0 0 var(--rn-space-5);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page :where(.bd-title, .help-page-header h1, .help-page-header h2) {
    margin: 0;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    font-weight: var(--rn-font-weight-bold);
    letter-spacing: var(--rn-letter-spacing-display);
    line-height: var(--rn-line-height-display);
}

.tss-renewal.rn-operations-page :where(.text-muted, .form-text, .small) {
    color: var(--rn-text-muted) !important;
}

.tss-renewal.rn-operations-page :where(.form-control, .form-select) {
    min-height: var(--rn-control-md);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
    box-shadow: none;
}

.tss-renewal.rn-operations-page :where(.form-control, .form-select):focus {
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) var(--rn-accent-soft);
}

.tss-renewal.rn-operations-page :where(.btn, .mrs-btn, .td-tab, .ticket-tab) {
    min-height: var(--rn-control-md);
    border-radius: var(--rn-radius-sm);
    font-weight: var(--rn-font-weight-medium);
    box-shadow: none;
}

.tss-renewal.rn-operations-page :where(.modal-content, .offcanvas) {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-elevated);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.rn-operations-page :where(.modal-header, .modal-footer) {
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-operations-page :where(.alert) {
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

/* --------------------------------------------------------------------------
   User ticket workspace — flat 64px rows, meaningful work surfaces only
   -------------------------------------------------------------------------- */

.tss-renewal.rn-operations-page .tickets-panel {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page .ticket-tabs {
    display: flex;
    gap: 0;
    overflow-x: auto;
    margin: 0;
    padding: 0 var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: var(--rn-bg-section);
    box-shadow: none;
    scrollbar-width: thin;
}

.tss-renewal.rn-operations-page .ticket-tab {
    flex: 0 0 auto;
    min-height: 52px;
    padding: 0 var(--rn-space-4);
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--rn-text-secondary);
    background: transparent;
}

.tss-renewal.rn-operations-page .ticket-tab:hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-hover);
}

.tss-renewal.rn-operations-page .ticket-tab.is-active {
    border-bottom-color: var(--rn-accent);
    color: var(--rn-text-accent);
    background: transparent;
}

.tss-renewal.rn-operations-page .ticket-tab-panel {
    padding: 0;
}

.tss-renewal.rn-operations-page .ticket-workspace {
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page .ticket-workspace__head {
    margin: 0;
    padding: var(--rn-space-6);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-operations-page .ticket-workspace__title {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-section);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-operations-page .ticket-workspace__lead {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-operations-page .tickets-stats-wrap {
    margin: 0;
    padding: var(--rn-space-4) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-operations-page .tickets-stats-wrap :where(.row, .tickets-stats, #queueInfo) {
    margin: 0;
    gap: 0;
}

.tss-renewal.rn-operations-page .tickets-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .tickets-stat-card {
    min-height: 68px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-5);
    border: 0;
    border-top: 0 !important;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page .tickets-stat-card:last-child {
    border-right: 0;
}

.tss-renewal.rn-operations-page .tickets-stat-card:hover,
.tss-renewal.rn-operations-page .tickets-stat-card.is-active {
    background: var(--rn-bg-hover);
    transform: none;
    box-shadow: inset 0 -2px 0 var(--rn-accent);
}

.tss-renewal.rn-operations-page .tickets-stat-card__label {
    color: var(--rn-text-muted);
}

.tss-renewal.rn-operations-page .tickets-stat-card__value {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-operations-page .tickets-stats-wrap :where(.card, .stat-card, .ticket-stat-card) {
    min-height: 62px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-5);
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page .tickets-search {
    margin: 0;
    padding: var(--rn-space-4) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .ticket-inbox-toolbar {
    display: flex;
    align-items: end;
    gap: var(--rn-space-3);
}

.tss-renewal.rn-operations-page .ticket-inbox-toolbar__search {
    flex: 1 1 420px;
}

.tss-renewal.rn-operations-page .ticket-inbox-toolbar__filter {
    display: flex;
    align-items: center;
    gap: var(--rn-space-2);
}

.tss-renewal.rn-operations-page .ticket-inbox-scopes {
    display: inline-flex;
    overflow: hidden;
    gap: 0;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-operations-page .ticket-inbox-scope {
    min-height: var(--rn-control-md);
    padding-inline: var(--rn-space-3);
    border: 0;
    border-right: 1px solid var(--rn-border-default);
    border-radius: 0;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-input);
}

.tss-renewal.rn-operations-page .ticket-inbox-scope:last-child {
    border-right: 0;
}

.tss-renewal.rn-operations-page .ticket-inbox-scope.is-active {
    color: var(--rn-text-accent);
    background: var(--rn-bg-selected);
}

.tss-renewal.rn-operations-page .ticket-card-list {
    display: block;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .ticket-card {
    display: grid;
    grid-template-columns: minmax(190px, 25%) minmax(0, 1fr) auto;
    grid-template-areas:
        "top title actions"
        "assignee desc actions"
        "meta desc actions"
        "detail detail detail";
    column-gap: var(--rn-space-5);
    align-items: center;
    min-height: 88px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-5);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
    transition: background var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.rn-operations-page .ticket-card:hover,
.tss-renewal.rn-operations-page .ticket-card.is-open {
    background: var(--rn-bg-hover);
    transform: none;
    box-shadow: inset 3px 0 0 var(--rn-accent);
}

.tss-renewal.rn-operations-page .ticket-card:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-operations-page .ticket-card__top,
.tss-renewal.rn-operations-page .ticket-card__meta,
.tss-renewal.rn-operations-page .ticket-card__actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--rn-space-2);
}

.tss-renewal.rn-operations-page .ticket-card__top {
    grid-area: top;
}

.tss-renewal.rn-operations-page .ticket-card__assignee {
    grid-area: assignee;
}

.tss-renewal.rn-operations-page .ticket-card__desc {
    grid-area: desc;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.tss-renewal.rn-operations-page .ticket-card__meta {
    grid-area: meta;
}

.tss-renewal.rn-operations-page .ticket-card__actions {
    grid-area: actions;
}

.tss-renewal.rn-operations-page .ticket-card__title {
    grid-area: title;
    margin: var(--rn-space-1) 0;
    overflow: hidden;
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-card);
    font-weight: var(--rn-font-weight-bold);
    line-height: var(--rn-line-height-card);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tss-renewal.rn-operations-page :where(.ticket-card__desc, .ticket-card__meta, .ticket-card__assignee, .ticket-card__requester) {
    margin: 0;
    color: var(--rn-text-muted);
    font-size: var(--rn-font-size-compact);
}

.tss-renewal.rn-operations-page .ticket-card__detail-slot {
    grid-area: detail;
}

.tss-renewal.rn-operations-page .ticket-card-detail {
    border-top: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-operations-page .ticket-compose-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 340px);
    gap: 0;
}

.tss-renewal.rn-operations-page .ticket-compose-form {
    padding: var(--rn-space-6);
    border-right: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-operations-page .ticket-compose-block {
    margin: 0;
    padding: var(--rn-space-5) 0;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page .ticket-compose-block:first-child {
    padding-top: 0;
}

.tss-renewal.rn-operations-page .ticket-compose-block:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-operations-page .ticket-compose-step {
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
}

.tss-renewal.rn-operations-page .ticket-completed-hints {
    margin: 0;
    padding: var(--rn-space-6);
    border: 0;
    border-radius: 0;
    background: var(--rn-bg-section);
}

/* --------------------------------------------------------------------------
   Admin tickets and delegation — connected directory/list
   -------------------------------------------------------------------------- */

.tss-renewal.rn-operations-page--admin .admin-tickets-list__filter,
.tss-renewal.rn-operations-page--admin .td-form-grid {
    margin-bottom: var(--rn-space-4) !important;
    padding: var(--rn-space-4) !important;
    border: 1px solid var(--rn-border-default) !important;
    border-radius: var(--rn-radius-md) !important;
    background: var(--rn-bg-section) !important;
}

.tss-renewal.rn-operations-page--admin .admin-tickets-list__filter .form-label {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-operations-page--admin .admin-tickets-list__toolbar {
    display: flex;
    justify-content: flex-end;
    gap: var(--rn-space-2);
}

.tss-renewal.rn-operations-page--admin :where(.admin-tickets-list__table-wrap, .ts-ref-list) {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page--admin .admin-tickets-list__table-wrap .ts-ref-list {
    border: 0;
    border-radius: 0;
}

.tss-renewal.rn-operations-page--admin .ts-ref-card {
    display: flex;
    align-items: center;
    min-height: 68px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-4);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page--admin .ts-ref-card:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-operations-page--admin .ts-ref-card:hover {
    background: var(--rn-bg-hover);
    transform: none;
    box-shadow: inset 3px 0 0 var(--rn-accent);
}

.tss-renewal.rn-operations-page--admin .ts-ref-card__content {
    min-width: 0;
}

.tss-renewal.rn-operations-page--admin .ts-ref-card__name {
    color: var(--rn-text-primary);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-operations-page--admin .ts-ref-card__description,
.tss-renewal.rn-operations-page--admin .ts-ref-card__date {
    color: var(--rn-text-muted);
}

.tss-renewal.rn-operations-page--admin .td-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page--admin .td-summary article {
    min-height: 78px;
    padding: var(--rn-space-4) var(--rn-space-5);
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page--admin .td-summary article:last-child {
    border-right: 0;
}

.tss-renewal.rn-operations-page--admin .td-tabs {
    gap: 0;
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-operations-page--admin .td-tab {
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--rn-text-secondary);
    background: transparent;
}

.tss-renewal.rn-operations-page--admin .td-tab.is-active {
    border-bottom-color: var(--rn-accent);
    color: var(--rn-text-accent);
    background: transparent;
}

.tss-renewal.rn-operations-page--admin .td-notice {
    border-color: var(--rn-accent);
    color: var(--rn-text-primary);
    background: var(--rn-accent-soft);
}

.tss-renewal.rn-operations-page--admin .td-panel > .card,
.tss-renewal.rn-operations-page--admin .ticket-admin-detail :where(.card, .ticket-admin-detail__content-card),
.tss-renewal.rn-operations-page--admin .ticket-processing-card {
    border: 1px solid var(--rn-border-default) !important;
    border-radius: var(--rn-radius-lg) !important;
    background: var(--rn-bg-surface) !important;
    box-shadow: none !important;
}

/* --------------------------------------------------------------------------
   Vehicle reservation list/calendar and admin vehicle directory
   -------------------------------------------------------------------------- */

.tss-renewal.rn-operations-page .vehicle-page > .container {
    max-width: none;
    padding: 0;
}

.tss-renewal.rn-operations-page :where(.view-toggle, .resource-reservation-tabs, .rr-resource-tabs) {
    display: flex;
    gap: 0;
    overflow-x: auto;
    margin-bottom: var(--rn-space-4);
    padding: 0;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page :where(
    .view-toggle .btn-view,
    .resource-reservation-tabs .nav-link,
    .rr-resource-tabs__item
) {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0 var(--rn-space-4);
    border: 0 !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    color: var(--rn-text-secondary) !important;
    background: transparent !important;
    box-shadow: none !important;
}

.tss-renewal.rn-operations-page :where(
    .view-toggle .btn-view.active,
    .resource-reservation-tabs .nav-link.active,
    .rr-resource-tabs__item.is-active
) {
    border-bottom-color: var(--rn-accent) !important;
    color: var(--rn-text-accent) !important;
    background: transparent !important;
}

.tss-renewal.rn-operations-page .table-responsive {
    overflow: auto;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .table-reservations {
    min-width: 920px;
    margin: 0;
    border: 0;
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .table-reservations > :not(caption) > * > * {
    padding: var(--rn-space-3) var(--rn-space-4);
    border-width: 0 0 1px;
    border-color: var(--rn-border-default);
    color: inherit;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page .table-reservations thead th {
    height: 42px;
    color: var(--rn-text-muted);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-bold);
    letter-spacing: var(--rn-letter-spacing-label);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-operations-page .table-reservations tbody tr {
    height: 76px;
}

.tss-renewal.rn-operations-page .table-reservations tbody tr:hover {
    background: var(--rn-bg-hover);
}

.tss-renewal.rn-operations-page :where(.filter-section, .ts-ref-filter) {
    margin-bottom: var(--rn-space-4) !important;
    padding: var(--rn-space-4) !important;
    border: 1px solid var(--rn-border-default) !important;
    border-radius: var(--rn-radius-md) !important;
    background: var(--rn-bg-section) !important;
    box-shadow: none !important;
}

.tss-renewal.rn-operations-page .vh-calendar-wrap {
    overflow: hidden;
    padding: var(--rn-space-4);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page .fc {
    --fc-border-color: var(--rn-border-default);
    --fc-page-bg-color: var(--rn-bg-surface);
    --fc-neutral-bg-color: var(--rn-bg-subtle);
    --fc-list-event-hover-bg-color: var(--rn-bg-hover);
    --fc-today-bg-color: var(--rn-accent-soft);
    color: var(--rn-text-primary);
}

.tss-renewal.rn-operations-page .fc .fc-button {
    border-color: var(--rn-border-strong);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-primary);
    background: var(--rn-bg-input);
    box-shadow: none;
}

.tss-renewal.rn-operations-page .fc .fc-button-primary:not(:disabled).fc-button-active,
.tss-renewal.rn-operations-page .fc .fc-button-primary:not(:disabled):active {
    border-color: var(--rn-accent);
    color: var(--rn-accent-contrast);
    background: var(--rn-accent);
}

.tss-renewal.rn-operations-page--admin .vehicle-admin-panel .form-container {
    max-width: 860px;
    margin-inline: auto;
    padding: var(--rn-space-6);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page--admin .vehicle-admin-panel .stats-kpi-card {
    min-height: 84px;
    margin: 0;
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    background: var(--rn-bg-surface);
    box-shadow: none;
}

/* --------------------------------------------------------------------------
   Meeting-room availability — desktop workspace, stacked mobile flow
   -------------------------------------------------------------------------- */

.tss-renewal.rn-operations-page .mrs-page {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .mrs-hero {
    margin: 0;
    padding: var(--rn-space-6);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: var(--rn-bg-section);
    box-shadow: none;
}

.tss-renewal.rn-operations-page .mrs-hero__title {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-operations-page a.mrs-btn--primary {
    /* 전역 Dark 링크 규칙이 강조 버튼 글씨까지 파랗게 덮지 않도록 한다. */
    color: var(--tss-accent-contrast) !important;
}

.tss-renewal.rn-operations-page .mrs-hero__desc,
.tss-renewal.rn-operations-page .mrs-panel__sub {
    color: var(--rn-text-muted);
}

.tss-renewal.rn-operations-page .mrs-toolbar {
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-5);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-operations-page .mrs-room-grid {
    display: grid;
    grid-template-columns: minmax(240px, 320px);
    grid-auto-rows: minmax(72px, auto);
    gap: 0;
    float: left;
    width: 30%;
    min-width: 280px;
    padding: 0;
    border-right: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-operations-page .mrs-room-card {
    min-height: 72px;
    margin: 0;
    padding: var(--rn-space-3) var(--rn-space-4);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-operations-page .mrs-room-card:hover,
.tss-renewal.rn-operations-page .mrs-room-card.is-selected {
    background: var(--rn-bg-selected);
    transform: none;
    box-shadow: inset 3px 0 0 var(--rn-accent);
}

.tss-renewal.rn-operations-page .mrs-room-card__name {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-operations-page .mrs-room-card__meta {
    color: var(--rn-text-muted);
}

.tss-renewal.rn-operations-page .mrs-detail {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 32%);
    gap: 0;
    min-height: 420px;
    margin: 0 0 0 30%;
}

.tss-renewal.rn-operations-page .mrs-panel {
    margin: 0;
    padding: var(--rn-space-5);
    border: 0;
    border-right: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page .mrs-panel:last-child {
    border-right: 0;
    background: var(--rn-bg-section);
}

.tss-renewal.rn-operations-page .mrs-event {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: var(--rn-space-4);
    min-height: 60px;
    padding: var(--rn-space-3) 0;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
}

/* Standalone meeting-room display keeps its purpose-built structure. */
.tss-renewal.rn-operations-page--stand .mrs-stand__board,
.tss-renewal.rn-operations-page--stand .mrs-stand__events {
    border-color: var(--rn-border-default);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-operations-page--stand .mrs-stand__event {
    border-radius: var(--rn-radius-sm);
}

/* --------------------------------------------------------------------------
   Responsive contracts — verified target: 390px
   -------------------------------------------------------------------------- */

@media (max-width: 991.98px) {
    .tss-renewal.rn-operations-page .ticket-compose-layout {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-operations-page .ticket-compose-form {
        border-right: 0;
        border-bottom: 1px solid var(--rn-border-default);
    }

    .tss-renewal.rn-operations-page .ticket-inbox-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .tss-renewal.rn-operations-page .ticket-inbox-toolbar__search {
        flex-basis: auto;
    }

    .tss-renewal.rn-operations-page .mrs-room-grid {
        float: none;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        min-width: 0;
        border-right: 0;
        border-bottom: 1px solid var(--rn-border-default);
    }

    .tss-renewal.rn-operations-page .mrs-detail {
        margin-left: 0;
    }
}

@media (max-width: 767.98px) {
    .tss-renewal.rn-operations-page main.container {
        padding-inline: var(--rn-space-mobile);
    }

    .tss-renewal.rn-operations-page .ticket-card {
        display: flex;
        align-items: stretch;
        flex-direction: column;
        gap: var(--rn-space-2);
        min-height: 96px;
        padding: var(--rn-space-4);
    }

    .tss-renewal.rn-operations-page .tickets-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-operations-page .tickets-stat-card:nth-child(2) {
        border-right: 0;
    }

    .tss-renewal.rn-operations-page .tickets-stat-card:nth-child(-n + 2) {
        border-bottom: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-operations-page .ticket-card__title {
        white-space: normal;
    }

    .tss-renewal.rn-operations-page--admin .td-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-operations-page--admin .td-summary article:nth-child(2) {
        border-right: 0;
    }

    .tss-renewal.rn-operations-page--admin .td-summary article:nth-child(-n + 2) {
        border-bottom: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-operations-page--admin .ts-ref-card {
        align-items: stretch;
        flex-direction: column;
        gap: var(--rn-space-3);
        min-height: 112px;
    }

    .tss-renewal.rn-operations-page--admin .ts-ref-card__aside {
        width: 100%;
    }

    .tss-renewal.rn-operations-page .table-responsive {
        overflow: visible;
        border: 0;
        border-radius: 0;
    }

    .tss-renewal.rn-operations-page .table-reservations {
        display: block;
        min-width: 0;
        border: 1px solid var(--rn-border-default);
        border-radius: var(--rn-radius-lg);
    }

    .tss-renewal.rn-operations-page .table-reservations thead {
        display: none;
    }

    .tss-renewal.rn-operations-page .table-reservations tbody,
    .tss-renewal.rn-operations-page .table-reservations tr,
    .tss-renewal.rn-operations-page .table-reservations td {
        display: block;
        width: 100%;
    }

    .tss-renewal.rn-operations-page .table-reservations tbody tr {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        height: auto;
        min-height: 126px;
        padding: var(--rn-space-3) var(--rn-space-4);
        border-bottom: 1px solid var(--rn-border-default);
    }

    .tss-renewal.rn-operations-page .table-reservations tbody tr:last-child {
        border-bottom: 0;
    }

    .tss-renewal.rn-operations-page .table-reservations tbody td {
        padding: var(--rn-space-1) var(--rn-space-2);
        border: 0;
    }

    .tss-renewal.rn-operations-page .mrs-room-grid,
    .tss-renewal.rn-operations-page .mrs-detail {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-operations-page .mrs-panel {
        border-right: 0;
        border-bottom: 1px solid var(--rn-border-default);
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-operations-page .help-page-header__main {
        flex: 0 0 auto;
        width: 100%;
    }
    .tss-renewal.rn-operations-page :where(.bd-page-hero, .help-page-header, .mrs-hero) {
        align-items: flex-start;
        flex-direction: column;
        gap: var(--rn-space-3);
    }

    .tss-renewal.rn-operations-page .ticket-tabs {
        padding-inline: var(--rn-space-2);
    }

    .tss-renewal.rn-operations-page .ticket-tab {
        padding-inline: var(--rn-space-3);
    }

    .tss-renewal.rn-operations-page .ticket-inbox-toolbar__filter {
        align-items: stretch;
        flex-direction: column;
    }

    .tss-renewal.rn-operations-page .ticket-inbox-toolbar__search .input-group {
        flex-wrap: wrap;
        gap: .375rem;
    }

    .tss-renewal.rn-operations-page .ticket-inbox-toolbar__search .input-group .form-control {
        flex: 1 1 100%;
        width: 100%;
        border-radius: var(--radius-md);
    }

    .tss-renewal.rn-operations-page .ticket-inbox-toolbar__filter .form-select {
        flex: 0 0 auto;
        width: 100%;
        min-width: 0;
    }

    .tss-renewal.rn-operations-page .ticket-inbox-scopes {
        width: 100%;
        flex-wrap: wrap;
        overflow-x: visible;
    }

    .tss-renewal.rn-operations-page .ticket-inbox-scope {
        flex: 1 1 7rem;
        white-space: normal;
    }

    .tss-renewal.rn-operations-page .ticket-compose-form,
    .tss-renewal.rn-operations-page .ticket-completed-hints,
    .tss-renewal.rn-operations-page .mrs-hero,
    .tss-renewal.rn-operations-page .mrs-panel {
        padding: var(--rn-space-4);
    }

    .tss-renewal.rn-operations-page .vh-calendar-wrap {
        padding: var(--rn-space-2);
    }

    .tss-renewal.rn-operations-page .fc .fc-toolbar {
        align-items: stretch;
        flex-direction: column;
        gap: var(--rn-space-2);
    }

    .tss-renewal.rn-operations-page .mrs-event {
        grid-template-columns: 1fr;
        gap: var(--rn-space-1);
    }
}

@media (prefers-reduced-motion: reduce) {
    .tss-renewal.rn-operations-page *,
    .tss-renewal.rn-operations-page *::before,
    .tss-renewal.rn-operations-page *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}

/* bundled: analytics.css */
/**
 * TSS UI/UX Step 10 — 재무·통계·업무 대시보드.
 *
 * Figma references
 * - Finance dashboard 122:1589
 * - Finance voucher review 122:1848
 * - CRM sales dashboard 95:1385
 * - TS sales report 99:1181
 * - Admin dashboard 115:1064
 *
 * 집계·승인·최종확정·다운로드·권한 계약은 유지한다. 반복 KPI 카드는 연결형
 * 요약 스트립으로, 분절된 차트 카드는 하나의 분석 작업면으로 정돈한다.
 */

/* Shared analytics canvas ------------------------------------------------- */

.tss-renewal.rn-analytics-page {
    color: var(--rn-text-primary);
    background: var(--rn-bg-canvas);
    font-family: var(--rn-font-sans);
}

.tss-renewal.rn-analytics-page main.container {
    width: min(100%, var(--rn-content-max));
    max-width: var(--rn-content-max);
    margin-inline: auto;
    padding-inline: var(--rn-space-page);
}

.tss-renewal.rn-analytics-page :where(.text-muted, .form-text, .small) {
    color: var(--rn-text-muted) !important;
}

.tss-renewal.rn-analytics-page :where(.form-control, .form-select) {
    min-height: var(--rn-control-md);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :where(.form-control, .form-select):focus {
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) var(--rn-accent-soft);
}

.tss-renewal.rn-analytics-page :where(.btn, button) {
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :where(.btn-primary, .btn-tss-primary) {
    border-color: var(--rn-accent);
    color: var(--rn-accent-contrast);
    background: var(--rn-accent);
}

.tss-renewal.rn-analytics-page :where(.modal-content, .offcanvas) {
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-elevated);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.rn-analytics-page :where(.modal-header, .modal-footer) {
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-analytics-page :where(.table) {
    --bs-table-color: var(--rn-text-primary);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--rn-border-default);
    color: var(--rn-text-primary);
}

.tss-renewal.rn-analytics-page :where(.table) > :not(caption) > * > * {
    min-height: 54px;
    padding: var(--rn-space-3) var(--rn-space-4);
    border-color: var(--rn-border-default);
    background: transparent;
    box-shadow: none;
    vertical-align: middle;
}

.tss-renewal.rn-analytics-page :where(.table thead th) {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-medium);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page :where(.table tbody tr:hover > *) {
    background: var(--rn-bg-hover);
}

/* Finance dashboard — Figma 122:1589 ------------------------------------ */

.tss-renewal.rn-analytics-page .fd-page {
    width: 100%;
    max-width: none;
    color: var(--rn-text-primary);
}

.tss-renewal.rn-analytics-page .fd-header {
    gap: var(--rn-space-5);
    margin-bottom: var(--rn-space-6);
    padding-bottom: var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-analytics-page .fd-title {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
    letter-spacing: var(--rn-letter-spacing-display);
}

.tss-renewal.rn-analytics-page .fd-lead {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-analytics-page :where(.fd-controls, .fd-presets, .fd-dates) {
    gap: var(--rn-space-2);
}

.tss-renewal.rn-analytics-page .fd-pill {
    min-height: var(--rn-control-md);
    border-color: var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .fd-pill:hover,
.tss-renewal.rn-analytics-page .fd-pill.is-active {
    border-color: var(--rn-accent);
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
}

.tss-renewal.rn-analytics-page .fd-card {
    overflow: hidden;
    margin-bottom: var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .fd-card-header {
    min-height: 54px;
    padding: var(--rn-space-3) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page .fd-icon-badge {
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
}

.tss-renewal.rn-analytics-page .fd-summary-card .fd-card-body {
    padding: 0;
}

.tss-renewal.rn-analytics-page .fd-kpi-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}

.tss-renewal.rn-analytics-page .fd-kpi-card {
    min-height: 86px;
    padding: var(--rn-space-4) var(--rn-space-5);
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .fd-kpi-card:last-child {
    border-right: 0;
}

.tss-renewal.rn-analytics-page .fd-kpi-label {
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
}

.tss-renewal.rn-analytics-page .fd-kpi-value {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-kpi);
    line-height: var(--rn-line-height-kpi);
}

.tss-renewal.rn-analytics-page :where(.fd-card-body, .fd-table-wrap, .fd-pager) {
    border-color: var(--rn-border-default);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .fd-chart {
    min-height: 310px;
}

.tss-renewal.rn-analytics-page .fd-chart-track,
.tss-renewal.rn-analytics-page .fd-dist-track {
    background: var(--rn-bg-subtle);
}

.tss-renewal.rn-analytics-page .fd-chart-bar,
.tss-renewal.rn-analytics-page .fd-dist-fill {
    background: var(--rn-accent);
}

.tss-renewal.rn-analytics-page .fd-dist-row {
    min-height: 54px;
    padding-block: var(--rn-space-3);
    border-bottom: 1px solid var(--rn-border-subtle);
}

/* Finance review and payment execution — Figma 122:1848 ----------------- */

.tss-renewal.rn-analytics-page .finance-review-page {
    width: 100%;
    max-width: none;
}

.tss-renewal.rn-analytics-page .finance-review-page > .approval-page-header {
    margin-bottom: var(--rn-space-6) !important;
    padding-bottom: var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-analytics-page .finance-review-page > .approval-page-header h2 {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
}

.tss-renewal.rn-analytics-page :where(.approval-section-card, .finance-review-section) {
    overflow: hidden;
    margin-bottom: var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :where(.approval-section-header, .finance-review-section__header) {
    min-height: 54px;
    padding: var(--rn-space-3) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page .approval-section-body {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .finance-review-count {
    border-color: var(--rn-status-info-border);
    color: var(--rn-text-accent);
    background: var(--rn-status-info-soft);
}

.tss-renewal.rn-analytics-page :where(.finance-review-table-wrap, .table-responsive) {
    border-color: var(--rn-border-default);
    scrollbar-color: var(--rn-border-strong) var(--rn-bg-subtle);
}

.tss-renewal.rn-analytics-page .finance-review-table tbody tr {
    min-height: 54px;
    border-bottom: 1px solid var(--rn-border-default);
    background: transparent;
}

.tss-renewal.rn-analytics-page .finance-review-table tbody tr.is-selected,
.tss-renewal.rn-analytics-page .finance-review-table tbody tr.selected {
    box-shadow: inset 3px 0 0 var(--rn-accent);
    background: var(--rn-bg-selected);
}

.tss-renewal.rn-analytics-page :where(.finance-history-toolbar, .finance-review-workflow) {
    border-color: var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page .finance-history-filter {
    min-height: var(--rn-control-sm);
    border: 1px solid var(--rn-border-default);
    color: var(--rn-text-secondary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .finance-history-filter.is-active {
    border-color: var(--rn-accent);
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
}

.tss-renewal.rn-analytics-page .finance-review-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .finance-review-summary__item {
    min-height: 76px;
    padding: var(--rn-space-3) var(--rn-space-4);
    border-right: 1px solid var(--rn-divider);
    background: transparent;
}

.tss-renewal.rn-analytics-page .finance-review-summary__item:last-child {
    border-right: 0;
}

.tss-renewal.rn-analytics-page :where(.finance-review-summary__label, .finance-review-section__guide) {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-analytics-page .finance-review-summary__value {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-analytics-page .pa-page {
    width: 100%;
    max-width: none;
    color: var(--rn-text-primary);
}

.tss-renewal.rn-analytics-page .pa-header {
    margin-bottom: var(--rn-space-6);
    padding-bottom: var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-analytics-page .pa-title {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
    letter-spacing: var(--rn-letter-spacing-display);
}

.tss-renewal.rn-analytics-page :where(.pa-lead, .pa-hint, .pa-filter-context) {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-analytics-page .pa-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    margin-bottom: var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .pa-tab {
    min-height: 68px;
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-secondary);
    background: transparent;
}

.tss-renewal.rn-analytics-page .pa-tab:last-child {
    border-right: 0;
}

.tss-renewal.rn-analytics-page .pa-tab.is-active {
    color: var(--rn-text-accent);
    background: var(--rn-bg-selected);
    box-shadow: inset 0 -2px 0 var(--rn-accent);
}

.tss-renewal.rn-analytics-page .pa-card {
    overflow: hidden;
    margin-bottom: var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .pa-card-header {
    min-height: 54px;
    padding: var(--rn-space-3) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page .pa-card-body {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .pa-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    overflow: hidden;
    margin-bottom: var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .pa-summary {
    min-height: 86px;
    padding: var(--rn-space-4) var(--rn-space-5);
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .pa-summary:last-child {
    border-right: 0;
}

.tss-renewal.rn-analytics-page .pa-summary__label {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-analytics-page .pa-summary__value {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-analytics-page .pa-table-wrap {
    overflow-x: auto;
    border-color: var(--rn-border-default);
    scrollbar-color: var(--rn-border-strong) var(--rn-bg-subtle);
}

.tss-renewal.rn-analytics-page :where(.pa-chip, .pa-tab__count) {
    border-color: var(--rn-status-info-border);
    color: var(--rn-text-accent);
    background: var(--rn-status-info-soft);
}

/* TS dashboards and reports — Figma 95:1385, 99:1181 ------------------- */

.tss-renewal.rn-analytics-page--ts .content {
    color: var(--rn-text-primary);
    background: var(--rn-bg-canvas);
}

.tss-renewal.rn-analytics-page :is(.ts-page-header, .dashboard-header) {
    min-height: auto;
    margin-bottom: var(--rn-space-6);
    padding: 0 0 var(--rn-space-5);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :is(.ts-page-title, .dashboard-title) {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
    letter-spacing: var(--rn-letter-spacing-display);
}

.tss-renewal.rn-analytics-page :is(.ts-page-subtitle, .sr-selected-period-badge__label) {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-analytics-page :is(.sr-selected-period-badge, .selected-period-badge) {
    min-height: 62px;
    margin-bottom: var(--rn-space-4);
    padding: var(--rn-space-3) var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    color: var(--rn-text-primary);
    background: var(--rn-bg-subtle);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :is(.sr-filter-panel, .filter-panel) {
    overflow: hidden;
    margin-bottom: var(--rn-space-5);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :is(.sr-filter-panel-header, .filter-panel-header) {
    min-height: 52px;
    padding: var(--rn-space-3) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page :is(.sr-filter-panel-body, .filter-panel-body) {
    padding: var(--rn-space-4) var(--rn-space-5);
}

.tss-renewal.rn-analytics-page .sr-kpi-row,
.tss-renewal.rn-analytics-page--ts .row.g-4.mb-5 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0 !important;
    overflow: hidden;
    margin: 0 0 var(--rn-space-5) !important;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .sr-kpi-row > [class*="col-"],
.tss-renewal.rn-analytics-page--ts .row.g-4.mb-5 > [class*="col-"] {
    width: auto;
    max-width: none;
    padding: 0;
}

.tss-renewal.rn-analytics-page :is(.sr-kpi-card, .kpi-card) {
    min-height: 104px;
    margin: 0;
    padding: var(--rn-space-4) var(--rn-space-5) !important;
    border: 0 !important;
    border-right: 1px solid var(--rn-divider) !important;
    border-radius: 0 !important;
    color: var(--rn-text-primary);
    background: transparent !important;
    box-shadow: none !important;
}

.tss-renewal.rn-analytics-page .sr-kpi-row > [class*="col-"]:last-child :is(.sr-kpi-card, .kpi-card),
.tss-renewal.rn-analytics-page--ts .row.g-4.mb-5 > [class*="col-"]:last-child :is(.sr-kpi-card, .kpi-card) {
    border-right: 0 !important;
}

.tss-renewal.rn-analytics-page :is(.sr-kpi-card .text-xs, .kpi-title, .kpi-description, .kpi-period) {
    color: var(--rn-text-secondary) !important;
}

.tss-renewal.rn-analytics-page :is(.sr-kpi-card .h5, .kpi-value) {
    color: var(--rn-text-primary) !important;
    font-size: var(--rn-font-size-kpi);
    line-height: var(--rn-line-height-kpi);
}

body.tss-renewal.rn-analytics-page.rn-analytics-page--ts .sales-report-scope .sr-kpi-card {
    --sr-card-bg: transparent !important;
    --sr-card-shadow: none !important;
    --sr-card-radius: 0 !important;
    border: 0 !important;
    border-right: 1px solid var(--rn-divider) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.tss-renewal.rn-analytics-page.rn-analytics-page--ts .sales-report-scope .sr-kpi-card :is(.text-primary, .text-success, .text-info, .text-warning, .kpi-title) {
    color: var(--rn-text-secondary) !important;
}

.tss-renewal.rn-analytics-page :is(.card.shadow, .card.shadow-sm, .chart-container) {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none !important;
}

.tss-renewal.rn-analytics-page :is(.card-header, .chart-container > div:first-child) {
    border-color: var(--rn-border-default);
    color: var(--rn-text-primary);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page :is(.card-body, .chart-area, .chart-pie) {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .chart-tabs {
    border-color: var(--rn-border-default) !important;
}

.tss-renewal.rn-analytics-page .chart-tab-btn {
    min-height: var(--rn-control-md);
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--rn-text-secondary);
    background: transparent;
}

.tss-renewal.rn-analytics-page .chart-tab-btn.active {
    border-bottom-color: var(--rn-accent);
    color: var(--rn-text-accent);
}

/* Admin dashboards and management lists — Figma 115:1064 --------------- */

.tss-renewal.rn-analytics-page :where(.help-page-header, .admin-home-header, .dash-menu-admin-header) {
    min-height: auto;
    margin-bottom: var(--rn-space-6) !important;
    padding: 0 0 var(--rn-space-5);
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page :where(.help-page-header h1, .help-page-header h2, .admin-home-title, .dash-menu-admin-header h1) {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
    letter-spacing: var(--rn-letter-spacing-display);
}

.tss-renewal.rn-analytics-page .admin-home-hub {
    /* Width and centering are shared in tss-admin-home-fixes.css. */
    color: var(--rn-text-primary);
}

.tss-renewal.rn-analytics-page :where(.admin-home-primary, .admin-home-side-panel, .dash-menu-panel) {
    overflow: hidden;
    border: 1px solid var(--rn-border-default) !important;
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none !important;
}

.tss-renewal.rn-analytics-page :where(.admin-home-primary-head, .admin-home-side-title, .dash-menu-panel-toolbar) {
    min-height: 54px;
    padding: var(--rn-space-3) var(--rn-space-5);
    border-bottom: 1px solid var(--rn-border-default);
    background: var(--rn-bg-section);
}

.tss-renewal.rn-analytics-page .admin-favorites-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-analytics-page .admin-favorites-grid > * {
    min-height: 72px;
    border-right: 1px solid var(--rn-divider);
    border-bottom: 1px solid var(--rn-divider);
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.tss-renewal.rn-analytics-page .admin-home-primary .admin-favorites-edit-btn {
    color: var(--rn-text-secondary);
    border-color: var(--rn-border-strong);
}

.tss-renewal.rn-analytics-page .admin-home-primary .admin-favorites-edit-btn:hover {
    color: var(--rn-text-primary);
    background: var(--rn-bg-selected);
}

.tss-renewal.rn-analytics-page .admin-favorites-pick-grid .admin-favorite-pick {
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    border-color: var(--rn-border-default);
}

.tss-renewal.rn-analytics-page .admin-favorites-pick-grid .admin-favorite-pick:hover {
    background: var(--rn-accent-soft);
    border-color: var(--rn-accent);
}

.tss-renewal.rn-analytics-page .admin-favorites-pick-grid .admin-favorite-pick.is-selected {
    background: var(--rn-bg-selected);
    border-color: var(--rn-accent);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .admin-favorites-pick-grid .admin-favorite-tile-icon {
    background: var(--rn-bg-section);
    color: var(--rn-accent);
}

.tss-renewal.rn-analytics-page :where(.admin-attention-item, .admin-recent-chips > *, .dash-menu-row, .dash-category-row) {
    min-height: 54px;
    border: 0;
    border-bottom: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .dashboard-menu-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .dashboard-menu-card {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    min-height: 76px;
    padding: var(--rn-space-3) var(--rn-space-5);
    border: 0;
    border-bottom: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .dashboard-menu-card:last-child {
    border-bottom: 0;
}

.tss-renewal.rn-analytics-page .dashboard-card-icon {
    color: var(--rn-text-accent);
    background: var(--rn-accent-soft);
}

.tss-renewal.rn-analytics-page :where(.ticket-perf-kpis, .ticket-perf-grid) {
    display: grid;
    gap: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .ticket-perf-kpis {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tss-renewal.rn-analytics-page .ticket-perf-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.tss-renewal.rn-analytics-page .ticket-perf-card {
    min-height: 86px;
    border: 0;
    border-right: 1px solid var(--rn-divider);
    border-bottom: 1px solid var(--rn-divider);
    border-radius: 0;
    color: var(--rn-text-primary);
    background: transparent;
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .admin-ticket-perf__filter {
    border-color: var(--rn-border-default) !important;
    border-radius: var(--rn-radius-lg) !important;
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-analytics-page .vehicle-admin-panel .main-card {
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-lg);
    color: var(--rn-text-primary);
    background: var(--rn-bg-surface);
    box-shadow: none;
}

.tss-renewal.rn-analytics-page .vehicle-admin-panel .dashboard-grid {
    display: grid;
    gap: 0;
    border-top: 1px solid var(--rn-border-default);
}

.tss-renewal.rn-analytics-page .vehicle-admin-panel .dashboard-feature {
    min-height: 76px;
    border: 0;
    border-bottom: 1px solid var(--rn-divider);
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

/* Responsive ------------------------------------------------------------- */

@media (max-width: 991.98px) {
    .tss-renewal.rn-analytics-page main.container {
        padding-inline: var(--rn-space-mobile);
    }

    body.tss-renewal.rn-analytics-page :is(.fd-header, .approval-page-header, .ts-page-header, .dashboard-header) {
        align-items: flex-start !important;
        flex-direction: column;
    }

    body.tss-renewal.rn-analytics-page .ts-page-header__intro {
        flex: 0 1 auto;
        width: 100%;
    }

    body.tss-renewal.rn-analytics-page .ts-page-header__actions {
        width: 100%;
        flex-wrap: wrap;
    }

    body.tss-renewal.rn-analytics-page :is(.fd-controls, .fd-dates) {
        width: 100%;
        flex-wrap: wrap;
    }

    body.tss-renewal.rn-analytics-page :is(.ticket-perf-kpis, .sr-kpi-row) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-analytics-page .finance-review-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .tss-renewal.rn-analytics-page .pa-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    body.tss-renewal.rn-analytics-page :is(.fd-kpi-grid, .sr-kpi-row, .ticket-perf-kpis, .ticket-perf-grid, .finance-review-summary),
    body.tss-renewal.rn-analytics-page--ts .row.g-4.mb-5 {
        grid-template-columns: 1fr;
    }

    body.tss-renewal.rn-analytics-page :is(.pa-tabs, .pa-summary-grid) {
        grid-template-columns: 1fr;
    }

    body.tss-renewal.rn-analytics-page :is(.pa-tab, .pa-summary) {
        border-right: 0;
        border-bottom: 1px solid var(--rn-divider);
    }

    body.tss-renewal.rn-analytics-page :is(.pa-tab, .pa-summary):last-child {
        border-bottom: 0;
    }

    body.tss-renewal.rn-analytics-page :is(.fd-kpi-card, .sr-kpi-card, .kpi-card, .ticket-perf-card, .finance-review-summary__item) {
        border-right: 0 !important;
        border-bottom: 1px solid var(--rn-divider) !important;
    }

    body.tss-renewal.rn-analytics-page :is(.fd-kpi-card, .sr-kpi-card, .kpi-card, .ticket-perf-card, .finance-review-summary__item):last-child {
        border-bottom: 0 !important;
    }

    body.tss-renewal.rn-analytics-page :is(.fd-split, .admin-home-hub) {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-analytics-page .admin-favorites-grid {
        grid-template-columns: 1fr;
    }

    .tss-renewal.rn-analytics-page .admin-favorites-grid > * {
        min-height: 60px;
        border-right: 0;
    }

    body.tss-renewal.rn-analytics-page :is(.finance-review-table-wrap, .table-responsive, .fd-table-wrap) {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-analytics-page main.container {
        margin-block: var(--rn-space-4) !important;
        padding-inline: var(--rn-space-mobile);
    }

    body.tss-renewal.rn-analytics-page :is(.fd-title, .ts-page-title, .dashboard-title, .admin-home-title, .help-page-header h1, .help-page-header h2) {
        font-size: 23px;
        line-height: 32px;
    }

    .tss-renewal.rn-analytics-page .fd-presets {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }

    .tss-renewal.rn-analytics-page .fd-dates .form-control {
        min-width: 0;
        flex: 1 1 120px;
    }

    body.tss-renewal.rn-analytics-page :is(.fd-card-header, .approval-section-header, .finance-review-section__header) {
        padding-inline: var(--rn-space-4);
    }

    .tss-renewal.rn-analytics-page .fd-chart {
        min-height: 240px;
    }

    .tss-renewal.rn-analytics-page .finance-history-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .tss-renewal.rn-analytics-page .dashboard-menu-card {
        grid-template-columns: 40px minmax(0, 1fr);
        min-height: 68px;
        padding-inline: var(--rn-space-4);
    }

    .tss-renewal.rn-analytics-page .dashboard-menu-card .dashboard-card-description {
        grid-column: 1 / -1;
    }
}

/* bundled: governance.css */
/**
 * TSS UI/UX Step 11 — 기준정보·관리자.
 * Figma: users 115:1222, approval admin 116:1064, master data 123:1255.
 * 구조·권한·API는 유지하고 반복 카드를 연결된 행과 작업 패널로 정돈한다.
 */

.tss-renewal.rn-governance-page {
    background: var(--rn-bg-canvas);
    color: var(--rn-text-primary);
}

.tss-renewal.rn-governance-page :is(.super-admin-main, .ts-admin-main, main) {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-governance-page :is(h1, h2, .h1, .h2, .page-title, .ts-page-title) {
    color: var(--rn-text-primary);
    font-size: var(--rn-font-size-display);
    line-height: var(--rn-line-height-display);
    letter-spacing: var(--rn-letter-spacing-display);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-governance-page :is(.text-muted, .form-text, .small.text-secondary) {
    color: var(--rn-text-secondary) !important;
}

/* 기준정보·관리자도 다른 업무 모듈과 같은 열린 페이지 헤더를 사용한다. */
.tss-renewal.rn-governance-page :is(.ts-page-header, .help-page-header) {
    display: flex;
    min-height: auto;
    align-items: center;
    justify-content: space-between;
    gap: var(--rn-space-4);
    margin-bottom: var(--rn-space-6) !important;
    padding: 0 0 var(--rn-space-5);
    color: var(--rn-text-primary);
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--rn-border-default);
    border-radius: 0;
    box-shadow: none;
}

/* 한 화면의 큰 작업영역만 남기고 작은 카드를 반복하지 않는다. */
.tss-renewal.rn-governance-page :is(.card, .main-card, .form-section, .help-panel) {
    background: var(--rn-bg-surface);
    color: var(--rn-text-primary);
    border: 1px solid var(--rn-border-default) !important;
    border-radius: var(--rn-radius-md);
    box-shadow: none !important;
}

.tss-renewal.rn-governance-page :is(.card-header, .main-card__header) {
    min-height: var(--rn-control-lg);
    display: flex;
    align-items: center;
    background: var(--rn-bg-section);
    color: var(--rn-text-primary);
    border-bottom: 1px solid var(--rn-divider);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal.rn-governance-page .card-body {
    color: var(--rn-text-primary);
}

.tss-renewal.rn-governance-page :is(.ts-ref-list, .list-group, .permission-list, .admin-list) {
    overflow: hidden;
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.rn-governance-page .card-body > :is(.ts-ref-list, .list-group):first-child {
    margin: calc(var(--rn-space-4) * -1);
    border: 0;
    border-radius: 0;
}

/* TS 메일 주소록: 검색 도구막대와 결과 목록이 서로 침범하지 않도록 독립 영역으로 고정한다. */
.tss-renewal.rn-governance-page .ab-book-panel__body {
    padding: var(--rn-space-4);
}

.tss-renewal.rn-governance-page .ab-book-filter {
    position: relative;
    z-index: 1;
    margin-bottom: var(--rn-space-3) !important;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-input);
    overflow: hidden;
}

.tss-renewal.rn-governance-page .ab-book-filter:focus-within {
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) color-mix(in srgb, var(--rn-border-focus) 22%, transparent);
}

.tss-renewal.rn-governance-page .ab-book-filter :is(.input-group-text, .form-control) {
    min-height: var(--rn-control-md);
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.tss-renewal.rn-governance-page .ab-book-filter .input-group-text {
    flex: 0 0 var(--rn-control-md);
    justify-content: center;
    color: var(--rn-text-secondary);
    background: var(--rn-bg-subtle);
    border-right: 1px solid var(--rn-divider);
}

.tss-renewal.rn-governance-page .ab-book-list {
    margin: 0;
    overflow: hidden;
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
    background: var(--rn-bg-surface);
}

.tss-renewal.rn-governance-page .ab-book-list__item {
    min-height: 62px;
    padding: var(--rn-space-3) var(--rn-space-4);
}

.tss-renewal.rn-governance-page .ab-book-list__item.active {
    color: var(--rn-text-primary) !important;
    background: var(--rn-bg-selected) !important;
    box-shadow: inset 3px 0 0 var(--rn-accent) !important;
}

.tss-renewal.rn-governance-page .ab-book-list__item.active .text-muted {
    color: var(--rn-text-secondary) !important;
}

.tss-renewal.rn-governance-page :is(.ts-ref-card, .list-group-item, .admin-list-row) {
    min-height: 54px;
    margin: 0 !important;
    padding: var(--rn-space-3) var(--rn-space-4);
    background: var(--rn-bg-surface) !important;
    color: var(--rn-text-primary);
    border: 0 !important;
    border-bottom: 1px solid var(--rn-divider) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    transition: background var(--rn-duration-fast) var(--rn-ease-standard);
}

.tss-renewal.rn-governance-page :is(.ts-ref-card, .list-group-item, .admin-list-row):last-child {
    border-bottom: 0 !important;
}

.tss-renewal.rn-governance-page :is(.ts-ref-card, .list-group-item, .admin-list-row):hover {
    background: var(--rn-bg-hover) !important;
}

.tss-renewal.rn-governance-page .ts-ref-card__content {
    min-width: 0;
}

.tss-renewal.rn-governance-page .ts-ref-card__aside {
    flex: 0 0 auto;
    padding-left: var(--rn-space-4);
    border-left: 1px solid var(--rn-divider);
}

/* 검색·필터·일괄 작업은 하나의 얕은 도구막대로 보이게 한다. */
.tss-renewal.rn-governance-page :is(.search-section, .filter-section, .filter-card, .toolbar, .table-toolbar) {
    padding: var(--rn-space-3) var(--rn-space-4);
    background: var(--rn-bg-section);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: none;
}

.tss-renewal.rn-governance-page :is(.form-control, .form-select, .input-group-text) {
    min-height: var(--rn-control-md);
    background-color: var(--rn-bg-input);
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-governance-page :is(.form-control, .form-select)::placeholder {
    color: var(--rn-text-placeholder);
}

.tss-renewal.rn-governance-page :is(.form-control, .form-select):focus {
    color: var(--rn-text-primary);
    background-color: var(--rn-bg-input);
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) color-mix(in srgb, var(--rn-border-focus) 22%, transparent);
}

.tss-renewal.rn-governance-page :is(.btn-primary, .btn-tss-primary) {
    background: var(--rn-accent);
    color: var(--rn-accent-contrast);
    border-color: var(--rn-accent);
    box-shadow: none;
}

.tss-renewal.rn-governance-page :is(.btn-outline-primary, .btn-outline-secondary, .btn-light) {
    background: var(--rn-bg-surface);
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
    box-shadow: none;
}

.tss-renewal.rn-governance-page :is(.btn-outline-primary, .btn-outline-secondary, .btn-light):hover {
    background: var(--rn-bg-hover);
    color: var(--rn-text-primary);
    border-color: var(--rn-border-strong);
}

.tss-renewal.rn-governance-page .table-responsive {
    background: var(--rn-bg-surface);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
}

.tss-renewal.rn-governance-page .table {
    --bs-table-bg: var(--rn-bg-surface);
    --bs-table-color: var(--rn-text-primary);
    --bs-table-border-color: var(--rn-divider);
    --bs-table-hover-bg: var(--rn-bg-hover);
    --bs-table-hover-color: var(--rn-text-primary);
    margin: 0;
    color: var(--rn-text-primary);
}

.tss-renewal.rn-governance-page .table > :not(caption) > * > * {
    min-height: 54px;
    padding: var(--rn-space-3) var(--rn-space-4);
    vertical-align: middle;
    background: transparent;
    border-color: var(--rn-divider);
}

.tss-renewal.rn-governance-page .table thead th {
    position: sticky;
    top: 0;
    z-index: var(--rn-z-base);
    background: var(--rn-bg-section);
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-label);
    font-weight: var(--rn-font-weight-bold);
    white-space: nowrap;
}

.tss-renewal.rn-governance-page :is(.modal-content, .offcanvas, .dropdown-menu) {
    background: var(--rn-bg-surface);
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: var(--rn-shadow-overlay);
}

.tss-renewal.rn-governance-page :is(.modal-header, .modal-footer) {
    border-color: var(--rn-divider);
}

.tss-renewal.rn-governance-page :is(.badge, [class*="badge-tss-"]) {
    border-radius: var(--rn-radius-full);
    box-shadow: none;
}

.tss-renewal.rn-governance-page :is(.ts-ref-state, .empty-state, .loading-state) {
    padding: var(--rn-space-10) var(--rn-space-4);
    color: var(--rn-text-secondary);
    text-align: center;
}

@media (max-width: 991.98px) {
    .tss-renewal.rn-governance-page :is(.super-admin-main, .ts-admin-main) {
        padding-inline: var(--rn-space-4) !important;
    }

    .tss-renewal.rn-governance-page .ts-ref-card {
        align-items: flex-start !important;
        gap: var(--rn-space-3) !important;
    }
}

@media (max-width: 767.98px) {
    .tss-renewal.rn-governance-page :is(.ts-page-header, .help-page-header) {
        align-items: stretch;
        flex-direction: column;
        padding-bottom: var(--rn-space-4);
    }

    /* The desktop flex-basis is a width, but becomes a 240px height in a column header. */
    .tss-renewal.rn-governance-page .ts-page-header__intro {
        flex: 0 1 auto;
        width: 100%;
    }

    .tss-renewal.rn-governance-page .ts-page-header__actions {
        width: 100%;
    }

    .tss-renewal.rn-governance-page :is(h1, h2, .h1, .h2, .page-title, .ts-page-title) {
        font-size: 23px;
        line-height: 32px;
    }

    .tss-renewal.rn-governance-page .ts-ref-card {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr);
    }

    .tss-renewal.rn-governance-page .ts-ref-card__aside {
        width: 100%;
        padding: var(--rn-space-3) 0 0;
        border-left: 0;
        border-top: 1px solid var(--rn-divider);
    }

    .tss-renewal.rn-governance-page .table-responsive {
        border-radius: var(--rn-radius-sm);
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-governance-page :is(.card-body, .form-section, .modal-body) {
        padding: var(--rn-space-3);
    }

    .tss-renewal.rn-governance-page :is(.btn, .form-control, .form-select) {
        min-height: 44px;
    }
}

/* bundled: quality.css */
/**
 * TSS UI/UX Step 12 — 인증·오류·공통 상태·개인 설정.
 * Figma: login 123:1149, error/access 123:1218.
 */

.tss-renewal.rn-quality-page {
    background: var(--rn-bg-canvas);
    color: var(--rn-text-primary);
}

.tss-renewal.rn-quality-page :is(.auth-card, .error-card, .denied-container, .profile-card, .push-settings-card, .help-panel) {
    background: var(--rn-bg-surface);
    color: var(--rn-text-primary);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-md);
    box-shadow: var(--rn-shadow-subtle);
}

.tss-renewal.rn-quality-page .auth-split__brand {
    background: var(--rn-bg-sidebar) !important;
    color: var(--rn-text-on-dark);
}

/* 고정 Navy 표면은 Light/Dark의 일반 heading 색을 상속하지 않는다. */
.tss-renewal.rn-quality-page .auth-split__brand :is(
    .auth-split__brand-title,
    h1,
    h2,
    h3,
    strong,
    b
) {
    color: var(--rn-text-on-dark) !important;
}

.tss-renewal.rn-quality-page .auth-split__brand-badge {
    color: var(--rn-text-on-dark);
    border-color: color-mix(in srgb, var(--rn-text-on-dark) 28%, transparent);
}

.tss-renewal.rn-quality-page :is(.auth-split__brand-subtitle, .auth-subtitle, .error-message, .push-settings-help) {
    color: var(--rn-text-secondary);
}

.tss-renewal.rn-quality-page .auth-split__brand .auth-split__brand-subtitle {
    color: color-mix(in srgb, var(--rn-text-on-dark) 78%, var(--rn-bg-sidebar));
}

.tss-renewal.rn-quality-page :is(.auth-input, .form-control, .form-select) {
    min-height: var(--rn-control-lg);
    background: var(--rn-bg-input);
    color: var(--rn-text-primary);
    border: 1px solid var(--rn-border-default);
    border-radius: var(--rn-radius-sm);
}

.tss-renewal.rn-quality-page :is(.auth-input, .form-control, .form-select):focus {
    border-color: var(--rn-border-focus);
    box-shadow: 0 0 0 var(--rn-focus-ring-width) color-mix(in srgb, var(--rn-border-focus) 22%, transparent);
    outline: 0;
}

.tss-renewal.rn-quality-page :is(.btn-tss-primary, .btn-primary, .btn-home, .auth-btn-submit) {
    min-height: var(--rn-control-lg);
    background: var(--rn-accent);
    color: var(--rn-accent-contrast);
    border: 1px solid var(--rn-accent);
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
    transform: none;
}

.tss-renewal.rn-quality-page :is(.btn-tss-primary, .btn-primary, .btn-home, .auth-btn-submit):hover {
    background: var(--rn-accent-hover);
    color: var(--rn-accent-contrast);
    transform: none;
}

.tss-renewal.rn-quality-page .error-container {
    background: var(--rn-bg-canvas);
}

.tss-renewal.rn-quality-page .error-card {
    max-width: 560px;
    padding: var(--rn-space-10);
    text-align: center;
}

.tss-renewal.rn-quality-page :is(.error-icon, .error-code, .text-danger) {
    color: var(--rn-status-danger) !important;
}

.tss-renewal.rn-quality-page .denied-container {
    max-width: 520px;
    margin: clamp(var(--rn-space-12), 12vh, 120px) auto;
    padding: var(--rn-space-10);
}

.tss-renewal.rn-quality-page :is(.personal-profile-page, .push-settings-page, .help-page) {
    max-width: var(--rn-content-max);
    margin-inline: auto;
}

.tss-renewal.rn-quality-page .profile-card {
    max-width: 720px;
    margin-inline: auto;
    padding: var(--rn-space-6);
}

.tss-renewal.rn-quality-page .help-panel__table {
    --bs-table-bg: var(--rn-bg-surface);
    --bs-table-color: var(--rn-text-primary);
    --bs-table-border-color: var(--rn-divider);
    --bs-table-hover-bg: var(--rn-bg-hover);
    --bs-table-hover-color: var(--rn-text-primary);
}

.tss-renewal.rn-quality-page :is(.auth-alert, .alert, .help-panel__empty) {
    border-radius: var(--rn-radius-sm);
    box-shadow: none;
}

.tss-renewal.rn-quality-page :is(.error-dev-panel, pre) {
    background: var(--rn-bg-subtle);
    color: var(--rn-text-primary);
    border-color: var(--rn-border-default);
}

@media (max-width: 767.98px) {
    .tss-renewal.rn-quality-page .auth-split {
        grid-template-columns: minmax(0, 1fr);
    }

    .tss-renewal.rn-quality-page .auth-split__brand {
        display: none;
    }

    .tss-renewal.rn-quality-page :is(.auth-card, .error-card, .denied-container, .profile-card) {
        width: min(100%, calc(100vw - (var(--rn-space-4) * 2)));
        padding: var(--rn-space-6);
    }
}

@media (max-width: 575.98px) {
    .tss-renewal.rn-quality-page :is(.auth-card, .error-card, .denied-container, .profile-card) {
        padding: var(--rn-space-5);
    }

    .tss-renewal.rn-quality-page .error-code {
        font-size: 40px;
    }
}

/* bundled: responsive.css */
/** Step 6 — responsive, print and motion rules. */
@media (max-width: 1180px) {
    .tss-renewal .rn-main { padding: var(--rn-space-6); }
    .tss-renewal .rn-home__workspace { grid-template-columns: 1fr; }
    .tss-renewal .rn-home__aside { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .tss-renewal .rn-split-workspace { grid-template-columns: var(--rn-directory-width) minmax(0, 1fr); }
    .tss-renewal .rn-split-workspace > .rn-detail-rail { display: none; }
    .tss-renewal .rn-approval__workspace { grid-template-columns: minmax(0, 1fr) 280px; }
    .tss-renewal .rn-document-library { grid-template-columns: 240px minmax(0, 1fr); }
    .tss-renewal .rn-document-preview { display: none; }
    .tss-renewal .rn-request-queue__workspace { grid-template-columns: 220px minmax(0, 1fr); }
}

@media (max-width: 900px) {
    .tss-renewal .rn-sidebar { transform: translateX(-100%); transition: transform var(--rn-duration-normal) var(--rn-ease-standard); }
    .tss-renewal.is-menu-open .rn-sidebar { transform: translateX(0); }
    .tss-renewal .rn-shell { margin-left: 0; }
    .tss-renewal .rn-mobile-menu { display: inline-grid; }
    .tss-renewal.is-menu-open .rn-sidebar-backdrop { position: fixed; inset: 0; z-index: 45; display: block; background: var(--rn-bg-overlay); }
    .tss-renewal .rn-summary-strip { --rn-summary-columns: 2; }
    .tss-renewal .rn-summary-strip__item:nth-child(odd):not(:first-child)::before { top: 0; right: var(--rn-space-4); bottom: auto; left: var(--rn-space-4); width: auto; height: 1px; }
    .tss-renewal .rn-summary-strip__item:nth-child(odd)::before { display: none; }
    .tss-renewal .rn-summary-strip__item:nth-child(n + 3) { border-top: 1px solid var(--rn-border-default); }
    .tss-renewal .rn-approval__workspace,
    .tss-renewal .rn-crm__workspace,
    .tss-renewal .rn-community__workspace,
    .tss-renewal .rn-request-queue__workspace { grid-template-columns: 1fr; }
    .tss-renewal :where(.rn-approval__workspace, .rn-crm__workspace) > .rn-detail-rail { display: none; }
    .tss-renewal .rn-directory { border-right: 0; border-bottom: 1px solid var(--rn-border-default); }
    .tss-renewal .rn-directory__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .tss-renewal .rn-resource-layout,
    .tss-renewal .rn-profile,
    .tss-renewal .rn-admin__layout { grid-template-columns: 1fr; }
    .tss-renewal .rn-profile__nav,
    .tss-renewal .rn-admin__subnav { position: static; border-right: 0; border-bottom: 1px solid var(--rn-border-default); }
    .tss-renewal .rn-dashboard__canvas { grid-template-columns: 1fr; }
    .tss-renewal .rn-chart-region + .rn-chart-region { border-top: 1px solid var(--rn-border-default); border-left: 0; }
    .tss-renewal .rn-form-section { grid-template-columns: 1fr; gap: var(--rn-space-4); }
}

@media (max-width: 720px) {
    .tss-renewal .rn-topbar { padding-inline: var(--rn-space-4); }
    .tss-renewal .rn-global-search { width: min(100%, 420px); }
    .tss-renewal .rn-main { padding: var(--rn-space-5) var(--rn-space-4); }
    .tss-renewal .rn-page-header { align-items: stretch; flex-direction: column; gap: var(--rn-space-4); }
    .tss-renewal .rn-page-header__actions { width: 100%; }
    .tss-renewal .rn-page-header__actions .rn-button { flex: 1; }
    .tss-renewal .rn-toolbar { align-items: stretch; flex-direction: column; }
    .tss-renewal .rn-toolbar__search { width: 100%; min-width: 0; flex-basis: auto; }
    .tss-renewal .rn-toolbar__group { width: 100%; overflow-x: auto; }
    .tss-renewal .rn-toolbar__actions { width: 100%; margin-left: 0; justify-content: flex-end; }
    .tss-renewal .rn-home__aside { grid-template-columns: 1fr; }
    .tss-renewal .rn-split-workspace { display: block; min-height: 0; }
    .tss-renewal .rn-directory__list { display: flex; overflow-x: auto; }
    .tss-renewal .rn-directory__item { flex: 0 0 auto; min-width: 132px; }
    .tss-renewal .rn-form-section__fields { grid-template-columns: 1fr; }
    .tss-renewal .rn-pagination { align-items: flex-start; flex-direction: column; }
    .tss-renewal .rn-pagination__pages { width: 100%; overflow-x: auto; }
    .tss-renewal .rn-auth { grid-template-columns: 1fr; }
    .tss-renewal .rn-auth__visual { display: none; }
    .tss-renewal .rn-document-library { display: block; min-height: auto; }
    .tss-renewal .rn-folder-tree { max-height: 220px; border-right: 0; border-bottom: 1px solid var(--rn-border-default); }
}

@media (max-width: 520px) {
    .tss-renewal .rn-summary-strip { --rn-summary-columns: 1; }
    .tss-renewal .rn-summary-strip__item + .rn-summary-strip__item::before { top: 0; right: var(--rn-space-4); bottom: auto; left: var(--rn-space-4); width: auto; height: 1px; }
    .tss-renewal .rn-summary-strip__item:nth-child(n + 2) { border-top: 0; }
    .tss-renewal .rn-topbar__actions > :not(.rn-theme-toggle) { display: none; }
    .tss-renewal .rn-data-table--responsive thead { display: none; }
    .tss-renewal .rn-data-table--responsive,
    .tss-renewal .rn-data-table--responsive tbody,
    .tss-renewal .rn-data-table--responsive tr,
    .tss-renewal .rn-data-table--responsive td { display: block; width: 100%; }
    .tss-renewal .rn-data-table--responsive tr { padding: var(--rn-space-3) var(--rn-space-4); border-bottom: 1px solid var(--rn-border-default); }
    .tss-renewal .rn-data-table--responsive td { display: flex; min-height: 32px; height: auto; align-items: baseline; justify-content: space-between; gap: var(--rn-space-4); padding: 4px 0; border: 0; text-align: right; }
    .tss-renewal .rn-data-table--responsive td::before { color: var(--rn-text-secondary); font-size: 11px; content: attr(data-label); }
    .tss-renewal .rn-data-row { grid-template-columns: minmax(0, 1fr) auto; }
    .tss-renewal .rn-data-row > :not(:first-child):not(:last-child) { display: none; }
    .tss-renewal .rn-modal-backdrop { padding: 0; align-items: end; }
    .tss-renewal .rn-modal { max-height: 92vh; border-radius: var(--rn-radius-lg) var(--rn-radius-lg) 0 0; }
    .tss-renewal .rn-toast-stack { right: var(--rn-space-4); bottom: var(--rn-space-4); }
}

@media print {
    .tss-renewal { background: #ffffff; color: #000000; }
    .tss-renewal :where(.rn-sidebar, .rn-topbar, .rn-toolbar, .rn-page-header__actions, .rn-pagination, .rn-detail-rail) { display: none; }
    .tss-renewal .rn-shell { margin: 0; }
    .tss-renewal .rn-main { width: 100%; max-width: none; padding: 0; }
    .tss-renewal :where(.rn-panel, .rn-summary-strip, .rn-split-workspace) { border-color: #b8b8b8; box-shadow: none; }
    .tss-renewal .rn-data-table { break-inside: auto; }
    .tss-renewal .rn-data-table tr { break-inside: avoid; }
}

/* bundled: pagination.css */
/**
 * Operational pagination contract — document library is the visual source of truth.
 * Loaded last so module-level legacy CSS cannot create a second pagination style.
 */
.tss-renewal :where(
    .pagination,
    .doc-lib-pagination,
    .rn-list-pagination,
    .approval-list-pager__nav,
    .cs-pagination,
    .crm-group-pagination nav,
    .crm-type-pagination
) {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 0.35rem;
    margin: 0;
    padding: 1rem 0 0;
    border-top: 1px solid var(--rn-border-default);
    list-style: none;
}

.tss-renewal :where(
    .pagination .page-link,
    .doc-lib-page-number,
    .doc-lib-page-arrow,
    .rn-page,
    .approval-list-pager__btn,
    .cs-page-number,
    .cs-page-arrow,
    .crm-group-pagination button,
    .crm-type-pagination button
) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 2.25rem;
    height: 2.25rem;
    min-height: 2.25rem;
    padding: 0 0.35rem;
    border: 0;
    border-radius: var(--rn-radius-sm) !important;
    background: transparent;
    color: var(--rn-text-primary);
    font-size: 0.95rem;
    font-weight: var(--rn-font-weight-medium);
    line-height: 1;
    text-decoration: none;
    box-shadow: none;
}

.tss-renewal :where(
    .pagination .page-link,
    .doc-lib-page-number,
    .doc-lib-page-arrow,
    .rn-page,
    .approval-list-pager__btn,
    .cs-page-number,
    .cs-page-arrow,
    .crm-group-pagination button,
    .crm-type-pagination button
):hover:not(:disabled) {
    background: var(--rn-bg-accent-soft);
    color: var(--rn-text-accent);
}

.tss-renewal :where(
    .pagination .page-item.active .page-link,
    .doc-lib-page-number.is-active,
    .rn-page[aria-current="page"],
    .approval-list-pager__btn.is-current,
    .cs-page-number.is-active,
    .crm-group-pagination button.is-current,
    .crm-type-pagination button.is-current
) {
    background: var(--rn-accent);
    color: var(--rn-accent-contrast);
    font-weight: var(--rn-font-weight-bold);
}

.tss-renewal :where(
    .pagination .page-item.disabled .page-link,
    .rn-page:disabled,
    .rn-page[aria-disabled="true"],
    .approval-list-pager__btn:disabled,
    .cs-page-number:disabled,
    .cs-page-arrow:disabled,
    .crm-group-pagination button:disabled,
    .crm-type-pagination button:disabled
) {
    background: transparent;
    color: var(--rn-text-disabled);
    pointer-events: none;
}

.tss-renewal :where(.doc-lib-page-arrow, .pagination .page-link:has(i)) {
    color: var(--rn-text-secondary);
    font-size: 0.85rem;
}

.tss-renewal .rn-list-pagination-wrap {
    position: relative;
    min-height: 4.75rem;
    padding-top: var(--rn-space-3);
}

.tss-renewal .rn-list-pagination-wrap .rn-list-pagination {
    padding-top: var(--rn-space-3);
}

.tss-renewal .rn-list-pagination-summary {
    position: absolute;
    top: var(--rn-space-6);
    left: 0;
    margin: 0;
    color: var(--rn-text-secondary);
    font-size: var(--rn-font-size-compact);
}

@media (max-width: 575.98px) {
    .tss-renewal :where(
        .pagination,
        .doc-lib-pagination,
        .rn-list-pagination,
        .approval-list-pager__nav,
        .cs-pagination,
        .crm-group-pagination nav,
        .crm-type-pagination
    ) {
        justify-content: flex-start;
        overflow-x: auto;
        padding-bottom: 0.25rem;
    }

    .tss-renewal :where(
        .pagination .page-link,
        .doc-lib-page-number,
        .doc-lib-page-arrow,
        .rn-page,
        .approval-list-pager__btn,
        .cs-page-number,
        .cs-page-arrow,
        .crm-group-pagination button,
        .crm-type-pagination button
    ) {
        min-width: 2rem;
        height: 2rem;
        min-height: 2rem;
    }

    .tss-renewal .rn-list-pagination-wrap {
        display: grid;
        gap: var(--rn-space-2);
    }

    .tss-renewal .rn-list-pagination-summary {
        position: static;
        order: 2;
        text-align: left;
    }
}

/* bundled: desktop-sidebar.css */
/* A-shell desktop rail: fully hidden, never a narrow icon-only rail. */
@media (min-width: 992px) {
    body.tss-renewal .tss-nav-left {
        position: relative;
    }
    body.tss-renewal .tss-nav-left .tss-brand-cluster {
        /* Keep the wordmark at its original x-position after the control leaves flex flow. */
        margin-left: 48px;
    }
    body.tss-renewal .tss-desktop-sidebar-toggle {
        display: inline-grid;
        place-items: center;
        position: absolute;
        left: 20px;
        top: 50%;
        transform: translateY(-50%);
        z-index: 1;
        width: 24px;
        height: 24px;
        padding: 0;
        border: 1px solid color-mix(in srgb, var(--rn-text-on-dark) 16%, transparent);
        border-radius: 50%;
        background: color-mix(in srgb, var(--rn-text-on-dark) 5%, transparent);
        color: var(--rn-text-on-dark);
        cursor: pointer;
    }
    body.tss-renewal .tss-desktop-sidebar-toggle:hover,
    body.tss-renewal .tss-desktop-sidebar-toggle:focus-visible {
        background: color-mix(in srgb, var(--rn-text-on-dark) 16%, transparent);
        color: var(--rn-text-on-dark);
    }
    body.tss-renewal .tss-desktop-sidebar-toggle .bi {
        font-size: 11px;
    }
    html.tss-desktop-sidebar-animating body.tss-renewal .tss-desktop-sidebar-toggle .bi {
        transition: transform .18s ease;
    }
    body.tss-renewal .tss-desktop-sidebar-toggle:focus-visible {
        outline: 2px solid var(--rn-accent);
        outline-offset: 2px;
    }
    /* Animate only an explicit toggle, never a newly painted page or frame. */
    html.tss-desktop-sidebar-animating body.tss-renewal .tss-nav-left,
    html.tss-desktop-sidebar-animating body.tss-renewal .tss-portal-sidebar,
    html.tss-desktop-sidebar-animating body.tss-renewal #sidebarMenu.sidebar,
    html.tss-desktop-sidebar-animating body.tss-renewal .super-admin-main,
    html.tss-desktop-sidebar-animating body.tss-renewal .ts-layout,
    html.tss-desktop-sidebar-animating body.tss-renewal > main.container,
    html.tss-desktop-sidebar-animating body.tss-renewal > footer.footer,
    html.tss-desktop-sidebar-animating body.tss-renewal > .tss-page-subnav {
        transition: width .18s ease, min-width .18s ease, max-width .18s ease,
            flex-basis .18s ease, margin-left .18s ease, padding-left .18s ease,
            transform .18s ease, opacity .18s ease;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal {
        --tss-portal-sidebar-width: 0px;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal .tss-nav-left {
        width: 56px !important;
        min-width: 56px !important;
        padding-inline: 12px !important;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal .tss-desktop-sidebar-toggle {
        left: 16px;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal .tss-desktop-sidebar-toggle .bi {
        transform: rotate(180deg);
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal .tss-nav-left .tss-brand-cluster,
    html.tss-desktop-sidebar-hidden body.tss-renewal .tss-nav-left > .nav-item {
        display: none !important;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal #tssPortalSidebar.offcanvas-lg {
        transform: translateX(-100%) !important;
        visibility: hidden !important;
        pointer-events: none !important;
        opacity: 0;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal #sidebarMenu.sidebar {
        flex-basis: 0 !important;
        width: 0 !important;
        max-width: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
        pointer-events: none !important;
        opacity: 0;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal .ts-layout {
        padding-left: 0 !important;
    }
    html.tss-desktop-sidebar-hidden body.tss-renewal:has(#tssPersistentPane) > main.container {
        left: 0 !important;
    }
}
@media (max-width: 991.98px) {
    .tss-desktop-sidebar-toggle { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
    body.tss-renewal .tss-desktop-sidebar-toggle .bi { transition: none !important; }
    body.tss-renewal .tss-nav-left,
    body.tss-renewal .tss-portal-sidebar,
    body.tss-renewal #sidebarMenu.sidebar,
    body.tss-renewal .super-admin-main,
    body.tss-renewal .ts-layout,
    body.tss-renewal > main.container,
    body.tss-renewal > footer.footer,
    body.tss-renewal > .tss-page-subnav { transition: none !important; }
}

/* bundled: dark-surfaces.css */
/**
 * Dark surfaces shared by every desktop workspace.
 * Canvas -> one panel surface; section headings use borders, not extra bands.
 * Muted controls, selected rows, alerts, charts and document contents keep their roles.
 * Loaded last so legacy page-local skins cannot repaint structural headings.
 */
html[data-tss-theme="dark"] body.tss-renewal:not([data-theme="light"]) :is(
    .ts-page-header, .help-page-header, .bd-page-hero, .wb-page-header,
    .approval-page-header, .approval-detail-header, .dashboard-header,
    .dashboard-welcome, .admin-home-header, .dash-menu-admin-header,
    .fd-header, .pa-header, .ai-admin-hero
) {
    background: transparent !important;
    box-shadow: none !important;
}

/* Page wrappers belong to the canvas; their actual forms/lists own a surface. */
html[data-tss-theme="dark"] body.tss-renewal:not([data-theme="light"]) :is(
    .vehicle-page, .error-container
) {
    background: var(--rn-bg-canvas) !important;
}

/* Sticky table headings remain opaque. Semantic warning/success headers are excluded. */
html[data-tss-theme="dark"] body.tss-renewal:not([data-theme="light"]) :is(
    .card-header:not(.bg-warning):not(.bg-danger):not(.bg-success):not(.bg-info),
    .card-footer, .main-card__header, .fd-card-header, .pa-card-header,
    .finance-review-section__header, .approval-section-header,
    .sr-filter-panel-header, .filter-panel-header,
    .admin-home-primary-head, .admin-home-side-title, .dash-menu-panel-toolbar,
    .rn-data-table th, .rn-data-list__head, .approval-list-head,
    .rn-deal-table__header, .rn-crm-record-list__header,
    .doc-lib-sidebar-head, .doc-lib-main-head, .doc-lib-panel-head,
    .poll-detail-q-card-header, .template-version-history thead th,
    .template-list-table thead th, .payment-approval-detail-table thead th,
    .finance-review-table thead th, .wb-table thead th
) {
    background: var(--rn-bg-surface) !important;
    border-color: var(--rn-border-default);
}

html[data-tss-theme="dark"] body.tss-renewal:not([data-theme="light"]) :is(
    .approval-card-usage-toolbar, .approval-expense-actionbar,
    .approval-evidence-summary__header, .approval-evidence-summary__table thead th,
    .approval-ai-compare-card__header, .finance-history-toolbar,
    .finance-review-workflow, .doc-admin-workflow, .help-panel__toolbar,
    .doc-lib-desc-header, .pa-batch__header, .admin-tickets-list__filter,
    .ticket-card-detail, .ticket-perf-card, .ticket-perf-kpi, .td-form-grid,
    .stat-card, .stats-card, .kpi-card
) {
    background: var(--rn-bg-surface) !important;
}

/* Overlay surfaces stay opaque and share a single color with their headings. */
html[data-tss-theme="dark"] body.tss-renewal:not([data-theme="light"]) :is(
    .modal-content, .modal-header, .modal-footer, .popover-header,
    .approval-ai-preview-modal .modal-header, #generalDraftAiModal .modal-header
) {
    background: var(--rn-bg-surface) !important;
}

/* bundled: density.css */
/* Desktop information density for repeated results. Text, form controls,
   dialogs, touch layouts and semantic status colours keep their own scale. */
@media (min-width: 992px) {
  body.tss-renewal.tss-renewal--structure-preserving-a
    :is(.bd-post-list-row, .approval-list-row) {
    min-height: 51px;
    padding-top: 7px;
    padding-bottom: 7px;
  }

  body.tss-renewal.tss-renewal--structure-preserving-a
    :is(.admin-user-row, .admin-board-post-row, .vehicle-admin-row) {
    min-height: 49px;
    padding-top: 7px;
    padding-bottom: 7px;
  }

  body.tss-renewal.tss-renewal--structure-preserving-a .rn-data-list__head {
    min-height: 34px;
  }

  body.tss-renewal.tss-renewal--structure-preserving-a .rn-data-list__row {
    min-height: 50px;
  }

  body.tss-renewal.tss-renewal--structure-preserving-a
    :is(.admin-users-draft__search, .vehicle-admin-draft__filter) {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  body.tss-renewal.tss-renewal--structure-preserving-a
    :is(.ts-ref-filter, .approval-list-filter, .tickets-search) {
    margin-bottom: 12px;
  }

  body.tss-renewal.rn-admin-shell main.super-admin-main:has(#addUserForm) .card.mb-4 {
    margin-bottom: 12px !important;
  }

  /* Request intake: the inherited two-column card content squeezed the title
     into a narrow track and wrapped status badges even on wide desktops. */
  body.tss-renewal.rn-operations-page--admin .admin-tickets-list__filter {
    --bs-gutter-y: 8px;
    padding: 12px !important;
    margin-bottom: 12px !important;
  }

  body.tss-renewal.rn-operations-page--admin
    .admin-tickets-list__table .ts-ref-card {
    padding: 8px 12px;
  }

  body.tss-renewal.rn-operations-page--admin
    .admin-tickets-list__table .ts-ref-card__content {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    width: 100%;
  }

  body.tss-renewal.rn-operations-page--admin
    .admin-tickets-list__table .ts-ref-card__heading {
    gap: 4px 6px;
  }

  body.tss-renewal.rn-operations-page--admin
    .admin-tickets-list__table .admin-tickets-list__desc {
    display: block;
    -webkit-line-clamp: unset;
    white-space: nowrap;
  }
}

/* The legacy TSS button variables are absent inside the persistent admin
   content frame. Keep the request filter actions legible in both themes. */
body.tss-renewal.rn-operations-page--admin
  .admin-tickets-list__filter .btn-tss-primary {
  border: 1px solid var(--rn-accent);
  background: var(--rn-accent);
  color: var(--rn-accent-contrast);
}

body.tss-renewal.rn-operations-page--admin
  .admin-tickets-list__filter .btn-tss-primary:hover {
  background: var(--rn-accent-hover);
}

body.tss-renewal.rn-operations-page--admin
  .admin-tickets-list__filter .btn-tss-ghost {
  border: 1px solid var(--rn-border-default);
  background: var(--rn-bg-surface);
  color: var(--rn-text-primary);
}

body.tss-renewal.rn-operations-page--admin
  .admin-tickets-list__filter .btn-tss-ghost:hover {
  background: var(--rn-bg-subtle);
}

body.tss-renewal.rn-operations-page--admin
  .admin-tickets-list__filter input::placeholder {
  color: var(--rn-text-muted);
  opacity: 1;
}