:root {
    --brand: #A41626;
    --brand-hover: #86111D;
    --brand-light: #FCE8EB;
    --bg: #F5F6F8;
    --surface: #FFFFFF;
    --text: #1F2937;
    --text-sub: #667085;
    --border: #E5E7EB;
    --border-strong: #D0D5DD;
    --success: #067647;
    --success-bg: #ECFDF3;
    --warn: #B54708;
    --warn-bg: #FFF4EC;
    --danger: #B42318;
    --danger-bg: #FEF3F2;
    --focus: rgba(164,22,38,0.12);
    --shadow: 0 1px 2px rgba(16,24,40,0.05);
    --radius: 12px;
    --radius-sm: 8px;
    --nav-h: 64px;
}
* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body { height:100%; }
body {
    font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    background:var(--bg); color:var(--text); font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
button { font-family:inherit; cursor:pointer; }
input,select,textarea { font-family:inherit; }
a { color:var(--brand); text-decoration:none; }
img { display:block; }
.sr-only { position:absolute; width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap; }

/* ---------- login page ---------- */
body.auth-body { display:flex; align-items:center; justify-content:center; min-height:100vh; padding:24px; }
.auth-card { width:100%; max-width:400px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:40px 36px 28px; }
.auth-brand { display:flex; flex-direction:column; align-items:center; text-align:center; }
.auth-logo { height:46px; width:auto; object-fit:contain; margin-bottom:14px; }
.auth-brand h1 { font-size:20px; font-weight:600; letter-spacing:0.2px; }
.auth-brand .tag { color:var(--text-sub); font-size:12px; }
.auth-title { margin-top:22px; font-size:16px; font-weight:600; color:var(--text); }
.auth-sub { color:var(--text-sub); font-size:13px; margin-top:4px; }
.auth-note { color:var(--text-sub); font-size:12px; margin-top:6px; text-align:center; }
.field { margin:18px 0 4px; }
.field > label { display:flex; justify-content:space-between; align-items:center; margin-bottom:6px; font-size:13px; font-weight:500; color:var(--text); }
.pwwrap { position:relative; }
.pwwrap input { padding-right:44px; }
.pw-eye { position:absolute; right:4px; top:50%; transform:translateY(-50%); border:none; background:none; padding:8px; color:var(--text-sub); display:flex; }
.pw-eye:hover { color:var(--text); }
input[type="text"],input[type="tel"],input[type="email"],input[type="password"],input[type="search"],
select,textarea {
    width:100%; height:44px; padding:0 13px; border:1px solid var(--border-strong); border-radius:var(--radius-sm);
    background:var(--surface); color:var(--text); font-size:14px; outline:none; transition:border-color .12s, box-shadow .12s;
}
textarea { height:auto; padding:10px 13px; resize:vertical; }
input:focus,select:focus,textarea:focus { border-color:var(--brand); box-shadow:0 0 0 3px var(--focus); }
input:disabled,select:disabled { color:var(--text-sub); background:#F9FAFB; cursor:not-allowed; }
.err-text { color:var(--danger); font-size:12px; min-height:16px; margin-top:4px; display:none; }
.err-text.show { display:block; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; height:44px; padding:0 18px;
    border-radius:var(--radius-sm); border:1px solid transparent; font-size:14px; font-weight:500;
    transition:background .15s, border-color .15s, color .15s, opacity .15s; white-space:nowrap; user-select:none; }
.btn:disabled { opacity:.65; cursor:not-allowed; }
.btn-block { width:100%; }
.btn-primary { background:var(--brand); color:#fff; }
.btn-primary:hover:not(:disabled) { background:var(--brand-hover); }
.btn-secondary { background:var(--surface); color:var(--text); border-color:var(--border); }
.btn-secondary:hover:not(:disabled) { border-color:var(--border-strong); }
.btn-ghost { background:#fff; border:1px solid var(--border); color:var(--text); }
.btn-sm { height:36px; padding:0 14px; font-size:13px; }
.form-hint { color:var(--text-sub); font-size:12px; }
.submit-field { margin-top:20px; }
.loaderspin { width:14px;height:14px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite; }
.btn-secondary .loaderspin, .btn-ghost .loaderspin { border-color:rgba(23,35,55,.2); border-top-color:var(--text-sub); }
@keyframes spin { to { transform:rotate(360deg); } }
.auth-footer { margin-top:22px; padding-top:14px; border-top:1px solid var(--border); }
.security-line { display:flex; gap:8px; align-items:flex-start; color:var(--text-sub); font-size:12px; margin-top:8px; }
.vs .ic { flex:0 0 auto; margin-top:2px; }
.auth-sec-intro { color:var(--text-sub); font-size:12px; text-align:left; }

/* ---------- app shell: top nav ---------- */
.navbar { height:var(--nav-h); background:var(--surface); border-bottom:1px solid var(--border); position:fixed; top:0; left:0; right:0; z-index:50; }
.nav-inner { max-width:1380px; margin:0 auto; height:100%; padding:0 20px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.nav-brand { display:flex; align-items:center; gap:11px; min-width:0; }
.nav-logo { height:30px; width:auto; object-fit:contain; }
.brand-meta { display:flex; flex-direction:column; line-height:1.1; }
.brand-title { font-size:15px; font-weight:600; color:var(--text); white-space:nowrap; }
.brand-sub { font-size:11px; color:var(--text-sub); }
.nav-internal { display:inline-flex; align-items:center; font-size:11px; font-weight:500; color:var(--brand); background:var(--brand-light); border:1px solid #F6D4DA; border-radius:4px; padding:2px 7px; white-space:nowrap; }
.nav-right { display:flex; align-items:center; gap:6px; }
.nav-status { display:flex; align-items:center; gap:7px; font-size:13px; color:var(--text-sub); padding:0 6px; }
.cs-lock { color:var(--success); display:inline-flex; }
.cs-text { white-space:nowrap; }
.btn-outline { display:inline-flex; align-items:center; gap:7px; height:36px; padding:0 14px; border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:var(--radius-sm); font-size:13px; }
.btn-outline:hover { background:#F9FAFB; }

/* ---------- layout ---------- */
.shell { max-width:1380px; margin:0 auto; padding:calc(var(--nav-h) + 24px) 20px 48px; }
.split { display:grid; grid-template-columns:380px minmax(0,1fr); gap:20px; align-items:start; }
/* 录入主页不再渲染右侧“已录入列表”时，仅保留录入表单，并把表单列居中到舒适宽度 */
body.app-entry .split { grid-template-columns:minmax(0,1fr); max-width:820px; margin-left:auto; margin-right:auto; }
.card { background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
[data-view] { display:none; }
[data-view].active { display:block; }
.page-title { font-size:24px; font-weight:600; margin-bottom:16px; }
.status-tag { display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:500; }
.status-inline { display:inline-flex; align-items:center; gap:6px; }

/* ---------- form (left) ---------- */
.view-card.formview { padding:22px; position:relative; }
@media (min-width:1100px) { .form-anchor { position:sticky; top:calc(var(--nav-h) + 24px); } }
.view-card .vcard-head { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:16px; }
.view-card .vcard-head h2 { font-size:18px; font-weight:600; }
.req-mark { color:var(--text-sub); font-size:12px; }
.form-grid .fg { margin-bottom:16px; }
.form-grid .fg > label { display:block; margin-bottom:6px; font-size:13px; font-weight:500; color:var(--text); }
.req-star { color:var(--danger); margin-left:2px; }
.hint { font-size:12px; color:var(--text-sub); margin-top:5px; }
.match-fill { margin-left:auto; padding-right:2px; }
.fstatus-ok { display:none; font-size:12px; color:var(--success); }
.fstatus-ok.show { display:inline-flex; align-items:center; gap:4px; }
.fstatus-ok .dotg { width:6px; height:6px; border-radius:50%; background:var(--success); }
.input-match { padding-right:6px; }
.h2 .btn-row { display:flex; gap:12px; margin-top:6px; }

/* ---------- upload (custom) ---------- */
.upload { position:relative; }
.upload-drop { display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px dashed var(--border-strong);
    border-radius:var(--radius-sm); padding:18px 12px; text-align:center; cursor:pointer; transition:border-color .12s,background .12s; color:var(--text-sub); }
.upload-drop:hover { border-color:var(--brand); background:#FFFDFD; }
.upload-drop input[type="file"] { position:absolute; width:1px;height:1px;opacity:0;overflow:hidden; }
.up-ic { color:var(--brand); margin-bottom:8px; display:inline-flex; }
.up-title { font-size:13px; color:var(--text); margin-bottom:3px; font-weight:500; }
.up-sub { font-size:12px; }
.upload-preview { display:none; margin-top:12px; border:1px solid var(--border); border-radius:var(--radius-sm); padding:10px; }
.upload-preview.show { display:block; }
.preview-wrap { display:flex; gap:12px; align-items:center; }
.preview-thumb { width:76px; height:76px; border:1px solid var(--border); border-radius:6px; object-fit:contain; background:#fff; padding:4px; flex:0 0 auto; }
.preview-meta { flex:1; min-width:0; }
.preview-fname { font-size:13px; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.preview-fsize { font-size:12px; color:var(--text-sub); }
.preview-actions { display:flex; gap:8px; margin-top:10px; }
.err-under { color:var(--danger); font-size:12px; display:none; font-weight:400; }
.fg.has-err .err-under{ display:block; }
.fg.has-err input,.fg.has-err select,.fg.has-err .upload-drop { border-color:var(--danger); }

/* toolbar table */
.listview { }
.toolbar-wrap { display:flex; flex-wrap:wrap; gap:12px; padding:16px 18px; border-bottom:1px solid var(--border); align-items:center; }
.tl-left { display:flex; align-items:baseline; gap:12px; }
.tl-left h2 { font-size:18px; font-weight:600; }
.tl-count { color:var(--text-sub); font-size:13px; }
.tl-fill { flex:1; }
.stat-mini { display:flex; align-items:center; border:1px solid var(--border); border-radius:var(--radius-sm); }
.stat-cell { padding:8px 14px; text-align:center; border-right:1px solid var(--border); }
.stat-cell:last-child { border-right:none; }
.stat-cell .v { font-size:16px; font-weight:600; line-height:1.1; }
.stat-cell .k { font-size:12px; color:var(--text-sub); }
.tl-controls { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.searchbox { position:relative; min-width:240px; }
.searchbox svg { position:absolute; left:10px; top:50%; transform:translateY(-50%); color:var(--text-sub); }
.searchbox input { padding-left:32px; min-width:240px; height:38px; }
.tl-select { height:38px; width:auto; min-width:120px; font-size:13px; width:auto; }
.iconbtn { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-sm); color:var(--text-sub); }
.iconbtn:hover { background:#F9FAFB; color:var(--text); }

/* table */
.table-scroll { width:100%; overflow-x:auto; }
table.grid { width:100%; border-collapse:collapse; }
table.grid th { position:sticky; top:0; background:#F9FAFB; z-index:2; text-align:left; font-size:12px; font-weight:600; color:var(--text-sub); padding:10px 14px; border-bottom:1px solid var(--border); white-space:nowrap; }
table.grid td { padding:13px 14px; border-bottom:1px solid var(--border); vertical-align:middle; }
table.grid tbody tr:hover { background:#FAFBFC; }
table.grid tbody tr:last-child td { border-bottom:none; }
.cell-name { font-weight:500; color:var(--text); }
.cell-sub { color:var(--text-sub); font-size:12px; margin-top:2px; }
.clip { max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.contact-l { display:flex; flex-wrap:wrap; gap:4px 10px; }
.contact-chip { color:var(--text-sub); font-size:12px; }
.tag { display:inline-flex; align-items:center; font-size:12px; font-weight:500; line-height:1; }
.tag-pill { padding:4px 9px; border-radius:999px; }
.tag-done { background:var(--success-bg); color:var(--success); }
.tag-todo { background:var(--warn-bg); color:var(--warn); }
.tag-new { background:var(--danger-bg); color:var(--danger); }
.date-cell { color:var(--text-sub); font-size:12px; white-space:nowrap; }
.op-cell { display:flex; gap:2px; }
.op-cell button { display:inline-flex; align-items:center; justify-content:center; width:32px;height:32px; border:none; background:none; border-radius:6px; color:var(--text-sub); }
.op-cell button:hover { background:var(--brand-light); color:var(--brand); }
.op-cell button.del:hover { background:var(--danger-bg); color:var(--danger); }
.op-cell img.qr-mini { width:22px;height:22px; }
.th-act { width:120px; }

/* state blocks */
.state-block { padding:46px 20px; text-align:center; color:var(--text-sub); }
.state-block .sb-t { font-size:14px; font-weight:500; color:var(--text); margin-top:8px; }
.state-block .sb-d { font-size:13px; margin-top:4px; }
.state-block .sb-a { margin-top:14px; }
.spinbox { display:flex; justify-content:center; padding:40px 0; }
.spinner { width:22px;height:22px;border:2px solid var(--border); border-top-color:var(--brand); border-radius:50%; animation:spin .8s linear infinite; }
.empty-ic { color:#D0D5DD; display:inline-flex; }

	/* pagination */
	.pagination { padding:12px 18px; border-top:1px solid var(--border); }
	.pg-wrap { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
	.pg-navs { display:flex; align-items:center; justify-content:center; gap:4px; flex-wrap:wrap; min-width:0; }
	.pg-right { display:flex; align-items:center; gap:12px; flex:0 0 auto; }
	.pg-dir { display:inline-flex; align-items:center; justify-content:center; width:34px; height:32px; padding:0; border:1px solid transparent; background:none; color:var(--text-sub); border-radius:6px; cursor:pointer; }
	.pg-dir:hover:not(.off) { background:#F9FAFB; color:var(--brand); }
	.pg-dir.off { opacity:.45; cursor:not-allowed; }
	.page-btn { min-width:32px; height:32px; padding:0 2px; display:inline-flex; align-items:center; justify-content:center; gap:2px; border:1px solid transparent; background:none; color:var(--text-sub); border-radius:6px; font-size:13px; cursor:pointer; font-variant-numeric:tabular-nums; }
	.page-btn:hover:not(.on) { background:#F9FAFB; color:var(--text); }
	.page-btn.on { background:var(--brand); border-color:var(--brand); color:#fff; font-weight:600; }
	.pg-gap { color:var(--text-sub); font-size:12px; letter-spacing:1px; user-select:none; }
	.pg-meta { color:var(--text-sub); font-size:12px; }
	.pg-size { display:inline-flex; align-items:center; gap:7px; font-size:12px; color:var(--text-sub); }
	.pg-size-label { white-space:nowrap; }
	.pg-picker { height:32px; padding:0 8px; border:1px solid var(--border); border-radius:6px; background:var(--surface); color:var(--text); font-size:13px; }
	.pg-picker:focus { outline:none; border-color:var(--brand); }
	@media (max-width:419px) {
	  .pg-meta, .pg-size-label { display:none; }
	  .pg-wrap { justify-content:center; row-gap:10px; }
	  .pg-navs { order:1; width:100%; }
	  .pg-right { order:2; }
	}


/* summary & footer of list */
.list-foot { padding:10px 18px; color:var(--text-sub); font-size:12px; }

/* ---------- modal ---------- */
.modal-root[hidden] { display:none; }
.modal-root { position:fixed; inset:0; background:rgba(16,24,40,.45); display:flex; align-items:center; justify-content:center; z-index:100; padding:18px; }
.modal-box { width:100%; max-width:520px; max-height:calc(100vh - 40px); overflow:auto; background:var(--surface); border-radius:var(--radius); box-shadow:0 18px 40px rgba(16,24,40,.18); display:flex; flex-direction:column; }
.modal-head { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--border); }
.modal-title { font-size:17px; font-weight:600; }
.modal-x { width:32px;height:32px;border:none;background:none;color:var(--text-sub); border-radius:6px; display:inline-flex;align-items:center;justify-content:center; }
.modal-x:hover { background:#F2F4F7; color:var(--text); }
.modal-body { padding:20px; }
.modal-foot { display:flex; justify-content:flex-end; gap:10px; padding:14px 20px; border-top:1px solid var(--border); }
.del-body { color:var(--text); font-size:14px; }
.del-warn { margin-top:8px; background:var(--danger-bg); color:var(--danger); border-radius:6px; padding:8px 10px; font-size:12px; }

/* qr big view */
.qr-big { display:flex; flex-direction:column; align-items:center; text-align:center; }
.qr-big img { width:260px; max-width:min(260px,72vw); height:auto; border:1px solid var(--border); border-radius:8px; }
.qr-name { font-size:14px; font-weight:500; margin:12px 0 2px; }
.qr-sub { color:var(--text-sub); font-size:12px; }
.qr-load { min-height:120px; display:flex; align-items:center; justify-content:center; }

/* toast */
.toast-layer { position:fixed; top:84px; right:20px; z-index:200; display:flex; flex-direction:column; gap:8px; max-width:320px; }
.toast { background:var(--text); color:#fff; padding:10px 14px; border-radius:8px; font-size:13px; box-shadow:0 6px 18px rgba(16,24,40,.16); display:flex; gap:8px; align-items:flex-start; animation:tin .18s ease-out; }
.toast.err { background:var(--danger); }
.toast.ok .tic { color:#7EF0C3; margin-top:1px; }
.toast.err .tic { color:#FFD3CF; margin-top:1px; }
@keyframes tin { from { opacity:0; transform:translateY(-6px);} to {opacity:1; transform:none;} }

/* responsive */
@media (max-width:1099px) {
    .split { grid-template-columns:1fr; }
    .form-anchor { position:static; }
}
@media (max-width:767px) {
    .shell { padding-top:calc(var(--nav-h) + 16px); padding-left:12px; padding-right:12px; }
    .nav-inner { padding:0 12px; }
    .brand-title { font-size:13px; }
    .brand-sub, .nav-internal { display:none; }
    .nav-status .cs-text { display:none; }
    .view-card.formview { padding:16px; }
    table.grid { display:none; }
    .cardgrid { display:grid; grid-template-columns:1fr; gap:12px; padding:12px; }
    .card-item { border:1px solid var(--border); border-radius:var(--radius); }
    .carditem-head { padding:12px 14px; border-bottom:1px solid var(--border); display:flex; align-items:flex-start; gap:14px; }
    .carditem-thumb { width:56px;height:56px;flex:0 0 auto; border:1px solid var(--border); border-radius:6px; padding:3px; background:#fff; object-fit:contain; cursor:pointer; }
    .carditem-name { font-weight:600; font-size:15px; }
    .carditem-name .cls { display:inline-flex; margin-left:6px; transform:translateY(-1px);}
    .carditem-meta { padding:8px 14px; }
    .cmeta { display:flex; gap:8px; align-items:center; padding:5px 0; color:var(--text-sub); font-size:13px; }
    .cmeta .cv { color:var(--text); }
    .op-mobile { display:flex; gap:6px; padding:8px 14px 14px; }
    .op-mobile .iconbtn { width:auto; height:44px; flex:1; }
}
@media (min-width:768px) { .cardgrid { display:none; } }
@media (min-width:1100px) { }
.iconbtn-disabled{opacity:.45;pointer-events:none;}
.tt { position:relative; }
.tt:hover::after { content:attr(data-tip); position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%);
    background:var(--text); color:#fff; font-size:12px; padding:4px 8px; border-radius:5px; white-space:nowrap; z-index:40; pointer-events:none; }
.table-scroll::-webkit-scrollbar{height:8px;} .table-scroll::-webkit-scrollbar-thumb{background:#D0D5DD;border-radius:4px;}
::-webkit-scrollbar{width:8px;height:8px;} ::-webkit-scrollbar-thumb{background:#CBD2DC;border-radius:4px;}

/* ============ CSP 合规 / 交互补充 (local layer) ============ */
.loaderspin { display:none; }
.btn.loading .loaderspin { display:inline-flex; }
button[disabled] { cursor:not-allowed; }

.form-hint.reqfill { margin: -6px 0 14px; color:var(--text-sub); }
.req-star { color:var(--danger); font-weight:600; margin-left:2px; }
.req-mark { float:right; font-weight:normal; color:var(--text-sub); }
.form-grid .fg > label { display:flex; align-items:center; justify-content:space-between; }
.form-grid .fg > label .lbltxt { font-weight:500; }
.matching { display:flex; align-items:center; gap:8px; }
.matching input { flex:1; min-width:0; }
.fstatus-ok.show { display:inline-flex; }

.stat-cell { cursor:pointer; }
.stat-cell:hover { background:#FAFBFC; }
.stat-cell.on { background:var(--brand-light); box-shadow:inset 0 -2px 0 var(--brand); }
.stat-cell.on .v, .stat-cell.on .k { color:var(--brand); }

.op-cell { display:flex; gap:2px; }
.op-cell .op-btn { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border:none; background:none; border-radius:6px; color:var(--text-sub); }
.op-cell .op-btn:hover { background:var(--brand-light); color:var(--brand); }
.op-cell .op-btn.del:hover { background:var(--danger-bg); color:var(--danger); }
.op-mobile .op-btn { display:flex; flex:1; align-items:center; justify-content:center; gap:5px; height:44px; border:1px solid var(--border); background:var(--surface); color:var(--text); border-radius:var(--radius-sm); font-size:13px; }
.op-mobile .op-btn svg { flex:0 0 auto; }
.op-mobile .op-btn:hover { border-color:var(--border-strong); }
.op-mobile .op-btn.del:hover { background:var(--danger-bg); border-color:var(--danger); }

.carditem-head { position:relative; display:flex; align-items:center; gap:16px; padding:14px; }
.cardinfo { flex:1 1 auto; min-width:0; overflow:hidden; }
.carditem-head .carditem-status { flex:0 0 auto; margin:0; }
.carditem-sub { overflow:hidden; text-overflow:ellipsis; }
.carditem-ava { width:44px;height:44px; flex:0 0 auto; border-radius:10px; background:var(--brand-light); color:var(--brand); display:flex; align-items:center; justify-content:center; font-size:18px; font-weight:600; }
.cardinfo { min-width:0; }
.carditem-name { font-weight:600; font-size:15px; line-height:1.3; }
.carditem-sub { color:var(--text-sub); font-size:12px; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.carditem-status { margin-top:2px; }

.contact-chip { border:none; background:none; padding:2px 0; color:var(--text); font-size:13px; cursor:default; font-family:inherit; }
.contact-chip.copyable { cursor:pointer; color:var(--text-sub); }
.contact-chip.copyable:hover { color:var(--brand); text-decoration:underline; }
.cmeta .cv.copyable { cursor:pointer; color:var(--brand); text-decoration:none; }
.cmeta .cv.copyable:hover { text-decoration:underline; }

.tl-controls select { width:auto; min-width:132px; height:38px; font-size:13px; flex:0 1 auto; }
.searchbox, .searchbox input { min-width:0; }
.toolbar-wrap { display:flex; align-items:center; gap:12px; flex-wrap:wrap; justify-content:space-between; }

.del-summary-cell { margin:8px 0 4px; }
.del-summary-cell .dsc-line { font-weight:600; }
.del-summary-cell .dsc-sub { color:var(--text-sub); font-size:13px; }

.qr-big-img { width:240px; max-width:min(240px, 70vw); margin:4px auto 14px; }
.qr-load { min-height:180px; display:flex; align-items:center; justify-content:center; }
.qr-meta, .qr-name, .qr-sub { text-align:center; }
.qr-name { font-weight:600; font-size:15px; margin-top:6px; }
.qr-empty { display:flex; flex-direction:column; align-items:center; gap:10px; padding:40px 0; color:var(--text-sub); }

.upl .small-upload { display:flex; flex-direction:column; gap:8px; }
.upload-drop.small { padding:8px 12px; flex-direction:row; gap:8px; justify-content:flex-start; }
.upload-drop input[type=file] { display:none; }
.hidden { display:none !important; }

/* ---------- 导航/整页横向溢出防护（移动窄屏） ---------- */
html, body { overflow-x:hidden; }
@media (max-width:767.98px) {
  .nav-right { gap:4px; }
  .nav-right .btn-outline { height:34px; padding:0 9px; font-size:12.5px; border-radius:6px; }
  .nav-right .btn-outline svg { width:13px; height:13px; }
  .nav-status, .nav-internal { flex:0 0 auto; }
}
@media (max-width:559px) {
  .nav-inner { padding:0 8px; gap:6px; }
  .brand-meta { display:none; }
  .nav-inner .nav-logo { flex:none; }
}
.carditem-meta,
.carditem-meta .cv,
.mobile-only-soft-wrap { overflow-wrap:anywhere; }

/* 卡片最小宽压制：轨道可被压回 0，防止 min-content 把卡片往右顶宽 */
/* 卡片最小宽压制：轨道与元素统统不能用自己的 min-content 把卡片顶宽 */
.cardgrid { grid-template-columns:minmax(0,1fr); min-width:0; max-width:100%; display:grid; overflow:hidden; }
.cardgrid > .card-item { min-width:0; max-width:100%; width:100%; }
.cardgrid .carditem-head,
.cardgrid .carditem-meta,
.cardgrid .cardinfo,
.cardgrid .op-mobile { min-width:0; max-width:100%; }
.cardgrid .cmeta { width:100%; min-width:0; max-width:100%; }
.cardgrid .cmeta .ck { flex:0 0 auto; }
.cardgrid .cmeta .cv { flex:1 1 auto; min-width:0; overflow-wrap:anywhere; word-break:break-word; }
.cardgrid .op-mobile .op-btn { min-width:0; overflow:hidden; }
.cardgrid .op-mobile .lbl { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media (max-width:767.98px) { .cardgrid { grid-template-columns:minmax(0,1fr); } }

/* ---------- 视觉：logo 放大 + 头图/整屏背景 ---------- */
.navbar .nav-logo { height:40px; }
body.auth-body .auth-logo { height:76px; margin-bottom:8px; }
/* app 录入页：图片铺满整屏作背景（导航栏下方起），内容卡片直接盖在图片上做毛玻璃 */
body.app-entry .page-hero { position:fixed; top:var(--nav-h); left:0; right:0; bottom:0; z-index:1; overflow:hidden; margin:0; background:#000; }
body.app-entry .page-hero .page-hero-img { width:100%; height:100%; object-fit:cover; object-position:center 20%; }
/* app 录入页正文：在首屏背景图内垂直居中，卡片略微下移 */
body.app-entry .shell { position:relative; z-index:2; margin-top:var(--nav-h); min-height:calc(100vh - var(--nav-h)); display:flex; align-items:center; padding-top:0; }
body.app-entry .shell > .split { flex:0 1 auto; width:100%; max-width:820px; margin:0 auto; }
/* 登录页：图片铺满整屏作背景，白卡浮于上层居中（卡片覆盖图片） */
body.auth-body.auth-hero { position:relative; display:flex; align-items:center; justify-content:center; min-height:100vh; padding:24px; }
body.auth-body.auth-hero .page-hero { position:fixed; inset:0; z-index:0; overflow:hidden; margin:0; background:#000; }
body.auth-body.auth-hero .page-hero-img { width:100%; height:100%; object-fit:cover; }
body.auth-body.auth-hero main.auth-card { position:relative; z-index:2; margin:auto; width:100%; max-width:400px; background:rgba(255,255,255,.55); backdrop-filter:blur(22px) saturate(150%); -webkit-backdrop-filter:blur(22px) saturate(150%); border:1px solid rgba(255,255,255,.45); border-radius:26px; box-shadow:0 28px 70px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.6); overflow:hidden; }
body.auth-body.auth-hero main.auth-card::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(145deg, rgba(255,255,255,.55), rgba(255,255,255,.05)); opacity:.5; border-radius:inherit; }
body.auth-body.auth-hero main.auth-card > * { position:relative; z-index:1; }

/* 录入页：内容区卡片统一液态毛玻璃（复用登录风格，压在整屏背景图上） */
body.app-entry .shell .card,
body.app-entry .shell .view-card.formview {
  position:relative;
  background:rgba(255,255,255,.70);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  border:1px solid rgba(255,255,255,.55);
  box-shadow:0 18px 50px rgba(20,30,60,.16), inset 0 1px 0 rgba(255,255,255,.75);
  overflow:hidden;
}