:root { --navy:#12304a; --ink:#17384b; --muted:#6d828e; --line:#dce5e9; --mint:#2f9989; --bg:#f4f7f8; }
* { box-sizing:border-box; }
html, body { min-height:100%; }
body { margin:0; color:var(--ink); background:var(--bg); font-family:Pretendard,"Noto Sans KR",Arial,sans-serif; }
button, input, select, textarea { font:inherit; }
.portal-topbar { display:flex; justify-content:space-between; align-items:center; min-height:58px; padding:0 34px; border-bottom:1px solid var(--line); background:#fff; color:#6d808a; font-size:12px; }
.portal-topbar p { margin:0; font-weight:800; }.portal-topbar p span { margin:0 8px; color:#b0bec6; }
.import-container { width:min(1120px, calc(100% - 44px)); margin:0 auto; padding:38px 0 70px; }
.page-header { display:flex; justify-content:space-between; gap:24px; align-items:flex-start; margin-bottom:24px; }
.eyebrow { margin:0 0 8px; color:var(--mint); font-size:10px; font-weight:900; letter-spacing:.16em; }
.page-header h1 { margin:0; color:var(--navy); font-size:30px; letter-spacing:-.04em; }.page-header p:not(.eyebrow) { margin:9px 0 0; color:var(--muted); font-size:13px; }
.bookstack-link,.secondary-button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:0 14px; border:1px solid #cfdae0; border-radius:9px; color:#31546a; background:#fff; font-size:12px; font-weight:800; text-decoration:none; cursor:pointer; }
.page-message { margin-bottom:16px; padding:13px 15px; border:1px solid #e7bdb7; border-radius:10px; color:#934a42; background:#fff6f4; font-size:12px; }.page-message.is-success { border-color:#a7d6cc; color:#26705f; background:#effaf7; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:0 0 18px; padding:0; list-style:none; }
.steps li { display:flex; align-items:center; gap:9px; min-height:48px; padding:0 14px; border:1px solid var(--line); border-radius:10px; color:#82939c; background:#fff; font-size:11px; font-weight:800; }.steps b { display:grid; place-items:center; width:25px; height:25px; border-radius:7px; color:#66808e; background:#edf2f4; }.steps li.is-active { color:var(--navy); border-color:#9bcfc5; background:#f4fbf9; }.steps li.is-active b { color:#fff; background:var(--mint); }
.panel { margin-bottom:16px; padding:22px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 9px 28px rgba(28,59,76,.05); }
.section-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; margin-bottom:18px; }.section-heading h2,.analysis-status h2,.complete-panel h2 { margin:0; color:var(--navy); font-size:17px; }.section-heading p,.analysis-status p,.complete-panel p { margin:6px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }
.model-field { display:grid; gap:5px; width:min(330px,42%); }.model-field span,label>span { color:#526d7d; font-size:10px; font-weight:850; }.model-field select,.classification-card select,.title-field input { width:100%; min-height:40px; padding:0 11px; border:1px solid #d2dde2; border-radius:8px; color:#21455a; background:#fff; outline:none; }
.drop-zone { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:190px; padding:24px; border:2px dashed #b8cbd3; border-radius:12px; color:#4f6c7a; background:#f9fbfc; cursor:pointer; transition:.15s; text-align:center; }.drop-zone:hover,.drop-zone.is-dragging { border-color:var(--mint); background:#effaf7; }.drop-zone strong { margin:12px 0 6px; font-size:14px; }.drop-zone small { color:#84969f; font-size:10px; }.drop-icon { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; color:#fff; background:var(--navy); font-size:17px; font-weight:900; }
.selected-file { display:flex; justify-content:space-between; align-items:center; margin-top:12px; padding:10px 12px; border-radius:8px; background:#eef5f6; font-size:11px; font-weight:750; }.selected-file button { border:0; color:#a54d43; background:transparent; cursor:pointer; font-size:10px; font-weight:850; }
.primary-button { min-height:43px; padding:0 20px; border:0; border-radius:9px; color:#fff; background:var(--navy); font-size:12px; font-weight:850; cursor:pointer; }.primary-button:disabled { cursor:not-allowed; opacity:.45; }.upload-panel>.primary-button { display:block; min-width:180px; margin:16px 0 0 auto; }
.analysis-status,.complete-panel { display:flex; align-items:center; gap:15px; }.spinner { width:34px; height:34px; border:4px solid #d8e5e8; border-top-color:var(--mint); border-radius:50%; animation:spin .8s linear infinite; }@keyframes spin{to{transform:rotate(360deg)}}
.confidence-badge { padding:7px 10px; border-radius:999px; color:#287563; background:#e9f8f4; font-size:10px; font-weight:900; }
.classification-card { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; padding:15px; border:1px solid #dce7e9; border-radius:11px; background:#f8fbfb; }.classification-card label,.title-field { display:grid; gap:6px; }.title-field { margin-top:14px; }
.analysis-meta { display:grid; grid-template-columns:1fr 1.4fr; gap:10px; margin:14px 0; }.analysis-meta p { margin:0; padding:12px; border-left:3px solid #a9cec6; background:#f5f9fa; }.analysis-meta strong,.analysis-meta span { display:block; }.analysis-meta strong { margin-bottom:5px; font-size:10px; }.analysis-meta span { color:#536d7b; font-size:11px; line-height:1.55; }
.warning-list { margin:12px 0; padding:11px 13px; border-radius:8px; color:#7d6327; background:#fff8e8; font-size:10px; line-height:1.6; }.warning-list p { margin:0; }
.similar-pages { margin:12px 0; padding:12px; border:1px solid #e1e7ea; border-radius:9px; font-size:10px; }.similar-pages ul { margin:7px 0 0; padding-left:18px; color:#59717f; }
.editor-tabs { display:flex; margin-top:18px; border-bottom:1px solid var(--line); }.editor-tabs button { padding:9px 14px; border:0; border-bottom:2px solid transparent; color:#6f828c; background:transparent; cursor:pointer; font-size:11px; font-weight:850; }.editor-tabs button.is-active { color:var(--navy); border-bottom-color:var(--mint); }
.markdown-editor { width:100%; min-height:480px; padding:18px; border:1px solid var(--line); border-top:0; border-radius:0 0 9px 9px; color:#253f4e; background:#fbfcfd; resize:vertical; outline:none; font:12px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace; }.markdown-preview { min-height:480px; padding:24px; border:1px solid var(--line); border-top:0; border-radius:0 0 9px 9px; color:#263f4c; line-height:1.75; }.markdown-preview h2,.markdown-preview h3 { color:var(--navy); }.markdown-preview code { padding:2px 4px; border-radius:4px; background:#edf2f4; }
.result-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:16px; }.write-disabled-help { margin:9px 0 0; color:#8a682a; font-size:10px; text-align:right; }.complete-panel>span { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:#fff; background:var(--mint); font-size:20px; }.complete-panel a { display:inline-block; margin-top:8px; color:#237865; font-size:11px; font-weight:850; }
[hidden] { display:none !important; }
@media(max-width:760px){.import-container{width:min(100% - 24px,1120px);padding-top:24px}.page-header,.section-heading{display:block}.bookstack-link{margin-top:14px}.model-field{width:100%;margin-top:14px}.classification-card,.analysis-meta{grid-template-columns:1fr}.panel{padding:16px}.markdown-editor,.markdown-preview{min-height:380px}}