:root{
  --navy:#102b5c;
  --blue:#174ca6;
  --green:#15966c;
  --red:#df3f4d;
  --gold:#d9a72e;
  --ink:#132440;
  --muted:#6f7b8e;
  --line:#e2e7ee;
  --bg:#f4f6f9;
  --soft-blue:#edf3fd;
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,Segoe UI,Arial,sans-serif}
button,select,input{font:inherit}
button,a,label,select{ -webkit-tap-highlight-color:transparent}

.topbar{height:72px;padding:0 32px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:10}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}
.brand>span:last-child b,.brand small{display:block}
.brand small{margin-top:2px;color:var(--muted);font-size:11px}
.logo{width:38px;height:38px;border-radius:11px;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:800}
.top-actions,.profile,.back-link{display:flex;align-items:center}
.top-actions{gap:18px}
.back-link{gap:7px;color:var(--navy);font-size:12px;font-weight:700;text-decoration:none;padding:8px 11px;border-radius:8px}
.back-link:hover{background:var(--soft-blue)}
.profile{border:0;background:transparent;gap:8px;color:var(--ink);cursor:pointer}
.profile span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#e2eafa;color:var(--navy);font-size:11px;font-weight:800}

.page-shell{width:min(1240px,calc(100% - 48px));margin:0 auto;padding:28px 0 42px}
.page-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.page-heading p{margin:0 0 7px;color:var(--blue);font-size:10px;letter-spacing:1.4px;font-weight:800}
.page-heading h1{margin:0 0 5px;font-size:27px;letter-spacing:-.7px}
.page-heading>div>span{color:var(--muted);font-size:12px}
.safe-badge{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 1px 2px #102b5c08}
.safe-badge i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#e8f7f1;color:var(--green);font-style:normal;font-weight:900}
.safe-badge b,.safe-badge small{display:block}
.safe-badge b{font-size:11px}.safe-badge small{color:var(--muted);font-size:9px;margin-top:2px}

.steps{margin:0 0 18px;padding:0;list-style:none;background:#fff;border:1px solid var(--line);border-radius:12px;display:grid;grid-template-columns:repeat(3,1fr);overflow:hidden}
.steps li{position:relative;display:flex;align-items:center;gap:10px;padding:13px 18px;color:#9aa4b2}
.steps li+li{border-left:1px solid var(--line)}
.steps li>span{width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:#eef1f5;color:#8994a5;font-size:10px;font-weight:800}
.steps b,.steps small{display:block}.steps b{font-size:10px}.steps small{font-size:8px;margin-top:2px}
.steps li.active{color:var(--navy);background:#fbfcff}
.steps li.active>span{background:var(--navy);color:#fff}

.import-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.72fr);gap:14px;align-items:start}
.import-card,.info-card,.history-card{background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:0 1px 2px #102b5c08}
.import-card{padding:20px}
.card-title{display:flex;align-items:center;justify-content:space-between;padding-bottom:15px;margin-bottom:17px;border-bottom:1px solid #edf0f4}
.card-title>div{display:flex;align-items:center;gap:10px}
.card-title h2,.card-title p{margin:0}.card-title h2{color:var(--navy);font-size:12px;text-transform:uppercase;letter-spacing:.45px}.card-title p{color:var(--muted);font-size:9px;margin-top:3px}
.section-number{width:29px;height:29px;border-radius:8px;background:var(--soft-blue);color:var(--blue);display:grid;place-items:center;font-size:9px;font-weight:800}
.status-tag{padding:5px 7px;background:#f1f3f6;color:#8490a1;border-radius:5px;font-size:8px;font-weight:800}

.field{margin-bottom:20px}
.field>label,.field-heading label{display:block;color:var(--navy);font-size:10px;font-weight:800;margin-bottom:7px}
.field label em{color:var(--red);font-style:normal}
.select-wrap{position:relative}
.select-wrap::after{content:"⌄";position:absolute;right:14px;top:50%;transform:translateY(-55%);color:var(--muted);pointer-events:none}
select{width:100%;appearance:none;border:1px solid #d8dee7;border-radius:9px;background:#fbfcfe;color:var(--ink);padding:12px 38px 12px 13px;font-size:11px;outline:0;cursor:pointer}
select:focus{border-color:var(--blue);box-shadow:0 0 0 3px #174ca619}
.field-help{display:block;color:var(--muted);font-size:8px;margin-top:6px}
.field-heading{display:flex;align-items:center;justify-content:space-between}
.template-button{border:0;background:transparent;color:var(--blue);font-size:9px;font-weight:800;cursor:pointer}
.template-button:disabled{color:#aeb6c2;cursor:not-allowed}

.drop-zone{min-height:186px;border:1.5px dashed #b7c4d7;border-radius:11px;background:#f9fbfe;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;cursor:pointer;transition:.2s ease}
.drop-zone:hover,.drop-zone.dragging,.drop-zone:focus{border-color:var(--blue);background:#f3f7fd;outline:0}
.upload-icon{width:46px;height:46px;margin-bottom:12px;border-radius:13px;display:grid;place-items:center;background:#e8effa;color:var(--blue);font-size:22px;font-weight:500}
.drop-zone strong{color:var(--navy);font-size:12px}.drop-zone>span:not(.upload-icon){color:var(--muted);font-size:10px;margin-top:4px}
.drop-zone small{color:#9aa4b2;font-size:8px;margin-top:12px}

.selected-file{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:11px;border:1px solid #cfe1da;background:#f8fcfa;border-radius:10px;padding:11px 12px}
.file-icon{width:38px;height:38px;border-radius:8px;display:grid;place-items:center;background:#e2f3ec;color:var(--green);font-size:9px;font-weight:900}
.selected-file b,.selected-file small{display:block}.selected-file b{font-size:10px;overflow-wrap:anywhere}.selected-file small{color:var(--muted);font-size:8px;margin-top:3px}
.file-state{display:flex;align-items:center;gap:5px;color:var(--green);font-size:8px;font-weight:800}.file-state i{width:6px;height:6px;border-radius:50%;background:var(--green)}
.selected-file button{width:28px;height:28px;border:0;border-radius:7px;background:#edf2f0;color:#6a7784;cursor:pointer;font-size:18px}
.form-error{min-height:13px;color:var(--red);font-size:9px;margin:6px 0 0}

.import-options{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:0 0 20px}
.import-options label{display:flex;align-items:flex-start;gap:9px;padding:11px;border:1px solid var(--line);border-radius:9px;cursor:pointer}
.import-options input{margin:2px 0 0;accent-color:var(--blue)}
.import-options b,.import-options small{display:block}.import-options b{font-size:9px;color:var(--navy)}.import-options small{font-size:8px;color:var(--muted);margin-top:3px;line-height:1.35}

.progress-area{border:1px solid #dbe5f3;border-radius:9px;background:#f8faff;padding:12px;margin-bottom:18px}
.progress-area>div:first-child{display:flex;justify-content:space-between;font-size:9px;color:var(--navy)}
.progress-track{height:6px;background:#e3e9f1;border-radius:8px;margin:9px 0;overflow:hidden}
.progress-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--blue),var(--green));border-radius:8px;transition:width .25s ease}
.progress-area small{color:var(--muted);font-size:8px}

.form-actions{display:flex;justify-content:flex-end;gap:9px;padding-top:16px;border-top:1px solid #edf0f4}
.primary-button,.secondary-button{border-radius:9px;padding:10px 15px;font-size:10px;font-weight:800;cursor:pointer}
.secondary-button{border:1px solid var(--line);background:#fff;color:var(--muted)}
.primary-button{border:0;background:var(--navy);color:#fff}
.primary-button:hover:not(:disabled){background:var(--blue)}
.primary-button:disabled{background:#b9c2cf;cursor:not-allowed}

.side-column{display:grid;gap:14px}
.info-card{padding:17px;min-height:395px}
.card-title.compact{margin-bottom:13px}
.empty-structure{min-height:270px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px}
.empty-structure>span{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:#eef2f7;color:#8994a5;font-size:19px}
.empty-structure b{font-size:10px;color:var(--navy);margin-top:10px}.empty-structure p{max-width:230px;color:var(--muted);font-size:9px;line-height:1.55;margin:5px 0}
.structure-summary{display:flex;align-items:center;gap:10px;padding:9px;background:#f6f9fd;border-radius:9px;margin-bottom:10px}
.structure-summary>span{width:38px;height:38px;display:grid;place-items:center;border-radius:9px;background:var(--navy);color:#fff;font-size:9px;font-weight:900}
.structure-summary b,.structure-summary small{display:block}.structure-summary b{color:var(--navy);font-size:10px}.structure-summary small{color:var(--muted);font-size:8px;margin-top:3px}
.column-list{display:grid;gap:5px}
.column-list p{margin:0;display:flex;align-items:center;justify-content:space-between;padding:7px 8px;border-bottom:1px solid #edf0f4;font-size:8px;color:var(--muted)}
.column-list p b{color:var(--ink);font-size:8px}.column-list p em{font-style:normal;color:var(--red);font-size:7px;font-weight:800}
.structure-note{display:flex;gap:7px;color:var(--muted);font-size:8px;line-height:1.45;margin:11px 0 0}.structure-note i{flex:0 0 auto;width:16px;height:16px;display:grid;place-items:center;border-radius:50%;background:#e9f0fb;color:var(--blue);font-style:normal;font-weight:800}
.help-card{display:flex;gap:11px;padding:15px;background:#fffaf0;border:1px solid #efe2bd;border-radius:12px}
.help-icon{width:31px;height:31px;flex:0 0 auto;display:grid;place-items:center;border-radius:9px;background:#f5e8bd;color:#987014;font-weight:900}
.help-card b{font-size:9px;color:#715410}.help-card p{font-size:8px;color:#8b7951;line-height:1.5;margin:3px 0 0}

.history-card{margin-top:14px;padding:18px}
.filter-button{border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--muted);padding:7px 9px;font-size:8px;cursor:pointer}
.history-table{overflow-x:auto}
.history-row{min-width:830px;display:grid;grid-template-columns:1.55fr 1.1fr 1fr .65fr .75fr 30px;align-items:center;gap:12px;padding:10px 9px;border-bottom:1px solid #edf0f4;color:var(--muted);font-size:8px}
.history-head{padding-top:5px;color:var(--navy);font-weight:800;text-transform:uppercase;background:#f7f9fc;border-radius:7px}
.history-file{display:flex;align-items:center;gap:8px;color:var(--ink)}
.history-file i{width:29px;height:29px;display:grid;place-items:center;border-radius:6px;background:#e8f3ee;color:var(--green);font-size:7px;font-style:normal;font-weight:900}
.history-row em{display:inline-block;border-radius:20px;padding:5px 8px;font-size:7px;font-style:normal;font-weight:800}.history-row em.success{background:#e8f7f1;color:var(--green)}.history-row em.warning{background:#fff4d8;color:#9b7211}
.history-row button{border:0;background:transparent;color:#8994a5;cursor:pointer}

.toast{position:fixed;right:24px;bottom:24px;max-width:390px;display:flex;align-items:center;gap:11px;background:var(--navy);color:#fff;padding:13px 15px;border-radius:11px;box-shadow:0 16px 40px #102b5c3d;z-index:20}
.toast>span{width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#ffffff1c;color:#7ee0bb;font-weight:900}
.toast b,.toast small{display:block}.toast b{font-size:10px}.toast small{color:#cad5e7;font-size:8px;margin-top:3px;line-height:1.4}

[hidden]{display:none!important}

@media(max-width:900px){
  .import-grid{grid-template-columns:1fr}
  .info-card{min-height:auto}.empty-structure{min-height:190px}
}

@media(max-width:680px){
  .topbar{padding:0 16px}.profile b{display:none}
  .page-shell{width:calc(100% - 28px);padding-top:20px}
  .page-heading{align-items:flex-start}.safe-badge{display:none}
  .steps small{display:none}.steps li{padding:11px 9px}.steps li>span{width:23px;height:23px}
  .import-card,.history-card{padding:14px}.import-options{grid-template-columns:1fr}
  .field-heading{align-items:flex-start;gap:8px}.template-button{text-align:right}
  .selected-file{grid-template-columns:auto 1fr auto}.file-state{display:none}
  .toast{left:14px;right:14px;bottom:14px}
}

@media(max-width:430px){
  .back-link{font-size:0}.back-link span{font-size:18px}
  .page-heading h1{font-size:23px}.page-heading>div>span{font-size:10px}
  .steps li{gap:6px}.steps b{font-size:8px}
  .drop-zone{min-height:165px;padding:18px}
  .form-actions{display:grid;grid-template-columns:1fr 1fr}.primary-button,.secondary-button{width:100%}
}