:root { color-scheme: light; --yellow:#ffba00; --ink:#17181c; --muted:#7d8390; --line:#e8eaf0; --canvas:#f4f5f8; --green:#12b76a; }
* { box-sizing:border-box; }
body { margin:0; min-width:1100px; color:var(--ink); background:var(--canvas); font:14px/1.5 Inter,"PingFang SC","Microsoft YaHei",sans-serif; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
.hidden { display:none !important; }
.login-shell { min-height:100vh; display:grid; place-items:center; background:#111217; }
.login-card { width:390px; padding:42px; background:#fff; border-radius:24px; box-shadow:0 30px 80px #0008; text-align:center; }
.brand-mark { width:74px; height:74px; margin:0 auto 20px; display:grid; place-items:center; color:#111; background:var(--yellow); border-radius:22px; font-size:24px; font-weight:900; }
.login-card h1 { margin:0; font-size:26px; }
.login-card p { margin:8px 0 26px; color:var(--muted); }
.login-card input { width:100%; height:48px; margin-top:10px; padding:0 16px; border:1px solid var(--line); border-radius:12px; outline:0; }
.login-card input:focus { border-color:var(--yellow); box-shadow:0 0 0 3px #ffba0026; }
.login-card button { width:100%; height:48px; margin-top:14px; border:0; border-radius:12px; background:var(--yellow); font-weight:800; }
.error { min-height:22px; margin-top:10px; color:#e5484d; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:240px 1fr; }
.sidebar { position:sticky; top:0; height:100vh; padding:26px 18px; display:flex; flex-direction:column; color:#fff; background:#17181c; }
.logo { display:flex; align-items:center; gap:12px; padding:0 8px 28px; }
.logo span { width:42px; height:42px; display:grid; place-items:center; color:#111; background:var(--yellow); border-radius:12px; font-weight:900; }
.logo strong { font-size:17px; }
nav { display:grid; gap:8px; }
.nav-item,.logout { height:46px; padding:0 16px; border:0; border-radius:12px; color:#b9bdc8; background:transparent; text-align:left; }
.nav-item:hover,.nav-item.active { color:#111; background:var(--yellow); font-weight:700; }
.logout { margin-top:auto; color:#9297a3; }
main { padding:0 34px 50px; }
header { height:102px; display:flex; align-items:center; justify-content:space-between; }
header p,header h1 { margin:0; }
header p { color:var(--muted); font-size:12px; letter-spacing:2px; }
header h1 { margin-top:2px; font-size:26px; }
.status { padding:8px 12px; color:#087a45; background:#e9f9f0; border-radius:999px; font-weight:700; }
.status::before { content:""; display:inline-block; width:7px; height:7px; margin-right:7px; background:var(--green); border-radius:50%; }
.view { display:none; }
.view.active { display:block; }
.summary-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:16px; }
.metric { padding:24px; background:#fff; border:1px solid var(--line); border-radius:18px; }
.metric span { color:var(--muted); }
.metric strong { display:block; margin-top:10px; font-size:28px; }
.panel { background:#fff; border:1px solid var(--line); border-radius:18px; }
.welcome { min-height:280px; margin-top:18px; padding:46px; display:flex; align-items:center; justify-content:space-between; overflow:hidden; }
.welcome h2 { margin:8px 0; font-size:30px; }
.welcome p { color:var(--muted); }
.eyebrow { color:#b78000; font-size:12px; font-weight:800; letter-spacing:3px; }
.orb { width:190px; height:190px; display:grid; place-items:center; color:#17181c; background:var(--yellow); border-radius:48px; transform:rotate(8deg); font-size:76px; font-weight:900; box-shadow:0 22px 50px #ffba0052; }
.toolbar { min-height:74px; display:flex; align-items:center; justify-content:space-between; }
.toolbar h2,.toolbar p { margin:0; }
.toolbar h2 { font-size:20px; }
.toolbar p { color:var(--muted); }
.primary,.secondary { min-height:40px; padding:0 18px; border:0; border-radius:10px; font-weight:700; }
.primary { color:#17181c; background:var(--yellow); }
.secondary { color:#555; background:#f0f1f4; }
.toolbar select { height:40px; padding:0 34px 0 12px; border:1px solid var(--line); border-radius:10px; background:#fff; }
.table-wrap { overflow:hidden; }
table { width:100%; border-collapse:collapse; }
th,td { padding:16px 18px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
th { color:#7b808b; background:#fafbfc; font-size:12px; }
tr:last-child td { border-bottom:0; }
.entity { display:flex; align-items:center; gap:12px; max-width:360px; }
.entity img { width:46px; height:46px; flex:none; object-fit:cover; border-radius:10px; background:#eee; }
.entity strong,.entity small { display:block; }
.entity small { overflow:hidden; color:var(--muted); text-overflow:ellipsis; white-space:nowrap; }
.pill { display:inline-flex; padding:5px 9px; border-radius:999px; font-size:12px; font-weight:700; }
.pill.on { color:#087a45; background:#e9f9f0; }
.pill.off { color:#8a4b00; background:#fff3dc; }
.action { border:0; color:#8a6200; background:transparent; font-weight:700; }
.danger { color:#d92d20; }
.approve { color:#07864d; }
.status-select { height:34px; border:1px solid var(--line); border-radius:8px; }
dialog { width:620px; padding:0; border:0; border-radius:20px; box-shadow:0 30px 100px #0005; }
dialog::backdrop { background:#12131899; }
#editor-form { padding:26px; }
.dialog-head { display:flex; align-items:center; justify-content:space-between; }
.dialog-head h2 { margin:0; }
.dialog-head button { width:36px; height:36px; border:0; border-radius:50%; background:#f0f1f4; font-size:22px; }
.form-grid { margin-top:22px; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.field { display:grid; gap:7px; }
.field.wide { grid-column:1/-1; }
.field label { color:#616671; font-weight:700; }
.field input,.field select,.field textarea { width:100%; min-height:42px; padding:10px 12px; border:1px solid var(--line); border-radius:10px; outline:0; }
.field textarea { min-height:86px; resize:vertical; }
.dialog-actions { margin-top:24px; display:flex; justify-content:flex-end; gap:10px; }
.toast { position:fixed; right:28px; bottom:28px; padding:13px 18px; color:#fff; background:#17181c; border-radius:10px; opacity:0; transform:translateY(12px); pointer-events:none; transition:.2s; }
.toast.show { opacity:1; transform:none; }
.empty { padding:44px !important; color:var(--muted); text-align:center; }
.settings-form { padding:24px; display:grid; grid-template-columns:320px 1fr auto; gap:18px; align-items:end; }
.settings-form .wide { grid-column:auto; }
.settings-form textarea { min-height:78px; }
.settings-actions { padding-bottom:1px; }
.banner-panel { margin-top:18px; }
.banner-preview { width:120px; height:58px; object-fit:cover; border-radius:10px; background:#eee; }
.commission-form { padding:24px; display:flex; align-items:center; gap:24px; }
.commission-form > div:first-child { flex:1; }
.commission-form label { font-size:17px; font-weight:800; }
.commission-form p { margin:5px 0 0; color:var(--muted); }
.rate-input { width:150px; height:44px; padding:0 12px; display:flex; align-items:center; border:1px solid var(--line); border-radius:10px; background:#fff; }
.rate-input input { min-width:0; width:100%; border:0; outline:0; font-size:18px; font-weight:800; }
.rate-input span { color:var(--muted); }
.worker-panel { margin-top:18px; }