* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: #f5f5f5;
    overflow: hidden;
}

/* Auth Screens */
.auth-screen {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.auth-container {
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.2);
    padding: 40px;
    max-width: 500px;
    width: 90%;
}

.auth-header {
    text-align: center;
    margin-bottom: 30px;
}

.auth-header h1 {
    font-size: 32px;
    color: #2c3e50;
    margin-bottom: 8px;
}

.auth-header p {
    color: #7f8c8d;
    font-size: 14px;
}

.auth-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label {
    font-weight: 600;
    color: #2c3e50;
    font-size: 14px;
}

.form-group input {
    padding: 12px 16px;
    border: 2px solid #e1e4e8;
    border-radius: 8px;
    font-size: 14px;
    transition: border-color 0.3s;
}

.form-group input:focus {
    outline: none;
    border-color: #667eea;
}

.btn-large {
    padding: 14px 24px;
    font-size: 16px;
    font-weight: 600;
}

.error-message {
    color: #e74c3c;
    background: #fadbd8;
    padding: 12px;
    border-radius: 6px;
    font-size: 14px;
    text-align: center;
}

/* Folder Selection */
.folder-selection {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

.folder-display {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 24px;
    border: 2px dashed #e1e4e8;
    border-radius: 8px;
    background: #f8f9fa;
    min-height: 100px;
}

.folder-display.has-selection {
    border-color: #667eea;
    background: #f8f9ff;
    border-style: solid;
}

.folder-icon {
    font-size: 48px;
}

.folder-text {
    flex: 1;
    color: #7f8c8d;
    font-size: 14px;
}

.folder-display.has-selection .folder-text {
    color: #2c3e50;
    font-weight: 500;
}

.btn-success {
    background: #27ae60;
    color: white;
}

.btn-success:hover {
    background: #229954;
}

.auth-footer {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #e1e4e8;
}

#app {
    display: flex;
    flex-direction: column;
    height: 100vh;
}

/* Toolbar */
#toolbar {
    background: #ffffff;
    color: #2c3e50;
    padding: 12px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    border-bottom: 1px solid #e1e4e8;
    z-index: 100;
}

.toolbar-left {
    display: flex;
    align-items: center;
    gap: 20px;
}

.toolbar-right {
    display: flex;
    align-items: center;
    gap: 8px;
}

.toolbar-divider {
    width: 1px;
    height: 24px;
    background: #e1e4e8;
    margin: 0 8px;
}

#toolbar h1 {
    font-size: 20px;
    font-weight: 700;
    color: #0366d6;
    margin: 0;
}

.pdf-name-display {
    font-size: 14px;
    color: #586069;
    font-weight: 500;
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.toolbar-section {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Buttons */
.btn {
    padding: 6px 12px;
    border: 1px solid #d1d5da;
    border-radius: 6px;
    background: #fafbfc;
    color: #24292e;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
}

.btn:hover {
    background: #f3f4f6;
    border-color: #c1c5ca;
}

.btn-primary {
    background: #0366d6;
    color: white;
    border-color: #0366d6;
}

.btn-primary:hover {
    background: #0256c7;
    border-color: #0256c7;
}

.btn-success {
    background: #28a745;
    color: white;
    border-color: #28a745;
}

.btn-success:hover {
    background: #22863a;
    border-color: #22863a;
}

.btn-info {
    background: #0366d6;
    color: white;
    border-color: #0366d6;
}

.btn-info:hover {
    background: #0256c7;
    border-color: #0256c7;
}

#zoom-level {
    font-size: 13px;
    color: #586069;
    font-weight: 500;
    min-width: 50px;
    text-align: center;
}

.btn-small {
    padding: 4px 8px;
    font-size: 12px;
}

.select {
    padding: 8px 12px;
    border: 1px solid #bdc3c7;
    border-radius: 4px;
    background: white;
    font-size: 14px;
    min-width: 200px;
}

/* Main Content */
#main-content {
    display: flex;
    flex: 1;
    overflow: hidden;
}

/* Sidebars */
#sidebar-left,
#sidebar-right {
    width: 300px;
    background: white;
    border-right: 1px solid #ddd;
    overflow-y: auto;
    padding: 15px;
}

#sidebar-right {
    border-right: none;
    border-left: 1px solid #e1e4e8;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

#sidebar-left h3,
#sidebar-right h3 {
    font-size: 16px;
    margin-bottom: 15px;
    color: #2c3e50;
    border-bottom: 2px solid #3498db;
    padding-bottom: 5px;
}

#sidebar-right h4 {
    font-size: 14px;
    margin-top: 20px;
    margin-bottom: 10px;
    color: #34495e;
}

/* Fixed header section in right sidebar */
#sidebar-right > h3,
#sidebar-right > #mode-selector,
#sidebar-right > #current-selection {
    flex-shrink: 0;
}

/* Scrollable panels container */
#sidebar-right > #groups-panel,
#sidebar-right > #connections-panel {
    flex: 1;
    overflow-y: auto;
    margin-top: 10px;
}

/* Symbol Palette */
#symbol-search {
    margin-bottom: 10px;
}

#symbol-search-input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

#symbol-palette {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.symbol-item {
    padding: 10px;
    background: #ecf0f1;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.symbol-item:hover {
    background: #d5dbdb;
}

.symbol-item.selected {
    background: #3498db;
    color: white;
}

.symbol-item:hover::after {
    content: attr(title);
    position: absolute;
    background: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: normal;
    max-width: 300px;
    z-index: 1000;
    margin-top: 25px;
    margin-left: -10px;
}

/* Mode Selector */
#mode-selector {
    display: flex;
    gap: 5px;
    margin-bottom: 15px;
}

.mode-btn {
    flex: 1;
    padding: 10px;
    font-size: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.mode-btn.active {
    background: #3498db;
}

.shortcut-hint {
    font-size: 9px;
    opacity: 0.7;
    font-weight: normal;
}

/* Canvas Container */
#canvas-container {
    flex: 1;
    position: relative;
    background: #ecf0f1;
    overflow: hidden;
}
/* ★(1) 마크업 바 = 뷰어(#canvas-container) 상단 오버레이. 바 켜지면 뷰어를 그만큼 내려 안 겹침(.mk-bar-on). */
#collab-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 6; }
#canvas-container.mk-bar-on #viewer-host { top: 40px; }

#main-canvas {
    display: block;
    cursor: crosshair;
}

#canvas-info {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 12px;
    display: flex;
    gap: 20px;
}

/* Selection Panel */
#current-selection {
    background: #f8f9fa;
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 15px;
}

#selected-drawings-list {
    max-height: 150px;
    overflow-y: auto;
    margin: 10px 0;
}

.drawing-item {
    padding: 5px;
    background: white;
    border: 1px solid #ddd;
    border-radius: 3px;
    margin-bottom: 3px;
    font-size: 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.drawing-item .remove-btn {
    color: #e74c3c;
    cursor: pointer;
    font-weight: bold;
}

/* PDF List */
#pdf-list {
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    padding: 10px;
}

.pdf-dir-header {
    padding: 6px 8px;
    background: linear-gradient(135deg, #f5f5f5 0%, #e8e8e8 100%);
    border-left: 4px solid #2196F3;
    text-align: left;
    margin-bottom: 3px;
    cursor: pointer;
    font-weight: 600;
    font-size: 12px;
    user-select: none;
    transition: all 0.3s ease;
    border-radius: 4px;
    display: flex;
    align-items: center;
}

.pdf-dir-header .dir-icon {
    margin-right: 6px;
    font-size: 14px;
    transition: transform 0.3s ease;
    flex-shrink: 0;
}

.pdf-dir-header:hover {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    border-left-color: #1976D2;
    transform: translateX(3px);
}

.pdf-dir-header.collapsed {
    opacity: 0.7;
    border-left-color: #90CAF9;
}

.pdf-dir-header.collapsed .dir-icon {
    transform: rotate(-90deg);
}

.pdf-files-container {
    margin-bottom: 5px;
    border-left: 2px solid #e0e0e0;
    margin-left: 10px;
    padding-left: 5px;
}

.pdf-item {
    padding: 4px 6px;
    background: white;
    border: 1px solid #e0e0e0;
    text-align: left;
    border-radius: 3px;
    margin-bottom: 2px;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 11px;
    display: flex;
    align-items: center;
    word-break: break-word;
    line-height: 1.3;
}

.pdf-item .file-icon {
    margin-right: 4px;
    font-size: 12px;
    opacity: 0.7;
    flex-shrink: 0;
}

.pdf-item:hover {
    background: #e3f2fd;
    border-color: #2196F3;
    transform: translateX(5px);
    box-shadow: 0 2px 4px rgba(33, 150, 243, 0.2);
}

.pdf-item:hover .file-icon {
    opacity: 1;
}

.pdf-item.active {
    background: #e3f2fd;
    border-color: #2196F3;
    font-weight: 600;
    box-shadow: 0 2px 4px rgba(33, 150, 243, 0.3);
}

.pdf-item.active .file-icon {
    opacity: 1;
    color: #2196F3;
}

#pdf-search {
    padding: 10px;
}

/* Sidebar Resizer */
#sidebar-resizer {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 5px;
    cursor: ew-resize;
    background: transparent;
    transition: background 0.2s;
    z-index: 10;
}

#sidebar-resizer:hover {
    background: #2196F3;
}

#sidebar-resizer.resizing {
    background: #1976D2;
}

#pdf-search-input {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 13px;
}

/* Groups List */
#groups-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.group-item {
    padding: 10px;
    background: #e8f5e9;
    border-left: 4px solid #27ae60;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.2s;
}

/* Type-specific colors */
.group-item[data-type="symbol"] {
    background: #e8f5e9;
    border-left-color: #27ae60;
}

.group-item[data-type="instrument"] {
    background: #ffebee;
    border-left-color: #e74c3c;
}

.group-item[data-type="line"] {
    background: #e3f2fd;
    border-left-color: #3498db;
}

.group-item[data-type="equipment"] {
    background: #fff3e0;
    border-left-color: #f39c12;
}

.group-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 5px;
}

.group-type-badge {
    background: #3498db;
    color: white;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 500;
}

.group-symbol-tag {
    color: #e67e22;
    font-weight: 600;
    font-size: 13px;
    margin: 5px 0;
}

.group-description {
    color: #7f8c8d;
    font-size: 12px;
    font-style: italic;
    margin: 5px 0;
}

.group-item:hover {
    background: #c8e6c9;
}

.group-item.selected {
    background: #a5d6a7;
    border-left-color: #1e8449;
}

.group-item.group-highlighted {
    background: #ffeb3b;
    border-left-color: #f57c00;
    animation: pulse 0.5s ease-in-out 3;
}

@keyframes pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.02); }
}

.group-item .group-header {
    font-weight: 600;
    font-size: 13px;
    margin-bottom: 3px;
}

.group-item .group-meta {
    font-size: 11px;
    color: #555;
}

.group-item .group-actions {
    margin-top: 5px;
    display: flex;
    gap: 5px;
}

/* Connections List */
#connections-list {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.connection-item {
    padding: 8px;
    background: #fff3cd;
    border-left: 4px solid #f39c12;
    border-radius: 4px;
    font-size: 12px;
}

.connection-item .connection-arrow {
    margin: 0 5px;
    color: #f39c12;
}

/* Modal */
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}

.modal.active {
    display: flex;
}

.modal-content {
    background: white;
    padding: 25px;
    border-radius: 8px;
    width: 500px;
    max-width: 90%;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.modal-content h3 {
    margin-bottom: 20px;
    color: #2c3e50;
}

.form-group {
    margin-bottom: 15px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
    font-size: 13px;
    color: #34495e;
}

.form-group input,
.form-group select,
.form-group textarea {
    width: 100%;
    padding: 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
}

.modal-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 20px;
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
    background: #bdc3c7;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #95a5a6;
}

/* Comments Panel */
#comments-panel {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 120px);
    overflow: hidden;
    padding: 0;
}

#comments-list {
    flex: 1;
    overflow-y: auto;
    padding: 5px 0;
    margin-bottom: 8px;
    min-height: 0;
}

.comment-item {
    background: #f6f8fa;
    border: 1px solid #e1e4e8;
    border-radius: 6px;
    padding: 12px;
    margin-bottom: 10px;
}

.comment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.comment-author {
    font-weight: 600;
    color: #24292e;
    font-size: 14px;
}

.comment-time {
    font-size: 12px;
    color: #586069;
}

.comment-text {
    color: #24292e;
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-wrap;
}

#comment-input-area {
    border-top: 1px solid #e1e4e8;
    padding-top: 8px;
    flex-shrink: 0;
    background: white;
}

#comment-input {
    width: 100%;
    padding: 8px;
    border: 1px solid #d1d5da;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    resize: none;
    margin-bottom: 6px;
    box-sizing: border-box;
    height: 50px;
}

#comment-input:focus {
    outline: none;
    border-color: #0366d6;
    box-shadow: 0 0 0 3px rgba(3, 102, 214, 0.1);
}

#btn-add-comment {
    width: 100%;
}

/* AI Chatbot Panel */
#chatbot-panel {
    position: fixed;
    bottom: 0;   /* ★ 마크업 바가 상단으로 이동 → 하단 원복 */
    left: 300px;
    right: 350px;
    height: 300px;
    background: #ffffff;
    border-top: 1px solid #e1e4e8;
    border-left: 1px solid #e1e4e8;
    border-right: 1px solid #e1e4e8;
    display: flex;
    flex-direction: column;
    z-index: 1000;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
}

#chatbot-panel.minimized {
    height: 35px;
}

#chatbot-panel.minimized #chatbot-content {
    display: none;
}

#chatbot-header {
    background: #f6f8fa;
    color: #24292e;
    padding: 8px 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e1e4e8;
    cursor: pointer;
    user-select: none;
}

.chatbot-title {
    font-size: 13px;
    font-weight: 600;
}

.chatbot-actions {
    display: flex;
    gap: 5px;
}

.chatbot-btn {
    background: transparent;
    border: none;
    color: #586069;
    cursor: pointer;
    padding: 2px 8px;
    font-size: 16px;
    border-radius: 3px;
    transition: background 0.2s;
}

.chatbot-btn:hover {
    background: #e1e4e8;
    color: #24292e;
}

#chatbot-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

#chatbot-messages {
    flex: 1;
    overflow-y: auto;
    padding: 15px;
    background: #ffffff;
}

.chat-message {
    margin-bottom: 15px;
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.message-header {
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #0366d6;
}

.bot-message .message-header {
    color: #28a745;
}

.user-message .message-header {
    color: #0366d6;
}

.message-text {
    color: #24292e;
    font-size: 13px;
    line-height: 1.6;
    white-space: pre-wrap;
    background: #f6f8fa;
    padding: 10px 12px;
    border-radius: 6px;
    border-left: 3px solid #28a745;
}

.user-message .message-text {
    background: #e3f2fd;
    border-left-color: #0366d6;
}

#chatbot-input-area {
    display: flex;
    gap: 8px;
    padding: 10px 15px;
    background: #f6f8fa;
    border-top: 1px solid #e1e4e8;
}

#chatbot-input {
    flex: 1;
    background: #ffffff;
    border: 1px solid #d1d5da;
    color: #24292e;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    resize: none;
    min-height: 32px;
    max-height: 100px;
}

#chatbot-input:focus {
    outline: none;
    border-color: #0366d6;
    box-shadow: 0 0 0 3px rgba(3, 102, 214, 0.1);
}

#chatbot-input::placeholder {
    color: #6a737d;
}

#btn-send-chat {
    align-self: flex-end;
    padding: 6px 16px;
    font-size: 13px;
}

#chatbot-resizer {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    cursor: ns-resize;
    background: transparent;
}

#chatbot-resizer:hover {
    background: #0366d6;
}

/* Adjust main content to account for chatbot */
#main-content {
    min-height: 0;   /* flex:1로 툴바 아래 전체를 채움(고정높이 계산 제거) — 사이드바는 전체높이, 챗은 뷰어영역만 덮음 */
}

/* ===== AutoFlow 뷰어 슬롯 (ViewerAdapter mount) — docs/13 통합 UI ===== */
/* ★(1) 챗 패널(#chatbot-panel: 고정, 하단 300px)이 뷰어를 가리던 문제 — 뷰어가 그만큼 하단을 '예약'해 안 겹침.
   챗 최소화(35px) 시 :has로 예약도 35px로 줄여 뷰어가 더 넓어진다. (:has 미지원 구형=항상 300 예약, 깨지진 않음) */
#viewer-host { position: absolute; top: 0; left: 0; right: 0; bottom: 300px; overflow: auto; background: #ecf0f1; }
#app:has(#chatbot-panel.minimized) #viewer-host { bottom: 35px; }
#deliverable-list { display: flex; flex-direction: column; gap: 4px; }
/* ★(5) 성과품 검색창 */
#dlv-search { width: 100%; box-sizing: border-box; margin: 6px 0 8px; padding: 7px 10px; border: 1px solid #cbd5e1;
  border-radius: 8px; font-size: 13px; background: #f8fafc; }
#dlv-search:focus { outline: none; border-color: #60a5fa; background: #fff; }
.dlv-group { font-size: 11px; color: #6b7280; font-weight: 700; margin: 8px 0 2px; }
.dlv-item { padding: 6px 8px; border: 1px solid #e0e0e0; border-radius: 4px; cursor: pointer; font-size: 12px;
            display: flex; align-items: center; gap: 6px; background: #fff; }
.dlv-item:hover { background: #e3f2fd; border-color: #2196F3; }
.dlv-item.active { background: #e3f2fd; border-color: #2196F3; font-weight: 600; }
.dlv-kind { font-size: 10px; color: #fff; border-radius: 8px; padding: 0 6px; }
.k-pdf_raster { background: #d62728; } .k-table { background: #1f77b4; } .k-spreadsheet { background: #15803d; }

/* P&ID 뷰어 (포팅 — 회귀 방지: 기존 클래스명 유지) */
#pid-bar { position: absolute; top: 0; left: 0; right: 0; z-index: 5; background: rgba(255,255,255,.92);
           font-size: 11px; padding: 4px 8px; display: flex; gap: 12px; flex-wrap: wrap; border-bottom: 1px solid #e5e7eb; }
/* ★ 도면 베이스 = 고유 px(intrinsic) — 표처럼 #vzoom zoom이 실제로 키운다(width:100% 컨테이너상대면 zoom 무효). */
#pid-wrap { position: relative; width: max-content; max-width: none; }
#pid-wrap img { display: block; }            /* 자연 크기(이미지 px) — 컨테이너 상대 X */
#pid-wrap > canvas#pid { display: block; }   /* ★(E) PDF.js 벡터 배경 캔버스 — CSS px=표시크기, backing=고해상 */
.pid-page canvas { display: block; width: 100%; height: 100%; }
/* ★ 멀티페이지 PDF — 페이지 세로 스택(lazy 이미지) */
.pid-page { position: relative; margin: 0 auto 10px; border: 1px solid #cbd5e1; box-shadow: 0 1px 4px rgba(0,0,0,.12); background: #fff; }
.pid-page img { display: block; }
.pid-pnum { position: absolute; top: 4px; right: 4px; background: rgba(30,41,59,.78); color: #fff; font-size: 11px; padding: 1px 7px; border-radius: 4px; }
#ov { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }  /* #pid-wrap(=img 크기) 따라가 함께 스케일 */
#ov rect { fill-opacity: 0.06; stroke-width: 2; cursor: pointer; }
#ov rect.unconf { stroke-dasharray: 6 4; }
#ov rect.symbol { fill-opacity: 0.2; }
#ov rect.sel { stroke-width: 4; fill-opacity: 0.25; cursor: move; }
#ov rect.handle { fill: #111827; stroke: #fff; stroke-width: 1; cursor: nwse-resize; }
#ov rect.newbox { fill: none; stroke: #374151; stroke-width: 2; stroke-dasharray: 5 4; }
#ov rect:hover { fill-opacity: 0.3; }
.sw { display: inline-block; width: 11px; height: 11px; vertical-align: middle; margin-right: 3px; border-radius: 2px; }
.prop { color: #9ca3af; }
/* 교정 패널 (floating) */
#panel, #addpanel { position: fixed; width: 290px; background: #fff; border: 1px solid #cbd5e1; border-radius: 6px;
        box-shadow: 0 2px 12px rgba(0,0,0,.28); padding: 10px; font-size: 13px; display: none; z-index: 1200; }
#addpanel { width: 250px; }
#panel h3, #addpanel h3 { margin: 0 0 8px; font-size: 13px; }
#panel .grp { margin: 8px 0 2px; color: #6b7280; font-size: 11px; }
#panel button, #addpanel button { margin: 2px; padding: 5px 9px; cursor: pointer; border: 1px solid #9ca3af; border-radius: 4px; background: #f9fafb; }
#panel button:hover, #addpanel button:hover { background: #eef2ff; }
#p-dyn, #p-relabel { width: 150px; }
#p-res { margin-top: 10px; font-size: 11px; white-space: pre-wrap; background: #f3f4f6; padding: 6px; border-radius: 4px; min-height: 12px; }
#p-close, #ap-close { float: right; cursor: pointer; color: #6b7280; }
#tip { position: fixed; background: #111827; color: #fff; padding: 6px 8px; font-size: 12px; border-radius: 4px;
       pointer-events: none; display: none; z-index: 1300; white-space: nowrap; }

/* 엑셀(spreadsheet) 뷰어 */
.sheet-wrap { padding: 14px; }
table.grid { border-collapse: collapse; font-size: 13px; }
table.grid th { background: #f3f4f6; border: 1px solid #d1d5db; color: #6b7280; font-weight: 600; padding: 3px 8px; min-width: 26px; text-align: center; }
table.grid td { border: 1px solid #d1d5db; padding: 3px 7px; min-width: 52px; max-width: 220px; height: 20px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.grid td:empty { background: #fff; min-width: 52px; }   /* 빈 셀도 테두리로 양식 유지 */
td.marked { background: #eef2ff; } td.header { background: #e0e7ff; font-weight: 600; color: #3730a3; }
td.formula { background: #fef9c3; color: #854d0e; font-family: ui-monospace, monospace; }
td.cellsel { outline: 3px solid #1d4ed8; outline-offset: -3px; } td.linked { outline: 3px solid #f59e0b; outline-offset: -3px; }

/* 리스트(table) 뷰어 */
.list-wrap { padding: 0; }
#lv-tabs { display: flex; position: sticky; top: 0; background: #f3f4f6; border-bottom: 1px solid #e5e7eb; }
#lv-tabs button { flex: 1; padding: 8px 4px; border: 0; background: none; cursor: pointer; font-size: 12px; border-bottom: 2px solid transparent; }
#lv-tabs button.active { background: #fff; border-bottom-color: #1f2937; font-weight: 600; }
#lv-body table { width: 100%; border-collapse: collapse; font-size: 12px; }
#lv-body td { padding: 4px 8px; border-bottom: 1px solid #eee; }
.chip { display: inline-block; padding: 1px 6px; border-radius: 9px; color: #fff; font-size: 10px; }
.tag { font-family: ui-monospace, monospace; }
.ok { color: #059669; } .alsobadge { font-size: 9px; color: #6b21a8; border: 1px solid #d8b4fe; border-radius: 6px; padding: 0 3px; margin-left: 3px; }
.panel-stub { padding: 14px; color: #6b7280; font-size: 12px; line-height: 1.7; }

/* 공통 호버 툴팁 (모든 뷰어 — 셀·도면객체·텍스트 호버 시 인식·검증·연결 표시) */
#hovertip { position: fixed; background: #111827; color: #fff; padding: 7px 9px; font-size: 12px; border-radius: 5px;
            pointer-events: none; display: none; z-index: 2400; white-space: pre-wrap; max-width: 320px; line-height: 1.5;
            box-shadow: 0 2px 10px rgba(0,0,0,.35); }
#hovertip b { color: #fde68a; }
/* 엑셀 네이티브 편집 셀 */
table.grid td[contenteditable] { outline: none; }
table.grid td.editing { background: #fff; outline: 2px solid #1d4ed8; outline-offset: -2px; }

/* ★ 이동 허브 — 호버 시 뜨고, 안의 연동 딜리버러블 블록 클릭→점프(인터랙티브, pointer-events 살림) */
#hub { position: fixed; display: none; z-index: 2100; min-width: 240px; max-width: 360px; background: #fff;
       border: 1px solid #cbd5e1; border-radius: 8px; box-shadow: 0 4px 18px rgba(0,0,0,.3); padding: 8px; font-size: 12px; }
.hub-title { font-weight: 700; font-size: 13px; margin-bottom: 4px; color: #111827; }
.hub-line { color: #374151; white-space: pre-wrap; line-height: 1.45; }
.hub-sec { margin: 8px 0 4px; font-size: 11px; color: #6b7280; border-top: 1px solid #eee; padding-top: 6px; }
.hub-item { padding: 6px 8px; border: 1px solid #e5e7eb; border-radius: 6px; margin-bottom: 4px; cursor: pointer; background: #f9fafb; }
.hub-item:hover, .hub-item.active { background: #dbeafe; border-color: #2563eb; }
.hub-item-d { font-size: 11px; color: #6b7280; margin-top: 2px; }
/* (클릭 전) 갈 대상 예고 — 소스 박스/셀 펄스 */
.jumpsrc { animation: jumppulse 0.7s ease-in-out infinite; }
@keyframes jumppulse { 0%,100% { stroke-width: 2; fill-opacity: .25; } 50% { stroke-width: 7; fill-opacity: .5; } }
td.jumpsrc { animation: tdpulse 0.7s ease-in-out infinite; }
@keyframes tdpulse { 0%,100% { outline: 2px solid #2563eb; } 50% { outline: 4px solid #1d4ed8; } }
/* (클릭 후 도착) 깜빡임 — "여기다" */
#ov rect.flash { animation: ovflash 0.45s ease-in-out 5; }
@keyframes ovflash { 0%,100% { stroke-width: 2; } 50% { stroke-width: 9; } }

/* ★ 벡터 픽 뷰어(SvgPickViewer + AFPickLayer) — 소스 무관(dwg=ezdxf, pdf=fitz). 인라인 SVG + viewBox 줌/팬 + 엔티티 픽 오버레이 */
#pk-bar { display: flex; align-items: center; gap: 10px; padding: 6px 12px; font-size: 12px; color: #475569;
  border-bottom: 1px solid #e5e7eb; position: sticky; top: 0; background: #fff; z-index: 6; }
#pk-bar .pk-btns button { font-size: 12px; padding: 2px 8px; margin-right: 2px; cursor: pointer; border: 1px solid #cbd5e1; border-radius: 6px; background: #f8fafc; }
#pk-read { margin-left: auto; color: #1d4ed8; font-family: monospace; }
/* ★transform 기반 팬/줌 — 네이티브 스크롤 안 씀(경계 클램프가 포인터 앵커를 못 이기게). #pk-page를 translate+scale로 직접 움직임 */
#pk-scroll { overflow: hidden; position: relative; height: calc(100vh - 150px); background: #0b1020; }   /* CAD 모델 배경 · 문서는 JS가 흰색으로 덮음 */
#pk-page { position: absolute; top: 0; left: 0; transform-origin: 0 0; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.pk-pagewrap { position: relative; flex: none; box-shadow: 0 1px 6px rgba(0,0,0,0.35); background: #fff; }   /* 페이지 카드(폭=JS 줌 배율). 세로로 쌓임 */
.pk-pagewrap > svg { display: block; width: 100%; height: auto; }   /* 렌더 SVG — wrap 폭 100%(변형 없음, viewBox 고정) */
.pick-ov { position: absolute; top: 0; left: 0; width: 100%; height: 100%; cursor: crosshair; }   /* 픽 오버레이 — 렌더와 같은 viewBox */
/* ★하이라이트 = mix-blend-mode:difference(흰색) → 대상 색을 반전(보색)해 어떤 색 위에서도 대비. 노랑 고정 폐기 */
.pick-hl { fill: none; stroke: #ffffff; stroke-width: 2.5px; vector-effect: non-scaling-stroke; pointer-events: none; mix-blend-mode: difference; }
.pick-hl-box { fill: #ffffff; stroke: #ffffff; stroke-width: 2px; vector-effect: non-scaling-stroke; mix-blend-mode: difference; }
.pick-group { stroke-width: 4px !important; stroke-dasharray: 7 4; }   /* ★그룹 = 같은 보색이되 굵은 파선으로 개별과 구분 */
/* ★묶음(집합) 박스 — 멤버들을 네모 안에(등호 아님) */
.cx-setbox { border: 1.5px solid #7c3aed; border-radius: 8px; padding: 5px 8px; margin: 6px 0; background: #faf5ff; }
.cx-setbox-h { font-size: 11px; font-weight: 700; color: #6d28d9; margin-bottom: 3px; }
/* ★(1) 묶음 중심 노드 — 관계 트리의 중심(더 진한 테두리·강조) */
.cx-center-wrap { margin: 3px 0; }
.cx-setbox.cx-center { border: 2px solid #6d28d9; background: #f5f3ff; box-shadow: 0 0 0 3px rgba(124,58,237,0.12); }
.cx-setbox.cx-center .cx-setbox-h { color: #5b21b6; }
.pick-flash { animation: pickflash 0.5s ease-in-out 5; }   /* ★점프 도착 강조 */
@keyframes pickflash { 0%,100% { stroke-width: 2.5px; } 50% { stroke-width: 6px; } }
.pick-hl-box.pick-group { fill-opacity: 0.5; }
.pick-sel { stroke: #2563eb; stroke-width: 3px; vector-effect: non-scaling-stroke; pointer-events: none; }   /* ★관계 선택된 요소 */
.pick-sel[width], rect.pick-sel { fill: rgba(37,99,235,0.14); }
/* ★러버밴드(드래그 다중선택) 사각형 — 걸침 기준 선택 */
.pick-marquee { fill: rgba(37,99,235,0.10); stroke: #2563eb; stroke-width: 1px; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; pointer-events: none; }
/* ★선택 HUD — 러버밴드/개별 선택 시 그룹·해제 안내(하단 중앙 필) */
#sel-hud { position: fixed; top: 92px; left: 50%; transform: translateX(-50%); z-index: 58; display: none; gap: 10px; align-items: center;
  background: #0f172a; color: #e2e8f0; padding: 7px 12px; border-radius: 999px; font-size: 12px; box-shadow: 0 4px 14px rgba(0,0,0,.35); }
#sel-hud b { color: #93c5fd; }
#sel-hud button { border: none; border-radius: 6px; padding: 4px 10px; font-size: 12px; cursor: pointer; background: #2563eb; color: #fff; }
#sel-hud button.ghost { background: #334155; color: #cbd5e1; }
#sel-hud button:disabled { opacity: .5; cursor: default; }
/* ★협업 바(관계 만들기) — viewBox 밖 고정 UI */
/* ★ 협업/마크업 바 — 상단(툴바 아래·main-content 위) 정상 흐름. 고정 아님 → 챗봇/코멘트 패널과 겹침·z-order 사고 없음. 한 줄(넘치면 가로 스크롤). */
#collab-bar { flex: none; background: #0f172a; color: #e2e8f0; font-size: 12px;
  padding: 7px 12px; display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
#collab-bar.off { background: #1e293b; }
#collab-bar button { font-size: 12px; padding: 3px 10px; border-radius: 6px; border: 1px solid #334155; background: #1e293b; color: #e2e8f0; cursor: pointer; }
#collab-bar button.on { background: #2563eb; border-color: #2563eb; }
#collab-bar button.mk { background: #7c3aed; border-color: #7c3aed; }
#collab-bar button:disabled { opacity: .4; cursor: default; }
.cb-chip { background: #334155; border-radius: 10px; padding: 2px 8px; display: inline-flex; align-items: center; gap: 5px; }
.cb-chip .x { cursor: pointer; color: #94a3b8; }
.cb-sep { width: 1px; height: 18px; background: #334155; flex: none; }
.cb-brand { color: #cbd5e1; font-weight: 700; flex: none; }
.cb-hint { color: #64748b; font-size: 11px; margin-left: 6px; flex: none; }
.cb-note { background: #1e293b; border: 1px solid #334155; color: #e2e8f0; border-radius: 6px; padding: 3px 8px; font-size: 12px; width: 160px; }
.pk-fail { margin: 40px auto; max-width: 460px; padding: 18px 20px; background: #fef2f2; border: 1px solid #fecaca; border-radius: 10px; color: #991b1b; font-size: 14px; line-height: 1.5; text-align: center; }
.cons-ov { }   /* consistency 오버레이 — 위치·pointer-events는 JS 인라인. raw 픽 위층, 빈 곳은 아래로 통과 */
.cons-ov rect:hover { stroke-width: 1.6px; }
.cons-ov rect.cm-flash { animation: consflash 0.5s ease-in-out 5; }   /* ★(3) 점프 도착 하이라이트 */
@keyframes consflash { 0%,100% { fill-opacity: 0.15; stroke-width: 0.8px; } 50% { fill-opacity: 0.6; stroke-width: 3px; } }
td.cell-sel { outline: 3px solid #2563eb; outline-offset: -3px; }   /* ★관계 선택된 셀(pick 뷰어 pick-sel과 동일 개념) */
td.cell-group { outline: 3px dashed #f97316; outline-offset: -3px; }   /* ★그룹 호버 셀 */
td.flash { animation: tdflash 0.45s ease-in-out 5; }
@keyframes tdflash { 0%,100% { background: #fff; } 50% { background: #93c5fd; } }

/* HITL 교정 패널 — 위반 판정(덮기) + 사유 입력 + 수정 히스토리(리비전·provenance) */
/* ★박스 크기 고정 = 뷰포트 안으로 클램프. 항목 많아도 박스가 커지지 않고 내부 스크롤(세로·가로). */
#cpanel { position: fixed; display: none; z-index: 2200; width: 440px; max-width: calc(100vw - 24px); max-height: calc(100vh - 24px);
          overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; background: #fff; border: 1px solid #cbd5e1;
          border-radius: 8px; box-shadow: 0 4px 18px rgba(0,0,0,.32); padding: 10px; font-size: 12px; }
/* ★스크롤 존재 표시 = 얇은 스크롤바(넘칠 때 항상 보임 → "더 있다" 인지). */
#cpanel::-webkit-scrollbar { width: 9px; height: 9px; }
#cpanel::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 6px; border: 2px solid #fff; }
#cpanel::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
/* ★제목·닫기는 스크롤해도 상단 고정(닫기 항상 접근). */
.cp-close { position: sticky; top: 0; float: right; cursor: pointer; color: #6b7280; background: #fff; z-index: 2; padding-left: 6px; }
.cp-title { position: sticky; top: 0; background: #fff; z-index: 1; font-weight: 700; font-size: 14px; margin-bottom: 4px; padding-bottom: 2px; }
/* ★선택 목록 미리보기 = 한 줄 유지(가로 오버플로 → shift+휠 좌우 스크롤로 끝까지). 세로로 안 쌓임. */
#cpanel .cp-selpreview { white-space: nowrap; }
.cp-line { color: #374151; margin-bottom: 4px; }
.cp-sec { margin: 9px 0 4px; font-size: 11px; color: #6b7280; border-top: 1px solid #eee; padding-top: 6px; }
#cpanel textarea { width: 100%; box-sizing: border-box; border: 1px solid #d1d5da; border-radius: 6px; padding: 6px; font-family: inherit; resize: none; }
#cpanel .btn { width: 100%; margin-top: 6px; }
.cp-hist { border-left: 3px solid #28a745; padding: 4px 8px; margin-bottom: 6px; background: #f6f8fa; border-radius: 4px; }
.cp-why { color: #111827; margin: 2px 0; }
.cp-rev { font-size: 10px; color: #9ca3af; font-family: ui-monospace, monospace; }

/* 핀-점프 트레이 (C3 연결 만들기) — 핀한 소스를 슬롯 전환 넘어 유지 */
#tray { position: fixed; top: 92px; left: 50%; transform: translateX(-50%); display: none; z-index: 2300;
        background: #1d4ed8; color: #fff; padding: 8px 14px; border-radius: 8px; font-size: 12px;
        box-shadow: 0 3px 14px rgba(0,0,0,.35); display: none; align-items: center; gap: 10px; }
#tray b { color: #fde68a; }
#tray #tray-cancel { cursor: pointer; opacity: .8; margin-left: 6px; }
.cp-why { color: #6b7280; font-size: 11px; margin: 2px 0 4px; }
#cpanel .btn.btn-link { background: #1d4ed8; color: #fff; border-color: #1d4ed8; }

/* 패널 시각적 구조화(#3) — 정보 덩어리를 반투명 박스로 분리(텍스트 나열 탈피) */
.cp-block { background: rgba(243,244,246,.7); border: 1px solid #e5e7eb; border-radius: 6px; padding: 7px 9px; margin: 6px 0; }
.cp-block-h { font-size: 10px; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 4px; }
.cp-conn { display: flex; justify-content: space-between; align-items: center; padding: 3px 0; gap: 6px; }
.cp-conn .cp-mini { padding: 2px 8px; font-size: 11px; border: 1px solid #9ca3af; border-radius: 4px; background: #fff; cursor: pointer; }
.cp-conn .cp-mini:hover { background: #eef2ff; }
.cp-done { color: #047857; font-weight: 600; padding: 3px 0; }

/* 정보 단위 칩화(#2) — 상태·출처·값을 낱개 라운드 배지로 */
.cp-chip { display: inline-block; padding: 2px 9px; border-radius: 11px; font-size: 11px; margin: 2px 4px 2px 0; background: #e5e7eb; color: #374151; }
.cp-chip.src { background: #eef2ff; color: #3730a3; }
.cp-chip.mm { background: #fee2e2; color: #b91c1c; font-weight: 600; }
.cp-conn-loc { font-size: 10px; color: #6b7280; margin-top: 1px; }   /* 연결 상대 위치(파일/시트/셀) */

/* 연결된 모든 것 테이블(#1 통합·#2 본인 닻) */
.cp-table { width: 100%; border-collapse: collapse; font-size: 11px; }
.cp-table th { text-align: left; color: #6b7280; font-weight: 600; border-bottom: 1px solid #d1d5db; padding: 2px 5px; }
.cp-table td { border-bottom: 1px solid #eee; padding: 4px 5px; vertical-align: top; }
.cp-table tr.cp-self td { background: #fef9c3; }   /* 본인 = 노란 닻 */
.cp-table tr.cp-add td { background: #f8fafc; text-align: center; padding-top: 6px; }
/* E2 relation 그룹 소제목 — 동일성/의존성 구분 */
.cp-table tr.cp-grp td { background: #f1f5f9; color: #475569; font-size: 9.5px; font-weight: 700;
  letter-spacing: .02em; padding: 3px 5px; border-bottom: 1px solid #cbd5e1; }
.cp-relpick { font-size: 11px; color: #334155; }

/* ★ ㄴ자(└) 선 트리 — 중첩 박스 대신 선으로 계층(VS Code 폴더식). 부모→본인→자식이 └로 달림. 오른쪽=연결(대등). */
.cp-spatial { display: flex; flex-direction: column; gap: 6px; }
.sp-mid { display: flex; gap: 8px; align-items: flex-start; }
.cx-tree { flex: 1; min-width: 0; }
.tx-row { display: flex; align-items: center; margin: 2px 0; }
.tx-el { color: #94a3b8; font-weight: 700; margin-right: 4px; flex-shrink: 0; font-size: 13px; }
.tx-row > .cx-row { flex: 1; margin: 0; min-width: 0; }
.sp-hint { color: #b91c1c; font-weight: 700; background: #fee2e2; border-radius: 5px; padding: 3px 7px; font-size: 11px; }
.sa-badge { font-size: 8.5px; background: #eab308; color: #fff; border-radius: 4px; padding: 0 4px; vertical-align: middle; }
/* ① 값 선택지 버튼(기본부터 '고르는 것'으로 보임) + 호버 팝오버는 AFTip(앱 UI). key: value. */
.cx-key { font-size: 9.5px; color: #64748b; font-weight: 600; }
.sa-pick { font: inherit; font-weight: 700; color: #047857; background: #ecfdf5; border: 1.5px solid #10b981;
  border-radius: 6px; padding: 2px 9px; cursor: pointer; }
.sa-pick:hover { background: #10b981; color: #fff; }
/* 오른쪽 = 연결(ConnectsTo, 대등 — 위계 아님) */
.sp-right { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; width: 150px; }
.sp-right-h { font-size: 9px; font-weight: 700; color: #7e22ce; }
/* ★ 통일 행: [값(선택)] [출처 줄 = 점프 버튼] [✕ 오른쪽 끝] — 모든 관계 동일 */
.cx-row { display: flex; align-items: stretch; margin: 3px 0; }
.cx-valcell { display: flex; align-items: center; margin-right: 5px; flex-shrink: 0; }
.cx-jump { flex: 1; text-align: left; font: inherit; font-size: 11px; color: #1e293b; background: #fff;
  border: 1px solid #cbd5e1; border-radius: 6px 0 0 6px; padding: 5px 8px; cursor: pointer; min-width: 0;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cx-jump:hover { background: #eff6ff; border-color: #60a5fa; }
.cx-src { color: #64748b; font-size: 10px; }
.cx-vin { color: #0e7490; font-weight: 600; }
.cx-cut { font: inherit; color: #b91c1c; background: #fef2f2; border: 1px solid #fca5a5; border-left: none;
  border-radius: 0 6px 6px 0; padding: 0 10px; cursor: pointer; font-weight: 700; flex-shrink: 0; }
.cx-cut:hover { background: #b91c1c; color: #fff; }
/* ★ 본인 = 입체로 튀어나온 닻(그림자·확대·떠있는 느낌) — 색 아니라 깊이로 강조 */
.cx-self { background: #fffbeb; border: 2px solid #eab308; border-radius: 9px; padding: 4px 6px;
  box-shadow: 0 6px 18px rgba(180,130,0,.35); transform: scale(1.04); transform-origin: left center;
  position: relative; z-index: 4; margin: 2px 0 9px; }
.cx-self .cx-jump.cx-nojump { background: transparent; border: none; cursor: default; padding: 2px 2px; white-space: normal; }
.cp-addrow { text-align: center; margin-top: 9px; padding-top: 7px; border-top: 1px solid #e5e7eb; }
/* 엑셀 시트 탭(시트별 분리) + 전체 셀 마킹 */
#sh-tabs { display: flex; flex-wrap: wrap; gap: 3px; margin: 6px 0 4px; border-bottom: 2px solid #e5e7eb; }
.sh-tab { padding: 4px 11px; font-size: 12px; cursor: pointer; border: 1px solid #e5e7eb; border-bottom: none;
  border-radius: 6px 6px 0 0; background: #f3f4f6; color: #6b7280; }
.sh-tab:hover { background: #e5e7eb; }
.sh-tab.on { background: #fff; color: #1d4ed8; font-weight: 700; border-color: #cbd5e1; box-shadow: 0 -2px 0 #1d4ed8 inset; }
.sh-tab-n { font-size: 9px; color: #9ca3af; }
#sh-scroll { overflow: auto; max-height: calc(100vh - 220px); }
.grid td.rel { outline: 1.5px solid #6366f1; outline-offset: -1.5px; cursor: pointer; }  /* 관계 있는 셀(데모) */
/* ★ 원본 양식 모드: consistency가 셀을 안 덮음 — 아웃라인 제거(format 보존), 상태는 코너 닷 + 호버 */
.grid.exact td.rel { outline: none; cursor: pointer; }
.grid.exact td.marked { position: relative; }
.cm-dot { position: absolute; top: 1.5px; right: 1.5px; width: 6px; height: 6px; border-radius: 50%; box-shadow: 0 0 0 1px #fff; pointer-events: none; }
.cm-dot.cm-match { background: #16a34a; }
.cm-dot.cm-value_mismatch { background: #f59e0b; }
.cm-dot.cm-missing_in_list, .cm-dot.cm-missing_on_pid { background: #dc2626; }
.cm-dot.cm-reconciled { background: #0891b2; }
.cm-dot.cm-dismissed { background: #9ca3af; }
/* ★ 엑셀 그대로 모드 — 강제 기본 테두리 0(원본 셀별 border만). 기본선이 깔리면 border-collapse서 원본 hair/검정을 덮어 균일 옅은 격자로 뭉갬(실측). */
.grid.exact { table-layout: fixed; }   /* ★ colgroup 폭 엄수 — 원본 컬럼 비율 그대로(내용이 칸 늘리지 않음) */
.grid.exact td { border: 0; min-width: 0; max-width: none; }   /* ★ 기본 min-width 52px 제거 — 좁은 컬럼(38·45px) 그대로 */
.grid.exact td:empty { min-width: 0; }
.grid.exact th { min-width: 0; }   /* ★(A) 헤더 26px floor 제거 — 좁은 컬럼이 floor에 밀려 표 폭 부풀고 잉여가 재분배되는 것 차단 */
/* ★(B) 인덱스 헤더 고정 — 스크롤해도 컬럼 인덱스(상단)·행 인덱스(좌측)는 항상 보임. 스크롤러=#sh-scroll. */
.grid.exact th.colhdr { position: sticky; top: 0; z-index: 6; }    /* 셀내 이미지(z5)보다 위 — 스크롤 시 헤더가 항상 보임 */
.grid.exact th.rowhdr { position: sticky; left: 0; z-index: 6; }
.grid.exact th.corner { position: sticky; top: 0; left: 0; z-index: 7; }
/* ★(1-a) 셀내 임베디드 이미지 — 격자 위 절대배치(서식 셀 위, 호버는 통과). 변환본(.xls→.xlsx)에서 추출. */
#sh-imgwrap { position: relative; }
.sh-cellimg { position: absolute; z-index: 5; pointer-events: none; object-fit: contain; }
.grid.exact td.marked, .grid.exact td.header { background: #fff; }   /* 기본 파랑 배경 제거 — 원본은 흰 셀(상태색·원본 fill은 inline이라 유지) */
.grid.exact th { border: 1px solid #e5e7eb; background: #f8fafc; }   /* 행/열 머리만 옅은 칸 — 방향 안내 */
/* 【4】 Consistency Sheet — 좌측 스크롤 무관 sticky 최상단 고정 + 매직완드(magic table) 강조 */
.cons-sticky { position: sticky; top: -15px; z-index: 6; background: #fff; padding: 15px 0 6px; margin: -15px 0 2px; }
.pdf-item.cons-item { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 9px;
  background: linear-gradient(135deg, #ede9fe, #faf5ff); border: 1.5px solid #a78bfa; font-weight: 700;
  color: #5b21b6; box-shadow: 0 2px 10px rgba(124, 58, 237, .2); }
.pdf-item.cons-item:hover { background: linear-gradient(135deg, #ddd6fe, #ede9fe); }
.pdf-item.cons-item.active { border-color: #7c3aed; box-shadow: 0 2px 12px rgba(124, 58, 237, .35); }
.cons-wand { font-size: 15px; filter: drop-shadow(0 1px 2px rgba(124, 58, 237, .4)); }
.cons-label { flex: 1; }
.cons-badge { font-size: 8px; background: #7c3aed; color: #fff; border-radius: 4px; padding: 1px 5px; letter-spacing: .05em; }
.cm-wrap { padding: 14px; }
.cm-head { font-size: 13px; font-weight: 700; color: #1e293b; margin-bottom: 10px; }
.cm-group { font-size: 12px; font-weight: 700; color: #475569; margin: 14px 0 6px; border-bottom: 2px solid #e5e7eb; padding-bottom: 3px; }
.cm-ent { margin: 0 0 14px; }
.cm-ent-h { font-size: 12.5px; margin-bottom: 3px; }
.cm-badge { font-size: 10px; border-radius: 5px; padding: 1px 7px; font-weight: 700; }
.cm-desc { font-size: 11px; color: #64748b; }
table.cm-tbl { font-size: 11px; }
table.cm-tbl th { background: #f3f4f6; color: #475569; font-weight: 600; padding: 3px 8px; border: 1px solid #d1d5db; }
table.cm-tbl td { padding: 3px 8px; border: 1px solid #e5e7eb; white-space: nowrap; }
.cm-attr { font-weight: 600; color: #334155; background: #f8fafc; }
.cm-tbtn { margin-left: 12px; font-size: 11px; font-weight: 600; padding: 3px 10px; cursor: pointer; border: 1px solid #cbd5e1; border-radius: 6px; background: #f1f5f9; color: #1e293b; }
.cm-tbtn:hover { background: #e2e8f0; }
table.cm-tbl th.cm-dlv-fold { background: #e8edf3; color: #334155; }       /* 폴더 계층 헤더(상위) */
table.cm-tbl th.cm-dlv-leaf { background: #f3f4f6; color: #1e40af; font-weight: 600; max-width: 160px; white-space: normal; word-break: break-word; }  /* 리프=실제 파일 */
table.cm-tbl-v th.cm-dlv-fold, table.cm-tbl-v th.cm-dlv-leaf { text-align: left; vertical-align: top; }   /* 전치=세로축 좌측 정렬 */
table.cm-tbl td.cm-cons { font-weight: 700; text-align: center; }
/* ★3시트 레이아웃 */
.cm-tabs { display: flex; gap: 6px; margin: 8px 0 6px; border-bottom: 2px solid #e5e7eb; }
.cm-tab { font-size: 12px; font-weight: 600; padding: 6px 14px; cursor: pointer; border: 1px solid #e5e7eb; border-bottom: none; border-radius: 8px 8px 0 0; background: #f8fafc; color: #64748b; }
.cm-tab.active { background: #fff; color: #1e3a8a; border-color: #cbd5e1; margin-bottom: -2px; border-bottom: 2px solid #fff; }
table.cm-sheet td.cm-tag { background: #f1f5f9; font-weight: 700; color: #0f172a; vertical-align: middle; text-align: center; min-width: 64px; }
table.cm-sheet td.cm-prop { background: #f8fafc; color: #334155; font-weight: 600; }
table.cm-sheet td.cm-desc-cell { color: #475569; white-space: normal; max-width: 320px; }
.cm-src2 { color: #64748b; font-size: 10px; }
.cm-val.cm-jump { cursor: pointer; }
.cm-val.cm-jump:hover { outline: 2px solid #1d4ed8; outline-offset: -2px; }
.cm-src { color: #1d4ed8; font-size: 9px; margin-left: 3px; }
.cm-exist { text-align: center; } .cm-o { color: #16a34a; font-weight: 700; } .cm-x { color: #cbd5e1; }
.cm-empty { color: #cbd5e1; text-align: center; }
/* E3 의존성 위반 배너 */
.cp-depwarn { border-radius: 7px; padding: 6px 9px; margin: 4px 0 8px; font-size: 12px; font-weight: 700; }
.cp-depwarn-h { font-size: 10.5px; font-weight: 500; margin-top: 3px; }
.cp-dep-dangling { background: #fef2f2; color: #b91c1c; border: 1.5px solid #fca5a5; }
.cp-dep-orphan { background: #fffbeb; color: #b45309; border: 1.5px solid #fcd34d; }
.cp-table .cp-mini { padding: 2px 7px; font-size: 10px; border: 1px solid #9ca3af; border-radius: 4px; background: #fff; cursor: pointer; }
.cp-table .cp-mini:hover { background: #eef2ff; }

/* 출처 칩 분리(#2) — 파일명 / 위치 다른 차원 */
.cp-table .cp-chip { margin: 1px 3px 1px 0; font-size: 10px; }
.cp-chip.fchip { background: #eef2ff; color: #3730a3; }
.cp-chip.lchip { background: #ecfeff; color: #0e7490; }

/* ── DWG 벡터 뷰(DwgSvgViewer, 경로A) — ezdxf SVGBackend SVG + 투명 엔티티 픽 레이어 ── */
#dwg-bar { padding: 6px 10px; font-size: 12px; color: #475569; border-bottom: 1px solid #e5e7eb; position: sticky; top: 0; background: #fff; z-index: 6; }
#dwg-read { margin-left: 12px; color: #1d4ed8; font-family: monospace; }
#dwg-scroll { overflow: auto; max-height: calc(100vh - 150px); background: #0b1020; padding: 10px; }
#dwg-page { position: relative; }
#dwg-page > svg:first-child { display: block; width: 100%; height: auto; }   /* ★ viewBox만, 컨테이너 100%(변형 없음) */
#dwg-ov { position: absolute; inset: 0; width: 100%; height: 100%; cursor: crosshair; }
.dwg-hl { fill: none; stroke: #ffe000; stroke-width: 2.5px; vector-effect: non-scaling-stroke; }   /* 줌 무관 일정 굵기 */

/* ★(4) 공통 마크업 레이어 — 모든 뷰어 원본 위 주석 오버레이(사람=파랑 / AI=빨강·점선) */
.mk-ov-sheet { pointer-events: none; }   /* 도구 선택 시 markup.js가 auto로 전환 */
.mk { pointer-events: auto; }
.mk text { pointer-events: none; user-select: none; }
.mk-preview { pointer-events: none; opacity: .8; }
[data-mk].mk-flash { animation: mkflash 0.5s ease-in-out 6; }
/* ★마크업 호버 삭제 X 버튼(플로팅) — 마크업 위 호버 시. 즉시 삭제 + 실행취소 토스트(모달 없음) */
.mk-del-x { position: fixed; z-index: 2500; width: 20px; height: 20px; line-height: 18px; text-align: center; padding: 0;
  border: 1px solid #fff; border-radius: 50%; background: #e11d48; color: #fff; font-size: 12px; cursor: pointer; box-shadow: 0 1px 5px rgba(0,0,0,.35); }
.mk-del-x:hover { background: #be123c; }
/* ★코멘트 삭제 X(사람 작성분만) */
.cmt-del-x { float: right; border: none; background: none; color: #cbd5e1; font-size: 12px; cursor: pointer; padding: 0 2px; }
.cmt-del-x:hover { color: #e11d48; }
/* ★삭제 실행취소 토스트(모달 금지) */
.cb-undo { position: fixed; top: 92px; left: 50%; transform: translateX(-50%); z-index: 2600; display: none; gap: 12px; align-items: center;
  background: #111827; color: #fff; padding: 8px 14px; border-radius: 8px; font-size: 13px; box-shadow: 0 4px 14px rgba(0,0,0,.35); }
.cb-undo button { border: none; background: #374151; color: #fff; border-radius: 6px; padding: 4px 10px; font-size: 12px; cursor: pointer; }
.cb-undo button:hover { background: #4b5563; }
@keyframes mkflash { 0%,100% { stroke-width: 2px; filter: none; } 50% { stroke-width: 6px; filter: drop-shadow(0 0 6px currentColor); } }
/* ★마크업 도구 버튼(협업 바) */
#collab-bar button.cbmk { background: #1e293b; border-color: #475569; }
#collab-bar button.cbmk.on { background: #e11d48; border-color: #e11d48; }
/* ★마크업 두께/글자 조절(도면 좌표 기준) */
#collab-bar button.cbst, #collab-bar button.cbft { background: #1e293b; border-color: #475569; padding: 3px 8px; }
#collab-bar button.cbst.on, #collab-bar button.cbft.on { background: #0ea5e9; border-color: #0ea5e9; }
.cb-lbl { color: #94a3b8; font-size: 11px; flex: none; }
.cb-num { width: 56px; background: #1e293b; border: 1px solid #475569; color: #e2e8f0; border-radius: 6px; padding: 3px 6px; font-size: 12px; flex: none; }
/* ★코멘트 항목(사람/AI 구분) + 대상 점프 */
.af-cmt { border: 1px solid #e1e4e8; border-left: 3px solid #2563eb; border-radius: 6px; padding: 8px 10px; margin: 6px 8px; background: #f8fafc; font-size: 12px; }
.af-cmt.ai { border-left-color: #e11d48; background: #fff1f2; }
.af-cmt-h { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 3px; }
.af-cmt-h b { font-size: 12px; }
.af-cmt-t { color: #334155; line-height: 1.4; white-space: pre-wrap; }
.af-cmt-tgt { margin-left: auto; color: #2563eb; cursor: pointer; font-size: 11px; }
.af-cmt-tgt:hover { text-decoration: underline; }
.af-cmt-group { margin: 10px 8px 4px; padding-top: 8px; border-top: 1px dashed #cbd5e1; font-size: 11px; font-weight: 700; color: #64748b; }
/* ★ 트랙 A 확인 대기열 패널 */
#queue-panel { border-bottom: 2px solid #e5e7eb; padding-bottom: 8px; margin-bottom: 8px; max-height: 48vh; display: flex; flex-direction: column; }
#queue-head { display: flex; align-items: center; justify-content: space-between; gap: 6px; }
#queue-head h3 { margin: 0; }
.queue-count { color: #dc2626; font-weight: 700; }
#queue-export { font-size: 11px; padding: 3px 8px; }
.q-filter { width: 100%; box-sizing: border-box; margin: 6px 0 2px; padding: 5px 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 12px; background: #f8fafc; }
#queue-list { overflow-y: auto; min-height: 0; display: flex; flex-direction: column; gap: 6px; margin-top: 6px; }
.q-item { display: flex; gap: 8px; border: 1px solid #e1e4e8; border-radius: 8px; padding: 6px; background: #fff; }
.q-thumb { width: 84px; height: 84px; object-fit: cover; border: 1px solid #cbd5e1; border-radius: 6px; cursor: pointer; background: #f8fafc; flex: none; }
.q-thumb-ph { display: flex; align-items: center; justify-content: center; font-size: 30px; color: #94a3b8; background: repeating-linear-gradient(45deg,#f8fafc,#f8fafc 6px,#eef2f7 6px,#eef2f7 12px); }
.q-src { color: #fff; font-size: 9px; font-weight: 800; padding: 1px 5px; border-radius: 8px; flex: none; letter-spacing: .3px; }
.q-body { flex: 1; min-width: 0; font-size: 12px; }
.q-row { display: flex; align-items: center; gap: 6px; }
.q-key { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; color: #1e293b; }
.q-key:hover { color: #2563eb; text-decoration: underline; }
.q-status { color: #fff; font-size: 10px; font-weight: 700; padding: 1px 6px; border-radius: 10px; flex: none; }
.q-val { color: #475569; margin: 3px 0; }
.q-reason-t { color: #64748b; font-size: 11px; cursor: pointer; }
.q-reason-b { color: #334155; font-size: 11px; background: #f8fafc; border-radius: 6px; padding: 5px 7px; margin-top: 3px; white-space: pre-wrap; }

/* 수정 히스토리 타임라인 */
.hi-wrap { padding: 12px 16px; }
.hi-head { display: flex; align-items: center; gap: 12px; font-weight: 700; color: #0f172a; margin-bottom: 12px; }
.hi-head .q-filter { margin-left: auto; max-width: 320px; }
.hi-list { position: relative; }
.hi-list::before { content: ''; position: absolute; left: 128px; top: 4px; bottom: 4px; width: 2px; background: #e2e8f0; }
.hi-row { display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; position: relative; }
.hi-row.hi-jump { cursor: pointer; border-radius: 6px; }
.hi-row.hi-jump:hover { background: #f1f5f9; }
.hi-time { width: 118px; flex: none; text-align: right; font-size: 11px; color: #64748b; font-variant-numeric: tabular-nums; padding-top: 2px; }
.hi-dot { width: 11px; height: 11px; border-radius: 50%; flex: none; margin-top: 3px; z-index: 1; box-shadow: 0 0 0 2px #fff; }
.hi-body { flex: 1; min-width: 0; }
.hi-line1 { display: flex; align-items: center; gap: 7px; }
.hi-kind { color: #fff; font-size: 10px; font-weight: 700; padding: 1px 7px; border-radius: 9px; flex: none; }
.hi-what { color: #1e293b; font-size: 13px; }
.hi-go { color: #2563eb; font-size: 11px; margin-left: auto; flex: none; }
.hi-line2 { font-size: 11px; color: #64748b; margin-top: 2px; }
.hi-who { color: #334155; font-weight: 600; }
.hi-why { color: #475569; }
.hi-deliv { color: #0891b2; }
.hi-rev { color: #94a3b8; font-family: monospace; font-size: 10px; }
.q-acts { margin-top: 5px; display: flex; gap: 6px; }
.q-ok, .q-no { font-size: 11px; padding: 3px 10px; border-radius: 6px; border: 1px solid; cursor: pointer; }
.q-ok { background: #fee2e2; border-color: #dc2626; color: #991b1b; }
.q-no { background: #dcfce7; border-color: #16a34a; color: #166534; }
.q-focus { animation: qflash 0.6s ease-in-out 4; }
@keyframes qflash { 0%,100% { stroke-width: 3px; opacity: 1; } 50% { stroke-width: 8px; opacity: 0.5; } }
.af-cmt.ai .af-cmt-tgt { color: #e11d48; }

/* 폴더 선택(연결 폴더 결정) */
.folder-path-input { width: 100%; padding: 11px 13px; border: 1px solid #cbd5e1; border-radius: 8px; font-size: 14px; margin-bottom: 10px; box-sizing: border-box; }
.folder-recent { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; max-height: 180px; overflow: auto; }
.recent-chip { text-align: left; padding: 7px 10px; border: 1px solid #e2e8f0; border-radius: 7px; background: #f8fafc; color: #334155; cursor: pointer; font-size: 12px; word-break: break-all; }
.recent-chip:hover { background: #eef2f7; border-color: #94a3b8; }
.recent-empty { color: #94a3b8; font-size: 12px; }
/* ★캐싱한 최근 폴더 = 칩 + 우측 ✕ 삭제 */
.recent-chip-wrap { display: flex; align-items: stretch; gap: 4px; }
.recent-chip-wrap .recent-chip { flex: 1; min-width: 0; }
.recent-del { flex: 0 0 auto; border: 1px solid #e2e8f0; border-radius: 7px; background: #fff; color: #94a3b8; cursor: pointer; font-size: 12px; padding: 0 9px; }
.recent-del:hover { background: #fef2f2; border-color: #fca5a5; color: #dc2626; }
.cmt-assign { margin-top: 5px; font-size: 11px; padding: 2px 8px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #2563eb; cursor: pointer; }
.cmt-assign:hover { background: #eff6ff; }

/* OCR 텍스트 검색 입력(svgpick) — OCR은 벡터와 동일 픽 엔티티로 흡수(별도 오버레이·점선박스 없음) */
.pk-ocr-search { font-size: 12px; padding: 3px 8px; border: 1px solid #cbd5e1; border-radius: 6px; margin: 0 8px; width: 190px; }

/* 상단바 시스템 뷰 진입점 (2) */
.sysbar { display: flex; gap: 6px; align-items: center; }
.sysbtn { font-size: 12px; padding: 5px 11px; border: 1px solid #cbd5e1; border-radius: 7px; background: #fff; color: #334155; cursor: pointer; white-space: nowrap; }
.sysbtn:hover { background: #f1f5f9; border-color: #94a3b8; }

/* Comments 단일 스트림 (4) — 경량 토글 하나 + AI 카드 */
.cmt-bar { display: flex; align-items: center; gap: 8px; padding: 6px 8px; position: sticky; top: 0; background: #fff; z-index: 2; border-bottom: 1px solid #eef2f7; font-size: 12px; }
.cmt-toggle { color: #475569; cursor: pointer; user-select: none; display: flex; align-items: center; gap: 4px; }
.who-h { font-weight: 700; color: #334155; font-size: 12px; }
.ai-group { display: flex; align-items: center; color: #e11d48; }
.ai-actions { margin-left: auto; display: flex; gap: 5px; }
.ai-actions button { font-size: 10px; padding: 2px 8px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; cursor: pointer; color: #334155; }
.ai-actions button:hover { background: #f1f5f9; }
.ai-badge { font-size: 10px; font-weight: 800; color: #e11d48; background: #ffe4e6; padding: 1px 7px; border-radius: 8px; }
.ai-row { display: flex; gap: 8px; margin-top: 5px; }
.ai-row .q-thumb { width: 66px; height: 66px; }
.ai-main { flex: 1; min-width: 0; }
.ai-stmt { color: #1e293b; line-height: 1.45; font-size: 12px; }
.ai-file { display: block; margin: 4px 0 2px; color: #e11d48; font-size: 11px; cursor: pointer; }
.ai-file:hover { text-decoration: underline; }

/* ★진행 스피너·점 순환(정적 텍스트 금지) + 마크다운 렌더 스타일 */
.af-spin{display:inline-block;width:12px;height:12px;border:2px solid #cbd5e1;border-top-color:#2563eb;border-radius:50%;animation:af-spin 0.7s linear infinite;vertical-align:middle}
@keyframes af-spin{to{transform:rotate(360deg)}}
.af-dots::after{content:'';animation:af-dots 1.2s steps(4,end) infinite}
@keyframes af-dots{0%{content:''}25%{content:'.'}50%{content:'..'}75%{content:'...'}}
.af-stage{color:#334155;font-weight:600}
.af-tools{margin-top:3px;font-size:11px;color:#64748b}
/* ★중간 정지 버튼 + 실시간 근거 내레이션 */
.ag-stop{border:1px solid #fecaca;background:#fff;color:#dc2626;border-radius:6px;font-size:11px;padding:1px 8px;cursor:pointer;margin-left:8px;font-weight:600}
.ag-stop:hover{background:#fef2f2}
.ag-stop:disabled{opacity:.5;cursor:default}
.ag-narr{margin:2px 0 4px}
.ag-narr-line{color:#334155;font-size:12px;line-height:1.55;padding:4px 9px;border-left:3px solid #93c5fd;background:#f8fafc;border-radius:0 5px 5px 0;margin:4px 0}
.ag-md-tbl{border-collapse:collapse;margin:6px 0;font-size:12px;width:100%}
.ag-md-tbl th,.ag-md-tbl td{border:1px solid #e2e8f0;padding:3px 8px;text-align:left}
.ag-md-tbl th{background:#f1f5f9;font-weight:600}
.ag-md-h{margin:8px 0 4px;font-weight:700;line-height:1.3}
h1.ag-md-h{font-size:16px}h2.ag-md-h{font-size:15px}h3.ag-md-h{font-size:14px}h4.ag-md-h{font-size:13px}
.ag-md-ul,.ag-md-ol{margin:4px 0 4px 18px}.ag-md-ul li,.ag-md-ol li{margin:2px 0}
.message-text code{background:#f1f5f9;padding:1px 4px;border-radius:3px;font-size:12px}
/* ★코멘트 패널(좁은 폭) 마크다운 — pre-wrap 해제(블록 빈 줄 방지)·표 가로 스크롤·헤더 축소 */
.af-cmt-t.ag-md{white-space:normal;word-break:break-word}
.af-cmt-t.ag-md>div{margin:2px 0}
.af-cmt-t.ag-md .ag-md-tbl{display:block;overflow-x:auto;font-size:11px;white-space:nowrap}
.af-cmt-t.ag-md .ag-md-h{margin:6px 0 3px}
.af-cmt-t.ag-md h1.ag-md-h,.af-cmt-t.ag-md h2.ag-md-h,.af-cmt-t.ag-md h3.ag-md-h{font-size:13px}
.af-cmt-t.ag-md code{background:#f1f5f9;padding:0 3px;border-radius:3px;font-size:11px;word-break:break-all}
.af-cmt-t.ag-md a.af-deeplink{word-break:break-all}
.ag-md-code{background:#0d1117;color:#c9d1d9;padding:8px;border-radius:5px;font-size:12px;overflow:auto;margin:6px 0}

/* ★리사이즈 splitter(VS Code식) — 겹침 0, 호버/드래그 시 파란선 */
.af-split{flex:0 0 8px;cursor:col-resize;background:transparent;position:relative;z-index:1002;transition:background .1s}
.af-split:hover,.af-split.drag{background:#2563eb}
.af-split::after{content:'';position:absolute;left:2px;top:0;width:2px;height:100%;background:#e2e8f0}
.af-split:hover::after,.af-split.drag::after{background:#2563eb}
/* ★AF_BUNDLE 상태바 — 지금 보는 빌드 확인 */
#af-statusbar{padding:3px 10px;font-size:11px;color:#64748b;border-top:1px solid #e2e8f0;background:#f8fafc;display:flex;gap:10px;align-items:center}
#af-statusbar b{color:#334155;font-weight:600}

.cell-link{color:#1155cc;text-decoration:underline;cursor:pointer}

/* ★조건값 딥링크가 착지한 PDF 페이지 — 검수자가 '여기다'를 즉시 알게 테두리 점멸(2.6s). */
.pid-page.af-pagehit, .pk-pagewrap.af-pagehit { outline: 3px solid #e11d48; outline-offset: -3px; animation: af-pagehit-blink 0.6s ease-in-out 3; }
@keyframes af-pagehit-blink { 0%,100% { outline-color: #e11d48; } 50% { outline-color: rgba(225,29,72,0.15); } }

/* Cloud project entry; existing viewer layout remains unchanged. */
.project-manager { max-width: 760px; margin: 32px auto; }
.project-create { display: flex; gap: 8px; }
.project-create input { min-width: 0; flex: 1; }
.project-file-list { max-height: 35vh; overflow: auto; list-style: none; }
.project-file-list li { padding: 9px 0; border-bottom: 1px solid #e5e7eb; overflow-wrap: anywhere; }
[hidden] { display: none !important; }