:root { --ink:#17362e; --muted:#687971; --paper:#f5f4ed; --white:#fffefa; --line:#dce2d8; --green:#205843; --lime:#e3edbc; --amber:#86652a; --red:#a44639; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Microsoft YaHei UI","Microsoft YaHei","Noto Sans CJK SC",sans-serif; line-height:1.6; }
[hidden] { display:none !important; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; border-radius:6px; min-height:44px; border:1px solid transparent; padding:10px 17px; font-weight:600; transition:background .15s, transform .15s; }
button:hover:not(:disabled) { transform:translateY(-1px); }
button:disabled { opacity:.48; cursor:default; }
button:focus-visible,a:focus-visible { outline:3px solid #9cae63; outline-offset:3px; }
.primary { color:var(--white); background:var(--green); }
.primary:hover:not(:disabled) { background:#123e2d; }
.secondary { color:var(--ink); background:#edf0e4; border-color:var(--line); }
.quiet { background:transparent; border-color:var(--line); }
.full { width:100%; margin-top:18px; }
.topbar { display:flex; align-items:center; justify-content:space-between; padding:22px 5vw; border-bottom:1px solid var(--line); background:var(--white); }
.brand { display:flex; gap:13px; align-items:center; text-decoration:none; color:var(--ink); font-weight:750; font-size:20px; }
.brand-mark { background:var(--green); color:var(--lime); width:45px; height:45px; display:grid; place-items:center; border-radius:5px; font-family:Georgia,serif; font-size:30px; }
.brand small { display:block; font-size:11px; font-weight:400; color:var(--muted); letter-spacing:2px; }
.top-actions { display:flex; gap:18px; align-items:center; font-size:13px; }
.network { background:#f0f2e9; padding:8px 12px; border:1px solid var(--line); border-radius:30px; }
.network i { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--green); margin-right:8px; }
main { max-width:1320px; margin:auto; padding:54px 5vw 70px; min-height:calc(100vh - 180px); }
.login-layout { display:grid; grid-template-columns:1.3fr 1fr; gap:9%; align-items:center; padding:20px 0 30px; }
.eyebrow { font-family:Consolas,"Cascadia Mono",monospace; letter-spacing:2px; font-size:11px; color:var(--muted); margin:0 0 16px; }
h1 { font-family:"Noto Serif CJK SC","Songti SC",SimSun,serif; line-height:1.3; letter-spacing:-1px; font-size:45px; font-weight:600; margin:0 0 22px; }
.intro h1 { font-size:clamp(40px,4.7vw,65px); }
h2 { font-size:20px; letter-spacing:.2px; margin:0 0 12px; }
p { margin:0 0 15px; }
.lead { max-width:440px; font-size:16px; color:var(--muted); }
.journey { list-style:none; padding:0; margin:32px 0; }
.journey li { display:flex; gap:18px; padding:12px 0; align-items:center; border-bottom:1px solid var(--line); }
.journey span { font-family:Georgia,serif; color:var(--green); font-size:20px; }
.boundary { background:var(--lime); padding:20px 23px; border-left:3px solid var(--green); max-width:465px; }
.boundary p { font-size:13px; margin:7px 0 0; color:#4f6350; }
.card { background:var(--white); border:1px solid var(--line); border-radius:8px; padding:30px; margin-bottom:22px; }
.login-card { padding:36px; box-shadow:0 18px 40px #25352b08; }
.login-card h2 { font-size:25px; margin-top:19px; }
.pill { display:inline-block; font-size:11px; letter-spacing:1px; background:#eef0e5; border:1px solid var(--line); padding:4px 9px; border-radius:30px; }
.muted { color:var(--muted); font-size:14px; font-weight:400; }
.caption { font-size:12px; color:var(--muted); margin:12px 0 0; }
label { display:block; font-size:13px; font-weight:600; margin:18px 0 7px; }
input,select,textarea { width:100%; color:var(--ink); background:#fafbf6; border:1px solid #cdd6c9; border-radius:5px; min-height:46px; padding:10px 12px; font-size:14px; }
input::placeholder,textarea::placeholder { color:#97a095; }
input:focus,select:focus,textarea:focus { outline:2px solid #c1d49d; outline-offset:1px; border-color:var(--green); }
input:disabled { background:#f0f0e9; }
textarea { resize:vertical; }
.setup-note { border-top:1px solid var(--line); padding-top:18px; margin-top:24px; font-size:13px; color:var(--amber); }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-card { display:grid; grid-template-columns:1fr 1.4fr; gap:7%; }
.form-card h2 { font-size:25px; margin-top:20px; }
.form-card label:first-child { margin-top:0; }
.section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:28px; }
.section-head h1 { font-size:36px; }
.stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:24px; }
.stat { border:1px solid var(--line); padding:19px 24px; border-radius:6px; background:var(--white); }
.stat small { display:block; color:var(--muted); font-size:12px; }
.stat strong { font-family:Georgia,serif; font-size:31px; font-weight:400; }
.panel-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:15px; }
.table-wrap { overflow-x:auto; }
table { border-collapse:collapse; width:100%; font-size:13px; }
th { text-align:left; color:var(--muted); background:#f3f5eb; font-size:11px; font-weight:500; white-space:nowrap; padding:12px; }
td { border-bottom:1px solid var(--line); padding:16px 12px; vertical-align:top; }
.address-cell { max-width:270px; overflow-wrap:anywhere; font-family:Consolas,"Cascadia Mono",monospace; font-size:12px; }
.note-cell { max-width:210px; overflow-wrap:anywhere; }
.state { display:inline-block; font-size:11px; padding:4px 9px; border-radius:30px; white-space:nowrap; }
.pending,.blocked { background:#f4edda; color:var(--amber); }
.approved { background:#e7efdb; color:var(--green); }
.rejected { background:#f7e7df; color:var(--red); }
.review-actions { display:flex; gap:8px; margin-top:8px; }
.review-actions button { font-size:12px; min-height:32px; padding:4px 10px; }
.review-note { min-width:150px; min-height:32px; font-size:12px; }
.empty { padding:36px 12px; text-align:center; color:var(--muted); }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.callout { border-left:3px solid #b6c4a3; padding:15px 17px; background:#f1f4e9; margin-top:23px; font-size:12px; white-space:pre-wrap; overflow-wrap:anywhere; }
.button-row { display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
.message { padding:13px 18px; background:#e8efde; color:var(--green); border:1px solid #cddaba; border-radius:5px; margin-bottom:24px; font-size:14px; }
.message.error { background:#f8e9e2; border-color:#e7c9bd; color:var(--red); }
.demo-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.demo-steps p { color:var(--muted); font-size:14px; }
.step-number { font-family:Georgia,serif; font-size:33px; display:block; margin-bottom:28px; color:#a1b087; }
footer { display:flex; align-items:center; justify-content:space-between; gap:25px; padding:22px 5vw; border-top:1px solid var(--line); font-size:11px; color:var(--muted); }
footer p { margin:0; max-width:570px; }
footer span { white-space:nowrap; font-family:Consolas,"Cascadia Mono",monospace; }
@media(max-width:850px) { .top-actions { gap:8px; } .network { display:none; } main { padding-top:30px; } .login-layout,.admin-grid,.form-card { grid-template-columns:1fr; gap:25px; } .login-card { max-width:520px; width:100%; margin:auto; } .demo-steps { grid-template-columns:1fr; gap:0; } .stats { grid-template-columns:repeat(2,1fr); } .section-head { flex-wrap:wrap; } footer { flex-wrap:wrap; gap:10px; } }
@media(prefers-reduced-motion:reduce) { button { transition:none; } button:hover:not(:disabled) { transform:none; } }
.simple-main { max-width:580px; padding:44px 24px; }
.simple-main:has(#workspace:not([hidden])) { max-width:1120px; }
.simple-main h1 { font-size:28px; margin-bottom:24px; }
.simple-main a { color:var(--green); }
#contract-batches { margin:18px 0; }
#contract-batches h3 { margin-bottom:6px; }
#contract-batch-rows td:nth-child(-n+4), #transfer-rows td:nth-child(2), #transfer-rows td:nth-child(3) { white-space:nowrap; }
#recipient-details { margin:18px 0; }
#recipient-details summary { cursor:pointer; color:var(--green); }
