:root{--primary:#168eb8;--deep:#123d54;--soft:#eef8fc;--line:#cfe3ed;--ok:#0a9b69;--danger:#c73d32}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;font-family:Inter,"Segoe UI",Arial,sans-serif;color:#183f52;background:radial-gradient(circle at top left,#d9f2fa,transparent 35%),linear-gradient(145deg,#f7fbfd,#e7f3f8);padding:28px}
.setup-shell{width:min(1040px,100%);margin:auto}
.setup-shell>header{display:flex;align-items:center;gap:16px;margin-bottom:20px}
.brand-mark{display:grid;place-items:center;min-width:64px;height:64px;padding:0 10px;border-radius:18px;color:#fff;font-weight:900;background:linear-gradient(135deg,var(--deep),var(--primary));box-shadow:0 10px 25px #168eb835}
.setup-shell h1,.setup-shell h2{margin:0 0 7px}
.setup-shell p{margin:0;color:#607b89;line-height:1.55}
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:22px 0}
.step{display:flex;align-items:center;gap:8px;padding:10px;border-radius:12px;background:#fff8;border:1px solid var(--line);color:#78909c}
.step b{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#e8f1f5}
.step.active{color:var(--deep);background:#fff;border-color:var(--primary);box-shadow:0 6px 18px #254d5e18}
.step.active b,.step.done b{background:var(--primary);color:#fff}
.step.done{color:var(--ok)}
.card{padding:26px;border:1px solid #d8e9f0;border-radius:18px;background:#fffffff2;box-shadow:0 18px 45px #21495a18}
.card>p{margin-bottom:20px}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.wide{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:7px;font-weight:700}
input,textarea{width:100%;border:1px solid #c8dce6;border-radius:10px;padding:12px 13px;font:inherit;color:#173d50;background:#fff;outline:none;transition:.18s}
input:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #168eb820}
small{font-weight:400;color:#728b98}
.btn{display:inline-flex;justify-content:center;align-items:center;margin-top:20px;padding:12px 20px;border:0;border-radius:10px;text-decoration:none;font-weight:800;cursor:pointer}
.primary{color:#fff;background:linear-gradient(135deg,var(--deep),var(--primary));box-shadow:0 7px 18px #168eb832}
.choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.choice{position:relative;padding:18px;border:2px solid var(--line);border-radius:14px;background:#fff;cursor:pointer}
.choice.selected{border-color:var(--primary);background:var(--soft)}
.choice input[type=radio]{position:absolute;right:14px;top:14px;width:auto}
.choice b,.choice span{display:block}
.choice span{margin:8px 0;color:#637f8c;font-weight:400;line-height:1.5}
.choice input[type=file]{margin-top:10px;padding:8px;background:#fff}
aside{margin-top:15px;padding:12px;border-radius:10px;background:#f1f7fa;color:#52717f}
code{word-break:break-all}
.settings-list{display:grid;gap:11px;max-height:56vh;overflow:auto;padding-right:8px}
.settings-list label{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:13px;border:1px solid var(--line);border-radius:12px}
.settings-list small{display:block;margin-top:5px}
.alert{padding:12px 14px;margin-bottom:18px;border-radius:10px}
.error{color:#8f251e;background:#ffefed;border:1px solid #f4b8b2}
.success{color:#08734f;background:#e8faf4;border:1px solid #a8e4cf}
.finish{text-align:center;padding:30px}
.finish-icon{display:grid;place-items:center;width:75px;height:75px;margin:0 auto 18px;border-radius:50%;font-size:38px;color:#fff;background:var(--ok)}
footer{text-align:center;padding:16px;color:#78909b;font-size:12px}
.setup-locked{text-align:center;margin-top:10vh;padding:35px;border-radius:18px;background:#fff;box-shadow:0 18px 45px #21495a18}
.setup-locked .brand-mark{margin:0 auto 18px;background:var(--ok)}
@media(max-width:760px){body{padding:14px}
.setup-shell>header{align-items:flex-start}
.steps{grid-template-columns:repeat(5,42px);justify-content:space-between}
.step{justify-content:center;padding:7px}
.step span{display:none}
.card{padding:18px}
.grid,.choice-grid,.settings-list label{grid-template-columns:1fr}
.wide{grid-column:auto}
.settings-list{max-height:none}
.btn{width:100%}
}
@media(prefers-reduced-motion:no-preference){.card{animation:rise .3s ease-out}
@keyframes rise{from{opacity:0;transform:translateY(8px)}
to{opacity:1;transform:none}
}
}
.overall-progress{margin:-10px 0 18px;padding:13px 15px;border:1px solid var(--line);border-radius:13px;background:#ffffffd9;box-shadow:0 6px 18px #21495a0d}.progress-caption{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:8px;font-size:13px}.progress-caption span{color:#678391}.progress-track,.processing-track,.complete-progress{height:10px;border-radius:999px;background:#dcecf3;overflow:hidden}.progress-track i,.complete-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--deep),var(--primary),#22b8ae);box-shadow:0 0 12px #168eb855;transition:width .45s ease}.complete-progress{width:min(420px,100%);margin:14px auto 18px}.complete-progress i{width:100%}.processing[hidden]{display:none}.processing{position:fixed;inset:0;z-index:999999;display:grid;place-items:center;padding:20px;background:#0c2e3db8;backdrop-filter:blur(4px)}.processing-box{display:flex;flex-direction:column;align-items:center;width:min(410px,100%);padding:28px;border-radius:17px;background:#fff;box-shadow:0 24px 60px #09233155;text-align:center}.processing-box b{margin:13px 0 5px;font-size:17px}.processing-box span{color:#69838f;font-size:13px}.spinner{width:48px;height:48px;border:5px solid #dbeaf0;border-top-color:var(--primary);border-radius:50%;animation:setupSpin .8s linear infinite}.processing-track{width:100%;margin-top:19px}.processing-track i{display:block;width:38%;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--deep),var(--primary));animation:setupProgress 1.2s ease-in-out infinite}.btn:disabled{opacity:.72;cursor:wait}@keyframes setupSpin{to{transform:rotate(360deg)}}@keyframes setupProgress{0%{transform:translateX(-110%)}100%{transform:translateX(300%)}}@media(max-width:560px){.progress-caption{font-size:12px}.overall-progress{margin-top:-12px}.processing-box{padding:23px 18px}}
.upload-warning{margin-top:14px;padding:12px 14px;border:1px solid #efc48c;border-radius:10px;background:#fff8eb;color:#83540d;line-height:1.5;font-size:13px}.upload-warning b{color:#6c4100}.processing-percent{margin-top:15px;font-size:28px;font-weight:900;color:var(--deep);font-variant-numeric:tabular-nums}.processing-detail{display:block;min-height:18px;margin-top:8px;color:#78909b;font-size:12px;line-height:1.4}.processing-track.determinate i{width:0;animation:none;transform:none;transition:width .22s ease}.processing-track.error i{background:var(--danger)}.spinner.success,.spinner.error{position:relative;animation:none;border-color:#dbeaf0}.spinner.success{border-color:#bce6d7;background:#ecfbf5}.spinner.error{border-color:#f2c0bc;background:#fff1ef}.spinner.success:after,.spinner.error:after{position:absolute;inset:0;display:grid;place-items:center;font-size:24px;font-weight:900}.spinner.success:after{content:'✓';color:var(--ok)}.spinner.error:after{content:'×';color:var(--danger)}.processing-close{margin-top:16px;background:#eef5f8;color:var(--deep);box-shadow:none}.processing-close:hover{background:#e2eef3}
