/* ============================================================
   授权查询页
   ============================================================ */
.query-main { padding: 56px 0 96px; }
.query-layout { max-width: 760px; margin: 0 auto; }

/* ---------- 查询表单卡 ---------- */
.query-card {
    background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg);
    box-shadow: var(--shadow-md); padding: 38px 40px; margin-top: -84px; position: relative; z-index: 3;
}
.query-card h2 { font-size: 22px; color: var(--ink-900); font-weight: 700; text-align: center; }
.query-card .sub { text-align: center; font-size: var(--fs-sm); color: var(--ink-400); margin: 8px 0 28px; }
.field-label { display: block; font-size: var(--fs-sm); font-weight: 600; color: var(--ink-700); margin-bottom: 8px; }
.domain-input {
    display: flex; align-items: center; gap: 10px;
    border: 1.5px solid var(--line-strong); border-radius: var(--r-sm);
    padding: 0 16px; height: 52px; transition: border-color .2s ease, box-shadow .2s ease;
    background: #fff;
}
.domain-input:focus-within { border-color: var(--brand-500); box-shadow: 0 0 0 4px rgba(31,139,216,.12); }
.domain-input .prefix { font-family: var(--font-mono); font-size: 14px; color: var(--ink-400); flex: none; }
.domain-input input { flex: 1; border: none; outline: none; font-size: 16px; color: var(--ink-900); background: transparent; min-width: 0; }
.domain-input .clear { color: var(--ink-300); display: none; }
.captcha-row { display: flex; gap: 12px; margin-top: 18px; }
.captcha-row input {
    flex: 1; min-width: 0; height: 50px; border: 1.5px solid var(--line-strong); border-radius: var(--r-sm);
    padding: 0 16px; font-size: 15px; outline: none; transition: border-color .2s ease, box-shadow .2s ease;
}
.captcha-row input:focus { border-color: var(--brand-500); box-shadow: 0 0 0 4px rgba(31,139,216,.12); }
.captcha-img {
    width: 152px; height: 50px; flex: none; border-radius: var(--r-sm); overflow: hidden;
    border: 1.5px solid var(--line-strong); position: relative; cursor: pointer;
    background: repeating-linear-gradient(135deg, #e7f0f8 0 10px, #dce9f5 10px 20px);
    display: flex; align-items: center; justify-content: center; gap: 6px;
    font-family: var(--font-mono); font-size: 12px; color: var(--ink-500);
}
.captcha-img:hover { border-color: var(--brand-300); color: var(--brand-600); }
.query-card .btn-primary { width: 100%; margin-top: 22px; height: 52px; font-size: 16px; }
.query-footnote { margin-top: 16px; font-size: var(--fs-xs); color: var(--ink-400); text-align: center; display: flex; gap: 7px; align-items: center; justify-content: center; }
.query-footnote .icon { width: 15px; height: 15px; flex: none; }

/* 状态预览切换（静态稿演示用，正式实现时删除） */
.state-switch {
    display: flex; gap: 6px; margin: 30px auto 16px; background: var(--bg-soft);
    border: 1px solid var(--line); border-radius: var(--r-pill); padding: 4px; width: fit-content;
}
.state-switch button {
    height: 32px; padding: 0 18px; border-radius: var(--r-pill);
    font-size: var(--fs-sm); color: var(--ink-500); font-weight: 500;
}
.state-switch button.on { background: #fff; color: var(--brand-700); box-shadow: var(--shadow-xs); font-weight: 600; }

/* ---------- 结果卡 ---------- */
.result { display: none; border-radius: var(--r-lg); overflow: hidden; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.result.show { display: block; animation: rise .4s ease; }
.result-bar { display: flex; align-items: center; gap: 14px; padding: 22px 28px; }
.result-bar .r-icon { width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex: none; }
.result-bar h3 { font-size: 19px; font-weight: 700; }
.result-bar p { font-size: var(--fs-sm); margin-top: 2px; }
.result-ok .result-bar { background: var(--success-bg); }
.result-ok .r-icon { background: var(--success); color: #fff; }
.result-ok h3 { color: var(--success); }
.result-ok .result-bar p { color: #3d7a60; }
.result-expired .result-bar { background: var(--warning-bg); }
.result-expired .r-icon { background: var(--warning); color: #fff; }
.result-expired h3 { color: var(--warning); }
.result-expired .result-bar p { color: #92651a; }
.result-none .result-bar { background: #f4f6f9; }
.result-none .r-icon { background: #c2cdda; color: #fff; }
.result-none h3 { color: var(--ink-600); }
.result-none .result-bar p { color: var(--ink-400); }

.result-body { padding: 8px 28px 26px; }
.kv { display: grid; grid-template-columns: 110px 1fr; gap: 4px 20px; padding: 15px 0; border-bottom: 1px dashed var(--line); }
.kv:last-child { border-bottom: none; }
.kv .k { color: var(--ink-400); font-size: var(--fs-sm); }
.kv .v { color: var(--ink-900); font-size: var(--fs-sm); font-weight: 500; }
.kv .v .tag { margin-left: 8px; }
.perm { color: var(--success); font-weight: 600; }
.result-actions { padding: 0 28px 28px; display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.result-actions .btn-back { margin-left: auto; }
.result-actions .btn .icon { width: 15px; height: 15px; }
.reasons { background: var(--bg-soft); border-radius: var(--r-md); padding: 18px 22px; margin: 6px 0 20px; }
.reasons h4 { font-size: var(--fs-sm); color: var(--ink-700); margin-bottom: 8px; display: flex; gap: 8px; align-items: center; }
.reasons h4 .icon { width: 16px; height: 16px; color: var(--warning); }
.reasons li { font-size: var(--fs-sm); color: var(--ink-500); padding-left: 16px; position: relative; line-height: 1.9; }
.reasons li::before { content: ""; position: absolute; left: 2px; top: 12px; width: 5px; height: 5px; border-radius: 50%; background: var(--ink-300); }

/* ---------- 权益 / 风险 ---------- */
.notice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 56px; }
.notice-card { border-radius: var(--r-lg); padding: 32px 30px; }
.notice-card.good { background: #fff; border: 1px solid var(--line); }
.notice-card.risk { background: linear-gradient(165deg, #2c2033, #1d1822); color: rgba(255,255,255,.78); }
.notice-card h3 { font-size: 18px; font-weight: 700; margin-bottom: 6px; display: flex; align-items: center; gap: 10px; color: var(--ink-900); }
.notice-card.risk h3 { color: #fff; }
.notice-card > p { font-size: var(--fs-sm); margin-bottom: 20px; color: var(--ink-400); }
.notice-card.risk > p { color: rgba(255,255,255,.55); }
.notice-list { display: grid; gap: 16px; }
.notice-list li { display: flex; gap: 12px; font-size: var(--fs-sm); line-height: 1.75; }
.notice-list .n-icon { width: 38px; height: 38px; border-radius: 10px; flex: none; display: flex; align-items: center; justify-content: center; }
.good .n-icon { background: var(--success-bg); color: var(--success); }
.risk .n-icon { background: rgba(255,255,255,.08); color: #ff9a8b; }
.notice-list b { display: block; font-size: 14px; color: var(--ink-900); margin-bottom: 2px; }
.risk .notice-list b { color: #fff; }
.notice-list span { color: var(--ink-500); }
.risk .notice-list span { color: rgba(255,255,255,.6); }

.query-disclaimer { text-align: center; font-size: var(--fs-xs); color: var(--ink-400); margin-top: 36px; line-height: 1.9; }

/* 正式版：验证码图片实体化（替换静态稿 span 占位） */
img.captcha-img { object-fit: cover; padding: 0; background: #fff; }

/* 表单级错误提示（验证码错误 / 限频 / CSRF 过期） */
.query-alert {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 18px; padding: 12px 16px;
    border-radius: var(--r-sm); border: 1px solid #f2c4be;
    background: #fdf1ef; color: #c0392b; font-size: var(--fs-sm); line-height: 1.6;
}
.query-alert .icon { width: 17px; height: 17px; flex: none; }

@media (max-width: 768px) {
    .query-card { padding: 28px 22px; margin-top: -64px; }
    .notice-grid { grid-template-columns: 1fr; }
    .kv { grid-template-columns: 92px 1fr; }
    .result-bar, .result-body, .result-actions { padding-left: 20px; padding-right: 20px; }
    .result-actions .btn-back { margin-left: 0; }
    .result-actions .btn { width: 100%; justify-content: center; }
}