*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Malgun Gothic,Segoe UI,sans-serif;color:#1f2430;background:#f4f5f7}.app-shell{display:grid;grid-template-columns:220px 1fr;grid-template-rows:48px 1fr;grid-template-areas:"header header" "sidebar main";height:100vh}.app-header{grid-area:header;display:flex;align-items:center;padding:0 20px;background:#1f2937;color:#fff;border-bottom:1px solid #111827}.app-header__title{font-size:15px;font-weight:600;letter-spacing:.02em}.app-header__user{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:13px}.app-header__username{color:#cbd3e0}.app-header__logout{padding:5px 12px;border:1px solid #4b5563;border-radius:4px;background:transparent;color:#e5e7eb;font-size:12px;cursor:pointer}.app-header__logout:hover{background:#374151}.app-loading{display:flex;align-items:center;justify-content:center;height:100vh;color:#6b7280;font-size:14px}.login-screen{display:flex;align-items:center;justify-content:center;height:100vh;background:#f4f5f7}.login-card{width:340px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:32px 28px;box-shadow:0 4px 16px #0f172a0f}.login-card__title{margin:0 0 4px;font-size:17px;font-weight:700;text-align:center}.login-card__subtitle{margin:0 0 24px;font-size:13px;color:#9ca3af;text-align:center}.login-field{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;font-size:13px;color:#4b5563}.login-field input{padding:9px 12px;border:1px solid #d1d5db;border-radius:4px;font-size:14px}.login-field input:focus{outline:none;border-color:#4f8ef7}.login-error{background:#fff1f0;border:1px solid #ffa39e;color:#a8071a;padding:8px 12px;border-radius:4px;font-size:12px;margin-bottom:16px}.login-submit{width:100%;padding:10px;font-size:14px;font-weight:600}.login-hint{margin:16px 0 0;font-size:11px;color:#b0b6c0;text-align:center}.app-sidebar{grid-area:sidebar;background:#262f3d;padding:12px 0;overflow-y:auto}.app-sidebar__list{list-style:none;margin:0;padding:0}.app-sidebar__link{display:block;padding:12px 20px;color:#cbd3e0;text-decoration:none;font-size:14px;line-height:1.4;border-left:3px solid transparent}.app-sidebar__link:hover{background:#303b4d;color:#fff}.app-sidebar__link--active{background:#303b4d;color:#fff;border-left-color:#4f8ef7;font-weight:600}.app-main{grid-area:main;overflow-y:auto;padding:24px 28px}.page__title{margin:0 0 16px;font-size:20px;font-weight:700}.page__placeholder{color:#6b7280;font-size:14px;margin-bottom:20px}.uploader{display:flex;align-items:stretch;gap:12px;margin-bottom:20px}.dropzone{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;height:88px;border:2px dashed #c3cad6;border-radius:6px;background:#fff;color:#4b5563;font-size:14px;cursor:pointer;text-align:center;padding:0 16px}.dropzone:hover{border-color:#4f8ef7;color:#1f2937}.dropzone--drag{border-color:#1a56db;background:#eff6ff;color:#1a56db}.btn--convert{flex-shrink:0;width:120px;font-size:14px;font-weight:600}.btn--convert:disabled{background:#c3cad6;border-color:#c3cad6;color:#fff;cursor:not-allowed}.alert{padding:10px 14px;border-radius:4px;font-size:13px;margin-bottom:16px}.alert--error{background:#fff1f0;border:1px solid #ffa39e;color:#a8071a}.alert--warning{background:#fffbe6;border:1px solid #ffe58f;color:#874d00;margin:0 0 16px;padding-left:28px}.result-panel{background:#fff;border:1px solid #e5e7eb;border-radius:6px;padding:16px 20px}.result-panel__summary{display:flex;align-items:center;gap:12px;margin-bottom:12px;font-size:13px;color:#374151}.badge{background:#e8f0fe;color:#1a56db;padding:2px 10px;border-radius:999px;font-weight:600;font-size:12px}.result-panel__filename{color:#9ca3af}.result-panel__actions{display:flex;gap:8px;margin-bottom:16px}.btn{padding:8px 16px;border:1px solid #d1d5db;border-radius:4px;background:#fff;color:#374151;font-size:13px;cursor:pointer}.btn:hover{background:#f3f4f6}.btn--primary{background:#1a56db;border-color:#1a56db;color:#fff}.btn--primary:hover{background:#1746b3}.preview-table-wrap{max-height:480px;overflow:auto;border:1px solid #e5e7eb;border-radius:4px}.preview-table{border-collapse:collapse;width:100%;font-size:12px;white-space:nowrap}.preview-table th,.preview-table td{border-bottom:1px solid #f0f1f3;padding:6px 10px;text-align:left}.preview-table thead th{position:sticky;top:0;background:#f9fafb;color:#374151;font-weight:600;border-bottom:1px solid #e5e7eb}.filter-bar{display:flex;align-items:center;gap:8px;margin-bottom:16px;flex-wrap:wrap}.filter-bar select,.filter-bar input,.import-panel__row select,.import-panel__row input[type=text]{padding:7px 10px;border:1px solid #d1d5db;border-radius:4px;font-size:13px}.filter-bar__spacer{flex:1}.btn--sm{padding:4px 10px;font-size:12px}.btn--danger{color:#cf1322;border-color:#ffa39e}.btn--danger:hover{background:#fff1f0}.row-actions{display:flex;gap:6px;white-space:nowrap}.pagination{display:flex;align-items:center;gap:12px;justify-content:center;padding:12px 0 4px;font-size:13px;color:#374151}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a73;display:flex;align-items:center;justify-content:center;z-index:50}.modal{background:#fff;border-radius:8px;padding:20px 24px;width:560px;max-width:92vw;max-height:88vh;overflow-y:auto}.modal__title{margin:0 0 16px;font-size:16px;font-weight:700}.modal__actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#4b5563}.form-grid input{padding:7px 10px;border:1px solid #d1d5db;border-radius:4px;font-size:13px;color:#111827}.form-grid__wide{grid-column:1 / -1}.import-panel{background:#fff;border:1px solid #e5e7eb;border-radius:6px;padding:16px 20px;margin-bottom:20px}.import-panel__hint{margin:10px 0 0;font-size:12px;color:#6b7280}.import-panel__row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.import-panel__row input[type=text]{flex:1;min-width:200px}.import-preview{margin-top:16px}.import-preview__summary{display:flex;gap:8px;margin-bottom:12px}.badge--new{background:#e6f7e6;color:#237804}.badge--changed{background:#fff7e6;color:#ad6800}.badge--dup{background:#f0f0f0;color:#595959}.import-row--new td:first-child{color:#237804;font-weight:600}.import-row--changed td:first-child{color:#ad6800;font-weight:600}.import-row--duplicate{color:#a8071a;background:#fff1f0}.import-row--duplicate td:first-child{font-weight:600}.sortable-th{cursor:pointer;-webkit-user-select:none;user-select:none}.sortable-th:hover{color:#1a56db}.sort-indicator{margin-left:4px;color:#1a56db}.import-preview__apply-changed{display:flex;align-items:center;gap:6px;font-size:13px;margin-top:10px;color:#374151}