:root {
    color-scheme: light;
    font-family: "Microsoft YaHei", "Noto Sans SC", sans-serif;
    background: #eef3f1;
    color: #1b2b2a;
}

* { box-sizing: border-box; }
body { margin: 0; }
input, select, button { font: inherit; }

.setup-shell {
    width: min(920px, calc(100% - 32px));
    margin: 56px auto;
}

.brand { display: flex; gap: 14px; align-items: center; margin-bottom: 30px; }
.brand-mark { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 8px; background: #0f766e; color: #fff; font-weight: 700; }
.eyebrow { margin: 0 0 4px; color: #0f766e; font-size: 12px; font-weight: 700; letter-spacing: .08em; }
h1, h2 { margin: 0; font-weight: 600; letter-spacing: 0; }
h1 { font-size: 26px; }
h2 { font-size: 18px; }

.notice { margin: 16px 0; padding: 14px 16px; border-left: 4px solid; background: #fff; line-height: 1.65; }
.notice strong { display: block; }
.notice-warning { border-color: #c27a00; }
.notice-error { border-color: #b42318; color: #8e1e18; }

.setup-form, .ready-content { background: #fff; border: 1px solid #d8e2df; border-radius: 8px; }
.form-section { padding: 26px; border-bottom: 1px solid #d8e2df; }
.form-section:last-of-type { border-bottom: 0; }
.section-heading { display: flex; gap: 12px; align-items: baseline; margin-bottom: 18px; }
.section-heading .eyebrow { margin: 0; }
.fields { display: grid; gap: 16px; }
.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.full-width { grid-column: 1 / -1; }
label { display: grid; gap: 7px; color: #405451; font-size: 14px; }
input, select { min-width: 0; height: 40px; padding: 8px 10px; border: 1px solid #b9cbc6; border-radius: 5px; background: #fff; color: #1b2b2a; }
input:focus, select:focus { outline: 3px solid #a9dfd6; border-color: #0f766e; }
.checks { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 17px; }
.checks label { display: flex; align-items: center; gap: 8px; }
.checks input { width: 16px; height: 16px; }
.hint { margin: 14px 0 0; color: #5e6f6c; font-size: 13px; }
.primary-action { margin: 26px; padding: 11px 18px; border: 0; border-radius: 5px; background: #0f766e; color: #fff; cursor: pointer; }
.primary-action:disabled { cursor: not-allowed; opacity: .5; }
.ready-content { padding: 30px; line-height: 1.8; }
code { padding: 1px 4px; background: #e9f1ef; border-radius: 3px; }

@media (max-width: 640px) {
    .setup-shell { width: min(100% - 24px, 920px); margin: 28px auto; }
    .two-columns { grid-template-columns: 1fr; }
    .full-width { grid-column: auto; }
    .form-section { padding: 20px; }
}