/* Shared application styles extracted from index.html on 2026-04-05. */

        :root {
            --bg: #eef3f5;
            --panel: rgba(255, 255, 255, 0.94);
            --panel-strong: #ffffff;
            --line: #d2dacf;
            --line-soft: #e8edf0;
            --text: #163244;
            --muted: #5f7280;
            --primary: #6898ad;
            --primary-soft: #edf5f8;
            --accent: #003349;
            --accent-soft: #f3f8fb;
            --secondary-soft: #e6eef1;
            --danger: #e2698b;
            --danger-soft: #fbecf1;
            --warn: #b07d2e;
            --warn-soft: #faf3e5;
            --info: #96c0cf;
            --info-soft: #eef7fb;
            --success: #6ac48e;
            --success-soft: #eff9f3;
            --shadow: 0 16px 34px rgba(0, 51, 73, 0.08);
            --shadow-soft: 0 10px 20px rgba(0, 51, 73, 0.08);
            --shadow-hover: 0 14px 26px rgba(0, 51, 73, 0.14);
            --radius-lg: 20px;
            --branding-login-bg: #6898AD;
            --branding-login-title-accent: #E2698B;
            --branding-login-tagline-accent: #003349;
        }

        * { box-sizing: border-box; }
        *:focus-visible {
            outline: 3px solid rgba(104, 152, 173, 0.28);
            outline-offset: 2px;
        }
        body {
            margin: 0;
            min-height: 100vh;
            font-family: "Noto Sans KR", sans-serif;
            font-size: 14px;
            color: var(--text);
            background:
                radial-gradient(circle at top left, rgba(104, 152, 173, 0.12), transparent 28%),
                radial-gradient(circle at top right, rgba(150, 192, 207, 0.18), transparent 26%),
                linear-gradient(180deg, #f7fafb 0%, var(--bg) 100%);
            overflow-x: hidden;
            overflow-y: auto;
        }
        body.app-loading {
            overflow: hidden;
        }
        body.app-loading .shell {
            opacity: 0;
            pointer-events: none;
        }
        h1, h2, h3, h4 { font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif; letter-spacing: -0.02em; }
        button, input, select { font: inherit; }
        .shell {
            max-width: 1380px; min-height: 100vh; margin: 0 auto; padding: 7px 10px 9px;
            display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); grid-template-rows: auto auto 1fr; gap: 8px;
        }
        .app-copyright {
            width: 100%;
            padding: 2px 18px 16px;
            text-align: center;
            color: rgba(104, 136, 152, 0.58);
            font-size: 0.66rem;
            font-weight: 400;
            line-height: 1.5;
            letter-spacing: 0.01em;
        }
        .topbar {
            position: sticky; top: 0; z-index: 220;
            display: grid; grid-template-columns: minmax(300px, auto) minmax(0, 1fr); gap: 8px 12px; align-items: center;
            margin-bottom: 0; padding: 9px 11px; border: 1px solid rgba(255, 255, 255, 0.7); border-radius: 18px;
            background: rgba(255, 255, 255, 0.82); backdrop-filter: blur(16px); box-shadow: var(--shadow); overflow: visible;
            grid-column: 1 / -1;
        }
.brand-wrap { display: flex; align-items: center; gap: 10px; min-width: 0; }
        .brand-home {
            cursor: pointer;
            border: 0;
            background: transparent;
            padding: 0;
            text-align: left;
            color: inherit;
        }
        .brand-mark {
            min-width: 44px; width: 44px; height: 44px; border-radius: 0; display: grid; place-items: center;
            overflow: hidden;
            flex: 0 0 auto;
        }
        .brand-mark img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: contain;
        }
.brand-text { min-width: 0; overflow: hidden; }
.brand-text .eyebrow { text-transform: none; letter-spacing: 0.08em; }
.eyebrow { margin: 0 0 2px; color: var(--primary); font-size: 0.64rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.15em; }
        .brand-title { margin: 0; font-size: 0.98rem; font-weight: 800; line-height: 1.14; word-break: keep-all; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        html[lang="en"] .brand-title { font-size: 0.84rem; }
        .brand-sub { display: none; }
        .topbar-main { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; overflow: visible; }
        .manager-store-top-chip {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            max-width: 500px;
            min-height: 38px;
            padding: 6px 8px 6px 10px;
            border: 1px solid rgba(118, 164, 187, 0.3);
            border-radius: 999px;
            background: rgba(244, 249, 252, 0.94);
            color: var(--muted-strong);
            font-size: 0.7rem;
            font-weight: 800;
            white-space: nowrap;
            overflow: hidden;
        }
        .manager-store-top-chip[hidden] { display: none !important; }
        .manager-store-top-chip span {
            color: var(--muted-strong);
            font-weight: 900;
        }
        .manager-store-top-chip strong {
            color: #075f95;
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .manager-store-top-chip button {
            flex: 0 0 auto;
            min-height: 26px;
            padding: 4px 8px;
            border-radius: 999px;
            border: 1px solid rgba(90, 139, 164, 0.35);
            background: #ffffff;
            color: var(--primary);
            font-size: 0.68rem;
            font-weight: 900;
            cursor: pointer;
        }
        .manager-store-slot-status {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            margin: 0 0 12px;
            padding: 10px 12px;
            border: 1px solid rgba(118, 164, 187, 0.28);
            border-radius: 12px;
            background: rgba(244, 249, 252, 0.94);
            color: var(--muted-strong);
            font-size: 0.76rem;
            font-weight: 800;
        }
        .manager-store-slot-status[hidden] { display: none !important; }
        .manager-store-slot-status strong { color: var(--text); }
        .manager-store-slot-status .btn-ghost { min-height: 32px; padding: 6px 10px; }
        @media (max-width: 900px) {
            .topbar-main {
                flex-wrap: wrap;
            }
            .manager-store-top-chip {
                order: 4;
                width: 100%;
                max-width: none;
                justify-content: space-between;
                border-radius: 12px;
            }
            .manager-store-slot-status {
                align-items: flex-start;
                flex-direction: column;
            }
        }
        .sync-tools {
            grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap;
            padding-top: 6px; border-top: 1px solid var(--line-soft);
        }
        .sync-tools[hidden] { display: none !important; }
        .sync-badge {
            display: inline-flex;
            align-items: center;
            padding: 7px 10px;
            border-radius: 999px;
            background: #f5f9fb;
            border: 1px solid var(--line-soft);
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 800;
            white-space: nowrap;
        }
        .sync-badge.is-locked {
            background: #fff1f2;
            border-color: #fecdd3;
            color: #be123c;
        }
        .sync-btn {
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            color: var(--text);
            padding: 9px 12px;
            border-radius: 999px;
            font-size: 0.74rem;
            font-weight: 800;
            cursor: pointer;
            white-space: nowrap;
            transition: border-color 0.18s ease, color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
        }
        .sync-btn:hover,
        .sync-btn:focus-visible {
            border-color: rgba(104, 152, 173, 0.42);
            color: var(--accent);
            background: #fff;
            transform: translateY(-1px);
            box-shadow: var(--shadow-soft);
        }
        .sync-btn:disabled {
            cursor: not-allowed;
            opacity: 0.48;
            border-color: var(--line-soft);
            color: var(--muted);
        }
        .storage-lock-banner {
            grid-column: 1 / -1;
            padding: 10px 12px;
            border-radius: 12px;
            background: #fff4f6;
            border: 1px solid #fecdd3;
            color: #9f1239;
            font-size: 0.73rem;
            font-weight: 700;
            line-height: 1.5;
        }
        .storage-lock-banner strong {
            display: block;
            margin-bottom: 3px;
            font-size: 0.75rem;
        }
        .top-storage-lock-banner {
            margin-top: 2px;
        }
        .lang-select {
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            color: var(--text);
            padding: 8px 10px;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 800;
            cursor: pointer;
            flex: 0 0 auto;
            transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
        }
        .lang-select:hover,
        .lang-select:focus-visible {
            border-color: rgba(104, 152, 173, 0.42);
            background: #fff;
            transform: translateY(-1px);
            box-shadow: var(--shadow-soft);
        }
        .language-menu {
            position: relative;
            display: inline-flex;
            flex: 0 0 auto;
        }
        .language-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 40px;
            height: 40px;
            border: 1px solid var(--line-soft);
            border-radius: 999px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            color: #0b2e55;
            cursor: pointer;
            transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
        }
        .language-chip svg {
            width: 21px;
            height: 21px;
        }
        .language-chip:hover,
        .language-chip:focus-visible,
        .language-menu.open .language-chip {
            border-color: rgba(104, 152, 173, 0.42);
            background: #fff;
            transform: translateY(-1px);
            box-shadow: var(--shadow-soft);
            outline: none;
        }
        .language-options {
            position: absolute;
            top: calc(100% + 8px);
            right: 0;
            z-index: 80;
            min-width: 138px;
            padding: 6px;
            border: 1px solid var(--line-soft);
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.98);
            box-shadow: var(--shadow-soft);
            opacity: 0;
            pointer-events: none;
            transform: translateY(-4px);
            transition: opacity 0.16s ease, transform 0.16s ease;
        }
        .language-menu.open .language-options {
            opacity: 1;
            pointer-events: auto;
            transform: translateY(0);
        }
        .language-options button {
            width: 100%;
            border: 0;
            border-radius: 10px;
            background: transparent;
            color: var(--text);
            padding: 9px 10px;
            font-size: 0.78rem;
            font-weight: 800;
            text-align: left;
            cursor: pointer;
        }
        .language-options button:hover,
        .language-options button:focus-visible,
        .language-options button.active {
            background: #eaf6fb;
            color: var(--primary);
            outline: none;
        }
        .language-options button.active::after {
            content: "✓";
            float: right;
            font-weight: 900;
        }
        .nav-pills { display: flex; flex: 1 1 auto; justify-content: flex-end; flex-wrap: nowrap; gap: 7px; min-width: 0; }
        .nav-pills button {
            border: 1px solid transparent; background: transparent; color: var(--muted); padding: 12px 13px; border-radius: 999px;
            min-height: 42px;
            font-weight: 700; font-size: 0.88rem; cursor: pointer; transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease; white-space: nowrap;
        }
        .nav-pills button:hover,
        .nav-pills button:focus-visible {
            border-color: rgba(104, 152, 173, 0.34);
            background: #fff;
            color: var(--accent);
            transform: translateY(-1px);
            box-shadow: var(--shadow-soft);
        }
        .nav-pills button.active { background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%); color: #fff; box-shadow: 0 12px 24px rgba(0, 51, 73, 0.2); }
        .nav-home-btn {
            width: 40px;
            min-width: 40px;
            height: 40px;
            padding: 0 !important;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid transparent !important;
            background: transparent !important;
            color: var(--muted) !important;
            font-size: 1.08rem !important;
            line-height: 1;
            box-shadow: none;
        }
        .nav-home-btn:hover,
        .nav-home-btn:focus-visible {
            border-color: rgba(104, 152, 173, 0.34) !important;
            background: #fff !important;
            color: var(--accent) !important;
            transform: translateY(-1px);
            box-shadow: var(--shadow-soft);
        }
        .nav-home-btn svg,
        .section-home-btn svg {
            width: 18px;
            height: 18px;
            display: block;
        }
        .nav-home-btn.active {
            background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%) !important;
            color: #fff !important;
            box-shadow: 0 12px 24px rgba(0, 51, 73, 0.2);
        }
        html[lang="en"] .nav-pills {
            gap: 2px;
        }
        html[lang="en"] .nav-pills button {
            padding: 9px 7px;
            font-size: 0.73rem;
            letter-spacing: -0.01em;
        }
        html[lang="en"] .lang-select {
            min-width: 78px;
            padding-inline: 9px 26px;
            font-size: 0.68rem;
        }
        .notification-menu,
        .user-menu { position: relative; display: none; overflow: visible; z-index: 260; }
        .notification-menu.is-visible,
        .user-menu.is-visible { display: block; }
        .notification-chip {
            position: relative;
            width: 38px;
            height: 38px;
            border: 1px solid var(--line-soft);
            border-radius: 50%;
            background: #fff;
            color: var(--text);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            box-shadow: 0 10px 18px rgba(0, 51, 73, 0.08);
            transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease;
        }
        .notification-chip:hover,
        .notification-menu.open .notification-chip {
            border-color: rgba(104, 152, 173, 0.34);
            background: #f7fbfd;
            transform: translateY(-1px);
            box-shadow: 0 12px 20px rgba(0, 51, 73, 0.12);
        }
        .notification-chip-icon {
            width: 18px;
            height: 18px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .notification-chip-icon svg {
            width: 18px;
            height: 18px;
            display: block;
        }
        .notification-badge {
            position: absolute;
            top: -4px;
            right: -3px;
            min-width: 18px;
            height: 18px;
            padding: 0 5px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: #cf2338;
            color: #fff;
            font-size: 0.63rem;
            font-weight: 800;
            line-height: 1;
            box-shadow: 0 8px 16px rgba(207, 35, 56, 0.24);
        }
        .notification-dropdown {
            position: absolute;
            top: calc(100% + 10px);
            right: 0;
            width: 320px;
            max-width: min(320px, calc(100vw - 20px));
            padding: 10px;
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.98);
            border: 1px solid var(--line-soft);
            box-shadow: 0 22px 30px rgba(0, 51, 73, 0.16);
            display: none;
            z-index: 1000;
        }
        .notification-menu.open .notification-dropdown { display: block; }
        .notification-dropdown-head {
            padding: 4px 4px 10px;
            border-bottom: 1px solid var(--line-soft);
            margin-bottom: 8px;
        }
        .notification-dropdown-head strong {
            display: block;
            margin-bottom: 4px;
            font-size: 0.82rem;
        }
        .notification-dropdown-head span {
            color: var(--muted);
            font-size: 0.72rem;
        }
        .notification-scope-tabs {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 6px;
            margin-bottom: 8px;
            padding: 4px;
            border: 1px solid var(--line-soft);
            border-radius: 10px;
            background: #f5f9fb;
        }
        .notification-scope-tabs[hidden] {
            display: none;
        }
        .notification-scope-tab {
            min-width: 0;
            border: 1px solid transparent;
            border-radius: 7px;
            padding: 7px 8px;
            background: transparent;
            color: var(--muted);
            font: inherit;
            font-size: 0.71rem;
            font-weight: 800;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 6px;
        }
        .notification-scope-tab strong {
            min-width: 18px;
            padding: 2px 5px;
            border-radius: 999px;
            background: rgba(91, 126, 144, 0.12);
            color: inherit;
            font-size: 0.64rem;
            line-height: 1.2;
        }
        .notification-scope-tab.active {
            border-color: rgba(56, 120, 151, 0.25);
            background: #fff;
            color: var(--primary);
            box-shadow: 0 3px 9px rgba(17, 70, 94, 0.08);
        }
        .notification-scope-tab.active strong {
            background: rgba(27, 105, 139, 0.12);
        }
        .notification-list {
            max-height: min(420px, 62vh);
            overflow-y: auto;
            display: grid;
            gap: 6px;
        }
        .notification-item {
            width: 100%;
            border: 1px solid transparent;
            border-radius: 12px;
            padding: 10px 12px;
            background: #fff;
            color: var(--text);
            text-align: left;
            cursor: pointer;
            display: grid;
            gap: 3px;
            transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
        }
        .notification-item:hover {
            background: #f7fbfd;
            border-color: rgba(104, 152, 173, 0.24);
            transform: translateY(-1px);
        }
        .notification-item.is-unread {
            background: linear-gradient(180deg, #f8fcfe 0%, #f2f9fc 100%);
            border-color: rgba(104, 152, 173, 0.2);
        }
        .notification-item strong {
            font-size: 0.78rem;
            line-height: 1.35;
        }
        .notification-item-meta,
        .notification-item-copy {
            display: block;
            line-height: 1.45;
        }
        .notification-item-meta {
            color: var(--muted);
            font-size: 0.69rem;
            font-weight: 700;
        }
        .notification-item-copy {
            color: var(--text);
            font-size: 0.73rem;
        }
        .notification-empty {
            padding: 14px 10px;
            border-radius: 12px;
            background: #f8fbfc;
            color: var(--muted);
            font-size: 0.74rem;
            font-weight: 700;
            text-align: center;
        }
        .user-chip {
            border: none;
            background: transparent;
            padding: 0;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
            box-shadow: none;
            flex: 0 0 auto;
        }
        .user-avatar {
            width: 38px;
            height: 38px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: linear-gradient(135deg, #8bb7ff 0%, #6898ad 100%);
            color: #fff;
            font-family: "Plus Jakarta Sans", sans-serif;
            font-weight: 800;
            font-size: 0.92rem;
            box-shadow: 0 10px 18px rgba(0, 51, 73, 0.14);
        }
        .user-chip-text { display: inline-flex; align-items: center; gap: 5px; text-align: left; white-space: nowrap; }
        .user-chip-text strong { font-size: 0.82rem; line-height: 1.1; white-space: nowrap; }
        .user-chip-text span { color: var(--muted); font-size: 0.78rem; font-weight: 700; white-space: nowrap; }
        .user-dropdown {
            position: absolute;
            top: calc(100% + 10px);
            right: 0;
            min-width: 210px;
            padding: 10px;
            border-radius: 0;
            background: rgba(255, 255, 255, 0.98);
            border: 1px solid var(--line-soft);
            box-shadow: 0 22px 30px rgba(0, 51, 73, 0.16);
            display: none;
            z-index: 1000;
        }
        .user-menu.open .user-dropdown { display: block; }
        .user-dropdown-head { padding: 4px 4px 10px; border-bottom: 1px solid var(--line-soft); margin-bottom: 8px; }
        .user-dropdown-head strong { display: block; margin-bottom: 4px; font-size: 0.82rem; }
        .user-dropdown-head span { color: var(--muted); font-size: 0.72rem; }
        .user-dropdown button {
            width: 100%;
            border: none;
            border-radius: 0;
            padding: 10px 12px;
            background: transparent;
            color: var(--text);
            text-align: left;
            font-weight: 700;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }
        .user-dropdown button:hover { background: #f5f9fb; }
        .user-dropdown-button-label {
            min-width: 0;
            white-space: nowrap;
        }
        .user-dropdown-count-badge {
            min-width: 22px;
            height: 22px;
            padding: 0 7px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(104, 152, 173, 0.14);
            color: #0f4f69;
            font-size: 0.72rem;
            font-weight: 800;
            line-height: 1;
            flex-shrink: 0;
        }
        .hero { display: block; margin-bottom: 10px; grid-column: 1 / span 4; position: relative; z-index: 6; }
        .panel {
            border: 1px solid rgba(255, 255, 255, 0.78); border-radius: var(--radius-lg); background: var(--panel);
            backdrop-filter: blur(14px); box-shadow: var(--shadow);
        }
        .hero-main { display: none; }
        .hero-side { padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; align-content: center; background: transparent; border: none; box-shadow: none; isolation: isolate; }
        .mini-stat {
            padding: 9px 10px; border-radius: 13px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 251, 253, 0.98) 100%);
            border: 1px solid var(--line-soft); min-height: 88px; display: grid; align-content: start; text-align: center;
        }
        .mini-stat:nth-child(1) { border-top: 3px solid var(--primary); }
        .mini-stat:nth-child(2) { border-top: 3px solid var(--accent); }
        .mini-stat:nth-child(3) { border-top: 3px solid var(--success); }
        .mini-stat:nth-child(4) { border-top: 3px solid var(--danger); }
        .mini-stat .label { display: block; margin-bottom: 5px; color: var(--muted); font-size: 0.76rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .mini-stat .value { font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.88rem; font-weight: 800; line-height: 1.02; }
        .mini-stat .hint { display: none; }
        .kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-bottom: 10px; grid-column: 5 / span 4; position: relative; z-index: 6; isolation: isolate; }
        .kpi-card {
            padding: 9px 10px; border-radius: 14px; background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 251, 253, 0.98) 100%);
            border: 1px solid rgba(255, 255, 255, 0.7); box-shadow: var(--shadow); min-height: 88px; text-align: center;
        }
        .kpi-card:nth-child(1) { border-top: 3px solid var(--info); }
        .kpi-card:nth-child(2) { border-top: 3px solid var(--primary); }
        .kpi-card:nth-child(3) { border-top: 3px solid var(--warn); }
        .kpi-card:nth-child(4) { border-top: 3px solid var(--danger); }
        .kpi-head { display: flex; justify-content: center; align-items: flex-start; gap: 10px; }
        .kpi-title { margin: 0; color: var(--muted); font-size: 0.76rem; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        .kpi-icon { width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center; font-size: 0.7rem; position: absolute; top: 10px; right: 10px; }
        .icon-info { background: var(--info-soft); color: var(--info); }
        .icon-safe { background: var(--primary-soft); color: var(--primary); }
        .icon-warn { background: var(--warn-soft); color: var(--warn); }
        .icon-danger { background: var(--danger-soft); color: var(--danger); }
        .kpi-value { margin: 5px 0 0; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.82rem; font-weight: 800; line-height: 1.02; }
        .kpi-foot { display: none; }
        .action-card {
            position: relative;
            cursor: pointer;
            overflow: visible;
            z-index: 0;
            transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease;
        }
        .action-card:hover {
            transform: translateY(-2px);
            border-color: rgba(104, 152, 173, 0.34);
            box-shadow: 0 18px 28px rgba(0, 51, 73, 0.1);
            z-index: 24;
        }
        .action-card:focus-visible { z-index: 24; }
        .summary-draggable.is-sortable { cursor: grab; }
        .summary-draggable.is-sortable:active { cursor: grabbing; }
        .summary-draggable.is-dragging {
            opacity: 0.72;
            transform: scale(0.985);
        }
        .summary-draggable.is-drop-target {
            outline: 2px dashed rgba(21, 91, 120, 0.35);
            outline-offset: 2px;
        }
        .action-card::before {
            content: attr(data-tooltip);
            position: fixed;
            left: 50%;
            top: 12px;
            right: auto;
            width: min(320px, calc(100vw - 32px));
            padding: 8px 10px;
            border-radius: 10px;
            background: rgba(0, 51, 73, 0.96);
            color: #fff;
            font-size: 0.67rem;
            font-weight: 700;
            line-height: 1.4;
            white-space: normal;
            opacity: 0;
            pointer-events: none;
            transform: translate(-50%, -4px);
            transition: opacity 0.16s ease, transform 0.16s ease;
            box-shadow: 0 12px 20px rgba(0, 51, 73, 0.22);
            z-index: 9999;
        }
        .hero .action-card::before,
        .kpi-grid .action-card::before {
            top: 12px;
        }
        .summary-draggable::before {
            display: none !important;
        }
        .action-card:hover::before,
        .action-card:focus-visible::before {
            opacity: 1;
            transform: translate(-50%, 0);
        }
        .action-card::after {
            content: "↗";
            position: absolute;
            top: 10px;
            right: 10px;
            width: 22px;
            height: 22px;
            display: grid;
            place-items: center;
            border-radius: 8px;
            background: #f2f7fa;
            color: var(--primary);
            font-size: 0.74rem;
            font-weight: 800;
            letter-spacing: 0;
        }
        .panel-flash {
            animation: panelFlash 1.15s ease;
        }
        @keyframes panelFlash {
            0% { box-shadow: 0 0 0 0 rgba(104, 152, 173, 0.28), var(--shadow); }
            40% { box-shadow: 0 0 0 10px rgba(104, 152, 173, 0.16), var(--shadow); }
            100% { box-shadow: 0 0 0 0 rgba(104, 152, 173, 0), var(--shadow); }
        }
        .section { display: none; animation: sectionIn 0.35s ease; }
        .section.active { display: block; min-height: 0; }
        #view-cal, #view-apply, #view-survey, #view-slot, #view-admin, #view-hr, #view-survey-insight, #view-lab { min-height: 0; height: auto; grid-column: 1 / -1; }
        #view-cal .content-grid, #view-apply .apply-wrap, #view-survey .survey-wrap, #view-slot, #view-slot .slot-wrap, #view-admin, #view-admin .admin-tools, #view-hr .hr-wrap, #view-survey-insight .hr-wrap, #view-lab .lab-wrap { min-height: 0; height: auto; }
        @keyframes sectionIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
        .content-grid { display: grid; grid-template-columns: minmax(0, 3.2fr) minmax(336px, 1fr); gap: 10px; min-height: 0; align-items: start; }
        .section-card { padding: 12px; }
        .section-header { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; }
        .section-title-with-action {
            display: flex;
            align-items: flex-start;
            gap: 8px;
            min-width: 0;
        }
        .section-icon-btn {
            width: 36px;
            height: 36px;
            min-width: 36px;
            padding: 0;
            border-radius: 12px;
            font-size: 1rem;
            line-height: 1;
            display: inline-flex;
            align-items: center;
            justify-content: center;
        }
        .section-home-btn {
            border-color: rgba(44, 93, 122, 0.18);
            background: linear-gradient(180deg, rgba(244, 250, 255, 0.98), rgba(230, 242, 250, 0.95));
            color: var(--accent);
            box-shadow: 0 8px 18px rgba(44, 93, 122, 0.12);
        }
        .section-title { margin: 0; font-size: 0.86rem; font-weight: 800; }
        .section-desc { margin: 2px 0 0; color: var(--muted); font-size: 0.67rem; }
        .section-toolbar {
            display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 8px; padding: 7px 9px;
            border: 1px solid var(--line-soft); border-radius: 14px; background: linear-gradient(180deg, #fafdff 0%, #ffffff 100%);
        }
        .legend-row, .toolbar-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
        .legend-item {
            display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 0.68rem; font-weight: 700;
        }
        .legend-dot {
            width: 10px; height: 10px; border-radius: 999px; display: inline-block;
        }
        .legend-safe { background: var(--success); }
        .legend-warn { background: var(--warn); }
        .legend-full { background: var(--danger); }
        .legend-expired { background: #8b5cf6; }
        .legend-selected { background: var(--primary); }
        .tag {
            display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; background: #fff;
            border: 1px solid var(--line-soft); color: var(--muted); font-size: 0.72rem; font-weight: 700;
        }
        .month-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 5px; margin-bottom: 8px; }
        .month-btn { border: 1px solid transparent; padding: 8px 8px; border-radius: 12px; cursor: pointer; text-align: center; transition: 0.2s ease; background: #f8fafc; min-width: 0; }
        .month-btn:hover { transform: translateY(-2px); border-color: var(--line); }
        .month-btn.active { border-color: rgba(15, 118, 110, 0.32); box-shadow: 0 16px 28px rgba(15, 118, 110, 0.12); }
        .month-btn strong { display: block; margin-bottom: 2px; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1.06rem; }
        .month-btn small { color: inherit; font-size: 0.61rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
        .st-none { color: #94a3b8; background: #f1f5f9; }
        .st-safe { color: #166534; background: #ecfdf3; }
        .st-warn { color: #b45309; background: #fff7ed; }
        .st-full { color: #b91c1c; background: #fef2f2; }
        .st-expired { color: #6d28d9; background: #f5f3ff; }
        .calendar-shell { border: 1px solid var(--line-soft); border-radius: 18px; overflow: hidden; background: #fff; display: grid; grid-template-rows: auto 1fr; min-height: 0; }
        .calendar-header { padding: 8px 10px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line-soft); }
        .calendar-nav { width: 34px; height: 34px; border-radius: 10px; border: 1px solid var(--line); background: #fff; cursor: pointer; color: var(--text); }
        .calendar-nav:hover { background: #f8fbfd; border-color: var(--primary); }
        .calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 1px; background: var(--line-soft); min-height: 0; }
        .day-label { padding: 7px 6px; background: #f8fbff; color: #475569; text-align: center; font-size: 0.74rem; font-weight: 800; }
        .day-cell { min-height: 82px; padding: 5px; background: #fff; cursor: pointer; transition: background 0.18s ease, box-shadow 0.18s ease; }
        .day-cell:hover { background: #fbfdff; }
        .day-cell.is-expired-day { background: #fffafb; cursor: not-allowed; }
        .day-cell.is-expired-day:hover { background: #fffafb; }
        .day-cell.is-today { box-shadow: inset 0 0 0 1px rgba(104, 152, 173, 0.28); }
        .day-cell.is-selected { box-shadow: inset 0 0 0 2px rgba(15, 76, 129, 0.18); background: #fafdff; }
        .day-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
        .day-num {
            display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 7px; border-radius: 999px;
            font-weight: 800; color: #64748b; background: #f8fafc; font-size: 0.74rem;
            position: relative;
        }
        .day-cell.is-expired-day .day-num {
            color: #64748b;
            background: #f8fafc;
            box-shadow: none;
        }
        .day-count { font-size: 0.62rem; color: var(--muted); font-weight: 700; }
        .day-events { display: grid; gap: 3px; }
        .day-inline-action {
            display: flex;
            justify-content: center;
            margin-top: 6px;
        }
        .day-inline-empty {
            display: grid;
            gap: 6px;
            justify-items: center;
            margin-top: 8px;
            padding: 8px 6px;
            border-radius: 10px;
            background: linear-gradient(180deg, rgba(238, 245, 250, 0.9) 0%, rgba(255, 255, 255, 0.98) 100%);
            border: 1px dashed rgba(104, 152, 173, 0.28);
        }
        .day-inline-note {
            color: var(--muted);
            font-size: 0.6rem;
            font-weight: 700;
            line-height: 1.3;
            text-align: center;
        }
        .day-inline-btn {
            border: none;
            border-radius: 999px;
            padding: 6px 10px;
            font-size: 0.6rem;
            font-weight: 800;
            cursor: pointer;
            color: #fff;
            background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
            box-shadow: 0 6px 14px rgba(15, 76, 129, 0.16);
            transition: transform 0.18s ease, box-shadow 0.18s ease;
        }
        .day-inline-btn:hover {
            transform: translateY(-1px);
            box-shadow: 0 8px 18px rgba(15, 76, 129, 0.22);
        }
        .slot-pill {
            display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 8px; color: #fff; cursor: pointer;
            font-size: 0.64rem; font-weight: 700; line-height: 1.1; min-height: 19px;
        }
        .slot-pill .store-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .slot-pill .slot-seats { opacity: 0.96; font-size: 0.6rem; font-weight: 700; white-space: nowrap; flex-shrink: 0; }
        .more-link {
            border: none; padding: 4px 6px; border-radius: 8px; background: #eef4fb; color: var(--primary); cursor: pointer;
            text-align: left; font-size: 0.62rem; font-weight: 800;
        }
        .empty-day { height: 54px; border-radius: 12px; background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%); }
        .bg-safe { background: linear-gradient(135deg, var(--success) 0%, #4ea973 100%); }
        .bg-warn { background: linear-gradient(135deg, #c6a05d 0%, var(--warn) 100%); }
        .bg-full { background: linear-gradient(135deg, var(--danger) 0%, #c95a79 100%); cursor: not-allowed; opacity: 0.86; }
        .bg-expired { background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); cursor: not-allowed; opacity: 0.88; }
        .side-stack { display: grid; grid-template-columns: 1fr; gap: 8px; min-height: 0; align-self: stretch; }
        .detail-panel { padding: 0; overflow: hidden; min-width: 0; }
        .detail-head { padding: 10px 12px 8px; border-bottom: 1px solid var(--line-soft); background: linear-gradient(180deg, #f9fbff 0%, #ffffff 100%); }
        .detail-head h3 { margin: 0; font-size: 0.9rem; }
        .detail-head p { margin: 4px 0 0; color: var(--muted); font-size: 0.74rem; }
        .detail-body { padding: 8px; display: grid; gap: 7px; overflow: auto; }
        .detail-item { padding: 10px 11px; border: 1px solid var(--line-soft); border-radius: 12px; background: #fff; }
        .detail-item-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 6px; }
        .detail-item h4 { margin: 0; font-size: 0.84rem; }
        .detail-item p { margin: 0; color: var(--muted); font-size: 0.72rem; line-height: 1.45; }
        .detail-item-meta-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
        .detail-item-meta-row p { flex: 1 1 auto; min-width: 0; }
        .detail-actions { display: flex; gap: 6px; margin-top: 0; flex-wrap: nowrap; justify-content: flex-end; flex: 0 0 auto; }
        .btn,
        .btn-main,
        .btn-danger,
        .btn-excel,
        .btn-ghost,
        .btn-mini,
        .btn-inline-confirm {
            border-radius: 12px;
            transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease, border-color 0.18s ease, filter 0.18s ease;
        }
        .btn-mini, .btn-ghost {
            border: 1px solid transparent; padding: 7px 9px; font-size: 0.7rem; font-weight: 800; cursor: pointer;
        }
        .btn-mini { color: #fff; background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%); box-shadow: 0 10px 18px rgba(0, 51, 73, 0.12); }
        .btn-ghost { color: var(--accent); background: linear-gradient(180deg, #f7fbfd 0%, #edf5f8 100%); border-color: rgba(104, 152, 173, 0.16); }
        .btn-soft {
            color: var(--accent);
            background: linear-gradient(180deg, #ffffff 0%, #f3f8fb 100%);
            border: 1px solid rgba(104, 152, 173, 0.16);
            box-shadow: 0 8px 18px rgba(0, 51, 73, 0.08);
        }
        .btn-danger-ghost {
            color: var(--danger);
            background: linear-gradient(180deg, #fff7fa 0%, #fff1f5 100%);
            border: 1px solid rgba(226, 105, 139, 0.18);
            box-shadow: 0 8px 18px rgba(226, 105, 139, 0.08);
        }
        .btn-ghost:hover,
        .btn-ghost:focus-visible {
            color: #ffffff;
            background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
            border-color: transparent;
            box-shadow: var(--shadow-soft);
            transform: translateY(-1px);
        }
        .btn-soft:hover,
        .btn-soft:focus-visible {
            color: #ffffff;
            background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
            border-color: transparent;
            box-shadow: var(--shadow-soft);
            transform: translateY(-1px);
        }
        .btn-danger-ghost:hover,
        .btn-danger-ghost:focus-visible {
            color: #ffffff;
            background: linear-gradient(135deg, #d96c8a 0%, #c9476f 100%);
            border-color: transparent;
            box-shadow: 0 12px 24px rgba(226, 105, 139, 0.18);
            transform: translateY(-1px);
        }
        .chart-box { height: 190px; }
        .insight-list { display: grid; gap: 8px; }
        .insight-item { padding: 10px 12px; border-radius: 12px; border: 1px solid var(--line-soft); background: #fff; }
        .insight-item strong { display: block; margin-bottom: 6px; }
        .insight-item span { color: var(--muted); font-size: 0.74rem; }
        .apply-wrap { display: grid; grid-template-columns: minmax(360px, 0.96fr) minmax(420px, 1.04fr); gap: 10px; align-items: stretch; }
        #confirmed-schedule-panel {
            margin-bottom: 14px;
            background: linear-gradient(145deg, rgba(219, 234, 254, 0.92), rgba(247, 251, 255, 0.98));
            border: 1px solid rgba(96, 165, 250, 0.2);
            border-radius: 18px;
            padding: 18px;
        }
        #confirmed-schedule-panel .section-desc {
            color: #4b6472;
        }
        #confirmed-schedule-panel .record-link-panel {
            margin-top: 0;
            background: rgba(255, 255, 255, 0.88);
            border-color: rgba(147, 197, 253, 0.26);
            box-shadow: 0 12px 28px rgba(37, 99, 235, 0.08);
        }
        #apply-form-panel {
            grid-column: 1 / 2;
            height: 100%;
        }
        #apply-slot-overview-panel {
            grid-column: 2 / 3;
            display: flex;
            flex-direction: column;
            height: 100%;
        }
        #my-app-panel {
            grid-column: 1 / -1;
        }
        .apply-wrap > .panel:last-child { grid-column: auto; }
        .apply-wrap > .apply-slot-overview-panel { width: 100%; min-width: 0; }
        #view-apply .apply-wrap > #apply-slot-overview-panel { width: 100%; min-width: 0; }
        .apply-wrap.apply-standalone {
            grid-template-columns: minmax(360px, 0.96fr) minmax(420px, 1.04fr);
            align-items: stretch;
        }
        .apply-wrap.password-standalone {
            grid-template-columns: minmax(360px, 620px);
            justify-content: center;
            max-width: 700px;
            margin: 0 auto;
        }
        @media (max-width: 1180px) {
            #apply-form-panel,
            #apply-slot-overview-panel,
            #my-app-panel {
                grid-column: 1 / -1;
            }
        }
        .apply-hero.is-password-focus {
            max-width: 620px;
            min-height: auto;
        }
        .survey-wrap { display: grid; grid-template-columns: 1fr; gap: 10px; align-items: start; }
        .survey-grid { display: grid; gap: 10px; align-content: start; min-width: 0; }
        .tab-row {
            display: inline-flex;
            align-items: center;
            flex-wrap: wrap;
            gap: 8px;
        }
        .tab-btn {
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            color: var(--muted);
            border-radius: 999px;
            padding: 8px 12px;
            font-size: 0.76rem;
            font-weight: 800;
            cursor: pointer;
            transition: border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, transform 0.18s ease;
        }
        .tab-btn:hover,
        .tab-btn:focus-visible {
            border-color: rgba(72, 136, 164, 0.3);
            color: var(--accent);
            background: #fff;
            box-shadow: var(--shadow-soft);
            transform: translateY(-1px);
        }
        .tab-btn.active {
            background: linear-gradient(135deg, #6d9eb6 0%, #0f4d69 100%);
            color: #fff;
            border-color: transparent;
            box-shadow: 0 12px 24px rgba(18, 73, 100, 0.18);
        }
        @media (max-width: 980px) {
            .store-mapping-grid {
                grid-template-columns: 1fr;
            }
            .store-mapping-summary {
                grid-template-columns: 1fr;
            }
        }
        .survey-tab-row {
            margin-top: 8px;
        }
        .survey-scope-row {
            margin-top: 8px;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
        }
        .survey-scope-row > span {
            color: var(--muted);
            font-size: 0.7rem;
            font-weight: 800;
        }
        .survey-scope-controls {
            display: inline-flex;
            align-items: center;
            gap: 4px;
            padding: 3px;
            border: 1px solid var(--line-soft);
            border-radius: 9px;
            background: #f7fafc;
        }
        .survey-scope-button {
            border: 1px solid transparent;
            border-radius: 6px;
            padding: 7px 10px;
            background: transparent;
            color: var(--muted);
            font: inherit;
            font-size: 0.7rem;
            font-weight: 800;
            cursor: pointer;
        }
        .survey-scope-button.active {
            border-color: rgba(174, 109, 27, 0.24);
            background: #fff;
            color: #8a5717;
            box-shadow: 0 3px 9px rgba(135, 83, 20, 0.08);
        }
        .survey-settings-tab-row {
            margin-bottom: 4px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
        }
        .survey-tab-row,
        .survey-settings-tab-row {
            padding: 8px;
            border-radius: 22px;
            background: linear-gradient(180deg, rgba(243, 248, 252, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%);
            border: 1px solid rgba(201, 214, 223, 0.8);
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
        }
        .survey-tab-row .tab-btn,
        .survey-settings-tab-row .tab-btn {
            min-width: 160px;
            padding: 14px 18px;
            border-radius: 16px;
            font-size: 0.92rem;
            font-weight: 800;
        }
        .survey-role-tab {
            position: relative;
            border: 1px solid var(--line-soft);
            background: #fff;
            transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease, color 0.2s ease, filter 0.2s ease;
            box-shadow: 0 4px 10px rgba(10, 31, 47, 0.04);
        }
        .survey-role-tab.is-trainee {
            color: #165b77;
            border-color: rgba(58, 128, 164, 0.26);
            background: linear-gradient(180deg, rgba(234, 245, 251, 0.98) 0%, rgba(250, 253, 255, 0.98) 100%);
        }
        .survey-role-tab.is-buddy {
            color: #8a5717;
            border-color: rgba(197, 132, 49, 0.28);
            background: linear-gradient(180deg, rgba(255, 244, 222, 0.98) 0%, rgba(255, 251, 245, 0.98) 100%);
        }
        .survey-role-tab.is-trainee.active {
            border-color: rgba(43, 109, 141, 0.42);
            background: linear-gradient(135deg, #155a77 0%, #3b8cb0 58%, #77b8d5 100%);
            box-shadow: 0 16px 30px rgba(28, 94, 121, 0.22), 0 0 0 3px rgba(58, 128, 164, 0.12);
            color: #fff;
        }
        .survey-role-tab.is-buddy.active {
            border-color: rgba(181, 112, 24, 0.42);
            background: linear-gradient(135deg, #8d5414 0%, #bf7a2f 58%, #e1b065 100%);
            box-shadow: 0 16px 30px rgba(159, 106, 30, 0.22), 0 0 0 3px rgba(197, 132, 49, 0.12);
            color: #fff;
        }
        .survey-settings-tab-buttons {
            display: flex;
            align-items: center;
            gap: 0;
            flex: 0 0 auto;
        }
        .admin-tab-row.survey-settings-tab-row {
            align-items: center;
            justify-content: space-between;
            overflow: visible;
        }
        .admin-tab-row.survey-settings-tab-row .survey-settings-last-saved {
            align-self: center;
            margin-left: auto;
        }
        .survey-role-tab:not(.active):hover {
            transform: translateY(-1px);
            filter: saturate(1.05);
        }
        .survey-note { margin-top: 12px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--line-soft); background: linear-gradient(180deg, #f7fbfd 0%, #ffffff 100%); color: var(--muted); font-size: 0.74rem; line-height: 1.6; }
        .survey-status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 8px; margin-top: 14px; }
        .survey-status-card { position: relative; overflow: hidden; padding: 12px; border-radius: 16px; border: 1px solid var(--line-soft); background: #fff; text-align: left; color: var(--text); }
        button.survey-status-card { appearance: none; font: inherit; cursor: pointer; }
        button.survey-status-card:disabled { cursor: default; opacity: 0.72; }
        button.survey-status-card:not(:disabled):hover { border-color: rgba(27, 105, 139, 0.45); box-shadow: 0 10px 20px rgba(19, 75, 102, 0.1); }
        .survey-status-card.is-trainee { border-color: rgba(58, 128, 164, 0.26); background: linear-gradient(180deg, rgba(236, 246, 251, 0.95) 0%, #ffffff 100%); }
        .survey-status-card.is-buddy { border-color: rgba(197, 132, 49, 0.28); background: linear-gradient(180deg, rgba(255, 247, 234, 0.95) 0%, #ffffff 100%); }
        .survey-status-card.is-alert { padding-right: 104px; animation: surveyAlertPulse 1.2s ease-out 1; }
        .survey-status-card.is-alert::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 5px; background: var(--primary); }
        .survey-status-card.is-trainee.is-alert { border-color: rgba(27, 105, 139, 0.58); background: linear-gradient(180deg, rgba(216, 239, 249, 0.98) 0%, #ffffff 100%); box-shadow: 0 12px 26px rgba(27, 105, 139, 0.12); }
        .survey-status-card.is-buddy.is-alert { border-color: rgba(186, 105, 21, 0.58); background: linear-gradient(180deg, rgba(255, 237, 205, 0.98) 0%, #ffffff 100%); box-shadow: 0 12px 26px rgba(186, 105, 21, 0.12); }
        .survey-status-card.is-buddy.is-alert::before { background: #b86915; }
        .survey-status-card span { color: var(--muted); font-size: 0.72rem; font-weight: 800; }
        .survey-status-card strong { display: block; margin-top: 4px; font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif; font-size: 1.3rem; line-height: 1; }
        .survey-status-card.is-alert strong { color: var(--primary); font-size: 1.58rem; }
        .survey-status-card.is-buddy.is-alert strong { color: #9b5d13; }
        .survey-status-card small { display: block; margin-top: 8px; color: var(--muted); font-size: 0.68rem; line-height: 1.35; }
        .survey-status-alert-badge { position: absolute; top: 12px; right: 12px; padding: 5px 8px; border-radius: 999px; background: var(--primary); color: #fff; font-style: normal; font-size: 0.66rem; font-weight: 900; line-height: 1; box-shadow: 0 8px 16px rgba(27, 105, 139, 0.22); }
        .survey-status-card.is-buddy .survey-status-alert-badge { background: #b86915; box-shadow: 0 8px 16px rgba(186, 105, 21, 0.22); }
        @keyframes surveyAlertPulse {
            0% { box-shadow: 0 0 0 0 rgba(27, 105, 139, 0.22); }
            70% { box-shadow: 0 0 0 8px rgba(27, 105, 139, 0); }
            100% { box-shadow: 0 12px 26px rgba(27, 105, 139, 0.12); }
        }
        .survey-pending-list { margin-top: 12px; padding: 12px; border-radius: 16px; border: 1px solid var(--line-soft); background: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75); }
        .survey-pending-list-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
        .survey-pending-list-head strong { font-size: 0.86rem; }
        .survey-pending-items { display: grid; gap: 8px; }
        .survey-pending-item { width: 100%; padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(190, 210, 222, 0.9); background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%); color: var(--text); text-align: left; cursor: pointer; display: grid; gap: 4px; }
        .survey-pending-item:hover { border-color: rgba(27, 105, 139, 0.45); box-shadow: 0 8px 18px rgba(19, 75, 102, 0.08); }
        .survey-pending-item span { font-size: 0.8rem; font-weight: 800; }
        .survey-pending-item small { color: var(--muted); font-size: 0.7rem; }
        .survey-meta-card { padding: 12px; border-radius: 16px; border: 1px solid var(--line-soft); background: #f9fbfd; display: grid; gap: 6px; margin-bottom: 12px; }
        .survey-meta-card strong { font-size: 0.86rem; }
        .survey-meta-card span { color: var(--muted); font-size: 0.73rem; }
        .survey-meta-rows { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 10px; }
        .survey-meta-row { min-width: 0; display: grid; gap: 2px; }
        .survey-meta-row span { color: var(--muted); font-size: 0.67rem; font-weight: 800; }
        .survey-meta-row strong { overflow-wrap: anywhere; font-size: 0.76rem; line-height: 1.35; }
        .survey-meta-card.is-trainee {
            border-color: rgba(58, 128, 164, 0.2);
            background: linear-gradient(180deg, rgba(236, 246, 251, 0.95) 0%, #ffffff 100%);
        }
        .survey-meta-card.is-buddy {
            border-color: rgba(197, 132, 49, 0.22);
            background: linear-gradient(180deg, rgba(255, 247, 234, 0.96) 0%, #ffffff 100%);
        }
        .survey-field-stack { display: grid; gap: 18px; }
        .survey-question-list { display: grid; gap: 10px; }
        .survey-group {
            display: grid;
            gap: 12px;
            padding: 14px;
            border: 1px solid rgba(104, 152, 173, 0.2);
            border-radius: 18px;
            background: linear-gradient(180deg, rgba(247, 251, 253, 0.98) 0%, rgba(255, 255, 255, 0.995) 100%);
            box-shadow: inset 4px 0 0 rgba(58, 128, 164, 0.36), 0 8px 18px rgba(7, 40, 60, 0.025);
        }
        .survey-group-head {
            display: flex;
            align-items: center;
            min-width: 0;
        }
        .survey-group-head strong {
            display: flex;
            align-items: center;
            width: 100%;
            min-width: 0;
            padding: 9px 12px;
            border-radius: 13px;
            background: #f5f9fb;
            color: var(--primary);
            font-size: 0.8rem;
            font-weight: 900;
            line-height: 1.35;
        }
        .survey-group.is-trainee {
            border-color: rgba(58, 128, 164, 0.22);
            background: linear-gradient(180deg, rgba(235, 247, 252, 0.9) 0%, rgba(255, 255, 255, 0.995) 100%);
            box-shadow: inset 4px 0 0 rgba(58, 128, 164, 0.42), 0 8px 18px rgba(7, 40, 60, 0.025);
        }
        .survey-group.is-trainee .survey-group-head strong {
            background: rgba(58, 128, 164, 0.13);
            color: #1c5e79;
        }
        .survey-group.is-buddy {
            border-color: rgba(197, 132, 49, 0.24);
            background: linear-gradient(180deg, rgba(255, 247, 234, 0.9) 0%, rgba(255, 255, 255, 0.995) 100%);
            box-shadow: inset 4px 0 0 rgba(197, 132, 49, 0.44), 0 8px 18px rgba(70, 41, 8, 0.025);
        }
        .survey-group.is-buddy .survey-group-head strong {
            background: rgba(197, 132, 49, 0.14);
            color: #8a5a18;
        }
        .survey-question { padding: 12px; border-radius: 14px; border: 1px solid var(--line-soft); background: rgba(255, 255, 255, 0.92); }
        .survey-question.is-trainee {
            border-color: rgba(58, 128, 164, 0.15);
            box-shadow: inset 0 0 0 1px rgba(58, 128, 164, 0.025);
        }
        .survey-question.is-buddy {
            border-color: rgba(197, 132, 49, 0.16);
            box-shadow: inset 0 0 0 1px rgba(197, 132, 49, 0.03);
        }
        .survey-question.is-invalid {
            border-color: #d45858 !important;
            background: #fff8f8;
            box-shadow: inset 4px 0 0 #d45858, 0 8px 18px rgba(150, 42, 42, 0.08);
        }
        .survey-question p, .survey-question label { display: block; margin: 0 0 8px; font-size: 0.78rem; font-weight: 700; line-height: 1.5; }
        .survey-choice-row { display: flex; flex-wrap: wrap; gap: 8px 10px; }
        .survey-choice { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; border: 1px solid var(--line-soft); background: #f9fbfd; color: var(--text); font-size: 0.74rem; font-weight: 700; }
        .survey-question.is-invalid .survey-choice {
            border-color: rgba(212, 88, 88, 0.42);
            background: #fff;
        }
        .survey-choice input { margin: 0; }
        .survey-question input[type="text"],
        .survey-question select { width: 100%; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--line); font: inherit; color: var(--text); background: #fff; }
        .survey-question textarea { width: 100%; min-height: 96px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--line); resize: vertical; }
        .survey-question.is-invalid input[type="text"],
        .survey-question.is-invalid select,
        .survey-question.is-invalid textarea {
            border-color: rgba(212, 88, 88, 0.7);
        }
        .survey-question-error {
            margin-top: 9px;
            color: #b42318;
            font-size: 0.74rem;
            font-weight: 800;
            line-height: 1.45;
        }
        .field.is-invalid input,
        .field.is-invalid select,
        .field.is-invalid textarea {
            border-color: rgba(212, 88, 88, 0.7) !important;
            background: #fff8f8;
        }
        .survey-field-error {
            margin-top: 7px;
            color: #b42318;
            font-size: 0.74rem;
            font-weight: 800;
            line-height: 1.45;
        }
        .survey-ranking-list { display: grid; gap: 8px; }
        .survey-ranking-item { display: grid; grid-template-columns: minmax(0, 1fr) 96px; gap: 10px; align-items: center; }
        .survey-ranking-item strong { font-size: 0.76rem; color: var(--text); }
        .survey-matrix-wrap { overflow-x: auto; }
        .survey-matrix-table { width: 100%; min-width: 320px; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line-soft); border-radius: 14px; overflow: hidden; background: #fff; }
        .survey-matrix-table th, .survey-matrix-table td { padding: 10px 8px; font-size: 0.72rem; text-align: center; border-bottom: 1px solid var(--line-soft); border-right: 1px solid var(--line-soft); }
        .survey-matrix-table th:first-child, .survey-matrix-table td:first-child { text-align: left; min-width: 96px; font-weight: 700; }
        .survey-matrix-table tr:last-child td { border-bottom: none; }
        .survey-matrix-table th:last-child, .survey-matrix-table td:last-child { border-right: none; }
        .survey-form-actions { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
        .survey-draft-status {
            min-height: 18px;
            color: var(--muted);
            font-size: 0.7rem;
            font-weight: 700;
            line-height: 1.4;
        }
        .survey-draft-status.is-saved {
            color: #246b4b;
        }
        .survey-draft-status.is-error {
            color: #b42318;
        }
        @media (max-width: 640px) {
            .survey-scope-row {
                align-items: stretch;
                justify-content: space-between;
            }
            .survey-scope-controls {
                flex: 1 1 auto;
            }
            .survey-scope-button {
                flex: 1 1 0;
            }
            .survey-form-actions {
                align-items: stretch;
            }
            .survey-draft-status {
                width: 100%;
            }
            .survey-form-actions .btn-main {
                width: 100%;
            }
        }
        .survey-empty { padding: 18px 14px; border-radius: 16px; border: 1px dashed var(--line); background: #fbfdff; color: var(--muted); font-size: 0.76rem; line-height: 1.6; }
        .apply-hero { padding: 16px; color: #fff; background: linear-gradient(145deg, rgba(0, 51, 73, 0.98), rgba(104, 152, 173, 0.92)), #0f172a; }
        .apply-hero h2 { margin: 0 0 8px; font-size: 1.05rem; }
        .apply-hero p { margin: 0 0 12px; color: rgba(255, 255, 255, 0.82); line-height: 1.5; font-size: 0.76rem; }
        .apply-hero .metric-chip {
            background: rgba(255, 255, 255, 0.14);
            border-color: rgba(255, 255, 255, 0.18);
            color: rgba(255, 255, 255, 0.86);
        }
        .apply-hero .metric-chip strong {
            color: #ffffff;
        }
        .apply-hero .btn-ghost {
            background: rgba(255, 255, 255, 0.96);
            color: var(--accent);
        }
        .form-card { padding: 12px; background: #fff; min-height: 0; overflow: hidden; }
        .form-grid { display: grid; gap: 10px; }
        #admin-slot-form-panel .section-desc {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            font-size: 0.64rem;
        }
        #admin-slot-form-panel .form-grid {
            gap: 8px;
        }
        #admin-slot-form-panel .slot-form-actions {
            grid-column: 1 / -1;
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
            margin-top: 4px;
        }
        #admin-slot-form-panel .slot-form-actions .btn-main,
        #admin-slot-form-panel .slot-form-actions .btn-ghost {
            min-height: 42px;
            padding: 0 18px;
            border-radius: 12px;
            font-weight: 800;
        }
        #admin-slot-form-panel .field {
            display: grid;
            grid-template-columns: 92px minmax(0, 1fr);
            align-items: start;
            column-gap: 10px;
            row-gap: 4px;
        }
        #admin-slot-form-panel .field label {
            margin: 0;
            padding-top: 8px;
            color: #334155;
            font-weight: 700;
            font-size: 0.74rem;
        }
        #admin-slot-form-panel .field > input,
        #admin-slot-form-panel .field > select,
        #admin-slot-form-panel .field > textarea,
        #admin-slot-form-panel .field > p.helper-text,
        #admin-slot-form-panel .field > .slot-file-input-row,
        #admin-slot-form-panel .field > .slot-attachment-inline {
            grid-column: 2;
        }
        .slot-file-input-row {
            min-height: 42px;
            display: flex;
            align-items: center;
            gap: 8px;
            padding: 10px 12px;
            border-radius: 12px;
            border: 1px solid var(--line);
            background: #fff;
        }
        #admin-slot-attachment {
            position: absolute;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }
        .slot-file-button {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 30px;
            padding: 0 10px;
            border-radius: 8px;
            border: 1px solid var(--line);
            background: #f8fafc;
            color: var(--text);
            font-size: 0.72rem;
            font-weight: 800;
            cursor: pointer;
        }
        #admin-slot-form-panel .slot-file-button {
            margin: 0;
            padding: 0 10px;
            color: var(--text);
            font-size: 0.72rem;
            line-height: 1;
        }
        #admin-bbm-required-info,
        #admin-bbm-deadline {
            display: none !important;
        }
        #admin-slot-form-panel textarea,
        #admin-preparation-notes,
        #admin-pre-guide-notes {
            width: 100%;
            min-width: 0;
            min-height: 108px;
            padding: 12px 14px;
            border-radius: 18px;
            border: 1px solid var(--line);
            background: #fff;
            color: var(--text);
            resize: vertical;
            font: inherit;
            box-sizing: border-box;
            display: block;
            appearance: none;
        }
        #admin-preparation-notes {
            min-height: 84px;
            max-height: 84px;
            padding: 8px 9px;
            border-radius: 12px;
            overflow-y: auto;
            resize: none;
        }
        #admin-pre-guide-notes {
            min-height: 84px;
            max-height: 84px;
            padding: 8px 9px;
            border-radius: 12px;
            overflow-y: auto;
            resize: none;
        }
        #admin-slot-form-panel .field > p.helper-text {
            margin: 1px 0 0;
            font-size: 0.64rem;
            line-height: 1.4;
        }
        #admin-slot-form-panel textarea:focus,
        #admin-slot-form-panel input[type="url"]:focus,
        #admin-slot-form-panel input[type="date"]:focus,
        #admin-slot-form-panel input[type="file"]:focus {
            outline: none;
            border-color: rgba(72, 136, 164, 0.45);
            box-shadow: 0 0 0 4px rgba(72, 136, 164, 0.12);
        }
        .slot-attachment-inline {
            display: flex;
            flex-direction: column;
            gap: 8px;
        }
        .slot-attachment-list {
            display: flex;
            flex-direction: column;
            gap: 8px;
            width: 100%;
        }
        .slot-attachment-chip {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 10px;
            padding: 10px 12px 10px 14px;
            border-radius: 14px;
            border: 1px solid rgba(104, 152, 173, 0.18);
            background: linear-gradient(180deg, #fbfdff 0%, #f6fbff 100%);
            min-width: 0;
            width: 100%;
            max-width: 100%;
            flex: 1 1 auto;
            box-sizing: border-box;
        }
        .slot-attachment-chip > :first-child {
            min-width: 0;
            flex: 1 1 auto;
        }
        .slot-attachment-chip.is-removed {
            background: linear-gradient(180deg, #fff8f4 0%, #fff4ec 100%);
            border-color: rgba(220, 164, 120, 0.28);
        }
        .slot-attachment-chip-draft {
            background: linear-gradient(180deg, #fcfefe 0%, #f2fbf8 100%);
            border-color: rgba(66, 153, 120, 0.18);
        }
        .slot-attachment-chip strong {
            display: block;
            font-size: 0.76rem;
            color: var(--text);
            font-weight: 400;
            line-height: 1.45;
            word-break: break-word;
        }
        .slot-attachment-chip small,
        .slot-attachment-empty {
            color: var(--muted);
            font-size: 0.68rem;
        }
        .slot-attachment-empty {
            padding: 8px 2px 0;
        }
        .slot-attachment-actions {
            display: flex;
            gap: 4px;
            align-items: center;
            flex: 0 0 auto;
        }
        .slot-attachment-remove-btn {
            width: 28px;
            height: 28px;
            border: 1px solid rgba(148, 163, 184, 0.22);
            border-radius: 999px;
            background: #fff;
            color: #94a3b8;
            font-size: 1rem;
            line-height: 1;
            font-weight: 700;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            transition: transform 0.16s ease, box-shadow 0.18s ease, border-color 0.18s ease, color 0.18s ease, background-color 0.18s ease;
        }
        .slot-attachment-remove-btn:hover,
        .slot-attachment-remove-btn:focus-visible {
            color: #e2698b;
            border-color: rgba(226, 105, 139, 0.32);
            background: #fff6f8;
            box-shadow: 0 8px 18px rgba(226, 105, 139, 0.12);
            transform: translateY(-1px);
            outline: none;
        }
        .slot-attachment-footnote {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            flex-wrap: wrap;
        }
        .slot-attachment-empty-note {
            color: var(--muted);
            font-size: 0.68rem;
        }
        .mode-banner {
            display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; margin-bottom: 12px;
            border: 1px solid var(--line-soft); border-radius: 14px; background: linear-gradient(180deg, #f8fcff 0%, #ffffff 100%);
        }
        .mode-banner strong { display: block; font-size: 0.78rem; }
        .mode-banner span { color: var(--muted); font-size: 0.7rem; }
        .helper-text { margin: 3px 0 0; color: var(--muted); font-size: 0.68rem; line-height: 1.45; }
        .table-caption {
            margin-bottom: 8px; padding: 8px 10px; border-radius: 12px; background: #f7fafc; color: var(--muted); font-size: 0.7rem; font-weight: 700;
        }
        .field label { display: block; margin-bottom: 5px; color: #334155; font-weight: 700; font-size: 0.76rem; }
        .field input, .field select {
            width: 100%; border: 1px solid var(--line); border-radius: 12px; background: #fff; padding: 8px 9px; color: var(--text); outline: none;
            transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
        }
        .field input:hover, .field select:hover { border-color: rgba(104, 152, 173, 0.36); }
        .field input:focus, .field select:focus { border-color: rgba(104, 152, 173, 0.56); box-shadow: 0 0 0 3px rgba(104, 152, 173, 0.14); background: #fff; }
        .btn-main, .btn-danger, .btn-excel {
            border: 1px solid transparent; padding: 8px 10px; font-weight: 800; cursor: pointer;
        }
        .btn-main { color: #fff; background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%); box-shadow: 0 12px 24px rgba(0, 51, 73, 0.18); }
        .btn-main:hover, .btn-main:focus-visible,
        .btn-excel:hover, .btn-excel:focus-visible,
        .btn-danger:hover, .btn-danger:focus-visible {
            color: #ffffff;
            transform: translateY(-1px);
            box-shadow: var(--shadow-hover);
        }
        .btn-danger { color: var(--danger); background: linear-gradient(180deg, #fff5f8 0%, var(--danger-soft) 100%); border-color: rgba(226, 105, 139, 0.16); }
        .btn-danger:hover,
        .btn-danger:focus-visible {
            color: #ffffff;
            background: linear-gradient(135deg, #d96c8a 0%, #c9476f 100%);
            border-color: transparent;
        }
        .btn-excel { color: #fff; background: linear-gradient(135deg, var(--accent) 0%, var(--primary) 100%); box-shadow: 0 12px 24px rgba(0, 51, 73, 0.16); }
        .table-export-btn {
            white-space: nowrap;
            padding: 8px 10px;
            font-size: 0.72rem;
        }
        .btn-main:disabled, .btn-mini:disabled {
            cursor: not-allowed; opacity: 0.45; box-shadow: none;
        }
        .slot-wrap { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, 0.85fr); gap: 10px; align-items: stretch; }
        .slot-summary-card { min-height: 100%; display: flex; flex-direction: column; }
        .slot-summary-list { display: grid; gap: 10px; }
        .slot-summary-item { border: 1px solid var(--line); border-radius: 14px; padding: 12px; background: linear-gradient(180deg, #fbfdfe 0%, #f7fbff 100%); }
        .slot-summary-item strong { display: block; font-size: 0.88rem; margin-bottom: 4px; }
        .slot-summary-item span { display: block; color: var(--muted); font-size: 0.76rem; line-height: 1.5; }
        #my-slot-panel .table-wrap { overflow-x: auto; flex: 1 1 auto; min-height: 0; max-height: 620px; }
        #view-slot .table-wrap { max-height: 320px; }
        .card { padding: 14px; }
        .visually-hidden {
            position: absolute !important;
            width: 1px;
            height: 1px;
            padding: 0;
            margin: -1px;
            overflow: hidden;
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border: 0;
        }
        .role-pill {
            display: inline-flex;
            align-items: center;
            padding: 6px 10px;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 800;
        }
        .role-admin { color: #0f4c81; background: #e8f2ff; }
        .role-manager { color: #9a6700; background: #fff4d8; }
        .role-user { color: var(--muted); background: #f1f5f9; }
        .role-bbm { color: #047857; background: #dff8eb; }
        .status-active { color: #166534; background: #ecfdf3; }
        .status-inactive { color: #92400e; background: #fff7ed; }
        .status-suspended { color: #b91c1c; background: #fef2f2; }
        .perm-list { display: flex; gap: 6px; flex-wrap: wrap; }
        .perm-pill {
            display: inline-flex;
            align-items: center;
            padding: 5px 8px;
            border-radius: 999px;
            font-size: 0.68rem;
            font-weight: 800;
            background: #f1f5f9;
            color: var(--muted);
        }
        .perm-pill.active { background: #e8f2ff; color: #0f4c81; }
        .member-permission-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
            margin-top: 12px;
        }
        .member-permission-item {
            display: flex;
            align-items: flex-start;
            gap: 10px;
            min-height: 68px;
            padding: 12px 13px;
            border: 1px solid #d9e6f1;
            border-radius: 14px;
            background: #fbfdff;
            cursor: pointer;
            transition: border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
        }
        .member-permission-item:hover {
            border-color: rgba(15, 76, 129, 0.26);
            background: #f6fbff;
        }
        .member-permission-item.is-active {
            border-color: rgba(15, 76, 129, 0.24);
            background: #eef7ff;
        }
        .member-permission-item.is-locked {
            opacity: 0.7;
            cursor: default;
            background: #f8fafc;
        }
        .member-permission-item input[type="checkbox"] {
            margin-top: 2px;
            width: 16px;
            height: 16px;
            flex: 0 0 auto;
        }
        .member-permission-copy {
            display: flex;
            flex-direction: column;
            gap: 4px;
            min-width: 0;
        }
        .member-permission-copy strong {
            font-size: 0.78rem;
            font-weight: 800;
            color: var(--text);
            line-height: 1.15;
        }
        .member-permission-copy span {
            font-size: 0.68rem;
            color: var(--muted);
            line-height: 1.35;
        }
        .member-actions .btn-ghost,
        .member-actions .btn-danger,
        .table-field,
        .table-select {
            width: 100%;
            min-width: 92px;
            border: 1px solid var(--line);
            border-radius: 10px;
            background: #fff;
            color: var(--text);
            padding: 7px 9px;
            font-size: 0.72rem;
            font-weight: 700;
        }
        .table-field[readonly] {
            background: #f8fbff;
            color: var(--muted);
            cursor: default;
        }
        .table-field:focus,
        .table-select:focus {
            border-color: rgba(104, 152, 173, 0.56);
            box-shadow: 0 0 0 3px rgba(104, 152, 173, 0.14);
            outline: none;
        }
        .row-muted { opacity: 0.58; }
        .user-badge {
            display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--line-soft);
            color: var(--muted); font-size: 0.8rem; font-weight: 800;
        }
        .user-badge.online { color: var(--primary); background: var(--primary-soft); border-color: transparent; }
        .register-panel {
            margin-top: 12px;
            padding: 12px;
            border-radius: 14px;
            background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
            border: 1px solid var(--line-soft);
        }
        .register-panel[hidden] { display: none; }
        .register-head { margin-bottom: 10px; }
        .register-head strong { display: block; margin-bottom: 4px; font-size: 0.82rem; }
        .register-head span { color: var(--muted); font-size: 0.7rem; line-height: 1.45; }
        .user-tools.is-locked { opacity: 0.54; }
        .locked-note {
            margin-bottom: 10px;
            padding: 10px 12px;
            border-radius: 12px;
            background: #f8fbff;
            border: 1px solid var(--line-soft);
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 700;
        }
        .metric-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
        .metric-chip { padding: 10px; border-radius: 12px; background: #f8fafc; border: 1px solid var(--line-soft); font-size: 0.72rem; }
        .metric-chip strong { display: block; margin-top: 4px; font-family: "Plus Jakarta Sans", sans-serif; font-size: 1rem; }
        .section-header-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
        }
        #admin-slot-form-panel .section-header {
            align-items: flex-start;
        }
        #admin-slot-form-panel .section-header-actions {
            flex-wrap: wrap;
            flex: 0 1 auto;
            overflow: visible;
            max-width: 100%;
            padding-bottom: 0;
            gap: 10px;
            justify-content: flex-end;
        }
        #admin-slot-form-panel .section-header-actions .btn-main,
        #admin-slot-form-panel .section-header-actions .btn-ghost {
            min-height: 36px;
            padding: 0 14px;
            border-radius: 12px;
            font-size: 0.72rem;
            font-weight: 800;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 auto;
            white-space: nowrap;
        }
        .action-menu {
            position: relative;
            display: inline-flex;
        }
        .action-menu summary {
            list-style: none;
        }
        .action-menu summary::-webkit-details-marker {
            display: none;
        }
        .action-menu-trigger {
            cursor: pointer;
        }
        .action-menu-panel {
            position: absolute;
            top: calc(100% + 8px);
            right: 0;
            min-width: 164px;
            display: grid;
            gap: 8px;
            padding: 10px;
            border-radius: 14px;
            border: 1px solid var(--line-soft);
            background: #fff;
            box-shadow: var(--shadow);
            z-index: 12;
        }
        .action-menu-panel .btn-ghost,
        .action-menu-panel .btn-main,
        .action-menu-panel .btn-danger,
        .action-menu-panel .btn-excel {
            width: 100%;
            justify-content: flex-start;
        }
        .section-header-actions .btn-excel,
        .section-header-actions .btn-ghost,
        .section-header-actions .btn-danger,
        .section-kicker:empty {
            border: 1px solid rgba(226, 105, 139, 0.22);
            background: linear-gradient(180deg, #fff8fb 0%, #ffffff 100%);
        }
        .section-header-actions .btn-excel,
        .section-header-actions .btn-ghost,
        .section-header-actions .btn-danger {
            color: #b64866;
        }
        .section-header-actions .btn-excel:hover,
        .section-header-actions .btn-excel:focus-visible,
        .section-header-actions .btn-ghost:hover,
        .section-header-actions .btn-ghost:focus-visible,
        .section-header-actions .btn-danger:hover,
        .section-header-actions .btn-danger:focus-visible {
            color: #ffffff;
        }
        .section-header-actions .btn-main {
            border: none;
            background: linear-gradient(135deg, var(--primary) 0%, var(--accent) 100%);
            color: #fff;
        }
        .settings-grid { display: grid; gap: 10px; }
        #admin-deadline-settings-panel .section-header {
            margin-bottom: 8px;
        }
        #admin-deadline-settings-panel .deadline-policy-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }
        #admin-deadline-settings-panel .setting-item {
            min-height: 76px;
            padding: 12px 14px;
            border-radius: 14px;
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
        }
        #admin-deadline-settings-panel .setting-item-wide {
            grid-column: 1 / -1;
        }
        #admin-deadline-settings-panel .setting-copy strong {
            margin-bottom: 3px;
            font-size: 0.86rem;
            color: var(--text);
        }
        #admin-deadline-settings-panel .setting-copy span {
            font-size: 0.7rem;
            line-height: 1.35;
        }
        #admin-deadline-settings-panel .deadline-rule-input {
            gap: 8px;
            padding: 6px 8px;
            border: 1px solid rgba(104, 152, 173, 0.18);
            border-radius: 999px;
            background: #fff;
        }
        #admin-deadline-settings-panel .deadline-prefix {
            color: var(--primary);
            font-size: 0.74rem;
            font-weight: 900;
            white-space: nowrap;
        }
        #admin-deadline-settings-panel .setting-toggle input.setting-number-input {
            width: 58px;
            min-height: 30px;
            padding: 5px 8px;
            border-radius: 10px;
            text-align: center;
            font-weight: 900;
            -moz-appearance: textfield;
        }
        #admin-deadline-settings-panel .setting-toggle input.setting-number-input::-webkit-outer-spin-button,
        #admin-deadline-settings-panel .setting-toggle input.setting-number-input::-webkit-inner-spin-button {
            margin: 0;
            -webkit-appearance: none;
        }
        #admin-deadline-settings-panel .setting-state {
            min-width: auto;
            font-size: 0.74rem;
            text-align: left;
            white-space: nowrap;
        }
        .slot-registration-defaults-section {
            margin-top: 18px;
            padding-top: 16px;
            border-top: 1px solid var(--line-soft);
        }
        .slot-defaults-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
        }
        .slot-default-card {
            display: grid;
            gap: 7px;
            padding: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 12px;
            background: #fff;
        }
        .slot-default-card > strong {
            color: #12364a;
            font-size: 0.84rem;
        }
        .slot-default-card label {
            margin-top: 2px;
            color: #475569;
            font-size: 0.72rem;
            font-weight: 800;
        }
        .slot-default-card textarea {
            min-height: 74px;
            resize: vertical;
        }
        @media (max-width: 900px) {
            #admin-deadline-settings-panel .deadline-policy-grid {
                grid-template-columns: 1fr;
            }
            .slot-defaults-grid {
                grid-template-columns: 1fr;
            }
        }
        .survey-settings-shell { display: grid; gap: 12px; }
        .survey-settings-shell.is-trainee {
            --survey-role-bg: rgba(236, 246, 251, 0.95);
            --survey-role-border: rgba(58, 128, 164, 0.2);
            --survey-role-accent: #1c5e79;
            --survey-role-soft: rgba(58, 128, 164, 0.1);
            --survey-title-bg: linear-gradient(180deg, rgba(202, 228, 241, 0.99) 0%, rgba(231, 244, 251, 0.99) 100%);
            --survey-title-border: rgba(23, 98, 133, 0.44);
            --survey-title-accent: #0f5b7a;
            --survey-title-soft: rgba(23, 98, 133, 0.22);
            --survey-group-bg: linear-gradient(180deg, rgba(231, 244, 251, 0.98) 0%, rgba(245, 250, 253, 0.99) 100%);
            --survey-group-border: rgba(46, 129, 167, 0.3);
            --survey-group-accent: #2f7596;
            --survey-group-soft: rgba(46, 129, 167, 0.16);
            --survey-question-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.995) 0%, rgba(251, 254, 255, 0.995) 100%);
            --survey-question-border: rgba(86, 151, 181, 0.18);
            --survey-question-accent: #4d8eae;
            --survey-question-soft: rgba(86, 151, 181, 0.09);
        }
        .survey-settings-shell.is-buddy {
            --survey-role-bg: rgba(255, 247, 234, 0.98);
            --survey-role-border: rgba(197, 132, 49, 0.24);
            --survey-role-accent: #8a5a18;
            --survey-role-soft: rgba(197, 132, 49, 0.12);
            --survey-title-bg: linear-gradient(180deg, rgba(255, 228, 184, 0.99) 0%, rgba(255, 244, 221, 0.99) 100%);
            --survey-title-border: rgba(157, 95, 18, 0.46);
            --survey-title-accent: #8d5414;
            --survey-title-soft: rgba(157, 95, 18, 0.22);
            --survey-group-bg: linear-gradient(180deg, rgba(255, 244, 221, 0.99) 0%, rgba(255, 250, 244, 0.995) 100%);
            --survey-group-border: rgba(201, 136, 53, 0.32);
            --survey-group-accent: #aa6a23;
            --survey-group-soft: rgba(201, 136, 53, 0.16);
            --survey-question-bg: linear-gradient(180deg, rgba(255, 255, 255, 0.995) 0%, rgba(255, 252, 247, 0.995) 100%);
            --survey-question-border: rgba(215, 159, 88, 0.2);
            --survey-question-accent: #c18439;
            --survey-question-soft: rgba(215, 159, 88, 0.09);
        }
        .survey-settings-note {
            padding: 12px 14px;
            border-radius: 16px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #f8fbfd 0%, #ffffff 100%);
            color: var(--muted);
            font-size: 0.77rem;
            line-height: 1.65;
        }
        .survey-settings-status-row {
            display: grid;
            gap: 8px;
        }
        .survey-settings-save-state {
            padding: 11px 14px;
            border-radius: 14px;
            border: 1px solid var(--line-soft);
            background: #f8fbfd;
            color: var(--muted);
            font-size: 0.77rem;
            font-weight: 700;
            line-height: 1.55;
        }
        .survey-settings-save-state[hidden] {
            display: none;
        }
        .survey-settings-save-state.info {
            border-color: rgba(104, 152, 173, 0.22);
            background: rgba(104, 152, 173, 0.08);
            color: var(--primary);
        }
        .survey-settings-save-state.success {
            border-color: rgba(100, 172, 142, 0.28);
            background: rgba(100, 172, 142, 0.12);
            color: #2c7b58;
        }
        .survey-settings-save-state.error {
            border-color: rgba(230, 105, 123, 0.26);
            background: rgba(230, 105, 123, 0.10);
            color: #b64866;
        }
        .survey-settings-last-saved {
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 700;
            line-height: 1.5;
            margin-left: auto;
            padding: 0 6px;
            text-align: right;
            white-space: nowrap;
        }
        .survey-settings-last-saved[hidden] {
            display: none;
        }
        .survey-settings-actions {
            display: flex;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
        }
        .survey-settings-builder-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 12px;
            flex-wrap: wrap;
        }
        .survey-settings-builder-head-copy {
            display: grid;
            gap: 6px;
        }
        .survey-settings-role-chip {
            display: inline-flex;
            align-items: center;
            padding: 6px 12px;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }
        .survey-settings-role-chip.is-trainee {
            background: rgba(58, 128, 164, 0.14);
            color: #1c5e79;
        }
        .survey-settings-role-chip.is-buddy {
            background: rgba(197, 132, 49, 0.16);
            color: #8a5a18;
        }
        .survey-settings-level-label {
            display: inline-flex;
            align-items: center;
            align-self: flex-start;
            padding: 5px 10px;
            border-radius: 999px;
            font-size: 0.68rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            background: var(--survey-role-soft, rgba(104, 152, 173, 0.12));
            color: var(--survey-role-accent, var(--primary));
        }
        .survey-settings-level-label.question {
            font-size: 0.64rem;
        }
        .survey-settings-builder-actions {
            display: flex;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: wrap;
        }
        .survey-settings-meta-card {
            display: grid;
            gap: 10px;
            padding: 16px;
            border-radius: 18px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #f8fbfd 0%, #ffffff 100%);
            position: relative;
            overflow: hidden;
        }
        .survey-settings-meta-card::before {
            content: "";
            position: absolute;
            inset: 0 0 auto 0;
            height: 8px;
            background: linear-gradient(90deg, var(--survey-title-accent, var(--primary)) 0%, color-mix(in srgb, var(--survey-title-accent, var(--primary)) 28%, #ffffff 72%) 100%);
            opacity: 0.95;
        }
        .survey-settings-shell.is-trainee .survey-settings-meta-card,
        .survey-settings-shell.is-buddy .survey-settings-meta-card {
            border-color: var(--survey-title-border, var(--line-soft));
            background: var(--survey-title-bg, linear-gradient(180deg, #f8fbfd 0%, #ffffff 100%));
            box-shadow: inset 6px 0 0 var(--survey-title-accent, var(--primary)), 0 16px 34px rgba(7, 40, 60, 0.06);
        }
        .survey-settings-shell.is-trainee .survey-settings-meta-card > .survey-settings-level-label,
        .survey-settings-shell.is-buddy .survey-settings-meta-card > .survey-settings-level-label {
            background: var(--survey-title-soft, rgba(104, 152, 173, 0.12));
            color: var(--survey-title-accent, var(--primary));
            padding: 7px 14px;
            font-size: 0.72rem;
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--survey-title-accent, var(--primary)) 16%, transparent);
        }
        .survey-settings-shell.is-trainee .survey-settings-meta-card .field label,
        .survey-settings-shell.is-buddy .survey-settings-meta-card .field label {
            color: var(--survey-title-accent, var(--muted));
        }
        .survey-settings-type-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            gap: 10px;
        }
        .survey-settings-type-card {
            display: grid;
            gap: 12px;
            padding: 14px;
            border-radius: 18px;
            border: 1px solid var(--line-soft);
            background: #fff;
        }
        .survey-settings-type-card.is-trainee,
        .survey-settings-type-card.is-buddy {
            border-color: var(--survey-role-border, var(--line-soft));
            background: linear-gradient(180deg, var(--survey-role-bg, #ffffff) 0%, #ffffff 100%);
            box-shadow: inset 4px 0 0 var(--survey-role-accent, var(--primary));
        }
        .survey-settings-type-card h3 {
            margin: 0;
            font-size: 1rem;
            color: var(--text);
        }
        .survey-settings-type-card.is-trainee h3,
        .survey-settings-type-card.is-buddy h3 {
            color: var(--survey-role-accent, var(--text));
        }
        .survey-settings-type-card p {
            margin: 4px 0 0;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.55;
        }
        .survey-settings-group-list {
            display: grid;
            gap: 10px;
        }
        .survey-settings-group {
            display: grid;
            gap: 10px;
            padding: 14px;
            border-radius: 18px;
            border: 1px solid var(--line-soft);
            background: #f9fbfd;
            position: relative;
            overflow: hidden;
        }
        .survey-settings-group::before {
            content: "";
            position: absolute;
            inset: 0 0 auto 0;
            height: 6px;
            background: linear-gradient(90deg, var(--survey-group-accent, var(--primary)) 0%, color-mix(in srgb, var(--survey-group-accent, var(--primary)) 18%, #ffffff 82%) 100%);
            opacity: 0.85;
        }
        .survey-settings-shell.is-trainee .survey-settings-group,
        .survey-settings-shell.is-buddy .survey-settings-group {
            border-color: var(--survey-group-border, var(--line-soft));
            background: var(--survey-group-bg, linear-gradient(180deg, #f9fbfd 0%, #ffffff 100%));
            box-shadow: inset 5px 0 0 var(--survey-group-accent, var(--primary)), 0 10px 22px rgba(7, 40, 60, 0.04);
        }
        .survey-settings-group-header {
            display: grid;
            gap: 8px;
        }
        .survey-settings-group-header-top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
        }
        .survey-settings-group-title {
            min-width: 0;
            color: var(--survey-group-accent, var(--primary));
            font-size: 0.86rem;
            font-weight: 900;
        }
        .survey-settings-group-kicker {
            display: inline-flex;
            align-items: center;
            padding: 5px 9px;
            border-radius: 999px;
            background: rgba(104, 152, 173, 0.12);
            color: var(--primary);
            font-size: 0.7rem;
            font-weight: 800;
            letter-spacing: 0.08em;
            text-transform: uppercase;
        }
        .survey-settings-shell.is-trainee .survey-settings-group-kicker,
        .survey-settings-shell.is-buddy .survey-settings-group-kicker {
            background: var(--survey-group-soft, rgba(104, 152, 173, 0.12));
            color: var(--survey-group-accent, var(--primary));
        }
        .survey-settings-shell.is-trainee .survey-settings-group > .survey-settings-group-header > .survey-settings-level-label,
        .survey-settings-shell.is-buddy .survey-settings-group > .survey-settings-group-header > .survey-settings-level-label {
            background: var(--survey-group-soft, rgba(104, 152, 173, 0.12));
            color: var(--survey-group-accent, var(--primary));
            padding: 6px 13px;
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--survey-group-accent, var(--primary)) 14%, transparent);
        }
        .survey-settings-shell.is-trainee .survey-settings-group .field label,
        .survey-settings-shell.is-buddy .survey-settings-group .field label {
            color: var(--survey-group-accent, var(--muted));
        }
        .survey-settings-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }
        .survey-settings-grid .field {
            display: grid;
            gap: 6px;
        }
        .survey-settings-grid .field label {
            font-size: 0.72rem;
            font-weight: 700;
            color: var(--muted);
        }
        .survey-settings-question-list {
            display: grid;
            gap: 8px;
        }
        .survey-builder-workspace {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 48px;
            align-items: start;
            gap: 10px;
        }
        .survey-builder-side-toolbar {
            position: sticky;
            top: 84px;
            z-index: 8;
            display: grid;
            gap: 8px;
            justify-items: center;
            padding: 8px 6px;
            border: 1px solid var(--line-soft);
            border-radius: 16px;
            background: rgba(255, 255, 255, 0.96);
            box-shadow: 0 10px 22px rgba(15, 47, 70, 0.12);
            transition: margin-top 0.18s ease;
        }
        .survey-builder-side-toolbar button {
            width: 34px;
            height: 34px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 12px;
            border: 1px solid var(--line-soft);
            background: #fff;
            color: var(--primary);
            font-size: 1rem;
            font-weight: 800;
            box-shadow: 0 4px 10px rgba(15, 47, 70, 0.08);
            cursor: pointer;
        }
        .survey-builder-side-toolbar button:hover:not(:disabled) {
            border-color: rgba(58, 128, 164, 0.34);
            background: #f3f9fc;
            transform: translateY(-1px);
        }
        .survey-builder-side-toolbar button:disabled {
            opacity: 0.38;
            cursor: not-allowed;
            box-shadow: none;
        }
        .survey-settings-question {
            display: grid;
            gap: 10px;
            padding: 14px;
            border-radius: 16px;
            border: 1px solid var(--line-soft);
            background: #fff;
            position: relative;
            overflow: hidden;
        }
        .survey-settings-question::before {
            content: "";
            position: absolute;
            inset: 0 0 auto 0;
            height: 4px;
            background: linear-gradient(90deg, color-mix(in srgb, var(--survey-question-accent, var(--primary)) 88%, #ffffff 12%) 0%, color-mix(in srgb, var(--survey-question-accent, var(--primary)) 10%, #ffffff 90%) 100%);
            opacity: 0.72;
        }
        .survey-settings-shell.is-trainee .survey-settings-question,
        .survey-settings-shell.is-buddy .survey-settings-question {
            border-color: var(--survey-question-border, var(--line-soft));
            background: var(--survey-question-bg, #fff);
            box-shadow: inset 4px 0 0 var(--survey-question-accent, var(--primary)), inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 4px 12px rgba(7, 40, 60, 0.025);
        }
        .survey-settings-question-head {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 12px;
            flex-wrap: wrap;
        }
        .survey-settings-question-meta {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }
        .survey-settings-question-code {
            display: inline-flex;
            align-items: center;
            padding: 5px 8px;
            border-radius: 999px;
            background: #eef5fa;
            color: var(--primary);
            font-size: 0.68rem;
            font-weight: 800;
        }
        .survey-settings-question-code-input {
            min-width: 120px;
            max-width: 240px;
            height: 34px;
            padding: 0 12px;
            border-radius: 999px;
            border: 1px solid rgba(104, 152, 173, 0.18);
            background: #eef5fa;
            color: var(--primary);
            font-size: 0.72rem;
            font-weight: 800;
        }
        .survey-settings-shell.is-trainee .survey-settings-question-code-input,
        .survey-settings-shell.is-buddy .survey-settings-question-code-input {
            border-color: var(--survey-question-border, rgba(104, 152, 173, 0.18));
            background: color-mix(in srgb, var(--survey-question-soft, #eef5fa) 82%, #ffffff 18%);
            color: var(--survey-question-accent, var(--primary));
        }
        .survey-settings-question-type {
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 700;
        }
        .survey-settings-shell.is-trainee .survey-settings-question-type,
        .survey-settings-shell.is-buddy .survey-settings-question-type {
            color: var(--survey-question-accent, var(--muted));
        }
        .survey-settings-shell.is-trainee .survey-settings-question > .survey-settings-level-label.question,
        .survey-settings-shell.is-buddy .survey-settings-question > .survey-settings-level-label.question {
            background: var(--survey-question-soft, rgba(104, 152, 173, 0.12));
            color: var(--survey-question-accent, var(--primary));
            padding: 6px 12px;
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--survey-question-accent, var(--primary)) 12%, transparent);
        }
        .survey-settings-shell.is-trainee .survey-settings-question .field label,
        .survey-settings-shell.is-buddy .survey-settings-question .field label {
            color: var(--survey-question-accent, var(--muted));
        }
        .survey-settings-type-note {
            margin-top: 8px;
            padding: 10px 12px;
            border-radius: 12px;
            border: 1px dashed var(--line);
            background: #fbfdff;
            color: var(--muted);
            font-size: 0.72rem;
            line-height: 1.55;
        }
        .survey-settings-shell.is-trainee .survey-settings-type-note,
        .survey-settings-shell.is-buddy .survey-settings-type-note {
            border-color: var(--survey-role-border, var(--line));
            background: color-mix(in srgb, var(--survey-role-bg, #fbfdff) 65%, #ffffff 35%);
        }
        .survey-settings-config-grid {
            display: grid;
            gap: 10px;
            margin-top: 10px;
        }
        .survey-settings-config-grid textarea {
            width: 100%;
            min-height: 88px;
            padding: 10px 12px;
            border-radius: 14px;
            border: 1px solid var(--line);
            resize: vertical;
            font: inherit;
            color: var(--text);
            background: #fff;
        }
        .survey-settings-toggle {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            color: var(--muted);
            font-size: 0.74rem;
            font-weight: 700;
        }
        .survey-settings-toggle input {
            width: 16px;
            height: 16px;
            accent-color: var(--accent);
        }
        .survey-settings-scroll-top {
            position: fixed;
            right: 28px;
            bottom: 28px;
            z-index: 80;
            width: 50px;
            height: 50px;
            border: 1px solid rgba(15, 23, 42, 0.08);
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.98);
            color: #1f2933;
            line-height: 1;
            box-shadow: 0 3px 10px rgba(15, 23, 42, 0.14);
            cursor: pointer;
            transition: transform 150ms ease, box-shadow 150ms ease, border-color 150ms ease;
        }
        .survey-settings-scroll-top[hidden] {
            display: none !important;
        }
        .survey-settings-scroll-top::before {
            content: "";
            position: absolute;
            top: 13px;
            left: 50%;
            width: 17px;
            height: 1.5px;
            border-radius: 999px;
            background: #1f2933;
            transform: translateX(-50%);
        }
        .survey-settings-scroll-top::after {
            content: "↑";
            position: absolute;
            top: 17px;
            left: 50%;
            color: #1f2933;
            font-size: 1.4rem;
            font-weight: 300;
            line-height: 1;
            transform: translateX(-50%);
        }
        .survey-settings-scroll-top:hover {
            transform: translateY(-2px);
            border-color: rgba(15, 23, 42, 0.14);
            box-shadow: 0 6px 14px rgba(15, 23, 42, 0.16);
        }
        .survey-settings-group-actions {
            display: flex;
            justify-content: flex-end;
        }
        .survey-settings-question-actions {
            display: flex;
            justify-content: flex-end;
        }
        .survey-settings-empty {
            padding: 14px;
            border-radius: 14px;
            border: 1px dashed var(--line);
            background: #fbfdff;
            color: var(--muted);
            font-size: 0.74rem;
            line-height: 1.6;
            text-align: center;
        }
        .survey-version-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
            margin-bottom: 12px;
        }
        .survey-version-card {
            display: grid;
            gap: 6px;
            padding: 14px 16px;
            border-radius: 16px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%);
            box-shadow: 0 10px 22px rgba(7, 40, 60, 0.04);
        }
        .survey-version-card.is-active {
            border-color: rgba(27, 105, 139, 0.38);
            background: linear-gradient(180deg, rgba(227, 244, 251, 0.96) 0%, #ffffff 100%);
            box-shadow: inset 5px 0 0 var(--primary), 0 12px 24px rgba(27, 105, 139, 0.08);
        }
        .survey-version-card.is-draft {
            border-color: rgba(187, 125, 44, 0.34);
            background: linear-gradient(180deg, rgba(255, 244, 224, 0.96) 0%, #ffffff 100%);
            box-shadow: inset 5px 0 0 #b87820, 0 12px 24px rgba(187, 125, 44, 0.07);
        }
        .survey-version-card span {
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 900;
        }
        .survey-version-card strong {
            color: var(--text);
            font-size: 1.05rem;
            font-weight: 900;
        }
        .survey-version-card small {
            color: var(--muted);
            font-size: 0.7rem;
            line-height: 1.45;
        }
        .survey-builder-bottom-grid {
            display: grid;
            grid-template-columns: minmax(300px, 0.52fr) minmax(0, 1fr);
            gap: 12px;
            align-items: start;
        }
        .survey-version-meta-card {
            padding: 12px;
        }
        .survey-version-meta-grid {
            grid-template-columns: minmax(260px, 1fr);
            gap: 10px;
            align-items: end;
        }
        .survey-version-meta-grid .field {
            gap: 5px;
        }
        .survey-version-meta-grid input {
            height: 38px;
        }
        .survey-builder-preview,
        .survey-version-history,
        .survey-choice-editor {
            border: 1px solid var(--line-soft);
            border-radius: 16px;
            background: #fff;
        }
        .survey-builder-preview,
        .survey-version-history {
            padding: 14px;
            display: grid;
            gap: 10px;
        }
        .survey-builder-preview-toolbar,
        .survey-builder-preview-head,
        .survey-version-history-head {
            display: grid;
            gap: 4px;
        }
        .survey-builder-preview-toolbar {
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: center;
        }
        .survey-builder-preview-toolbar > div {
            display: grid;
            gap: 4px;
        }
        .survey-builder-preview-toolbar span,
        .survey-builder-preview-head span,
        .survey-version-history-head span {
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 800;
        }
        .survey-builder-preview-toolbar strong,
        .survey-builder-preview-head strong,
        .survey-version-history-head strong {
            color: var(--text);
            font-size: 0.92rem;
            font-weight: 900;
        }
        .survey-builder-preview-head small {
            color: var(--muted);
            font-size: 0.7rem;
            line-height: 1.45;
        }
        .survey-builder-preview-languages {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }
        .survey-builder-preview-lang {
            display: grid;
            gap: 10px;
            min-width: 0;
        }
        .survey-builder-preview-group {
            display: grid;
            gap: 6px;
            padding: 10px;
            border-radius: 12px;
            background: #f8fbfd;
            border: 1px solid var(--line-soft);
        }
        .survey-builder-preview-group b {
            color: var(--primary);
            font-size: 0.78rem;
        }
        .survey-builder-preview-question {
            display: grid;
            gap: 8px;
            padding: 8px 10px;
            border-radius: 10px;
            background: #fff;
            border: 1px solid rgba(104, 152, 173, 0.12);
        }
        .survey-builder-preview-question-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 10px;
        }
        .survey-builder-preview-question-head span {
            min-width: 0;
            color: var(--text);
            font-size: 0.74rem;
            font-weight: 750;
            line-height: 1.45;
        }
        .survey-builder-preview-question-head em {
            flex: 0 0 auto;
            color: var(--muted);
            font-size: 0.66rem;
            font-style: normal;
            font-weight: 800;
        }
        .survey-builder-preview-question input,
        .survey-builder-preview-question textarea,
        .survey-builder-preview-question select {
            width: 100%;
            min-height: 34px;
            border-radius: 10px;
            border: 1px solid var(--line-soft);
            background: #f8fbfd;
            color: var(--muted);
            font-size: 0.72rem;
            padding: 8px 10px;
        }
        .survey-builder-preview-question textarea {
            min-height: 64px;
            resize: none;
        }
        .survey-builder-preview-choice-row {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }
        .survey-builder-preview-choice-row label {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            min-height: 30px;
            padding: 6px 9px;
            border-radius: 999px;
            border: 1px solid var(--line-soft);
            background: #f8fbfd;
        }
        .survey-builder-preview-choice-row b,
        .survey-builder-preview-ranking strong {
            color: var(--text);
            font-size: 0.68rem;
            font-weight: 800;
        }
        .survey-builder-preview-choice-row.is-nps label {
            width: 30px;
            justify-content: center;
            padding: 6px 0;
        }
        .survey-builder-preview-choice-row.is-nps .survey-builder-preview-radio {
            display: none;
        }
        .survey-builder-preview-radio {
            width: 12px;
            height: 12px;
            flex: 0 0 12px;
            border-radius: 999px;
            border: 2px solid rgba(104, 152, 173, 0.45);
            background: #fff;
        }
        .survey-builder-preview-ranking {
            display: grid;
            gap: 6px;
        }
        .survey-builder-preview-ranking > div {
            display: grid;
            grid-template-columns: minmax(0, 1fr) 72px;
            gap: 8px;
            align-items: center;
        }
        .survey-builder-preview-matrix-wrap {
            overflow: auto;
        }
        .survey-builder-preview-matrix {
            width: 100%;
            min-width: 420px;
            border-collapse: separate;
            border-spacing: 0;
            border: 1px solid var(--line-soft);
            border-radius: 10px;
            overflow: hidden;
        }
        .survey-settings-group.is-selected {
            outline: 3px solid #d84b5f;
            outline-offset: 4px;
            border-color: rgba(216, 75, 95, 0.7) !important;
            background: linear-gradient(180deg, #fff0f3 0%, #fff8f9 100%) !important;
            box-shadow: inset 6px 0 0 #d84b5f, inset 0 0 0 999px rgba(216, 75, 95, 0.055), 0 0 0 10px rgba(216, 75, 95, 0.16), 0 20px 38px rgba(169, 49, 72, 0.26) !important;
        }
        .survey-settings-question.is-selected {
            outline: 3px solid #d84b5f;
            outline-offset: 3px;
            border-color: rgba(216, 75, 95, 0.68) !important;
            background: linear-gradient(180deg, #fff1f4 0%, #fffafa 100%) !important;
            box-shadow: inset 5px 0 0 #d84b5f, inset 0 0 0 999px rgba(216, 75, 95, 0.06), 0 0 0 9px rgba(216, 75, 95, 0.17), 0 18px 34px rgba(169, 49, 72, 0.26) !important;
        }
        .survey-builder-preview-matrix th,
        .survey-builder-preview-matrix td {
            padding: 7px 8px;
            border-bottom: 1px solid var(--line-soft);
            border-right: 1px solid var(--line-soft);
            text-align: center;
            font-size: 0.66rem;
        }
        .survey-builder-preview-matrix th:first-child,
        .survey-builder-preview-matrix td:first-child {
            text-align: left;
            color: var(--text);
            font-weight: 800;
        }
        .survey-builder-preview-matrix tr:last-child td {
            border-bottom: 0;
        }
        .survey-builder-preview-matrix th:last-child,
        .survey-builder-preview-matrix td:last-child {
            border-right: 0;
        }
        .survey-version-list {
            display: grid;
            gap: 8px;
            max-height: 320px;
            overflow: auto;
        }
        .survey-version-row {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            gap: 4px 8px;
            align-items: start;
            padding: 9px 10px;
            border-radius: 12px;
            border: 1px solid var(--line-soft);
            background: #f8fbfd;
        }
        .survey-version-row strong {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 0.76rem;
            color: var(--text);
        }
        .survey-version-row small {
            grid-column: 2;
            color: var(--muted);
            font-size: 0.66rem;
            line-height: 1.35;
        }
        .survey-version-row small span {
            display: block;
            white-space: nowrap;
        }
        .survey-version-row-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            justify-content: flex-end;
            align-self: start;
            grid-column: 3;
            grid-row: 1 / span 2;
        }
        .survey-version-status {
            padding: 4px 8px;
            border-radius: 999px;
            background: rgba(104, 152, 173, 0.12);
            color: var(--primary);
            font-size: 0.64rem;
            font-weight: 900;
        }
        .survey-version-row.active .survey-version-status { background: rgba(27, 105, 139, 0.14); color: var(--primary); }
        .survey-version-row.draft .survey-version-status { background: rgba(187, 125, 44, 0.16); color: #9b6418; }
        .survey-version-row.ended .survey-version-status { background: rgba(100, 116, 139, 0.12); color: #64748b; }
        .survey-choice-editor {
            padding: 12px;
            display: grid;
            gap: 10px;
        }
        .survey-choice-editor-head {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 8px;
        }
        .survey-choice-editor-head strong {
            font-size: 0.76rem;
            color: var(--text);
        }
        .survey-choice-editor-list {
            display: grid;
            gap: 8px;
        }
        .survey-choice-editor-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(90px, 0.7fr) auto;
            gap: 8px;
            align-items: center;
        }
        .survey-choice-editor-row input {
            width: 100%;
            min-width: 0;
            height: 36px;
            padding: 0 10px;
            border: 1px solid var(--line);
            border-radius: 10px;
            font: inherit;
            font-size: 0.72rem;
        }
        .survey-choice-row-actions {
            display: inline-flex;
            gap: 4px;
            align-items: center;
            justify-content: flex-end;
        }
        .survey-settings-actions .survey-translation-overwrite {
            padding: 0 8px;
            border-radius: 999px;
            background: rgba(104, 152, 173, 0.08);
        }
        .survey-translation-review-badge {
            display: inline-flex;
            margin-left: 6px;
            padding: 2px 7px;
            border-radius: 999px;
            background: rgba(187, 125, 44, 0.15);
            color: #9b6418;
            font-style: normal;
            font-size: 0.62rem;
            font-weight: 900;
            vertical-align: middle;
        }
        @media (max-width: 760px) {
            .survey-settings-grid { grid-template-columns: 1fr; }
            .survey-settings-type-grid { grid-template-columns: 1fr; }
            .survey-builder-workspace { grid-template-columns: 1fr; }
            .survey-builder-side-toolbar {
                position: sticky;
                top: 72px;
                grid-template-columns: repeat(4, 34px);
                justify-content: flex-end;
                width: max-content;
                margin-left: auto;
            }
            .survey-version-grid,
            .survey-builder-bottom-grid,
            .survey-builder-preview-languages,
            .survey-version-meta-grid,
            .survey-choice-editor-row { grid-template-columns: 1fr; }
            .survey-version-row { grid-template-columns: auto minmax(0, 1fr); }
            .survey-version-row-actions {
                grid-column: 1 / -1;
                grid-row: auto;
                justify-content: flex-start;
            }
            .survey-choice-row-actions { justify-content: flex-start; }
        }
        .setting-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 16px;
            padding: 14px 16px;
            border: 1px solid var(--line-soft);
            border-radius: 16px;
            background: #fff;
        }
        .setting-copy strong {
            display: block;
            margin-bottom: 4px;
            font-size: 0.92rem;
        }
        .setting-copy span {
            display: block;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.55;
        }
        .setting-toggle {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            flex-shrink: 0;
        }
        .setting-toggle select {
            min-width: 120px;
            padding: 10px 12px;
            border-radius: 12px;
            border: 1px solid rgba(104, 152, 173, 0.22);
            background: #fff;
            color: var(--text);
            font: inherit;
        }
        .setting-toggle input {
            width: 18px;
            height: 18px;
            accent-color: var(--accent);
            cursor: pointer;
        }
        .setting-toggle input.setting-number-input {
            width: 96px;
            height: auto;
            min-height: 38px;
            padding: 9px 10px;
            border-radius: 12px;
            border: 1px solid rgba(104, 152, 173, 0.22);
            background: #fff;
            color: var(--text);
            font: inherit;
            cursor: text;
        }
        .setting-state {
            min-width: 48px;
            text-align: right;
            font-size: 0.78rem;
            font-weight: 800;
            color: var(--muted);
        }
        .setting-state.is-on { color: var(--success); }
        #my-slot-panel .my-slot-period-field {
            margin: 0 0 8px;
            max-width: 300px;
        }
        #my-slot-panel .my-slot-period-field[hidden] {
            display: none;
        }
        #my-slot-panel .my-slot-period-field label {
            display: block;
            margin-bottom: 5px;
            font-size: 0.72rem;
            color: var(--muted);
            font-weight: 800;
        }
        #my-slot-panel .my-slot-period-field select {
            width: 100%;
        }
        .record-card { padding: 14px; }
        .section-kicker {
            margin: 0 0 4px;
            color: var(--primary);
            font-size: 0.68rem;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: 0.12em;
        }
        .record-metrics {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 8px;
            margin-bottom: 10px;
        }
        .history-toolbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 10px;
            margin-bottom: 10px;
        }
        .history-filter {
            min-width: 180px;
            border: 1px solid var(--line);
            border-radius: 10px;
            background: #fff;
            color: var(--text);
            padding: 8px 10px;
            font-size: 0.74rem;
            font-weight: 700;
        }
        .table-wrap { overflow: auto; position: relative; isolation: isolate; border: 1px solid var(--line-soft); border-radius: 18px; background: #fff; -webkit-overflow-scrolling: touch; }
        #admin-slot-wrap {
            max-height: min(68vh, 560px);
            overflow-y: auto;
            overflow-x: auto;
        }
        .hr-attention-wrap,
        .hr-employee-wrap {
            max-height: 476px;
            overflow-y: auto;
            overflow-x: auto;
        }
.member-master-list,
.store-master-management .member-master-list,
.store-master-sheet-main,
#my-app-panel { min-height: 100%; display: flex; flex-direction: column; }
.store-master-filter-field select,
.store-master-sheet-actions .btn-soft,
.store-master-sheet-actions .btn-ghost,
.store-master-sheet-actions .btn-danger,
.store-master-sheet-actions .btn-danger:disabled,
.store-master-sheet-actions .btn-ghost:disabled,
.store-master-sheet-actions .btn-soft:disabled,
.store-master-sheet-actions .btn-danger:not(:disabled):hover {
    min-height: 44px;
}
.store-master-sheet-actions .btn-danger,
.store-master-sheet-actions .btn-ghost,
.store-master-sheet-actions .btn-soft {
    min-width: 116px;
}
.store-master-sheet-actions .btn-danger:not(:disabled):hover,
.store-master-sheet-actions .btn-danger:not(:disabled):focus-visible {
    transform: none;
}
.store-master-autocomplete {
    position: relative;
    width: 100%;
}
.store-master-autocomplete input {
    width: 100%;
}
.store-master-autocomplete-list {
    position: absolute;
    z-index: 30;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    display: grid;
    gap: 4px;
    max-height: 220px;
    overflow: auto;
    padding: 7px;
    border: 1px solid rgba(111, 166, 191, 0.28);
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.98);
    box-shadow: 0 18px 36px rgba(7, 40, 60, 0.16);
}
.store-master-autocomplete-list[hidden] {
    display: none !important;
}
.store-master-autocomplete-list button {
    width: 100%;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: var(--text);
    cursor: pointer;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.35;
    padding: 8px 10px;
    text-align: left;
}
.store-master-autocomplete-list button:hover,
.store-master-autocomplete-list button.active {
    background: rgba(235, 245, 249, 0.98);
    color: var(--primary-dark);
}
        #my-app-panel .table-wrap { overflow-x: auto; flex: 1 1 auto; min-height: 0; }
        #survey-record-panel .table-wrap { max-height: 388px; overflow-y: auto; overflow-x: auto; background: #fff; }
        #view-apply .table-wrap { max-height: 230px; }
        .apply-slot-overview-panel .table-wrap { min-height: 0; max-height: none; overflow-y: auto; overflow-x: auto; flex: 1 1 auto; }
        #apply-slot-overview-list {
            width: 100%;
            min-width: 100%;
            table-layout: fixed;
        }
        #view-apply .section-header { margin-bottom: 6px; }
        #view-apply .section-title { font-size: 0.94rem; }
        #view-apply .section-desc { font-size: 0.72rem; line-height: 1.4; }
        #view-apply .form-grid { gap: 8px; }
        #apply-form-panel .field,
        #my-app-panel .field {
            gap: 4px;
        }
        .my-app-full-grid {
            grid-template-columns: minmax(220px, 280px) minmax(132px, 148px) minmax(0, 1fr);
            align-items: end;
            column-gap: 8px;
            width: 100%;
        }
        .my-app-full-grid #my-app-lookup-field {
            grid-column: 1;
        }
        .my-app-full-grid #lookup-my-btn {
            grid-column: 2;
            width: 100%;
            min-width: 0;
            padding: 0 14px;
            justify-self: stretch;
            white-space: nowrap;
        }
.my-app-full-grid #my-app-summary,
.my-app-full-grid .table-wrap,
.my-app-full-grid #my-app-connection-panel,
.my-app-full-grid #confirmed-schedule-panel,
.my-app-full-grid #my-app-filter-row,
.my-app-full-grid #my-app-bulk-actions {
            grid-column: 1 / -1;
            width: 100%;
        }
.my-app-bulk-actions {
            justify-content: flex-start;
            flex-wrap: wrap;
            gap: 8px;
            margin-top: 2px;
            margin-bottom: 2px;
        }
.my-app-select-head,
.my-app-select-cell {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            width: 100%;
        }
.my-app-select-head input,
.my-app-select-cell input {
            margin: 0;
            flex: 0 0 auto;
        }
.my-app-select-cell .record-link-row-trigger {
            flex: 1 1 auto;
            text-align: left;
        }
        .my-app-filter-row {
            gap: 6px;
            margin-top: 2px;
            margin-bottom: 2px;
        }
        .my-app-filter-row .tab-btn {
            padding: 6px 10px;
            min-height: 32px;
            border-radius: 999px;
            font-size: 0.7rem;
            font-weight: 800;
        }
        .my-app-filter-row .tab-btn span {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 18px;
            margin-left: 4px;
            padding: 0 4px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.72);
            color: var(--primary-strong);
            font-size: 0.64rem;
        }
        .my-app-filter-row .tab-btn.active span {
            background: rgba(255, 255, 255, 0.96);
            color: #0f3f57;
        }
        .my-slot-pending-filter-row {
            gap: 6px;
            margin: 10px 0 8px;
        }
        .my-slot-pending-filter-row .tab-btn {
            padding: 6px 10px;
            min-height: 32px;
            border-radius: 999px;
            font-size: 0.7rem;
            font-weight: 800;
        }
        .my-slot-pending-filter-row .tab-btn span {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 18px;
            margin-left: 4px;
            padding: 0 4px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.72);
            color: var(--primary-strong);
            font-size: 0.64rem;
        }
        .my-slot-pending-filter-row .tab-btn.active span {
            background: rgba(255, 255, 255, 0.96);
            color: #0f3f57;
        }
        #my-slot-pending-list tr.is-expired {
            background: rgba(248, 250, 252, 0.82);
        }
        #my-slot-pending-list tr.is-expired .record-link-reason-cell span,
        #my-slot-pending-list tr.is-expired .record-link-inline-note {
            color: #9a6a1d;
            font-weight: 800;
        }
        @media (max-width: 860px) {
            .my-app-full-grid {
                grid-template-columns: 1fr;
            }
            .my-slot-pending-period-row {
                grid-template-columns: 1fr;
            }
            .record-link-metric-row-five {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            .record-link-summary-grid,
            .record-link-grid {
                grid-template-columns: 1fr;
            }
            .record-link-panel {
                padding: 14px;
                border-radius: 18px;
            }
            .record-link-table-wrap {
                max-height: none;
                overflow: visible;
            }
            #my-slot-pending-list,
            #my-slot-pending-list thead,
            #my-slot-pending-list tbody,
            #my-slot-pending-list tr,
            #my-slot-pending-list th,
            #my-slot-pending-list td {
                display: block;
                width: 100%;
            }
            #my-slot-pending-list thead {
                display: none;
            }
            #my-slot-pending-list tbody tr {
                display: grid;
                grid-template-columns: 1fr;
                gap: 8px;
                padding: 12px;
                margin-bottom: 10px;
                border: 1px solid rgba(104, 152, 173, 0.16);
                border-radius: 16px;
                background: #fff;
            }
            #my-slot-pending-list tbody tr:last-child {
                margin-bottom: 0;
            }
            #my-slot-pending-list td {
                padding: 0;
            }
            #my-slot-pending-list td::before {
                display: block;
                margin-bottom: 3px;
                color: var(--muted);
                font-size: 0.66rem;
                font-weight: 800;
            }
            #my-slot-pending-list td.pending-col-date::before { content: "체험일"; }
            #my-slot-pending-list td.pending-col-store::before { content: "매장"; }
            #my-slot-pending-list td.pending-col-applicant::before { content: "신청자"; }
            #my-slot-pending-list td.pending-col-status::before { content: "상태"; }
            #my-slot-pending-list td.pending-col-reason::before { content: "기록"; }
            #my-slot-pending-list td.pending-col-actions::before { content: "관리"; }
            #my-slot-pending-list .table-actions {
                grid-template-columns: repeat(2, minmax(0, 1fr));
                width: 100%;
            }
            #my-slot-pending-list .btn-ghost,
            #my-slot-pending-list .btn-inline-confirm {
                width: 100%;
                min-width: 0;
            }
            .my-app-full-grid #lookup-my-btn {
                width: 100%;
            }
        }
        #apply-form-panel .field label,
        #my-app-panel .field label {
            font-size: 0.72rem;
        }
        #apply-form-panel .field input,
        #apply-form-panel .field select,
        #my-app-panel .field input {
            padding: 7px 10px;
            min-height: 38px;
        }
        #apply-form-panel #in-slot.is-placeholder {
            color: #2f78c4;
        }
        #apply-form-panel .helper-text,
        #my-app-panel .helper-text {
            font-size: 0.63rem;
            line-height: 1.35;
        }
        #apply-form-panel .btn-main,
        #my-app-panel .btn-main,
        #apply-form-panel .btn-ghost {
            min-height: 36px;
            padding: 0 12px;
            font-size: 0.72rem;
        }
        #apply-slot-overview-list th,
        #apply-slot-overview-list td {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            vertical-align: middle;
            padding: 6px 8px;
            font-size: 0.71rem;
        }
        #apply-slot-overview-list th:nth-child(1),
        #apply-slot-overview-list td:nth-child(1) { width: 102px; }
        #apply-slot-overview-list th:nth-child(2),
        #apply-slot-overview-list td:nth-child(2) { width: 33%; }
        #apply-slot-overview-list th:nth-child(3),
        #apply-slot-overview-list td:nth-child(3) { width: 72px; text-align: center; }
        #apply-slot-overview-list th:nth-child(4),
        #apply-slot-overview-list td:nth-child(4) { width: 128px; text-align: center; }
        #apply-slot-overview-list th:nth-child(5),
        #apply-slot-overview-list td:nth-child(5) { width: 32%; }
        #apply-slot-overview-list th:nth-child(6),
        #apply-slot-overview-list td:nth-child(6) { width: 100px; text-align: center; }
        #apply-slot-overview-list .btn-ghost {
            min-width: 74px;
            justify-content: center;
        }
        #apply-slot-overview-list tr.is-selected td { background: rgba(104, 152, 173, 0.08); }
        #apply-slot-overview-list td:nth-child(4),
        #apply-slot-overview-list td:nth-child(5) {
            white-space: normal;
            overflow: visible;
            text-overflow: clip;
            vertical-align: top;
        }
        #apply-slot-overview-list .apply-slot-guide-copy {
            color: var(--text);
            font-size: 0.66rem;
            line-height: 1.28;
            white-space: normal;
            overflow: visible;
            text-overflow: clip;
            word-break: keep-all;
        }
        #apply-slot-overview-list .apply-slot-guide-highlight {
            display: inline;
            color: #a12e43;
            font-weight: 900;
        }
        #apply-slot-overview-list .table-subcopy {
            margin-top: 2px;
            white-space: normal;
            overflow: visible;
            text-overflow: clip;
            line-height: 1.24;
            font-size: 0.63rem;
        }
        #apply-slot-overview-list .status-pill {
            min-width: 48px;
            padding: 4px 9px;
            font-size: 0.67rem;
        }
        #my-app-list tbody tr,
#my-slot-list tbody tr { cursor: pointer; }
#my-app-list tr.is-selected td,
#my-slot-list tr.is-selected td { background: rgba(104, 152, 173, 0.10); }
#admin-slot-list tbody tr.is-selected td {
    background: rgba(209, 231, 244, 0.82);
    border-bottom-color: rgba(174, 206, 224, 0.92);
}
#admin-slot-list tbody tr.is-selected td:first-child {
    box-shadow: inset 3px 0 0 rgba(15, 76, 129, 0.26);
}
#my-slot-list tbody tr.is-selected td {
    background: rgba(209, 231, 244, 0.92);
    border-bottom-color: rgba(174, 206, 224, 0.95);
}
#my-slot-list tbody tr.is-selected td:first-child {
    box-shadow: inset 3px 0 0 rgba(15, 76, 129, 0.26);
}
#my-slot-list tbody tr.is-selected .table-actions .btn-ghost {
    border-color: rgba(15, 76, 129, 0.28);
    background: rgba(255, 255, 255, 0.78);
}
        #my-app-list tbody tr.is-confirmed,
        #my-slot-pending-list tbody tr.is-confirmed { background: rgba(222, 240, 248, 0.88) !important; }
        #my-app-list tbody tr.is-rejected,
        #my-slot-pending-list tbody tr.is-rejected { background: rgba(248, 225, 231, 0.84) !important; }
        #my-app-list tbody tr.is-cancelled,
        #my-slot-pending-list tbody tr.is-cancelled { background: rgba(242, 241, 236, 0.96) !important; }
        #my-app-list tbody tr.is-confirmed td,
        #my-slot-pending-list tbody tr.is-confirmed td { background: rgba(222, 240, 248, 0.88) !important; box-shadow: none; }
        #my-app-list tbody tr.is-rejected td,
        #my-slot-pending-list tbody tr.is-rejected td { background: rgba(248, 225, 231, 0.84) !important; box-shadow: none; }
        #my-app-list tbody tr.is-cancelled td,
        #my-slot-pending-list tbody tr.is-cancelled td { background: rgba(242, 241, 236, 0.96) !important; box-shadow: none; }
        #my-app-list tbody tr.is-confirmed td,
        #my-slot-pending-list tbody tr.is-confirmed td { border-bottom-color: rgba(194, 223, 239, 0.95) !important; }
        #my-app-list tbody tr.is-rejected td,
        #my-slot-pending-list tbody tr.is-rejected td { border-bottom-color: rgba(239, 204, 216, 0.96) !important; }
        #my-app-list tbody tr.is-cancelled td,
        #my-slot-pending-list tbody tr.is-cancelled td { border-bottom-color: rgba(225, 222, 213, 0.96) !important; }
        #my-app-list tbody tr.is-confirmed .record-link-table-main,
        #my-app-list tbody tr.is-rejected .record-link-table-main,
        #my-app-list tbody tr.is-cancelled .record-link-table-main,
        #my-slot-pending-list tbody tr.is-confirmed .record-link-table-main,
        #my-slot-pending-list tbody tr.is-rejected .record-link-table-main,
        #my-slot-pending-list tbody tr.is-cancelled .record-link-table-main,
        #my-slot-pending-list tbody tr.is-confirmed .record-link-reason-cell,
        #my-slot-pending-list tbody tr.is-rejected .record-link-reason-cell,
        #my-slot-pending-list tbody tr.is-cancelled .record-link-reason-cell,
        #my-slot-pending-list tbody tr.is-confirmed .table-actions,
        #my-slot-pending-list tbody tr.is-rejected .table-actions,
        #my-slot-pending-list tbody tr.is-cancelled .table-actions {
            background: transparent !important;
            box-shadow: none !important;
        }
        #my-slot-pending-list td.pending-col-reason,
        #my-slot-pending-list td.pending-col-reason .record-link-reason-cell {
            background: inherit !important;
        }
        #my-slot-pending-list td.pending-col-reason {
            display: table-cell;
        }
        #my-app-list tbody tr.is-confirmed td:first-child,
        #my-slot-pending-list tbody tr.is-confirmed td:first-child { box-shadow: inset 3px 0 0 rgba(59, 130, 246, 0.24); }
        #my-app-list tbody tr.is-rejected td:first-child,
        #my-slot-pending-list tbody tr.is-rejected td:first-child { box-shadow: inset 3px 0 0 rgba(219, 39, 119, 0.20); }
        #my-app-list tbody tr.is-cancelled td:first-child,
        #my-slot-pending-list tbody tr.is-cancelled td:first-child { box-shadow: inset 3px 0 0 rgba(120, 113, 108, 0.20); }
        #my-app-list tbody tr.is-selected td {
            background: rgba(191, 223, 238, 0.52);
            border-bottom-color: rgba(176, 207, 223, 0.96) !important;
        }
        #my-app-list tbody tr.is-selected.is-confirmed td { background: rgba(195, 229, 247, 0.98); }
        #my-app-list tbody tr.is-selected.is-rejected td { background: rgba(244, 210, 221, 0.98); }
        #my-app-list tbody tr.is-selected.is-cancelled td { background: rgba(237, 233, 225, 0.98); }
        #my-app-list tbody tr.has-schedule-change td {
            background: rgba(255, 247, 221, 0.92) !important;
            border-bottom-color: rgba(224, 185, 87, 0.45) !important;
        }
        #my-app-list tbody tr.has-schedule-change td:first-child {
            box-shadow: inset 3px 0 0 rgba(194, 126, 31, 0.55);
        }
        #my-app-list tbody tr.is-selected.has-schedule-change td {
            background: rgba(255, 239, 190, 0.98) !important;
        }
        .schedule-change-inline-badge {
            display: block;
            width: fit-content;
            max-width: 100%;
            margin-top: 5px;
            padding: 3px 7px;
            border-radius: 999px;
            background: rgba(194, 126, 31, 0.12);
            color: #9a5b11;
            font-size: 0.62rem;
            font-weight: 900;
            line-height: 1.2;
            white-space: normal;
        }
        .schedule-change-banner {
            grid-column: 1 / -1;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            padding: 12px 14px;
            border: 1px solid rgba(194, 126, 31, 0.36);
            border-radius: 14px;
            background: linear-gradient(180deg, rgba(255, 249, 232, 0.98) 0%, rgba(255, 243, 209, 0.98) 100%);
            box-shadow: 0 10px 22px rgba(120, 84, 30, 0.08);
        }
        .schedule-change-banner[hidden] {
            display: none !important;
        }
        .schedule-change-banner-copy {
            display: grid;
            gap: 7px;
            min-width: 0;
        }
        .schedule-change-banner-copy strong {
            color: #7a4310;
            font-size: 0.84rem;
        }
        .schedule-change-banner-copy ul {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin: 0;
            padding: 0;
            list-style: none;
        }
        .schedule-change-banner-copy li {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            max-width: 100%;
            padding: 5px 8px;
            border-radius: 999px;
            background: rgba(255, 255, 255, 0.72);
            color: #6f4c1f;
            font-size: 0.68rem;
            font-weight: 800;
        }
        .schedule-change-banner-copy li span {
            color: #9a5b11;
        }
        .schedule-change-detail-note {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin: 10px 0 12px;
            padding: 10px 12px;
            border: 1px solid rgba(194, 126, 31, 0.28);
            border-radius: 12px;
            background: rgba(255, 247, 221, 0.8);
            color: #7a4310;
            font-size: 0.75rem;
            font-weight: 800;
        }
        .schedule-change-detail-note span {
            color: #9a5b11;
        }
        @media (max-width: 720px) {
            .schedule-change-banner,
            .schedule-change-detail-note {
                align-items: stretch;
                flex-direction: column;
            }
            .schedule-change-banner .btn-main {
                width: 100%;
            }
        }
        #apply-slot-overview-list td:last-child,
        #apply-slot-overview-list th:last-child { text-align: center; }
        table { width: 100%; border-collapse: collapse; }
        th, td { padding: 9px 10px; border-bottom: 1px solid var(--line-soft); text-align: left; font-size: 0.74rem; }
        th { background: #f8fbff; color: #475569; font-weight: 800; position: sticky; top: 0; z-index: 2; box-shadow: inset 0 -1px 0 var(--line-soft); }
        #admin-app-list th:first-child,
        #admin-app-list td:first-child,
        #admin-slot-list th:first-child,
        #admin-slot-list td:first-child {
            width: 48px;
        }
        .store-master-management .member-list-scroller {
            max-height: 620px;
            overflow-y: auto;
            overflow-x: hidden;
            min-height: 0;
        }
        .store-master-management #store-master-list {
            min-width: 0;
        }
        .store-master-list-table {
            width: 100%;
            min-width: 0;
            table-layout: fixed;
            border-collapse: separate;
            border-spacing: 0;
        }
        .store-master-list-table thead th {
            position: sticky;
            top: 0;
            z-index: 3;
            background: #f8fbff;
        }
        .store-master-list-table th:first-child,
        .store-master-list-table td:first-child {
            width: 40px;
            min-width: 40px;
            text-align: center;
        }
        .store-master-list-table th:nth-child(2),
        .store-master-list-table td:nth-child(2) {
            width: 56px;
            min-width: 56px;
            text-align: center;
        }
        .store-master-list-table th:nth-child(4),
        .store-master-list-table td:nth-child(4) {
            width: 96px;
            min-width: 96px;
        }
        .store-master-list-table th:nth-child(5),
        .store-master-list-table td:nth-child(5) {
            width: 110px;
            min-width: 110px;
        }
        .store-master-list-table th:nth-child(6),
        .store-master-list-table td:nth-child(6) {
            width: 92px;
            min-width: 92px;
            text-align: center;
        }
        .store-master-list-table td:nth-child(3) {
            min-width: 0;
            vertical-align: top;
        }
        .store-master-list-name {
            display: block;
            font-size: 0.82rem;
            font-weight: 800;
            line-height: 1.3;
            color: var(--text);
            white-space: normal;
            word-break: keep-all;
            overflow-wrap: anywhere;
        }
        .store-master-list-aux {
            margin-top: 6px;
            min-width: 0;
            display: grid;
            gap: 4px;
        }
        .store-master-list-address {
            font-size: 0.72rem;
            line-height: 1.45;
            color: var(--muted);
            white-space: normal;
            word-break: keep-all;
            overflow-wrap: break-word;
        }
        .store-master-list-phone {
            font-size: 0.73rem;
            font-weight: 700;
            color: #37526a;
            white-space: nowrap;
        }
        .store-master-list-cell {
            font-size: 0.76rem;
            line-height: 1.35;
            color: #48627a;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .store-master-row-no {
            font-size: 0.74rem;
            font-weight: 700;
            color: #5b738a;
        }
        .store-master-list-status {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 100%;
        }
        .table-select-head {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto;
        }
        #survey-insight-record-list th.select-col,
        #survey-insight-record-list td.select-col {
            width: 52px;
            min-width: 52px;
            text-align: center;
            padding-left: 8px;
            padding-right: 8px;
        }
        #survey-insight-record-list input[type="checkbox"] {
            appearance: auto;
            -webkit-appearance: checkbox;
            width: 16px;
            height: 16px;
            margin: 0;
            padding: 0;
            border: none;
            border-radius: 0;
            box-shadow: none;
            background: transparent;
            vertical-align: middle;
            accent-color: var(--primary);
        }
        #admin-app-list th.select-col,
        #admin-app-list .table-actions,
        #admin-app-list .table-actions button,
        #admin-app-list td:last-child,
        #admin-app-list th:nth-child(3),
        #admin-app-list td:nth-child(3),
        #admin-slot-list th:nth-child(3),
        #admin-app-list th:last-child,
        #admin-app-list td:last-child,
        #admin-slot-list th:last-child,
        #admin-slot-list th:nth-child(4),
        #admin-slot-list th:nth-child(5),
        #admin-slot-list th:nth-child(6),
        #admin-slot-list th:nth-child(7),
        #admin-slot-list td:nth-child(4),
        #admin-slot-list td:nth-child(5),
        #admin-slot-list td:nth-child(6),
        tbody tr:hover { background: #fcfdff; }
        tbody tr:nth-child(even) { background: rgba(248, 251, 253, 0.55); }
        .table-actions { display: flex; gap: 8px; flex-wrap: wrap; }
        .table-actions .btn-danger,
        .table-actions .btn-ghost,
        .table-actions .btn-main { padding: 8px 10px; border-radius: 10px; font-size: 0.76rem; font-weight: 800; transition: transform 0.16s ease, box-shadow 0.18s ease, filter 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease; }
        .table-actions .btn-danger:disabled,
        .table-actions .btn-ghost:disabled,
        .table-actions .btn-main:disabled { cursor: not-allowed; opacity: 0.45; box-shadow: none; }
        .table-actions .btn-danger:not(:disabled):hover,
        .table-actions .btn-ghost:not(:disabled):hover,
        .table-actions .btn-main:not(:disabled):hover,
        .table-actions .btn-inline-confirm:not(:disabled):hover {
            transform: translateY(-1px);
            box-shadow: 0 10px 18px rgba(15, 23, 42, 0.12);
            filter: saturate(1.05);
        }
.table-actions .btn-danger:not(:disabled):focus-visible,
.table-actions .btn-ghost:not(:disabled):focus-visible,
.table-actions .btn-main:not(:disabled):focus-visible,
.table-actions .btn-inline-confirm:not(:disabled):focus-visible {
            outline: 2px solid rgba(104, 152, 173, 0.38);
            outline-offset: 2px;
        }
.member-store-inline-actions {
            display: inline-flex;
            align-items: center;
            justify-content: flex-end;
            gap: 8px;
            flex-wrap: nowrap;
            overflow: visible;
        }
.member-store-inline-actions .btn-ghost,
.member-store-inline-actions .btn-main {
            min-height: 38px;
            padding: 0 15px;
            border-radius: 12px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            white-space: nowrap;
            box-shadow: none;
        }
.member-store-inline-actions .btn-ghost:hover,
.member-store-inline-actions .btn-ghost:focus-visible,
.member-store-inline-actions .btn-main:hover,
        .member-store-inline-actions .btn-main:focus-visible {
            transform: translateY(-1px);
        }
        .inline-field-note {
            grid-column: 2;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            margin-top: 4px;
        }
        .inline-field-note .helper-text {
            margin: 0;
            min-width: 0;
            flex: 1 1 auto;
        }
        .inline-field-note .btn-ghost {
            min-height: 34px;
            min-width: 116px;
            padding: 0 14px;
            border-radius: 12px;
            font-size: 0.72rem;
            font-weight: 800;
            white-space: nowrap;
            flex-shrink: 0;
        }
        .status-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; padding: 5px 10px; border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.01em; box-shadow: inset 0 1px 0 rgba(255,255,255,0.52); }
.switch-line { display: inline-flex; align-items: center; gap: 10px; min-height: 40px; color: var(--muted-strong); font-size: 0.9rem; }
.switch-line input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--accent); }
.slot-preprocess-options {
  grid-column: 2;
  display: grid;
  gap: 6px;
}
.slot-preprocess-field {
  border: 1px solid transparent;
  border-radius: 14px;
  padding: 0;
  transition: background 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}
.slot-preprocess-field.is-dutyfree-active {
  background: #eef7ff;
  border-color: #b8d8f2;
  box-shadow: 0 10px 24px rgba(46, 116, 161, 0.10);
}
.slot-preprocess-field.is-dutyfree-active #admin-preprocess-label,
.slot-preprocess-field.is-dutyfree-active .switch-line {
  color: #0f5f84;
}
.slot-preprocess-options .switch-line {
  min-height: 30px;
}
.slot-preprocess-options .helper-text {
  margin: 0;
  color: var(--muted);
  font-size: 0.68rem;
}
        .status-open { color: var(--primary); background: var(--primary-soft); }
        .status-tight { color: var(--warn); background: var(--warn-soft); }
        .status-close { color: var(--danger); background: var(--danger-soft); }
        .status-expired { color: #6d28d9; background: #f5f3ff; }
        .status-cancelled { color: #6b7280; background: #f3f4f6; }
        .status-pending { color: #9a6700; background: #fff2cc; }
        .status-confirmed { color: #1d4ed8; background: #dbeafe; }
        .status-rejected { color: #be185d; background: #fce7f3; }
        .compact-table { table-layout: fixed; min-width: 0; }
        .compact-table th, .compact-table td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
        #bbm-queue-table {
            min-width: 100%;
            width: 100%;
        }
        #bbm-queue-table th,
        #bbm-queue-table td {
            white-space: normal;
            overflow: visible;
            text-overflow: initial;
            vertical-align: top;
        }
        #bbm-queue-table th:nth-child(1),
        #bbm-queue-table td:nth-child(1) { width: 8%; }
        #bbm-queue-table th:nth-child(2),
        #bbm-queue-table td:nth-child(2) { width: 15%; }
        #bbm-queue-table th:nth-child(3),
        #bbm-queue-table td:nth-child(3) { width: 10%; }
        #bbm-queue-table th:nth-child(4),
        #bbm-queue-table td:nth-child(4) { width: 11%; }
        #bbm-queue-table th:nth-child(5),
        #bbm-queue-table td:nth-child(5) { width: 28%; }
        #bbm-queue-table th:nth-child(6),
        #bbm-queue-table td:nth-child(6) { width: 8%; }
        #bbm-queue-table th:nth-child(7),
        #bbm-queue-table td:nth-child(7) { width: 8%; }
        #bbm-queue-table th:nth-child(8),
        #bbm-queue-table td:nth-child(8) { width: 12%; }
        .bbm-queue-info-cell {
            padding-top: 6px;
            padding-bottom: 6px;
        }
        .bbm-queue-info-box {
            padding: 7px 9px;
            border-radius: 10px;
            border: 1px solid rgba(226, 105, 139, 0.20);
            background: rgba(251, 236, 241, 0.72);
        }
        .bbm-queue-info-box strong {
            color: #a54666;
            font-size: 0.7rem;
        }
        .bbm-queue-info-box span {
            color: #875567;
            line-height: 1.36;
            font-size: 0.69rem;
        }
        #admin-slot-list th,
        #admin-slot-list th:nth-child(3),
        #admin-slot-list th:nth-child(4),
        #admin-slot-list th:nth-child(5),
        #admin-slot-list th:nth-child(6),
        #admin-slot-list th:nth-child(7),
        #admin-slot-list td:nth-child(3),
        #admin-slot-list td:nth-child(4),
        #admin-slot-list td:nth-child(5),
        #admin-slot-list td:nth-child(6),
        #admin-slot-list td:nth-child(7),
        #my-app-list th:nth-child(4),
        #my-app-list td:nth-child(4),
        #my-app-list th:nth-child(5),
        #my-app-list td:nth-child(5) {
            text-align: center;
        }
        #admin-slot-list td:nth-child(2) {
            font-weight: 700;
            color: var(--text);
        }
        #my-app-list td:nth-child(2) {
            font-weight: 400;
            color: var(--text);
        }
        #my-app-list th:nth-child(3),
        #my-app-list td:nth-child(3),
        #my-app-list th:nth-child(5),
        #my-app-list td:nth-child(5) {
            white-space: nowrap;
        }
        #my-app-list .table-actions {
            justify-content: center;
            flex-wrap: nowrap;
            gap: 4px;
        }
        #my-app-list .table-actions .btn-ghost,
        #my-app-list .table-actions .btn-danger {
            padding: 5px 8px;
            font-size: 0.67rem;
            white-space: nowrap;
        }
        #my-slot-list .table-actions .btn-ghost,
        #my-slot-list .table-actions .btn-danger {
            padding: 6px 7px;
            font-size: 0.7rem;
            white-space: nowrap;
        }
        #my-app-list th,
        #my-app-list td {
            padding: 6px 8px;
            font-size: 0.7rem;
        }
        #my-app-list .status-pill {
            min-width: 64px;
            padding: 4px 8px;
            font-size: 0.64rem;
        }
        .record-link-row-trigger {
            width: 100%;
            border: 0;
            background: transparent;
            padding: 0;
            text-align: left;
            font: inherit;
            font-weight: 400;
            color: inherit;
            cursor: pointer;
            appearance: none;
            -webkit-appearance: none;
            border-radius: 0;
            box-shadow: none;
        }
        .record-link-row-trigger:focus-visible {
            outline: 2px solid rgba(59, 130, 246, 0.45);
            outline-offset: 2px;
            border-radius: 6px;
        }
        #my-app-list .record-link-table-main strong {
            font-weight: 400;
        }
        #my-app-list .record-link-table-main span {
            font-size: 0.62rem;
            line-height: 1.2;
        }
        .record-link-panel {
            margin-top: 12px;
            border: 1px solid var(--line-soft);
            border-radius: 18px;
            background: linear-gradient(180deg, #fbfdff 0%, #f7fbff 100%);
            padding: 12px 14px;
            box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
        }
        .record-link-panel:empty { display: none; }
        .record-link-panel-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            margin-bottom: 8px;
        }
        .record-link-panel-head strong {
            font-size: 0.86rem;
            color: var(--text);
        }
        .record-link-meta,
        .record-link-panel-copy {
            color: var(--muted);
            font-size: 0.7rem;
            line-height: 1.45;
        }
        .record-link-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }
        .record-link-grid-single {
            display: block !important;
            width: 100%;
            grid-template-columns: minmax(0, 1fr);
        }
        .record-link-grid-single .record-link-card {
            grid-column: 1 / -1;
            width: 100% !important;
            max-width: none !important;
            box-sizing: border-box;
        }
        .record-link-card {
            border: 1px solid rgba(104, 152, 173, 0.16);
            background: #fff;
            border-radius: 16px;
            padding: 9px 10px;
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
        .record-link-card span,
        .record-link-card small {
            color: var(--muted);
            font-size: 0.66rem;
        }
        .record-link-card strong {
            color: var(--text);
            font-size: 0.8rem;
            line-height: 1.32;
        }
        .slot-guidance-panel {
            border: 1px solid rgba(104, 152, 173, 0.16);
            border-radius: 18px;
            background: linear-gradient(180deg, #fbfdff 0%, #f7fbff 100%);
            padding: 11px 13px;
        }
        .slot-guidance-panel[hidden] {
            display: none !important;
        }
        .slot-guidance-grid {
            margin-top: 0;
        }
        #apply-slot-guidance-panel .slot-guidance-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 8px;
        }
        #apply-bbm-panel .bbm-apply-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
            margin-top: 10px;
        }
        #admin-bbm-escort-panel {
            display: block !important;
            grid-column: 1 / -1;
            padding: 14px;
            border-radius: 18px;
            border: 1px solid rgba(232, 181, 190, 0.55);
            background: linear-gradient(180deg, rgba(255, 248, 249, 0.98) 0%, rgba(255, 242, 244, 0.98) 100%);
            box-shadow: 0 18px 36px rgba(163, 74, 96, 0.08);
            min-width: 0;
        }
        #admin-bbm-escort-panel[hidden] {
            display: none !important;
        }
        #admin-bbm-escort-panel .record-link-panel-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 12px;
            margin-bottom: 6px;
        }
        #admin-bbm-escort-panel .record-link-meta {
            flex: 0 0 auto;
            text-align: right;
            white-space: nowrap;
        }
        #admin-bbm-escort-panel .bbm-sensitive-retention-notice {
            margin: 10px 0 2px;
            width: 100%;
        }
        #admin-bbm-escort-panel .bbm-apply-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px 14px;
            margin-top: 12px;
            width: 100%;
        }
        #admin-slot-form-panel #admin-bbm-escort-panel .field {
            display: block;
            min-width: 0;
        }
        #admin-slot-form-panel #admin-bbm-escort-panel .field label {
            display: block;
            margin: 0 0 5px;
            padding-top: 0;
            font-size: 0.72rem;
            color: #334155;
        }
        #admin-slot-form-panel #admin-bbm-escort-panel .field > input,
        #admin-slot-form-panel #admin-bbm-escort-panel .field > select,
        #admin-slot-form-panel #admin-bbm-escort-panel .field > textarea,
        #admin-slot-form-panel #admin-bbm-escort-panel .field > p.helper-text,
        #admin-slot-form-panel #admin-bbm-escort-panel .field > .slot-attachment-inline {
            grid-column: auto;
        }
        #apply-bbm-panel {
            background: linear-gradient(180deg, rgba(255, 248, 249, 0.98) 0%, rgba(255, 242, 244, 0.98) 100%);
            border-color: rgba(232, 181, 190, 0.55);
            box-shadow: 0 18px 36px rgba(163, 74, 96, 0.08);
        }
        #apply-bbm-panel .record-link-panel-head strong {
            color: #8d2e43;
        }
        #admin-bbm-escort-panel .record-link-panel-head strong {
            color: #8d2e43;
        }
        #apply-bbm-panel .record-link-panel-copy {
            color: #7a4350;
        }
        #admin-bbm-escort-panel .record-link-panel-copy {
            color: #7a4350;
        }
        .bbm-sensitive-retention-notice {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            gap: 6px 10px;
            margin-top: 8px;
            padding: 8px 11px;
            border-radius: 12px;
            border: 1px solid rgba(191, 98, 121, 0.24);
            background: rgba(255, 255, 255, 0.72);
            color: #8d2e43;
            font-size: 0.72rem;
            line-height: 1.3;
        }
        .bbm-sensitive-retention-notice strong {
            flex: 0 0 auto;
            font-weight: 900;
        }
        .bbm-sensitive-retention-notice span {
            font-weight: 650;
        }
        #apply-bbm-panel textarea.table-field {
            min-height: 92px;
            resize: vertical;
        }
        #admin-bbm-escort-panel textarea.table-field {
            min-height: 92px;
            resize: vertical;
        }
        #apply-bbm-panel .table-field {
            border-color: rgba(216, 167, 177, 0.5);
            background: rgba(255, 255, 255, 0.96);
        }
        #admin-bbm-escort-panel .table-field {
            border-color: rgba(216, 167, 177, 0.5);
            background: rgba(255, 255, 255, 0.96);
        }
        #apply-bbm-panel .table-field:focus {
            border-color: rgba(191, 98, 121, 0.6);
            box-shadow: 0 0 0 4px rgba(191, 98, 121, 0.12);
        }
        #admin-bbm-escort-panel .table-field:focus {
            border-color: rgba(191, 98, 121, 0.6);
            box-shadow: 0 0 0 4px rgba(191, 98, 121, 0.12);
        }
        #apply-slot-guidance-panel .record-link-card {
            padding: 10px 11px;
            border-radius: 14px;
        }
        #apply-bbm-panel .record-link-card {
            padding: 10px 11px;
            border-radius: 14px;
        }
        #apply-slot-guidance-panel .record-link-card small {
            font-size: 0.64rem;
        }
        #apply-slot-guidance-panel .record-link-card strong {
            font-size: 0.8rem;
            line-height: 1.35;
        }
        #apply-bbm-panel .record-link-card small {
            font-size: 0.64rem;
        }
        #apply-bbm-panel .record-link-card strong {
            font-size: 0.8rem;
            line-height: 1.35;
        }
        .slot-guidance-link {
            color: var(--primary);
            text-decoration: none;
            font-weight: 800;
        }
        .slot-guidance-link:hover,
        .slot-guidance-link:focus-visible {
            text-decoration: underline;
        }
        .slot-guidance-file-list {
            display: flex;
            flex-direction: column;
            gap: 6px;
            margin-top: 2px;
        }
        .slot-guidance-file-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            padding: 8px 10px;
            border-radius: 12px;
            border: 1px solid rgba(104, 152, 173, 0.14);
            background: rgba(245, 250, 254, 0.9);
            color: var(--text);
            text-decoration: none;
            width: 100%;
            text-align: left;
            cursor: pointer;
        }
        .slot-guidance-file-item:hover,
        .slot-guidance-file-item:focus-visible {
            border-color: rgba(72, 136, 164, 0.26);
            background: rgba(238, 247, 252, 0.96);
        }
        .slot-guidance-file-name {
            font-weight: 400;
            line-height: 1.35;
            word-break: break-word;
        }
        .slot-guidance-file-action {
            flex: 0 0 auto;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 24px;
            height: 24px;
            color: var(--primary);
            white-space: nowrap;
            border-radius: 999px;
            background: rgba(255,255,255,0.88);
            border: 1px solid rgba(104, 152, 173, 0.16);
        }
        .slot-guidance-file-action svg {
            width: 14px;
            height: 14px;
        }
        .table-subcopy {
            margin-top: 4px;
            font-size: 0.68rem;
            color: var(--muted);
            line-height: 1.4;
        }
        .record-link-card-emphasis {
            min-height: 112px;
            width: 100%;
            box-sizing: border-box;
            background: linear-gradient(180deg, rgba(255, 247, 248, 0.98) 0%, rgba(255, 239, 242, 0.98) 100%);
            border-color: rgba(232, 181, 190, 0.52);
        }
        .bbm-resident-row {
            display: grid;
            grid-template-columns: minmax(112px, 1fr) auto minmax(92px, 0.72fr);
            gap: 8px;
            align-items: center;
        }
        .bbm-resident-inputs {
            display: grid;
            grid-template-columns: minmax(112px, 1fr) auto minmax(112px, 1fr);
            gap: 8px;
            align-items: center;
        }
        .bbm-resident-inputs > input {
            min-width: 0;
            width: 100%;
        }
        .bbm-resident-separator,
        .bbm-resident-mask,
        .bbm-resident-divider {
            color: #8d2e43;
            font-weight: 800;
            letter-spacing: 0.08em;
        }
        .bbm-resident-back {
            text-align: center;
        }
        .bbm-resident-preview {
            margin-top: 8px;
            padding: 8px 10px;
            border-radius: 12px;
            border: 1px dashed rgba(191, 98, 121, 0.34);
            background: rgba(255, 255, 255, 0.75);
            color: #8d2e43;
            font-size: 0.76rem;
            font-weight: 700;
        }
        .bbm-resident-preview.is-invalid {
            border-color: rgba(203, 61, 61, 0.42);
            background: rgba(255, 243, 243, 0.9);
            color: #b42318;
        }
        .bbm-extra-notes-field {
            grid-column: 1 / -1;
        }
        #apply-bbm-panel .table-subcopy {
            color: #8b5a66;
            font-size: 0.64rem;
            line-height: 1.28;
        }
        #admin-bbm-escort-panel .table-subcopy {
            color: #8b5a66;
            font-size: 0.64rem;
            line-height: 1.28;
        }
        #apply-bbm-panel .field label {
            font-size: 0.72rem;
        }
        #admin-bbm-escort-panel .field label {
            font-size: 0.72rem;
        }
        #apply-bbm-panel select.table-field,
        #apply-bbm-panel input.table-field {
            font-size: 0.76rem;
            font-weight: 650;
        }
        #admin-bbm-escort-panel select.table-field,
        #admin-bbm-escort-panel input.table-field {
            font-size: 0.76rem;
            font-weight: 650;
        }
        #apply-bbm-panel .table-subcopy.is-invalid {
            color: #b42318;
            font-weight: 700;
        }
        #admin-bbm-escort-panel .table-subcopy.is-invalid {
            color: #b42318;
            font-weight: 700;
        }
        #apply-bbm-panel .table-field[aria-invalid="true"] {
            border-color: rgba(203, 61, 61, 0.55);
            box-shadow: 0 0 0 4px rgba(203, 61, 61, 0.1);
            background: rgba(255, 247, 247, 0.98);
        }
        #admin-bbm-escort-panel .table-field[aria-invalid="true"] {
            border-color: rgba(203, 61, 61, 0.55);
            box-shadow: 0 0 0 4px rgba(203, 61, 61, 0.1);
            background: rgba(255, 247, 247, 0.98);
        }
        @media (max-width: 900px) {
            #apply-bbm-panel .bbm-apply-grid,
            #admin-bbm-escort-panel .bbm-apply-grid {
                grid-template-columns: minmax(0, 1fr);
            }
            #admin-bbm-panel .bbm-official-document-grid {
                grid-template-columns: minmax(0, 1fr) !important;
                gap: 14px !important;
            }
            #admin-bbm-panel .bbm-official-form-column,
            #admin-bbm-panel .bbm-official-preview-panel {
                min-width: 0;
                width: 100%;
                max-width: 100%;
                box-sizing: border-box;
            }
            #admin-bbm-panel .bbm-official-preview-panel {
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
            }
        }
        @media (max-width: 640px) {
            .bbm-resident-row {
                grid-template-columns: minmax(96px, 1fr) auto minmax(78px, 0.75fr);
                gap: 6px;
            }
            .bbm-resident-inputs {
                grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
                gap: 6px;
            }
            #admin-bbm-panel #bbm-queue-table,
            #admin-bbm-panel #bbm-queue-table thead,
            #admin-bbm-panel #bbm-queue-table tbody,
            #admin-bbm-panel #bbm-queue-table tr,
            #admin-bbm-panel #bbm-queue-table td {
                display: block;
                width: 100% !important;
                min-width: 0;
                box-sizing: border-box;
            }
            #admin-bbm-panel #bbm-queue-table {
                table-layout: auto;
                border-collapse: separate;
                border-spacing: 0;
            }
            #admin-bbm-panel #bbm-queue-table thead {
                display: none;
            }
            #admin-bbm-panel #bbm-queue-table tbody {
                display: grid;
                gap: 10px;
                padding: 8px;
            }
            #admin-bbm-panel #bbm-queue-table tr {
                padding: 12px;
                border: 1px solid rgba(104, 152, 173, 0.18);
                border-radius: 16px;
                background: #fff;
                box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
            }
            #admin-bbm-panel #bbm-queue-table td {
                display: grid;
                grid-template-columns: 72px minmax(0, 1fr);
                gap: 8px;
                align-items: start;
                padding: 7px 0;
                border: 0;
                white-space: normal;
                overflow: visible;
                text-overflow: initial;
                word-break: break-word;
                font-size: 0.74rem;
            }
            #admin-bbm-panel #bbm-queue-table td::before {
                content: attr(data-label);
                color: var(--muted);
                font-size: 0.68rem;
                font-weight: 850;
                line-height: 1.35;
            }
            #admin-bbm-panel #bbm-queue-table td.bbm-queue-info-cell {
                padding-top: 7px;
                padding-bottom: 7px;
            }
            #admin-bbm-panel #bbm-queue-table .bbm-queue-info-box {
                min-width: 0;
                padding: 9px 10px;
            }
            #admin-bbm-panel #bbm-queue-table .status-pill {
                justify-self: start;
            }
            #admin-bbm-panel #bbm-queue-table .table-actions {
                justify-content: flex-start;
                gap: 6px;
            }
            #admin-bbm-panel #bbm-queue-table .table-actions > * {
                flex: 1 1 130px;
                min-height: 36px;
            }
            #admin-bbm-panel .section-header {
                align-items: stretch;
            }
            #admin-bbm-panel .section-header .table-actions,
            #admin-bbm-panel .section-header .section-header-actions {
                width: 100%;
                justify-content: flex-start;
                flex-wrap: wrap;
            }
            #admin-bbm-panel .section-header .table-actions > *,
            #admin-bbm-panel .section-header .section-header-actions > * {
                flex: 1 1 150px;
            }
            #admin-bbm-panel .bbm-official-preview-panel {
                padding: 12px !important;
            }
            #admin-bbm-panel .bbm-official-preview-panel .record-link-panel-head {
                align-items: flex-start;
                flex-direction: column;
            }
        }
        .record-link-panel.record-link-panel-status.is-rejected {
            background: linear-gradient(180deg, rgba(253, 246, 248, 0.98) 0%, rgba(250, 238, 242, 0.98) 100%);
            border-color: rgba(230, 177, 193, 0.45);
        }
        .record-link-panel.record-link-panel-status.is-cancelled {
            background: linear-gradient(180deg, rgba(247, 246, 242, 0.98) 0%, rgba(241, 239, 232, 0.98) 100%);
            border-color: rgba(205, 199, 183, 0.48);
        }
        .record-link-panel.record-link-panel-status.is-rejected .record-link-card-emphasis {
            background: rgba(252, 241, 245, 0.98);
            border-color: rgba(230, 177, 193, 0.45);
        }
        .record-link-panel.record-link-panel-status.is-cancelled .record-link-card-emphasis {
            background: rgba(244, 242, 237, 0.98);
            border-color: rgba(205, 199, 183, 0.48);
        }
        .record-link-list {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        .record-link-list-item {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 12px;
            border: 1px solid rgba(104, 152, 173, 0.14);
            background: #fff;
            border-radius: 16px;
            padding: 12px 14px;
        }
        .record-link-list-main {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 6px;
        }
        .record-link-list-title-row {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }
        .record-link-list-title-row strong {
            font-size: 0.88rem;
            color: var(--text);
        }
        .record-link-list-meta {
            display: flex;
            flex-wrap: wrap;
            gap: 8px 12px;
            color: var(--muted);
            font-size: 0.74rem;
        }
        .record-link-list-actions {
            flex: 0 0 auto;
            display: flex;
            align-items: center;
            justify-content: flex-end;
        }
        .btn-inline-confirm {
            min-width: 86px;
            padding: 8px 12px;
            font-size: 0.75rem;
            border-radius: 12px;
        }
        .record-link-inline-note {
            color: var(--muted);
            font-size: 0.74rem;
            font-weight: 700;
        }
        .slot-applicant-queue-panel {
            margin-top: 18px;
        }
        .record-link-summary-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
            margin-top: 12px;
        }
        .record-link-summary-card {
            border: 1px solid rgba(104, 152, 173, 0.14);
            border-radius: 14px;
            background: #fff;
            padding: 10px 12px;
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
        .record-link-summary-card span {
            color: var(--muted);
            font-size: 0.72rem;
        }
        .record-link-summary-card strong {
            color: var(--text);
            font-size: 0.98rem;
        }
        .record-link-summary-copy {
            margin-top: 12px;
            color: var(--muted);
            font-size: 0.74rem;
            line-height: 1.55;
        }
        .record-link-summary-meta {
            margin-top: 10px;
            display: flex;
            flex-wrap: wrap;
            gap: 8px 14px;
            color: var(--muted);
            font-size: 0.72rem;
        }
        .record-link-confirmed-section {
            margin-top: 14px;
            border-top: 1px solid rgba(104, 152, 173, 0.16);
            padding-top: 14px;
        }
        .record-link-section-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 10px;
        }
        .record-link-section-head strong {
            font-size: 0.86rem;
            color: var(--text);
        }
        .record-link-section-head span {
            color: var(--muted);
            font-size: 0.72rem;
            font-weight: 700;
        }
        .record-link-empty-note {
            border: 1px dashed rgba(104, 152, 173, 0.22);
            border-radius: 14px;
            padding: 12px 14px;
            background: linear-gradient(180deg, #fbfdfe 0%, #f7fbff 100%);
            color: var(--muted);
            font-size: 0.74rem;
        }
        .record-link-metric-row {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
            margin-bottom: 14px;
        }
        .record-link-metric-row-five {
            grid-template-columns: repeat(5, minmax(0, 1fr));
        }
        .my-slot-pending-period-row {
            display: grid;
            grid-template-columns: minmax(220px, 320px) minmax(0, 1fr);
            gap: 10px;
            align-items: end;
            margin: 12px 0 10px;
        }
        .my-slot-pending-period-field {
            margin: 0;
        }
        .my-slot-pending-summary {
            margin: 0;
            align-self: end;
        }
        .record-link-metric {
            border: 1px solid rgba(104, 152, 173, 0.14);
            border-radius: 14px;
            background: #fff;
            padding: 11px 12px;
            display: flex;
            flex-direction: column;
            gap: 4px;
        }
        .record-link-metric span {
            color: var(--muted);
            font-size: 0.72rem;
        }
        .record-link-metric strong {
            color: var(--text);
            font-size: 1rem;
        }
        .record-link-table-wrap {
            max-height: 460px;
            overflow-y: auto;
            overflow-x: auto;
            background: #fff;
            border: 1px solid rgba(104, 152, 173, 0.12);
            border-radius: 16px;
        }
        #my-slot-pending-list {
            display: block;
            width: 100%;
            min-width: 100%;
            border-collapse: separate;
            border-spacing: 0;
        }
        #my-slot-pending-list thead,
        #my-slot-pending-list tbody {
            display: block;
            width: 100%;
        }
        #my-slot-pending-list thead tr,
        #my-slot-pending-list tbody tr {
            display: grid;
            grid-template-columns: minmax(96px, 0.9fr) minmax(180px, 1.2fr) minmax(220px, 1.35fr) minmax(96px, 0.85fr) minmax(220px, 1.35fr) minmax(250px, 1.1fr);
            width: 100%;
        }
        #my-slot-pending-list tbody tr {
            align-items: stretch;
            border-bottom: 1px solid var(--line-soft);
            cursor: pointer;
        }
        #my-slot-pending-list tbody tr:last-child {
            border-bottom: none;
        }
        .record-link-table th,
        .record-link-table td {
            padding: 5px 7px;
            font-size: 0.65rem;
            vertical-align: top;
        }
        #my-slot-pending-list th,
        #my-slot-pending-list td {
            white-space: normal;
            overflow: visible;
            text-overflow: initial;
            box-sizing: border-box;
            background-clip: padding-box;
            min-width: 0;
            border-bottom: none;
            background: transparent !important;
        }
        #my-slot-pending-list .pending-col-date { width: auto; min-width: 0; }
        #my-slot-pending-list .pending-col-store { width: auto; min-width: 0; }
        #my-slot-pending-list .pending-col-applicant { width: auto; min-width: 0; }
        #my-slot-pending-list .pending-col-status { width: auto; min-width: 0; }
        #my-slot-pending-list .pending-col-reason { width: auto; min-width: 0; }
        #my-slot-pending-list .pending-col-actions { width: auto; min-width: 0; }
        .record-link-table-main {
            display: flex;
            flex-direction: column;
            gap: 1px;
            min-width: 0;
        }
        .record-link-table-main strong {
            color: var(--text);
            font-size: 0.72rem;
        }
        .record-link-table-main span,
        .record-link-reason-cell {
            color: var(--muted);
            line-height: 1.28;
            white-space: normal;
            word-break: break-word;
        }
        .record-link-reason-cell {
            display: flex;
            flex-direction: column;
            gap: 2px;
        }
        .record-link-reason-cell strong {
            color: var(--text);
            font-size: 0.66rem;
            font-weight: 800;
        }
        #my-slot-pending-list .table-actions {
            flex-wrap: wrap;
            gap: 5px;
            justify-content: flex-start;
            align-items: center;
        }
        #my-slot-pending-list td.pending-col-actions,
        #my-slot-pending-list th.pending-col-actions {
            text-align: left;
        }
        .record-link-reason-cell {
            min-width: 0;
            width: 100%;
        }
        #my-slot-pending-list .btn-ghost,
        #my-slot-pending-list .btn-inline-confirm {
            padding: 5px 8px;
            font-size: 0.64rem;
            min-width: 58px;
            white-space: nowrap;
        }
        #my-slot-pending-list td:last-child {
            overflow: hidden;
        }
        #my-slot-pending-list .table-actions {
            display: grid;
            grid-template-columns: repeat(2, max-content);
            justify-content: flex-start;
            align-items: center;
            gap: 4px;
            max-width: 100%;
        }
        #my-slot-pending-list .status-pill {
            min-width: 54px;
            padding: 4px 8px;
            font-size: 0.63rem;
        }
        #my-slot-pending-list tbody tr.is-selected td {
            background: rgba(191, 223, 238, 0.52) !important;
            border-bottom-color: rgba(176, 207, 223, 0.96) !important;
        }
        .empty { padding: 18px 14px; color: var(--muted); text-align: center; font-size: 0.76rem; }
        body.summary-hidden .hero,
        body.summary-hidden .kpi-grid { display: none; }
        .toast-stack {
            position: fixed;
            top: 22px;
            right: 22px;
            z-index: 5000;
            display: flex;
            flex-direction: column;
            gap: 10px;
            pointer-events: none;
        }
        .toast {
            min-width: 260px;
            max-width: min(360px, calc(100vw - 32px));
            padding: 13px 14px;
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.98);
            border: 1px solid var(--line-soft);
            box-shadow: 0 18px 32px rgba(0, 51, 73, 0.18);
            color: var(--text);
            display: grid;
            grid-template-columns: 10px 1fr;
            gap: 12px;
            align-items: start;
            pointer-events: auto;
            animation: toastIn 0.2s ease;
        }
        .toast::before {
            content: "";
            width: 10px;
            height: 10px;
            border-radius: 999px;
            margin-top: 5px;
            background: var(--info);
        }
        .toast.success::before { background: var(--success); }
        .toast.error::before { background: var(--danger); }
        .toast.info::before { background: var(--primary); }
        .toast-body strong {
            display: block;
            margin-bottom: 4px;
            font-size: 0.84rem;
            font-weight: 800;
        }
        .toast-body span {
            display: block;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.55;
        }
        .confirm-overlay {
            position: fixed;
            inset: 0;
            background: rgba(11, 23, 32, 0.42);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 6000;
            padding: 24px;
        }
        .confirm-overlay.open { display: flex; }
        .confirm-dialog {
            width: min(460px, calc(100vw - 32px));
            background: #fff;
            border-radius: 18px;
            border: 1px solid var(--line-soft);
            box-shadow: 0 24px 60px rgba(0, 24, 39, 0.22);
            padding: 22px;
            display: grid;
            gap: 14px;
        }
        .confirm-dialog .section-kicker {
            margin: 0;
            color: var(--danger);
        }
        .confirm-dialog h3 {
            margin: 0;
            font-size: 1.08rem;
            color: var(--text);
        }
        .confirm-dialog p {
            margin: 0;
            color: var(--muted);
            font-size: 0.88rem;
            line-height: 1.65;
        }
        .confirm-dialog .field {
            gap: 6px;
        }
        .confirm-dialog .field input {
            width: 100%;
        }
        .confirm-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
        }
        .password-result-dialog {
            width: min(460px, calc(100vw - 32px));
            background: #fff;
            border-radius: 18px;
            border: 1px solid var(--line-soft);
            box-shadow: 0 24px 60px rgba(0, 24, 39, 0.22);
            padding: 22px;
            display: grid;
            gap: 14px;
        }
        .password-result-dialog .section-kicker {
            margin: 0;
            color: var(--primary);
        }
        .password-result-dialog h3 {
            margin: 0;
            font-size: 1.08rem;
            color: var(--text);
        }
        .password-result-dialog p {
            margin: 0;
            color: var(--muted);
            font-size: 0.88rem;
            line-height: 1.65;
        }
        .password-result-box {
            border: 1px dashed rgba(19, 82, 108, 0.24);
            background: rgba(235, 245, 249, 0.78);
            border-radius: 16px;
            padding: 16px;
            display: grid;
            gap: 8px;
        }
        .password-result-box strong {
            font-size: 1.08rem;
            color: var(--text);
            word-break: break-all;
        }
        .password-result-actions {
            display: flex;
            justify-content: flex-end;
            gap: 10px;
        }
        .survey-completion-dialog {
            position: relative;
            overflow: hidden;
            width: min(500px, calc(100vw - 32px));
            background: linear-gradient(180deg, #ffffff 0%, #f9fdff 100%);
            border-radius: 22px;
            border: 1px solid rgba(111, 166, 191, 0.28);
            box-shadow: 0 28px 72px rgba(0, 24, 39, 0.24);
            padding: 26px 24px 22px;
            display: grid;
            gap: 14px;
            text-align: center;
        }
        .survey-completion-dialog .section-kicker {
            margin: 0;
            color: var(--primary);
        }
        .survey-completion-dialog h3 {
            margin: 0;
            font-size: 1.22rem;
            color: var(--text);
        }
        .survey-completion-dialog p {
            margin: 0;
            color: var(--muted);
            font-size: 0.92rem;
            line-height: 1.7;
        }
        .survey-completion-summary {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            justify-self: center;
            min-height: 42px;
            padding: 10px 16px;
            border-radius: 999px;
            background: rgba(235, 245, 249, 0.92);
            border: 1px solid rgba(111, 166, 191, 0.22);
            color: var(--text);
            font-size: 0.84rem;
            font-weight: 700;
        }
        .survey-completion-actions {
            display: flex;
            justify-content: center;
        }
        .survey-completion-actions .btn-main {
            min-width: 140px;
        }
        .survey-completion-burst {
            position: absolute;
            inset: 0;
            pointer-events: none;
        }
        .survey-completion-burst span {
            position: absolute;
            display: block;
            opacity: 0;
            animation: surveyCelebrationDrift 3.2s ease-in-out infinite;
        }
        .survey-completion-burst span::before {
            display: block;
            white-space: pre;
            font-weight: 700;
            letter-spacing: -0.08em;
            text-shadow: 0 4px 12px rgba(0, 24, 39, 0.08);
        }
        .survey-completion-burst span:nth-child(1) { top: 18px; left: 26px; animation-delay: 0s; }
        .survey-completion-burst span:nth-child(1)::before { content: "✦"; font-size: 22px; color: #6fa6bf; }
        .survey-completion-burst span:nth-child(2) { top: 30px; left: 76px; animation-delay: .22s; }
        .survey-completion-burst span:nth-child(2)::before { content: "❄"; font-size: 18px; color: #e2698b; }
        .survey-completion-burst span:nth-child(3) { top: 14px; right: 28px; animation-delay: .38s; }
        .survey-completion-burst span:nth-child(3)::before { content: "✦"; font-size: 22px; color: #6fa6bf; }
        .survey-completion-burst span:nth-child(4) { top: 36px; right: 82px; animation-delay: .54s; }
        .survey-completion-burst span:nth-child(4)::before { content: "❄"; font-size: 18px; color: #e2698b; }
        .survey-completion-burst span:nth-child(5) { top: 82px; left: 18px; animation-delay: .18s; }
        .survey-completion-burst span:nth-child(5)::before { content: "✧"; font-size: 20px; color: rgba(226, 105, 139, 0.9); }
        .survey-completion-burst span:nth-child(6) { top: 82px; right: 18px; animation-delay: .44s; }
        .survey-completion-burst span:nth-child(6)::before { content: "✧"; font-size: 20px; color: rgba(111, 166, 191, 0.92); }
        .survey-completion-burst span:nth-child(7) { bottom: 96px; left: 46px; animation-delay: .76s; }
        .survey-completion-burst span:nth-child(7)::before { content: "✷"; font-size: 20px; color: #e2698b; }
        .survey-completion-burst span:nth-child(8) { bottom: 82px; left: 112px; animation-delay: .98s; }
        .survey-completion-burst span:nth-child(8)::before { content: "❄"; font-size: 16px; color: #6fa6bf; }
        .survey-completion-burst span:nth-child(9) { bottom: 98px; right: 48px; animation-delay: 1.14s; }
        .survey-completion-burst span:nth-child(9)::before { content: "✷"; font-size: 20px; color: #e2698b; }
        .survey-completion-burst span:nth-child(10) { bottom: 84px; right: 114px; animation-delay: 1.32s; }
        .survey-completion-burst span:nth-child(10)::before { content: "❄"; font-size: 16px; color: #6fa6bf; }
        .survey-completion-burst span:nth-child(11) { top: 118px; left: 18px; animation-delay: .62s; }
        .survey-completion-burst span:nth-child(11)::before { content: "✦  ✧"; font-size: 16px; color: rgba(111, 166, 191, 0.72); }
.survey-completion-burst span:nth-child(12) { top: 118px; right: 18px; animation-delay: .92s; }
.survey-completion-burst span:nth-child(12)::before { content: "✧  ✦"; font-size: 16px; color: rgba(226, 105, 139, 0.72); }
.schedule-change-notice-dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  display: grid;
  gap: 14px;
  padding: 24px;
  border-radius: 22px;
  border: 1px solid rgba(194, 126, 31, 0.28);
  background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%);
  box-shadow: 0 28px 72px rgba(0, 24, 39, 0.24);
  color: var(--text);
}
.schedule-change-notice-dialog .section-kicker {
  margin: 0;
  color: #9a5b11;
}
.schedule-change-notice-dialog h3 {
  margin: 0;
  font-size: 1.2rem;
  color: var(--text);
}
.schedule-change-notice-dialog p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.65;
}
.schedule-change-notice-list {
  display: grid;
  gap: 8px;
  max-height: min(42dvh, 320px);
  overflow: auto;
}
.schedule-change-notice-item {
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(194, 126, 31, 0.22);
  background: rgba(255, 255, 255, 0.82);
}
.schedule-change-notice-item strong {
  color: #7a4310;
  font-size: 0.86rem;
}
.schedule-change-notice-item span {
  color: #9a5b11;
  font-size: 0.78rem;
  font-weight: 900;
}
.schedule-change-notice-more {
  padding: 9px 12px;
  border-radius: 12px;
  background: rgba(194, 126, 31, 0.09);
  color: #7a4310;
  font-size: 0.76rem;
  font-weight: 800;
  text-align: center;
}
.schedule-change-notice-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.confirmed-cancel-notice-dialog {
  width: min(640px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  overflow: auto;
  display: grid;
  gap: 14px;
  padding: 24px;
  border-radius: 22px;
  border: 1px solid rgba(194, 126, 31, 0.28);
  background: linear-gradient(180deg, #ffffff 0%, #fffaf0 100%);
  box-shadow: 0 28px 72px rgba(0, 24, 39, 0.24);
  color: var(--text);
}
.confirmed-cancel-notice-dialog .section-kicker {
  margin: 0;
  color: #9a5b11;
}
.confirmed-cancel-notice-dialog h3 {
  margin: 0;
  font-size: 1.2rem;
  color: var(--text);
}
.confirmed-cancel-notice-dialog p {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.65;
}
#confirmed-cancel-notice-message {
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid rgba(194, 126, 31, 0.22);
  background: rgba(255, 247, 237, 0.92);
  color: #7a4310;
  font-weight: 700;
}
#confirmed-cancel-notice-message strong {
  color: #8a4b12;
  font-weight: 900;
}
.confirmed-cancel-notice-summary {
  padding: 11px 12px;
  border-radius: 14px;
  background: rgba(194, 126, 31, 0.09);
  color: #7a4310;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.55;
}
.confirmed-cancel-notice-list {
  display: grid;
  gap: 8px;
  max-height: min(42dvh, 320px);
  overflow: auto;
}
.confirmed-cancel-notice-item {
  display: grid;
  gap: 7px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid rgba(194, 126, 31, 0.22);
  background: rgba(255, 255, 255, 0.82);
}
.confirmed-cancel-notice-item strong {
  color: #7a4310;
  font-size: 0.88rem;
}
.confirmed-cancel-notice-item span,
.confirmed-cancel-notice-item small {
  color: #9a5b11;
  font-size: 0.78rem;
  font-weight: 800;
}
.confirmed-cancel-notice-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.privacy-consent-dialog {
  position: relative;
  width: min(960px, calc(100vw - 48px));
  max-height: none;
  overflow: visible;
  display: grid;
  gap: 0;
  padding: 24px 24px 20px;
  border-radius: 28px;
  border: 1px solid rgba(111, 166, 191, 0.22);
  background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
  box-shadow: 0 30px 70px rgba(7, 40, 60, 0.22);
  color: var(--text);
}
.privacy-consent-dialog .section-kicker {
  margin: 0 0 8px;
  color: var(--primary);
}
.privacy-consent-dialog h3 {
  margin: 0;
  font-size: 1.32rem;
  color: var(--text);
}
.privacy-consent-body {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  color: var(--muted);
  font-size: 0.87rem;
  line-height: 1.62;
}
.privacy-consent-notice {
  margin: 0;
  font-weight: 800;
  color: var(--text);
  grid-column: 1 / -1;
}
.privacy-consent-body > p:not(.privacy-consent-notice) {
  grid-column: 1 / -1;
  margin: 0;
}
.privacy-consent-section {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid var(--line-soft);
  background: rgba(111, 166, 191, 0.07);
}
.privacy-consent-section strong {
  color: var(--text);
  font-size: 0.9rem;
}
.privacy-consent-section p,
.privacy-consent-section ul {
  margin: 0;
}
.privacy-consent-section ul {
  padding-left: 16px;
  display: grid;
  gap: 4px;
}
.privacy-consent-check {
  grid-column: 1 / -1;
  padding: 14px 16px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid rgba(104, 152, 173, 0.22);
}
.privacy-consent-check .checkbox-inline {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-weight: 700;
  color: var(--text);
}
.privacy-consent-check input[type="checkbox"] {
  margin-top: 2px;
}
.privacy-consent-actions {
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.progress-dialog {
  width: min(460px, calc(100vw - 32px));
  background: #fff;
  border-radius: 18px;
  border: 1px solid var(--line-soft);
  box-shadow: 0 24px 60px rgba(0, 24, 39, 0.22);
  padding: 22px;
  display: grid;
  gap: 14px;
}
.progress-dialog .section-kicker {
  margin: 0;
  color: var(--primary);
}
.progress-dialog h3 {
  margin: 0;
  font-size: 1.08rem;
  color: var(--text);
}
.progress-dialog p {
  margin: 0;
  color: var(--muted);
  font-size: 0.88rem;
  line-height: 1.65;
}
.progress-track {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 10px;
  border-radius: 999px;
  background: rgba(17, 87, 119, 0.12);
}
.progress-fill {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #6fa6bf 0%, #13526c 100%);
  transition: width 180ms ease;
}
.progress-dialog.is-indeterminate .progress-fill {
  width: 34%;
  animation: progressIndeterminate 1.2s ease-in-out infinite;
}
.progress-meta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}
.progress-meta strong {
  color: var(--text);
  font-size: 0.96rem;
}
.progress-meta span {
  color: var(--muted);
  font-size: 0.84rem;
}
        @media (max-width: 900px) {
            .privacy-consent-dialog {
                width: min(760px, calc(100vw - 32px));
                max-height: min(86vh, 920px);
                overflow: auto;
                padding: 22px 20px 20px;
                border-radius: 22px;
            }
            .privacy-consent-body {
                grid-template-columns: 1fr;
            }
            .privacy-consent-notice,
            .privacy-consent-body > p:not(.privacy-consent-notice),
            .privacy-consent-check {
                grid-column: auto;
            }
            .privacy-consent-actions {
                display: grid;
                grid-template-columns: 1fr 1fr;
            }
        }
        @keyframes surveyCelebrationDrift {
            0% { transform: translateY(10px) scale(0.86) rotate(0deg); opacity: 0; }
            18% { opacity: 0.9; }
            55% { transform: translateY(-8px) scale(1.06) rotate(8deg); opacity: 1; }
            100% { transform: translateY(18px) scale(0.92) rotate(-8deg); opacity: 0; }
        }
        @keyframes toastIn {
            from { opacity: 0; transform: translateY(-8px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .account-panel {
            margin-top: 10px;
            padding: 12px;
            border-radius: 14px;
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(255, 255, 255, 0.16);
        }
        .account-panel[hidden] { display: none; }
        .account-panel .field label { color: rgba(255, 255, 255, 0.88); }
        .account-panel .field input {
            background: rgba(255, 255, 255, 0.96);
            border-color: rgba(255, 255, 255, 0.32);
        }
        .account-panel .helper-text {
            color: rgba(255, 255, 255, 0.8);
            font-size: 0.72rem;
            line-height: 1.55;
        }
        .hr-wrap {
            display: grid;
            gap: 10px;
        }
        .hr-hero {
            padding: 18px 20px;
            display: grid;
            grid-template-columns: minmax(320px, 0.92fr) minmax(0, 1.48fr);
            gap: 14px;
            align-items: stretch;
        }
        .hr-hero-copy {
            display: grid;
            gap: 10px;
            align-content: start;
        }
        .hr-hero-copy h2 {
            margin: 0;
            font-size: 1.5rem;
        }
        .hr-hero-copy p {
            margin: 0;
            color: var(--muted);
            line-height: 1.65;
            font-size: 0.84rem;
        }
        .survey-report-actions {
            display: grid;
            justify-items: end;
            align-content: start;
            gap: 8px;
        }
        .survey-report-actions .btn-main {
            min-width: 168px;
            width: auto;
            white-space: nowrap;
            justify-self: end;
        }
        #survey-insight-hero-desc {
            max-width: none;
            white-space: normal;
        }
        .survey-report-actions .helper-text {
            max-width: 300px;
            text-align: right;
        }
        #view-survey-insight .hr-hero {
            grid-template-columns: minmax(0, 1fr) auto;
            align-items: start;
            gap: 18px;
        }
        #view-survey-insight .hr-hero-copy {
            min-width: 0;
        }
        #survey-insight-hero-title {
            font-size: 2.1rem;
            line-height: 1.22;
            word-break: keep-all;
        }
        #survey-insight-hero-desc {
            max-width: 820px;
        }
        #view-survey-insight .survey-report-actions {
            display: flex;
            flex-wrap: nowrap;
            justify-content: flex-end;
            align-items: center;
            gap: 10px;
            width: auto;
        }
        #view-survey-insight .survey-report-actions .btn-main,
        #view-survey-insight .survey-report-actions .excel-export-btn {
            min-width: 146px;
            width: auto;
            white-space: nowrap;
        }
        .hr-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; align-self: stretch; }
        .hr-kpi-card {
            padding: 16px 16px 14px;
            border-radius: 16px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(246,250,252,0.96) 100%);
            display: grid;
            justify-items: center;
            align-content: center;
            text-align: center;
        }
        .hr-kpi-card strong {
            display: block;
            color: var(--muted);
            font-size: 0.78rem;
            font-weight: 800;
            margin-bottom: 10px;
            text-align: center;
        }
        .hr-kpi-card .value {
            font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif;
            font-size: 1.92rem;
            font-weight: 800;
            line-height: 1;
            margin-bottom: 8px;
            text-align: center;
        }
        .hr-kpi-card span {
            display: block;
            color: var(--muted);
            font-size: 0.74rem;
            line-height: 1.55;
            text-align: center;
            margin: 0 auto;
        }
.hr-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
    gap: 10px;
}

#view-survey-insight .hr-grid > .panel.card {
    display: flex;
    flex-direction: column;
}
        .hr-grid-triple {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
        }
        .hr-stack {
            display: grid;
            gap: 10px;
        }
        .hr-list {
            display: grid;
            gap: 10px;
        }
        .hr-rank-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }
        .hr-rank-list {
            display: grid;
            gap: 8px;
        }
        .hr-rank-item {
            display: grid;
            grid-template-columns: auto minmax(0, 1fr) auto;
            align-items: center;
            gap: 10px;
            padding: 12px 14px;
            border-radius: 14px;
            border: 1px solid var(--line-soft);
            background: rgba(248, 251, 253, 0.95);
        }
        .hr-rank-no {
            width: 28px;
            height: 28px;
            border-radius: 999px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif;
            font-size: 0.78rem;
            font-weight: 800;
            color: var(--accent);
            background: #e8f2ff;
        }
        .hr-rank-main {
            min-width: 0;
        }
        .hr-rank-main strong {
            display: block;
            margin-bottom: 2px;
            font-size: 0.84rem;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
        .hr-rank-main span {
            display: block;
            color: var(--muted);
            font-size: 0.72rem;
            line-height: 1.45;
        }
        .hr-rank-value {
            font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif;
            font-size: 1.05rem;
            font-weight: 800;
            color: var(--accent);
            white-space: nowrap;
        }
        .hr-item {
            padding: 14px 15px;
            border-radius: 14px;
            border: 1px solid var(--line-soft);
            background: rgba(248, 251, 253, 0.95);
        }
        .hr-item strong {
            display: block;
            margin-bottom: 6px;
            font-size: 0.84rem;
        }
        .hr-item span {
            display: block;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.6;
        }
        .hr-score {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-width: 58px;
            padding: 8px 10px;
            border-radius: 999px;
            font-weight: 800;
            font-size: 0.82rem;
            color: var(--accent);
            background: var(--primary-soft);
        }
        .hr-score.mid {
            color: var(--warn);
            background: var(--warn-soft);
        }
        .hr-score.low {
            color: #b91c1c;
            background: #fdecef;
        }
        .hr-score.high {
            color: #1d7b45;
            background: var(--success-soft);
        }
        .hr-chart-card .chart-box {
            height: 250px;
        }
        .hr-survey-kpi-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
            gap: 10px;
        }
        .hr-survey-kpi-card {
            padding: 14px;
            border-radius: 18px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, #f8fbfd 0%, #ffffff 100%);
            display: grid;
            gap: 6px;
            text-align: center;
        }
        .hr-survey-kpi-card.is-interactive {
            cursor: pointer;
            transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
        }
        .hr-survey-kpi-card.is-interactive:hover,
        .hr-survey-kpi-card.is-interactive:focus-visible {
            transform: translateY(-2px);
            box-shadow: 0 12px 28px rgba(18, 50, 70, 0.10);
            border-color: rgba(31, 146, 176, 0.42);
            outline: none;
        }
        .hr-survey-kpi-card strong {
            color: var(--muted);
            font-size: 0.76rem;
            font-weight: 800;
        }
        .hr-survey-kpi-card .value {
            font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif;
            font-size: 1.56rem;
            line-height: 1;
            color: var(--text);
            font-weight: 800;
        }
        .hr-survey-kpi-card span {
            color: var(--muted);
            font-size: 0.72rem;
            line-height: 1.55;
        }
        .hr-word-cloud {
            position: relative;
            min-height: 220px;
            padding: 18px;
            border-radius: 22px;
            border: 1px solid rgba(104, 152, 173, 0.14);
            background:
                radial-gradient(circle at 18% 20%, rgba(138, 92, 246, 0.08), transparent 26%),
                radial-gradient(circle at 82% 28%, rgba(240, 133, 91, 0.1), transparent 24%),
                radial-gradient(circle at 52% 72%, rgba(64, 160, 255, 0.08), transparent 28%),
                linear-gradient(180deg, #fcfdff 0%, #f7fafc 100%);
            overflow: hidden;
        }
        .hr-word-chip {
            position: absolute;
            left: var(--wc-x, 50%);
            top: var(--wc-y, 50%);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            max-width: min(100%, 240px);
            padding: 4px 6px;
            border: none;
            background: transparent;
            color: var(--wc-color, #4b2e83);
            font-size: var(--wc-size, 1rem);
            font-weight: 800;
            line-height: 1.05;
            letter-spacing: 0;
            transform: translate(-50%, -50%) rotate(var(--wc-rotate, 0deg));
            transform-origin: center;
            text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
            opacity: var(--wc-opacity, 0.92);
            word-break: keep-all;
            white-space: nowrap;
            text-align: center;
            transition: transform 0.18s ease, opacity 0.18s ease, filter 0.18s ease;
        }
        .hr-word-chip:hover {
            transform: translate(-50%, -50%) rotate(var(--wc-rotate, 0deg)) scale(1.04);
            filter: saturate(1.08);
            opacity: 1;
        }
.hr-comment-list {
    display: grid;
    gap: 10px;
    flex: 0 0 520px;
    min-height: 520px;
    height: 520px;
    max-height: 520px;
    overflow: auto;
    padding-right: 2px;
}
#hr-survey-word-cloud {
    flex: 1 1 auto;
    min-height: 520px;
}
        .hr-comment-card {
            padding: 14px;
            border-radius: 16px;
            border: 1px solid var(--line-soft);
            background: #fff;
            display: grid;
            gap: 8px;
        }
        .hr-comment-filter {
            display: flex;
            flex-wrap: nowrap;
            gap: 8px;
            margin: 8px 0 12px;
        }
        .hr-comment-filter-btn {
            flex: 1 1 0;
            min-width: 0;
            min-height: 38px;
            border: 1px solid var(--line);
            border-radius: 8px;
            background: #fff;
            color: var(--muted);
            font-size: 0.76rem;
            font-weight: 800;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 7px;
            padding: 0 8px;
            white-space: nowrap;
            transition: background-color .14s ease, border-color .14s ease, color .14s ease;
        }
        .hr-comment-filter-btn span {
            min-width: 22px;
            padding: 2px 6px;
            border-radius: 999px;
            background: #eef4f7;
            color: var(--muted);
            font-size: 0.68rem;
            line-height: 1.2;
            white-space: nowrap;
        }
        .hr-comment-filter-btn:hover,
        .hr-comment-filter-btn:focus-visible {
            border-color: rgba(47, 127, 192, 0.42);
            color: var(--primary);
            background: #f7fbff;
        }
        .hr-comment-filter-btn.active {
            border-color: rgba(47, 127, 192, 0.5);
            color: var(--primary);
            background: #eef7fc;
            box-shadow: inset 0 0 0 1px rgba(47, 127, 192, 0.12);
        }
        .hr-comment-filter-btn.active span {
            background: #dceef8;
            color: #1c5e79;
        }
        .hr-comment-card.is-trainee {
            border-color: rgba(58, 128, 164, 0.22);
            background: linear-gradient(180deg, rgba(238, 247, 251, 0.98) 0%, #ffffff 100%);
            box-shadow: inset 4px 0 0 #3a80a4;
        }
        .hr-comment-card.is-buddy {
            border-color: rgba(197, 132, 49, 0.24);
            background: linear-gradient(180deg, rgba(255, 249, 239, 0.98) 0%, #ffffff 100%);
            box-shadow: inset 4px 0 0 #c58431;
        }
        .hr-comment-meta {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 10px;
            flex-wrap: wrap;
        }
        .hr-comment-meta strong {
            font-size: 0.82rem;
            color: var(--text);
        }
        .hr-comment-meta span {
            color: var(--muted);
            font-size: 0.7rem;
        }
        .hr-comment-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
        }
        .hr-comment-tags .table-badge {
            padding: 5px 9px;
            font-size: 0.66rem;
        }
        .hr-comment-tags .table-badge.survey-type-badge {
            font-weight: 900;
        }
        .hr-comment-tags .table-badge.survey-type-badge.is-trainee {
            background: rgba(58, 128, 164, 0.14);
            color: #1c5e79;
        }
        .hr-comment-tags .table-badge.survey-type-badge.is-buddy {
            background: rgba(197, 132, 49, 0.16);
            color: #8a5a18;
        }
        .hr-comment-tags .table-badge.survey-question-badge {
            background: #eef4f7;
            color: var(--muted);
            white-space: normal;
            text-align: left;
            line-height: 1.3;
        }
        .hr-comment-text {
            color: var(--text);
            font-size: 0.76rem;
            line-height: 1.65;
            white-space: pre-wrap;
            word-break: keep-all;
        }
        .hr-survey-empty {
            padding: 18px 14px;
            border-radius: 16px;
            border: 1px dashed var(--line);
            background: #fbfdff;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.6;
            text-align: center;
        }
        #view-survey-insight .hr-wrap,
        #view-survey-insight .hr-hero,
        #view-survey-insight .hr-grid,
        #view-survey-insight .hr-survey-kpi-grid,
        #view-survey-insight .card,
        #view-survey-insight .chart-box {
            min-width: 0;
            max-width: 100%;
        }
        .survey-insight-tab-shell {
            padding: 0 18px 4px;
            border: none;
            background: transparent;
            box-shadow: none;
        }
        .survey-insight-tabs {
            padding: 0;
            margin: 0;
        }
        .survey-insight-tabs .member-detail-tab {
            font-size: 0.94rem;
            font-weight: 800;
            letter-spacing: -0.01em;
            padding: 14px 18px 12px;
        }
        .survey-insight-record-row {
            cursor: pointer;
        }
        .survey-insight-record-row:hover {
            background: #f7fbff;
        }
        .survey-insight-record-row.is-active {
            background: #eef7ff;
        }
        .survey-insight-record-actions {
            white-space: nowrap !important;
            text-align: right;
        }
        .survey-insight-record-actions .btn-ghost,
        .survey-insight-record-actions .btn-danger-ghost {
            min-height: 30px;
            padding: 6px 10px;
            font-size: 0.75rem;
            border-radius: 10px;
        }
        .survey-insight-record-detail {
            margin-top: 14px;
            border: 1px solid rgba(19, 62, 88, 0.12);
            border-radius: 20px;
            background: #fff;
            box-shadow: 0 8px 24px rgba(16, 58, 83, 0.05);
            padding: 18px 20px;
            display: grid;
            gap: 14px;
        }
        .survey-insight-record-detail-head {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
            gap: 16px;
        }
        .survey-insight-record-detail-title {
            margin: 0;
            font-size: 1.06rem;
            line-height: 1.35;
            color: #163244;
        }
        .survey-insight-record-detail-subtitle {
            margin: 6px 0 0;
            font-size: 0.82rem;
            color: #627a8b;
            line-height: 1.55;
        }
        .survey-insight-record-detail-actions {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }
        .survey-insight-record-meta {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }
        .survey-insight-record-meta-card {
            border: 1px solid rgba(104, 152, 173, 0.2);
            border-radius: 14px;
            background: #fbfdff;
            padding: 12px 14px;
            display: grid;
            gap: 6px;
        }
        .survey-insight-record-meta-card span {
            font-size: 0.74rem;
            color: #6c8392;
            font-weight: 700;
        }
        .survey-insight-record-meta-card strong {
            font-size: 0.92rem;
            color: #163244;
            line-height: 1.4;
        }
        .survey-insight-answer-groups {
            display: grid;
            gap: 12px;
        }
        .survey-insight-answer-group {
            border: 1px solid rgba(104, 152, 173, 0.18);
            border-radius: 16px;
            background: #fcfeff;
            padding: 14px 16px;
            display: grid;
            gap: 10px;
        }
        .survey-insight-answer-group h4 {
            margin: 0;
            font-size: 0.92rem;
            color: #163244;
        }
        .survey-insight-answer-list {
            display: grid;
            gap: 10px;
        }
        .survey-insight-answer-item {
            display: grid;
            gap: 8px;
            padding-top: 10px;
            border-top: 1px dashed rgba(104, 152, 173, 0.22);
        }
        .survey-insight-answer-item:first-child {
            border-top: none;
            padding-top: 0;
        }
        .survey-insight-answer-item strong {
            display: inline-flex;
            align-items: center;
            justify-self: start;
            padding: 5px 10px;
            border-radius: 999px;
            background: rgba(104, 152, 173, 0.14);
            border: 1px solid rgba(104, 152, 173, 0.22);
            font-size: 0.78rem;
            color: #36576a;
            line-height: 1.45;
            font-weight: 800;
        }
        .survey-insight-answer-item strong::before {
            content: "Q";
            display: inline-flex;
            align-items: center;
            justify-content: center;
            width: 18px;
            height: 18px;
            margin-right: 8px;
            border-radius: 999px;
            background: #36576a;
            color: #fff;
            font-size: 0.68rem;
            font-weight: 800;
            line-height: 1;
            flex: 0 0 auto;
        }
        .survey-insight-answer-item span {
            display: block;
            padding: 10px 12px;
            border-radius: 12px;
            background: #f7fbfe;
            border: 1px solid rgba(19, 62, 88, 0.08);
            font-size: 0.92rem;
            color: #173346;
            line-height: 1.65;
            word-break: keep-all;
        }
        .survey-insight-answer-item span.is-empty {
            color: #7f95a3;
            background: #fbfdff;
            border-style: dashed;
        }
        @media (max-width: 1100px) {
            .survey-insight-record-meta {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            .survey-insight-record-detail-head {
                flex-direction: column;
            }
        }
        .survey-insight-pane[hidden] {
            display: none !important;
        }
        .hr-summary-table-wrap {
            max-height: 360px;
            overflow-y: auto;
        }
        #hr-store-summary-table {
            min-width: 860px;
        }
        .sort-btn {
            border: none;
            background: transparent;
            padding: 0;
            color: inherit;
            font: inherit;
            font-weight: inherit;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            gap: 6px;
        }
        .sort-btn::after {
            content: "↕";
            font-size: 0.68rem;
            color: #8aa0ad;
        }
        .sort-btn.active::after {
            content: "▲";
            color: var(--primary);
        }
        .sort-btn.active.desc::after {
            content: "▼";
        }
        .hr-summary-caption {
            margin-top: 10px;
            color: var(--muted);
            font-size: 0.72rem;
            line-height: 1.55;
        }
        .survey-insight-briefing-grid {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 14px;
            margin-top: 14px;
        }
        .survey-insight-briefing-grid.closing {
            grid-template-columns: 1.08fr 0.92fr;
        }
        .survey-insight-record-preview-card {
            padding-top: 16px;
        }
        .survey-insight-record-preview-list {
            display: grid;
            gap: 8px;
        }
        .survey-insight-preview-row {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: 12px;
            align-items: center;
            width: 100%;
            padding: 10px 12px;
            border: 1px solid rgba(162, 184, 201, 0.35);
            border-radius: 14px;
            background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(247,250,253,0.98) 100%);
            text-align: left;
            transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
        }
        .survey-insight-preview-row:hover,
        .survey-insight-preview-row:focus-visible {
            border-color: rgba(15, 91, 127, 0.28);
            box-shadow: 0 10px 22px rgba(15, 91, 127, 0.08);
            transform: translateY(-1px);
        }
        .survey-insight-preview-main,
        .survey-insight-preview-side {
            display: grid;
            gap: 2px;
            min-width: 0;
        }
        .survey-insight-preview-main strong,
        .survey-insight-preview-side span:first-child {
            font-size: 0.92rem;
            color: var(--text);
        }
        .survey-insight-preview-main span,
        .survey-insight-preview-side span:last-child {
            font-size: 0.76rem;
            color: var(--muted);
        }
        .survey-insight-preview-side {
            justify-items: end;
        }
        .survey-insight-briefing-card {
            border: 1px solid rgba(19, 62, 88, 0.08);
            border-radius: 20px;
            background: #fff;
            box-shadow: 0 10px 24px rgba(16, 58, 83, 0.05);
            padding: 18px 20px;
            display: grid;
            gap: 10px;
        }
        .survey-insight-briefing-card h3 {
            margin: 0;
            font-size: 1rem;
            line-height: 1.3;
            color: #163244;
        }
        .survey-insight-briefing-card p {
            margin: 0;
            color: #5e7484;
            font-size: 0.82rem;
            line-height: 1.55;
        }
        .survey-insight-briefing-card ul {
            margin: 0;
            padding-left: 18px;
            display: grid;
            gap: 7px;
        }
        .survey-insight-briefing-card li {
            color: #4c6778;
            font-size: 0.84rem;
            line-height: 1.58;
            font-weight: 600;
        }
        .survey-insight-briefing-card.strength { border-top: 4px solid #2f97b0; }
        .survey-insight-briefing-card.risk { border-top: 4px solid #d45b7a; }
        .survey-insight-briefing-card.action { border-top: 4px solid #c58a31; }
        .survey-insight-briefing-card.conclusion { border-top: 4px solid #0f5b7f; }
        .survey-insight-briefing-card.timeline { border-top: 4px solid #5b7dd4; }
        .survey-insight-timeline-list {
            display: grid;
            gap: 10px;
        }
        .survey-insight-timeline-item {
            display: grid;
            grid-template-columns: 56px 1fr;
            gap: 10px;
            align-items: start;
            padding-top: 10px;
            border-top: 1px dashed rgba(104, 152, 173, 0.25);
        }
        .survey-insight-timeline-item:first-child {
            border-top: none;
            padding-top: 0;
        }
        .survey-insight-timeline-tag {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 28px;
            border-radius: 999px;
            background: #f1f7fb;
            color: #163244;
            font-size: 0.8rem;
            font-weight: 800;
            letter-spacing: 0.02em;
        }
        .survey-insight-timeline-item p {
            font-size: 0.83rem;
        }
        .member-connection-chip-remove {
            margin-left: 8px;
            border: 0;
            background: transparent;
            color: #c85a74;
            font-size: 0.68rem;
            font-weight: 800;
            line-height: 1;
            cursor: pointer;
            opacity: 0.82;
        }
        .member-connection-chip-remove:hover,
        .member-connection-chip-remove:focus-visible {
            opacity: 1;
            color: #b63f61;
            text-decoration: underline;
        }
        @media (max-width: 1100px) {
            .survey-insight-briefing-grid,
            .survey-insight-briefing-grid.closing {
                grid-template-columns: 1fr;
            }
        }
        .hr-store-status-hot {
            color: #166534;
            background: #ecfdf3;
        }
        .hr-store-status-mid {
            color: #0f4c81;
            background: #e8f2ff;
        }
        .hr-store-status-low {
            color: #9a6700;
            background: #fff4d8;
        }
        .lab-wrap {
            display: grid;
            gap: 10px;
        }
        .lab-hero {
            padding: 18px 20px;
            display: grid;
            grid-template-columns: minmax(320px, 1.02fr) minmax(0, 1.38fr);
            gap: 14px;
            align-items: stretch;
        }
        .lab-hero-copy {
            display: grid;
            gap: 10px;
            align-content: start;
        }
        .lab-hero-copy h2 {
            margin: 0;
            font-size: 1.5rem;
        }
        .lab-hero-copy p {
            margin: 0;
            color: var(--muted);
            line-height: 1.65;
            font-size: 0.84rem;
        }
        .lab-kpi-grid {
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
            align-self: stretch;
        }
        .lab-kpi-card {
            padding: 16px 16px 14px;
            border-radius: 16px;
            border: 1px solid var(--line-soft);
            background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(246,250,252,0.96) 100%);
        }
        .lab-kpi-card strong {
            display: block;
            color: var(--muted);
            font-size: 0.78rem;
            font-weight: 800;
            margin-bottom: 10px;
        }
        .lab-kpi-card .value {
            font-family: "Plus Jakarta Sans", "Noto Sans KR", sans-serif;
            font-size: 1.92rem;
            font-weight: 800;
            line-height: 1;
            margin-bottom: 8px;
        }
        .lab-kpi-card .value.compact {
            font-size: 1.18rem;
            line-height: 1.25;
            word-break: keep-all;
        }
        .lab-kpi-card span {
            display: block;
            color: var(--muted);
            font-size: 0.74rem;
            line-height: 1.55;
        }
        .lab-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }
        .lab-grid-wide {
            display: grid;
            grid-template-columns: minmax(0, 1.12fr) minmax(0, 0.88fr);
            gap: 10px;
        }
        .lab-ops-panel {
            display: grid;
            gap: 12px;
        }
        .lab-ops-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 10px;
        }
        .lab-rank-card,
        .lab-division-card {
            border: 1px solid var(--line-soft);
            border-radius: 16px;
            background: linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(248,251,253,0.96) 100%);
            padding: 14px;
        }
        .lab-subsection-head {
            display: grid;
            gap: 3px;
            margin-bottom: 10px;
        }
        .lab-subsection-head strong {
            color: var(--text);
            font-size: 0.9rem;
            line-height: 1.35;
        }
        .lab-subsection-head span {
            color: var(--muted);
            font-size: 0.72rem;
            line-height: 1.45;
        }
        .lab-division-card {
            display: grid;
            gap: 10px;
        }
        .lab-division-chart-box {
            height: 330px;
            min-height: 330px;
            padding: 2px 4px 0;
            border: 1px solid var(--line-soft);
            border-radius: 14px;
            background: rgba(255,255,255,0.88);
        }
        .lab-division-chart-box canvas {
            width: 100% !important;
            height: 100% !important;
        }
        .lab-note-list {
            display: grid;
            gap: 10px;
        }
        .lab-note-card {
            padding: 14px 15px;
            border-radius: 14px;
            border: 1px solid var(--line-soft);
            background: rgba(248, 251, 253, 0.95);
        }
        .lab-note-card strong {
            display: block;
            margin-bottom: 6px;
            font-size: 0.84rem;
        }
        .lab-note-card span {
            display: block;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.6;
        }
        .lab-caption {
            margin-top: 12px;
            color: var(--muted);
            font-size: 0.76rem;
            line-height: 1.65;
        }
        .lab-month-filter {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
        }
        .lab-month-filter label {
            color: var(--muted);
            font-size: 0.76rem;
            font-weight: 700;
            white-space: nowrap;
        }
        .lab-month-filter select {
            min-width: 92px;
            border: 1px solid var(--line);
            border-radius: 12px;
            background: #fff;
            padding: 8px 10px;
            color: var(--text);
            font-size: 0.76rem;
            font-weight: 700;
        }
        .lab-summary-strip {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 10px;
            margin-top: 12px;
        }
        .table-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 5px 10px;
            border-radius: 999px;
            font-size: 0.72rem;
            font-weight: 800;
            background: #eef4f7;
            color: var(--muted);
            white-space: nowrap;
        }
        .table-badge.alert {
            background: var(--danger-soft);
            color: var(--danger);
        }
        .table-badge.warn {
            background: var(--warn-soft);
            color: var(--warn);
        }
        .table-badge.good {
            background: var(--success-soft);
            color: #1d7b45;
        }
        #hr-employee-list th:nth-child(5),
        #hr-employee-list td:nth-child(5),
        #hr-employee-list th:nth-child(6),
        #hr-employee-list td:nth-child(6),
        #hr-employee-list th:nth-child(7),
        #hr-employee-list td:nth-child(7),
        #hr-attention-table th:nth-child(3),
        #hr-attention-table td:nth-child(3) {
            text-align: center;
        }
        .admin-dashboard-header {
            align-items: flex-start;
            gap: 14px;
        }
        .admin-dashboard-stamp {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 38px;
            padding: 8px 14px;
            border-radius: 999px;
            border: 1px solid rgba(118, 164, 187, 0.28);
            background: rgba(244, 249, 252, 0.92);
            color: var(--muted);
            font-size: 0.74rem;
            font-weight: 800;
            white-space: nowrap;
        }
        .admin-dashboard-metric-groups,
        .admin-dashboard-kpis,
        .admin-dashboard-grid,
        .admin-dashboard-secondary-grid,
        .admin-dashboard-mini-grid {
            display: grid;
            gap: 10px;
        }
        .admin-dashboard-shell {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        .admin-dashboard-kpis {
            grid-template-columns: repeat(4, minmax(0, 1fr));
            margin-top: 4px;
        }
        .admin-dashboard-metric-groups {
            grid-template-columns: repeat(4, minmax(0, 1fr));
            align-items: stretch;
            margin-top: 4px;
        }
        .admin-dashboard-metric-group {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 8px;
            padding: 10px;
            border: 1px solid color-mix(in srgb, var(--dash-accent) 38%, #ffffff);
            border-radius: 18px;
            background:
                linear-gradient(180deg, rgba(255,255,255,0.98), color-mix(in srgb, var(--dash-bg) 74%, #ffffff)),
                radial-gradient(circle at top right, color-mix(in srgb, var(--dash-accent) 16%, transparent), transparent 46%);
            box-shadow: 0 10px 22px color-mix(in srgb, var(--dash-accent) 12%, transparent);
            --dash-accent: #2f789f;
            --dash-accent-strong: #165b7f;
            --dash-bg: rgba(234, 246, 252, 0.96);
            --dash-bg-strong: rgba(211, 233, 243, 0.98);
        }
        .admin-dashboard-metric-group.is-store {
            --dash-accent: #2574a8;
            --dash-accent-strong: #115983;
            --dash-bg: rgba(225, 242, 250, 0.98);
            --dash-bg-strong: rgba(201, 229, 243, 0.99);
        }
        .admin-dashboard-metric-group.is-application {
            --dash-accent: #c95f5a;
            --dash-accent-strong: #9f3e3a;
            --dash-bg: rgba(253, 235, 232, 0.98);
            --dash-bg-strong: rgba(248, 216, 211, 0.99);
        }
        .admin-dashboard-metric-group.is-slot {
            --dash-accent: #3d8d65;
            --dash-accent-strong: #286c4a;
            --dash-bg: rgba(229, 244, 235, 0.98);
            --dash-bg-strong: rgba(205, 231, 216, 0.99);
        }
        .admin-dashboard-metric-group.is-survey {
            --dash-accent: #c18a22;
            --dash-accent-strong: #93640f;
            --dash-bg: rgba(255, 243, 214, 0.98);
            --dash-bg-strong: rgba(248, 226, 178, 0.99);
        }
        .admin-dashboard-group-head {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 8px;
            color: var(--dash-accent-strong);
        }
        .admin-dashboard-group-head strong {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 0.76rem;
            font-weight: 900;
        }
        .admin-dashboard-group-head span {
            flex-shrink: 0;
            padding: 3px 8px;
            border: 1px solid color-mix(in srgb, var(--dash-accent) 32%, #ffffff);
            border-radius: 999px;
            background: rgba(255,255,255,0.72);
            color: var(--dash-accent-strong);
            font-size: 0.64rem;
            font-weight: 900;
        }
        .admin-dashboard-group-cards {
            display: grid;
            grid-auto-rows: minmax(82px, auto);
            gap: 8px;
        }
        .admin-dashboard-metric-group .admin-dashboard-kpi-card {
            min-height: 82px;
            padding: 10px 11px 9px 16px;
            box-shadow: none;
        }
        .admin-dashboard-metric-group .admin-dashboard-kpi-value {
            font-size: 1.52rem;
            margin: 2px 0;
        }
        .admin-dashboard-metric-group .admin-dashboard-kpi-label {
            font-size: 0.68rem;
        }
        .admin-dashboard-metric-group .admin-dashboard-kpi-criteria {
            font-size: 0.62rem;
        }
        .admin-dashboard-grid {
            grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
            margin-top: 12px;
        }
        .admin-dashboard-secondary-grid {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            margin-top: 12px;
        }
        .admin-dashboard-kpi-card,
        .admin-dashboard-mini-card {
            display: flex;
            flex-direction: column;
            gap: 3px;
            position: relative;
            overflow: hidden;
            padding: 11px 12px 10px 17px;
            border: 1px solid rgba(150, 180, 197, 0.92);
            border-radius: 16px;
            background: linear-gradient(180deg, rgba(255,255,255,0.98), var(--dash-bg));
            transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease, background 160ms ease;
            cursor: pointer;
            --dash-accent: #2f789f;
            --dash-accent-strong: #165b7f;
            --dash-bg: rgba(234, 246, 252, 0.96);
            --dash-bg-strong: rgba(211, 233, 243, 0.98);
        }
        .admin-dashboard-kpi-card::before,
        .admin-dashboard-mini-card::before {
            content: "";
            position: absolute;
            inset: 0 auto 0 0;
            width: 5px;
            background: var(--dash-accent);
            opacity: 0.96;
        }
        .admin-dashboard-kpi-card {
            min-height: 98px;
            align-items: stretch;
            justify-content: flex-start;
            text-align: left;
            background:
                linear-gradient(180deg, rgba(255,255,255,0.99), var(--dash-bg)),
                radial-gradient(circle at top right, color-mix(in srgb, var(--dash-accent) 22%, transparent), transparent 48%);
        }
        .admin-dashboard-kpi-card:hover,
        .admin-dashboard-mini-card:hover {
            transform: translateY(-2px);
            border-color: color-mix(in srgb, var(--dash-accent) 58%, #ffffff);
            box-shadow: 0 13px 24px color-mix(in srgb, var(--dash-accent) 20%, transparent);
            background: linear-gradient(180deg, rgba(255,255,255,1), var(--dash-bg-strong));
        }
        .admin-dashboard-kpi-card:active,
        .admin-dashboard-mini-card:active {
            transform: translateY(0);
            box-shadow: 0 6px 16px rgba(39, 78, 102, 0.1);
        }
        .admin-dashboard-kpi-card.is-active,
        .admin-dashboard-mini-card.is-active {
            border-color: var(--dash-accent);
            background: linear-gradient(180deg, rgba(255,255,255,1), var(--dash-bg-strong));
            box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dash-accent) 20%, transparent), 0 12px 24px color-mix(in srgb, var(--dash-accent) 17%, transparent);
        }
        .admin-dashboard-kpi-card.is-store,
        .admin-dashboard-mini-card.is-store {
            --dash-accent: #2574a8;
            --dash-accent-strong: #115983;
            --dash-bg: rgba(225, 242, 250, 0.98);
            --dash-bg-strong: rgba(201, 229, 243, 0.99);
        }
        .admin-dashboard-kpi-card.is-application,
        .admin-dashboard-mini-card.is-application {
            --dash-accent: #c95f5a;
            --dash-accent-strong: #9f3e3a;
            --dash-bg: rgba(253, 235, 232, 0.98);
            --dash-bg-strong: rgba(248, 216, 211, 0.99);
        }
        .admin-dashboard-kpi-card.is-slot,
        .admin-dashboard-mini-card.is-slot {
            --dash-accent: #3d8d65;
            --dash-accent-strong: #286c4a;
            --dash-bg: rgba(229, 244, 235, 0.98);
            --dash-bg-strong: rgba(205, 231, 216, 0.99);
        }
        .admin-dashboard-kpi-card.is-survey,
        .admin-dashboard-mini-card.is-survey {
            --dash-accent: #c18a22;
            --dash-accent-strong: #93640f;
            --dash-bg: rgba(255, 243, 214, 0.98);
            --dash-bg-strong: rgba(248, 226, 178, 0.99);
        }
        .admin-dashboard-kpi-label,
        .admin-dashboard-mini-card span {
            color: var(--dash-accent-strong);
            font-size: 0.7rem;
            font-weight: 900;
            text-align: left;
        }
        .admin-dashboard-kpi-value,
        .admin-dashboard-mini-card strong {
            color: var(--dash-accent-strong);
            font-size: 1.72rem;
            line-height: 1;
            font-weight: 900;
            width: 100%;
            text-align: center;
            margin: 4px 0 3px;
        }
        .admin-dashboard-kpi-meta {
            color: var(--muted);
            font-size: 0.67rem;
            line-height: 1.32;
            text-align: left;
        }
        .admin-dashboard-kpi-criteria {
            margin-top: auto;
            color: var(--muted-strong);
            font-size: 0.64rem;
            line-height: 1.28;
            text-align: left;
        }
        .admin-dashboard-mini-grid {
            grid-template-columns: repeat(6, minmax(0, 1fr));
            margin-bottom: 0;
        }
        .admin-dashboard-mini-card {
            min-height: 82px;
            align-items: stretch;
            justify-content: flex-start;
            text-align: left;
            background:
                linear-gradient(180deg, rgba(255,255,255,0.98), var(--dash-bg)),
                radial-gradient(circle at top right, color-mix(in srgb, var(--dash-accent) 20%, transparent), transparent 50%);
        }
        .admin-dashboard-header.is-compact {
            align-items: end;
            margin-bottom: 2px;
        }
        .admin-dashboard-header.is-compact .section-title {
            margin-bottom: 2px;
        }
        .admin-dashboard-header-side {
            display: flex;
            align-items: center;
            gap: 10px;
            flex-wrap: wrap;
            justify-content: flex-end;
        }
        .admin-dashboard-header.is-compact .section-desc {
            margin: 0;
            font-size: 0.72rem;
            line-height: 1.35;
            white-space: nowrap;
        }
        .admin-dashboard-subheader {
            margin-top: 4px;
            margin-bottom: 8px;
        }
        .admin-dashboard-jump {
            flex-shrink: 0;
        }
        .admin-dashboard-list {
            display: flex;
            flex-direction: column;
            gap: 6px;
        }
        .admin-dashboard-detail-panel .admin-dashboard-list {
            max-height: 520px;
            overflow-y: auto;
            padding-right: 4px;
        }
        .admin-dashboard-detail-panel .admin-dashboard-list::-webkit-scrollbar {
            width: 10px;
        }
        .admin-dashboard-detail-panel .admin-dashboard-list::-webkit-scrollbar-thumb {
            border-radius: 999px;
            background: rgba(136, 168, 185, 0.52);
            border: 2px solid rgba(248, 251, 253, 0.95);
        }
        .admin-dashboard-detail-panel .admin-dashboard-list::-webkit-scrollbar-track {
            background: transparent;
        }
        .admin-dashboard-item {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 8px;
            padding: 8px 10px;
            border: 1px solid rgba(194, 214, 226, 0.9);
            border-radius: 12px;
            background: rgba(249, 252, 254, 0.97);
        }
        .admin-dashboard-item:has(.admin-dashboard-chip.is-danger) {
            border-color: rgba(216, 127, 110, 0.46);
            background:
                linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,241,238,0.97)),
                radial-gradient(circle at top right, rgba(209, 106, 82, 0.11), transparent 42%);
        }
        .admin-dashboard-item:has(.admin-dashboard-chip.is-warn) {
            border-color: rgba(208, 173, 94, 0.46);
            background:
                linear-gradient(180deg, rgba(255,255,255,0.98), rgba(255,248,236,0.97)),
                radial-gradient(circle at top right, rgba(206, 165, 74, 0.11), transparent 42%);
        }
        .admin-dashboard-item-copy {
            min-width: 0;
            display: flex;
            flex-direction: column;
            gap: 3px;
        }
        .admin-dashboard-item-heading {
            display: flex;
            align-items: center;
            gap: 8px;
            flex-wrap: wrap;
            color: var(--text);
        }
        .admin-dashboard-item-heading strong {
            font-size: 0.82rem;
            line-height: 1.28;
        }
        .admin-dashboard-item-meta {
            color: var(--muted);
            font-size: 0.69rem;
            font-weight: 700;
            line-height: 1.28;
        }
        .admin-dashboard-item p {
            margin: 0;
            color: var(--muted-strong);
            font-size: 0.68rem;
            line-height: 1.3;
        }
        .admin-dashboard-action {
            flex-shrink: 0;
            min-width: 80px;
            min-height: 34px;
            padding-inline: 10px;
            font-size: 0.74rem;
        }
        .admin-dashboard-actions {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            gap: 6px;
            flex-wrap: wrap;
            flex-shrink: 0;
        }
        .admin-dashboard-actions .admin-dashboard-action {
            min-width: 72px;
        }
        .admin-dashboard-detail-panel.is-dense {
            padding: 12px;
        }
        .admin-dashboard-detail-header {
            margin-bottom: 8px;
            align-items: center;
        }
        .admin-dashboard-detail-criteria {
            margin: 4px 0 0;
            color: var(--muted-strong);
            font-size: 0.7rem;
            line-height: 1.4;
        }
        .admin-dashboard-detail-count {
            flex-shrink: 0;
            padding: 6px 10px;
            border-radius: 999px;
            border: 1px solid rgba(182, 205, 218, 0.72);
            background: rgba(247, 251, 253, 0.95);
            color: var(--muted-strong);
            font-size: 0.72rem;
            font-weight: 800;
        }
        .admin-dashboard-chip {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            padding: 3px 8px;
            border-radius: 999px;
            font-size: 0.64rem;
            font-weight: 800;
            border: 1px solid transparent;
            white-space: nowrap;
        }
        .admin-dashboard-chip.is-danger {
            color: #b42318;
            background: #fde8e6;
            border-color: rgba(244, 63, 94, 0.28);
        }
        .admin-dashboard-chip.is-warn {
            color: #9a6700;
            background: #ffefbf;
            border-color: rgba(219, 151, 0, 0.28);
        }
        .admin-dashboard-chip.is-info {
            color: #0f4c81;
            background: #dfeefd;
            border-color: rgba(48, 110, 164, 0.26);
        }
        .admin-dashboard-chip.is-neutral {
            color: var(--muted);
            background: #eef4f7;
            border-color: rgba(161, 185, 198, 0.22);
        }
        .admin-dashboard-empty {
            padding: 18px 14px;
            border: 1px dashed rgba(188, 208, 220, 0.82);
            border-radius: 16px;
            color: var(--muted);
            font-size: 0.78rem;
            text-align: center;
            background: rgba(249, 251, 253, 0.9);
        }
        @media (max-width: 1180px) {
            .admin-dashboard-metric-groups,
            .admin-dashboard-kpis,
            .admin-dashboard-grid,
            .admin-dashboard-secondary-grid,
            .admin-dashboard-mini-grid {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }
        @media (max-width: 760px) {
            .admin-dashboard-header-side {
                justify-content: flex-start;
            }
            .admin-dashboard-header.is-compact .section-desc {
                white-space: normal;
            }
            .admin-dashboard-detail-panel .admin-dashboard-list {
                max-height: 360px;
            }
            .admin-dashboard-metric-groups,
            .admin-dashboard-kpis,
            .admin-dashboard-mini-grid {
                grid-template-columns: 1fr;
            }
            .admin-dashboard-item {
                flex-direction: column;
            }
            .admin-dashboard-action,
            .admin-dashboard-jump,
            .admin-dashboard-detail-count {
                width: 100%;
            }
        }
        @media (max-width: 1420px) {
            .topbar {
                grid-template-columns: minmax(240px, auto) minmax(0, 1fr);
                gap: 8px 10px;
                padding: 11px 13px;
            }
            .brand-wrap { min-width: 240px; gap: 10px; }
            .brand-mark { min-width: 48px; width: 48px; height: 48px; }
            .eyebrow { font-size: 0.68rem; letter-spacing: 0.14em; }
            .brand-title { font-size: 1.12rem; }
            .topbar-main { gap: 6px; }
            .nav-pills { justify-content: flex-end; gap: 5px; }
            .nav-pills button { padding: 10px 11px; font-size: 0.82rem; }
            .lang-select { padding: 7px 9px; font-size: 0.7rem; }
            .notification-chip { width: 35px; height: 35px; }
            .user-chip { gap: 6px; }
            .user-avatar { width: 34px; height: 34px; font-size: 0.84rem; }
            .user-chip-text strong { font-size: 0.78rem; }
            .user-chip-text span { font-size: 0.72rem; }
        }

        @media (max-width: 1180px) {
            .shell { grid-template-columns: 1fr; grid-template-rows: auto auto auto 1fr; }
            .hero, .kpi-grid, #view-cal, #view-apply, #view-survey, #view-slot, #view-admin, #view-hr, #view-lab { grid-column: auto; }
            .hero, .kpi-grid { margin-bottom: 0; }
            .hero, .content-grid, .apply-wrap, .survey-wrap, .slot-wrap, .admin-grid, .kpi-grid, .side-stack, .admin-record-grid, .hr-grid, .hr-grid-triple, .hr-rank-grid, .hr-kpi-grid, .hr-hero, .lab-grid, .lab-grid-wide, .lab-ops-grid, .lab-kpi-grid, .lab-hero, .lab-summary-strip, .survey-status-grid { grid-template-columns: 1fr; }
            .hero-side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
            .month-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
            .toast-stack { top: 14px; right: 14px; left: 14px; }
            .toast { max-width: none; min-width: 0; }
            .confirm-overlay { padding: 16px; }
            .confirm-dialog,
            .progress-dialog { width: 100%; padding: 18px; }
            .confirm-actions { grid-template-columns: 1fr; display: grid; }
            .progress-meta { gap: 8px; }
            .topbar {
                grid-template-columns: 1fr;
                align-items: flex-start;
            }
            .topbar-main {
                width: 100%;
                justify-content: space-between;
                flex-wrap: wrap;
            }
            .sync-tools {
                justify-content: flex-start;
            }
        }
@keyframes progressIndeterminate {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(300%); }
}
        @media (max-width: 760px) {
            html, body { max-width: 100%; overflow-x: hidden; }
            body { height: auto; overflow-y: auto; }
            .shell { height: auto; grid-template-columns: 1fr; grid-template-rows: auto; }
            #view-cal, #view-apply, #view-survey, #view-slot, #view-admin, #view-hr, #view-lab, #view-cal .content-grid, #view-apply .apply-wrap, #view-survey .survey-wrap, #view-slot .slot-wrap, #view-admin .admin-tools, #view-hr .hr-wrap, #view-lab .lab-wrap { height: auto; }
            #view-cal,
            #view-survey,
            #view-admin,
            #view-hr,
            #view-lab,
            #view-cal .content-grid,
            #view-survey .survey-wrap,
            #view-admin .admin-tools,
            #view-admin .admin-grid,
            #view-admin .admin-record-grid,
            #view-hr .hr-wrap,
            #view-hr .hr-hero,
            #view-survey-insight .hr-wrap,
            #view-survey-insight .hr-hero,
            #view-hr .hr-kpi-grid,
            #view-survey-insight .hr-kpi-grid,
            #view-hr .hr-grid,
            #view-survey-insight .hr-grid,
            #view-hr .hr-grid-triple,
            #view-hr .hr-rank-grid,
            #view-lab .lab-wrap,
            #view-lab .lab-hero,
            #view-lab .lab-kpi-grid,
            #view-lab .lab-ops-grid,
            #view-lab .lab-grid,
            #view-lab .lab-grid-wide,
            #view-cal .hero-side,
            #view-survey .survey-status-grid,
            #view-cal .kpi-grid,
            #view-admin .metric-strip,
            #view-admin .record-metrics,
            #view-cal .content-grid > *,
            #view-survey .survey-wrap > *,
            #view-admin .admin-tools > *,
            #view-admin .admin-grid > *,
            #view-admin .admin-record-grid > *,
            #view-hr .hr-wrap > *,
            #view-hr .hr-hero > *,
            #view-hr .hr-grid > *,
            #view-hr .hr-grid-triple > *,
            #view-hr .hr-rank-grid > *,
            #view-lab .lab-wrap > *,
            #view-lab .lab-hero > *,
            #view-lab .lab-ops-grid > *,
            #view-lab .lab-grid > *,
            #view-lab .lab-grid-wide > *,
            .section-card,
            .card,
            .panel,
            .table-wrap,
            .calendar-shell,
            .detail-panel,
            .hr-employee-wrap,
            .hr-summary-table-wrap {
                width: 100%;
                max-width: 100%;
                min-width: 0;
            }
            .shell { padding: 12px; }
            .topbar {
                position: static;
                padding: 14px;
                border-radius: 18px;
                grid-template-columns: 1fr;
                align-items: flex-start;
                overflow: hidden;
            }
            .brand-wrap { width: 100%; min-width: 0; align-items: flex-start; gap: 12px; }
            .brand-home { width: 100%; min-width: 0; }
            .brand-text { min-width: 0; flex: 1 1 auto; }
            .brand-mark { min-width: 52px; width: 52px; height: 52px; }
            .brand-title { font-size: 1.08rem; line-height: 1.25; white-space: normal; }
            .topbar-main {
                width: 100%;
                flex-direction: column;
                align-items: stretch;
                gap: 10px;
            }
            .notification-menu,
            .user-menu {
                width: 100%;
            }
            .notification-chip {
                align-self: flex-start;
            }
            .user-chip {
                width: 100%;
                justify-content: flex-start;
            }
            .notification-dropdown,
            .user-dropdown {
                position: static;
                top: auto;
                right: auto;
                width: 100%;
                min-width: 0;
                margin-top: 8px;
                border-radius: 14px;
                box-shadow: 0 14px 24px rgba(0, 51, 73, 0.12);
            }
            .sync-tools {
                width: 100%;
                padding-top: 0;
                border-top: none;
                display: grid;
                grid-template-columns: 1fr 1fr;
                gap: 8px;
            }
            .sync-badge {
                grid-column: 1 / -1;
                justify-content: center;
                width: 100%;
            }
            .sync-btn {
                width: 100%;
                border-radius: 12px;
                white-space: normal;
                line-height: 1.35;
            }
            .topbar-main > .language-menu {
                align-self: flex-end;
            }
            .lang-select {
                width: 100%;
                border-radius: 12px;
            }
            .nav-pills { width: 100%; display: grid; grid-template-columns: 1fr; gap: 8px; }
            .nav-pills button { width: 100%; padding: 12px 14px; text-align: center; }
            .hero-side, .section-card, .card, .form-card, .apply-hero { padding: 16px; }
            #view-cal .section-card,
            #view-admin .card,
            #view-admin .section-card,
            #view-survey .card,
            #view-survey .section-card,
            #view-hr .card,
            #view-hr .section-card,
            #view-lab .card,
            #view-lab .section-card { padding: 12px; }
            #view-cal .section-title,
            #view-admin .section-title,
            #view-survey .section-title,
            #view-hr .section-title,
            #view-lab .section-title { font-size: 0.9rem; }
            #view-cal .section-desc,
            #view-admin .section-desc,
            #view-survey .section-desc,
            #view-hr .section-desc,
            #view-lab .section-desc { font-size: 0.7rem; line-height: 1.45; }
            .hero-side, .metric-strip, .kpi-grid, .admin-login-grid, .record-metrics, .hr-kpi-grid, .hr-grid, .hr-grid-triple, .hr-rank-grid, .hr-hero, .survey-status-grid { grid-template-columns: 1fr; }
            .action-card::before { display: none; }
            .kpi-card { padding: 16px; }
            #view-cal .mini-stat,
            #view-cal .kpi-card { min-height: 78px; padding: 12px 10px; }
            #view-cal .mini-stat .label,
            #view-cal .kpi-title { font-size: 0.72rem; }
            #view-cal .mini-stat .value,
            #view-cal .kpi-value { font-size: 1.5rem; }
            #view-admin .metric-chip,
            #view-lab .metric-chip { padding: 8px 9px; font-size: 0.68rem; }
            #view-admin .metric-chip strong,
            #view-lab .metric-chip strong { font-size: 0.9rem; }
            #view-admin .record-metrics { gap: 8px; }
            #view-admin .table-caption,
            #view-hr .table-caption,
            #view-lab .table-caption { font-size: 0.68rem; }
            #view-hr .hr-hero,
            #view-survey-insight .hr-hero,
            #view-lab .lab-hero { padding: 14px; gap: 10px; }
            #view-hr .hr-hero-copy h2,
            #view-survey-insight .hr-hero-copy h2,
            #view-lab .lab-hero-copy h2 { font-size: 1.18rem; }
            #view-hr .hr-hero-copy p,
            #view-survey-insight .hr-hero-copy p,
            #view-lab .lab-hero-copy p { font-size: 0.76rem; line-height: 1.55; }
            .survey-report-actions { justify-items: stretch; }
            .survey-report-actions .helper-text { max-width: none; text-align: left; }
            #view-hr .hr-kpi-card,
            #view-lab .lab-kpi-card { padding: 12px 12px 11px; border-radius: 14px; }
            #view-hr .hr-kpi-card strong,
            #view-lab .lab-kpi-card strong { font-size: 0.72rem; margin-bottom: 8px; }
            #view-hr .hr-kpi-card .value,
            #view-lab .lab-kpi-card .value { font-size: 1.56rem; margin-bottom: 6px; }
            #view-hr .hr-kpi-card span,
            #view-lab .lab-kpi-card span { font-size: 0.68rem; line-height: 1.45; }
            #view-hr .hr-rank-item,
            #view-lab .lab-note-card { padding: 11px 12px; }
            #view-hr .hr-rank-main strong,
            #view-lab .lab-note-card strong { font-size: 0.8rem; }
            #view-hr .hr-rank-main span,
            #view-lab .lab-note-card span { font-size: 0.7rem; line-height: 1.45; }
            .kpi-value { font-size: 1.66rem; }
            .section-header { flex-direction: column; align-items: flex-start; }
            .section-header-actions { width: 100%; justify-content: flex-start; }
            #admin-slot-form-panel .section-header-actions {
                flex-wrap: wrap;
                overflow: visible;
                padding-bottom: 0;
                gap: 8px;
            }
            #admin-slot-form-panel .section-header-actions > .btn-main,
            #admin-slot-form-panel .section-header-actions > .btn-ghost {
                flex: 1 1 100%;
                width: 100%;
                min-width: 0;
            }
            #admin-slot-form-panel .slot-form-actions {
                justify-content: stretch;
            }
            #admin-slot-form-panel .slot-form-actions > .btn-main,
            #admin-slot-form-panel .slot-form-actions > .btn-ghost {
                flex: 1 1 100%;
                width: 100%;
                min-width: 0;
            }
            .setting-item { flex-direction: column; align-items: flex-start; }
            .setting-toggle { width: 100%; justify-content: space-between; }
            .section-toolbar { flex-direction: column; align-items: stretch; }
            .toolbar-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
            .tag { width: 100%; justify-content: center; }
            #admin-history-panel .history-toolbar {
                display: grid !important;
                grid-template-columns: 1fr;
                align-items: stretch;
                gap: 10px;
            }
            #admin-history-panel #history-summary {
                display: block;
                width: 100%;
                margin: 0 !important;
                white-space: normal !important;
                word-break: keep-all;
                overflow-wrap: anywhere;
                flex: none !important;
            }
            #admin-history-panel .history-toolbar .admin-action-group {
                width: 100%;
                display: block;
            }
            .history-filter { width: 100%; min-width: 0; }
            .month-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
            .month-btn { padding: 10px 8px; border-radius: 12px; }
            .month-btn strong { font-size: 0.92rem; }
            .month-btn small { font-size: 0.56rem; }
        .calendar-shell { overflow-x: hidden; }
        .calendar-header { padding: 8px 8px; }
        .calendar-grid { min-width: 0; width: 100%; grid-template-columns: repeat(7, minmax(0, 1fr)); }
        .calendar-grid,
        .day-cell,
        .day-events,
        .slot-pill,
        .slot-pill .store-name {
            min-width: 0;
            max-width: 100%;
        }
        .day-label { padding: 8px 4px; font-size: 0.68rem; }
        .day-cell { min-height: 74px; padding: 4px 3px; }
        .day-top { margin-bottom: 3px; }
        .day-num { min-width: 20px; height: 20px; padding: 0 5px; font-size: 0.66rem; }
        .day-count { font-size: 0.56rem; }
        .day-events { gap: 2px; }
        .day-inline-empty { gap: 4px; margin-top: 6px; padding: 6px 4px; border-radius: 8px; }
        .day-inline-note { font-size: 0.54rem; }
        .day-inline-btn { padding: 4px 8px; font-size: 0.54rem; }
        .slot-pill { width: 100%; padding: 3px 4px; font-size: 0.55rem; min-height: 16px; border-radius: 6px; gap: 4px; }
        .slot-pill .slot-seats { font-size: 0.52rem; }
        .slot-pill .store-name { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
        .more-link { font-size: 0.58rem; padding: 3px 4px; }
        .detail-head { padding: 16px 16px 12px; }
        .detail-body { padding: 12px; }
            .detail-item { padding: 12px; border-radius: 14px; }
            .detail-item-top { align-items: flex-start; flex-direction: column; }
            .detail-item-meta-row { align-items: flex-start; flex-direction: column; }
            .chart-box { height: 220px; }
            #view-admin .chart-box,
            #view-hr .chart-box,
            #view-lab .chart-box { height: 190px !important; }
            .apply-wrap > .panel:last-child { grid-column: auto; }
            .field label { font-size: 0.84rem; }
            .field input, .field select { padding: 12px 13px; border-radius: 12px; }
            .btn-main, .btn-danger, .btn-excel { width: 100%; padding: 12px 14px; }
            .table-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
            .survey-choice-row { grid-template-columns: 1fr; }
            .survey-choice { width: 100%; justify-content: flex-start; }
            #my-slot-list {
                min-width: 0;
                width: 100%;
                table-layout: fixed;
            }
            #my-slot-list colgroup { display: none; }
            #my-slot-list th,
            #my-slot-list td {
                padding: 8px 6px;
                font-size: 0.72rem;
                white-space: normal;
                word-break: break-word;
            }
            #my-slot-list th:nth-child(1),
            #my-slot-list td:nth-child(1) { width: 78px; }
            #my-slot-list th:nth-child(3),
            #my-slot-list td:nth-child(3) { width: 52px; }
            #my-slot-list th:nth-child(5),
            #my-slot-list td:nth-child(5) { width: 84px; }
            #my-slot-list th:nth-child(4),
            #my-slot-list td:nth-child(4) { display: none; }
            #admin-app-list {
                min-width: 0;
                width: 100%;
                table-layout: fixed;
            }
            #admin-app-list th,
            #admin-app-list td {
                padding: 8px 6px;
                font-size: 0.72rem;
                white-space: normal;
                word-break: break-word;
            }
            #admin-app-list th:nth-child(3),
            #admin-app-list td:nth-child(3) { width: 112px; }
            #admin-app-list th:nth-child(4),
            #admin-app-list td:nth-child(4) { width: 68px; }
            #admin-app-list th:nth-child(6),
            #admin-app-list td:nth-child(6) { width: 72px; }
            #admin-app-list th:nth-child(9),
            #admin-app-list td:nth-child(9) { width: 82px; }
            #admin-app-list th:nth-child(1),
            #admin-app-list td:nth-child(1),
            #admin-app-list th:nth-child(2),
            #admin-app-list td:nth-child(2),
            #admin-app-list th:nth-child(5),
            #admin-app-list td:nth-child(5),
            #admin-app-list th:nth-child(7),
            #admin-app-list td:nth-child(7),
            #admin-app-list th:nth-child(8),
            #admin-app-list td:nth-child(8) { display: none; }
            #admin-app-list .table-actions {
                grid-template-columns: 1fr;
            }
            #admin-app-list .table-actions button {
                width: 100%;
            }
        .member-master-detail { grid-template-columns: 1fr; }
        .member-master-list { position: static; }
        .member-list-scroller { max-height: 280px; }
        .member-detail-grid { grid-template-columns: 1fr; }
        .member-detail-hero { grid-template-columns: 1fr; }
        .member-detail-badges { justify-content: flex-start; }
        .store-master-filterbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .store-master-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
        .store-master-detail-stats { grid-template-columns: 1fr; }
        .store-master-detail-grid { grid-template-columns: 1fr; }
        .store-master-mini-facts { grid-template-columns: 1fr; }
.store-master-list-table thead th:nth-child(3),
.store-master-list-table thead th:nth-child(4),
.store-master-list-table tbody td:nth-child(3),
.store-master-list-table tbody td:nth-child(4) { display: none; }
            #hr-employee-list { min-width: 0; }
        #hr-attention-table {
            min-width: 0;
            width: 100%;
            table-layout: fixed;
        }
            #hr-attention-table th,
            #hr-attention-table td {
                padding: 9px 6px;
                font-size: 0.74rem;
                white-space: normal;
                word-break: break-word;
            }
            #hr-attention-table th:nth-child(1),
            #hr-attention-table td:nth-child(1) { width: 64px; }
            #hr-attention-table th:nth-child(2),
            #hr-attention-table td:nth-child(2) { width: 74px; }
            #hr-attention-table th:nth-child(3),
            #hr-attention-table td:nth-child(3) { width: 72px; }
        #hr-attention-table .table-badge {
            white-space: normal;
            padding: 4px 6px;
            font-size: 0.66rem;
            line-height: 1.2;
        }
        #hr-employee-list,
        #hr-store-summary-table {
            min-width: 0;
            width: 100%;
            table-layout: fixed;
        }
        #hr-employee-list th,
        #hr-employee-list td,
        #hr-store-summary-table th,
        #hr-store-summary-table td {
            padding: 9px 6px;
            font-size: 0.72rem;
            white-space: normal;
            word-break: break-word;
        }
        #hr-employee-list th:nth-child(1),
        #hr-employee-list td:nth-child(1) { width: 38px; }
        #hr-employee-list th:nth-child(2),
        #hr-employee-list td:nth-child(2) { width: 62px; }
        #hr-employee-list th:nth-child(3),
        #hr-employee-list td:nth-child(3) { width: 78px; }
        #hr-employee-list th:nth-child(4),
        #hr-employee-list td:nth-child(4) { width: 70px; }
        #hr-employee-list th:nth-child(5),
        #hr-employee-list td:nth-child(5) { width: 74px; }
        #hr-employee-list th:nth-child(6),
        #hr-employee-list td:nth-child(6) { width: 54px; }
        #hr-employee-list th:nth-child(7),
        #hr-employee-list td:nth-child(7) { width: 58px; }
        #hr-employee-list th:nth-child(8),
        #hr-employee-list td:nth-child(8) { width: 74px; }
        #hr-employee-list th:nth-child(4),
        #hr-employee-list td:nth-child(4),
        #hr-employee-list th:nth-child(5),
        #hr-employee-list td:nth-child(5),
        #hr-employee-list th:nth-child(8),
        #hr-employee-list td:nth-child(8) { display: none; }
        #hr-store-summary-table th,
        #hr-store-summary-table td {
            text-align: center;
        }
        #hr-store-summary-table th:nth-child(1),
        #hr-store-summary-table td:nth-child(1) {
            text-align: left;
            width: 88px;
        }
        #hr-store-summary-table th:nth-child(2),
        #hr-store-summary-table td:nth-child(2),
        #hr-store-summary-table th:nth-child(4),
        #hr-store-summary-table td:nth-child(4),
        #hr-store-summary-table th:nth-child(5),
        #hr-store-summary-table td:nth-child(5) { width: 58px; }
        #hr-store-summary-table th:nth-child(7),
        #hr-store-summary-table td:nth-child(7) { width: 64px; }
            #hr-store-summary-table th:nth-child(3),
            #hr-store-summary-table td:nth-child(3),
            #hr-store-summary-table th:nth-child(6),
            #hr-store-summary-table td:nth-child(6) { display: none; }
            .survey-report-actions {
                width: 100%;
            }
            .survey-report-actions .btn-main {
                width: 100%;
                min-width: 0;
                white-space: normal;
            }
            #view-survey-insight .hr-hero,
            #view-survey-insight .hr-wrap,
            #view-survey-insight .hr-hero-copy,
            #survey-insight-hero-title,
            #survey-insight-hero-desc {
                min-width: 0;
                max-width: 100%;
            }
            #survey-insight-hero-title,
            #survey-insight-hero-desc {
                word-break: keep-all;
                overflow-wrap: anywhere;
            }
            #view-admin .member-master-detail,
            #view-admin .member-master-detail.store-master-management {
                grid-template-columns: 1fr !important;
                gap: 12px;
                min-width: 0;
            }
            #view-admin .member-master-list,
            #view-admin .member-detail-panel,
            #view-admin .store-master-filterbar,
            #view-admin .store-master-summary-grid,
            #view-admin .store-master-list-shell,
            #view-admin .member-list-scroller {
                width: 100%;
                min-width: 0;
                max-width: 100%;
            }
            #view-admin .store-master-filterbar {
                grid-template-columns: 1fr !important;
                padding: 12px;
                gap: 10px;
            }
            #view-admin .member-list-header,
            #view-admin .member-list-table-row {
                grid-template-columns: 38px minmax(0, 1fr) 104px !important;
                padding-right: 0;
            }
            #view-admin .member-list-header .member-list-head-cell:nth-child(3),
            #view-admin .member-list-header .member-list-head-cell:nth-child(4),
            #view-admin .member-list-table-row .member-list-cell:nth-child(3),
            #view-admin .member-list-table-row .member-list-cell:nth-child(4) {
                display: none;
            }
            #view-admin #admin-app-wrap {
                overflow-x: auto;
                -webkit-overflow-scrolling: touch;
            }
            #view-admin #admin-app-list {
                min-width: 0;
                width: 100%;
            }
            #view-admin #admin-app-list th:nth-child(3),
            #view-admin #admin-app-list td:nth-child(3),
            #view-admin #admin-app-list th:nth-child(4),
            #view-admin #admin-app-list td:nth-child(4),
            #view-admin #admin-app-list th:nth-child(6),
            #view-admin #admin-app-list td:nth-child(6),
            #view-admin #admin-app-list th:nth-child(9),
            #view-admin #admin-app-list td:nth-child(9) {
                width: auto;
            }
            #view-cal .content-grid,
            #view-admin .admin-record-grid,
            #view-hr .hr-grid,
            #view-hr .hr-grid-triple,
            #view-hr .hr-rank-grid,
            #view-lab .lab-grid,
            #view-lab .lab-grid-wide,
            #view-lab .lab-ops-grid { gap: 8px; }
            th, td { padding: 12px 10px; font-size: 0.82rem; }
        }

        @media (max-width: 480px) {
            html, body { max-width: 100%; overflow-x: hidden; }
            body { overflow-y: auto; }
            .shell { padding: 10px; }
            .sync-tools { grid-template-columns: 1fr; }
            .hero-side, .section-card, .card, .form-card, .apply-hero { padding: 14px; }
            #view-cal .section-card,
            #view-admin .card,
            #view-admin .section-card,
            #view-survey .card,
            #view-survey .section-card,
            #view-hr .card,
            #view-hr .section-card,
            #view-lab .card,
            #view-lab .section-card { padding: 10px; }
            #view-cal .section-title,
            #view-admin .section-title,
            #view-survey .section-title,
            #view-hr .section-title,
            #view-lab .section-title { font-size: 0.84rem; }
            #view-cal .section-desc,
            #view-admin .section-desc,
            #view-survey .section-desc,
            #view-hr .section-desc,
            #view-lab .section-desc { font-size: 0.66rem; }
            .survey-note,
            .survey-meta-card,
            .survey-question textarea { font-size: 0.7rem; }
            .survey-meta-rows { grid-template-columns: 1fr; }
            .survey-status-card { padding: 10px; }
            .survey-status-card.is-alert { padding-right: 92px; }
            .survey-status-alert-badge { top: 10px; right: 10px; font-size: 0.62rem; }
            .survey-status-card strong { font-size: 1.08rem; }
            .survey-status-card.is-alert strong { font-size: 1.32rem; }
            .survey-field-stack { gap: 14px; }
            .survey-group { padding: 11px; border-radius: 15px; gap: 10px; }
            .survey-group-head strong { padding: 8px 10px; font-size: 0.7rem; white-space: normal; }
            .survey-question-list { gap: 8px; }
            .survey-question { padding: 10px; border-radius: 13px; }
            .survey-choice-row { gap: 7px; }
            .survey-choice { max-width: 100%; white-space: normal; line-height: 1.35; }
            .mini-stat .value { font-size: 1.45rem; }
            #view-cal .mini-stat,
            #view-cal .kpi-card { min-height: 72px; padding: 10px 8px; }
            #view-cal .mini-stat .label,
            #view-cal .kpi-title { font-size: 0.68rem; }
            #view-cal .mini-stat .value,
            #view-cal .kpi-value { font-size: 1.32rem; }
            #view-admin .metric-chip,
            #view-lab .metric-chip { padding: 7px 8px; font-size: 0.64rem; }
            #view-admin .metric-chip strong,
            #view-lab .metric-chip strong { font-size: 0.84rem; }
            #view-hr .hr-hero,
            #view-lab .lab-hero { padding: 12px; }
            #view-hr .hr-hero-copy h2,
            #view-lab .lab-hero-copy h2 { font-size: 1.04rem; }
            #view-hr .hr-hero-copy p,
            #view-lab .lab-hero-copy p { font-size: 0.72rem; }
            #view-hr .hr-kpi-card,
            #view-lab .lab-kpi-card { padding: 10px 10px 9px; }
            #view-hr .hr-kpi-card strong,
            #view-lab .lab-kpi-card strong { font-size: 0.68rem; }
            #view-hr .hr-kpi-card .value,
            #view-lab .lab-kpi-card .value { font-size: 1.34rem; }
            #view-hr .hr-kpi-card span,
            #view-lab .lab-kpi-card span { font-size: 0.64rem; }
            #view-admin .chart-box,
            #view-hr .chart-box,
            #view-lab .chart-box { height: 170px !important; }
            .month-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
            .month-btn { padding: 8px 6px; }
            .month-btn strong { font-size: 0.84rem; }
            .month-btn small { font-size: 0.52rem; }
            .calendar-grid { min-width: 0; grid-template-columns: repeat(7, minmax(0, 1fr)); }
            .calendar-grid,
            .day-cell,
            .day-events,
            .slot-pill,
            .slot-pill .store-name {
                min-width: 0;
                max-width: 100%;
            }
            .day-label { padding: 6px 2px; font-size: 0.62rem; }
            .day-cell { min-height: 64px; padding: 3px 2px; }
            .day-num { min-width: 18px; height: 18px; padding: 0 4px; font-size: 0.62rem; }
            .day-inline-empty { padding: 5px 4px; }
            .day-inline-btn { padding: 3px 7px; font-size: 0.5rem; }
            .slot-pill { width: 100%; padding: 2px 3px; font-size: 0.5rem; min-height: 14px; border-radius: 5px; gap: 3px; }
            .slot-pill .slot-seats { font-size: 0.48rem; }
            .slot-pill .store-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
            #hr-attention-table {
                min-width: 0;
                width: 100%;
                table-layout: fixed;
            }
            #hr-attention-table th,
            #hr-attention-table td {
                padding: 7px 4px;
                font-size: 0.66rem;
                white-space: normal;
                word-break: break-word;
            }
            #hr-attention-table th:nth-child(1),
            #hr-attention-table td:nth-child(1) { width: 54px; }
            #hr-attention-table th:nth-child(2),
            #hr-attention-table td:nth-child(2) { width: 58px; }
            #hr-attention-table th:nth-child(3),
            #hr-attention-table td:nth-child(3) { width: 58px; }
            #hr-attention-table .table-badge {
                padding: 3px 5px;
                font-size: 0.6rem;
            }
            #hr-employee-list,
            #hr-store-summary-table {
                min-width: 0;
                width: 100%;
                table-layout: fixed;
            }
            #hr-employee-list th,
            #hr-employee-list td,
            #hr-store-summary-table th,
            #hr-store-summary-table td {
                padding: 7px 4px;
                font-size: 0.64rem;
                white-space: normal;
                word-break: break-word;
            }
            #hr-employee-list th:nth-child(1),
            #hr-employee-list td:nth-child(1) { width: 32px; }
            #hr-employee-list th:nth-child(2),
            #hr-employee-list td:nth-child(2) { width: 52px; }
            #hr-employee-list th:nth-child(3),
            #hr-employee-list td:nth-child(3) { width: 64px; }
            #hr-employee-list th:nth-child(4),
            #hr-employee-list td:nth-child(4) { width: 56px; }
            #hr-employee-list th:nth-child(5),
            #hr-employee-list td:nth-child(5) { width: 58px; }
            #hr-employee-list th:nth-child(6),
            #hr-employee-list td:nth-child(6) { width: 44px; }
            #hr-employee-list th:nth-child(7),
            #hr-employee-list td:nth-child(7) { width: 48px; }
            #hr-employee-list th:nth-child(8),
            #hr-employee-list td:nth-child(8) { width: 62px; }
            #hr-store-summary-table th:nth-child(1),
            #hr-store-summary-table td:nth-child(1) {
                text-align: left;
                width: 76px;
            }
            #hr-store-summary-table th:nth-child(2),
            #hr-store-summary-table td:nth-child(2),
            #hr-store-summary-table th:nth-child(3),
            #hr-store-summary-table td:nth-child(3),
            #hr-store-summary-table th:nth-child(4),
            #hr-store-summary-table td:nth-child(4),
            #hr-store-summary-table th:nth-child(5),
            #hr-store-summary-table td:nth-child(5),
            #hr-store-summary-table th:nth-child(6),
            #hr-store-summary-table td:nth-child(6) { width: 48px; }
            #hr-store-summary-table th:nth-child(7),
            #hr-store-summary-table td:nth-child(7) { width: 54px; }
            .chart-box { height: 200px; }
        }

/* Mobile usability pass: keep core manager/admin workflows usable on phones. */
@media (max-width: 760px) {
    .topbar {
        gap: 10px;
    }

    .topbar-main {
        gap: 8px;
    }

    .nav-pills {
        display: flex;
        grid-template-columns: none;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 6px;
        padding-bottom: 4px;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
    }

    .nav-pills button {
        flex: 0 0 auto;
        width: auto;
        min-width: 86px;
        min-height: 40px;
        padding: 9px 12px;
        white-space: nowrap;
        scroll-snap-align: start;
    }

    .nav-pills .nav-home-btn {
        flex-basis: 40px;
        min-width: 40px;
        width: 40px;
    }

    .manager-store-top-chip {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        width: 100%;
        padding: 8px 10px;
        border-radius: 14px;
    }

    .manager-store-top-chip span {
        grid-column: 1 / -1;
        font-size: 0.68rem;
        line-height: 1.2;
    }

    .manager-store-top-chip strong {
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        font-size: 0.78rem;
        line-height: 1.35;
    }

    .manager-store-top-chip button {
        min-height: 32px;
        padding: 6px 10px;
    }

    #view-apply,
    #view-slot,
    #view-survey,
    #view-admin,
    #view-hr,
    #view-survey-insight,
    #view-lab,
    #view-apply .apply-wrap,
    #view-slot .slot-wrap {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    #view-apply .apply-wrap,
    #view-slot .slot-wrap {
        gap: 8px;
    }

    .form-grid,
    .admin-register-grid,
    .my-app-full-grid {
        grid-template-columns: 1fr !important;
    }

    .section-header-actions {
        display: grid;
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .section-header-actions > button,
    .section-header-actions > .btn-main,
    .section-header-actions > .btn-ghost,
    .section-header-actions > .btn-danger,
    .section-header-actions > .btn-excel {
        width: 100%;
        min-width: 0;
    }

    .confirm-dialog,
    .password-result-dialog,
    .survey-completion-dialog,
    .schedule-change-notice-dialog,
    .privacy-consent-dialog,
    .progress-dialog {
        max-height: calc(100dvh - 24px);
        overflow: auto;
    }

    .schedule-change-notice-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-dashboard-header,
    .admin-dashboard-detail-header {
        align-items: stretch;
    }

    .admin-dashboard-stamp,
    .admin-dashboard-detail-count {
        align-self: stretch;
        justify-content: center;
        text-align: center;
    }

    .admin-dashboard-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-dashboard-action,
    .admin-dashboard-jump {
        width: 100%;
        min-height: 38px;
    }
}

@media (max-width: 480px) {
    .nav-pills button {
        min-width: 76px;
        padding: 8px 10px;
        font-size: 0.72rem;
    }

    .nav-pills .nav-home-btn {
        min-width: 38px;
        width: 38px;
        flex-basis: 38px;
    }

    .manager-store-top-chip {
        grid-template-columns: 1fr;
    }

    .manager-store-top-chip button {
        width: 100%;
    }
}

@media (max-width: 760px) {
    #apply-bbm-panel,
    #admin-bbm-escort-panel {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    #apply-bbm-panel .record-link-panel-head,
    #admin-bbm-escort-panel .record-link-panel-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 4px;
    }

    #apply-bbm-panel .record-link-meta,
    #admin-bbm-escort-panel .record-link-meta {
        width: 100%;
        min-width: 0;
        text-align: left;
        white-space: normal;
    }

    #apply-bbm-panel .record-link-panel-copy,
    #admin-bbm-escort-panel .record-link-panel-copy {
        overflow-wrap: anywhere;
    }

    #apply-bbm-panel .bbm-apply-grid,
    #admin-bbm-escort-panel .bbm-apply-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    #apply-bbm-panel .field,
    #admin-bbm-escort-panel .field,
    #apply-bbm-panel .field > input,
    #apply-bbm-panel .field > select,
    #apply-bbm-panel .field > textarea,
    #admin-bbm-escort-panel .field > input,
    #admin-bbm-escort-panel .field > select,
    #admin-bbm-escort-panel .field > textarea {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #apply-bbm-panel .bbm-sensitive-retention-notice,
    #admin-bbm-escort-panel .bbm-sensitive-retention-notice {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 3px;
        overflow-wrap: anywhere;
    }

    #admin-slot-form-panel .field {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 6px;
        column-gap: 0;
        min-width: 0;
    }

    #admin-slot-form-panel .field label,
    #admin-slot-form-panel .field > input,
    #admin-slot-form-panel .field > select,
    #admin-slot-form-panel .field > textarea,
    #admin-slot-form-panel .field > p.helper-text,
    #admin-slot-form-panel .field > .slot-attachment-inline,
    #admin-slot-form-panel .inline-field-note {
        grid-column: 1 / -1;
        min-width: 0;
        max-width: 100%;
    }

    #admin-slot-form-panel .field label {
        padding-top: 0;
    }

    #admin-slot-form-panel input[type="date"],
    #admin-slot-form-panel input[type="number"],
    #admin-slot-form-panel input[type="url"],
    #admin-slot-form-panel input[type="text"],
    #admin-slot-form-panel select,
    #admin-slot-form-panel textarea {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }
}

@media (max-width: 480px) {
    #admin-slot-form-panel input[type="date"] {
        font-size: 0.9rem;
        padding-inline: 10px;
    }
}

@media (max-width: 760px) {
    .topbar {
        overflow: visible;
        align-self: start;
    }

    .topbar-main {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 42px 42px;
        grid-template-areas:
            "nav lang notify"
            "user user user"
            "store store store";
        align-items: center;
        gap: 8px;
    }

    .topbar-main > .nav-pills {
        grid-area: nav;
        min-width: 0;
        justify-content: flex-start;
    }

    #top-language-menu {
        grid-area: lang;
        width: 42px;
        min-width: 42px;
        justify-self: end;
    }

    #top-notification-menu {
        grid-area: notify;
        width: 42px;
        min-width: 42px;
        justify-self: end;
    }

    #top-user-menu {
        grid-area: user;
        width: 100%;
        min-width: 0;
        justify-self: stretch;
    }

    #top-language-menu .language-chip,
    #top-notification-menu .notification-chip {
        width: 42px;
        min-width: 42px;
        height: 42px;
        align-self: center;
    }

    #top-user-menu .user-chip {
        width: 100%;
        min-height: 42px;
        justify-content: flex-start;
        gap: 8px;
        padding: 3px 10px 3px 4px;
        border: 1px solid var(--line-soft);
        background: rgba(255, 255, 255, 0.82);
        overflow: hidden;
    }

    #top-user-menu .user-avatar {
        flex: 0 0 36px;
        width: 36px;
        height: 36px;
    }

    #top-user-menu .user-chip-text {
        min-width: 0;
        overflow: hidden;
    }

    #top-user-menu .user-chip-text strong {
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    #top-user-menu .user-chip-text span {
        flex: 0 0 auto;
    }

    #manager-store-top-chip {
        grid-area: store;
    }

    #manager-store-top-chip[hidden] {
        display: none !important;
    }

    #top-language-menu .language-options {
        left: auto;
        right: 0;
    }

    #top-notification-menu.open,
    #top-user-menu.open {
        grid-area: auto;
        grid-column: 1 / -1;
        width: 100%;
        min-width: 0;
    }

    #top-notification-menu.open .notification-dropdown,
    #top-user-menu.open .user-dropdown {
        position: static;
        width: 100%;
        min-width: 0;
        margin-top: 8px;
    }

    .hero,
    .kpi-grid {
        display: none !important;
    }
}

@media (max-width: 760px) {
    #view-slot,
    #view-slot .slot-wrap,
    #admin-slot-form-panel,
    #admin-slot-form-panel .form-grid,
    #admin-slot-form-panel .field {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
        overflow-x: hidden;
    }

    #admin-slot-form-panel .field {
        display: block;
    }

    #admin-slot-form-panel .field > label {
        display: block;
        width: 100%;
        margin-bottom: 6px;
    }

    #admin-slot-form-panel .field > input,
    #admin-slot-form-panel .field > select,
    #admin-slot-form-panel .field > textarea,
    #admin-slot-form-panel .field > .inline-field-note,
    #admin-slot-form-panel .field > .slot-attachment-inline,
    #admin-slot-form-panel .field > p.helper-text {
        display: block;
        inline-size: 100%;
        width: 100%;
        max-inline-size: 100%;
        max-width: 100%;
        min-inline-size: 0;
        min-width: 0;
        box-sizing: border-box;
        justify-self: stretch;
    }

    #admin-slot-form-panel input[type="date"] {
        -webkit-appearance: none;
        appearance: none;
        font-size: 16px;
        line-height: 1.3;
    }
}

@media (max-width: 760px) {
    #view-apply,
    #view-apply .apply-wrap,
    #view-apply .panel,
    #view-apply .form-grid,
    #view-apply .field {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #view-apply .apply-wrap,
    #view-apply .apply-wrap.apply-standalone,
    #view-apply .apply-wrap.password-standalone {
        display: grid;
        grid-template-columns: minmax(0, 1fr) !important;
        justify-content: stretch;
        max-width: 100%;
        margin: 0;
    }

    #view-apply .apply-wrap > .panel,
    #apply-form-panel,
    #apply-slot-overview-panel,
    #my-app-panel {
        grid-column: 1 / -1 !important;
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    #apply-form-panel .field > input,
    #apply-form-panel .field > select,
    #my-app-panel .field > input,
    #current-user-password-panel .field > input {
        display: block;
        width: 100%;
        inline-size: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #view-apply .mode-banner,
    #view-apply .slot-guidance-panel,
    #view-apply .manager-store-slot-status,
    #view-apply .confirmed-schedule-inline,
    #view-apply .record-link-panel,
    #view-apply .table-caption,
    #view-apply .tab-row,
    #view-apply .table-actions {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #view-apply .mode-banner {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
    }

    #view-apply .mode-banner .btn-ghost,
    #view-apply #apply-submit-btn,
    #view-apply #lookup-my-btn {
        width: 100%;
        min-width: 0;
    }

    #view-apply .table-wrap {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

#apply-slot-overview-list,
    #my-app-list {
        width: max-content;
        min-width: 100%;
    }
}

@media (max-width: 760px) {
    #view-survey-insight .hr-hero {
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 14px;
    }

    #view-survey-insight .hr-hero-copy,
    #survey-insight-hero-title,
    #survey-insight-hero-desc {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }

    #survey-insight-hero-title {
        font-size: 1.44rem;
        line-height: 1.3;
        word-break: keep-all;
        overflow-wrap: anywhere;
    }

    #survey-insight-hero-desc {
        font-size: 0.82rem;
        line-height: 1.55;
        word-break: keep-all;
        overflow-wrap: anywhere;
    }

    #view-survey-insight .survey-report-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
        gap: 8px;
        justify-content: stretch;
        align-items: stretch;
    }

    #view-survey-insight .survey-report-actions .btn-main,
    #view-survey-insight .survey-report-actions .excel-export-btn {
        width: 100%;
        min-width: 0;
        white-space: normal;
        justify-content: center;
        text-align: center;
        font-size: 0.82rem;
        line-height: 1.3;
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (max-width: 420px) {
    #view-survey-insight .survey-report-actions {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 860px) {
    #my-slot-detail-panel .record-link-summary-grid,
    #my-slot-detail-panel .record-link-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #my-slot-pending-panel .record-link-table-wrap {
        max-height: none;
        overflow: visible;
    }

    #my-slot-pending-list,
    #my-slot-pending-list thead,
    #my-slot-pending-list tbody,
    #my-slot-pending-list tr,
    #my-slot-pending-list th,
    #my-slot-pending-list td {
        display: block;
        width: 100%;
    }

    #my-slot-pending-list thead {
        display: none;
    }

    #my-slot-pending-list tbody tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 8px;
        padding: 12px;
        margin-bottom: 10px;
        border: 1px solid rgba(104, 152, 173, 0.16);
        border-radius: 16px;
        background: #fff;
    }

    #my-slot-pending-list tbody tr:last-child {
        margin-bottom: 0;
    }

    #my-slot-pending-list td {
        padding: 0;
    }

    #my-slot-pending-list td::before {
        display: block;
        margin-bottom: 3px;
        color: var(--muted);
        font-size: 0.66rem;
        font-weight: 800;
    }

    #my-slot-pending-list td.pending-col-date::before { content: "체험일"; }
    #my-slot-pending-list td.pending-col-store::before { content: "매장"; }
    #my-slot-pending-list td.pending-col-applicant::before { content: "신청자"; }
    #my-slot-pending-list td.pending-col-status::before { content: "상태"; }
    #my-slot-pending-list td.pending-col-reason::before { content: "기록"; }
    #my-slot-pending-list td.pending-col-actions::before { content: "관리"; }

    #my-slot-pending-list .table-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    #my-slot-pending-list .btn-ghost,
    #my-slot-pending-list .btn-inline-confirm {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 860px) {
    .my-app-full-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch;
    }

    .my-app-full-grid #my-app-lookup-field,
    .my-app-full-grid #lookup-my-btn,
    .my-app-full-grid #my-app-period-field,
    .my-app-full-grid #my-app-summary,
    .my-app-full-grid .table-wrap,
    .my-app-full-grid #my-app-connection-panel,
    .my-app-full-grid #confirmed-schedule-panel,
    .my-app-full-grid #my-app-filter-row,
    .my-app-full-grid #my-app-bulk-actions {
        grid-column: 1 / -1 !important;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .my-app-full-grid #my-app-period-field {
        max-width: 100%;
    }

    .my-app-filter-row,
    .my-slot-pending-filter-row {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-items: center;
        overflow: visible;
    }

    .my-app-filter-row .tab-btn,
    .my-slot-pending-filter-row .tab-btn {
        flex: 0 1 auto;
        min-width: 0;
        white-space: nowrap;
    }

    .my-slot-pending-period-row {
        grid-template-columns: minmax(0, 1fr) !important;
        align-items: stretch;
        gap: 8px;
    }

    .my-slot-pending-period-field,
    .my-slot-pending-summary {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    .my-slot-pending-summary {
        overflow-wrap: anywhere;
        white-space: normal;
    }

    #my-app-connection-panel .record-link-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #my-app-connection-panel .record-link-card {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #my-slot-pending-panel .record-link-table-wrap {
        max-height: none;
        overflow-x: auto;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
    }

    #my-slot-pending-list {
        display: table;
        width: max-content;
        min-width: 760px;
        border-collapse: separate;
        border-spacing: 0;
    }

    #my-slot-pending-list thead {
        display: table-header-group;
    }

    #my-slot-pending-list tbody {
        display: table-row-group;
    }

    #my-slot-pending-list thead tr,
    #my-slot-pending-list tbody tr {
        display: table-row;
        width: auto;
        padding: 0;
        margin: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    #my-slot-pending-list th,
    #my-slot-pending-list td {
        display: table-cell;
        width: auto;
        padding: 6px 8px;
        vertical-align: top;
    }

    #my-slot-pending-list td::before {
        content: none !important;
        display: none !important;
    }

    #my-slot-pending-list .table-actions {
        display: flex;
        flex-wrap: wrap;
        width: auto;
        gap: 5px;
    }

    #my-slot-pending-list .btn-ghost,
    #my-slot-pending-list .btn-inline-confirm {
        width: auto;
        min-width: 58px;
    }
}