:root { --ink:#242260; --ink2:#302d86; --paper:#fbfaf7; --white:#fff; --gold:#c19a4a; --gold2:#ad8439; --muted:#6f7082; --line:rgba(45,42,131,.15); --danger:#8d3f4b; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { min-height:100vh; margin:0; color:var(--ink); background:radial-gradient(circle at 85% 4%,rgba(167,131,79,.09),transparent 25%),var(--paper); font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
.admin-nav { width:min(1320px,calc(100% - 32px)); height:72px; margin:16px auto 0; padding:0 18px 0 22px; display:flex; align-items:center; justify-content:space-between; border:1px solid var(--line); border-radius:10px; background:rgba(255,255,255,.76); backdrop-filter:blur(18px); }
.admin-brand { display:flex; align-items:center; gap:11px; }
.admin-brand-image { gap:0; }
.admin-official-logo { width:142px; height:58px; display:block; overflow:hidden; border:1px solid rgba(45,42,131,.12); border-radius:5px 16px 5px 16px; background:#fff; box-shadow:0 9px 24px rgba(31,29,98,.1); }
.admin-official-logo img { width:100%; height:100%; display:block; object-fit:contain; transform:scale(2.2); transform-origin:50% 49%; }
.admin-logo-frame { width:50px; height:50px; display:block; flex:0 0 auto; position:relative; overflow:hidden; border:1px solid rgba(154,116,65,.38); border-radius:5px 14px 5px 14px; background:radial-gradient(circle at 50% 35%,#172c38,#030506 72%); box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 8px 20px rgba(39,17,20,.12); }
.admin-logo-frame img { width:100%; height:100%; display:block; object-fit:contain; transform:scale(2.05); transform-origin:50% 42%; }
.admin-brand-wording { display:block; }
.admin-brand-wording strong { color:var(--ink); font-family:Georgia,"Songti SC",serif; font-size:15px; letter-spacing:.06em; }
.admin-brand-wording small { color:var(--gold2); font-size:6px; font-weight:700; letter-spacing:.18em; }
.admin-brand>span.admin-symbol { width:38px; height:38px; display:grid; place-items:center; border-radius:9px 9px 9px 2px; color:#e5d5b0; background:linear-gradient(145deg,#302d86,#171642); font-weight:800; }
.admin-brand strong,.admin-brand small { display:block; line-height:1; }
.admin-brand strong { font-size:17px; letter-spacing:.08em; }
.admin-brand small { margin-top:5px; color:var(--muted); font-size:7px; letter-spacing:.2em; }
.public-link { padding:11px 14px; border:1px solid var(--line); border-radius:10px; font-size:10px; }
.public-link span { margin-left:12px; color:var(--gold2); }
main { width:min(1240px,calc(100% - 40px)); margin:0 auto; }
.login-view { min-height:calc(100vh - 170px); padding:70px 4%; display:grid; grid-template-columns:1fr .72fr; align-items:center; gap:110px; }
.eyebrow { color:#716f82; font-size:9px; font-weight:700; letter-spacing:.17em; }
.eyebrow::before { content:""; width:24px; height:2px; margin-right:9px; display:inline-block; vertical-align:middle; background:var(--gold); }
.login-copy h1,.dashboard-heading h1 { margin:25px 0 22px; font-family:Georgia,"Songti SC",serif; font-size:clamp(52px,6vw,82px); font-weight:500; line-height:1.02; letter-spacing:-.055em; }
.login-copy>p { max-width:560px; color:var(--muted); font-size:14px; line-height:1.85; }
.security-points { margin-top:35px; display:flex; flex-wrap:wrap; gap:10px 22px; color:#66647a; font-size:9px; }
.security-points span::first-letter { color:var(--gold2); }
.login-card { padding:43px; border:1px solid rgba(201,180,134,.3); border-radius:3px 24px 3px 24px; background:linear-gradient(145deg,#302d86,#14133a); box-shadow:0 35px 90px rgba(24,22,72,.2); color:white; }
.login-icon { width:47px; height:47px; margin-bottom:34px; display:grid; place-items:center; border:1px solid rgba(216,200,143,.3); border-radius:50%; color:var(--gold); font-size:21px; }
.login-card>span { color:rgba(255,255,255,.4); font-size:8px; letter-spacing:.14em; }
.login-card h2 { margin:10px 0 9px; font-family:Georgia,"Songti SC",serif; font-size:29px; font-weight:500; }
.login-card>p { margin:0 0 29px; color:rgba(255,255,255,.4); font-size:9px; }
.login-card label { color:rgba(255,255,255,.55); font-size:9px; }
.login-card input { width:100%; margin:9px 0 16px; padding:14px 15px; color:white; border:1px solid rgba(200,174,120,.28); border-radius:4px 12px 4px 12px; outline:0; background:rgba(45,42,131,.28); transition:.2s ease; }
.login-card input:hover { background:rgba(45,42,131,.38); }
.login-card input:focus { border-color:var(--gold); background:rgba(45,42,131,.45); box-shadow:0 0 0 3px rgba(200,174,120,.13); }
.login-card button { width:100%; padding:14px; display:flex; justify-content:space-between; color:var(--ink); border:0; border-radius:4px 10px 4px 10px; background:linear-gradient(135deg,#ded0ac,#b89a65); cursor:pointer; font-weight:700; }
.login-status { min-height:15px; margin:12px 0 0 !important; color:#e0b6a9 !important; text-align:center; }
.dashboard { padding:70px 0 90px; }
.dashboard-heading { margin-bottom:40px; display:flex; align-items:flex-end; justify-content:space-between; gap:40px; }
.dashboard-heading h1 { margin:13px 0 8px; font-size:clamp(43px,5vw,64px); }
.dashboard-heading p { margin:0; color:var(--muted); font-size:11px; }
.dashboard-actions { display:flex; gap:8px; }
.dashboard-actions button { padding:10px 13px; border:1px solid var(--line); border-radius:9px; background:rgba(255,255,255,.65); cursor:pointer; font-size:9px; }
.dashboard-actions .logout { color:#8f554a; }
.stat-grid { margin-bottom:18px; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.stat-grid article { min-height:155px; padding:22px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:4px 20px 4px 20px; background:rgba(255,255,255,.75); }
.stat-grid span { color:var(--muted); font-size:9px; }
.stat-grid strong { margin:auto 0 7px; font-family:Georgia,serif; font-size:40px; font-weight:500; }
.stat-grid small { color:#98a09c; font-size:8px; }
.stat-grid .gold-stat { color:white; border-color:transparent; background:linear-gradient(145deg,#302d86,#14133a); box-shadow:0 17px 40px rgba(24,22,72,.13); }
.gold-stat span,.gold-stat small { color:rgba(255,255,255,.46); }
.gold-stat strong { color:#eadca8; }
.records-panel { overflow:hidden; border:1px solid var(--line); border-radius:5px 25px 5px 25px; background:rgba(255,255,255,.82); box-shadow:0 22px 60px rgba(16,35,29,.065); }
.records-toolbar { padding:23px 25px; display:flex; justify-content:space-between; align-items:center; gap:25px; border-bottom:1px solid var(--line); }
.records-toolbar>div>span { font-family:Georgia,"Songti SC",serif; font-size:19px; }
.records-toolbar p { margin:5px 0 0; color:var(--muted); font-size:8px; }
.filters { display:flex; gap:8px; }
.search-box { min-width:240px; padding:0 11px; display:flex; align-items:center; gap:7px; border:1px solid rgba(45,42,131,.2); border-radius:9px; background:#ecebf6; transition:.2s ease; }
.search-box:focus-within { border-color:#302d86; background:#ffffff; box-shadow:0 0 0 3px rgba(45,42,131,.1); }
.search-box span { color:#8a958f; }
.search-box input { width:100%; padding:10px 0; border:0; outline:0; background:transparent; font-size:9px; }
.filters select { padding:10px 30px 10px 11px; color:var(--ink); border:1px solid rgba(45,42,131,.2); border-radius:9px; outline:0; background:#ecebf6; font-size:9px; }
.filters select:focus { border-color:#302d86; background:#ffffff; box-shadow:0 0 0 3px rgba(45,42,131,.1); }
.record-head,.record-row { display:grid; grid-template-columns:1.15fr 1.1fr 1.1fr .8fr .8fr 40px; gap:15px; align-items:center; }
.record-head { padding:13px 25px; color:#8d9691; border-bottom:1px solid var(--line); background:#f4f1e9; font-size:8px; }
.record-row { padding:17px 25px; border-bottom:1px solid var(--line); transition:background .18s; }
.record-row:hover { background:rgba(216,200,143,.08); }
.person-cell { display:flex; align-items:center; gap:10px; min-width:0; }
.person-avatar { width:35px; height:35px; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; color:var(--ink); background:var(--gold); font-family:Georgia,"Songti SC",serif; font-size:12px; }
.person-cell strong,.loan-cell strong,.contact-cell a { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:10px; }
.person-cell small,.loan-cell small,.contact-cell small,.date-cell { display:block; margin-top:4px; color:#8b9690; font-size:7px; }
.contact-cell a { color:#302d86; }
.status-select { width:100%; padding:8px; color:var(--ink); border:1px solid rgba(45,42,131,.2); border-radius:7px; outline:0; background:#ecebf6; font-size:8px; }
.status-select:focus { border-color:#302d86; background:#ffffff; box-shadow:0 0 0 3px rgba(45,42,131,.1); }
.delete-record { width:30px; height:30px; border:1px solid rgba(161,91,78,.15); border-radius:8px; color:var(--danger); background:transparent; cursor:pointer; }
.empty-state { padding:80px 20px; text-align:center; }
.empty-state>span { width:50px; height:50px; margin:auto; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--gold2); }
.empty-state h3 { margin:15px 0 7px; font-family:Georgia,"Songti SC",serif; font-weight:500; }
.empty-state p { color:var(--muted); font-size:9px; }
.records-footer { padding:15px 25px; display:flex; justify-content:space-between; color:#9ca39f; background:#f7f5ef; font-size:8px; }
.records-footer button { color:#a16a5f; border:0; border-bottom:1px solid rgba(161,106,95,.25); background:transparent; cursor:pointer; font-size:8px; }
.admin-footer { width:min(1240px,calc(100% - 40px)); margin:0 auto; padding:23px 0 30px; display:flex; justify-content:space-between; color:#9aa29e; border-top:1px solid var(--line); font-size:8px; }
@media(max-width:900px){.login-view{grid-template-columns:1fr;gap:45px;padding:60px 0}.login-card{max-width:560px;width:100%;margin:auto}.stat-grid{grid-template-columns:repeat(2,1fr)}.dashboard-heading,.records-toolbar{align-items:flex-start;flex-direction:column}.filters{width:100%}.search-box{min-width:0;flex:1}.record-head{display:none}.record-row{grid-template-columns:1fr 1fr 40px;gap:12px}.person-cell{grid-column:1 / 3}.loan-cell,.contact-cell,.date-cell{padding:9px;border:1px solid var(--line);border-radius:8px}.status-select{grid-column:1 / 3}.delete-record{grid-column:3;grid-row:1}}
@media(max-width:560px){.admin-nav{width:calc(100% - 20px);margin-top:10px}.public-link{font-size:0}.public-link span{margin:0;font-size:13px}main{width:calc(100% - 28px)}.login-view{padding:45px 0}.login-copy h1{font-size:49px}.login-card{padding:28px}.dashboard{padding-top:48px}.dashboard-heading{gap:22px}.dashboard-actions{width:100%}.dashboard-actions button{flex:1}.stat-grid{grid-template-columns:1fr 1fr}.stat-grid article{min-height:130px;padding:17px}.records-toolbar{padding:20px}.filters{flex-direction:column}.filters select{width:100%}.record-row{padding:16px}.record-row{grid-template-columns:1fr 40px}.person-cell{grid-column:1}.loan-cell,.contact-cell,.date-cell,.status-select{grid-column:1 / 3}.delete-record{grid-column:2}.records-footer,.admin-footer{gap:12px;flex-direction:column}}








