/* =====================================================================
 * 批次 10 · 个人反诈与身份核验 —— 独立设计基座 foundation.css
 * 设计语言：安全控制台 / 终端网格。与批次 6（编辑式衬线）、批次 8（公文台账）
 * 完全不同的第三套体系：
 *   - 深靛蓝冷底 + 网格底纹 + 荧光青绿等宽终端字，扫描线与信号条作为可视化；
 *   - 面板使用切角 + 1px 硬边 + 角标括号，像一台设备面板而不是纸面表单；
 *   - 风险用「印章 / 信号格」表达，等宽数字做表格对齐。
 * 每个工具另有独立 CSS（强调色、专属可视化），互不复用版式。
 * ===================================================================== */

/* ---------- 变量 ---------- */
.fb {
    --fb-bg: #e9edf4;
    --fb-grid: rgba(16, 26, 43, .055);
    --fb-card: #ffffff;
    --fb-card2: #f2f5fa;
    --fb-card3: #e7ecf5;
    --fb-ink: #101a2b;
    --fb-ink2: #46536b;
    --fb-muted: #7c879b;
    --fb-line: #dde3ed;
    --fb-line2: #c6d0e0;
    --fb-brand: #16243c;
    --fb-brand-soft: #e4eaf4;
    --fb-on-brand: #ffffff;
    --fb-a: #3f6fd8;
    --fb-a-soft: #e2eafb;
    --fb-ok: #10805c;
    --fb-ok-soft: #dcf0e7;
    --fb-warn: #a86a12;
    --fb-warn-soft: #faefd9;
    --fb-danger: #c2372c;
    --fb-danger-soft: #fbe3e0;
    --fb-info: #2563a8;
    --fb-info-soft: #e0ecfa;
    --fb-warm: #d08a2c;
    --fb-scan: rgba(63, 111, 216, .07);
    --fb-shadow: 0 1px 0 rgba(16, 26, 43, .05), 0 14px 30px rgba(16, 26, 43, .08);
    --fb-shadow-sm: 0 1px 0 rgba(16, 26, 43, .05);
    --fb-r: 3px;
    --fb-r-sm: 2px;
    --fb-font-h: "HarmonyOS Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
    --fb-font-b: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
    --fb-font-mono: "JetBrains Mono", "SFMono-Regular", Consolas, "Liberation Mono", monospace;

    display: block;
    min-height: 60vh;
    color: var(--fb-ink);
    font-family: var(--fb-font-b);
    font-size: 14px;
    line-height: 1.8;
    background-color: var(--fb-bg);
    background-image:
        linear-gradient(var(--fb-grid) 1px, transparent 1px),
        linear-gradient(90deg, var(--fb-grid) 1px, transparent 1px);
    background-size: 26px 26px;
    -webkit-font-smoothing: antialiased;
}
:root[data-theme="dark"] .fb {
    --fb-bg: #070b14;
    --fb-grid: rgba(126, 200, 255, .055);
    --fb-card: #0f1624;
    --fb-card2: #151e30;
    --fb-card3: #1b2639;
    --fb-ink: #e7eefa;
    --fb-ink2: #a9b6cc;
    --fb-muted: #7d8ba3;
    --fb-line: #1c2740;
    --fb-line2: #28344f;
    --fb-brand: #d7e3f7;
    --fb-brand-soft: #1a2539;
    --fb-on-brand: #0a0f1a;
    --fb-a: #6ea0ff;
    --fb-a-soft: #17233b;
    --fb-ok: #45c79a;
    --fb-ok-soft: #102a22;
    --fb-warn: #e3a94b;
    --fb-warn-soft: #2d2413;
    --fb-danger: #f07e73;
    --fb-danger-soft: #331c1a;
    --fb-info: #74aef0;
    --fb-info-soft: #14243a;
    --fb-warm: #e3a94b;
    --fb-scan: rgba(110, 160, 255, .08);
    --fb-shadow: 0 1px 0 rgba(0, 0, 0, .3), 0 14px 30px rgba(0, 0, 0, .36);
    --fb-shadow-sm: 0 1px 0 rgba(0, 0, 0, .26);
}
.fb *, .fb *::before, .fb *::after { box-sizing: border-box; }
.fb b, .fb strong { color: var(--fb-ink); font-weight: 700; }
.fb button, .fb input, .fb select, .fb textarea { font-family: inherit; }

/* 公共推荐卡由 layouts/app.blade.php 挂在 body 下，不在 .fb 作用域内；
   仅本批页面加载此基座，隐藏后不影响任何线上页面，同时消除 390px 窄屏横向溢出。 */
.tool-rec { display: none !important; }

/* ---------- 公共面包屑（终端路径条，批次自有样式） ---------- */
.fb .tsk-crumb-bar {
    margin: 0 0 14px;
    border: 1px solid var(--fb-line2);
    border-left: 3px solid var(--fb-a);
    border-radius: var(--fb-r-sm);
    background: var(--fb-card2);
}
.fb .tsk-crumb-bar-in { padding: 7px 14px; }
.fb .tsk-crumb {
    display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin: 0;
    font-family: var(--fb-font-mono); font-size: 11.5px; line-height: 1.6; color: var(--fb-muted);
}
.fb .tsk-crumb a {
    color: var(--fb-ink2); text-decoration: none;
    border-bottom: 1px dashed var(--fb-line2); transition: color .15s, border-color .15s;
}
.fb .tsk-crumb a:hover { color: var(--fb-a); border-bottom-color: var(--fb-a); }
.fb .tsk-crumb-sep { color: var(--fb-line2); }
.fb .tsk-crumb-cur { color: var(--fb-ink); font-weight: 700; }

/* ---------- 布局 ---------- */
.fb-shell { max-width: 1200px; margin: 0 auto; padding: 0 20px 46px; }
.fb-hero { position: relative; padding: 30px 0 24px; }
.fb-kicker {
    display: inline-flex; align-items: center; gap: 8px;
    font-family: var(--fb-font-mono); font-size: 10.5px; font-weight: 700;
    letter-spacing: .22em; text-transform: uppercase; color: var(--fb-a);
}
.fb-kicker::before {
    content: ""; width: 9px; height: 9px; display: inline-block;
    background: var(--fb-a); box-shadow: 0 0 0 3px var(--fb-a-soft);
}
.fb-hero h1 {
    margin: 12px 0 10px; font-family: var(--fb-font-h);
    font-size: clamp(26px, 3.4vw, 40px); line-height: 1.24;
    font-weight: 800; letter-spacing: -.03em; color: var(--fb-ink);
}
.fb-sub { max-width: 880px; margin: 0; font-size: 14.5px; line-height: 1.95; color: var(--fb-ink2); }
.fb-sub b { color: var(--fb-ink); font-weight: 750; }
.fb-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px; }
.fb-chip {
    display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px;
    border: 1px solid var(--fb-line2); border-radius: var(--fb-r-sm);
    background: var(--fb-card); font-family: var(--fb-font-mono);
    font-size: 11.5px; letter-spacing: .04em; color: var(--fb-ink2);
}
.fb-chip i { width: 5px; height: 5px; background: var(--fb-a); display: inline-block; }
.fb-sec { margin-top: 28px; }
.fb-sec-hd {
    display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
    gap: 8px; margin-bottom: 11px; padding-left: 10px; border-left: 3px solid var(--fb-a);
}
.fb-sec-hd h2 {
    margin: 0; font-family: var(--fb-font-h); font-size: 20px; font-weight: 780;
    letter-spacing: -.02em; color: var(--fb-ink);
}
.fb-sec-note { font-size: 12px; color: var(--fb-muted); }

/* ---------- 面板（切角 + 角标括号） ---------- */
.fb-card {
    position: relative; min-width: 0; background: var(--fb-card);
    border: 1px solid var(--fb-line2); border-radius: var(--fb-r);
    box-shadow: var(--fb-shadow-sm); padding: 18px;
}
.fb-panel {
    position: relative; min-width: 0; background: var(--fb-card);
    border: 1px solid var(--fb-line2); border-radius: var(--fb-r);
    box-shadow: var(--fb-shadow-sm); padding: 16px;
}
.fb-panel::before, .fb-panel::after {
    content: ""; position: absolute; width: 11px; height: 11px; pointer-events: none;
    border-color: var(--fb-a); border-style: solid; opacity: .8;
}
.fb-panel::before { top: -1px; left: -1px; border-width: 2px 0 0 2px; }
.fb-panel::after { right: -1px; bottom: -1px; border-width: 0 2px 2px 0; }
.fb-panel-label {
    display: block; font-family: var(--fb-font-mono); font-size: 10px; font-weight: 700;
    letter-spacing: .18em; color: var(--fb-a); margin-bottom: 13px;
}
.fb-card-hd {
    display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
    gap: 8px; margin-bottom: 11px;
}
.fb-card-hd h3 { margin: 0; font-size: 15px; font-weight: 750; color: var(--fb-ink); }
.fb-card-hd small { font-size: 11.5px; color: var(--fb-muted); }
.fb-hint { font-size: 11px; font-weight: 400; color: var(--fb-muted); }

/* ---------- 表单 ---------- */
.fb-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.fb-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.fb-field > label { font-size: 12.5px; font-weight: 650; color: var(--fb-ink2); }
.fb-field > label b { color: var(--fb-danger); }
.fb input[type="text"], .fb input[type="number"], .fb input[type="date"], .fb input[type="time"],
.fb input[type="tel"], .fb select, .fb textarea {
    width: 100%; padding: 9px 11px; border: 1px solid var(--fb-line2); border-radius: var(--fb-r-sm);
    background: var(--fb-card2); color: var(--fb-ink); font-size: 13.5px; outline: none;
    transition: border-color .16s, box-shadow .16s, background .16s;
}
.fb textarea { min-height: 84px; resize: vertical; line-height: 1.75; }
.fb input:focus, .fb select:focus, .fb textarea:focus {
    border-color: var(--fb-a); background: var(--fb-card); box-shadow: 0 0 0 3px var(--fb-a-soft);
}
.fb [aria-invalid="true"] { border-color: var(--fb-danger) !important; box-shadow: 0 0 0 3px var(--fb-danger-soft) !important; }
.fb input[type="date"] { min-height: 38px; }
.fb-check {
    display: flex; align-items: flex-start; gap: 9px; padding: 9px 11px;
    border: 1px solid var(--fb-line2); border-radius: var(--fb-r-sm);
    background: var(--fb-card2); cursor: pointer; transition: border-color .16s, background .16s;
}
.fb-check:hover { border-color: var(--fb-a); }
.fb-check.is-on { border-color: var(--fb-a); background: var(--fb-a-soft); }
.fb-check input[type="checkbox"] { width: 15px; height: 15px; margin-top: 3px; accent-color: var(--fb-a); flex: 0 0 auto; }
.fb-check b { display: block; font-size: 13px; }
.fb-check small { display: block; color: var(--fb-muted); font-size: 11.5px; line-height: 1.5; }
.fb-err { min-height: 0; margin-top: 10px; font-size: 12.5px; color: var(--fb-danger); }
.fb-err:not(:empty) {
    padding: 8px 11px; border-left: 3px solid var(--fb-danger);
    background: var(--fb-danger-soft); border-radius: 0 var(--fb-r-sm) var(--fb-r-sm) 0;
}

/* ---------- 按钮 ---------- */
.fb-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    padding: 10px 18px; border-radius: var(--fb-r-sm); border: 1px solid transparent;
    background: var(--fb-brand); color: var(--fb-on-brand); font-family: var(--fb-font-h);
    font-size: 13.5px; font-weight: 750; line-height: 1.45; cursor: pointer;
    transition: transform .16s, box-shadow .16s, border-color .16s, background .16s;
}
.fb-btn:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(16, 26, 43, .18); }
.fb-btn:active { transform: translateY(0); }
.fb-btn[disabled] { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
.fb-btn--soft { background: var(--fb-a-soft); color: var(--fb-a); border-color: var(--fb-line2); }
.fb-btn--ghost { background: transparent; border-color: var(--fb-line2); color: var(--fb-ink2); }
.fb-btn--ghost:hover { border-color: var(--fb-a); color: var(--fb-a); box-shadow: none; }
.fb-btn--warm { background: var(--fb-warm); color: #241704; }
.fb-btn--sm { padding: 6px 12px; font-size: 12.5px; }
.fb-btn-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px; }
.fb-demo { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 13px; }
.fb-demo > span { font-size: 12px; color: var(--fb-muted); margin-right: 2px; }
.fb-demo button {
    padding: 4px 11px; border: 1px dashed var(--fb-line2); border-radius: 2px;
    background: transparent; color: var(--fb-ink2); font-size: 12px; cursor: pointer; transition: all .18s;
}
.fb-demo button:hover { border-style: solid; border-color: var(--fb-a); color: var(--fb-a); background: var(--fb-a-soft); }

/* ---------- 数据展示 ---------- */
.fb-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(158px, 1fr)); gap: 10px; }
.fb-kpi {
    border: 1px solid var(--fb-line2); border-left: 3px solid var(--fb-a);
    border-radius: var(--fb-r-sm); background: var(--fb-card); padding: 12px 14px;
}
.fb-kpi .k { font-size: 11.5px; color: var(--fb-muted); }
.fb-kpi .v {
    font-family: var(--fb-font-mono); font-size: 22px; font-weight: 700; line-height: 1.4;
    color: var(--fb-a); font-variant-numeric: tabular-nums; word-break: break-all;
}
.fb-kpi .v small { font-size: 12px; margin-left: 3px; font-weight: 500; }
.fb-kpi .d { font-size: 11px; color: var(--fb-muted); line-height: 1.6; }
.fb-table-wrap { min-width: 0; max-width: 100%; overflow-x: auto; border: 1px solid var(--fb-line2); border-radius: var(--fb-r); }
.fb-table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 12.5px; }
.fb-table th, .fb-table td { padding: 9px 11px; text-align: left; border-bottom: 1px solid var(--fb-line); vertical-align: top; }
.fb-table thead th { background: var(--fb-card2); font-family: var(--fb-font-mono); font-size: 11px; font-weight: 700; letter-spacing: .06em; color: var(--fb-ink2); white-space: nowrap; }
.fb-table tbody tr:last-child td { border-bottom: 0; }
.fb-table tbody tr:hover { background: var(--fb-card2); }
.fb-num { font-family: var(--fb-font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.fb-empty { text-align: center; color: var(--fb-muted); font-size: 12.5px; padding: 10px 0; }
.fb-badge { display: inline-block; padding: 2px 8px; border-radius: 2px; font-size: 11px; font-weight: 700; white-space: nowrap; }
.fb-badge--ok { background: var(--fb-ok-soft); color: var(--fb-ok); }
.fb-badge--warn { background: var(--fb-warn-soft); color: var(--fb-warn); }
.fb-badge--danger { background: var(--fb-danger-soft); color: var(--fb-danger); }
.fb-badge--info { background: var(--fb-info-soft); color: var(--fb-info); }
.fb-badge--mute { background: var(--fb-card3); color: var(--fb-muted); border: 1px solid var(--fb-line2); }
.fb-callout {
    padding: 11px 13px; border: 1px solid var(--fb-line2); border-left: 3px solid var(--fb-info);
    border-radius: 0 var(--fb-r-sm) var(--fb-r-sm) 0; background: var(--fb-info-soft);
    font-size: 12.5px; line-height: 1.85; color: var(--fb-ink2);
}
.fb-callout--ok { border-left-color: var(--fb-ok); background: var(--fb-ok-soft); }
.fb-callout--warn { border-left-color: var(--fb-warn); background: var(--fb-warn-soft); }
.fb-callout--danger { border-left-color: var(--fb-danger); background: var(--fb-danger-soft); }
.fb-list { display: grid; gap: 7px; }
.fb-list-item {
    display: flex; gap: 10px; align-items: flex-start; padding: 9px 11px;
    border: 1px solid var(--fb-line2); border-radius: var(--fb-r-sm); background: var(--fb-card2);
    font-size: 12.5px; line-height: 1.75; color: var(--fb-ink2);
}
.fb-list-item .n {
    flex: 0 0 21px; height: 21px; border-radius: 2px; display: grid; place-items: center;
    background: var(--fb-a); color: var(--fb-on-brand); font-family: var(--fb-font-mono);
    font-size: 10.5px; font-weight: 700;
}
.fb-meter { height: 8px; border-radius: 1px; background: var(--fb-card3); overflow: hidden; }
.fb-meter > i { display: block; height: 100%; background: var(--fb-a); transition: width .4s ease; }
.fb-meter.is-over > i { background: var(--fb-danger); }
.fb-del { border: 0; background: transparent; color: var(--fb-muted); cursor: pointer; font-size: 17px; line-height: 1; padding: 2px 5px; }
.fb-del:hover { color: var(--fb-danger); }

/* ---------- 阅读区 ---------- */
.fb-prose { font-size: 14px; line-height: 2.05; color: var(--fb-ink2); }
.fb-prose b { color: var(--fb-ink); }
.fb-prose p { margin-bottom: 11px; }
.fb-prose p:last-child { margin-bottom: 0; }
.fb-footnote {
    margin: 22px 0 0; padding-top: 15px; border-top: 1px dashed var(--fb-line2);
    font-size: 11.5px; line-height: 1.9; color: var(--fb-muted);
}

/* ---------- 操作后报告（仅用户完成操作后插入，加载时不出现） ---------- */
.fb-report {
    margin-top: 18px; border: 1px solid var(--fb-a); border-left: 4px solid var(--fb-a);
    border-radius: var(--fb-r); background: var(--fb-card); box-shadow: var(--fb-shadow);
}
.fb-report-inner { padding: 18px; }
.fb-report-inner h3 { margin: 0 0 4px; font-family: var(--fb-font-h); font-size: 19px; font-weight: 780; }
.fb-report-sub { font-family: var(--fb-font-mono); font-size: 11.5px; color: var(--fb-muted); margin-bottom: 13px; }
.fb-report-body { font-size: 13px; line-height: 1.9; color: var(--fb-ink2); }
.fb-report-body p { margin: 0 0 9px; }
.fb-report-body table { width: 100%; border-collapse: collapse; font-size: 12.5px; margin: 10px 0; }
.fb-report-body th, .fb-report-body td { border: 1px solid var(--fb-line2); padding: 7px 9px; text-align: left; }
.fb-report-body th { background: var(--fb-card2); }
.fb-report-foot { margin-top: 13px; }
.fb-toast {
    position: fixed; left: 50%; bottom: 30px; transform: translate(-50%, 12px); z-index: 9999;
    padding: 10px 18px; border-radius: var(--fb-r-sm); background: var(--fb-brand);
    color: var(--fb-on-brand); font-size: 13px; font-weight: 650; box-shadow: var(--fb-shadow);
    opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s;
}
.fb-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
.fb-toast.is-err { background: var(--fb-danger); color: #fff; }
.fb-ai-box {
    margin-top: 12px; padding: 13px; border: 1px dashed var(--fb-line2); border-radius: var(--fb-r-sm);
    background: var(--fb-card2); font-size: 13px; line-height: 1.9; color: var(--fb-ink2); white-space: pre-wrap;
}
.fb-ai-box:empty { display: none; }
.fb-ai-box.is-err { border-color: var(--fb-danger); color: var(--fb-danger); }

/* ---------- 窄屏 ---------- */
@media (max-width: 720px) {
    .fb-shell { padding: 0 14px 34px; }
    .fb-hero { padding: 24px 0 18px; }
    .fb-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .fb-sec-hd h2 { font-size: 18px; }
}
@media (max-width: 430px) {
    .fb-fields { grid-template-columns: 1fr; }
    .fb-btn { padding: 9px 13px; font-size: 13px; }
}
