/*!
 * 17 · 院校录取概率测算 —— 独立设计：志愿填报看板 /  navy + gold
 * 深蓝底首屏表单 + 金色年份徽章，结果为冲稳保三栏看板与概率环。
 */
.vx.vx-17 {
    --vx-accent: #1f3a6e;
    --vx-accent-2: #31528f;
    --vx-accent-soft: #e3eaf6;
    --vx-accent-ink: #ffffff;
    --vx-bg: #f1f3f8;
    --vx-surface: #ffffff;
    --vx-surface-2: #f6f8fc;
    --vx-surface-3: #e9eef7;
    --vx-line: #dce3ef;
    --vx-line-2: #eaf0f8;
    --vx-ink: #1d2b42;
    --vx-ink-2: #4e5d75;
}
:root[data-theme="dark"] .vx.vx-17 {
    --vx-accent: #96b6ee;
    --vx-accent-2: #b3caf4;
    --vx-accent-soft: #1c2b48;
    --vx-accent-ink: #0e1a2f;
    --vx-bg: #0d1119;
    --vx-surface: #161c27;
    --vx-surface-2: #1c2330;
    --vx-surface-3: #232c3c;
    --vx-line: #2a364a;
    --vx-line-2: #222b3a;
    --vx-ink: #eaf0fa;
    --vx-ink-2: #aebbd0;
}

.vx-17 .adm-hero { grid-template-columns: minmax(0, 1fr) minmax(340px, 410px); gap: 34px; }
.vx-17 .vx-h1 em { color: #b48b38; }
:root[data-theme="dark"] .vx-17 .vx-h1 em { color: #e0be70; }
.vx-17 .vx-eyebrow { color: #b48b38; }
.vx-17 .vx-chip { border-radius: 999px; }
.vx-17 .vx-feat > i { border-radius: 3px; }

/* 深蓝测算台 */
.vx-17 .adm-form { border-radius: 8px; overflow: hidden; background: #16294c; color: #e9f0fb; box-shadow: var(--vx-shadow-lg); }
.vx-17 .adm-form-h { display: flex; align-items: center; justify-content: space-between; padding: 12px 17px; border-bottom: 1px solid #2b4674; background: #10203e; }
.vx-17 .adm-form-h > b { font-size: 14px; letter-spacing: .06em; }
.vx-17 .adm-form-h b, .vx-17 .adm-form-h strong { color: inherit; }
.vx-17 .adm-form-h > span { font: 800 10.5px/1 var(--vx-font-num); letter-spacing: .16em; color: #e0be70; }
.vx-17 .adm-form-b { padding: 17px; }
.vx-17 .adm-form .vx-label { color: #a9bcdb; }
.vx-17 .adm-form .vx-input, .vx-17 .adm-form .vx-select { background: #20375e; border-color: #345282; color: #f2f7ff; }
.vx-17 .adm-form .vx-select option { color: #17263f; }
.vx-17 .adm-form .vx-input:focus, .vx-17 .adm-form .vx-select:focus { border-color: #e0be70; box-shadow: 0 0 0 3px rgba(224, 190, 112, .18); }
.vx-17 .adm-form .vx-check { display: flex; margin: 9px 0; color: #d3e0f3; }
.vx-17 .adm-form .vx-btn { background: #264170; border-color: #3b5c92; color: #e9f0fb; }
.vx-17 .adm-form .vx-btn:hover { border-color: #e0be70; }
.vx-17 .adm-form .vx-btn--primary { background: #e0be70; border-color: #e0be70; color: #17263f; font-weight: 800; }
.vx-17 .adm-form .vx-btn--primary:hover { background: #efd08e; border-color: #efd08e; color: #17263f; }
.vx-17 .adm-form .vx-err { color: #ffb4ac; }
.vx-17 .adm-ruler { position: relative; height: 34px; margin: 4px 0 12px; border-bottom: 1px solid #3b5c92; background: repeating-linear-gradient(90deg, #3b5c92 0 1px, transparent 1px 10%); }
.vx-17 .adm-ruler > span { position: absolute; bottom: 4px; font: 700 10px/1 var(--vx-font-num); color: #a9bcdb; }
.vx-17 .adm-ruler > u { position: absolute; bottom: -2px; width: 2px; height: 16px; background: #e0be70; }

/* 摘要与看板 */
.vx-17 .adm-summary { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 4px 0 16px; padding: 15px 20px; border: 1px solid var(--vx-line); border-left: 5px solid #b48b38; border-radius: 8px; background: var(--vx-surface); }
.vx-17 .adm-summary > b { font-size: 18px; }
.vx-17 .adm-summary > span { font-size: 13px; color: var(--vx-ink-2); }
.vx-17 .adm-year { padding: 3px 10px; border-radius: 999px; background: #f7ecd2; color: #8a6418; font: 800 12px var(--vx-font-num); }
:root[data-theme="dark"] .vx-17 .adm-year { background: #3a2f19; color: #e0be70; }
.vx-17 .adm-board { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.vx-17 .adm-col { border: 1px solid var(--vx-line); border-top: 4px solid var(--vx-accent); border-radius: 8px; background: var(--vx-surface); padding: 14px; min-height: 180px; }
.vx-17 .adm-col.is-chong { border-top-color: #c07a4a; }
.vx-17 .adm-col.is-wen { border-top-color: #b48b38; }
.vx-17 .adm-col.is-bao { border-top-color: #2d8064; }
.vx-17 .adm-col-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.vx-17 .adm-col-h > b { font-size: 17px; }
.vx-17 .adm-col-h > span { font-size: 11.5px; color: var(--vx-faint); }
.vx-17 .adm-school { display: grid; grid-template-columns: 46px 1fr; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px dashed var(--vx-line-2); }
.vx-17 .adm-school:last-child { border-bottom: 0; }
.vx-17 .adm-ring { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; font: 800 11px var(--vx-font-num); color: var(--vx-ink); background: conic-gradient(var(--vx-accent) var(--p), var(--vx-surface-3) 0); position: relative; }
.vx-17 .adm-ring::after { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--vx-surface); }
.vx-17 .adm-ring > b { position: relative; z-index: 1; }
.vx-17 .adm-school > div > b { display: block; font-size: 13px; line-height: 1.5; }
.vx-17 .adm-school > div > span { font-size: 11.5px; color: var(--vx-faint); font-family: var(--vx-font-num); }
.vx-17 .adm-empty { padding: 12px 0; font-size: 12.5px; color: var(--vx-faint); }
.vx-17 .vx-kpi { border-top: 3px solid #b48b38; }
.vx-17 .vx-ai { border-color: var(--vx-accent); }

@media (max-width: 900px) {
    .vx-17 .adm-board { grid-template-columns: 1fr; }
}