:root { --ink:#132d3a; --muted:#60727c; --line:#dbe5e8; --paper:#fff; --bg:#f4f8f7; --accent:#0d8372; --accent-dark:#086657; --warning:#9c5b06; }
* { box-sizing:border-box; }
body { margin:0; font-family:Inter, ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:radial-gradient(circle at 84% -10%,#d7f4e8 0,transparent 28rem),var(--bg); }
.page { width:min(760px,calc(100% - 32px)); margin:64px auto 80px; }
header { margin-bottom:32px; }
.eyebrow { margin:0 0 8px; color:var(--accent); text-transform:uppercase; letter-spacing:.13em; font-size:.74rem; font-weight:750; }
h1 { margin:0; font-size:clamp(2rem,5vw,3.1rem); letter-spacing:-.045em; line-height:1.05; }
.intro { max-width:580px; font-size:1.05rem; color:var(--muted); line-height:1.6; }
.card { background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:25px; margin:17px 0; box-shadow:0 8px 26px rgba(18,54,65,.05); }
.section-heading { display:flex; align-items:flex-start; gap:13px; }
.section-heading h2 { font-size:1.05rem; margin:1px 0 4px; }
.section-heading p { margin:0; color:var(--muted); font-size:.9rem; }
.step { display:grid; place-items:center; flex:0 0 27px; width:27px; height:27px; border-radius:100%; background:#d9f2eb; color:var(--accent-dark); font-size:.84rem; font-weight:750; }
.dropzone { display:flex; min-height:150px; margin-top:22px; padding:24px; flex-direction:column; justify-content:center; align-items:center; border:1.5px dashed #a9c6c0; border-radius:12px; cursor:pointer; color:var(--muted); background:#fbfefd; transition:.16s ease; }
.dropzone:hover,.dropzone.dragging { border-color:var(--accent); background:#f0fbf7; }
.dropzone input { display:none; }
.dropzone strong { margin-top:6px; color:var(--ink); }.dropzone small { margin-top:3px; }.upload-icon { color:var(--accent); font-size:1.8rem; line-height:1; }
.details { margin-top:15px; padding:12px 14px; border-radius:9px; background:#f4f8f7; font-size:.9rem; }.details.error { color:#a63731; background:#fff0ef; }
.upload-status { margin:12px 0 0; color:var(--muted); font-size:.87rem; }.upload-status.error { color:#a63731; }
.form-grid { display:grid; grid-template-columns:1fr 1.7fr; gap:16px; margin-top:22px; }.form-grid label { color:var(--muted); font-size:.84rem; font-weight:650; }
select,input { display:block; width:100%; margin-top:6px; padding:10px 11px; color:var(--ink); border:1px solid #cbd9dc; border-radius:8px; background:#fff; font:inherit; font-size:.93rem; outline-color:var(--accent); }
.column-summary { display:flex; flex-wrap:wrap; gap:8px; margin-top:19px; }.pill { padding:5px 9px; border-radius:99px; background:#edf4f3; color:#38535b; font-size:.82rem; }.pill.target { background:#dff4ed; color:#076b5b; }.pill.error { background:#fff0ef; color:#ad3f38; }
.hint { margin:17px 0 0; color:var(--muted); font-size:.84rem; line-height:1.5; } code { padding:.1em .35em; border-radius:4px; background:#ecf2f2; color:#35515c; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.9em; }
.action-card { display:flex; flex-wrap:wrap; align-items:end; gap:19px; }.action-card .section-heading { flex:1 1 300px; }.actions { display:flex; flex-wrap:wrap; gap:10px; }.primary,.secondary { padding:12px 22px; border-radius:9px; font:inherit; font-weight:750; cursor:pointer; transition:.15s ease; }.primary { border:0; color:#fff; background:var(--accent); }.primary:hover:not(:disabled) { background:var(--accent-dark); transform:translateY(-1px); }.secondary { border:1px solid var(--accent); color:var(--accent-dark); background:#fff; }.secondary:hover:not(:disabled) { background:#edf9f6; }.primary:disabled,.secondary:disabled { cursor:not-allowed; opacity:.55; }
.progress-wrap { width:100%; }.progress { height:7px; overflow:hidden; background:#e4eded; border-radius:20px; }.progress span { display:block; width:0; height:100%; background:var(--accent); border-radius:inherit; transition:width .25s ease; }.progress-wrap p,.status { width:100%; margin:8px 0 0; color:var(--muted); font-size:.87rem; }.status.error { color:#a63731; }.status.success { color:#08705f; font-weight:650; }
@media (max-width:560px) { .page { margin-top:38px; }.card { padding:19px; }.form-grid { grid-template-columns:1fr; }.action-card { align-items:stretch; }.primary { width:100%; } }
