* { box-sizing: border-box; }
:root { --ink:#272b35; --muted:#768095; --line:#dfe4eb; --soft:#f5f7fa; --cyan:#0ca99b; --pink:#ed527d; --gold:#d99d00; --green:#229b5b; --danger:#c94455; }
html, body { margin:0; min-height:100%; color:var(--ink); background:#eef1f5; font:14px/1.5 "PingFang SC","Microsoft YaHei",system-ui,sans-serif; letter-spacing:0; }
button, input, select, textarea { font:inherit; }
button, a { transition:border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
button { min-height:38px; border:1px solid #ccd3dd; border-radius:7px; padding:7px 12px; color:var(--ink); background:#fff; cursor:pointer; font-weight:850; }
button:hover, .head-actions a:hover, .link-grid a:hover { border-color:#8acfc8; box-shadow:0 6px 15px rgba(43,50,67,.08); }
button:disabled { cursor:default; opacity:.5; }
button.primary { border-color:#0ca99b; color:#fff; background:#0ca99b; }
button.danger { border-color:#e5a5ad; color:#9d2837; background:#fff1f3; }
button.secondary { color:#536074; background:#f8f9fb; }
input, select, textarea { width:100%; min-height:38px; border:1px solid #ccd3dd; border-radius:7px; padding:7px 10px; color:var(--ink); background:#fff; outline:none; }
input:focus, select:focus, textarea:focus { border-color:var(--cyan); box-shadow:0 0 0 3px rgba(12,169,155,.12); }
label { display:grid; gap:5px; color:#596277; font-size:12px; font-weight:850; }
pre { margin:0; min-height:120px; max-height:340px; overflow:auto; border:1px solid #d9dee7; border-radius:8px; padding:12px; color:#364054; background:#f7f9fb; white-space:pre-wrap; overflow-wrap:anywhere; }
.admin-shell { width:min(1440px,calc(100% - 32px)); margin:0 auto; padding:24px 0 50px; }
.page-head, .section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.page-head { padding:8px 2px 22px; }
h1, h2, h3, p { margin:0; }
h1 { margin-top:4px; font-size:30px; }
h2 { font-size:20px; }
h3 { font-size:15px; }
.page-head p, .section-head p, .muted { color:var(--muted); }
.eyebrow { color:var(--cyan); font-size:11px; font-weight:1000; }
.head-actions { display:flex; gap:8px; }
.head-actions a, .link-grid a { border:1px solid #d3d9e2; border-radius:7px; padding:8px 11px; color:#485267; background:#fff; font-weight:850; text-decoration:none; }
.admin-tabs { position:sticky; z-index:10; top:0; display:flex; gap:5px; overflow-x:auto; padding:10px; border:1px solid var(--line); border-radius:8px 8px 0 0; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); }
.admin-tabs button { flex:0 0 auto; min-width:104px; border-color:transparent; background:transparent; }
.admin-tabs button.is-active { border-color:#b6e3de; color:#087c72; background:#eaf8f6; }
.admin-panel { display:grid; gap:18px; min-width:0; padding:22px; border:1px solid var(--line); border-top:0; border-radius:0 0 8px 8px; background:#fff; box-shadow:0 16px 40px rgba(43,50,67,.07); }
.admin-panel[hidden] { display:none; }
.pill { align-self:center; padding:5px 9px; border-radius:6px; color:#087c72; background:#eaf8f6; font-size:12px; font-weight:900; }
.status-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.status-grid div { min-width:0; padding:13px; border-left:3px solid #b8c0ce; background:#f7f8fa; }
.status-grid span { display:block; color:var(--muted); font-size:11px; font-weight:800; }
.status-grid strong { display:block; margin-top:5px; overflow:hidden; font-size:20px; text-overflow:ellipsis; white-space:nowrap; }
.check-list { display:grid; gap:7px; }
.check-row { display:grid; grid-template-columns:110px 76px minmax(0,1fr); gap:10px; align-items:center; padding:9px 11px; border-left:4px solid #e4a3ad; background:#fff4f5; }
.check-row.ok { border-left-color:#77c79c; background:#f0faf4; }
.check-row em { color:var(--danger); font-style:normal; font-weight:900; }
.check-row.ok em { color:var(--green); }
.button-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px; }
.round-preview { display:grid; grid-template-columns:minmax(300px,520px) minmax(220px,1fr); gap:18px; align-items:center; }
.round-meta { min-width:0; display:grid; gap:5px; }
.round-meta span, .round-meta small { color:var(--muted); }
.round-meta strong { color:#6858ae; font-size:42px; }
.round-meta small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.composite-preview { position:relative; width:100%; aspect-ratio:2/1; overflow:hidden; border:1px solid #bbb3e1; border-radius:8px; background-color:#edf0f4; background-position:center; background-repeat:no-repeat; background-size:cover; }
.composite-preview::after { content:""; position:absolute; inset:0 50% 0 auto; border-left:3px solid rgba(255,255,255,.9); box-shadow:-1px 0 0 rgba(104,88,174,.4); }
.composite-preview i { position:absolute; inset:0 50% 0 auto; border-left:1px solid rgba(104,88,174,.22); pointer-events:none; }
.composite-preview.empty { display:grid; place-items:center; color:var(--muted); background:#f4f6f9; }
.inline-form { display:grid; grid-template-columns:160px minmax(0,1fr) 120px; gap:8px; }
.upload-layout { display:grid; grid-template-columns:240px minmax(360px,1fr) minmax(240px,.7fr); gap:16px; align-items:stretch; }
.drop-zone { place-content:center; min-height:210px; border:2px dashed #bdc6d3; border-radius:8px; padding:20px; color:#596277; background:#fafbfc; text-align:center; cursor:pointer; }
.drop-zone.is-dragging { border-color:var(--cyan); background:#eefaf8; }
.drop-zone input { display:none; }
.drop-zone span { color:var(--ink); font-size:16px; }
.question-fields { display:grid; align-content:center; gap:10px; }
.list-toolbar { display:grid; grid-template-columns:minmax(240px,1fr) auto auto; gap:8px; padding-top:14px; border-top:1px solid #e7eaf0; }
.question-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(380px,1fr)); gap:12px; }
.question-card { display:grid; grid-template-columns:180px minmax(0,1fr); gap:12px; min-width:0; border:1px solid #e0e4ea; border-radius:8px; padding:10px; background:#fff; }
.question-card .composite-preview { align-self:start; }
.question-card-body { min-width:0; display:grid; align-content:start; gap:7px; }
.question-card-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.question-card-head strong { overflow:hidden; font-size:20px; text-overflow:ellipsis; white-space:nowrap; }
.question-card small { overflow:hidden; color:var(--muted); text-overflow:ellipsis; white-space:nowrap; }
.question-card .duplicate-warning { color:#b43f51; font-weight:900; }
.question-card-actions { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.question-card-actions > input:not([type="file"]), .question-card-actions > textarea { grid-column:1 / -1; }
.question-card-actions > textarea { width:100%; resize:vertical; }
.preview-mask { position:absolute; inset:0; display:grid; grid-template-columns:repeat(20,minmax(0,1fr)); grid-template-rows:repeat(10,minmax(0,1fr)); pointer-events:none; }
.preview-mask i { border:1px solid #e1e4e9; background:rgba(255,255,255,.9); }
.preview-mask i.revealed { opacity:0; }
.composite-preview.empty .preview-mask { display:none; }
.pager { display:flex; justify-content:center; align-items:center; gap:10px; }
.gift-rule-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.gift-rule { display:grid; gap:5px; padding:13px; border:1px solid #e2e5eb; border-radius:8px; background:#fafbfc; }
.gift-rule strong { font-size:18px; }
.gift-rule code { overflow:hidden; color:#6858ae; text-overflow:ellipsis; white-space:nowrap; }
.gift-test { display:grid; grid-template-columns:150px minmax(0,1fr); gap:12px; align-items:end; }
.table-head { display:grid; align-items:center; gap:8px; padding:8px 10px; color:var(--muted); background:#f5f7f9; font-size:11px; font-weight:900; }
.gift-head, .gift-row { grid-template-columns:1.2fr 1fr 70px 70px 70px 1.4fr; }
.gift-log { max-height:430px; overflow:auto; }
.gift-row { display:grid; gap:8px; align-items:center; min-height:46px; border-bottom:1px solid #eceff3; padding:7px 10px; }
.gift-row span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gift-row .actual { color:var(--green); font-weight:900; }
.test-form { display:grid; grid-template-columns:repeat(4,minmax(120px,1fr)) auto; gap:10px; align-items:end; }
.link-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; }
@media (max-width:900px) { .status-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.upload-layout,.round-preview { grid-template-columns:1fr; }.question-list { grid-template-columns:1fr; }.gift-rule-list { grid-template-columns:1fr; }.test-form { grid-template-columns:1fr 1fr; }.link-grid { grid-template-columns:1fr 1fr; } }